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

change: markdownのデザイン修正

Browse Source
This commit is contained in:
moris 2024-12-21 14:03:36 +09:00
parent dffc0825f0
commit 0cc4c5e299
1 changed files with 19 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

31
src/lib/components/Markdown.css
View File

@ -1,6 +1,11 @@
.markdown { .markdown {
width: 100%; width: 100%;
&>* {
max-width: 100%;
overflow: scroll;
}
& h1 { & h1 {
font-size: 2em; font-size: 2em;
@media(width>999px){padding-top:50px;margin-top:0;} @media(width>999px){padding-top:50px;margin-top:0;}
@ -36,10 +41,11 @@
*/ */
& p { & p {
margin: 0 1.5em; margin: 0 0.5em;
line-height: 2em; line-height: 2em;
@media (width<480px) { @media (width>480px) {
margin: 0 .5em; margin: 1em 2em;
font-size: 1.125em;
} }
} }
@ -59,8 +65,8 @@
& img { & img {
display: block; display: block;
width: 90%;
margin: 1em auto; margin: 1em auto;
max-height: 60vh;
} }
& code { & code {
@ -91,24 +97,25 @@
& table { & table {
margin: 1rem auto; margin: 1rem auto;
font-size: 1.2em; font-size: 1.2em;
border-collapse: collapse; border-collapse: collapse;
& thead { & thead tr {
border-bottom: solid 1px var(--black-white); border-bottom: solid 1px var(--black-white);
} }
& tbody tr:nth-child(2n) { & tbody tr {
background-color: color-mix(in srgb, var(--black-white) 10%, var(--back-color)); border-top: solid color-mix(in srgb, var(--black-white) 20%, var(--back-color)) 1px;
/* background-color: color-mix(in srgb, var(--black-white) 10%, var(--back-color)); */
} }
& td,th { & td,th {
border-width: 0px; border-width: 0px;
padding: .3em .6em; padding: .5em;
} }
} }
& blockquote { & blockquote {
position: relative; position: relative;
font-style: italic; font-style: italic;
width: fit-content; width: fit-content;
padding: .5em 0; padding: 1em;
border-top: 1px solid var(--font-color); border-top: 1px solid var(--font-color);
border-bottom: 1px solid var(--font-color); border-bottom: 1px solid var(--font-color);
@ -172,7 +179,7 @@
} }
} }
& math[display="block"] { & math[display="block"] {
margin: 1rem; margin: 1rem;
font-size: 1.5rem; font-size: 1.5rem;
} }
} }