akemi/noway.moe
1
0
Fork 0
Code Issues 1 Pull requests Packages Projects Releases Wiki Activity

Blog: responsive styles on mobile

Browse source
This commit is contained in:
Akemi Izuko 2024-01-01 17:10:56 -07:00
parent 15908a572e
commit 3ab97c54d2
Signed by: akemi
GPG key ID: 8DE0764E1809E9FC
1 changed files with 21 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

24
src/styles/markdown.css
View file

@ -10,9 +10,16 @@
*/
/**** Outer body (not part of the markdown) ****/
main {
max-width: 900px;
margin: auto;
@media not (max-width: 899px) {
main {
max-width: 900px;
margin: auto;
}
}
@media (max-width: 899px) {
main {
margin: 30px;
}
}
div.markdown-title {
text-align: center;
@ -180,6 +187,9 @@ h1.markdown-title {
/*filter: drop-shadow(0 2px 6px #ddd);*/
}
.prose pre {
overflow-wrap: anywhere;
word-break: break-all;
text-wrap: wrap;
background-color: #f6f6f6;
border-radius: 6px;
padding: 16px;
@ -187,6 +197,14 @@ h1.markdown-title {
font-family: var(--font-mono);
filter: drop-shadow(0 2px 6px #ddd);
}
.prose pre code {
overflow: hidden;
width: 100%;
overflow-wrap: anywhere;
word-break: break-all;
text-wrap: wrap;
white-space: pre-wrap;
}
.prose pre > code[data-line-numbers] {
counter-reset: line;
}