studio-variable/index-main
4
0
Fork 0
Code Issues 15 Pull requests Projects Releases Packages Wiki Activity Actions

bottomBar responsive
All checks were successful
Deploy / Deploy to Production (push) Successful in 12s
Details

Browse source
This commit is contained in:
Julie Blanc 2026-02-23 15:55:20 +01:00
parent 99ccc15ba9
commit f24b296ff7
15 changed files with 445 additions and 303 deletions
Download patch file Download diff file Expand all files Collapse all files

87
assets/css/components/_list-socials.scss
View file

@ -3,65 +3,82 @@
display: flex;
justify-content: space-between;
align-items: center;
max-width: 400px;
max-width: 350px;
a{
display: flex;
align-items: center;
text-decoration: none;
}
li{
--size-icon: 20px;
}
li[data-socials="youtube"]{
--size-icon: 26px;
}
.icon{
width: 20px;
height: 20px;
width: var(--size-icon);
height: var(--size-icon);
position: relative;
top: -2px;
}
svg{
display: flex;
align-items: center;
width: 20px;
height: 20px;
width: var(--size-icon);
height: var(--size-icon);
fill: var(--color-txt);
}
.text{ display: none; }
a:hover{
svg{
fill: var(--color-txt-light);
}
}
}
// with text
@media #{$small-up}{
.footer__socials .list-socials{
// @media #{$small-up}{
// .footer__socials .list-socials{
display: block;
// display: block;
li{
margin-bottom: calc(var(--spacing)*0.25);
break-inside: avoid;
font-size: var(--fs-small);
// li{
// margin-bottom: calc(var(--spacing)*0.25);
// break-inside: avoid;
// font-size: var(--fs-small);
}
// }
a{
gap: 1ch;
// a{
// gap: 1ch;
height: calc(var(--spacing)*1);
&::after{
content: '↗';
color: var(--grey-300);
}
// height: calc(var(--spacing)*1);
// &::after{
// content: '↗';
// color: var(--grey-300);
// }
&:hover{
color: var(--color-accent);
&::after{
color: var(--color-accent);
opacity: 0.5;
}
}
}
.text{
display: block;
line-height: 1;
}
}
}
// &:hover{
// color: var(--color-accent);
// &::after{
// color: var(--color-accent);
// opacity: 0.5;
// }
// }
// }
// .text{
// display: block;
// line-height: 1;
// }
// }
// }