CCCHH/ccchh-website
CCCHH/ccchh-website
3
3
Fork 3
Code Issues 3 Pull requests 4 Activity Actions

Organize SCSS: split implicit general styling and explicit. used classes
All checks were successful
/ build (pull_request) Successful in 36s
Details

Browse source 
So differentiate between general stuff like variables, implicit general
document styling and classes, which need to be used explicitly.
This commit is contained in:
June 2024-01-29 03:59:55 +01:00
commit 9429366f49
Signed by: june
SSH key fingerprint: SHA256:o9EAq4Y9N9K0pBQeBTqhSDrND5E7oB+60ZNx0U1yPe0
3 changed files with 7 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

38
themes/ccchh/assets/scss/classes/container.scss Normal file
View file

@ -0,0 +1,38 @@
// Provide a container class, which limits the viewport depending on the screen
// width.
// Taken from PicoCSS, see here:
// https://github.com/picocss/pico/blob/v1.5.11/scss/layout/_container.scss
.container {
width: 100%;
margin-right: auto;
margin-left: auto;
padding-right: var(--spacing);
padding-left: var(--spacing);
@if map-get($breakpoints, "sm") {
@media (min-width: map-get($breakpoints, "sm")) {
max-width: map-get($viewports, "sm");
padding-right: 0;
padding-left: 0;
}
}
@if map-get($breakpoints, "md") {
@media (min-width: map-get($breakpoints, "md")) {
max-width: map-get($viewports, "md");
}
}
@if map-get($breakpoints, "lg") {
@media (min-width: map-get($breakpoints, "lg")) {
max-width: map-get($viewports, "lg");
}
}
@if map-get($breakpoints, "xl") {
@media (min-width: map-get($breakpoints, "xl")) {
max-width: map-get($viewports, "xl");
}
}
}