texts : sort and style
All checks were successful
Deploy / Deploy to Production (push) Successful in 6s
All checks were successful
Deploy / Deploy to Production (push) Successful in 6s
This commit is contained in:
parent
680871d6e2
commit
80efbf3d5f
6 changed files with 148 additions and 112 deletions
|
|
@ -1,85 +1,88 @@
|
||||||
article #main-content {
|
[data-template="linear"],
|
||||||
scroll-margin-block-start: calc(var(--unit--vertical) * 6);
|
[data-template="grid"] {
|
||||||
padding-bottom: calc(var(--unit--vertical) * 2);
|
article #main-content {
|
||||||
margin-top: calc(2 * var(--unit--vertical));
|
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 {
|
#main-content .texts {
|
||||||
margin-top: calc(2 * var(--unit--vertical));
|
margin-top: calc(2 * var(--unit--vertical));
|
||||||
}
|
}
|
||||||
|
|
||||||
#main-content .see-more {
|
#main-content .see-more {
|
||||||
margin-top: calc(var(--unit--vertical) * 0.5);
|
margin-top: calc(var(--unit--vertical) * 0.5);
|
||||||
}
|
}
|
||||||
|
|
||||||
[data-template="year"] article > h1 {
|
[data-template="year"] article > h1 {
|
||||||
margin-bottom: 0;
|
margin-bottom: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
article #main-content #chapo::after {
|
article #main-content #chapo::after {
|
||||||
content: "";
|
content: "";
|
||||||
display: block;
|
display: block;
|
||||||
margin-top: calc(2 * var(--unit--vertical));
|
margin-top: calc(2 * var(--unit--vertical));
|
||||||
margin-bottom: calc(4 * var(--unit--vertical));
|
margin-bottom: calc(4 * var(--unit--vertical));
|
||||||
|
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 1px;
|
height: 1px;
|
||||||
background-color: var(--color-background);
|
background-color: var(--color-background);
|
||||||
}
|
}
|
||||||
|
|
||||||
article #main-content li:not(.text) {
|
article #main-content li:not(.text) {
|
||||||
list-style-type: inherit;
|
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 h3,
|
||||||
article h4 {
|
article h4 {
|
||||||
scroll-margin-top: calc(var(--unit--vertical) * 5);
|
scroll-margin-top: calc(var(--unit--vertical) * 1);
|
||||||
}
|
margin-bottom: calc(1 * var(--unit--vertical));
|
||||||
}
|
}
|
||||||
@media screen and (min-width: 640px) {
|
article h3 {
|
||||||
article #main-content {
|
margin-top: calc(3 * var(--unit--vertical));
|
||||||
max-width: auto;
|
}
|
||||||
|
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
13
assets/css/src/_year.scss
Normal 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);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -878,25 +878,26 @@ button.see-more {
|
||||||
left: 0;
|
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);
|
scroll-margin-block-start: calc(var(--unit--vertical) * 6);
|
||||||
padding-bottom: calc(var(--unit--vertical) * 2);
|
padding-bottom: calc(var(--unit--vertical) * 2);
|
||||||
margin-top: calc(2 * var(--unit--vertical));
|
margin-top: calc(2 * var(--unit--vertical));
|
||||||
}
|
}
|
||||||
|
[data-template=linear] #main-content .texts,
|
||||||
#main-content .texts {
|
[data-template=grid] #main-content .texts {
|
||||||
margin-top: calc(2 * var(--unit--vertical));
|
margin-top: calc(2 * var(--unit--vertical));
|
||||||
}
|
}
|
||||||
|
[data-template=linear] #main-content .see-more,
|
||||||
#main-content .see-more {
|
[data-template=grid] #main-content .see-more {
|
||||||
margin-top: calc(var(--unit--vertical) * 0.5);
|
margin-top: calc(var(--unit--vertical) * 0.5);
|
||||||
}
|
}
|
||||||
|
[data-template=linear] [data-template=year] article > h1,
|
||||||
[data-template=year] article > h1 {
|
[data-template=grid] [data-template=year] article > h1 {
|
||||||
margin-bottom: 0;
|
margin-bottom: 0;
|
||||||
}
|
}
|
||||||
|
[data-template=linear] article #main-content #chapo::after,
|
||||||
article #main-content #chapo::after {
|
[data-template=grid] article #main-content #chapo::after {
|
||||||
content: "";
|
content: "";
|
||||||
display: block;
|
display: block;
|
||||||
margin-top: calc(2 * var(--unit--vertical));
|
margin-top: calc(2 * var(--unit--vertical));
|
||||||
|
|
@ -905,65 +906,70 @@ article #main-content #chapo::after {
|
||||||
height: 1px;
|
height: 1px;
|
||||||
background-color: var(--color-background);
|
background-color: var(--color-background);
|
||||||
}
|
}
|
||||||
|
[data-template=linear] article #main-content li:not(.text),
|
||||||
article #main-content li:not(.text) {
|
[data-template=grid] article #main-content li:not(.text) {
|
||||||
list-style-type: inherit;
|
list-style-type: inherit;
|
||||||
}
|
}
|
||||||
|
[data-template=linear] article h3,
|
||||||
article h3,
|
[data-template=linear] article h4,
|
||||||
article h4 {
|
[data-template=grid] article h3,
|
||||||
|
[data-template=grid] article h4 {
|
||||||
scroll-margin-top: calc(var(--unit--vertical) * 1);
|
scroll-margin-top: calc(var(--unit--vertical) * 1);
|
||||||
margin-bottom: calc(1 * var(--unit--vertical));
|
margin-bottom: calc(1 * var(--unit--vertical));
|
||||||
}
|
}
|
||||||
|
[data-template=linear] article h3,
|
||||||
article h3 {
|
[data-template=grid] article h3 {
|
||||||
margin-top: calc(3 * var(--unit--vertical));
|
margin-top: calc(3 * var(--unit--vertical));
|
||||||
}
|
}
|
||||||
|
[data-template=linear] article h4,
|
||||||
article h4 {
|
[data-template=grid] article h4 {
|
||||||
margin-top: calc(2 * var(--unit--vertical));
|
margin-top: calc(2 * var(--unit--vertical));
|
||||||
}
|
}
|
||||||
|
[data-template=linear] article li,
|
||||||
article li,
|
[data-template=linear] article ol,
|
||||||
article ol {
|
[data-template=grid] article li,
|
||||||
|
[data-template=grid] article ol {
|
||||||
margin-left: var(--unit--horizontal);
|
margin-left: var(--unit--horizontal);
|
||||||
}
|
}
|
||||||
|
[data-template=linear] article figure,
|
||||||
article figure {
|
[data-template=grid] article figure {
|
||||||
margin: 4rem 0;
|
margin: 4rem 0;
|
||||||
}
|
}
|
||||||
|
[data-template=linear] article figure img,
|
||||||
article figure img {
|
[data-template=grid] article figure img {
|
||||||
max-width: 100%;
|
max-width: 100%;
|
||||||
}
|
}
|
||||||
|
[data-template=linear] blockquote,
|
||||||
blockquote {
|
[data-template=grid] blockquote {
|
||||||
border-left: 1px solid #fff;
|
border-left: 1px solid #fff;
|
||||||
margin: calc(var(--unit--vertical) * 2) 0;
|
margin: calc(var(--unit--vertical) * 2) 0;
|
||||||
padding-left: var(--unit--horizontal);
|
padding-left: var(--unit--horizontal);
|
||||||
}
|
}
|
||||||
|
[data-template=linear] blockquote footer,
|
||||||
blockquote footer {
|
[data-template=grid] blockquote footer {
|
||||||
margin-top: calc(var(--unit--vertical) / 2);
|
margin-top: calc(var(--unit--vertical) / 2);
|
||||||
font-size: var(--font-size-m);
|
font-size: var(--font-size-m);
|
||||||
}
|
}
|
||||||
|
[data-template=linear] blockquote.big,
|
||||||
blockquote.big {
|
[data-template=grid] blockquote.big {
|
||||||
font-weight: var(--font-weight-light);
|
font-weight: var(--font-weight-light);
|
||||||
font-size: var(--font-size-l);
|
font-size: var(--font-size-l);
|
||||||
}
|
}
|
||||||
|
|
||||||
@media screen and (max-width: 640px) {
|
@media screen and (max-width: 640px) {
|
||||||
article h3,
|
[data-template=linear] article h3,
|
||||||
article h4 {
|
[data-template=linear] article h4,
|
||||||
|
[data-template=grid] article h3,
|
||||||
|
[data-template=grid] article h4 {
|
||||||
scroll-margin-top: calc(var(--unit--vertical) * 5);
|
scroll-margin-top: calc(var(--unit--vertical) * 5);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@media screen and (min-width: 640px) {
|
@media screen and (min-width: 640px) {
|
||||||
article #main-content {
|
[data-template=linear] article #main-content,
|
||||||
|
[data-template=grid] article #main-content {
|
||||||
max-width: auto;
|
max-width: auto;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
/* ================= SPECIFIC TO VIRTUAL PAGES ================= */
|
/* ================= SPECIFIC TO VIRTUAL PAGES ================= */
|
||||||
[data-template=year] .edito {
|
[data-template=year] .edito {
|
||||||
margin-bottom: var(--unit--vertical);
|
margin-bottom: var(--unit--vertical);
|
||||||
|
|
@ -1285,6 +1291,15 @@ body.full-width #main-content {
|
||||||
margin-left: 0;
|
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 {
|
:root {
|
||||||
--color-primary--transparent: rgba(255, 255, 255, 0.86);
|
--color-primary--transparent: rgba(255, 255, 255, 0.86);
|
||||||
--color-secondary-rgb: 200, 200, 200;
|
--color-secondary-rgb: 200, 200, 200;
|
||||||
|
|
|
||||||
File diff suppressed because one or more lines are too long
|
|
@ -13,6 +13,7 @@
|
||||||
@import "src/toggle-light-mode";
|
@import "src/toggle-light-mode";
|
||||||
@import "src/print";
|
@import "src/print";
|
||||||
@import "src/toc";
|
@import "src/toc";
|
||||||
|
@import "src/year";
|
||||||
|
|
||||||
:root {
|
:root {
|
||||||
--color-primary--transparent: rgba(255, 255, 255, 0.86);
|
--color-primary--transparent: rgba(255, 255, 255, 0.86);
|
||||||
|
|
|
||||||
|
|
@ -1,8 +1,12 @@
|
||||||
<?php
|
<?php
|
||||||
class YearPage extends Page{
|
class YearPage extends Page{
|
||||||
public function allTexts(){
|
public function allTexts(){
|
||||||
$texts = $this->children()->listed();
|
$princeps = $this->children()->listed()->first();
|
||||||
|
|
||||||
|
$texts = $this->children()->listed()->without($princeps);
|
||||||
$linked = $this->linkedTexts()->toPages();
|
$linked = $this->linkedTexts()->toPages();
|
||||||
return $texts->merge($linked);
|
$allTexts = $texts->merge($linked);
|
||||||
|
|
||||||
|
return $allTexts->sort('published', 'desc')->prepend($princeps);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
Loading…
Add table
Add a link
Reference in a new issue