investigation-summary : clean blueprint
All checks were successful
Deploy / Deploy to Production (push) Successful in 13s

This commit is contained in:
isUnknown 2026-02-11 14:36:11 +01:00
parent 9cec8a69fe
commit f86d467d82
5 changed files with 65 additions and 79 deletions

View file

@ -1709,7 +1709,7 @@ button.sort[data-sort-type=up] .arrow {
}
}
.card--folder {
.card--package {
position: relative;
max-width: var(--max-w-cards);
border: var(--border-light);
@ -1719,35 +1719,35 @@ button.sort[data-sort-type=up] .arrow {
grid-template-columns: 2fr 3fr;
position: relative;
container-type: inline-size;
container-name: cardfolder;
container-name: cardpackage;
position: relative;
}
.card--folder > picture, .card--folder > figure {
.card--package > picture, .card--package > figure {
aspect-ratio: 16/9;
display: flex;
overflow: hidden;
}
.card--folder > picture img, .card--folder > figure img {
.card--package > picture img, .card--package > figure img {
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
transition: cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.5s;
}
.card--folder figure {
.card--package figure {
border-radius: var(--radius-small);
background-color: var(--color-accent);
}
.card--folder figure img {
.card--package figure img {
opacity: 0.8;
filter: grayscale(1);
}
.card--folder .content {
.card--package .content {
display: flex;
flex-direction: column;
font-size: var(--fs-small);
}
.card--folder .title {
.card--package .title {
font-weight: 500;
font-size: var(--fs-normal);
line-height: var(--leading-title);
@ -1757,25 +1757,25 @@ button.sort[data-sort-type=up] .arrow {
text-transform: uppercase;
padding-top: calc(var(--spacing) * 0.25);
}
.card--folder .title a {
.card--package .title a {
text-decoration: none;
}
@media screen and (max-width: 768px) {
.card--folder .title {
.card--package .title {
font-size: var(--fs-normal);
}
}
.card--folder .title .icon {
.card--package .title .icon {
padding-right: 1ch;
position: relative;
top: 1px;
}
.card--folder .title .icon svg {
.card--package .title .icon svg {
height: 15px;
width: 15px;
fill: var(--color-txt);
}
.card--folder .short {
.card--package .short {
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
@ -1783,78 +1783,78 @@ button.sort[data-sort-type=up] .arrow {
flex-grow: 1;
padding-right: calc(var(--padding-inner) * 2);
}
.card--folder ul {
.card--package ul {
display: flex;
list-style: none;
gap: 1ch;
color: var(--color-txt-light);
padding-top: calc(var(--spacing) * 0.5);
}
.card--folder ul li + li::before {
.card--package ul li + li::before {
content: "|";
padding-right: 1ch;
}
@media screen and (max-width: 768px) {
.card--folder ul {
.card--package ul {
font-size: var(--fs-small);
}
}
.card--folder .btn--go-to {
.card--package .btn--go-to {
position: absolute;
right: calc(var(--padding-inner) * 1);
bottom: var(--padding-inner);
}
.card--folder .btn--go-to {
.card--package .btn--go-to {
position: absolute;
right: var(--padding-inner);
bottom: calc(var(--padding-inner) - 3px);
}
.card--folder .btn--go-to svg {
.card--package .btn--go-to svg {
width: 15px;
height: 15px;
fill: var(--color-txt);
}
@media screen and (max-width: 768px) {
.card--folder .btn--go-to svg {
.card--package .btn--go-to svg {
width: 11px;
height: 11px;
}
}
@media screen and (max-width: 560px) {
.card--folder .btn--go-to {
.card--package .btn--go-to {
right: calc(var(--padding-inner) * 0.5);
bottom: calc(var(--padding-inner) * 0.25);
}
.card--folder .btn--go-to svg {
.card--package .btn--go-to svg {
width: 11px;
height: 11px;
}
}
.card--folder:hover .btn--go-to {
.card--package:hover .btn--go-to {
animation: wiggle-left 0.8s ease-in-out;
}
.card--folder:hover {
.card--package:hover {
background-color: var(--grey-950);
border-color: var(--color-txt);
}
[data-template=investigation-summary] .card--folder {
[data-template=investigation-summary] .card--package {
border: none;
padding-left: 0;
padding-right: 0;
border-bottom: var(--border-light);
}
[data-template=investigation-summary] .card--folder:first-of-type {
[data-template=investigation-summary] .card--package:first-of-type {
border-top: var(--border-light);
}
[data-template=investigation-summary] .card--folder.has-link {
[data-template=investigation-summary] .card--package.has-link {
border-bottom: var(--border-light);
position: relative;
}
[data-template=investigation-summary] .card--folder.has-link:first-of-type {
[data-template=investigation-summary] .card--package.has-link:first-of-type {
border-top: var(--border-light);
}
[data-template=investigation-summary] .card--folder.has-link::before {
[data-template=investigation-summary] .card--package.has-link::before {
content: "";
width: 100%;
border-top: 1px solid transparent;
@ -1862,38 +1862,38 @@ button.sort[data-sort-type=up] .arrow {
top: -1px;
left: 0;
}
[data-template=investigation-summary] .card--folder.has-link:hover {
[data-template=investigation-summary] .card--package.has-link:hover {
background-color: var(--grey-950);
border-color: var(--color-txt);
}
[data-template=investigation-summary] .card--folder.has-link:hover::before {
[data-template=investigation-summary] .card--package.has-link:hover::before {
border-color: var(--color-txt);
}
@media screen and (max-width: 560px) {
[data-template=investigation-summary] .card--folder figure {
[data-template=investigation-summary] .card--package figure {
margin-left: 0px;
}
}
[data-template=investigation-summary] .card--folder .title {
[data-template=investigation-summary] .card--package .title {
font-size: var(--fs-small);
}
@media screen and (max-width: 560px) {
.card--folder .content {
.card--package .content {
display: contents;
}
.card--folder figure {
.card--package figure {
grid-row: 1/3;
}
.card--folder .title {
.card--package .title {
font-size: var(--fs-small);
padding-top: calc(var(--spacing) * 0.25);
margin-bottom: 0;
}
.card--folder .short {
.card--package .short {
grid-column: span 2;
}
.card--folder ul {
.card--package ul {
grid-column: 2;
grid-row: 2;
padding-top: 0;
@ -2602,7 +2602,7 @@ main .page__header .description-medium {
}
[data-template=investigation-summary] main #section__dl,
[data-template=investigation-summary] main #section__impacts,
[data-template=investigation-summary] main #section__folder,
[data-template=investigation-summary] main #section__package,
[data-template=investigation-summary] main #section__related-articles {
font-size: var(--fs-small);
}
@ -2684,7 +2684,8 @@ main .page__header .description-medium {
flex-direction: column;
gap: calc(var(--spacing) * 0.25);
}
[data-template=investigation-summary] main .panel-left .btn--group button, [data-template=investigation-summary] main .panel-left .btn--group .dropdown {
[data-template=investigation-summary] main .panel-left .btn--group button,
[data-template=investigation-summary] main .panel-left .btn--group .dropdown {
flex-grow: 1;
width: 100%;
}
@ -3065,21 +3066,21 @@ main .page__header .description-medium {
flex-grow: 1;
}
.content-folder {
.content-package {
max-width: var(--max-w-cards);
margin: 0 auto;
display: grid;
grid-gap: calc(var(--padding-body) * 1.5);
position: relative;
}
.content-folder .container-cards {
.content-package .container-cards {
display: block;
align-self: start;
}
.content-folder #section__investigations article {
.content-package #section__investigations article {
margin-bottom: calc(var(--spacing) * 1);
}
.content-folder .container__title {
.content-package .container__title {
font-weight: normal;
font-size: var(--fs-small);
font-weight: 500;
@ -3087,63 +3088,63 @@ main .page__header .description-medium {
margin-bottom: calc(var(--spacing) * 0.75);
}
@media screen and (max-width: 1080px) {
.content-folder #section__investigations {
.content-package #section__investigations {
display: grid;
grid-template-columns: 1fr 1fr;
grid-gap: calc(var(--padding-inner) * 1.5) !important;
margin-bottom: calc(var(--spacing) * 3);
}
.content-folder #section__investigations article {
.content-package #section__investigations article {
margin-bottom: 0px;
}
.content-folder #section__investigations .container__title {
.content-package #section__investigations .container__title {
grid-column: span 2;
margin-bottom: 0px;
}
.content-folder section:target {
.content-package section:target {
padding-top: calc(var(--header-h) + var(--spacing));
}
}
@media screen and (min-width: 1080px) {
.content-folder {
.content-package {
grid-template-columns: 1fr 1fr;
}
.content-folder #nav-folder {
.content-package #nav-package {
display: none;
}
.content-folder #section__investigations {
.content-package #section__investigations {
display: block;
margin-bottom: 0px;
}
.content-folder #section__investigations article {
.content-package #section__investigations article {
margin-bottom: calc(var(--spacing) * 1);
}
}
@media screen and (max-width: 768px) {
.content-folder {
.content-package {
display: block;
}
.content-folder #section__investigations {
.content-package #section__investigations {
display: block;
}
.content-folder .container__title {
.content-package .container__title {
margin-bottom: calc(var(--spacing) * 0.5) !important;
}
}
#nav-folder {
#nav-package {
display: flex;
margin-top: calc(var(--spacing) * -1);
margin-bottom: calc(var(--spacing) * 2);
}
#nav-folder svg {
#nav-package svg {
width: 10px;
height: 10px;
transform: rotate(90deg);
}
@media screen and (min-width: 1080px) {
#nav-folder {
#nav-package {
display: none;
}
}/*# sourceMappingURL=style.css.map */

File diff suppressed because one or more lines are too long

View file

@ -88,16 +88,6 @@ tabs:
label: Métadonnées
icon: table
fields:
package:
label: Dossier
type: select
options: query
query:
fetch: site.find('dossiers').children
text: "{{ page.title }}"
value: "{{ page.slug }}"
empty: Aucun dossier
width: 1/4
incidentDate:
label: Date de l'incident
type: date
@ -116,23 +106,23 @@ tabs:
incidentConsequences:
label: Conséquence(s)
type: text
width: 1/3
width: 1/4
keywords:
label: Mots-clés
type: multiselect
options: query
query: page('database').keywords.split
width: 1/3
width: 1/4
methodologies:
label: Méthodologies
options: query
query: page('database').methodologies.split
type: multiselect
width: 1/3
width: 1/4
partners:
label: Partenaires
type: structure
width: 1/2
width: 1/4
fields:
name:
label: Nom
@ -145,10 +135,5 @@ tabs:
type: multiselect
options: query
query: page('database').team.split
width: 1/2
relatedInvestigations:
label: Enquêtes en lien
type: pages
multiple: true
query: site.find('enquetes').children
width: 1/4
seo: seo/page