Skip to content

Commit 0861e7b

Browse files
authoredJun 9, 2024··
fix(frontend): unexpected indentation in markdown render (#304)
1 parent f374270 commit 0861e7b

File tree

1 file changed

+94
-91
lines changed

1 file changed

+94
-91
lines changed
 

‎src/GZCTF/ClientApp/src/styles/shared/Typography.module.css

+94-91
Original file line numberDiff line numberDiff line change
@@ -58,98 +58,101 @@
5858
);
5959
}
6060

61-
& pre,
62-
& code {
63-
font-family: var(--mantine-font-family-monospace);
64-
font-weight: 500;
65-
text-align: left;
66-
white-space: pre-wrap;
67-
word-wrap: break-word;
68-
word-break: normal;
69-
font-size: 0.97em;
70-
line-height: var(--mantine-line-height-md);
71-
tab-size: 4;
72-
hyphens: none;
73-
color: light-dark(var(--mantine-color-gray-7), var(--mantine-color-light-2));
61+
& pre {
7462
background-color: light-dark(var(--mantine-color-light-1), var(--mantine-color-dark-6));
75-
76-
& :global(.namespace) {
77-
opacity: 0.8;
78-
}
79-
80-
& :global(.token.id),
81-
& :global(.token.important),
82-
& :global(.token.keyword) {
83-
font-weight: bold;
84-
}
85-
86-
& :global(.token.atrule),
87-
& :global(.token.boolean),
88-
& :global(.token.constant),
89-
& :global(.token.function),
90-
& :global(.token.id),
91-
& :global(.token.important),
92-
& :global(.token.keyword),
93-
& :global(.token.symbol) {
94-
color: light-dark(#7c4dff, #c792ea);
95-
}
96-
97-
& :global(.token.attr-name),
98-
& :global(.token.builtin),
99-
& :global(.token.class) {
100-
color: light-dark(#39adb5, #ffcb6b);
101-
}
102-
103-
& :global(.token.attr-value),
104-
& :global(.token.attribute),
105-
& :global(.token.pseudo-class),
106-
& :global(.token.pseudo-element) {
107-
color: light-dark(#f6a434, #a5e844);
108-
}
109-
110-
& :global(.token.cdata),
111-
& :global(.token.char),
112-
& :global(.token.inserted),
113-
& :global(.token.operator),
114-
& :global(.token.property) {
115-
color: light-dark(#39adb5, #80cbc4);
116-
}
117-
118-
& :global(.token.class-name),
119-
& :global(.token.regex) {
120-
color: light-dark(#6182b8, #f2ff00);
121-
}
122-
123-
& :global(.token.comment),
124-
& :global(.token.doctype),
125-
& :global(.token.prolog) {
126-
color: light-dark(#aabfc9, #616161);
127-
}
128-
129-
& :global(.token.deleted),
130-
& :global(.token.entity),
131-
& :global(.token.selector),
132-
& :global(.token.tag),
133-
& :global(.token.url),
134-
& :global(.token.variable) {
135-
color: light-dark(#e53935, #ff6666);
136-
}
137-
138-
& :global(.token.hexcode) {
139-
color: light-dark(#f76d47, #f2ff00);
140-
}
141-
142-
& :global(.token.number),
143-
& :global(.token.unit) {
144-
color: light-dark(#f76d47, #fd9170);
145-
}
146-
147-
& :global(.token.punctuation) {
148-
color: light-dark(#39adb5, #89ddff);
149-
}
150-
151-
& :global(.token.string) {
152-
color: light-dark(#84a657, #a5e844);
63+
& code {
64+
padding: calc(0.0625rem * var(--mantine-scale)), 0px;
65+
background-color: transparent;
66+
color: light-dark(var(--mantine-color-gray-7), var(--mantine-color-light-2));
67+
font-family: var(--mantine-font-family-monospace);
68+
font-weight: 500;
69+
text-align: left;
70+
white-space: pre-wrap;
71+
word-wrap: break-word;
72+
word-break: normal;
73+
font-size: 1.25em;
74+
line-height: var(--mantine-line-height-md);
75+
tab-size: 4;
76+
hyphens: none;
77+
78+
& :global(.namespace) {
79+
opacity: 0.8;
80+
}
81+
82+
& :global(.token.id),
83+
& :global(.token.important),
84+
& :global(.token.keyword) {
85+
font-weight: bold;
86+
}
87+
88+
& :global(.token.atrule),
89+
& :global(.token.boolean),
90+
& :global(.token.constant),
91+
& :global(.token.function),
92+
& :global(.token.id),
93+
& :global(.token.important),
94+
& :global(.token.keyword),
95+
& :global(.token.symbol) {
96+
color: light-dark(#7c4dff, #c792ea);
97+
}
98+
99+
& :global(.token.attr-name),
100+
& :global(.token.builtin),
101+
& :global(.token.class) {
102+
color: light-dark(#39adb5, #ffcb6b);
103+
}
104+
105+
& :global(.token.attr-value),
106+
& :global(.token.attribute),
107+
& :global(.token.pseudo-class),
108+
& :global(.token.pseudo-element) {
109+
color: light-dark(#f6a434, #a5e844);
110+
}
111+
112+
& :global(.token.cdata),
113+
& :global(.token.char),
114+
& :global(.token.inserted),
115+
& :global(.token.operator),
116+
& :global(.token.property) {
117+
color: light-dark(#39adb5, #80cbc4);
118+
}
119+
120+
& :global(.token.class-name),
121+
& :global(.token.regex) {
122+
color: light-dark(#6182b8, #f2ff00);
123+
}
124+
125+
& :global(.token.comment),
126+
& :global(.token.doctype),
127+
& :global(.token.prolog) {
128+
color: light-dark(#aabfc9, #616161);
129+
}
130+
131+
& :global(.token.deleted),
132+
& :global(.token.entity),
133+
& :global(.token.selector),
134+
& :global(.token.tag),
135+
& :global(.token.url),
136+
& :global(.token.variable) {
137+
color: light-dark(#e53935, #ff6666);
138+
}
139+
140+
& :global(.token.hexcode) {
141+
color: light-dark(#f76d47, #f2ff00);
142+
}
143+
144+
& :global(.token.number),
145+
& :global(.token.unit) {
146+
color: light-dark(#f76d47, #fd9170);
147+
}
148+
149+
& :global(.token.punctuation) {
150+
color: light-dark(#39adb5, #89ddff);
151+
}
152+
153+
& :global(.token.string) {
154+
color: light-dark(#84a657, #a5e844);
155+
}
153156
}
154157
}
155158
}

0 commit comments

Comments
 (0)
Please sign in to comment.