Mercurial

comparison markdown_converter/markdown_to_html.css @ 190:a2725419f988 hg-web

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
Updated so that bun builds will with already existing js files.
author MrJuneJune <me@mrjunejune.com>
date Sat, 24 Jan 2026 21:06:42 -0800
parents
children
comparison
equal deleted inserted replaced
188:32ce881452fa 190:a2725419f988
1 /* markdown panel */
2 #markdown {
3 flex: 1;
4 padding: 15px;
5 border: 1px solid rgba(var(--gray), 0.3);
6 border-radius: 4px;
7 background: var(--white);
8 color: rgb(var(--gray-dark));
9 overflow-y: auto;
10 font-size: 15px;
11 }
12
13 /* Markdown markdown styles */
14 #markdown h1, #markdown h2, #markdown h3, #markdown h4, #markdown h5, #markdown h6 {
15 margin: 1em 0 0.5em 0;
16 color: rgb(var(--gray-dark));
17 line-height: 1.3;
18 }
19
20 #markdown h1:first-child, #markdown h2:first-child, #markdown h3:first-child {
21 margin-top: 0;
22 }
23
24 #markdown h1 { font-size: 1.8em; }
25 #markdown h2 { font-size: 1.5em; }
26 #markdown h3 { font-size: 1.25em; }
27 #markdown h4 { font-size: 1.1em; }
28
29 #markdown p {
30 margin: 0.8em 0;
31 }
32
33 #markdown ul, #markdown ol {
34 margin: 0.8em 0;
35 padding-left: 25px;
36 }
37
38 #markdown li {
39 margin: 0.3em 0;
40 }
41
42 #markdown code {
43 background: rgb(var(--gray-light));
44 padding: 2px 6px;
45 border-radius: 3px;
46 font-family: 'SF Mono', 'Monaco', 'Consolas', monospace;
47 font-size: 0.9em;
48 color: var(--accent);
49 }
50
51 #markdown pre {
52 background: var(--black);
53 color: var(--white);
54 padding: 15px;
55 border-radius: 6px;
56 overflow-x: auto;
57 margin: 1em 0;
58 line-height: 1.4;
59 }
60
61 #markdown pre code {
62 background: none;
63 color: inherit;
64 padding: 0;
65 }
66
67 #markdown blockquote {
68 border-left: 4px solid var(--accent);
69 padding: 10px 15px;
70 margin: 1em 0;
71 background: rgb(var(--gray-light));
72 color: rgb(var(--gray));
73 font-style: italic;
74 }
75
76 #markdown a {
77 color: var(--accent);
78 text-decoration: none;
79 }
80
81 #markdown a:hover {
82 text-decoration: underline;
83 }
84
85 #markdown hr {
86 border: none;
87 border-top: 1px solid rgb(var(--gray-light));
88 margin: 1.5em 0;
89 }
90
91 #markdown img {
92 max-width: 100%;
93 height: auto;
94 border-radius: 4px;
95 }
96
97 #markdown strong {
98 font-weight: 600;
99 }
100
101 #markdown em {
102 font-style: italic;
103 }
104
105 #markdown del {
106 text-decoration: line-through;
107 color: rgb(var(--gray));
108 }
109
110 /* Mobile */
111 @media (max-width: 900px) {
112 body {
113 padding: 15px;
114 }
115
116 .container {
117 grid-template-columns: 1fr;
118 height: auto;
119 gap: 15px;
120 }
121
122 .panel {
123 min-height: 350px;
124 }
125
126 textarea {
127 min-height: 300px;
128 }
129
130 #markdown {
131 min-height: 300px;
132 }
133 }