pro/2022_WEBSITE_kosmopolit
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

continue mise en page aside gauche

Browse Source
This commit is contained in:
hugogogo
2021-03-02 10:28:28 +01:00
parent 9a3b552f12
commit 34bed77eac
3 changed files with 29 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
pages/litterall.html
View File

@@ -23,9 +23,12 @@
</nav> </nav>
<div class="container_main"> <div class="container_main">
<aside class="page_content sticky"> <aside class="page_content sticky">
<h2>litterall</h2> <div class="table_box"> <!-- container use to adjust padding -->
<p>dernier numero</p> <h2>sommaire</h2>
<p>anciens numeros</p> <a href="./pages/litterall.html#anchor_litterall"><p>litterall</p></a>
<a href="#anchor_last"><p>dernier numero</p></a>
<a href="#anchor_previous"><p>anciens numeros</p></a>
</div>
</aside> </aside>
<!-- main <!-- main
ne doit pas contenir : sidebars <aside> - navbar <nav> - search form ne doit pas contenir : sidebars <aside> - navbar <nav> - search form
@@ -104,10 +107,6 @@
<h2>traduire, retraduire</h2> <h2>traduire, retraduire</h2>
<p>entretien entre frédéric Boyer, Christiane Kayser, et Jean-Philippe Rossignol</p> <p>entretien entre frédéric Boyer, Christiane Kayser, et Jean-Philippe Rossignol</p>
</a> </a>
<a>
<h2>traduire, retraduire</h2>
<p>entretien entre frédéric Boyer, Christiane Kayser, et Jean-Philippe Rossignol</p>
</a>
</div> </div>
</aside> </aside>
</div> </div>

15
styles/global.css
View File

@@ -136,12 +136,17 @@ body aside.page_content {
top: calc(var(--nav-height) + 1px); top: calc(var(--nav-height) + 1px);
height: calc(100vh - var(--nav-height)); height: calc(100vh - var(--nav-height));
} }
body aside.page_content > * {
margin: var(--gap-unit) 0px;
}
/* asides elements only have width if they have a child*/ /* asides elements only have width if they have a child*/
body aside.page_content *:first-child { body aside.page_content .table_box {
width: 200px; width: calc(var(--aside-left-width) - var(--aside-margin));
margin: var(--aside-margin) 0px var(--aside-margin) var(--aside-margin);
/*border-box so changing padding has no effect on total width*/
box-sizing: border-box;
padding: var(--gap-unit);
border-left: 1px solid lightgrey;
}
body aside.page_content .table_box > * {
margin-bottom: var(--gap-unit);
} }
/*MAIN*/ /*MAIN*/

24
styles/text.css
View File

@@ -53,9 +53,11 @@ p {
} }
h1 { h1 {
font-size: 3.5em; font-size: 3.5em;
line-height: 1.5em;
} }
h2 { h2 {
font-size: 2em; font-size: 2em;
line-height: 1.5em;
} }
small { small {
font-size: 0.8em; font-size: 0.8em;
@@ -80,15 +82,15 @@ p br, h1 br, h2 br {
margin: 0px; margin: 0px;
} }
/* /*
<b> - Bold text <b> - Bold text
<strong> - Important text <strong> - Important text
<i> - Italic text <i> - Italic text
<em> - Emphasized text <em> - Emphasized text
<mark> - Marked text <mark> - Marked text
<small> - Smaller text <small> - Smaller text
<del> - Deleted text <del> - Deleted text
<ins> - Inserted text <ins> - Inserted text
<sub> - Subscript text <sub> - Subscript text
<sup> - Superscript tex <sup> - Superscript tex
<code> - Computer code <code> - Computer code
*/ */