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

btn home
All checks were successful
Deploy / Deploy to Production (push) Successful in 5m18s
Details

Browse source
This commit is contained in:
Julie Blanc 2026-02-26 15:46:21 +01:00
parent 4c34b3c398
commit e7da4d77b5
10 changed files with 197 additions and 57 deletions
Download patch file Download diff file Expand all files Collapse all files

125
assets/css/style.css
View file

@ -481,8 +481,7 @@ button:disabled {
padding-top: 4px;
}
.btn--bold,
.btn--bold-inline {
.btn--bold {
display: block;
height: calc(var(--h-block) * 1);
border: var(--border);
@ -492,24 +491,20 @@ button:disabled {
overflow: hidden;
white-space: nowrap;
}
.btn--bold .icon,
.btn--bold-inline .icon {
.btn--bold .icon {
display: flex;
width: 12px;
height: 12px;
}
.btn--bold .icon svg,
.btn--bold-inline .icon svg {
.btn--bold .icon svg {
width: 12px;
height: 12px;
}
.btn--bold svg,
.btn--bold-inline svg {
.btn--bold svg {
position: relative;
top: -1px;
}
.btn--bold a,
.btn--bold-inline a {
.btn--bold a {
display: flex;
align-items: center;
justify-content: center;
@ -519,8 +514,7 @@ button:disabled {
padding: 0 1.25ch;
padding-top: 4px;
}
.btn--bold.no-link,
.btn--bold-inline.no-link {
.btn--bold.no-link {
display: flex;
align-items: center;
justify-content: center;
@ -547,19 +541,105 @@ button:disabled {
fill: var(--color-bg);
}
.btn--bold-inline {
.btn--see-more {
margin-top: calc(var(--spacing) * 1);
margin-inline: auto;
display: block;
height: calc(var(--h-block) * 1);
border: 1px solid var(--color-txt-light);
border-radius: var(--radius-btn);
font-size: var(--fs-small);
line-height: 1;
overflow: hidden;
white-space: nowrap;
color: var(--color-txt-light);
background-color: var(--color-bg);
}
.btn--bold-inline:hover {
.btn--see-more .icon {
display: flex;
width: 12px;
height: 12px;
}
.btn--see-more .icon svg {
width: 12px;
height: 12px;
}
.btn--see-more .icon {
position: relative;
top: -2px;
}
.btn--see-more svg {
fill: var(--color-txt-light);
}
.btn--see-more a {
display: flex;
align-items: center;
justify-content: center;
gap: 1ch;
width: 100%;
height: 100%;
padding: 0 1.25ch;
padding-top: 4px;
font-size: var(--fs-small);
}
.btn--see-more:hover {
background-color: var(--grey-950);
color: var(--grey-100);
border-color: var(--grey-100);
}
.btn--bold-inline:hover a {
.btn--see-more:hover a {
background-color: var(--grey-950);
color: var(--grey-100);
}
.btn--bold-inline:hover svg {
.btn--see-more:hover svg {
fill: var(--grey-100);
}
.btn--home {
display: block;
height: calc(var(--h-block) * 1);
border: var(--border);
border-radius: var(--radius-btn);
font-size: var(--fs-small);
line-height: 1;
overflow: hidden;
white-space: nowrap;
background-color: var(--color-bg);
font-weight: 500;
}
.btn--home .icon {
display: flex;
width: 12px;
height: 12px;
}
.btn--home .icon svg {
width: 12px;
height: 12px;
}
.btn--home .icon {
position: relative;
top: -2px;
}
.btn--home a {
display: flex;
align-items: center;
justify-content: center;
gap: 1ch;
width: 100%;
height: 100%;
padding: 0 1.25ch;
padding-top: 4px;
}
.btn--home:hover {
background-color: var(--grey-950);
color: var(--grey-100);
border-color: var(--grey-100);
}
.btn--home:hover a {
background-color: var(--grey-950);
color: var(--grey-100);
}
.btn--home:hover svg {
fill: var(--grey-100);
}
@ -3064,19 +3144,6 @@ main .page__header ul.details li:hover {
line-height: 1.1;
margin-bottom: calc(var(--spacing) * 1);
}
.section--home .btn--bold-inline {
text-transform: none;
font-weight: 500;
font-size: var(--fs-small);
}
.section--home .btn--bold-inline .icon {
position: relative;
top: 2px;
}
.section--home .btn--bold-inline svg {
width: 13px;
height: 13px;
}
@media screen and (min-width: 1080px) {
.section--home .section--inner {
max-width: 1600px;