studio-variable/hic-et-nunc
5
0
Fork 0
Code Issues 3 Pull requests Projects Releases Packages Wiki Activity Actions

Save before pull rebase
All checks were successful
Deploy / Deploy to Production (push) Successful in 2m1s
Details

Browse source
This commit is contained in:
Camilledenoray 2026-06-10 15:59:22 +02:00
parent c8066906f2
commit afb7c00960
5985 changed files with 522799 additions and 523 deletions
Download patch file Download diff file Expand all files Collapse all files

186
assets/css/src/_main.scss
View file

@ -105,7 +105,7 @@ ul {
z-index: 0;
}
#mobile-menu {
button#mobile-menu-toggle {
display: none;
}
@ -143,19 +143,12 @@ picture {
right: var(--body-margin);
bottom: var(--body-margin);
left: calc(var(--index-width) + var(--body-margin));
}
.project-slideshow-container .all-projects-closer {
inset: 0;
display: block;
position: absolute;
width: auto;
}
.mix-blend-bg.all-projects-closer {
width: var(--index-width);
cursor: var(--close-cursor);
display: none;
.closer {
inset: 0;
display: block;
position: absolute;
width: auto;
}
}
button.prev {
@ -197,67 +190,84 @@ button.next {
.toggle {
display: none;
p {
z-index: 1;
position: relative;
width: calc(3 / 6 * var(--index-width) - var(--body-margin));
display: none;
}
}
.fix:hover + .toggle {
display: block;
display: auto;
}
.fix .date {
text-align: right;
}
.toggle p {
z-index: 1;
position: relative;
width: calc(3 / 6 * var(--index-width) - var(--body-margin));
.closer {
cursor: var(--close-cursor);
}
.projects-index:has(.selected) {
.project:not(.selected) {
opacity: var(--low-opacity);
pointer-events: none;
.fix:hover + .toggle .project-slideshow-container {
display: none;
}
}
}
// PROJECT SLIDESHOW
.toggle .project-slideshow-container {
display: none;
}
.project-closer {
display: none;
}
.selected .project-closer {
.fix:hover + .toggle .project-slideshow-container {
display: block;
}
.unselected {
opacity: var(--low-opacity);
pointer-events: none;
.selected .toggle .project-slideshow-container {
display: block;
}
.unselected:hover {
// -------
.project:not(.selected):hover {
opacity: 1;
.toggle {
display: block;
}
}
// passe en oppacité réduite les éléments non survolés de la liste sur la page index
.projects-index:has(li:hover) li:not(:hover) {
// opacity: var(--low-opacity);
}
.unselected:hover .toggle {
.project > .toggle > .close-button {
display: none;
}
.selected {
opacity: 1;
}
.selected .toggle {
display: grid;
grid-template-columns:
calc(3 / 6 * var(--index-width) - var(--body-margin))
calc(3 / 6 * var(--index-width));
gap: var(--body-margin);
}
.selected .toggle p {
display: block;
}
.unselected .toggle {
display: none;
.toggle {
display: grid;
grid-template-columns:
calc(3 / 6 * var(--index-width) - var(--body-margin))
calc(3 / 6 * var(--index-width));
gap: var(--body-margin);
p {
display: block;
}
}
.slide-number {
display: block;
}
.project-description {
display: block;
}
.toggle > .close-button {
display: block;
}
}
.slide-number {
@ -267,10 +277,6 @@ button.next {
color: var(--mix-blend-color);
}
.selected .slide-number {
display: block;
}
.project-toggler.grid {
display: grid;
grid-template-columns:
@ -293,55 +299,33 @@ button.next {
display: none;
}
.selected .project-description {
display: block;
}
.project-toggler.closer {
cursor: var(--close-cursor);
display: none;
}
.selected .project-toggler.closer {
display: block;
}
.all-projects-closer {
position: fixed;
height: 100%;
width: var(--index-width);
cursor: var(--close-cursor);
display: none;
}
.selected + .all-projects-closer {
display: block;
}
.unselected + .all-projects-closer {
display: block;
}
/* INFOS */
[data-template="infos"] div {
padding-right: var(--body-margin);
}
[data-template="infos"] {
div {
padding-right: var(--body-margin);
}
main {
position: relative;
padding-top: calc(var(--line-height-S) + 0.35rem);
inset: 0;
display: flex;
flex-wrap: wrap;
padding-bottom: var(--font-size-XL);
overflow: auto;
padding-right: 0;
padding-left: 0;
}
[data-template="infos"] main {
position: absolute;
top: calc(var(--line-height-S) + 0.35rem);
display: flex;
flex-wrap: wrap;
bottom: auto;
padding-bottom: var(--font-size-XL);
}
#mobile-menu {
z-index: 2;
}
[data-template="infos"] .main-infos {
max-width: 100%;
width: 660px;
}
[data-template="infos"] .secondary-infos {
max-width: 100%;
.main-infos {
max-width: 100%;
width: 660px;
}
.secondary-infos {
max-width: 100%;
}
}