publik-base-theme/static/universite-toulon/_content.scss

337 lines
5.1 KiB
SCSS

a:hover {
color: $accent-color;
}
.carrousel {
&-item-content {
padding: $space-xlarge;
}
&-previous, &-next {
width: auto !important;
&:after {
font-size: 2rem;
}
}
&-nav {
label {
background-color: white;
}
}
}
%cell-links-list {
li > a {
font-weight: 700;
padding: $space-xsmall $space-xsmall;
}
li:not(.add-more-items) {
display: grid;
grid-auto-rows: auto auto;
grid-template-columns: auto 1fr;
align-items: center;
padding: $space-xsmall $space-small;
> a {
grid-row: 1 / 2;
grid-column: 2 / 3;
&:hover {
color: $accent-color;
&::before {
color: $primary-color;
}
}
}
> .description {
grid-row: 2 / 3;
grid-column: 1 / 3;
}
&::before {
grid-row: 1 / 2;
grid-column: 1 / 2;
content: "\f0da"; // caret-right
font-family: FontAwesome;
margin-right: $space-small;
}
}
.add-more-items--button {
color: $secondary-color;
font-size: 1.5rem;
&:hover {
color: $accent-color;
}
}
}
.gru-content div.cell,
.theme-page-bottom div.cell {
--cell-color: #{$primary-color};
color: var(--cell-color);
margin-bottom: 20px;
> div {
position: relative;
}
h2:first-child {
text-transform: uppercase;
border-bottom: 1px solid var(--cell-color);
color: var(--cell-color);
padding: $space-xsmall 0;
margin-bottom: $space-small;
border-radius: 0;
}
&.has-asset-picture {
position: relative;
h2:first-child {
padding: $space-xsmall 0 $space-xsmall calc(#{$cell-image-size} + #{$space-small});
}
picture {
position: absolute;
top: -5px;
padding: $space-xsmall 0;
}
img {
width: $cell-image-size;
height: $cell-image-size;
}
}
&.theme-secondary-cell {
--cell-color: #{$secondary-color};
}
&.theme-gray-cell {
--cell-color: black;
background: $gray-1;
padding: $space-medium $space-medium;
h2:first-child {
border-bottom-style: dotted;
}
}
&.theme-gradient-cell {
--cell-color: white;
background: linear-gradient(180deg, $primary-color 0%, $secondary-color 100%);
padding: $space-medium $space-medium;
h2:first-child {
border-bottom-style: dotted;
}
}
&.theme-profile-cell {
font-size: 1.2em;
div.links-list > ul > li {
border-bottom: none;
> a {
color: black;
font-weight: normal;
&:hover {
text-decoration: underline;
}
}
}
}
}
.theme-page-bottom {
margin: $space-large $space-small;
div.cell {
@extend %cell;
}
}
// Search cell
#sidebar div.searchcell {
.combo-search {
&--hint {
padding: 0;
margin-bottom: 1rem;
}
}
form {
padding: $space-small 0;
display: flex !important;
flex-direction: row;
flex-wrap: nowrap;
input[type="search"] {
margin-right: 0;
margin-bottom: 0;
border: none;
&:focus {
box-shadow: none;
}
}
button {
font-family: FontAwesome;
border-top-left-radius: 0;
border-bottom-left-radius: 0;
}
}
}
div.cell.tracking-code-input-cell {
h2 + div {
padding: 0;
}
form {
display: grid;
grid-auto-rows: auto;
grid-template-columns: 1fr auto;
margin-bottom: $space-small;
p {
margin: $space-xsmall 0;
grid-column: 1 / 3;
}
input {
margin-top: 0;
border: none;
&:focus {
box-shadow: none;
}
}
button {
font-family: FontAwesome;
border-top-left-radius: 0;
border-bottom-left-radius: 0;
margin-right: 0;
}
}
}
.theme-icon {
display: flex;
align-items: center;
&::before {
content: "" !important;
bacground-size: cover;
background-repeat: no-repeat;
width: 1.4em;
height: 1.4em;
display: inline-block;
margin-right: $space-small;
}
}
.theme-suggest {
&--content {
padding: $space-medium $space-small;
display: grid;
grid-template-columns: auto 1fr auto;
grid-auto-rows: auto;
align-items: center;
@media($max-mobile-viewport) {
justify-items: stretch;
align-items: center;
}
}
&--icon {
width: 32px;
height: 32px;
grid-area: 1 / 1 / 3 / 2;
margin-right: $space-large;
}
&--title {
margin: 0 !important;
grid-area: 1 / 2 / 2 / 3;
@media($max-mobile-viewport) {
grid-area: 1 / 2 / 3 / 4;
padding-right: 2em;
}
}
&--text {
margin: 0 !important;
grid-area: 2 / 2 / 3 / 3;
@media($max-mobile-viewport) {
display: none;
}
}
&--button {
@extend %button;
margin: 0;
background: white;
color: $primary-color;
grid-area: 1 / 3 / 3 / 4;
@media($max-mobile-viewport) {
height: 100%;
display: flex;
justify-content: end !important;
grid-area: 1 / 1 / 3 / 3;
background: transparent !important;
color: transparent !important;
}
&::after {
margin-left: 1rem;
font-family: FontAwesome;
font-size: $fz-5;
color: $primary-color;
content: "\f054";
@media($max-mobile-viewport) {
font-size: $fz-3;
color: white;
}
}
&:hover {
text-decoration: none;
&::after {
color: white;
}
}
}
}
@mixin icon($name) {
.theme-icon.#{$name}::before {
background-image: url("img/icons/" + $name + ".svg");
width: 1.2em;
height: 1.2em;
}
}
@include icon("address");
@include icon("external");
@include icon("link");
@include icon("phone");
@include icon("staff");
@include icon("student");