texts : sort and style
All checks were successful
Deploy / Deploy to Production (push) Successful in 6s

This commit is contained in:
isUnknown 2026-03-28 16:53:17 +01:00
parent 680871d6e2
commit 80efbf3d5f
6 changed files with 148 additions and 112 deletions

View file

@ -1,85 +1,88 @@
article #main-content {
scroll-margin-block-start: calc(var(--unit--vertical) * 6);
padding-bottom: calc(var(--unit--vertical) * 2);
margin-top: calc(2 * var(--unit--vertical));
}
[data-template="linear"],
[data-template="grid"] {
article #main-content {
scroll-margin-block-start: calc(var(--unit--vertical) * 6);
padding-bottom: calc(var(--unit--vertical) * 2);
margin-top: calc(2 * var(--unit--vertical));
}
#main-content .texts {
margin-top: calc(2 * var(--unit--vertical));
}
#main-content .texts {
margin-top: calc(2 * var(--unit--vertical));
}
#main-content .see-more {
margin-top: calc(var(--unit--vertical) * 0.5);
}
#main-content .see-more {
margin-top: calc(var(--unit--vertical) * 0.5);
}
[data-template="year"] article > h1 {
margin-bottom: 0;
}
[data-template="year"] article > h1 {
margin-bottom: 0;
}
article #main-content #chapo::after {
content: "";
display: block;
margin-top: calc(2 * var(--unit--vertical));
margin-bottom: calc(4 * var(--unit--vertical));
article #main-content #chapo::after {
content: "";
display: block;
margin-top: calc(2 * var(--unit--vertical));
margin-bottom: calc(4 * var(--unit--vertical));
width: 100%;
height: 1px;
background-color: var(--color-background);
}
width: 100%;
height: 1px;
background-color: var(--color-background);
}
article #main-content li:not(.text) {
list-style-type: inherit;
}
article #main-content li:not(.text) {
list-style-type: inherit;
}
article h3,
article h4 {
scroll-margin-top: calc(var(--unit--vertical) * 1);
margin-bottom: calc(1 * var(--unit--vertical));
}
article h3 {
margin-top: calc(3 * var(--unit--vertical));
}
article h4 {
margin-top: calc(2 * var(--unit--vertical));
}
article li,
article ol {
margin-left: var(--unit--horizontal);
}
article figure {
margin: 4rem 0;
}
article figure img {
max-width: 100%;
}
// Quotes
//
blockquote {
border-left: 1px solid #fff;
margin: calc(var(--unit--vertical) * 2) 0;
padding-left: var(--unit--horizontal);
}
blockquote footer {
margin-top: calc(var(--unit--vertical) / 2);
font-size: var(--font-size-m);
}
blockquote.big {
font-weight: var(--font-weight-light);
font-size: var(--font-size-l);
}
@media screen and (max-width: 640px) {
article h3,
article h4 {
scroll-margin-top: calc(var(--unit--vertical) * 5);
}
}
@media screen and (min-width: 640px) {
article #main-content {
max-width: auto;
scroll-margin-top: calc(var(--unit--vertical) * 1);
margin-bottom: calc(1 * var(--unit--vertical));
}
article h3 {
margin-top: calc(3 * var(--unit--vertical));
}
article h4 {
margin-top: calc(2 * var(--unit--vertical));
}
article li,
article ol {
margin-left: var(--unit--horizontal);
}
article figure {
margin: 4rem 0;
}
article figure img {
max-width: 100%;
}
// Quotes
//
blockquote {
border-left: 1px solid #fff;
margin: calc(var(--unit--vertical) * 2) 0;
padding-left: var(--unit--horizontal);
}
blockquote footer {
margin-top: calc(var(--unit--vertical) / 2);
font-size: var(--font-size-m);
}
blockquote.big {
font-weight: var(--font-weight-light);
font-size: var(--font-size-l);
}
@media screen and (max-width: 640px) {
article h3,
article h4 {
scroll-margin-top: calc(var(--unit--vertical) * 5);
}
}
@media screen and (min-width: 640px) {
article #main-content {
max-width: auto;
}
}
}

13
assets/css/src/_year.scss Normal file
View file

@ -0,0 +1,13 @@
[data-template="year"] {
#main-content {
ul.texts {
margin-top: calc(var(--unit--vertical) * 2);
> li:first-child {
padding-left: var(--unit--horizontal);
border-left: 1px solid #fff;
margin-bottom: calc(var(--unit--vertical) * 2);
}
}
}
}

View file

