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

essais mise en page aside gauche

Browse Source
This commit is contained in:
hugogogo
2021-03-01 22:52:28 +01:00
parent b5f9916007
commit 9a3b552f12
2 changed files with 15 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
styles/global.css
View File

@@ -8,6 +8,7 @@
--base-back-color: white;
--aside-left-width: 200px;
--aside-right-width: 200px;
--aside-margin: 30px;
}
@@ -149,6 +150,14 @@ body main {
body main > * {
margin: var(--gap-unit) 0px;
}
body main h1 {
padding: 70px 0px;
border-bottom: 1px solid lightgrey;
}
body main h2 {
padding: 10px 0px;
border-bottom: 1px solid lightgrey;
}
/*PATH*/
body main .page_path {
@@ -158,11 +167,6 @@ body main .page_path {
/*TITLE*/
body main .page_title {
position: relative;
height: 150px;
border-bottom: 1px solid lightgrey;
}
body main .page_title h1 {
margin: auto 0px;
}
body main .page_title .date {
position: absolute;
@@ -173,13 +177,13 @@ body main .page_title .date {
/*ASIDE RIGHT RELATIVES*/
/* aside right is for links to relatives content*/
body aside.relative_content {
margin: 10px 30px;
}
/* asides elements only have width if they have a child*/
body aside.relative_content *:first-child {
width: var(--aside-right-width);
}
body aside.relative_content .relative_box {
margin: var(--aside-margin);
padding: var(--gap-unit);
width: fit-content;
border: 1px solid lightgrey;
@@ -194,7 +198,7 @@ body aside.relative_content .relative_box > * {
/*FOOTER*/
body footer.page_footer {
margin: auto;
height: 100px;
border-top: 1px solid lightgrey;
}