louis/blog
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fixed overflow due to navbar links and pre > code blocks being too large

Browse Source 
Signed-off-by: Louis Vallat <louis@louis-vallat.xyz>
This commit is contained in:
Louis Vallat 2021-03-19 23:04:16 +01:00
parent c41a9a9e3f
commit f18cc1d7ab
2 changed files with 17 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
README.md
View File

@ -7,7 +7,6 @@
- [ ] Add dark and light theme switch and colors - [ ] Add dark and light theme switch and colors
- [ ] Fix article order - [ ] Fix article order
- [ ] Add article date support - [ ] Add article date support
- [ ] Fix horizontal overflow with pre > code blocks on mobile
## Sources ## Sources

25
src/assets/css/style.css
View File

@ -48,7 +48,7 @@ p, ul {
line-height: 1.55em; line-height: 1.55em;
} }
li > ul { li>ul {
margin-top: 0; margin-top: 0;
margin-left: 15px; margin-left: 15px;
list-style-type: circle; list-style-type: circle;
@ -78,23 +78,24 @@ nav {
justify-content: space-between; justify-content: space-between;
margin-top: 10px; margin-top: 10px;
margin-bottom: 10px; margin-bottom: 10px;
flex-wrap: wrap;
} }
.filler { .filler {
flex-grow: 2; flex-grow: 2;
} }
nav > a { nav>a {
font-family: 'Open Sans', sans-serif; font-family: 'Open Sans', sans-serif;
padding: 10px; padding: 10px;
} }
nav > a:visited, nav > a:hover, nav > a { nav>a:visited, nav>a:hover, nav>a {
color: var(--fg); color: var(--fg);
text-decoration: none; text-decoration: none;
} }
nav > a:not(#home_link) { nav>a:not(#home_link) {
margin-left: 25px; margin-left: 25px;
} }
@ -156,10 +157,9 @@ pre {
margin-top: 5px; margin-top: 5px;
} }
pre > code { pre>code {
padding: 10px; padding: 10px;
display: inline-block; display: block;
width: 100%;
overflow: auto; overflow: auto;
line-height: 1.35em; line-height: 1.35em;
} }
@ -176,6 +176,9 @@ code {
margin-right: 10vw; margin-right: 10vw;
margin-left: 10vw; margin-left: 10vw;
} }
nav>a:not(#home_link) {
margin-left: 5px;
}
} }
@media screen and (max-width: 768px) { @media screen and (max-width: 768px) {
@ -183,4 +186,10 @@ code {
margin-right: 5vw; margin-right: 5vw;
margin-left: 5vw; margin-left: 5vw;
} }
} nav>a:not(#home_link) {
margin-left: 0px;
}
blockquote {
margin-left: 0px;
}
}