refactor: rename "folder" to "package" throughout codebase
- Rename CSS files: _card-folder.scss → card-package - Rename template files: _folder.scss → package - Update all CSS class names and selectors - Delete old folder blueprints and templates - Add new package blueprints with improved structure - Update investigation-summary template and blueprint - Add "Dossiers" menu item in panel configuration - Improve package blueprint with linkedContent field Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
This commit is contained in:
isUnknown
parent
e228c1757e
commit
15581752b8
11 changed files with 298 additions and 346 deletions
|
|
@ -1,4 +1,4 @@
|
|||
.card--folder{
|
||||
.card--package {
|
||||
position: relative;
|
||||
max-width: var(--max-w-cards);
|
||||
border: var(--border-light);
|
||||
|
|
@ -6,13 +6,10 @@
|
|||
@include grid-content();
|
||||
@include figure-16-9();
|
||||
|
||||
|
||||
container-type: inline-size;
|
||||
container-name: cardfolder;
|
||||
|
||||
container-name: cardpackage;
|
||||
|
||||
figure {
|
||||
|
||||
border-radius: var(--radius-small);
|
||||
background-color: var(--color-accent);
|
||||
|
||||
|
|
@ -20,20 +17,15 @@
|
|||
opacity: 0.8;
|
||||
filter: grayscale(1);
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
.content {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
font-size: var(--fs-small);
|
||||
|
||||
}
|
||||
|
||||
|
||||
.title {
|
||||
|
||||
font-weight: 500;
|
||||
font-size: var(--fs-normal);
|
||||
line-height: var(--leading-title);
|
||||
|
|
@ -43,7 +35,9 @@
|
|||
max-width: 42ch;
|
||||
text-transform: uppercase;
|
||||
padding-top: calc(var(--spacing) * 0.25);
|
||||
a{ text-decoration: none;}
|
||||
a {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
@media #{$small} {
|
||||
font-size: var(--fs-normal);
|
||||
|
|
@ -59,7 +53,6 @@
|
|||
fill: var(--color-txt);
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.short {
|
||||
|
|
@ -98,15 +91,9 @@
|
|||
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;
|
||||
|
|
@ -120,26 +107,18 @@
|
|||
}
|
||||
|
||||
figure {
|
||||
@media #{$x-small}{ margin-left: 0px; }
|
||||
|
||||
@media #{$x-small} {
|
||||
margin-left: 0px;
|
||||
}
|
||||
}
|
||||
|
||||
.title {
|
||||
font-size: var(--fs-small);
|
||||
}
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
@media #{$x-small} {
|
||||
|
||||
.card--folder{
|
||||
|
||||
.card--package {
|
||||
.content {
|
||||
display: contents;
|
||||
}
|
||||
|
|
@ -161,11 +140,6 @@
|
|||
grid-column: 2;
|
||||
grid-row: 2;
|
||||
padding-top: 0;
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
|
@ -14,9 +14,6 @@
|
|||
@import "components/sort";
|
||||
@import "components/btn-group-mobile";
|
||||
|
||||
|
||||
|
||||
|
||||
@import "components/figures";
|
||||
@import "components/summary-hero";
|
||||
@import "components/form-newsletter";
|
||||
|
|
@ -29,12 +26,11 @@
|
|||
@import "components/card-article-small";
|
||||
@import "components/card-impact";
|
||||
@import "components/card-impact-small";
|
||||
@import "components/card-folder";
|
||||
@import "components/card-package";
|
||||
@import "components/card-open-graph";
|
||||
@import "components/swiper";
|
||||
@import "components/slider-before-after";
|
||||
|
||||
|
||||
@import "partials/site-header";
|
||||
@import "partials/site-menu";
|
||||
@import "partials/site-footer";
|
||||
|
|
@ -45,5 +41,5 @@
|
|||
@import "template/home";
|
||||
@import "template/investigation-summary";
|
||||
@import "template/report";
|
||||
@import "template/folder";
|
||||
@import "template/package";
|
||||
@import "template/impacts";
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
.content-folder{
|
||||
.content-package {
|
||||
// max-width: 1300px;
|
||||
max-width: var(--max-w-cards);
|
||||
margin: 0 auto;
|
||||
|
|
@ -17,7 +17,6 @@
|
|||
margin-bottom: calc(var(--spacing) * 1);
|
||||
}
|
||||
|
||||
|
||||
.container__title {
|
||||
font-weight: normal;
|
||||
font-size: var(--fs-small);
|
||||
|
|
@ -25,19 +24,17 @@
|
|||
|
||||
text-transform: uppercase;
|
||||
margin-bottom: calc(var(--spacing) * 0.75);
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
@media #{$medium} {
|
||||
#section__investigations {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
grid-gap: calc(var(--padding-inner) * 1.5) !important;
|
||||
margin-bottom: calc(var(--spacing) * 3);
|
||||
article{ margin-bottom: 0px;}
|
||||
article {
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
.container__title {
|
||||
grid-column: span 2;
|
||||
margin-bottom: 0px;
|
||||
|
|
@ -45,13 +42,13 @@
|
|||
}
|
||||
section:target {
|
||||
padding-top: calc(var(--header-h) + var(--spacing));
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@media #{$medium-up} {
|
||||
#nav-folder{ display: none; }
|
||||
#nav-package {
|
||||
display: none;
|
||||
}
|
||||
grid-template-columns: 1fr 1fr;
|
||||
#section__investigations {
|
||||
display: block;
|
||||
|
|
@ -62,7 +59,6 @@
|
|||
}
|
||||
}
|
||||
|
||||
|
||||
@media #{$small} {
|
||||
display: block;
|
||||
#section__investigations {
|
||||
|
|
@ -72,11 +68,9 @@
|
|||
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);
|
||||
|
|
@ -88,5 +82,7 @@
|
|||
}
|
||||
}
|
||||
@media #{$medium-up} {
|
||||
#nav-folder{ display: none;}
|
||||
#nav-package {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
|
@ -1,15 +1,11 @@
|
|||
[data-template="investigation-summary"] main {
|
||||
position: relative;
|
||||
|
||||
|
||||
.page__header {
|
||||
margin-inline: auto;
|
||||
max-width: var(--max-w-content);
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
.panel-left {
|
||||
width: calc((100vw - var(--max-w-cards) - var(--padding-body) * 4) * 0.5);
|
||||
}
|
||||
|
|
@ -22,7 +18,6 @@
|
|||
}
|
||||
}
|
||||
|
||||
|
||||
@media screen and (max-width: 1220px) {
|
||||
margin-left: auto;
|
||||
margin-right: 0px;
|
||||
|
|
@ -32,7 +27,6 @@
|
|||
}
|
||||
}
|
||||
|
||||
|
||||
.section__article {
|
||||
margin-top: calc(var(--spacing) * 3);
|
||||
margin-bottom: calc(var(--spacing) * 3);
|
||||
|
|
@ -56,18 +50,13 @@
|
|||
}
|
||||
}
|
||||
|
||||
|
||||
#section__dl,
|
||||
#section__impacts,
|
||||
#section__folder,
|
||||
#section__package,
|
||||
#section__related-articles {
|
||||
font-size: var(--fs-small);
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
#section__dl {
|
||||
margin-top: calc(var(--spacing) * 1.5);
|
||||
border-bottom: var(--border-light);
|
||||
|
|
@ -95,10 +84,7 @@
|
|||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
#section__synthese {
|
||||
|
||||
max-width: var(--max-w-content);
|
||||
margin-inline: auto;
|
||||
|
||||
|
|
@ -116,9 +102,6 @@
|
|||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
.panel-left {
|
||||
//background-color: yellow;
|
||||
|
||||
|
|
@ -160,22 +143,13 @@
|
|||
flex-direction: column;
|
||||
gap: calc(var(--spacing) * 0.25);
|
||||
|
||||
button, .dropdown{
|
||||
button,
|
||||
.dropdown {
|
||||
flex-grow: 1;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
// SMALL ----------------------------------------------------------
|
||||
|
|
@ -194,8 +168,6 @@
|
|||
margin-bottom: calc(var(--spacing) * 2);
|
||||
}
|
||||
|
||||
|
||||
|
||||
.panel-left {
|
||||
display: none;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -88,7 +88,7 @@ tabs:
|
|||
label: Métadonnées
|
||||
icon: table
|
||||
fields:
|
||||
folder:
|
||||
package:
|
||||
label: Dossier
|
||||
type: select
|
||||
options: query
|
||||
|
|
|
|||
|
|
@ -5,18 +5,22 @@ tabs:
|
|||
label: Contenu
|
||||
icon: page
|
||||
fields:
|
||||
description:
|
||||
label: Description
|
||||
type: textarea
|
||||
size: medium
|
||||
buttons: false
|
||||
cover:
|
||||
label: Visuel de couverture
|
||||
type: files
|
||||
multiple: false
|
||||
layout: cards
|
||||
width: 1/3
|
||||
image:
|
||||
ratio: 12/7
|
||||
cover: true
|
||||
help: Image utilisée dans la liste des dossiers
|
||||
description:
|
||||
label: Description
|
||||
type: writer
|
||||
width: 2/3
|
||||
linkedContent:
|
||||
label: Contenu
|
||||
type: pages
|
||||
query: site.find('enquetes').children
|
||||
seo: seo/page
|
||||
|
|
@ -4,15 +4,16 @@ tabs:
|
|||
contentTab:
|
||||
label: Contenu
|
||||
sections:
|
||||
folders:
|
||||
packages:
|
||||
label: Dossiers
|
||||
type: pages
|
||||
text: "{{ page.title }}"
|
||||
info: "{{ page.description }}"
|
||||
info: "{{ page.linkedContent.toPages.count }} contenus"
|
||||
layout: cards
|
||||
size: huge
|
||||
search: true
|
||||
image:
|
||||
cover: true
|
||||
ratio: 12/7
|
||||
template: folder
|
||||
template: package
|
||||
seo: seo/page
|
||||
|
|
@ -22,6 +22,15 @@ return [
|
|||
],
|
||||
'-'
|
||||
,
|
||||
'dossiers' => [
|
||||
'label' => 'Dossiers',
|
||||
'icon' => 'folder',
|
||||
'link' => 'pages/dossiers',
|
||||
'current' => function (string $current): bool {
|
||||
$path = Kirby\Cms\App::instance()->path();
|
||||
return Str::contains($path, 'pages/dossiers');
|
||||
}
|
||||
],
|
||||
'database' => [
|
||||
'label' => 'Bases de données',
|
||||
'icon' => 'table',
|
||||
|
|
|
|||
|
|
@ -40,14 +40,14 @@ $report = $page->children()->filterBy('intendedTemplate', 'report')->first();
|
|||
<li><a href="#section__impacts">Impacts</a></li>
|
||||
<?php
|
||||
// Vérifier si un dossier existe pour cette investigation
|
||||
$folderSlug = $page->folder()->value();
|
||||
$hasFolder = false;
|
||||
if (!empty($folderSlug) && site()->find('dossiers')) {
|
||||
$hasFolder = site()->find('dossiers')->children()->filterBy('slug', $folderSlug)->first();
|
||||
$packageSlug = $page->package()->value();
|
||||
$hasPackage = false;
|
||||
if (!empty($packageSlug) && site()->find('dossiers')) {
|
||||
$hasPackage = site()->find('dossiers')->children()->filterBy('slug', $packageSlug)->first();
|
||||
}
|
||||
if ($hasFolder):
|
||||
if ($hasPackage):
|
||||
?>
|
||||
<li><a href="#section__folder">Dossier</a></li>
|
||||
<li><a href="#section__package">Dossier</a></li>
|
||||
<?php endif ?>
|
||||
<?php
|
||||
// Vérifier s'il y a des enquêtes en lien
|
||||
|
|
@ -305,34 +305,34 @@ if ($relatedInvestigations->isEmpty()) {
|
|||
|
||||
<?php
|
||||
// Récupérer le dossier associé à cette investigation
|
||||
$folderSlug = $page->folder()->value();
|
||||
$folder = null;
|
||||
if (!empty($folderSlug) && site()->find('dossiers')) {
|
||||
$folder = site()->find('dossiers')->children()->filterBy('slug', $folderSlug)->first();
|
||||
$packageSlug = $page->package()->value();
|
||||
$package = null;
|
||||
if (!empty($packageSlug) && site()->find('dossiers')) {
|
||||
$package = site()->find('dossiers')->children()->filterBy('slug', $packageSlug)->first();
|
||||
}
|
||||
|
||||
if ($folder):
|
||||
if ($package):
|
||||
?>
|
||||
<aside class="section__article" id="section__folder">
|
||||
<aside class="section__article" id="section__package">
|
||||
<h3 class="section__title">Dans le dossier</h3>
|
||||
|
||||
<article class="card--folder">
|
||||
<?php if ($cover = $folder->cover()->toFile()): ?>
|
||||
<article class="card--package">
|
||||
<?php if ($cover = $package->cover()->toFile()): ?>
|
||||
<figure>
|
||||
<img src="<?= $cover->url() ?>" alt="<?= $folder->title()->esc() ?>">
|
||||
<img src="<?= $cover->url() ?>" alt="<?= $package->title()->esc() ?>">
|
||||
</figure>
|
||||
<?php endif ?>
|
||||
<div class="content">
|
||||
<h4 class="title"><a href="<?= $folder->url() ?>"><span class="icon"><?= svg('assets/icons/folder.svg') ?></span><?= $folder->title()->esc() ?></a></h4>
|
||||
<h4 class="title"><a href="<?= $package->url() ?>"><span class="icon"><?= svg('assets/icons/package.svg') ?></span><?= $package->title()->esc() ?></a></h4>
|
||||
|
||||
<?php if ($folder->description()->isNotEmpty()): ?>
|
||||
<p class="short"><?= $folder->description()->excerpt(200) ?></p>
|
||||
<?php if ($package->description()->isNotEmpty()): ?>
|
||||
<p class="short"><?= $package->description()->excerpt(200) ?></p>
|
||||
<?php endif ?>
|
||||
|
||||
<?php
|
||||
// Compter les enquêtes associées à ce dossier
|
||||
$investigationsCount = site()->find('enquetes')->children()->listed()->filter(function($investigation) use ($folder) {
|
||||
return $investigation->folder()->value() === $folder->slug();
|
||||
$investigationsCount = site()->find('enquetes')->children()->listed()->filter(function($investigation) use ($package) {
|
||||
return $investigation->package()->value() === $package->slug();
|
||||
})->count();
|
||||
?>
|
||||
|
||||
|
|
@ -344,8 +344,8 @@ if ($folder):
|
|||
</ul>
|
||||
|
||||
</div>
|
||||
<button class="btn--go-to"><a href="<?= $folder->url() ?>" target="_blank"><?= svg('assets/icons/arrow-left.svg') ?></a></button>
|
||||
<a class="link-block" href="<?= $folder->url() ?>" target="_blank" aria-hidden="true"></a>
|
||||
<button class="btn--go-to"><a href="<?= $package->url() ?>" target="_blank"><?= svg('assets/icons/arrow-left.svg') ?></a></button>
|
||||
<a class="link-block" href="<?= $package->url() ?>" target="_blank" aria-hidden="true"></a>
|
||||
|
||||
</article>
|
||||
|
||||
|
|
|
|||
|
|
@ -16,17 +16,17 @@
|
|||
<?php
|
||||
// Récupérer les enquêtes associées à ce dossier
|
||||
$investigations = site()->find('enquetes')->children()->listed()->filter(function($investigation) use ($page) {
|
||||
return $investigation->folder()->value() === $page->slug();
|
||||
return $investigation->package()->value() === $page->slug();
|
||||
});
|
||||
?>
|
||||
|
||||
|
||||
<div class="btn--group" id="nav-folder">
|
||||
<div class="btn--group" id="nav-package">
|
||||
<button class="btn--small"><a href="#section__investigations">Enquêtes <span class="arrow"><?= svg('assets/icons/arrow-left.svg') ?></span></a></button>
|
||||
<button class="btn--small"><a href="#section__impacts">Impacts <span class="arrow"><?= svg('assets/icons/arrow-left.svg') ?></span></a></button>
|
||||
</div>
|
||||
|
||||
<div class="content-folder">
|
||||
<div class="content-package">
|
||||
|
||||
|
||||
<?php if ($investigations->isNotEmpty()): ?>
|
||||
|
|
@ -16,28 +16,28 @@
|
|||
|
||||
|
||||
|
||||
<?php foreach ($page->children()->listed() as $folder): ?>
|
||||
<article class="card--folder">
|
||||
<?php foreach ($page->children()->listed() as $package): ?>
|
||||
<article class="card--package">
|
||||
|
||||
<?php if ($cover = $folder->cover()->toFile()): ?>
|
||||
<?php if ($cover = $package->cover()->toFile()): ?>
|
||||
<figure>
|
||||
<img src="<?= $cover->url() ?>" alt="<?= $folder->title()->esc() ?>">
|
||||
<img src="<?= $cover->url() ?>" alt="<?= $package->title()->esc() ?>">
|
||||
</figure>
|
||||
<?php endif ?>
|
||||
|
||||
|
||||
|
||||
<div class="content">
|
||||
<h4 class="title"><a href="<?= $folder->url() ?>"><span class="icon"><?= svg('assets/icons/folder.svg') ?></span><?= $folder->title()->esc() ?></a></h4>
|
||||
<h4 class="title"><a href="<?= $package->url() ?>"><span class="icon"><?= svg('assets/icons/package.svg') ?></span><?= $package->title()->esc() ?></a></h4>
|
||||
|
||||
<?php if ($folder->description()->isNotEmpty()): ?>
|
||||
<p class="short"><?= $folder->description()->excerpt(200) ?></p>
|
||||
<?php if ($package->description()->isNotEmpty()): ?>
|
||||
<p class="short"><?= $package->description()->excerpt(200) ?></p>
|
||||
<?php endif ?>
|
||||
|
||||
<?php
|
||||
// Compter les enquêtes associées à ce dossier
|
||||
$investigationsCount = site()->find('enquetes')->children()->listed()->filter(function($investigation) use ($folder) {
|
||||
return $investigation->folder()->value() === $folder->slug();
|
||||
$investigationsCount = site()->find('enquetes')->children()->listed()->filter(function($investigation) use ($package) {
|
||||
return $investigation->package()->value() === $package->slug();
|
||||
})->count();
|
||||
?>
|
||||
|
||||
|
|
@ -50,7 +50,7 @@
|
|||
|
||||
</div>
|
||||
<button class="btn--go-to"><a href="#" target="_blank"><?= svg('assets/icons/arrow-left.svg') ?></a></button>
|
||||
<a class="link-block" href="<?= $folder->url() ?>"></a>
|
||||
<a class="link-block" href="<?= $package->url() ?>"></a>
|
||||
</article>
|
||||
<?php endforeach ?>
|
||||
|
||||
Loading…
Add table
Add a link
Reference in a new issue