corbz/PYRSS-Website
corbz/PYRSS-Website
1
0
Fork 0
Code Issues 21 Pull Requests Actions Releases 1 Wiki Activity

breakpoint widths

Browse Source
This commit is contained in:
Corban-Lee Jones 2024-09-07 21:15:10 +01:00
parent a06b9d0f9d
commit 5b346d037c
1 changed files with 47 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

47
apps/static/css/base.css
View File

@ -27,4 +27,51 @@
--bs-btn-disabled-color: #fff;
--bs-btn-disabled-bg: var(--discord-blurple);
--bs-btn-disabled-border-color: var(--discord-blurple);
}
/* Widths with breakpoints */
/* Small (sm) and down */
@media (max-width: 576px) {
.w-sm-25 { width: 25%; }
.w-sm-50 { width: 50%; }
.w-sm-75 { width: 75%; }
.w-sm-100 { width: 100%; }
.w-sm-auto { width: auto; }
}
/* Medium (md) and down */
@media (max-width: 768px) {
.w-md-25 { width: 25%; }
.w-md-50 { width: 50%; }
.w-md-75 { width: 75%; }
.w-md-100 { width: 100%; }
.w-md-auto { width: auto; }
}
/* Large (lg) and down */
@media (max-width: 992px) {
.w-lg-25 { width: 25%; }
.w-lg-50 { width: 50%; }
.w-lg-75 { width: 75%; }
.w-lg-100 { width: 100%; }
.w-lg-auto { width: auto; }
}
/* Extra large (xl) and down */
@media (max-width: 1200px) {
.w-xl-25 { width: 25%; }
.w-xl-50 { width: 50%; }
.w-xl-75 { width: 75%; }
.w-xl-100 { width: 100%; }
.w-xl-auto { width: auto; }
}
/* Extra extra large (xxl) and down */
@media (max-width: 1400px) {
.w-xxl-25 { width: 25%; }
.w-xxl-50 { width: 50%; }
.w-xxl-75 { width: 75%; }
.w-xxl-100 { width: 100%; }
.w-xxl-auto { width: auto; }
}