publik-base-theme/static/cap-atlantique/_custom.scss

258 lines
3.6 KiB
SCSS

//
// Typo
//
h1 {
color: $blue-dark;
font-size: 2.5em;
background-color: transparent;
}
h2 {
color: $blue;
font-size: 1.5em;
}
//
// header
//
div#header {
padding-top: $columns-gutter;
padding-bottom: $columns-gutter / 2;
@media ($max-mobile-viewport) {
padding-top: $columns-gutter / 2;
padding-bottom: $columns-gutter / 4;
}
}
#logo {
@media ($max-mobile-viewport) {
padding-left: 0;
}
&.has-logo a {
width: 260px;
height: 80px;
@media ($min-desktop-viewport) {
width: 400px;
height: 90px;
}
}
}
//
// NAV
// user-infos block is child of #nav-wrapper
//
#nav-wrapper {
position: relative;
display: flex;
margin-top: 0;
}
div#nav {
margin-left: 0;
flex-grow: 1;
@media ($min-desktop-viewport) {
margin-right: $columns-gutter;
}
@media (min-width: $width) {
margin-left: calc(50vw - #{$width / 2});
}
> ul {
margin: 0;
border-top: none;
@media (max-width: $mobile-limit) {
position: absolute;
z-index: 1;
width: 100vw;
}
}
}
#toplinks {
// reset
background: none;
box-shadow: none;
border: none;
border-radius: 0;
position: static;
padding: 0;
padding-left: 1rem;
border-left: 1px solid fade-out($orange, 0.25);
align-self: center;
> span::before {
content: "\f007";
font-family: fontawesome, sans-serif;
align-self: center;
color: $orange;
padding-left: .66em;
}
&, & > span {
display: flex;
align-items: center;
}
& > span {
flex-wrap: wrap;
}
a {
align-items: center;
padding: .33em .66em;
color: white;
font-weight: bold;
&.logout {
font-weight: normal;
}
}
}
//
// MAIN
//
#content {
margin-top: $columns-gutter;
}
.page-header {
margin: 0 0.7rem;
text-align: center;
}
//
// CELLS
//
.list-of-forms-cell {
.gru-content &.cell {
margin-bottom: $columns-gutter;
border: none;
h2:first-child {
background-color: transparent;
color: black;
text-align: center;
padding-left: 3rem;
padding-right: 3rem;
text-transform: uppercase;
&::after {
line-height: 0.6em;
font-size: 2em;
color: $orange;
right: 1rem;
}
}
&.has-asset-picture picture {
display: block;
text-align: center;
border-bottom: $cell-entry-border;
img {
display: inline-block;
}
}
}
}
.wcs-forms-of-category-cell {
@extend .list-of-forms-cell;
}
// Search cell
.search-cell {
h2 {
@extend %title;
color: $gray-dark;
text-align: left;
background-color: transparent;
padding-bottom: 0;
}
.combo-search--button {
@extend %button;
&, &:hover {
color: $blue;
background-color: white;
border-color: currentColor;
}
&::before {
content: "\f00c";
font-family: FontAwesome;
}
&-label {
display: none;
}
}
}
//
// WCS / FORMS
//
.orange-btn {
&, &:hover {
@extend %button;
background-color: $orange;
}
}
h1.form-content--title {
@extend h1;
padding: 0;
}
div#rub_service {
h2 {
@extend h1;
padding-left: 0.5rem;
padding-top: 0;
}
h3 {
@extend h2;
padding-left: 0;
}
.submit-button button {
@extend .orange-btn;
}
}
//
// NEUTRAL TPL
//
.page-template-neutral {
#top,
#nav > *:not(#back-portal) {
display: none;
}
h1, h2 {
color: $gray-dark;
}
div.gru-nav-wrapper,
#footer-wrapper {
background: $gray-dark !important;
}
div.gru-content button {
background-color: $gray-dark;
color: white;
&:hover {
background-color: black;
}
}
#toplinks {
> span::before,
.sep {
color: $gray-light;
}
}
// cell titles
div#rub_service div.category h3,
.gru-content div.a2-block h2,
.gru-content .block h2,
div.links-list h2,
.gru-content div.textcell h2:first-child,
.gru-content div.cell h2:first-child {
background-color: $gray-dark;
color: white;
}
}