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

title et infos dans main

Browse Source
This commit is contained in:
hugogogo
2021-03-01 10:05:05 +01:00
parent 9ebfbaf40e
commit 5fe29fcc87
3 changed files with 59 additions and 38 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
pages/litterall.html
View File

@@ -12,13 +12,11 @@
</head> </head>
<body> <body>
<nav> <nav>
<p><a href=""><img src="./docs/kosmopolit_fond.png" alt="logo kosmopolit"></a></p>
<p><a href="">kosmopolit</a></p>
<p><a href="">litterall</a></p>
<p><a href="">l.e.a</a></p>
</nav> </nav>
<div class="page_title">
<h1 class="center" id="anchor_litterall">LITTER<i>all</i></h1>
</div>
<div class="page_path">
<p>liens</p>
</div>
<div class="container_main"> <div class="container_main">
<aside class="page_content"> <aside class="page_content">
<h2>litterall</h2> <h2>litterall</h2>
@@ -28,6 +26,13 @@
ne doit pas etre contenu par : <article> - <aside> - <footer> - <header> - <nav> ne doit pas etre contenu par : <article> - <aside> - <footer> - <header> - <nav>
--> -->
<main> <main>
<div class="page.infos">
<p><small><a>accueil</a> > <a>litterall</a></small></p>
<p><small>truc</small></p>
</div>
<div class="page_title">
<h1 id="anchor_litterall">LITTER<i>all</i></h1>
</div>
<p class="right"><i>“Il est difficile à des étrangers comme nous de pénétrer l’ultime secret des vers d’une autre langue. Ce n’est pas à nous d’en juger, nous n’aurons pas le dernier mot.”</i><br><small>Ossip Mandelstam, Entretiens sur Dante</small><br><small>traduction Louis Martinez</small></p> <p class="right"><i>“Il est difficile à des étrangers comme nous de pénétrer l’ultime secret des vers d’une autre langue. Ce n’est pas à nous d’en juger, nous n’aurons pas le dernier mot.”</i><br><small>Ossip Mandelstam, Entretiens sur Dante</small><br><small>traduction Louis Martinez</small></p>
<br><br> <br><br>
<p>Cette revue publie une fois par an un choix de textes germanophones, inédits en traduction française.</p> <p>Cette revue publie une fois par an un choix de textes germanophones, inédits en traduction française.</p>

78
styles/global.css
View File

@@ -4,13 +4,16 @@
--gap-unit: 10px; --gap-unit: 10px;
--max-screen: 1500px; --max-screen: 1500px;
--base-font-size: 10px; --base-font-size: 10px;
--nav-height: 40px;
} }
/*DEBUG*/ /*DEBUG*/
/* borders on mains elements of pages for debugging*/ /* borders on mains elements of pages for debugging*/
body > *, body > .container_main > * { body > *, body > .container_main > * {
/*
border: 1px solid red; border: 1px solid red;
*/
} }
/*---------------------------------------------*/ /*---------------------------------------------*/
@@ -19,32 +22,28 @@ body > *, body > .container_main > * {
--------------------- --------------------- --------------------- ---------------------
' NAV ' ' NAV ' ' NAV ' ' NAV '
'---------------------' '---------------------' '---------------------' '---------------------'
' TITLE ' ' TITLE ' ' ------------------- ' ' S ' INFOS ' A '
'---------------------' '---------------------' '' CONTAINER '' ' U ' ----- ' S '
' PATH > TO > PAGES ' ' PATH > TO > PAGES ' '' --- ------- --- '' ' M ' TITLE ' I '
'---------------------' '---------------------' ''' S '' INFOS '' A ''' ' M ' ----- ' D '
' ------------------- ' ' S ' C ' A ' ''' U '' ----- '' S ''' ' A ' M ' E '
'' CONTAINER '' ' U ' O ' S ' ''' M '' TITLE '' I ''' ' R ' A ' S '
'' --- ------- --- '' ' M ' N ' I ' ''' M '' ----- '' D ''' ' Y ' I ' '
''' S '' C '' A ''' ' M ' T ' D ' ''' A '' M '' E ''' ' ' N ' '
''' U '' O '' S ''' ' A ' E ' E ' ''' R '' A '' S ''' '---------------------'
''' M '' N '' I ''' ' R ' N ' S ' ''' Y '' I '' ''' ' FOOTER '
''' M '' T '' D ''' ' Y ' T ' ' ''' '' N '' ''' '---------------------'
''' A '' E '' E ''' '---------------------'
''' R '' N '' S ''' ' FOOTER '
''' Y '' T '' ''' '---------------------'
'''---''-------''---''' '''---''-------''---'''
''------------------''' ''-------------------''
'---------------------'
' FOOTER ' ' FOOTER '
'---------------------' '---------------------'
navbar -> nav navbar -> nav
title -> .page_title
path to pages -> .page_path
container -> .container_main container -> .container_main
summary -> aside.page_content summary -> aside.page_content
main -> main main -> main
infos -> .page.infos
title -> .page_title
asides -> aside.relative_content asides -> aside.relative_content
footer -> footer ->
*/ */
@@ -76,19 +75,19 @@ body {
/*NAVBAR*/ /*NAVBAR*/
body nav { body nav {
flex-direction: row; flex-direction: row;
height: 30px; height: var(--nav-height);
border-bottom: 1px solid lightgrey;
}
body nav *:first-child {
margin-left: var(--gap-unit);
padding-left: 0px;
} }
body nav > * { body nav > * {
margin: auto; margin: auto 20px;
padding: 0px 10px; padding: 0px 10px;
} }
body nav * {
/*TITLE*/ max-height: var(--nav-height);
body .page_title {
}
/*PATH-TO-PAGES*/
body .page_path {
} }
/*CONTAINER*/ /*CONTAINER*/
@@ -103,19 +102,36 @@ body main > * {
margin: var(--gap-unit) 0px; margin: var(--gap-unit) 0px;
} }
/*INFOS*/
body .page_path {
}
/*TITLE*/
body .page_title {
height: 100px;
border-bottom: 1px solid lightgrey;
}
body .page_title * {
margin: auto 0px;
}
/*ASIDES*/ /*ASIDES*/
body aside { body aside {
} }
/* asides elements only have width if they have a child*/
body aside *:first-child {
width: 200px;
}
/* aside left is for page table of content */ /* aside left is for page table of content */
body aside.page_content { body aside.page_content {
} }
/* asides elements only have width if they have a child*/
body aside.page_content *:first-child {
width: 150px;
}
/* aside right is for links to relatives content*/ /* aside right is for links to relatives content*/
body aside.relative_content { body aside.relative_content {
} }
/* asides elements only have width if they have a child*/
body aside.relative_content *:first-child {
width: 200px;
}
/*FOOTER*/ /*FOOTER*/
body footer { body footer {

2
styles/text.css
View File

@@ -52,7 +52,7 @@ p {
line-height: 1.5em; line-height: 1.5em;
} }
h1 { h1 {
font-size: 2.5em; font-size: 3.5em;
} }
h2 { h2 {
font-size: 2em; font-size: 2em;