More actions
add background image |
No edit summary |
||
Line 16: | Line 16: | ||
.citizen-page-container { | .citizen-page-container { | ||
position: relative; | |||
background-image: url("resources/assets/hero.webp"); | background-image: url("resources/assets/hero.webp"); | ||
background-repeat: no-repeat; | background-repeat: no-repeat; | ||
background-position: center; | background-position: center; | ||
background-attachment: fixed; | background-attachment: fixed; | ||
background-size: cover; | |||
z-index: 0; | |||
overflow: hidden; | |||
} | |||
.citizen-page-container::before { | |||
content: ""; | |||
position: absolute; | |||
top: 0; | |||
left: 0; | |||
width: 100%; | |||
height: 100%; | |||
background-color: rgba(0, 0, 0, 0.5); | |||
z-index: 1; | |||
pointer-events: none; | |||
} | |||
.citizen-page-container > * { | |||
position: relative; | |||
z-index: 2; | |||
} | } |
Revision as of 23:33, 12 May 2025
/* All CSS here will be loaded for users of the Citizen skin */
:root.skin-theme-clientpref-dark {
--color-surface-0: #050e1b;
--color-surface-1: #0d1014;
--color-base: #fff;
--color-base--emphasized: #808080;
--color-base--subtle: #162132;
}
:root.skin-theme-clientpref-os {
--color-surface-0: #050e1b;
--color-surface-1: #0d1014;
--color-base: #fff;
--color-base--emphasized: #808080;
--color-base--subtle: #162132;
}
.citizen-page-container {
position: relative;
background-image: url("resources/assets/hero.webp");
background-repeat: no-repeat;
background-position: center;
background-attachment: fixed;
background-size: cover;
z-index: 0;
overflow: hidden;
}
.citizen-page-container::before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.5);
z-index: 1;
pointer-events: none;
}
.citizen-page-container > * {
position: relative;
z-index: 2;
}