implémentation de la toc complete pour linear

This commit is contained in:
antonin gallon 2026-02-17 17:32:27 +01:00
parent 0de3b29e8b
commit d51fc592ed
10 changed files with 125 additions and 33 deletions

View file

@ -12,12 +12,37 @@
bottom: 0;
}
@media screen and (max-width: 640px) {
#main-footer ul {
bottom: 0;
display: flex;
justify-content: space-around;
border-top: 1px solid var(--color-primary);
background-color: var(--color-background);
}
#main-footer .open-nav-wrapper_toc{
margin-right: 50px;
}
}
@media screen and (min-width: 1100px) {
#main-footer .open-nav-wrapper_toc{
display: none !important;
}
}
#main-footer li:not(.open-nav-wrapper) {
display: none;
}
#main-footer li{
flex: 1;
}
#main-footer li > *{
width:calc(100% - var(--unit--vertical) * 2);
}
#main-footer button.open-nav {
transform: translateY(-1px);
transform: translateY(-2px);
}
[data-template="home"] .title-wrapper button.open-nav {
@ -26,20 +51,17 @@
@media screen and (max-width: 640px) {
#main-footer .open-nav {
box-sizing: border-box;
bottom: 0;
display: flex;
justify-content: center;
width: 100%;
outline: none;
border-top: 1px solid var(--color-primary);
font-size: var(--font-size-m);
background-color: var(--color-background);
padding: calc(var(--unit--vertical) / 2) var(--unit--horizontal);
margin-bottom: env(safe-area-inset-bottom);
color: var(--color-primary);
line-height: 1;
}
padding: calc(var(--unit--vertical) / 2) var(--unit--horizontal);
}
[data-is_toc="false"] #main-footer .open-nav {
justify-content: center;
}
}
@media screen and (min-width: 640px) {

View file

@ -82,6 +82,7 @@ article > h1 {
display: flex;
flex-direction: column;
gap: var(--unit--vertical);
}
[data-template="home"] .page-cover {

View file

@ -1,15 +1,47 @@
.toc{
display: flex;
flex-direction: column;
justify-content: center;
}
.page-cover .toc{
position: fixed;
display: block;
width: calc(var(--body-padding) - var(--unit--horizontal) * 2) ;
left: 0;
top: 15vw;
padding-inline: var(--unit--horizontal);
flex: 1;
}
@media (min-width: 1100px){
.page-cover .toc{
position: fixed;
width: calc(var(--body-padding) - var(--unit--horizontal) * 2) ;
left: 0;
top: 15vw;
padding-inline: var(--unit--horizontal);
padding-top: calc(var(--unit--vertical) / 2);
}
}
.page-cover .toc{
flex: 1;
}
.panel-toc .toc{
padding: var(--unit--vertical) var(--unit--horizontal);
}
.toc_label{
font-size: var(--font-size-m);
margin-bottom: calc(var(--unit--vertical) / 4); /*option 1*/
}
.toc ul{
display: flex;
flex-direction: column;
gap: calc(var(--unit--vertical) / 4); /*option 1*/
}
.toc li{
margin-left: 0;
}
/* text-indent: var(--unit--horizontal) hanging; */ /*option 2*/
/* list-style: square; */ /*option 3*/
}
[data-is_toc="false"] .if_toc,
[data-is_toc="false"] #main-footer li.if_toc{ /*obliger d'être si précis car si non pas la priorité*/
display: none !important;
}