cominfra
/
www2
8
0
Fork 0
Code Issues Pull Requests Actions Activity

template/styles.css: travail sur header

This commit is contained in:
Adrien Bourmault 2024-02-29 10:50:08 +01:00
parent d1482c9fcb
commit ded6d4c431
Signed by: neox
GPG Key ID: 2974E1D5F25DFCC8
1 changed files with 48 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

54
template/styles.css
View File

@ -228,14 +228,20 @@ code.bcode_code {}
* Header (Wensite Logo, Description) * Header (Wensite Logo, Description)
*/ */
a#site_link {} a#site_link {
display: flex;
}
header#header { header#header {
background-attachment: fixed; background-attachment: fixed;
background-image: url(../template/electronic.jpg); background-image: url(../template/electronic.jpg);
background-position: 0 0; background-position: 0 0;
display: flex; display: flex;
flex-direction: row;
}
div#header_logo {
display: flex;
} }
div#header_logo {}
img#header_logo_image { img#header_logo_image {
align-items: start; align-items: start;
width: 160px; width: 160px;
@ -245,12 +251,11 @@ img#header_logo_image {
font-size: 300%; font-size: 300%;
margin: 20px; margin: 20px;
} }
div#header_abouts {} div#header_abouts {
p#header_title {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: center; }
p#header_title {
padding-left: 50px; padding-left: 50px;
color: #FFF; color: #FFF;
font-weight: bold; font-weight: bold;
@ -260,7 +265,7 @@ p#header_about {
font-weight: normal; font-weight: normal;
color: #FFF; color: #FFF;
font-size: 130%; font-size: 130%;
margin-top: 15px; margin: 50px;
} }
@ -288,7 +293,7 @@ div.sidebar_post_about {}
p.sidebar_post_about_p {} p.sidebar_post_about_p {}
/* ============================================================================ /* ----------------------------------------------------------------------------
* Footer (Website) * Footer (Website)
*/ */
footer#footer { footer#footer {
@ -332,3 +337,36 @@ div#footer_credit {}
p#footer_copyright {} p#footer_copyright {}
p#footer_tyto {} p#footer_tyto {}
a.footer_cr_link {} a.footer_cr_link {}
/* ----------------------------------------------------------------------------
* Small screens
*/
@media screen and (max-width: 700px) {
header#header {
flex-direction: column;
}
img#header_logo_image {
all: unset;
display: inline-block;
width: 100%;
margin-top: 20px;
height: min(20vw,20vh);
}
p#header_title {
padding-left: 0px;
color: #FFF;
font-weight: bold;
font-size: 180%;
text-align: center;
}
p#header_about {
padding-left: 0px;
margin-top: 0px;
color: #FFF;
font-size: 100%;
text-align: center;
}
}