This commit is contained in:
ArabCoders 2024-05-01 12:51:31 +03:00
parent 7aa58e4b86
commit 348f125c2b

View file

@ -120,12 +120,45 @@
padding: 18rem 6rem; padding: 18rem 6rem;
} }
.footer {
background-color: #fafafa;
padding: 3rem 1.5rem 6rem;
}
.progress-bar {
border-radius: 15px;
position: relative;
width: 100%;
height: 30px;
background-color: #F5F5F5;
}
.progress,
.progress-percentage {
border-radius: 15px;
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%;
}
.progress-percentage {
text-align: center;
z-index: 2;
line-height: 30px;
}
.progress {
z-index: 1;
background-color: #00d1b2;
}
@media (prefers-color-scheme: dark) { @media (prefers-color-scheme: dark) {
.footer { .footer {
background-color: #121212; background-color: #121212;
} }
#progress-bar,
.progress-bar { .progress-bar {
border-radius: 15px; border-radius: 15px;
position: relative; position: relative;
@ -134,8 +167,6 @@
background-color: #383636; background-color: #383636;
} }
#progress,
#progress-percentage,
.progress, .progress,
.progress-percentage { .progress-percentage {
border-radius: 15px; border-radius: 15px;
@ -146,57 +177,14 @@
width: 100%; width: 100%;
} }
#progress-percentage,
.progress-percentage { .progress-percentage {
text-align: center; text-align: center;
z-index: 2; z-index: 2;
line-height: 30px; line-height: 30px;
} }
#progress,
.progress { .progress {
z-index: 1; z-index: 1;
background-color: #087363; background-color: #087363;
} }
} }
@media screen and (min-width: 1024px) {
.footer {
background-color: #fafafa;
padding: 3rem 1.5rem 6rem;
}
#progress-bar,
.progress-bar {
border-radius: 15px;
position: relative;
width: 100%;
height: 30px;
background-color: #F5F5F5;
}
#progress,
#progress-percentage,
.progress,
.progress-percentage {
border-radius: 15px;
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%;
}
#progress-percentage,
.progress-percentage {
text-align: center;
z-index: 2;
line-height: 30px;
}
#progress,
.progress {
z-index: 1;
background-color: #00d1b2;
}
}