204 lines
3.1 KiB
SCSS
204 lines
3.1 KiB
SCSS
$title-backgrounds: (
|
|
"green1": $green1,
|
|
"green2": $green2,
|
|
"red": $red,
|
|
"blue1": $blue1,
|
|
"blue2": $blue2,
|
|
"yellow": $yellow,
|
|
"brown": $brown
|
|
);
|
|
|
|
%cell {
|
|
@extend %cell;
|
|
box-shadow: 0px 6px 56px -12px rgba(12, 29, 24, 0.25);
|
|
}
|
|
|
|
div#header-wrapper {
|
|
height: 3.5rem;
|
|
@media ($max-mobile-viewport) {
|
|
height: 5rem;
|
|
}
|
|
}
|
|
|
|
div#header {
|
|
padding-left: 0;
|
|
background: $primary-color;
|
|
@media ($max-mobile-viewport) {
|
|
height: 1.5rem;
|
|
}
|
|
}
|
|
|
|
.form-content--title {
|
|
font-size: 41px;
|
|
text-transform: uppercase;
|
|
background: transparent;
|
|
}
|
|
|
|
#toplinks {
|
|
@media ($min-desktop-viewport) {
|
|
top: 1rem;
|
|
}
|
|
@media ($max-mobile-viewport) {
|
|
right: 10px;
|
|
}
|
|
a {
|
|
color: white;
|
|
@media ($max-mobile-viewport) {
|
|
font-size: 80%;
|
|
}
|
|
}
|
|
}
|
|
|
|
div.gru-nav {
|
|
position: relative;
|
|
> ul {
|
|
margin-bottom: 0.5rem;
|
|
display: flex;
|
|
justify-content: flex-end;
|
|
> li a {
|
|
@media ($min-desktop-viewport) {
|
|
padding-bottom: 1.5rem;
|
|
}
|
|
}
|
|
}
|
|
.gru-nav-button {
|
|
left: calc(100% - #{$nav-menu-side} - 10px);
|
|
right: 0;
|
|
top: $nav-menu-side / 2 + 2px;
|
|
background: white;
|
|
border-radius: 50%;
|
|
@media ($max-mobile-viewport) {
|
|
+ ul {
|
|
right: 0;
|
|
left: auto;
|
|
width: auto;
|
|
transform: translateX(100%);
|
|
padding-left: 1.5rem;
|
|
padding-right: 1.5rem;
|
|
}
|
|
}
|
|
&.toggled {
|
|
.icon-bar {
|
|
background: $nav-button-color;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.pwa-navigation div > ul {
|
|
> li a {
|
|
text-transform: uppercase;
|
|
}
|
|
}
|
|
|
|
.pwa-navigation div > ul li {
|
|
a {
|
|
font-weight: bold;
|
|
}
|
|
&.selected a, &:hover a {
|
|
box-shadow: 1px 1px 10px 0px #ddd inset;
|
|
}
|
|
}
|
|
|
|
|
|
#logo.has-logo {
|
|
width: 140px;
|
|
height: 60px;
|
|
padding-left: 0;
|
|
@media ($max-mobile-viewport) {
|
|
padding-left: 1rem;
|
|
}
|
|
a {
|
|
position: absolute;
|
|
z-index: 1;
|
|
top: 10px;
|
|
@media ($min-desktop-viewport) {
|
|
height: 122px;
|
|
}
|
|
}
|
|
&::before {
|
|
content: '';
|
|
display: block;
|
|
height: 0;
|
|
border-bottom: 4rem solid white;
|
|
border-right: 4rem solid transparent;
|
|
width: 15rem;
|
|
@media ($max-mobile-viewport) {
|
|
margin-left: -1rem;
|
|
width: 10rem;
|
|
}
|
|
}
|
|
}
|
|
|
|
div.cell.has-asset-picture {
|
|
h2:first-child {
|
|
background: transparent;
|
|
}
|
|
}
|
|
|
|
body.has-picture {
|
|
.combo-placeholder--columns-top {
|
|
position: absolute;
|
|
top: -$nav-after-image-height;
|
|
left: 0;
|
|
height: $nav-after-image-height;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
div.cell {
|
|
padding: 0.5rem 6rem 0.5rem 1rem;
|
|
background-image: url('img/top-cell-bg.svg');
|
|
background-position: 95% 75%;
|
|
background-repeat: no-repeat;
|
|
}
|
|
}
|
|
@media ($max-mobile-viewport) {
|
|
.site-nav::after {
|
|
height: $nav-after-image-height / 2;
|
|
}
|
|
.combo-placeholder--columns-top {
|
|
top: 5rem;
|
|
left: auto;
|
|
height: $nav-after-image-height / 2;
|
|
}
|
|
}
|
|
}
|
|
|
|
#footer {
|
|
ul {
|
|
padding-left: 1rem;
|
|
li {
|
|
list-style-type: none;
|
|
padding: 0.25rem 0;
|
|
}
|
|
}
|
|
h5 {
|
|
border-bottom: 1px solid;
|
|
}
|
|
}
|
|
@each $name, $color in $title-backgrounds {
|
|
div.cell.#{$name}-title {
|
|
h2:first-child {
|
|
background: #{$color};
|
|
}
|
|
}
|
|
}
|
|
|
|
/* AUTHENTIC */
|
|
|
|
.anonymous-user {
|
|
div.block, div.a2-block {
|
|
box-shadow: none;
|
|
}
|
|
}
|
|
|
|
/* WCS */
|
|
|
|
div.comment-field a {
|
|
text-decoration: underline;
|
|
}
|
|
|
|
input[type="checkbox"], input[type="radio"] {
|
|
transform: scale(1.35);
|
|
}
|