entrouvert
/
publik-base-theme
15
1
Fork 1
Code Issues Pull Requests 10 Releases Wiki Activity

alpes-maritimes-2022: add styles for social steps component (#73604)

This commit is contained in:
Thomas Jund 2023-01-18 16:26:26 +01:00 committed by Gitea
parent 61159766ca
commit 0647dbc2d5
1 changed files with 67 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

67
static/alpes-maritimes-2022/_custom.scss
View File

@ -604,6 +604,73 @@ div.textcell {
}
}
// Social steps
.social-steps ol {
display: flex;
padding: 0 1em;
justify-content: center;
list-style-type: none;
li {
position: relative;
z-index: 0;
width: 15%;
min-width: 5em;
margin: 0 1em;
display: flex;
justify-content: flex-start;
align-items: center;
flex-direction: column;
border-bottom: 0;
color: $primary-color;
@media ($max-mobile-viewport) {
min-width: 3em;
}
.marker {
@extend .h3;
display: flex;
justify-content: center;
align-items: center;
border: 1px solid $primary-color;
border-radius: 50%;
width: 2em;
height: 2em;
}
.label {
margin-top: .5em;
display: block;
width: 100%;
text-align: center;
font-size: $fz-small;
@media ($max-mobile-viewport) {
display: none;
}
}
&.current {
.marker {
background: $primary-color;
color: #fff;
}
.label {
font-weight: bold;
}
}
&:not(:last-child) {
&::after {
content: '';
border: 1px solid $gray;
width: calc(100% - 2em);
position: absolute;
z-index: -1;
top: 1.2em;
right: 0;
display: block;
transform: translateX(calc(50% + 1em));
}
}
}
}
//
// Footer
//