mathias/blog
1
0
Fork 0
mirror of https://github.com/MathiasDPX/blog.git synced 2025-05-10 07:33:09 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

fix display on small screen

Browse source
This commit is contained in:
Mathias DUPEUX 2025-03-06 18:29:15 +01:00
parent 1e7fb2d749
commit 962c695736
2 changed files with 30 additions and 10 deletions
Download patch file Download diff file Expand all files Collapse all files

39
static/base.css
View file

@ -1,5 +1,6 @@
@import url("typography.css");
/* Reset */
* {
margin: 0;
@ -21,11 +22,13 @@ body {
/* Main Container */
#wrap {
width: 70%;
max-width: 45em;
margin: 0 auto;
background-color: #fff;
flex: 1;
display: flex;
flex-direction: column;
width: 70%;
max-width: 45em;
}
/* Header Styles */
@ -45,27 +48,45 @@ header h1 {
/* Navigation Bar */
#navbar {
min-width: 100%;
width: 100%;
background-color: #03396C;
padding: 5px 3em 5px 0;
text-align: right;
width: 70%;
max-width: 45em;
margin: 0 auto;
}
/* Main Content */
#main {
padding: 35px;
flex: 1;
}
/* Footer */
#footer {
padding-bottom: 0.5em;
margin-top: auto;
}
#footer-title {
min-width: 100%;
width: 100%;
background-color: #03396C;
text-align: center;
padding: 0.5em 0;
}
@media (max-width: 768px) {
html, body {
min-height: 100vh;
}
#wrap {
width: 100%;
max-width: none;
}
footer p{
margin-bottom: 0.25em;
}
header h1 {
font-size: clamp(2rem, 20vw, 100px);
text-align: center;
max-width: 90%;
word-wrap: break-word;
margin: 20px auto;
}
}