studio-variable/botascopia-webiste-static
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

back species

Browse source
This commit is contained in:
Julie Blanc 2026-02-16 15:34:30 +01:00
parent 9a6ff0b24e
commit 25cdb3bd0b
13 changed files with 158 additions and 35 deletions
Download patch file Download diff file Expand all files Collapse all files

24
assets/css/components/_buttons.scss
View file

@ -102,5 +102,29 @@ label.btn-action{
left: 2.5ch;
}
}
}
.link-back{
a{
text-decoration: none;
color: var(--color-txt);
font-size: var(--fs-small);
&::before{
content: "←";
font-family: var(--font-title);
font-size: 0.9em;
position: relative;
left: -1.5ch;
transition: left .4s ease-in-out;
text-decoration: 1px underline transparent;
}
}
&:hover{
opacity: 0.8;
a::before{
left: -2.5ch;
}
}
}

19
assets/css/components/_slideshow.scss
View file

@ -42,11 +42,26 @@ $slideshow-items: 3;
}
}
.schema-collectifs{
background-color: white;
img{
object-fit: contain;
}
}
figcaption{
width: calc(100% - var(--arrow-space)*2);
font-size: var(--fs-small);
height: calc(var(--unit)*2);
font-size: var(--fs-normal);
font-weight: 500;
padding-top: calc(var(--padding-inner)*0.5);
text-align: left;
width: 100%;
margin-top: calc(var(--spacing)*0.5);
&::before{
content: '→';
font-family: var(--font-title);
padding-right: 2ch;
}
}
}

9
assets/css/pages/_home.scss
View file

@ -55,11 +55,14 @@
.species-list{
margin-bottom: calc(var(--spacing)*3);
.taxon:hover{
border-color: red!important;
outline: 3px solid var(--color-txt);
}
// .taxon:hover{
// border-color: red!important;
// }
}
.species-list .title{

27
assets/css/pages/_species-single.scss
View file

@ -8,30 +8,45 @@
.page-header__inner{
display: grid;
grid-template-columns: var(--w-fig) 1fr;
grid-gap: var(--padding-body);
grid-column-gap: var(--padding-body);
}
.link-back{
grid-column: 1;
grid-row: 1;
text-align: left;
position: relative;
top: calc(var(--spacing)*-1);
a{
color: var(--color-green)!important;
}
padding-left: 1.5ch;
}
figure, picture{
border-radius: var(--radius-img);
grid-column: 1;
grid-row: 1/3;
grid-row: 2/4;
@include fig-ratio(1/1);
}
.group-title{
grid-column: 2;
grid-row: 1;
grid-row: 2;
align-self: start;
padding-top: calc(var(--spacing)*0.5);
padding-bottom: calc(var(--spacing)*1);
}
.saviez-vous{
grid-column: 2;
grid-row: 2;
grid-row: 3;
align-self: start;
}
@ -56,12 +71,14 @@
}
.btn--group{
grid-column: span 2;
display: flex;
justify-content: right;
gap: var(--padding-inner);
position: relative;
top: calc(var(--spacing)*-1);
}

65
assets/style.css
View file

@ -499,6 +499,28 @@ label.btn-action .text {
left: 2.5ch;
}
.link-back a {
text-decoration: none;
color: var(--color-txt);
font-size: var(--fs-small);
}
.link-back a::before {
content: "←";
font-family: var(--font-title);
font-size: 0.9em;
position: relative;
left: -1.5ch;
transition: left 0.4s ease-in-out;
-webkit-text-decoration: 1px underline transparent;
text-decoration: 1px underline transparent;
}
.link-back:hover {
opacity: 0.8;
}
.link-back:hover a::before {
left: -2.5ch;
}
.slideshow {
height: 100%;
width: 100%;
@ -539,11 +561,26 @@ label.btn-action .text {
-o-object-fit: cover;
object-fit: cover;
}
.slideshow-item .schema-collectifs {
background-color: white;
}
.slideshow-item .schema-collectifs img {
-o-object-fit: contain;
object-fit: contain;
}
.slideshow-item figcaption {
width: calc(100% - var(--arrow-space) * 2);
font-size: var(--fs-small);
height: calc(var(--unit) * 2);
font-size: var(--fs-normal);
font-weight: 500;
padding-top: calc(var(--padding-inner) * 0.5);
text-align: left;
width: 100%;
margin-top: calc(var(--spacing) * 0.5);
}
.slideshow-item figcaption::before {
content: "→";
font-family: var(--font-title);
padding-right: 2ch;
}
/* Display slides (input checked)
@ -1848,7 +1885,7 @@ input#view-grid:checked ~ .view-toggle label[for=view-grid] svg {
margin-bottom: calc(var(--spacing) * 3);
}
#main_home .species-list .taxon:hover {
border-color: red !important;
outline: 3px solid var(--color-txt);
}
#main_home .species-list .title {
grid-column: 1/end;
@ -2099,12 +2136,25 @@ input#view-grid:checked ~ .view-toggle label[for=view-grid] svg {
[data-page=species-single] .page-header .page-header__inner {
display: grid;
grid-template-columns: var(--w-fig) 1fr;
grid-gap: var(--padding-body);
grid-column-gap: var(--padding-body);
}
[data-page=species-single] .page-header .link-back {
grid-column: 1;
grid-row: 1;
text-align: left;
position: relative;
top: calc(var(--spacing) * -1);
}
[data-page=species-single] .page-header .link-back a {
color: var(--color-green) !important;
}
[data-page=species-single] .page-header .link-back {
padding-left: 1.5ch;
}
[data-page=species-single] .page-header figure, [data-page=species-single] .page-header picture {
border-radius: var(--radius-img);
grid-column: 1;
grid-row: 1/3;
grid-row: 2/4;
width: 100%;
overflow: hidden;
}
@ -2117,13 +2167,14 @@ input#view-grid:checked ~ .view-toggle label[for=view-grid] svg {
}
[data-page=species-single] .page-header .group-title {
grid-column: 2;
grid-row: 1;
grid-row: 2;
align-self: start;
padding-top: calc(var(--spacing) * 0.5);
padding-bottom: calc(var(--spacing) * 1);
}
[data-page=species-single] .page-header .saviez-vous {
grid-column: 2;
grid-row: 2;
grid-row: 3;
align-self: start;
}
[data-page=species-single] .page-header .page-title {

2
assets/style.css.map
View file

File diff suppressed because one or more lines are too long