@ -878,25 +878,26 @@ button.see-more {
left: 0;
}
}
article #main-content {
[data-template=linear] article #main-content,
[data-template=grid] article #main-content {
scroll-margin-block-start: calc(var(--unit--vertical) * 6);
padding-bottom: calc(var(--unit--vertical) * 2);
margin-top: calc(2 * var(--unit--vertical));
}
#main-content .texts {
[data-template=linear] #main-content .texts,
[data-template=grid] #main-content .texts {
margin-top: calc(2 * var(--unit--vertical));
}
#main-content .see-more {
[data-template=linear] #main-content .see-more,
[data-template=grid] #main-content .see-more {
margin-top: calc(var(--unit--vertical) * 0.5);
}
[data-template=year] article > h1 {
[data-template=linear] [data-template=year] article > h1,
[data-template=grid] [data-template=year] article > h1 {
margin-bottom: 0;
}
article #main-content #chapo::after {
[data-template=linear] article #main-content #chapo::after,
[data-template=grid] article #main-content #chapo::after {
content: "";
display: block;
margin-top: calc(2 * var(--unit--vertical));
@ -905,65 +906,70 @@ article #main-content #chapo::after {
height: 1px;
background-color: var(--color-background);
}
article #main-content li:not(.text) {
[data-template=linear] article #main-content li:not(.text),
[data-template=grid] article #main-content li:not(.text) {
list-style-type: inherit;
}
article h3,
article h4 {
[data-template=linear] article h3,
[data-template=linear] article h4,
[data-template=grid] article h3,
[data-template=grid] article h4 {
scroll-margin-top: calc(var(--unit--vertical) * 1);
margin-bottom: calc(1 * var(--unit--vertical));
}
article h3 {
[data-template=linear] article h3,
[data-template=grid] article h3 {
margin-top: calc(3 * var(--unit--vertical));
}
article h4 {
[data-template=linear] article h4,
[data-template=grid] article h4 {
margin-top: calc(2 * var(--unit--vertical));
}
article li,
article ol {
[data-template=linear] article li,
[data-template=linear] article ol,
[data-template=grid] article li,
[data-template=grid] article ol {
margin-left: var(--unit--horizontal);
}
article figure {
[data-template=linear] article figure,
[data-template=grid] article figure {
margin: 4rem 0;
}
article figure img {
[data-template=linear] article figure img,
[data-template=grid] article figure img {
max-width: 100%;
}
blockquote {
[data-template=linear] blockquote,
[data-template=grid] blockquote {
border-left: 1px solid #fff;
margin: calc(var(--unit--vertical) * 2) 0;
padding-left: var(--unit--horizontal);
}
blockquote footer {
[data-template=linear] blockquote footer,
[data-template=grid] blockquote footer {
margin-top: calc(var(--unit--vertical) / 2);
font-size: var(--font-size-m);
}
blockquote.big {
[data-template=linear] blockquote.big,
[data-template=grid] blockquote.big {
font-weight: var(--font-weight-light);
font-size: var(--font-size-l);
}
@media screen and (max-width: 640px) {
article h3,
article h4 {
[data-template=linear] article h3,
[data-template=linear] article h4,
[data-template=grid] article h3,
[data-template=grid] article h4 {
scroll-margin-top: calc(var(--unit--vertical) * 5);
}
}
@media screen and (min-width: 640px) {
article #main-content {
[data-template=linear] article #main-content,
[data-template=grid] article #main-content {
max-width: auto;
}
}
/* ================= SPECIFIC TO VIRTUAL PAGES ================= */
[data-template=year] .edito {
margin-bottom: var(--unit--vertical);
@ -1285,6 +1291,15 @@ body.full-width #main-content {
margin-left: 0;
}
[data-template=year] #main-content ul.texts {
margin-top: calc(var(--unit--vertical) * 2);
}
[data-template=year] #main-content ul.texts > li:first-child {
padding-left: var(--unit--horizontal);
border-left: 1px solid #fff;
margin-bottom: calc(var(--unit--vertical) * 2);
}
:root {
--color-primary--transparent: rgba(255, 255, 255, 0.86);
--color-secondary-rgb: 200, 200, 200;

File diff suppressed because one or more lines are too long

View file

@ -13,6 +13,7 @@
@import "src/toggle-light-mode";
@import "src/print";
@import "src/toc";
@import "src/year";
:root {
--color-primary--transparent: rgba(255, 255, 255, 0.86);

View file

@ -1,8 +1,12 @@
<?php
class YearPage extends Page{
public function allTexts(){
$texts = $this->children()->listed();
$princeps = $this->children()->listed()->first();
$texts = $this->children()->listed()->without($princeps);
$linked = $this->linkedTexts()->toPages();
return $texts->merge($linked);
$allTexts = $texts->merge($linked);
return $allTexts->sort('published', 'desc')->prepend($princeps);
}
}