@@ -207,3 +207,187 @@ a:hover {
207207 position: static !important;
208208 border-radius: 0 !important;
209209}
210+
211+.markdown *:last-child {
212+ @apply pb-0 mb-0;
213+}
214+
215+.markdown *:first-child {
216+ @apply pt-0 mt-0;
217+}
218+
219+.markdown *:first-child figure {
220+ @apply pt-0 mt-0;
221+}
222+
223+.markdown p,
224+.markdown ul,
225+.markdown ol,
226+.markdown blockquote {
227+ @apply my-8;
228+}
229+
230+.markdown h1 {
231+ @apply text-3xl md:text-4xl lg:text-5xl font-bold mt-24 mb-12;
232+}
233+
234+.markdown.large-typescale h1 {
235+ @apply text-4xl md:text-5xl lg:text-6xl font-bold mt-24 mb-12;
236+}
237+
238+.markdown h2 {
239+ @apply text-2xl md:text-3xl lg:text-4xl font-bold mt-16 mb-12;
240+}
241+
242+.markdown.large-typescale h2 {
243+ @apply text-3xl md:text-4xl lg:text-5xl font-bold mt-16 mb-12;
244+}
245+
246+.markdown h3 {
247+ @apply text-lg md:text-xl lg:text-2xl font-semibold mt-8 mb-8;
248+}
249+
250+.markdown.large-typescale h3 {
251+ @apply text-xl md:text-2xl lg:text-3xl font-semibold mt-8 mb-8;
252+}
253+
254+.markdown h4 {
255+ @apply text-base md:text-lg lg:text-xl font-semibold mt-4 mb-4;
256+}
257+
258+.markdown.large-typescale h4 {
259+ @apply text-lg md:text-xl lg:text-2xl font-semibold mt-4 mb-4;
260+}
261+
262+.markdown p {
263+ @apply text-base md:text-lg lg:text-xl leading-relaxed;
264+}
265+
266+.markdown.large-typescale p {
267+ @apply text-lg md:text-xl lg:text-2xl leading-relaxed;
268+}
269+
270+.markdown img {
271+ width: 100%;
272+ height: auto;
273+ @apply rounded-lg;
274+}
275+
276+.markdown figure {
277+ position: relative;
278+ @apply mt-12 mb-12 z-0;
279+}
280+
281+.markdown figure {
282+ width: 100%;
283+ left: 0;
284+}
285+
286+@media (min-width: 768px) {
287+ .markdown figure {
288+ width: 125%;
289+ left: -12.5%;
290+ }
291+}
292+
293+.markdown pre,
294+.markdown pre[class*="language-"] {
295+}
296+
297+.markdown code,
298+.markdown code[class*="language-"] {
299+ @apply px-2 py-0.5 bg-wall rounded-md;
300+}
301+
302+.markdown a code,
303+.markdown a code[class*="language-"] {
304+ @apply bg-washedGreen;
305+}
306+
307+.markdown pre code,
308+.markdown pre[class*="language-"] code {
309+ @apply p-4 md:p-8 rounded-xl;
310+}
311+
312+.markdown ul {
313+ list-style: outside;
314+ list-style-type: disc;
315+}
316+
317+.markdown ol {
318+ list-style: outside;
319+ list-style-type: decimal;
320+}
321+
322+.markdown li {
323+ @apply py-2 ml-6 text-base md:text-lg lg:text-xl;
324+}
325+
326+.markdown.large-typescale li {
327+ @apply py-2 ml-6 text-lg md:text-xl lg:text-2xl;
328+}
329+
330+.markdown li a,
331+.markdown h3 a,
332+.markdown h2 a {
333+ @apply text-green;
334+}
335+
336+.markdown blockquote {
337+ @apply border-l-4 border-deepWall pl-6 italic;
338+}
339+.markdown blockquote cite {
340+ @apply not-italic font-semibold;
341+}
342+
343+.markdown table {
344+ border-collapse: separate;
345+ border-spacing: 0;
346+ min-width: 350px;
347+}
348+
349+.markdown table tr th,
350+.markdown table tr td {
351+ border-right-width: 2px;
352+ border-right-style: solid;
353+ border-bottom-width: 2px;
354+ border-bottom-style: solid;
355+ padding: 8px !important;
356+ @apply border-wall;
357+}
358+
359+.markdown table tr th:first-child,
360+.markdown table tr td:first-child {
361+ border-left-width: 2px;
362+ border-left-style: solid;
363+ @apply border-wall;
364+}
365+
366+.markdown table tr th {
367+ background: rgba(240, 239, 236, 0.33);
368+ border-top-width: 2px;
369+ border-top-style: solid;
370+ text-align: left;
371+ vertical-align: middle;
372+ @apply border-wall;
373+}
374+
375+/* top-left border-radius */
376+.markdown table tr:first-child th:first-child {
377+ border-top-left-radius: 8px;
378+}
379+
380+/* top-right border-radius */
381+.markdown table tr:first-child th:last-child {
382+ border-top-right-radius: 8px;
383+}
384+
385+/* bottom-left border-radius */
386+.markdown table tr:last-child td:first-child {
387+ border-bottom-left-radius: 8px;
388+}
389+
390+/* bottom-right border-radius */
391+.markdown table tr:last-child td:last-child {
392+ border-bottom-right-radius: 8px;
393+}