flo-bit.dev
your personal website on atproto - mirror
blento.app
1<script lang="ts">
2 import type { RichTextTypes } from '.';
3
4 let {
5 name
6 }: {
7 name: RichTextTypes;
8 } = $props();
9</script>
10
11{#if name === 'paragraph'}
12 <svg
13 xmlns="http://www.w3.org/2000/svg"
14 viewBox="0 0 24 24"
15 fill="none"
16 stroke="currentColor"
17 stroke-width="2"
18 stroke-linecap="round"
19 stroke-linejoin="round"
20 ><path d="M13 4v16" /><path d="M17 4v16" /><path d="M19 4H9.5a4.5 4.5 0 0 0 0 9H13" /></svg
21 >
22{:else if name === 'heading-1'}
23 <svg
24 xmlns="http://www.w3.org/2000/svg"
25 viewBox="0 0 24 24"
26 fill="none"
27 stroke="currentColor"
28 stroke-width="2"
29 stroke-linecap="round"
30 stroke-linejoin="round"
31 ><path d="M4 12h8" /><path d="M4 18V6" /><path d="M12 18V6" /><path d="m17 12 3-2v8" /></svg
32 >
33{:else if name === 'heading-2'}
34 <svg
35 xmlns="http://www.w3.org/2000/svg"
36 viewBox="0 0 24 24"
37 fill="none"
38 stroke="currentColor"
39 stroke-width="2"
40 stroke-linecap="round"
41 stroke-linejoin="round"
42 ><path d="M4 12h8" /><path d="M4 18V6" /><path d="M12 18V6" /><path
43 d="M21 18h-4c0-4 4-3 4-6 0-1.5-2-2.5-4-1"
44 /></svg
45 >
46{:else if name === 'heading-3'}
47 <svg
48 xmlns="http://www.w3.org/2000/svg"
49 viewBox="0 0 24 24"
50 fill="none"
51 stroke="currentColor"
52 stroke-width="2"
53 stroke-linecap="round"
54 stroke-linejoin="round"
55 ><path d="M4 12h8" /><path d="M4 18V6" /><path d="M12 18V6" /><path
56 d="M17.5 10.5c1.7-1 3.5 0 3.5 1.5a2 2 0 0 1-2 2"
57 /><path d="M17 17.5c2 1.5 4 .3 4-1.5a2 2 0 0 0-2-2" /></svg
58 >
59{:else if name === 'blockquote'}
60 <svg
61 xmlns="http://www.w3.org/2000/svg"
62 viewBox="0 0 24 24"
63 fill="none"
64 stroke="currentColor"
65 stroke-width="2"
66 stroke-linecap="round"
67 stroke-linejoin="round"
68 ><path d="M17 6H3" /><path d="M21 12H8" /><path d="M21 18H8" /><path d="M3 12v6" /></svg
69 >
70{:else if name === 'code'}
71 <svg
72 xmlns="http://www.w3.org/2000/svg"
73 viewBox="0 0 24 24"
74 fill="none"
75 stroke="currentColor"
76 stroke-width="2"
77 stroke-linecap="round"
78 stroke-linejoin="round"
79 ><polyline points="16 18 22 12 16 6" /><polyline points="8 6 2 12 8 18" /></svg
80 >
81{:else if name === 'bullet-list'}
82 <svg
83 xmlns="http://www.w3.org/2000/svg"
84 viewBox="0 0 24 24"
85 fill="none"
86 stroke="currentColor"
87 stroke-width="2"
88 stroke-linecap="round"
89 stroke-linejoin="round"
90 ><path d="M3 12h.01" /><path d="M3 18h.01" /><path d="M3 6h.01" /><path d="M8 12h13" /><path
91 d="M8 18h13"
92 /><path d="M8 6h13" /></svg
93 >
94{:else if name === 'ordered-list'}
95 <svg
96 xmlns="http://www.w3.org/2000/svg"
97 viewBox="0 0 24 24"
98 fill="none"
99 stroke="currentColor"
100 stroke-width="2"
101 stroke-linecap="round"
102 stroke-linejoin="round"
103 ><path d="M10 12h11" /><path d="M10 18h11" /><path d="M10 6h11" /><path d="M4 10h2" /><path
104 d="M4 6h1v4"
105 /><path d="M6 18H4c0-1 2-2 2-3s-1-1.5-2-1" /></svg
106 >
107{:else if name === 'image'}
108 <svg
109 xmlns="http://www.w3.org/2000/svg"
110 viewBox="0 0 24 24"
111 fill="none"
112 stroke="currentColor"
113 stroke-width="2"
114 stroke-linecap="round"
115 stroke-linejoin="round"
116 ><rect width="18" height="18" x="3" y="3" rx="2" ry="2" /><circle cx="9" cy="9" r="2" /><path
117 d="m21 15-3.086-3.086a2 2 0 0 0-2.828 0L6 21"
118 /></svg
119 >
120{/if}