207 lines
3.5 KiB
CSS
207 lines
3.5 KiB
CSS
/* Ayu Dark markdown styles */
|
|
|
|
#markdownContent {
|
|
max-width: 104ch;
|
|
margin: 0 auto;
|
|
padding: 20px 10px 80px 10px;
|
|
font-family: 'Iosevka Web', monospace;
|
|
line-height: 1.6;
|
|
color: #E6E1CF;
|
|
}
|
|
|
|
/* Headings */
|
|
#markdownContent h1,
|
|
#markdownContent h2,
|
|
#markdownContent h3,
|
|
#markdownContent h4,
|
|
#markdownContent h5,
|
|
#markdownContent h6 {
|
|
color: #ffb454;
|
|
margin-top: 1.5em;
|
|
margin-bottom: 0.5em;
|
|
line-height: 1.3;
|
|
font-weight: bold;
|
|
}
|
|
|
|
#markdownContent h1 {
|
|
font-size: 2em;
|
|
border-bottom: 1px solid #253340;
|
|
padding-bottom: 0.3em;
|
|
}
|
|
|
|
#markdownContent h2 {
|
|
font-size: 1.5em;
|
|
border-bottom: 1px solid #253340;
|
|
padding-bottom: 0.3em;
|
|
}
|
|
|
|
#markdownContent h3 { font-size: 1.25em; }
|
|
#markdownContent h4 { font-size: 1.1em; }
|
|
#markdownContent h5 { font-size: 1em; }
|
|
|
|
#markdownContent h6 {
|
|
font-size: 0.9em;
|
|
color: #b8b4a0;
|
|
}
|
|
|
|
/* Links */
|
|
#markdownContent a {
|
|
color: #59c2ff;
|
|
text-decoration: none;
|
|
}
|
|
|
|
#markdownContent a:hover {
|
|
text-decoration: underline;
|
|
color: #7fd0ff;
|
|
}
|
|
|
|
/* Paragraphs and lists */
|
|
#markdownContent p {
|
|
margin: 1em 0;
|
|
}
|
|
|
|
#markdownContent ul,
|
|
#markdownContent ol {
|
|
margin: 1em 0;
|
|
padding-left: 2em;
|
|
}
|
|
|
|
#markdownContent li {
|
|
margin: 0.3em 0;
|
|
}
|
|
|
|
#markdownContent li > p {
|
|
margin: 0.3em 0;
|
|
}
|
|
|
|
/* Blockquote */
|
|
#markdownContent blockquote {
|
|
margin: 1em 0;
|
|
padding: 0.6em 1em;
|
|
border-left: 4px solid #f29718;
|
|
background: #131b24;
|
|
color: #b8b4a0;
|
|
}
|
|
|
|
#markdownContent blockquote p {
|
|
margin: 0;
|
|
}
|
|
|
|
/* Inline code */
|
|
#markdownContent code {
|
|
background: #131b24;
|
|
padding: 0.15em 0.4em;
|
|
border-radius: 3px;
|
|
font-family: 'Iosevka Web', monospace;
|
|
font-size: 0.9em;
|
|
color: #f07178;
|
|
}
|
|
|
|
/* Syntect code blocks — wrap in markdown-code-block div */
|
|
#markdownContent pre {
|
|
margin: 1em 0;
|
|
border-radius: 4px;
|
|
overflow-x: auto;
|
|
font-family: 'Iosevka Web', monospace;
|
|
font-size: 0.9em;
|
|
}
|
|
|
|
#markdownContent pre code {
|
|
background: transparent;
|
|
padding: 0;
|
|
border-radius: 0;
|
|
color: inherit;
|
|
font-size: inherit;
|
|
}
|
|
|
|
/* Tables */
|
|
#markdownContent table {
|
|
border-collapse: collapse;
|
|
width: 100%;
|
|
margin: 1em 0;
|
|
}
|
|
|
|
#markdownContent th,
|
|
#markdownContent td {
|
|
border: 1px solid #253340;
|
|
padding: 0.5em 1em;
|
|
text-align: left;
|
|
}
|
|
|
|
#markdownContent th {
|
|
background: #131b24;
|
|
color: #ffb454;
|
|
}
|
|
|
|
#markdownContent tr:nth-child(even) {
|
|
background: #131b24;
|
|
}
|
|
|
|
/* Horizontal rule */
|
|
#markdownContent hr {
|
|
border: none;
|
|
border-top: 1px solid #253340;
|
|
margin: 2em 0;
|
|
}
|
|
|
|
/* Images */
|
|
#markdownContent img {
|
|
max-width: 100%;
|
|
border-radius: 4px;
|
|
}
|
|
|
|
/* Task list checkboxes */
|
|
#markdownContent input[type="checkbox"] {
|
|
margin-right: 0.4em;
|
|
accent-color: #f29718;
|
|
}
|
|
|
|
/* Strikethrough */
|
|
#markdownContent del {
|
|
color: #6b6b6b;
|
|
}
|
|
|
|
/* Footnotes */
|
|
#markdownContent .footnote-definition {
|
|
font-size: 0.85em;
|
|
color: #b8b4a0;
|
|
border-top: 1px solid #253340;
|
|
margin-top: 2em;
|
|
padding-top: 0.5em;
|
|
}
|
|
|
|
.topRightBox {
|
|
display: none;
|
|
}
|
|
|
|
.rootBox {
|
|
position: relative;
|
|
}
|
|
|
|
#themePicker {
|
|
position: fixed;
|
|
top: 12px;
|
|
right: 12px;
|
|
}
|
|
|
|
#themeSelect {
|
|
background: #0f1419;
|
|
color: #f29718;
|
|
border: 1px solid #253340;
|
|
font-family: 'Iosevka Web', monospace;
|
|
font-size: 14px;
|
|
padding: 4px 8px;
|
|
border-radius: 3px;
|
|
cursor: pointer;
|
|
outline: none;
|
|
}
|
|
|
|
#themeSelect:hover {
|
|
border-color: #f29718;
|
|
}
|
|
|
|
#themeSelect option {
|
|
background: #0f1419;
|
|
color: #E6E1CF;
|
|
}
|