+1 -59

src/routes/+layout.svelte

Reviewed

··· 1 1 <script lang="ts"> 2 2 import '../app.css'; 3 3 - import { base } from '$app/paths'; 4 4 - 5 5 - import { Button } from '$lib/components/button'; 6 6 - import { ThemeToggle } from '$lib/components/theme-toggle'; 7 7 - import Navbar from '$lib/components/navbar/Navbar.svelte'; 8 8 - import Sidebar from '$lib/components/sidebar/Sidebar.svelte'; 9 9 - import Container from '$lib/preview/Container.svelte'; 10 10 - 11 3 let { children } = $props(); 12 4 </script> 13 5 14 14 - <Navbar hasSidebar> 15 15 - <div> 16 16 - <Button variant="link" class="block font-normal lg:hidden" popovertarget="mobile-menu"> 17 17 - <svg 18 18 - xmlns="http://www.w3.org/2000/svg" 19 19 - viewBox="0 0 24 24" 20 20 - fill="currentColor" 21 21 - class="!size-6" 22 22 - > 23 23 - <path 24 24 - fill-rule="evenodd" 25 25 - d="M3 9a.75.75 0 0 1 .75-.75h16.5a.75.75 0 0 1 0 1.5H3.75A.75.75 0 0 1 3 9Zm0 6.75a.75.75 0 0 1 .75-.75h16.5a.75.75 0 0 1 0 1.5H3.75a.75.75 0 0 1-.75-.75Z" 26 26 - clip-rule="evenodd" 27 27 - ></path> 28 28 - </svg> 29 29 - </Button> 30 30 - </div> 31 31 - <ThemeToggle /> 32 32 - </Navbar> 33 33 - 34 34 - <Container> 35 35 - {@render children()} 36 36 - </Container> 37 37 - 38 38 - <Sidebar> 39 39 - <div class="flex flex-col items-start gap-1 p-4"> 40 40 - <Button variant="link" href="{base}/">All</Button> 41 41 - 42 42 - <Button variant="link" href="{base}/theme" class="mb-8">Theme</Button> 43 43 - 44 44 - <Button variant="link" href="{base}/alert">Alerts</Button> 45 45 - <Button variant="link" href="{base}/avatar">Avatars</Button> 46 46 - <Button variant="link" href="{base}/badge">Badges</Button> 47 47 - <Button variant="link" href="{base}/button">Buttons</Button> 48 48 - <Button variant="link" href="{base}/checkbox">Checkboxes</Button> 49 49 - <Button variant="link" href="{base}/color-select">Color Select</Button> 50 50 - <Button variant="link" href="{base}/depth-3d">Depth 3D</Button> 51 51 - <Button variant="link" href="{base}/excalidraw">Excalidraw</Button> 52 52 - <Button variant="link" href="{base}/github-corner">Github Corner</Button> 53 53 - <Button variant="link" href="{base}/heatmap">Heatmap</Button> 54 54 - <Button variant="link" href="{base}/input">Input</Button> 55 55 - <Button variant="link" href="{base}/phone">Phone</Button> 56 56 - <Button variant="link" href="{base}/piechart">Pie Chart</Button> 57 57 - <Button variant="link" href="{base}/progress">Progress</Button> 58 58 - <Button variant="link" href="{base}/scroll-area">Scroll Area</Button> 59 59 - <Button variant="link" href="{base}/star-rating">Star Rating</Button> 60 60 - <Button variant="link" href="{base}/textarea">Textarea</Button> 61 61 - <Button variant="link" href="{base}/tooltip">Tooltip</Button> 62 62 - <Button variant="link" href="{base}/video-player">Video Player</Button> 63 63 - </div> 64 64 - </Sidebar> 6 6 + {@render children()}

+243 -80

src/routes/+page.svelte

Reviewed

··· 1 1 - <script> 2 2 - import { Heading } from '$lib/components/heading'; 3 3 - import AlertPreview from '$lib/preview/AlertPreview.svelte'; 4 4 - import AvatarPreview from '$lib/preview/AvatarPreview.svelte'; 5 5 - import BadgesPreview from '$lib/preview/BadgesPreview.svelte'; 6 6 - import ButtonsPreview from '$lib/preview/ButtonsPreview.svelte'; 7 7 - import CheckboxPreview from '$lib/preview/CheckboxPreview.svelte'; 8 8 - import ColorSelectPreview from '$lib/preview/ColorSelectPreview.svelte'; 9 9 - import Depth3DPreview from '$lib/preview/Depth3DPreview.svelte'; 10 10 - import ExcalidrawPreview from '$lib/preview/ExcalidrawPreview.svelte'; 11 11 - import GithubCornerPreview from '$lib/preview/GithubCornerPreview.svelte'; 12 12 - import HeatmapPreview from '$lib/preview/HeatmapPreview.svelte'; 13 13 - import InputPreview from '$lib/preview/InputPreview.svelte'; 14 14 - import PhonePreview from '$lib/preview/PhonePreview.svelte'; 15 15 - import PieChartPreview from '$lib/preview/PieChartPreview.svelte'; 16 16 - import ProgressPreview from '$lib/preview/ProgressPreview.svelte'; 17 17 - import ScrollAreaPreview from '$lib/preview/ScrollAreaPreview.svelte'; 18 18 - import StarRatingPreview from '$lib/preview/StarRatingPreview.svelte'; 19 19 - import TextareaPreview from '$lib/preview/TextareaPreview.svelte'; 20 20 - import TooltipPreview from '$lib/preview/TooltipPreview.svelte'; 21 21 - import VideoPlayerPreview from '$lib/preview/VideoPlayerPreview.svelte'; 1 1 + <script lang="ts"> 2 2 + import { goto } from '$app/navigation'; 3 3 + import { base } from '$app/paths'; 4 4 + import AlertTitle from '$lib/components/alert/alert-title.svelte'; 5 5 + import Alert from '$lib/components/alert/alert.svelte'; 6 6 + import { AvatarGroup } from '$lib/components/avatar'; 7 7 + import Badge from '$lib/components/badge/Badge.svelte'; 8 8 + import { Button } from '$lib/components/button'; 9 9 + import { Checkbox } from '$lib/components/checkbox'; 10 10 + import Excalidraw from '$lib/components/excalidraw/Excalidraw.svelte'; 11 11 + import Heading from '$lib/components/heading/Heading.svelte'; 12 12 + import Subheading from '$lib/components/heading/Subheading.svelte'; 13 13 + import Heatmap from '$lib/components/heatmap/Heatmap.svelte'; 14 14 + import Input from '$lib/components/input/Input.svelte'; 15 15 + import { Label } from '$lib/components/label'; 16 16 + import PieChart from '$lib/components/piechart/PieChart.svelte'; 17 17 + import { Progress } from '$lib/components/progress'; 18 18 + import ScrollArea from '$lib/components/scroll-area/ScrollArea.svelte'; 19 19 + import { SocialIcons } from '$lib/components/social-icons'; 20 20 + import Github from '$lib/components/social-icons/Github.svelte'; 21 21 + import { StarRating } from '$lib/components/star-rating'; 22 22 + import Textarea from '$lib/components/textarea/textarea.svelte'; 23 23 + import { ThemeToggle } from '$lib/components/theme-toggle'; 24 24 + import FullscreenVideoPlayer, { 25 25 + videoPlayer 26 26 + } from '$lib/components/video-player/FullscreenVideoPlayer.svelte'; 27 27 + import SelectTheme from '$lib/preview/SelectTheme.svelte'; 28 28 + import svg from '$lib/preview/assets/demo.svg?raw'; 29 29 + 30 30 + let background = 'bg-base-100 dark:bg-base-900 border border-base-200 dark:border-base-800'; 31 31 + let accentBackground = 32 32 + 'bg-accent-500/5 dark:bg-accent-500/5 border border-accent-500/20 dark:border-accent-500/20'; 33 33 + 34 34 + const heatmapData = Array.from({ length: 34 }, () => 35 35 + Array.from({ length: 7 }, () => Math.floor(Math.random() * 5)) 36 36 + ) as (0 | 1 | 2 | 3 | 4)[][]; 37 37 + 38 38 + let checked = $state(false); 39 39 + 40 40 + let progress = $state(5); 41 41 + 42 42 + $effect(() => { 43 43 + setInterval(() => { 44 44 + progress = progress > 100 ? 0 : progress + Math.random() * 40; 45 45 + }, 1000); 46 46 + }); 22 47 </script> 23 48 24 24 - <Heading class="mb-8">All</Heading> 49 49 + <ScrollArea type="scroll" class="h-[100dvh] w-screen"> 50 50 + <div class="flex items-center justify-center p-8"> 51 51 + <div class="h-full w-full max-w-6xl text-black dark:text-white"> 52 52 + <div 53 53 + class={[ 54 54 + 'mb-6 flex w-full max-w-6xl items-start justify-between rounded-2xl p-6 md:items-center', 55 55 + background 56 56 + ]} 57 57 + > 58 58 + <div class="flex flex-col items-start gap-2 md:flex-row md:items-center"> 59 59 + <Heading>my ui kit</Heading> 25 60 26 26 - <div class="flex w-full flex-col divide-y divide-base-200 dark:divide-base-900"> 27 27 - <div class="flex flex-col gap-4 py-8"> 28 28 - <AlertPreview></AlertPreview> 61 61 + <div> 62 62 + <Badge>svelte</Badge> 63 63 + <Badge>tailwind</Badge> 64 64 + </div> 65 65 + </div> 66 66 + <div class="flex items-center gap-2"> 67 67 + <ThemeToggle /> 68 68 + <Github href="https://github.com/flo-bit/ui-kit" /> 69 69 + </div> 70 70 + </div> 71 71 + <div class="grid h-full w-full max-w-6xl grid-cols-1 gap-6 md:grid-cols-12 md:grid-rows-5"> 72 72 + <div 73 73 + class={[ 74 74 + 'order-1 col-span-1 row-span-2 flex w-full flex-col items-start justify-between rounded-2xl p-6 md:col-span-5', 75 75 + accentBackground 76 76 + ]} 77 77 + > 78 78 + <div class="w-full"> 79 79 + <Subheading class="text-pretty text-lg sm:text-xl sm:font-bold" 80 80 + >Work in progress, please wait a few months for an actually working version...</Subheading 81 81 + > 82 82 + 83 83 + <Progress {progress} class="mb-6 mt-4" /> 84 84 + </div> 85 85 + <div class="mt-4"> 86 86 + <div class="flex items-center space-x-2"> 87 87 + <Checkbox id="terms" bind:checked aria-labelledby="terms-label" variant="primary" /> 88 88 + <Label 89 89 + id="terms-label" 90 90 + for="terms" 91 91 + class="text-pretty text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70" 92 92 + > 93 93 + I don't care, just show me what you got 94 94 + </Label> 95 95 + </div> 96 96 + 97 97 + <Button 98 98 + disabled={!checked} 99 99 + onclick={() => { 100 100 + goto(`${base}/components`); 101 101 + }} 102 102 + size="lg" 103 103 + class="mt-4" 104 104 + ><svg 105 105 + xmlns="http://www.w3.org/2000/svg" 106 106 + viewBox="0 0 24 24" 107 107 + fill="currentColor" 108 108 + class="size-6" 109 109 + > 110 110 + <path 111 111 + d="M18.75 12.75h1.5a.75.75 0 0 0 0-1.5h-1.5a.75.75 0 0 0 0 1.5ZM12 6a.75.75 0 0 1 .75-.75h7.5a.75.75 0 0 1 0 1.5h-7.5A.75.75 0 0 1 12 6ZM12 18a.75.75 0 0 1 .75-.75h7.5a.75.75 0 0 1 0 1.5h-7.5A.75.75 0 0 1 12 18ZM3.75 6.75h1.5a.75.75 0 1 0 0-1.5h-1.5a.75.75 0 0 0 0 1.5ZM5.25 18.75h-1.5a.75.75 0 0 1 0-1.5h1.5a.75.75 0 0 1 0 1.5ZM3 12a.75.75 0 0 1 .75-.75h7.5a.75.75 0 0 1 0 1.5h-7.5A.75.75 0 0 1 3 12ZM9 3.75a2.25 2.25 0 1 0 0 4.5 2.25 2.25 0 0 0 0-4.5ZM12.75 12a2.25 2.25 0 1 1 4.5 0 2.25 2.25 0 0 1-4.5 0ZM9 15.75a2.25 2.25 0 1 0 0 4.5 2.25 2.25 0 0 0 0-4.5Z" 112 112 + /> 113 113 + </svg> 114 114 + Browse Components</Button 115 115 + > 116 116 + </div> 117 117 + </div> 118 118 + <div 119 119 + class={[ 120 120 + 'order-6 col-span-1 row-span-2 min-h-60 overflow-hidden rounded-2xl p-6 md:order-2 md:col-span-3', 121 121 + background 122 122 + ]} 123 123 + > 124 124 + <div class="flex w-full max-w-full flex-col items-start justify-center gap-2"> 125 125 + <Subheading>Me and my bros</Subheading> 126 126 + 127 127 + <div class="mb-4 text-sm text-base-600 dark:text-base-400"> 128 128 + They don't actually know me :( 129 129 + </div> 130 130 + <AvatarGroup 131 131 + avatarClass="bg-base-100 dark:bg-base-900 size-16" 132 132 + users={[ 133 133 + { 134 134 + src: 'https://github.com/flo-bit.png', 135 135 + alt: 'flo-bit', 136 136 + fallback: 'FB' 137 137 + }, 138 138 + { 139 139 + src: 'https://github.com/rich-harris.png', 140 140 + alt: 'rich-harris', 141 141 + fallback: 'RH' 142 142 + }, 143 143 + { 144 144 + src: 'https://github.com/huntabyte.png', 145 145 + alt: 'huntabyte', 146 146 + fallback: 'HB' 147 147 + } 148 148 + ]} 149 149 + /> 150 150 + 151 151 + <Button 152 152 + class="mt-4" 153 153 + onclick={() => videoPlayer.show('https://www.youtube.com/watch?v=u1ZB_rGFyeU')} 154 154 + >Play a video</Button 155 155 + > 156 156 + 157 157 + <FullscreenVideoPlayer /> 158 158 + </div> 159 159 + </div> 160 160 + 161 161 + <div 162 162 + class="order-2 col-span-1 row-span-5 flex w-full flex-col gap-6 md:order-3 md:col-span-4" 163 163 + > 164 164 + <div class={['grow rounded-2xl p-6', accentBackground]}> 165 165 + <SelectTheme /> 166 166 + 167 167 + <Subheading class="mt-8">Rate this project</Subheading> 168 168 + <StarRating class="mt-2" rating={3} /> 169 169 + 170 170 + <div class="flex flex-col gap-3"> 171 171 + <Textarea class="mt-4 w-full" placeholder="Your review" /> 172 172 + <div class="flex justify-between gap-2"> 173 173 + <Button variant="link">Cancel</Button> 174 174 + <Button>Submit</Button> 175 175 + </div> 176 176 + </div> 177 177 + </div> 178 178 + 179 179 + <div class={['flex flex-col items-start justify-end gap-4 rounded-2xl p-6', background]}> 180 180 + <Subheading>These don't actually do anything:</Subheading> 181 181 + <div class="flex flex-wrap items-center gap-2"> 182 182 + <SocialIcons 183 183 + discord="#" 184 184 + github="#" 185 185 + twitter="#" 186 186 + youtube="#" 187 187 + bluesky="#" 188 188 + facebook="#" 189 189 + /> 190 190 + </div> 191 191 + </div> 192 192 + </div> 193 193 + 194 194 + <div class={['order-5 col-span-1 row-span-3 rounded-2xl p-6 md:col-span-4', background]}> 195 195 + <div class="max-w-full"> 196 196 + <Subheading class="mb-2">This could be your github activity:</Subheading> 197 197 + <ScrollArea type="hover" class="w-full pb-2" orientation="horizontal"> 198 198 + <Heatmap data={heatmapData} /> 199 199 + </ScrollArea> 200 200 + </div> 201 201 + 202 202 + <Subheading class="mb-2 mt-8">Login here:</Subheading> 203 203 + <div class="mt-2 flex gap-2"> 204 204 + <Input placeholder="Enter password" class="grow" /> 205 205 + 206 206 + <Button>Submit</Button> 207 207 + </div> 208 208 + <Alert class="mt-8"> 209 209 + <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" class="size-6"> 210 210 + <path fill-rule="evenodd" d="M9.401 3.003c1.155-2 4.043-2 5.197 0l7.355 12.748c1.154 2-.29 4.5-2.599 4.5H4.645c-2.309 0-3.752-2.5-2.598-4.5L9.4 3.003ZM12 8.25a.75.75 0 0 1 .75.75v3.75a.75.75 0 0 1-1.5 0V9a.75.75 0 0 1 .75-.75Zm0 8.25a.75.75 0 1 0 0-1.5.75.75 0 0 0 0 1.5Z" clip-rule="evenodd" /> 211 211 + </svg> 212 212 + 213 213 + <AlertTitle>Very important please read</AlertTitle> 214 214 + 215 215 + <p>Hah, tricked you! This is actually not important at all. But you still read it!</p> 216 216 + </Alert> 217 217 + </div> 218 218 + <div class={['order-6 col-span-1 row-span-3 rounded-2xl p-6 md:col-span-4', background]}> 219 219 + <Subheading class="mb-4">This project is made of...</Subheading> 220 220 + <PieChart 221 221 + data={[ 222 222 + { 223 223 + name: 'Bits UI', 224 224 + value: 40 225 225 + }, 226 226 + { 227 227 + name: 'Coffee', 228 228 + value: 30 229 229 + }, 230 230 + { 231 231 + name: 'Sweat', 232 232 + value: 20 233 233 + }, 234 234 + { 235 235 + name: 'Tears', 236 236 + value: 10 237 237 + } 238 238 + ]} 239 239 + /> 240 240 + 241 241 + <Subheading class="mt-8">Adding excalidraw graphs</Subheading> 242 242 + <Excalidraw {svg} alt="excalidraw demo graph" /> 243 243 + </div> 244 244 + </div> 245 245 + </div> 29 246 </div> 30 30 - <div class="flex flex-col gap-4 py-8"> 31 31 - <AvatarPreview></AvatarPreview> 32 32 - </div> 33 33 - <div class="flex flex-col gap-4 py-8"> 34 34 - <BadgesPreview></BadgesPreview> 35 35 - </div> 36 36 - <div class="flex flex-col gap-4 py-8"> 37 37 - <ButtonsPreview></ButtonsPreview> 38 38 - </div> 39 39 - <div class="flex flex-col gap-4 py-8"> 40 40 - <CheckboxPreview></CheckboxPreview> 41 41 - </div> 42 42 - <div class="flex flex-col gap-4 py-8"> 43 43 - <ColorSelectPreview></ColorSelectPreview> 44 44 - </div> 45 45 - <div class="flex flex-col gap-4 py-8"> 46 46 - <Depth3DPreview></Depth3DPreview> 47 47 - </div> 48 48 - <div class="flex flex-col gap-4 py-8"> 49 49 - <ExcalidrawPreview></ExcalidrawPreview> 50 50 - </div> 51 51 - <div class="flex flex-col gap-4 py-8"> 52 52 - <GithubCornerPreview></GithubCornerPreview> 53 53 - </div> 54 54 - <div class="flex flex-col gap-4 py-8"> 55 55 - <HeatmapPreview></HeatmapPreview> 56 56 - </div> 57 57 - <div class="flex flex-col gap-4 py-8"> 58 58 - <InputPreview></InputPreview> 59 59 - </div> 60 60 - <div class="flex flex-col gap-4 py-8"> 61 61 - <PhonePreview></PhonePreview> 62 62 - </div> 63 63 - <div class="flex flex-col gap-4 py-8"> 64 64 - <PieChartPreview></PieChartPreview> 65 65 - </div> 66 66 - <div class="flex flex-col gap-4 py-8"> 67 67 - <ProgressPreview></ProgressPreview> 68 68 - </div> 69 69 - <div class="flex flex-col gap-4 py-8"> 70 70 - <ScrollAreaPreview></ScrollAreaPreview> 71 71 - </div> 72 72 - <div class="flex flex-col gap-4 py-8"> 73 73 - <StarRatingPreview></StarRatingPreview> 74 74 - </div> 75 75 - <div class="flex flex-col gap-4 py-8"> 76 76 - <TextareaPreview></TextareaPreview> 77 77 - </div> 78 78 - <div class="flex flex-col gap-4 py-8"> 79 79 - <TooltipPreview></TooltipPreview> 80 80 - </div> 81 81 - <div class="flex flex-col items-start gap-4 py-8"> 82 82 - <VideoPlayerPreview></VideoPlayerPreview> 83 83 - </div> 84 84 - </div> 247 247 + </ScrollArea>

+4 -3

src/lib/preview/Depth3DPreview.svelte

Reviewed

··· 10 10 <Depth3D 11 11 sceneProps={{ 12 12 image: { 13 13 - image: base + '/images/depth3d/image.webp', 14 14 - depth: base + '/images/depth3d/depth.webp' 13 13 + image: base + '/images/depth3d/albert_einstein.webp', 14 14 + depth: base + '/images/depth3d/albert_einstein-depth.webp' 15 15 }, 16 16 - mouseMovement: false 16 16 + mouseMovement: false, 17 17 + rounded: 1 17 18 }} 18 19 /> 19 20 </div>

+6 -1

src/lib/preview/HeatmapPreview.svelte

Reviewed

··· 1 1 <script lang="ts"> 2 2 import { Subheading } from '$lib/components/heading'; 3 3 import Heatmap from '$lib/components/heatmap/Heatmap.svelte'; 4 4 + import ScrollArea from '$lib/components/scroll-area/ScrollArea.svelte'; 4 5 5 6 const heatmapData = Array.from({ length: 34 }, () => 6 7 Array.from({ length: 7 }, () => Math.floor(Math.random() * 5)) ··· 9 10 10 11 <Subheading class="mb-6">Heatmap</Subheading> 11 12 12 12 - <Heatmap data={heatmapData} /> 13 13 + <div class="max-w-full"> 14 14 + <ScrollArea type="hover" class="w-full pb-2" orientation="horizontal"> 15 15 + <Heatmap data={heatmapData} /> 16 16 + </ScrollArea> 17 17 + </div>

+20 -1

src/lib/preview/PieChartPreview.svelte

Reviewed

··· 5 5 6 6 <Subheading class="mb-4">Pie Chart</Subheading> 7 7 8 8 - <PieChart /> 8 8 + <PieChart 9 9 + data={[ 10 10 + { 11 11 + name: 'Svelte', 12 12 + value: 40 13 13 + }, 14 14 + { 15 15 + name: 'TypeScript', 16 16 + value: 30 17 17 + }, 18 18 + { 19 19 + name: 'HTML', 20 20 + value: 20 21 21 + }, 22 22 + { 23 23 + name: 'JavaScript', 24 24 + value: 10 25 25 + } 26 26 + ]} 27 27 + />

+17

src/lib/preview/QuotePreview.svelte

Reviewed

··· 1 1 + <script> 2 2 + import Subheading from '$lib/components/heading/Subheading.svelte'; 3 3 + import Quote from '$lib/components/quote/Quote.svelte'; 4 4 + </script> 5 5 + 6 6 + <Subheading class="mb-4">Quote</Subheading> 7 7 + 8 8 + <Quote quote="Doggo ipsum you are doing me a frighten wrinkler you are doin me a concern super chub 9 9 + pupper, very jealous pupper much ruin diet I am bekom fat." 10 10 + author={{ 11 11 + name: 'Shadcn', 12 12 + role: 'Creator of shadcn/ui', 13 13 + src: 'https://github.com/shadcn.png', 14 14 + fallback: 'SH' 15 15 + }} 16 16 + imageUseThemeColor 17 17 + />

-5

src/routes/alert/+page.svelte

Reviewed

··· 1 1 - <script> 2 2 - import AlertPreview from '$lib/preview/AlertPreview.svelte'; 3 3 - </script> 4 4 - 5 5 - <AlertPreview />

-5

src/routes/avatar/+page.svelte

Reviewed

··· 1 1 - <script> 2 2 - import AvatarPreview from '$lib/preview/AvatarPreview.svelte'; 3 3 - </script> 4 4 - 5 5 - <AvatarPreview />

-5

src/routes/badge/+page.svelte

Reviewed

··· 1 1 - <script> 2 2 - import BadgesPreview from '$lib/preview/BadgesPreview.svelte'; 3 3 - </script> 4 4 - 5 5 - <BadgesPreview />

-5

src/routes/button/+page.svelte

Reviewed

··· 1 1 - <script> 2 2 - import ButtonsPreview from '$lib/preview/ButtonsPreview.svelte'; 3 3 - </script> 4 4 - 5 5 - <ButtonsPreview />

-5

src/routes/checkbox/+page.svelte

Reviewed

··· 1 1 - <script> 2 2 - import CheckboxPreview from '$lib/preview/CheckboxPreview.svelte'; 3 3 - </script> 4 4 - 5 5 - <CheckboxPreview />

-5

src/routes/color-select/+page.svelte

Reviewed

··· 1 1 - <script> 2 2 - import ColorSelectPreview from '$lib/preview/ColorSelectPreview.svelte'; 3 3 - </script> 4 4 - 5 5 - <ColorSelectPreview />

+64

src/routes/components/+layout.svelte

Reviewed

··· 1 1 + <script lang="ts"> 2 2 + import { base } from '$app/paths'; 3 3 + 4 4 + import { Button } from '$lib/components/button'; 5 5 + import { ThemeToggle } from '$lib/components/theme-toggle'; 6 6 + import Navbar from '$lib/components/navbar/Navbar.svelte'; 7 7 + import Sidebar from '$lib/components/sidebar/Sidebar.svelte'; 8 8 + import Container from '$lib/preview/Container.svelte'; 9 9 + 10 10 + let { children } = $props(); 11 11 + </script> 12 12 + 13 13 + <Navbar hasSidebar> 14 14 + <div> 15 15 + <Button variant="link" class="block font-normal lg:hidden" popovertarget="mobile-menu"> 16 16 + <svg 17 17 + xmlns="http://www.w3.org/2000/svg" 18 18 + viewBox="0 0 24 24" 19 19 + fill="currentColor" 20 20 + class="!size-6" 21 21 + > 22 22 + <path 23 23 + fill-rule="evenodd" 24 24 + d="M3 9a.75.75 0 0 1 .75-.75h16.5a.75.75 0 0 1 0 1.5H3.75A.75.75 0 0 1 3 9Zm0 6.75a.75.75 0 0 1 .75-.75h16.5a.75.75 0 0 1 0 1.5H3.75a.75.75 0 0 1-.75-.75Z" 25 25 + clip-rule="evenodd" 26 26 + ></path> 27 27 + </svg> 28 28 + </Button> 29 29 + </div> 30 30 + <ThemeToggle /> 31 31 + </Navbar> 32 32 + 33 33 + <Container> 34 34 + {@render children()} 35 35 + </Container> 36 36 + 37 37 + <Sidebar> 38 38 + <div class="flex flex-col items-start p-4"> 39 39 + <Button variant="link" href={base}>Home</Button> 40 40 + <Button variant="link" href="{base}/components">All</Button> 41 41 + <Button variant="link" href="{base}/components/theme" class="mb-8">Theme</Button> 42 42 + 43 43 + <Button variant="link" href="{base}/components/alert">Alerts</Button> 44 44 + <Button variant="link" href="{base}/components/avatar">Avatars</Button> 45 45 + <Button variant="link" href="{base}/components/badge">Badges</Button> 46 46 + <Button variant="link" href="{base}/components/button">Buttons</Button> 47 47 + <Button variant="link" href="{base}/components/checkbox">Checkboxes</Button> 48 48 + <Button variant="link" href="{base}/components/color-select">Color Select</Button> 49 49 + <Button variant="link" href="{base}/components/depth-3d">Depth 3D</Button> 50 50 + <Button variant="link" href="{base}/components/excalidraw">Excalidraw</Button> 51 51 + <Button variant="link" href="{base}/components/github-corner">Github Corner</Button> 52 52 + <Button variant="link" href="{base}/components/heatmap">Heatmap</Button> 53 53 + <Button variant="link" href="{base}/components/input">Input</Button> 54 54 + <Button variant="link" href="{base}/components/phone">Phone</Button> 55 55 + <Button variant="link" href="{base}/components/piechart">Pie Chart</Button> 56 56 + <Button variant="link" href="{base}/components/progress">Progress</Button> 57 57 + <Button variant="link" href="{base}/components/quote">Quote</Button> 58 58 + <Button variant="link" href="{base}/components/scroll-area">Scroll Area</Button> 59 59 + <Button variant="link" href="{base}/components/star-rating">Star Rating</Button> 60 60 + <Button variant="link" href="{base}/components/textarea">Textarea</Button> 61 61 + <Button variant="link" href="{base}/components/tooltip">Tooltip</Button> 62 62 + <Button variant="link" href="{base}/components/video-player">Video Player</Button> 63 63 + </div> 64 64 + </Sidebar>

+88

src/routes/components/+page.svelte

Reviewed

··· 1 1 + <script> 2 2 + import { Heading } from '$lib/components/heading'; 3 3 + import AlertPreview from '$lib/preview/AlertPreview.svelte'; 4 4 + import AvatarPreview from '$lib/preview/AvatarPreview.svelte'; 5 5 + import BadgesPreview from '$lib/preview/BadgesPreview.svelte'; 6 6 + import ButtonsPreview from '$lib/preview/ButtonsPreview.svelte'; 7 7 + import CheckboxPreview from '$lib/preview/CheckboxPreview.svelte'; 8 8 + import ColorSelectPreview from '$lib/preview/ColorSelectPreview.svelte'; 9 9 + import Depth3DPreview from '$lib/preview/Depth3DPreview.svelte'; 10 10 + import ExcalidrawPreview from '$lib/preview/ExcalidrawPreview.svelte'; 11 11 + import GithubCornerPreview from '$lib/preview/GithubCornerPreview.svelte'; 12 12 + import HeatmapPreview from '$lib/preview/HeatmapPreview.svelte'; 13 13 + import InputPreview from '$lib/preview/InputPreview.svelte'; 14 14 + import PhonePreview from '$lib/preview/PhonePreview.svelte'; 15 15 + import PieChartPreview from '$lib/preview/PieChartPreview.svelte'; 16 16 + import ProgressPreview from '$lib/preview/ProgressPreview.svelte'; 17 17 + import QuotePreview from '$lib/preview/QuotePreview.svelte'; 18 18 + import ScrollAreaPreview from '$lib/preview/ScrollAreaPreview.svelte'; 19 19 + import StarRatingPreview from '$lib/preview/StarRatingPreview.svelte'; 20 20 + import TextareaPreview from '$lib/preview/TextareaPreview.svelte'; 21 21 + import TooltipPreview from '$lib/preview/TooltipPreview.svelte'; 22 22 + import VideoPlayerPreview from '$lib/preview/VideoPlayerPreview.svelte'; 23 23 + </script> 24 24 + 25 25 + <Heading class="mb-8">All Components</Heading> 26 26 + 27 27 + <div class="flex w-full flex-col divide-y divide-base-200 dark:divide-base-900"> 28 28 + <div class="flex flex-col gap-4 py-8"> 29 29 + <AlertPreview></AlertPreview> 30 30 + </div> 31 31 + <div class="flex flex-col gap-4 py-8"> 32 32 + <AvatarPreview></AvatarPreview> 33 33 + </div> 34 34 + <div class="flex flex-col gap-4 py-8"> 35 35 + <BadgesPreview></BadgesPreview> 36 36 + </div> 37 37 + <div class="flex flex-col gap-4 py-8"> 38 38 + <ButtonsPreview></ButtonsPreview> 39 39 + </div> 40 40 + <div class="flex flex-col gap-4 py-8"> 41 41 + <CheckboxPreview></CheckboxPreview> 42 42 + </div> 43 43 + <div class="flex flex-col gap-4 py-8"> 44 44 + <ColorSelectPreview></ColorSelectPreview> 45 45 + </div> 46 46 + <div class="flex flex-col gap-4 py-8"> 47 47 + <Depth3DPreview></Depth3DPreview> 48 48 + </div> 49 49 + <div class="flex flex-col gap-4 py-8"> 50 50 + <ExcalidrawPreview></ExcalidrawPreview> 51 51 + </div> 52 52 + <div class="flex flex-col gap-4 py-8"> 53 53 + <GithubCornerPreview></GithubCornerPreview> 54 54 + </div> 55 55 + <div class="flex flex-col gap-4 py-8"> 56 56 + <HeatmapPreview></HeatmapPreview> 57 57 + </div> 58 58 + <div class="flex flex-col gap-4 py-8"> 59 59 + <InputPreview></InputPreview> 60 60 + </div> 61 61 + <div class="flex flex-col gap-4 py-8"> 62 62 + <PhonePreview></PhonePreview> 63 63 + </div> 64 64 + <div class="flex flex-col gap-4 py-8"> 65 65 + <PieChartPreview></PieChartPreview> 66 66 + </div> 67 67 + <div class="flex flex-col gap-4 py-8"> 68 68 + <ProgressPreview></ProgressPreview> 69 69 + </div> 70 70 + <div class="flex flex-col gap-4 py-8"> 71 71 + <QuotePreview></QuotePreview> 72 72 + </div> 73 73 + <div class="flex flex-col gap-4 py-8"> 74 74 + <ScrollAreaPreview></ScrollAreaPreview> 75 75 + </div> 76 76 + <div class="flex flex-col gap-4 py-8"> 77 77 + <StarRatingPreview></StarRatingPreview> 78 78 + </div> 79 79 + <div class="flex flex-col gap-4 py-8"> 80 80 + <TextareaPreview></TextareaPreview> 81 81 + </div> 82 82 + <div class="flex flex-col gap-4 py-8"> 83 83 + <TooltipPreview></TooltipPreview> 84 84 + </div> 85 85 + <div class="flex flex-col items-start gap-4 py-8"> 86 86 + <VideoPlayerPreview></VideoPlayerPreview> 87 87 + </div> 88 88 + </div>

-5

src/routes/depth-3d/+page.svelte

Reviewed

··· 1 1 - <script> 2 2 - import Depth3DPreview from '$lib/preview/Depth3DPreview.svelte'; 3 3 - </script> 4 4 - 5 5 - <Depth3DPreview />

-6

src/routes/excalidraw/+page.svelte

Reviewed

··· 1 1 - <script> 2 2 - import ExcalidrawPreview from "$lib/preview/ExcalidrawPreview.svelte"; 3 3 - 4 4 - </script> 5 5 - 6 6 - <ExcalidrawPreview />

-5

src/routes/github-corner/+page.svelte

Reviewed

··· 1 1 - <script> 2 2 - import GithubCornerPreview from '$lib/preview/GithubCornerPreview.svelte'; 3 3 - </script> 4 4 - 5 5 - <GithubCornerPreview />

-5

src/routes/heatmap/+page.svelte

Reviewed

··· 1 1 - <script> 2 2 - import HeatmapPreview from '$lib/preview/HeatmapPreview.svelte'; 3 3 - </script> 4 4 - 5 5 - <HeatmapPreview />

-5

src/routes/input/+page.svelte

Reviewed

··· 1 1 - <script> 2 2 - import InputPreview from '$lib/preview/InputPreview.svelte'; 3 3 - </script> 4 4 - 5 5 - <InputPreview />

-5

src/routes/phone/+page.svelte

Reviewed

··· 1 1 - <script> 2 2 - import PhonePreview from '$lib/preview/PhonePreview.svelte'; 3 3 - </script> 4 4 - 5 5 - <PhonePreview />

-5

src/routes/piechart/+page.svelte

Reviewed

··· 1 1 - <script> 2 2 - import PieChartPreview from '$lib/preview/PieChartPreview.svelte'; 3 3 - </script> 4 4 - 5 5 - <PieChartPreview />

-5

src/routes/progress/+page.svelte

Reviewed

··· 1 1 - <script> 2 2 - import ProgressPreview from '$lib/preview/ProgressPreview.svelte'; 3 3 - </script> 4 4 - 5 5 - <ProgressPreview />

-5

src/routes/scroll-area/+page.svelte

Reviewed

··· 1 1 - <script> 2 2 - import ScrollAreaPreview from '$lib/preview/ScrollAreaPreview.svelte'; 3 3 - </script> 4 4 - 5 5 - <ScrollAreaPreview />

-5

src/routes/star-rating/+page.svelte

Reviewed

··· 1 1 - <script> 2 2 - import StarRatingPreview from '$lib/preview/StarRatingPreview.svelte'; 3 3 - </script> 4 4 - 5 5 - <StarRatingPreview />

-5

src/routes/textarea/+page.svelte

Reviewed

··· 1 1 - <script> 2 2 - import TextareaPreview from '$lib/preview/TextareaPreview.svelte'; 3 3 - </script> 4 4 - 5 5 - <TextareaPreview />

-5

src/routes/theme/+page.svelte

Reviewed

··· 1 1 - <script> 2 2 - import SelectTheme from '$lib/preview/SelectTheme.svelte'; 3 3 - </script> 4 4 - 5 5 - <SelectTheme />

-5

src/routes/tooltip/+page.svelte

Reviewed

··· 1 1 - <script> 2 2 - import TooltipPreview from '$lib/preview/TooltipPreview.svelte'; 3 3 - </script> 4 4 - 5 5 - <TooltipPreview />

-5

src/routes/video-player/+page.svelte

Reviewed

··· 1 1 - <script> 2 2 - import VideoPlayerPreview from '$lib/preview/VideoPlayerPreview.svelte'; 3 3 - </script> 4 4 - 5 5 - <VideoPlayerPreview />

static/images/depth3d/albert_einstein-depth.webp

Reviewed

This is a binary file and will not be displayed.

static/images/depth3d/albert_einstein.webp

Reviewed

This is a binary file and will not be displayed.

static/images/depth3d/depth.webp

Reviewed

This is a binary file and will not be displayed.

static/images/depth3d/image.webp

Reviewed

This is a binary file and will not be displayed.

+1 -1

src/lib/components/heatmap/Heatmap.svelte

Reviewed

··· 14 14 } = $props(); 15 15 </script> 16 16 17 17 - <div class="flex max-w-full gap-0.5 overflow-scroll sm:gap-1"> 17 17 + <div class="flex max-w-full gap-0.5 sm:gap-1"> 18 18 {#each data as week} 19 19 <div class="flex w-full flex-col gap-0.5 sm:gap-1"> 20 20 {#each week as day}

src/lib/components/image/ThemedImage.svelte

Reviewed

+51 -49

src/lib/components/piechart/PieChart.svelte

Reviewed

··· 1 1 <script lang="ts"> 2 2 import { PieChart, Tooltip } from 'layerchart'; 3 3 + ; 3 4 4 4 - let languages: { name: string; size: number }[] = [ 5 5 - { 6 6 - name: 'Svelte', 7 7 - size: 40 8 8 - }, 9 9 - { 10 10 - name: 'TypeScript', 11 11 - size: 30 12 12 - }, 13 13 - { 14 14 - name: 'HTML', 15 15 - size: 20 16 16 - }, 17 17 - { 18 18 - name: 'JavaScript', 19 19 - size: 10 20 20 - } 5 5 + const { data, ...restProps }: { 6 6 + data: { 7 7 + name: string; 8 8 + value: number; 9 9 + }[]; 10 10 + } = $props(); 11 11 + 12 12 + let colors = [ 13 13 + { key: 0, color: 'hsl(var(--accent-800))' }, 14 14 + { key: 1, color: 'hsl(var(--accent-600))' }, 15 15 + { key: 2, color: 'hsl(var(--accent-400))' }, 16 16 + { key: 3, color: 'hsl(var(--accent-200))' } 21 17 ]; 22 18 </script> 23 19 24 24 - <div class="h-80 w-full gap-2 overflow-auto"> 25 25 - <PieChart 26 26 - data={languages} 27 27 - key="name" 28 28 - value="size" 29 29 - innerRadius={-20} 30 30 - cornerRadius={16} 31 31 - padAngle={0.025} 32 32 - series={[ 33 33 - { key: 0, color: 'hsl(var(--accent-800))' }, 34 34 - { key: 1, color: 'hsl(var(--accent-600))' }, 35 35 - { key: 2, color: 'hsl(var(--accent-400))' }, 36 36 - { key: 3, color: 'hsl(var(--accent-200))' } 37 37 - ]} 38 38 - > 39 39 - <div slot="tooltip"> 40 40 - <Tooltip.Root 41 41 - let:data 42 42 - class="rounded-2xl border border-base-300 bg-base-200/80 py-2 backdrop-blur-sm dark:border-base-800 dark:bg-base-900/80" 43 43 - > 44 44 - <Tooltip.Header class="border-b-0 text-xs font-medium text-accent-700 dark:text-accent-600" 45 45 - >{data?.name}</Tooltip.Header 20 20 + <div class="flex items-center justify-between w-full gap-2 overflow-hidden"> 21 21 + <div class="flex flex-col gap-2"> 22 22 + {#each data as point, index} 23 23 + <div class="flex items-center justify-start gap-2"> 24 24 + <div class="h-4 w-4 rounded-full" style="background-color: {colors[index].color}"></div> 25 25 + <span class="text-xs text-base-700 dark:text-base-300">{point.name}</span> 26 26 + </div> 27 27 + {/each} 28 28 + </div> 29 29 + <div class="h-44 grow"> 30 30 + <PieChart 31 31 + {data} 32 32 + key="name" 33 33 + value="value" 34 34 + innerRadius={-15} 35 35 + cornerRadius={16} 36 36 + padAngle={0.05} 37 37 + series={colors} 38 38 + > 39 39 + <div slot="tooltip"> 40 40 + <Tooltip.Root 41 41 + let:data 42 42 + class="rounded-2xl border border-base-300 bg-base-200/80 py-2 backdrop-blur-sm dark:border-base-800 dark:bg-base-900/80" 46 43 > 47 47 - <Tooltip.List> 48 48 - <Tooltip.Item 49 49 - label="" 50 50 - value={data?.size + ' %'} 51 51 - class="flex gap-2 font-bold text-accent-600 dark:text-accent-500" 52 52 - /> 53 53 - </Tooltip.List> 54 54 - </Tooltip.Root> 55 55 - </div> 56 56 - </PieChart> 44 44 + <Tooltip.Header 45 45 + class="border-b-0 text-xs font-medium text-accent-700 dark:text-accent-600" 46 46 + >{data?.name}</Tooltip.Header 47 47 + > 48 48 + <Tooltip.List> 49 49 + <Tooltip.Item 50 50 + label="" 51 51 + value={data?.value} 52 52 + class="flex gap-2 font-bold text-accent-600 dark:text-accent-500" 53 53 + /> 54 54 + </Tooltip.List> 55 55 + </Tooltip.Root> 56 56 + </div> 57 57 + </PieChart> 58 58 + </div> 57 59 </div>

+88

src/lib/components/quote/Quote.svelte

Reviewed

··· 1 1 + <script lang="ts"> 2 2 + import { 3 3 + Avatar as AvatarPrimitive, 4 4 + type WithElementRef, 5 5 + type WithoutChildrenOrChild 6 6 + } from 'bits-ui'; 7 7 + import type { HTMLAttributes } from 'svelte/elements'; 8 8 + 9 9 + let { 10 10 + quote, 11 11 + author, 12 12 + role, 13 13 + 14 14 + ref = $bindable(null), 15 15 + 16 16 + imageUseThemeColor = false, 17 17 + 18 18 + class: className, 19 19 + ...restProps 20 20 + }: WithoutChildrenOrChild<WithElementRef<HTMLAttributes<HTMLDivElement>>> & { 21 21 + quote?: string; 22 22 + author?: { 23 23 + src?: string; 24 24 + alt?: string; 25 25 + fallback?: string; 26 26 + 27 27 + role?: string; 28 28 + name?: string; 29 29 + 30 30 + avatarClass?: string; 31 31 + fallbackClass?: string; 32 32 + imageClass?: string; 33 33 + }; 34 34 + 35 35 + imageUseThemeColor?: boolean; 36 36 + } = $props(); 37 37 + </script> 38 38 + 39 39 + <div 40 40 + class={[ 41 41 + 'flex flex-col items-start justify-between gap-4 md:flex-row md:items-center md:gap-6', 42 42 + className 43 43 + ]} 44 44 + bind:this={ref} 45 45 + {...restProps} 46 46 + > 47 47 + <div class="h-24 w-24 shrink-0 md:h-32 md:w-32"> 48 48 + <AvatarPrimitive.Root 49 49 + class={[ 50 50 + 'relative flex h-24 w-24 shrink-0 overflow-hidden rounded-2xl border border-base-200 bg-base-100 text-base-900 dark:border-base-800 dark:bg-base-900 dark:text-base-50 md:h-32 md:w-32', 51 51 + className 52 52 + ]} 53 53 + > 54 54 + {#if imageUseThemeColor} 55 55 + <div class="absolute inset-0 z-20 size-full bg-accent-500/30"></div> 56 56 + {/if} 57 57 + {#if author?.src} 58 58 + <AvatarPrimitive.Image 59 59 + class={['aspect-square size-full object-cover', author.imageClass]} 60 60 + src={author.src} 61 61 + alt={author.alt} 62 62 + style={{ filter: imageUseThemeColor ? 'grayscale(100%) brightness(1.2)' : '' }} 63 63 + /> 64 64 + {/if} 65 65 + 66 66 + {#if author?.fallback} 67 67 + <AvatarPrimitive.Fallback 68 68 + class={['flex size-full items-center justify-center', author.fallbackClass]} 69 69 + > 70 70 + {author.fallback} 71 71 + </AvatarPrimitive.Fallback> 72 72 + {/if} 73 73 + </AvatarPrimitive.Root> 74 74 + </div> 75 75 + <div class="flex flex-col gap-2"> 76 76 + <blockquote class="text-lg font-medium text-base-900 dark:text-base-50"> 77 77 + <p> 78 78 + "{quote}" 79 79 + </p> 80 80 + </blockquote> 81 81 + 82 82 + <div class="flex items-center gap-2 text-sm"> 83 83 + <div class="font-medium text-accent-600 dark:text-accent-500">{author?.name}</div> 84 84 + 85 85 + <div class="text-base-600 dark:text-base-400">{author?.role}</div> 86 86 + </div> 87 87 + </div> 88 88 + </div>

+43

src/lib/components/social-icons/All.svelte

Reviewed

··· 1 1 + <script lang="ts"> 2 2 + import Discord from './Discord.svelte'; 3 3 + import Github from './Github.svelte'; 4 4 + import Twitter from './Twitter.svelte'; 5 5 + import Youtube from './Youtube.svelte'; 6 6 + import Bluesky from './Bluesky.svelte'; 7 7 + import Facebook from './Facebook.svelte'; 8 8 + 9 9 + const { 10 10 + discord, 11 11 + github, 12 12 + twitter, 13 13 + youtube, 14 14 + bluesky, 15 15 + facebook, 16 16 + }: { 17 17 + discord?: string; 18 18 + github?: string; 19 19 + twitter?: string; 20 20 + youtube?: string; 21 21 + bluesky?: string; 22 22 + facebook?: string; 23 23 + } = $props(); 24 24 + </script> 25 25 + 26 26 + {#if discord} 27 27 + <Discord href={discord} /> 28 28 + {/if} 29 29 + {#if github} 30 30 + <Github href={github} /> 31 31 + {/if} 32 32 + {#if twitter} 33 33 + <Twitter href={twitter} /> 34 34 + {/if} 35 35 + {#if youtube} 36 36 + <Youtube href={youtube} /> 37 37 + {/if} 38 38 + {#if bluesky} 39 39 + <Bluesky href={bluesky} /> 40 40 + {/if} 41 41 + {#if facebook} 42 42 + <Facebook href={facebook} /> 43 43 + {/if}

+37

src/lib/components/social-icons/Bluesky.svelte

Reviewed

··· 1 1 + <script lang="ts"> 2 2 + import type { WithElementRef, WithoutChildrenOrChild } from 'bits-ui'; 3 3 + import type { HTMLAnchorAttributes } from 'svelte/elements'; 4 4 + 5 5 + const { 6 6 + class: className, 7 7 + target = '_blank', 8 8 + svgClasses, 9 9 + ...restProps 10 10 + }: WithoutChildrenOrChild<WithElementRef<HTMLAnchorAttributes>> & { 11 11 + svgClasses?: string; 12 12 + } = $props(); 13 13 + </script> 14 14 + 15 15 + <a 16 16 + {target} 17 17 + class={[ 18 18 + 'text-base-600 hover:text-base-800 dark:text-base-400 dark:hover:text-base-200', 19 19 + className 20 20 + ]} 21 21 + {...restProps} 22 22 + > 23 23 + <span class="sr-only">Bluesky</span> 24 24 + 25 25 + <svg 26 26 + fill="currentColor" 27 27 + xmlns="http://www.w3.org/2000/svg" 28 28 + viewBox="-40 -40 680 620" 29 29 + version="1.1" 30 30 + class={['size-6', svgClasses]} 31 31 + aria-hidden="true" 32 32 + > 33 33 + <path 34 34 + d="m135.72 44.03c66.496 49.921 138.02 151.14 164.28 205.46 26.262-54.316 97.782-155.54 164.28-205.46 47.98-36.021 125.72-63.892 125.72 24.795 0 17.712-10.155 148.79-16.111 170.07-20.703 73.984-96.144 92.854-163.25 81.433 117.3 19.964 147.14 86.092 82.697 152.22-122.39 125.59-175.91-31.511-189.63-71.766-2.514-7.3797-3.6904-10.832-3.7077-7.8964-0.0174-2.9357-1.1937 0.51669-3.7077 7.8964-13.714 40.255-67.233 197.36-189.63 71.766-64.444-66.128-34.605-132.26 82.697-152.22-67.108 11.421-142.55-7.4491-163.25-81.433-5.9562-21.282-16.111-152.36-16.111-170.07 0-88.687 77.742-60.816 125.72-24.795z" 35 35 + /> 36 36 + </svg> 37 37 + </a>

+39

src/lib/components/social-icons/Discord.svelte

Reviewed

··· 1 1 + <script lang="ts"> 2 2 + import type { WithElementRef, WithoutChildrenOrChild } from 'bits-ui'; 3 3 + import type { HTMLAnchorAttributes } from 'svelte/elements'; 4 4 + 5 5 + const { 6 6 + class: className, 7 7 + target = '_blank', 8 8 + svgClasses, 9 9 + ...restProps 10 10 + }: WithoutChildrenOrChild<WithElementRef<HTMLAnchorAttributes>> & { 11 11 + svgClasses?: string; 12 12 + } = $props(); 13 13 + </script> 14 14 + 15 15 + <a 16 16 + {target} 17 17 + class={[ 18 18 + 'text-base-600 hover:text-base-800 dark:text-base-400 dark:hover:text-base-200', 19 19 + className 20 20 + ]} 21 21 + {...restProps} 22 22 + > 23 23 + <span class="sr-only">Discord</span> 24 24 + 25 25 + <svg 26 26 + class={['size-6', svgClasses]} 27 27 + viewBox="0 -28.5 256 256" 28 28 + fill="currentColor" 29 29 + aria-hidden="true" 30 30 + preserveAspectRatio="xMidYMid" 31 31 + > 32 32 + <g> 33 33 + <path 34 34 + d="M216.856339,16.5966031 C200.285002,8.84328665 182.566144,3.2084988 164.041564,0 C161.766523,4.11318106 159.108624,9.64549908 157.276099,14.0464379 C137.583995,11.0849896 118.072967,11.0849896 98.7430163,14.0464379 C96.9108417,9.64549908 94.1925838,4.11318106 91.8971895,0 C73.3526068,3.2084988 55.6133949,8.86399117 39.0420583,16.6376612 C5.61752293,67.146514 -3.4433191,116.400813 1.08711069,164.955721 C23.2560196,181.510915 44.7403634,191.567697 65.8621325,198.148576 C71.0772151,190.971126 75.7283628,183.341335 79.7352139,175.300261 C72.104019,172.400575 64.7949724,168.822202 57.8887866,164.667963 C59.7209612,163.310589 61.5131304,161.891452 63.2445898,160.431257 C105.36741,180.133187 151.134928,180.133187 192.754523,160.431257 C194.506336,161.891452 196.298154,163.310589 198.110326,164.667963 C191.183787,168.842556 183.854737,172.420929 176.223542,175.320965 C180.230393,183.341335 184.861538,190.991831 190.096624,198.16893 C211.238746,191.588051 232.743023,181.531619 254.911949,164.955721 C260.227747,108.668201 245.831087,59.8662432 216.856339,16.5966031 Z M85.4738752,135.09489 C72.8290281,135.09489 62.4592217,123.290155 62.4592217,108.914901 C62.4592217,94.5396472 72.607595,82.7145587 85.4738752,82.7145587 C98.3405064,82.7145587 108.709962,94.5189427 108.488529,108.914901 C108.508531,123.290155 98.3405064,135.09489 85.4738752,135.09489 Z M170.525237,135.09489 C157.88039,135.09489 147.510584,123.290155 147.510584,108.914901 C147.510584,94.5396472 157.658606,82.7145587 170.525237,82.7145587 C183.391518,82.7145587 193.761324,94.5189427 193.539891,108.914901 C193.539891,123.290155 183.391518,135.09489 170.525237,135.09489 Z" 35 35 + fill-rule="nonzero" 36 36 + /> 37 37 + </g> 38 38 + </svg> 39 39 + </a>

+31

src/lib/components/social-icons/Facebook.svelte

Reviewed

··· 1 1 + <script lang="ts"> 2 2 + import type { WithElementRef, WithoutChildrenOrChild } from 'bits-ui'; 3 3 + import type { HTMLAnchorAttributes } from 'svelte/elements'; 4 4 + 5 5 + const { 6 6 + class: className, 7 7 + target = '_blank', 8 8 + svgClasses, 9 9 + ...restProps 10 10 + }: WithoutChildrenOrChild<WithElementRef<HTMLAnchorAttributes>> & { 11 11 + svgClasses?: string; 12 12 + } = $props(); 13 13 + </script> 14 14 + 15 15 + <a 16 16 + {target} 17 17 + class={[ 18 18 + 'text-base-600 hover:text-base-800 dark:text-base-400 dark:hover:text-base-200', 19 19 + className 20 20 + ]} 21 21 + {...restProps} 22 22 + > 23 23 + <span class="sr-only">Facebook</span> 24 24 + <svg class={['size-6', svgClasses]} fill="currentColor" viewBox="0 0 24 24" aria-hidden="true"> 25 25 + <path 26 26 + fill-rule="evenodd" 27 27 + d="M22 12c0-5.523-4.477-10-10-10S2 6.477 2 12c0 4.991 3.657 9.128 8.438 9.878v-6.987h-2.54V12h2.54V9.797c0-2.506 1.492-3.89 3.777-3.89 1.094 0 2.238.195 2.238.195v2.46h-1.26c-1.243 0-1.63.771-1.63 1.562V12h2.773l-.443 2.89h-2.33v6.988C18.343 21.128 22 16.991 22 12z" 28 28 + clip-rule="evenodd" 29 29 + /> 30 30 + </svg> 31 31 + </a>

+32

src/lib/components/social-icons/Github.svelte

Reviewed

··· 1 1 + <script lang="ts"> 2 2 + import type { WithElementRef, WithoutChildrenOrChild } from 'bits-ui'; 3 3 + import type { HTMLAnchorAttributes } from 'svelte/elements'; 4 4 + 5 5 + const { 6 6 + class: className, 7 7 + target = '_blank', 8 8 + svgClasses, 9 9 + ...restProps 10 10 + }: WithoutChildrenOrChild<WithElementRef<HTMLAnchorAttributes>> & { 11 11 + svgClasses?: string; 12 12 + } = $props(); 13 13 + </script> 14 14 + 15 15 + <a 16 16 + {target} 17 17 + class={[ 18 18 + 'text-base-600 hover:text-base-800 dark:text-base-400 dark:hover:text-base-200', 19 19 + className 20 20 + ]} 21 21 + {...restProps} 22 22 + > 23 23 + <span class="sr-only">GitHub</span> 24 24 + 25 25 + <svg fill="currentColor" viewBox="0 0 24 24" aria-hidden="true" class={['size-6', svgClasses]}> 26 26 + <path 27 27 + fill-rule="evenodd" 28 28 + d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z" 29 29 + clip-rule="evenodd" 30 30 + /> 31 31 + </svg> 32 32 + </a>

+29

src/lib/components/social-icons/Twitter.svelte

Reviewed

··· 1 1 + <script lang="ts"> 2 2 + import type { WithElementRef, WithoutChildrenOrChild } from 'bits-ui'; 3 3 + import type { HTMLAnchorAttributes } from 'svelte/elements'; 4 4 + 5 5 + const { 6 6 + class: className, 7 7 + target = '_blank', 8 8 + svgClasses, 9 9 + ...restProps 10 10 + }: WithoutChildrenOrChild<WithElementRef<HTMLAnchorAttributes>> & { 11 11 + svgClasses?: string; 12 12 + } = $props(); 13 13 + </script> 14 14 + 15 15 + <a 16 16 + {target} 17 17 + class={[ 18 18 + 'text-base-600 hover:text-base-800 dark:text-base-400 dark:hover:text-base-200', 19 19 + className 20 20 + ]} 21 21 + {...restProps} 22 22 + > 23 23 + <span class="sr-only">X</span> 24 24 + <svg class={['size-6', svgClasses]} fill="currentColor" viewBox="0 0 24 24" aria-hidden="true"> 25 25 + <path 26 26 + d="M13.6823 10.6218L20.2391 3H18.6854L12.9921 9.61788L8.44486 3H3.2002L10.0765 13.0074L3.2002 21H4.75404L10.7663 14.0113L15.5685 21H20.8131L13.6819 10.6218H13.6823ZM11.5541 13.0956L10.8574 12.0991L5.31391 4.16971H7.70053L12.1742 10.5689L12.8709 11.5655L18.6861 19.8835H16.2995L11.5541 13.096V13.0956Z" 27 27 + /> 28 28 + </svg> 29 29 + </a>

+31

src/lib/components/social-icons/Youtube.svelte

Reviewed

··· 1 1 + <script lang="ts"> 2 2 + import type { WithElementRef, WithoutChildrenOrChild } from 'bits-ui'; 3 3 + import type { HTMLAnchorAttributes } from 'svelte/elements'; 4 4 + 5 5 + const { 6 6 + class: className, 7 7 + target = '_blank', 8 8 + svgClasses, 9 9 + ...restProps 10 10 + }: WithoutChildrenOrChild<WithElementRef<HTMLAnchorAttributes>> & { 11 11 + svgClasses?: string; 12 12 + } = $props(); 13 13 + </script> 14 14 + 15 15 + <a 16 16 + {target} 17 17 + class={[ 18 18 + 'text-base-600 hover:text-base-800 dark:text-base-400 dark:hover:text-base-200', 19 19 + className 20 20 + ]} 21 21 + {...restProps} 22 22 + > 23 23 + <span class="sr-only">YouTube</span> 24 24 + <svg class={['size-7', svgClasses]} fill="currentColor" viewBox="1 2 21 22" aria-hidden="true"> 25 25 + <path 26 26 + fill-rule="evenodd" 27 27 + d="M19.812 5.418c.861.23 1.538.907 1.768 1.768C21.998 8.746 22 12 22 12s0 3.255-.418 4.814a2.504 2.504 0 0 1-1.768 1.768c-1.56.419-7.814.419-7.814.419s-6.255 0-7.814-.419a2.505 2.505 0 0 1-1.768-1.768C2 15.255 2 12 2 12s0-3.255.417-4.814a2.507 2.507 0 0 1 1.768-1.768C5.744 5 11.998 5 11.998 5s6.255 0 7.814.418ZM15.194 12 10 15V9l5.194 3Z" 28 28 + clip-rule="evenodd" 29 29 + /> 30 30 + </svg> 31 31 + </a>

+7

src/lib/components/social-icons/index.ts

Reviewed

··· 1 1 + export { default as SocialIcons } from './All.svelte'; 2 2 + export { default as Discord } from './Discord.svelte'; 3 3 + export { default as Github } from './Github.svelte'; 4 4 + export { default as Twitter } from './Twitter.svelte'; 5 5 + export { default as Youtube } from './Youtube.svelte'; 6 6 + export { default as Bluesky } from './Bluesky.svelte'; 7 7 + export { default as Facebook } from './Facebook.svelte';

+8 -1

src/lib/components/video-player/FullscreenVideoPlayer.svelte

Reviewed

··· 23 23 24 24 <script lang="ts"> 25 25 import { Portal } from 'bits-ui'; 26 26 - import Plyr from 'plyr'; 26 26 + import { onMount } from 'svelte'; 27 27 28 28 const { class: className }: { class?: string } = $props(); 29 29 30 30 + let Plyr: typeof import('plyr') | undefined = $state(); 31 31 + onMount(async () => { 32 32 + Plyr = (await import('plyr')).default; 33 33 + }); 34 34 + 30 35 $effect(() => { 36 36 + if (!Plyr) return; 37 37 + 31 38 const player = new Plyr('.js-player', { 32 39 settings: ['captions', 'quality', 'loop', 'speed'], 33 40 controls: [

+8 -2

src/lib/components/video-player/VideoPlayer.svelte

Reviewed

··· 1 1 <script lang="ts"> 2 2 - import Plyr from 'plyr'; 3 3 - 2 2 + import { onMount } from 'svelte'; 4 3 const { class: className, id }: { class?: string; id?: string } = $props(); 5 4 5 5 + let Plyr: typeof import('plyr') | undefined = $state(); 6 6 + onMount(async () => { 7 7 + Plyr = (await import('plyr')).default; 8 8 + }); 9 9 + 6 10 $effect(() => { 11 11 + if (!Plyr) return; 12 12 + 7 13 const player = new Plyr('.js-player', { 8 14 settings: ['captions', 'quality', 'loop', 'speed'], 9 15 controls: [

+2 -2

src/lib/preview/assets/demo.svg

Reviewed

··· 1 1 - <svg version="1.1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 957.5518503049516 831.9489564142759" width="957.5518503049516" height="831.9489564142759" filter="invert(93%) hue-rotate(180deg)"><!-- svg-source:excalidraw --><metadata></metadata><defs><style class="style-fonts"> 2 2 - @font-face { font-family: Excalifont; src: url(data:font/woff2;base64,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); }</style></defs><g stroke-linecap="round" transform="translate(24.30911971770547 10) rotate(0 174.34944405745455 137.57372129996224)"><path d="M-0.18 -2.3 C97.09 2.04, 192.73 2.09, 347.74 0.8 M0.28 -0.8 C106.95 -1.38, 214.45 -0.76, 349.72 -1.21 M346.3 2.31 C348.75 99.69, 348.48 201.46, 348.5 275.45 M347.63 0.02 C345.65 104.52, 347.47 209.53, 347.64 276.3 M349.77 274.39 C259.89 275.82, 168.08 275.71, -2.25 276.84 M349.56 275.84 C235.52 273.33, 119.59 273.03, -0.25 275.68 M1.72 275.24 C4.79 169.17, 6.39 61.12, -1.77 -0.05 M-0.73 273.82 C-1.22 164.18, -2.14 55.67, -1.27 0.36" stroke="#1e1e1e" stroke-width="1" fill="none"></path></g><g transform="translate(58.79863945875377 130.07372129996224) rotate(0 139.85992431640625 17.5)"><text x="139.85992431640625" y="24.668" font-family="Excalifont, Xiaolai, Segoe UI Emoji" font-size="28px" fill="#1e1e1e" text-anchor="middle" style="white-space: pre;" direction="ltr" dominant-baseline="alphabetic">Making a cool UI Kit</text></g><g stroke-linecap="round" transform="translate(576.1461045044684 172.97087228661985) rotate(0 185.70287290024157 210.97710290533348)"><path d="M183.55 -0.49 C240.84 62.55, 295.67 123.09, 370.66 212.01 M185.98 -0.2 C233.74 51.56, 281.7 105.73, 371.06 211.19 M369.86 208.37 C322.81 267.53, 273 319.37, 188.43 420.66 M372.9 209.47 C308.09 282.84, 244.54 355.37, 186.37 423.05 M187.12 424.17 C125.79 356.81, 72.22 288.8, -2.94 209.33 M186.4 421.31 C127.13 352.85, 67.87 285.71, 0.39 210.61 M1.06 208.51 C50.11 156.74, 99.99 96.35, 188.39 -0.14 M-1.06 211.83 C59.77 143.56, 119.77 73.61, 186.51 1.11" stroke="#1e1e1e" stroke-width="1" fill="none"></path></g><g transform="translate(702.3855719604485 331.45942373928665) rotate(0 59.611968994140625 52.5)"><text x="59.611968994140625" y="24.668" font-family="Excalifont, Xiaolai, Segoe UI Emoji" font-size="28px" fill="#1e1e1e" text-anchor="middle" style="white-space: pre;" direction="ltr" dominant-baseline="alphabetic">Eating a</text><text x="59.611968994140625" y="59.668" font-family="Excalifont, Xiaolai, Segoe UI Emoji" font-size="28px" fill="#1e1e1e" text-anchor="middle" style="white-space: pre;" direction="ltr" dominant-baseline="alphabetic">chicken</text><text x="59.611968994140625" y="94.668" font-family="Excalifont, Xiaolai, Segoe UI Emoji" font-size="28px" fill="#1e1e1e" text-anchor="middle" style="white-space: pre;" direction="ltr" dominant-baseline="alphabetic">sandwich</text></g><g stroke-linecap="round"><g transform="translate(381.562190686112 134.4966050565847) rotate(0 142.14414688726515 67.60653986108412)"><path d="M-0.63 -0.6 C26.23 5.83, 111.8 18, 159.58 40.57 C207.36 63.13, 265.26 118.75, 286.05 134.79 M4.22 -3.4 C30.9 2.14, 110.79 13.46, 157.62 36.97 C204.45 60.48, 263.98 121.89, 285.2 137.67" stroke="#1e1e1e" stroke-width="1" fill="none"></path></g><g transform="translate(381.562190686112 134.4966050565847) rotate(0 142.14414688726515 67.60653986108412)"><path d="M261.41 129.14 C269.44 132.25, 272.96 133.2, 286.36 137.53 M262.09 127.93 C267.66 129.76, 272.13 131.92, 284.77 137.63" stroke="#1e1e1e" stroke-width="1" fill="none"></path></g><g transform="translate(381.562190686112 134.4966050565847) rotate(0 142.14414688726515 67.60653986108412)"><path d="M272.59 116.21 C278 122.44, 278.8 126.53, 286.36 137.53 M273.28 115 C276.24 119.84, 278.19 124.9, 284.77 137.63" stroke="#1e1e1e" stroke-width="1" fill="none"></path></g></g><mask></mask><g stroke-linecap="round" transform="translate(10 481.01643940737586) rotate(0 197.5843032320263 170.46625850345004)"><path d="M290.71 18.63 C307.69 23.32, 321.18 34.98, 334.27 46.09 C347.35 57.19, 360.02 70.8, 369.21 85.27 C378.41 99.75, 384.96 117.03, 389.42 132.93 C393.88 148.84, 397.09 164.7, 395.98 180.7 C394.86 196.71, 388.77 213.96, 382.74 228.97 C376.72 243.99, 370.45 258, 359.82 270.77 C349.19 283.55, 334.14 296.19, 318.96 305.63 C303.78 315.08, 285.93 322.01, 268.75 327.45 C251.56 332.89, 233.96 336.84, 215.87 338.27 C197.77 339.69, 178.19 339.02, 160.18 335.98 C142.16 332.94, 124.13 326.87, 107.79 320.01 C91.45 313.14, 75.92 305.58, 62.14 294.8 C48.36 284.02, 34.78 269.38, 25.1 255.32 C15.42 241.26, 8.04 226.28, 4.06 210.42 C0.09 194.55, -0.23 176.04, 1.23 160.12 C2.69 144.21, 6.61 130.12, 12.83 114.94 C19.06 99.77, 27.87 82.28, 38.6 69.07 C49.34 55.86, 63 45.16, 77.24 35.66 C91.48 26.17, 107.15 18.16, 124.03 12.11 C140.92 6.06, 160.16 0.83, 178.56 -0.63 C196.96 -2.08, 214.3 -0.82, 234.45 3.38 C254.59 7.58, 286.54 19.05, 299.45 24.56 C312.36 30.08, 313.03 33.98, 311.89 36.48 M43.35 69.19 C52.07 55.04, 66.63 41.77, 81.31 32.15 C95.99 22.52, 114.02 16.46, 131.43 11.44 C148.85 6.42, 167.84 3.58, 185.79 2.02 C203.73 0.47, 221.49 -1.6, 239.1 2.12 C256.71 5.84, 275.31 16.39, 291.47 24.35 C307.64 32.31, 322.36 39.33, 336.11 49.89 C349.86 60.45, 365.08 73.54, 373.98 87.74 C382.87 101.94, 385.98 119.25, 389.47 135.08 C392.97 150.91, 396.16 166.98, 394.96 182.7 C393.75 198.42, 388.91 213.94, 382.25 229.42 C375.58 244.9, 366.04 262.56, 354.96 275.59 C343.89 288.61, 331.19 297.97, 315.81 307.55 C300.44 317.12, 280.04 327.37, 262.73 333.06 C245.43 338.75, 230.41 341.51, 211.98 341.69 C193.55 341.87, 170.29 338.01, 152.15 334.12 C134.02 330.23, 118.82 325.57, 103.17 318.36 C87.51 311.15, 71.28 302.15, 58.23 290.86 C45.18 279.57, 34.08 265.08, 24.85 250.61 C15.63 236.14, 6.75 219.98, 2.88 204.04 C-0.99 188.1, 0.1 170.73, 1.64 154.95 C3.18 139.18, 5.34 124.3, 12.13 109.38 C18.92 94.45, 37.6 71.62, 42.38 65.4 C47.17 59.18, 38.76 70.27, 40.85 72.06" stroke="#1e1e1e" stroke-width="1" fill="none"></path></g><g transform="translate(81.95916103232116 598.9448505595374) rotate(0 125.41194152832043 52.5)"><text x="125.41194152832031" y="24.668" font-family="Excalifont, Xiaolai, Segoe UI Emoji" font-size="28px" fill="#1e1e1e" text-anchor="middle" style="white-space: pre;" direction="ltr" dominant-baseline="alphabetic">Building</text><text x="125.41194152832031" y="59.668" font-family="Excalifont, Xiaolai, Segoe UI Emoji" font-size="28px" fill="#1e1e1e" text-anchor="middle" style="white-space: pre;" direction="ltr" dominant-baseline="alphabetic">sandcastles in the</text><text x="125.41194152832031" y="94.668" font-family="Excalifont, Xiaolai, Segoe UI Emoji" font-size="28px" fill="#1e1e1e" text-anchor="middle" style="white-space: pre;" direction="ltr" dominant-baseline="alphabetic">sand (duuuh)</text></g><g stroke-linecap="round"><g transform="translate(669.7392573319908 492.39221751953846) rotate(0 -132.03389615349397 62.99141573502993)"><path d="M-0.47 -2.76 C-19.81 13.06, -71.67 72.81, -115.92 94.13 C-160.17 115.46, -241.35 119.61, -265.99 125.17 M-4.17 1.91 C-23.72 17.06, -74.49 69.43, -117.16 90.42 C-159.83 111.41, -235.89 122.52, -260.2 127.84" stroke="#1e1e1e" stroke-width="1" fill="none"></path></g><g transform="translate(669.7392573319908 492.39221751953846) rotate(0 -132.03389615349397 62.99141573502993)"><path d="M-240.72 116.32 C-243.6 117.5, -252.39 123, -259.09 129.15 M-239.27 114.78 C-244.67 117.98, -248.5 121.34, -260.23 127.88" stroke="#1e1e1e" stroke-width="1" fill="none"></path></g><g transform="translate(669.7392573319908 492.39221751953846) rotate(0 -132.03389615349397 62.99141573502993)"><path d="M-237.49 133.11 C-241.3 129.18, -251.08 129.58, -259.09 129.15 M-236.04 131.57 C-242.35 130.53, -247 129.65, -260.23 127.88" stroke="#1e1e1e" stroke-width="1" fill="none"></path></g></g><mask></mask><g transform="translate(238.9514855336056 754.783937760571) rotate(0 24.13819836244329 -3.508298457347621)" stroke="none"><path fill="#1e1e1e" d="M 2.17,-1.36 Q 2.17,-1.36 2.83,-0.35 3.48,0.65 4.01,1.66 4.53,2.68 5.27,4.44 6.01,6.21 6.85,8.49 7.70,10.77 8.14,11.91 8.58,13.04 9.27,14.87 9.97,16.69 10.76,18.26 11.55,19.82 11.89,20.96 12.23,22.09 13.06,23.50 13.89,24.92 14.29,25.53 14.69,26.15 14.74,26.53 14.80,26.90 14.77,27.28 14.74,27.67 14.62,28.03 14.49,28.39 14.29,28.71 14.08,29.03 13.80,29.30 13.52,29.56 13.19,29.75 12.86,29.94 12.49,30.04 12.12,30.15 11.74,30.16 11.36,30.18 10.99,30.10 10.61,30.02 10.27,29.85 9.92,29.69 9.63,29.44 9.33,29.20 9.10,28.89 8.88,28.59 8.73,28.23 8.58,27.88 8.67,26.75 8.76,25.62 9.82,23.30 10.87,20.98 11.64,19.35 12.41,17.71 13.54,15.69 14.68,13.66 15.87,11.52 17.07,9.38 18.67,6.38 20.28,3.38 22.41,-0.45 24.54,-4.28 26.11,-7.20 27.69,-10.12 28.98,-12.37 30.28,-14.62 32.05,-17.20 33.83,-19.79 34.84,-21.35 35.85,-22.92 36.49,-23.94 37.14,-24.97 37.76,-25.95 38.39,-26.92 39.43,-27.69 40.48,-28.45 41.22,-29.27 41.96,-30.09 42.46,-31.61 42.95,-33.13 45.37,-35.15 47.80,-37.17 48.29,-37.17 48.78,-37.17 49.24,-37.01 49.70,-36.85 50.09,-36.55 50.48,-36.26 50.75,-35.85 51.03,-35.44 51.15,-34.97 51.28,-34.50 51.26,-34.01 51.23,-33.52 51.04,-33.06 50.86,-32.61 50.54,-32.24 50.22,-31.87 49.80,-31.61 49.38,-31.36 48.90,-31.26 48.42,-31.16 47.93,-31.21 47.45,-31.27 47.00,-31.48 46.56,-31.68 46.21,-32.02 45.85,-32.36 45.62,-32.80 45.40,-33.23 45.32,-33.71 45.24,-34.20 45.32,-34.68 45.41,-35.16 45.64,-35.60 45.87,-36.03 46.23,-36.36 46.58,-36.70 47.03,-36.90 47.47,-37.11 47.96,-37.16 48.45,-37.21 48.93,-37.10 49.41,-36.99 49.82,-36.74 50.24,-36.48 50.56,-36.11 50.87,-35.73 51.05,-35.28 51.23,-34.82 51.26,-34.33 51.28,-33.84 51.15,-33.37 51.01,-32.90 50.74,-32.49 50.46,-32.09 50.07,-31.79 49.68,-31.50 49.21,-31.35 48.75,-31.19 48.75,-31.19 48.75,-31.19 48.55,-31.11 48.35,-31.02 47.58,-29.67 46.81,-28.31 45.91,-27.06 45.02,-25.80 43.44,-25.16 41.86,-24.52 40.91,-23.67 39.95,-22.83 39.19,-22.01 38.42,-21.19 37.36,-19.66 36.29,-18.13 34.63,-15.63 32.98,-13.12 31.78,-10.87 30.59,-8.62 29.10,-5.63 27.62,-2.64 25.66,1.21 23.70,5.07 22.29,8.15 20.89,11.23 19.97,13.45 19.05,15.68 18.31,17.71 17.57,19.75 17.02,21.45 16.48,23.15 15.58,24.65 14.69,26.15 14.74,26.53 14.80,26.90 14.77,27.28 14.74,27.67 14.62,28.03 14.49,28.39 14.29,28.71 14.08,29.03 13.80,29.30 13.53,29.56 13.19,29.75 12.86,29.94 12.49,30.04 12.12,30.15 11.74,30.16 11.36,30.18 10.99,30.10 10.61,30.02 10.27,29.85 9.92,29.69 9.63,29.44 9.33,29.20 9.10,28.89 8.88,28.59 8.73,28.23 8.58,27.88 8.52,27.82 8.47,27.76 8.08,26.67 7.69,25.58 7.07,24.06 6.46,22.55 5.93,21.54 5.41,20.53 4.98,19.43 4.55,18.34 4.01,16.66 3.46,14.99 3.07,13.92 2.68,12.85 1.95,11.28 1.23,9.71 0.73,8.12 0.23,6.52 -0.35,4.96 -0.94,3.41 -1.56,2.38 -2.17,1.36 -2.31,1.07 -2.44,0.79 -2.50,0.49 -2.56,0.19 -2.54,-0.11 -2.53,-0.42 -2.44,-0.72 -2.35,-1.02 -2.20,-1.28 -2.04,-1.55 -1.82,-1.77 -1.61,-1.99 -1.35,-2.16 -1.08,-2.32 -0.79,-2.42 -0.49,-2.52 -0.18,-2.54 0.11,-2.56 0.42,-2.51 0.72,-2.46 1.01,-2.34 1.29,-2.21 1.54,-2.02 1.79,-1.84 1.98,-1.60 2.17,-1.35 2.17,-1.35 L 2.17,-1.36 Z"></path></g><g transform="translate(168.59214560554028 218.28499287995078) rotate(0 14.12987921994727 2.892274397514143)" stroke="none"><path fill="#1e1e1e" d="M 2.51,-0.22 Q 2.51,-0.22 2.60,1.53 2.69,3.28 3.16,5.31 3.63,7.35 4.43,8.88 5.22,10.42 5.80,11.86 6.39,13.30 6.79,14.32 7.19,15.34 7.67,16.38 8.15,17.43 8.48,18.61 8.81,19.80 9.33,21.38 9.86,22.96 10.21,24.39 10.55,25.83 8.85,26.59 7.15,27.35 7.38,24.92 7.61,22.48 8.29,20.59 8.97,18.69 9.83,16.31 10.70,13.92 11.92,10.75 13.15,7.59 14.10,5.29 15.04,2.99 15.90,0.73 16.76,-1.53 17.59,-3.81 18.42,-6.09 19.18,-8.07 19.94,-10.05 21.00,-12.37 22.06,-14.70 22.55,-16.15 23.05,-17.61 23.57,-19.24 24.08,-20.87 25.67,-23.33 27.26,-25.79 27.60,-25.90 27.94,-26.01 28.30,-26.00 28.65,-25.99 28.99,-25.87 29.32,-25.75 29.60,-25.53 29.88,-25.31 30.08,-25.01 30.27,-24.72 30.36,-24.37 30.45,-24.03 30.42,-23.67 30.39,-23.32 30.26,-22.99 30.12,-22.66 29.88,-22.39 29.65,-22.12 29.34,-21.95 29.03,-21.77 28.68,-21.70 28.33,-21.63 27.98,-21.68 27.63,-21.72 27.31,-21.88 26.98,-22.03 26.73,-22.28 26.48,-22.53 26.32,-22.85 26.16,-23.17 26.11,-23.52 26.05,-23.87 26.12,-24.22 26.18,-24.57 26.36,-24.88 26.53,-25.19 26.79,-25.43 27.05,-25.67 27.38,-25.82 27.71,-25.96 28.06,-25.99 28.42,-26.02 28.76,-25.94 29.11,-25.86 29.41,-25.67 29.71,-25.48 29.94,-25.20 30.16,-24.93 30.29,-24.59 30.41,-24.26 30.43,-23.91 30.44,-23.55 30.34,-23.21 30.23,-22.87 30.03,-22.58 29.82,-22.29 29.54,-22.08 29.25,-21.87 29.25,-21.87 29.25,-21.87 28.50,-20.53 27.75,-19.19 26.92,-17.78 26.08,-16.38 25.41,-14.95 24.74,-13.52 23.77,-11.25 22.80,-8.99 22.11,-7.03 21.42,-5.07 20.68,-2.75 19.95,-0.42 19.21,1.91 18.46,4.25 17.70,6.58 16.95,8.90 15.99,12.04 15.03,15.17 14.47,17.68 13.92,20.18 13.53,21.83 13.14,23.47 12.94,25.37 12.74,27.26 12.02,28.97 11.30,30.67 10.01,31.20 8.73,31.72 7.02,30.28 5.30,28.83 4.87,27.33 4.45,25.83 4.17,24.38 3.89,22.92 3.55,21.27 3.21,19.63 2.34,17.44 1.47,15.26 1.05,14.18 0.63,13.10 0.12,12.11 -0.38,11.12 -0.87,9.70 -1.37,8.29 -1.55,7.14 -1.74,5.98 -1.91,4.84 -2.08,3.70 -2.29,1.96 -2.51,0.22 -2.50,-0.08 -2.49,-0.38 -2.41,-0.67 -2.32,-0.97 -2.17,-1.23 -2.02,-1.50 -1.81,-1.72 -1.61,-1.94 -1.35,-2.10 -1.09,-2.27 -0.81,-2.37 -0.52,-2.46 -0.21,-2.49 0.08,-2.52 0.38,-2.47 0.68,-2.42 0.96,-2.31 1.24,-2.19 1.49,-2.01 1.73,-1.83 1.92,-1.59 2.12,-1.36 2.25,-1.09 2.38,-0.81 2.45,-0.51 2.51,-0.22 2.51,-0.22 L 2.51,-0.22 Z"></path></g><g transform="translate(740.4447941531953 481.5952230826724) rotate(0 16.000050917289173 15.138169721468103)" stroke="none"><path fill="#1e1e1e" d="M 1.06,-1.81 Q 1.06,-1.81 2.61,-0.87 4.16,0.07 5.59,1.39 7.03,2.71 8.30,3.76 9.58,4.82 10.84,6.17 12.09,7.53 13.91,9.72 15.73,11.92 16.82,13.05 17.91,14.18 19.13,15.45 20.35,16.72 21.44,17.76 22.52,18.80 23.53,19.75 24.54,20.70 25.62,21.96 26.70,23.23 27.73,24.00 28.75,24.77 30.12,25.71 31.48,26.65 32.65,27.62 33.82,28.59 34.11,28.89 34.39,29.18 34.56,29.55 34.74,29.91 34.78,30.32 34.83,30.72 34.75,31.12 34.66,31.52 34.46,31.87 34.25,32.22 33.94,32.48 33.64,32.75 33.26,32.90 32.88,33.06 32.48,33.08 32.07,33.11 31.68,33.00 31.29,32.90 30.95,32.67 30.61,32.45 30.36,32.13 30.11,31.81 29.98,31.42 29.84,31.04 29.84,30.63 29.84,30.22 29.96,29.84 30.09,29.45 30.33,29.13 30.58,28.80 30.91,28.57 31.24,28.34 31.64,28.22 32.03,28.11 32.43,28.13 32.84,28.15 33.22,28.30 33.60,28.44 33.91,28.70 34.22,28.96 34.43,29.31 34.65,29.66 34.74,30.05 34.83,30.45 34.79,30.85 34.75,31.26 34.58,31.63 34.41,32.00 34.14,32.30 33.86,32.60 33.50,32.79 33.15,32.98 32.74,33.05 32.34,33.12 31.94,33.06 31.54,33.00 31.18,32.81 30.82,32.62 30.82,32.62 30.82,32.62 29.74,31.61 28.66,30.60 27.34,29.38 26.01,28.17 24.72,27.07 23.43,25.97 22.49,24.82 21.55,23.66 20.60,22.64 19.66,21.61 18.63,20.50 17.59,19.39 16.33,18.08 15.06,16.77 14.02,15.57 12.98,14.36 11.04,12.32 9.10,10.28 8.04,9.12 6.98,7.95 5.61,6.82 4.23,5.68 3.15,4.63 2.07,3.59 0.50,2.70 -1.06,1.81 -1.26,1.66 -1.47,1.50 -1.62,1.31 -1.78,1.11 -1.89,0.88 -2.00,0.65 -2.05,0.40 -2.10,0.15 -2.08,-0.10 -2.07,-0.35 -2.00,-0.59 -1.93,-0.84 -1.80,-1.05 -1.67,-1.27 -1.49,-1.46 -1.31,-1.64 -1.10,-1.77 -0.88,-1.91 -0.64,-1.98 -0.40,-2.06 -0.15,-2.08 0.10,-2.10 0.35,-2.06 0.60,-2.01 0.83,-1.91 1.06,-1.81 1.06,-1.81 L 1.06,-1.81 Z"></path></g><g transform="translate(737.7210285792235 512.9599637793058) rotate(0 17.245911235606854 -17.856410415980122)" stroke="none"><path fill="#1e1e1e" d="M -1.37,-1.09 Q -1.37,-1.09 0.32,-3.13 2.02,-5.18 3.33,-6.98 4.63,-8.79 6.47,-10.85 8.31,-12.90 9.94,-14.83 11.58,-16.75 13.63,-18.93 15.68,-21.10 17.68,-22.93 19.69,-24.75 21.30,-26.29 22.92,-27.83 24.08,-29.08 25.24,-30.32 26.22,-31.42 27.21,-32.52 28.38,-33.62 29.56,-34.72 31.77,-36.12 33.98,-37.52 34.29,-37.56 34.59,-37.59 34.89,-37.52 35.18,-37.46 35.44,-37.30 35.71,-37.14 35.90,-36.91 36.10,-36.68 36.21,-36.40 36.33,-36.11 36.34,-35.81 36.36,-35.50 36.28,-35.21 36.20,-34.92 36.02,-34.67 35.85,-34.41 35.61,-34.23 35.37,-34.04 35.08,-33.95 34.79,-33.85 34.49,-33.85 34.18,-33.85 33.89,-33.95 33.60,-34.04 33.36,-34.23 33.12,-34.41 32.95,-34.66 32.78,-34.92 32.70,-35.21 32.61,-35.50 32.63,-35.81 32.65,-36.11 32.76,-36.40 32.87,-36.68 33.07,-36.91 33.27,-37.14 33.53,-37.30 33.79,-37.46 34.09,-37.52 34.38,-37.59 34.69,-37.56 34.99,-37.52 35.27,-37.39 35.54,-37.27 35.76,-37.06 35.99,-36.85 36.13,-36.58 36.27,-36.31 36.32,-36.01 36.37,-35.71 36.32,-35.41 36.27,-35.11 36.13,-34.84 35.99,-34.57 35.76,-34.36 35.54,-34.15 35.27,-34.02 34.99,-33.89 34.99,-33.89 34.99,-33.89 33.46,-32.93 31.94,-31.97 30.76,-31.04 29.59,-30.11 28.48,-29.13 27.36,-28.15 26.09,-27.01 24.81,-25.87 23.18,-24.29 21.55,-22.72 19.64,-20.95 17.74,-19.18 15.76,-17.05 13.79,-14.91 12.17,-12.93 10.54,-10.94 8.86,-8.98 7.18,-7.02 5.89,-5.08 4.59,-3.13 2.98,-1.01 1.37,1.09 1.22,1.24 1.07,1.39 0.89,1.50 0.71,1.61 0.50,1.67 0.30,1.73 0.09,1.74 -0.12,1.75 -0.32,1.71 -0.53,1.67 -0.73,1.58 -0.92,1.50 -1.09,1.36 -1.25,1.23 -1.38,1.06 -1.51,0.89 -1.60,0.70 -1.68,0.51 -1.72,0.30 -1.76,0.09 -1.74,-0.12 -1.73,-0.33 -1.66,-0.53 -1.60,-0.73 -1.48,-0.91 -1.37,-1.09 -1.37,-1.09 L -1.37,-1.09 Z"></path></g></svg> 1 1 + <svg version="1.1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1098.1581271772438 257.514568002161" width="1098.1581271772438" height="257.514568002161" filter="invert(93%) hue-rotate(180deg)"><!-- svg-source:excalidraw --><metadata></metadata><defs><style class="style-fonts"> 2 2 + @font-face { font-family: Excalifont; src: url(data:font/woff2;base64,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); }</style></defs><g stroke-linecap="round" transform="translate(10 66.78471109388693) rotate(0 135.6523653909527 70.56376046809953)"><path d="M2.36 1.01 C62.02 0.61, 129.56 0.81, 271.55 0.7 M-0.28 -0.3 C74.51 2.34, 152.38 2.46, 271.81 -1.51 M269.82 -3.16 C268 53.81, 267.38 100.6, 271.78 137.65 M272.28 -1.06 C272.55 33.25, 272.49 64.42, 273.3 142.13 M270.6 139.4 C182.56 137.36, 91.46 139.85, 1.81 142.58 M272.4 140.28 C208.45 140.81, 148.3 140.54, 1.37 140.02 M2.02 138.57 C4.78 104.07, 3.76 69.39, -3.98 3.69 M0.05 141.42 C0.16 96.56, -0.37 48.86, -0.53 0.42" stroke="#1e1e1e" stroke-width="1" fill="none"></path></g><g transform="translate(15.926413242515082 92.34847156198657) rotate(0 129.7259521484375 45)"><text x="129.7259521484375" y="31.716" font-family="Excalifont, Xiaolai, Segoe UI Emoji" font-size="36px" fill="#1e1e1e" text-anchor="middle" style="white-space: pre;" direction="ltr" dominant-baseline="alphabetic">Create a graph</text><text x="129.7259521484375" y="76.71600000000001" font-family="Excalifont, Xiaolai, Segoe UI Emoji" font-size="36px" fill="#1e1e1e" text-anchor="middle" style="white-space: pre;" direction="ltr" dominant-baseline="alphabetic">in Excalidraw</text></g><g stroke-linecap="round" transform="translate(815.8202439362449 39.11611475625432) rotate(0 136.16894162049948 102.5)"><path d="M141.45 -1.23 C155.91 -2.36, 170.51 3.94, 184.58 8.62 C198.66 13.31, 214.23 19.12, 225.91 26.88 C237.59 34.64, 246.89 44.84, 254.67 55.18 C262.45 65.51, 270.06 77.6, 272.58 88.89 C275.1 100.18, 273.43 111.79, 269.78 122.93 C266.12 134.07, 258.71 145.68, 250.63 155.71 C242.55 165.74, 233.23 175.99, 221.28 183.09 C209.32 190.18, 193.98 194.51, 178.93 198.28 C163.88 202.05, 146.8 205.97, 130.97 205.69 C115.14 205.41, 98.04 201.1, 83.94 196.59 C69.84 192.09, 57.41 186.21, 46.38 178.65 C35.35 171.09, 24.91 161.24, 17.74 151.23 C10.58 141.22, 5.72 130.31, 3.37 118.58 C1.02 106.86, 0.65 92.79, 3.62 80.89 C6.59 68.99, 13.35 56.95, 21.22 47.18 C29.09 37.4, 38.55 29.5, 50.83 22.24 C63.12 14.99, 71.01 5.7, 94.91 3.64 C118.82 1.58, 171.2 4.67, 194.26 9.89 C217.32 15.1, 234.22 33.27, 233.26 34.95 M203.6 12.5 C218.33 17.03, 232.15 27.6, 241.88 36.35 C251.61 45.1, 257.25 53.87, 261.99 65.01 C266.74 76.15, 270.04 91.42, 270.37 103.2 C270.7 114.99, 269.27 125.2, 263.98 135.72 C258.69 146.24, 248.3 156.67, 238.63 166.3 C228.96 175.93, 219.18 187.64, 205.96 193.49 C192.74 199.35, 174.58 200.09, 159.32 201.42 C144.05 202.76, 129.48 202.91, 114.35 201.49 C99.22 200.08, 81.65 198.49, 68.54 192.92 C55.42 187.34, 45.2 177.1, 35.66 168.04 C26.12 158.97, 16.99 149.14, 11.29 138.53 C5.58 127.92, 2.25 116.17, 1.43 104.4 C0.6 92.62, 1.31 78.9, 6.32 67.88 C11.32 56.86, 21.53 46.96, 31.47 38.28 C41.4 29.6, 52.53 21.77, 65.9 15.8 C79.28 9.82, 96.58 4.4, 111.7 2.43 C126.82 0.46, 141.25 2.51, 156.62 3.97 C172 5.42, 196.48 8.95, 203.95 11.17 C211.42 13.38, 202.23 15.24, 201.45 17.25" stroke="#1e1e1e" stroke-width="1" fill="none"></path></g><g transform="translate(861.3752311377848 96.63766968463324) rotate(0 90.82797241210938 45)"><text x="90.82797241210938" y="31.716" font-family="Excalifont, Xiaolai, Segoe UI Emoji" font-size="36px" fill="#1e1e1e" text-anchor="middle" style="white-space: pre;" direction="ltr" dominant-baseline="alphabetic">Use as a</text><text x="90.82797241210938" y="76.71600000000001" font-family="Excalifont, Xiaolai, Segoe UI Emoji" font-size="36px" fill="#1e1e1e" text-anchor="middle" style="white-space: pre;" direction="ltr" dominant-baseline="alphabetic">component</text></g><g stroke-linecap="round" transform="translate(414.3162037907905 10) rotate(0 144.20211635590613 118.7572840010805)"><path d="M144.57 -1.12 C174.79 28.1, 207.41 49.63, 289.34 117.32 M145.56 -0.38 C180.67 26.31, 214.82 57.02, 287.26 119.16 M289.43 122.78 C259.71 139.8, 232.66 168.59, 148.87 235.79 M288.18 117.29 C251.8 146.89, 218.34 175.86, 143.52 239.13 M147.41 233.95 C111.22 210.22, 79.78 182.55, -2.18 118.24 M143.29 237.23 C99.77 203.03, 57.43 169.51, 1.94 118.46 M-1.39 117.43 C37.07 92.31, 79.74 55.81, 145 0.92 M-1.47 117.83 C47.61 77.49, 99.41 38.32, 143.32 0.17" stroke="#1e1e1e" stroke-width="1" fill="none"></path></g><g transform="translate(495.5432843076105 83.87864200054037) rotate(0 62.87397766113281 45)"><text x="62.87397766113281" y="31.716" font-family="Excalifont, Xiaolai, Segoe UI Emoji" font-size="36px" fill="#1e1e1e" text-anchor="middle" style="white-space: pre;" direction="ltr" dominant-baseline="alphabetic">Export</text><text x="62.87397766113281" y="76.71600000000001" font-family="Excalifont, Xiaolai, Segoe UI Emoji" font-size="36px" fill="#1e1e1e" text-anchor="middle" style="white-space: pre;" direction="ltr" dominant-baseline="alphabetic">as SVG</text></g><g stroke-linecap="round"><g transform="translate(289.9345924990341 128.0942984658334) rotate(0 58.66644832232794 -0.5622745147453543)"><path d="M-1.57 1.67 C17.35 1.51, 94.72 -0.86, 114.68 -1.33 M2.78 0.11 C22.41 0.44, 100.62 1.89, 119.64 2.19" stroke="#1e1e1e" stroke-width="1" fill="none"></path></g><g transform="translate(289.9345924990341 128.0942984658334) rotate(0 58.66644832232794 -0.5622745147453543)"><path d="M97.2 8.44 C103.97 8.32, 112.2 5.39, 120.1 1.21 M96.34 10.89 C100.25 8.35, 106.12 6.14, 119.97 3.19" stroke="#1e1e1e" stroke-width="1" fill="none"></path></g><g transform="translate(289.9345924990341 128.0942984658334) rotate(0 58.66644832232794 -0.5622745147453543)"><path d="M97.5 -8.66 C104.15 -2.92, 112.27 0.01, 120.1 1.21 M96.64 -6.21 C100.34 -5.04, 106.14 -3.53, 119.97 3.19" stroke="#1e1e1e" stroke-width="1" fill="none"></path></g></g><mask></mask><g stroke-linecap="round"><g transform="translate(709.944766750602 130.6514274457768) rotate(0 52.049792246114066 2.8372606677794465)"><path d="M-0.2 1.49 C17.61 1.93, 88.56 2.77, 106.41 3.26 M-3.76 -0.17 C13.94 0.49, 87.03 4.4, 105.42 5.58" stroke="#1e1e1e" stroke-width="1" fill="none"></path></g><g transform="translate(709.944766750602 130.6514274457768) rotate(0 52.049792246114066 2.8372606677794465)"><path d="M82.54 14.41 C86.51 12.75, 94.14 10.16, 105.52 7.23 M81.56 12.41 C87.56 10.69, 91.65 9.98, 106.21 5.41" stroke="#1e1e1e" stroke-width="1" fill="none"></path></g><g transform="translate(709.944766750602 130.6514274457768) rotate(0 52.049792246114066 2.8372606677794465)"><path d="M83.53 -2.66 C87.26 0.5, 94.6 2.74, 105.52 7.23 M82.55 -4.66 C88.41 -2.58, 92.29 0.51, 106.21 5.41" stroke="#1e1e1e" stroke-width="1" fill="none"></path></g></g><mask></mask></svg>

-10

src/lib/preview/assets/excalidraw-demo.svg

Reviewed

··· 1 1 - <svg version="1.1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1939.1623859019862 600.0397711142972" width="3878.3247718039725" height="1200.0795422285944"> 2 2 - <!-- svg-source:excalidraw --> 3 3 - 4 4 - <defs> 5 5 - <style class="style-fonts"> 6 6 - @font-face { font-family: Virgil; src: url(data:font/woff2;base64,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); } 7 7 - </style> 8 8 - 9 9 - </defs> 10 10 - <g stroke-linecap="round" transform="translate(10 194.83617716312494) rotate(0 179.22024490540377 115.07477526841058)"><path d="M-1.09 -1.3 C142.12 2.72, 286.86 2.78, 358.26 -2.02 M0.25 -0.76 C78.5 3.33, 156.39 2.73, 358.59 -0.47 M355.96 -2.43 C357.84 61.7, 358.11 131.1, 357.4 230.93 M359.29 1.12 C355.21 74.48, 354.62 151.54, 358.04 230.29 M359.44 230.93 C246.36 230.18, 132.02 229.81, -1.66 228.88 M358.41 230.99 C259.38 231.79, 159.82 231.97, 0.58 229.6 M0.41 232.19 C3.6 137.84, 3.51 46.94, -0.37 -3.18 M0.87 230.18 C0.77 153.91, 0.67 78.96, -0.63 -1.57" stroke="#1e1e1e" stroke-width="2" fill="none"></path></g><g transform="translate(65.43427993958335 219.91095243153552) rotate(0 123.78596496582031 90)"><text x="123.78596496582031" y="31.716" font-family="Virgil, Segoe UI Emoji" font-size="36px" fill="#1e1e1e" text-anchor="middle" style="white-space: pre;" direction="ltr" dominant-baseline="alphabetic">You need a</text><text x="123.78596496582031" y="76.71600000000001" font-family="Virgil, Segoe UI Emoji" font-size="36px" fill="#1e1e1e" text-anchor="middle" style="white-space: pre;" direction="ltr" dominant-baseline="alphabetic">documentation</text><text x="123.78596496582031" y="121.71600000000001" font-family="Virgil, Segoe UI Emoji" font-size="36px" fill="#1e1e1e" text-anchor="middle" style="white-space: pre;" direction="ltr" dominant-baseline="alphabetic">website for</text><text x="123.78596496582031" y="166.716" font-family="Virgil, Segoe UI Emoji" font-size="36px" fill="#1e1e1e" text-anchor="middle" style="white-space: pre;" direction="ltr" dominant-baseline="alphabetic">project A</text></g><g stroke-linecap="round" transform="translate(510.27709470458035 43.85105008129756) rotate(0 193.3919304128458 108.03020491508858)"><path d="M-0.7 1.4 C77.78 1.58, 154.83 2.83, 387.41 -2.22 M-0.81 0.59 C133.28 2.98, 267.27 2.93, 386.07 0.24 M389.7 0.05 C391.24 54.97, 385.25 110.19, 386.44 216.83 M387.91 -0.66 C386.92 62.59, 386.39 127.16, 387.1 215.84 M384.99 217.27 C305.42 219.36, 224.11 217.79, -0.43 217.8 M386.76 215.61 C297.07 214.5, 205.97 214.23, 0.59 214.97 M2.15 212.58 C1.92 147.38, 0.98 76.67, 1.76 2.33 M0.19 215.18 C0.04 139.05, 1.99 60.45, 0.46 0.05" stroke="#1e1e1e" stroke-width="2" fill="none"></path></g><g transform="translate(533.749072724848 61.88125499638613) rotate(0 169.91995239257812 90)"><text x="169.91995239257812" y="31.716" font-family="Virgil, Segoe UI Emoji" font-size="36px" fill="#1e1e1e" text-anchor="middle" style="white-space: pre;" direction="ltr" dominant-baseline="alphabetic">You choose one of </text><text x="169.91995239257812" y="76.71600000000001" font-family="Virgil, Segoe UI Emoji" font-size="36px" fill="#1e1e1e" text-anchor="middle" style="white-space: pre;" direction="ltr" dominant-baseline="alphabetic">the existing</text><text x="169.91995239257812" y="121.71600000000001" font-family="Virgil, Segoe UI Emoji" font-size="36px" fill="#1e1e1e" text-anchor="middle" style="white-space: pre;" direction="ltr" dominant-baseline="alphabetic">templates</text><text x="169.91995239257812" y="166.716" font-family="Virgil, Segoe UI Emoji" font-size="36px" fill="#1e1e1e" text-anchor="middle" style="white-space: pre;" direction="ltr" dominant-baseline="alphabetic">(like this one!)</text></g><g stroke-linecap="round" transform="translate(1007.754868157889 20.603283629724274) rotate(0 184.71698256818308 107.38954876119755)"><path d="M0.53 -0.74 C138.95 0.06, 284.9 -2.17, 368.46 0.71 M0 -0.04 C108.86 -0.81, 215.44 0.01, 369.69 0.52 M365.94 3.19 C373.16 45.54, 372.25 84.22, 366.67 217.65 M369.23 -1.32 C370.22 75.31, 369.29 146.84, 370.57 214.05 M370.85 214.54 C240.09 214.63, 113.64 213.61, 2.1 216.32 M369.95 214.07 C273.79 214.75, 179.09 216.29, 0.34 214.3 M1.95 218.27 C2.74 143.98, 2.73 74.28, -1 3.08 M0.62 214.76 C-3.75 157.28, -3.02 100.55, -0.63 -0.03" stroke="#1e1e1e" stroke-width="2" fill="none"></path></g><g transform="translate(1035.0439027280252 60.492832390921876) rotate(0 157.42794799804688 67.5)"><text x="157.42794799804688" y="31.716" font-family="Virgil, Segoe UI Emoji" font-size="36px" fill="#1e1e1e" text-anchor="middle" style="white-space: pre;" direction="ltr" dominant-baseline="alphabetic">You have a great</text><text x="157.42794799804688" y="76.71600000000001" font-family="Virgil, Segoe UI Emoji" font-size="36px" fill="#1e1e1e" text-anchor="middle" style="white-space: pre;" direction="ltr" dominant-baseline="alphabetic">documentation</text><text x="157.42794799804688" y="121.71600000000001" font-family="Virgil, Segoe UI Emoji" font-size="36px" fill="#1e1e1e" text-anchor="middle" style="white-space: pre;" direction="ltr" dominant-baseline="alphabetic">website quickly</text></g><g stroke-linecap="round" transform="translate(469.1168426366014 351.0166897216261) rotate(0 225.67391903783528 99.68321985642706)"><path d="M1.31 0.8 C103.07 2.82, 204.92 2.93, 452.03 1.68 M-0.22 -0.91 C148.41 -4.57, 297.64 -3.5, 451.48 0.51 M452.17 2.83 C446.23 61.47, 448.78 122.45, 453.46 197.51 M450.95 1.46 C450.15 60.77, 450.74 118.55, 450.64 198.57 M451.28 201.16 C276.67 194.04, 97.61 196.02, -0.69 198.95 M450.4 198.6 C313.22 200.41, 176.99 201.31, -0.38 198.88 M-1.27 201.15 C-4.62 130.4, -4.97 57.91, 0 0.91 M-1.25 197.62 C5.54 126.9, 5.49 54.32, 1.48 0.01" stroke="#1e1e1e" stroke-width="2" fill="none"></path></g><g transform="translate(486.8548485884992 383.19990957805317) rotate(0 207.9359130859375 67.5)"><text x="207.9359130859375" y="31.716" font-family="Virgil, Segoe UI Emoji" font-size="36px" fill="#1e1e1e" text-anchor="middle" style="white-space: pre;" direction="ltr" dominant-baseline="alphabetic">You don't like any of </text><text x="207.9359130859375" y="76.71600000000001" font-family="Virgil, Segoe UI Emoji" font-size="36px" fill="#1e1e1e" text-anchor="middle" style="white-space: pre;" direction="ltr" dominant-baseline="alphabetic">the existing templates </text><text x="207.9359130859375" y="121.71600000000001" font-family="Virgil, Segoe UI Emoji" font-size="36px" fill="#1e1e1e" text-anchor="middle" style="white-space: pre;" direction="ltr" dominant-baseline="alphabetic">and build one yourself</text></g><g stroke-linecap="round" transform="translate(999.5305274352634 360.349581182336) rotate(0 218.5363697682103 104.54297579145384)"><path d="M0.57 -1.39 C150.57 -3.42, 297.63 -3.67, 438.16 0.34 M0.27 -0.49 C123.83 2.2, 247.14 1.06, 437.75 -0.4 M439.33 0.31 C438.25 64.37, 437.56 129, 439.29 210.11 M438.73 -1.32 C437.65 75.2, 437.93 149.18, 438.36 209.23 M437.45 207.15 C348.33 204.71, 262.54 206.77, 0.29 207.32 M437.07 208.67 C278.16 212.85, 120.3 212.44, -0.45 209.82 M2.09 206.38 C0.8 131.83, -0.49 48.6, -3.1 2.78 M-1.31 208.47 C3.29 145.08, 1.88 83.81, 1.73 -0.91" stroke="#1e1e1e" stroke-width="2" fill="none"></path></g><g transform="translate(1021.1829662930948 397.39255697378985) rotate(0 196.8839309103787 67.5)"><text x="196.8839309103787" y="31.716" font-family="Virgil, Segoe UI Emoji" font-size="36px" fill="#1e1e1e" text-anchor="middle" style="white-space: pre;" direction="ltr" dominant-baseline="alphabetic">After weeks of work</text><text x="196.8839309103787" y="76.71600000000001" font-family="Virgil, Segoe UI Emoji" font-size="36px" fill="#1e1e1e" text-anchor="middle" style="white-space: pre;" direction="ltr" dominant-baseline="alphabetic">you have built a nice</text><text x="196.8839309103787" y="121.71600000000001" font-family="Virgil, Segoe UI Emoji" font-size="36px" fill="#1e1e1e" text-anchor="middle" style="white-space: pre;" direction="ltr" dominant-baseline="alphabetic">documentation website</text></g><g stroke-linecap="round" transform="translate(1558.1960834617332 379.62982320914955) rotate(0 185.4831512201265 105.20497395257382)"><path d="M0.85 -0.2 C127.55 -0.86, 251.99 0.27, 370.47 0.45 M-0.74 -0.19 C98.45 -3.5, 195.19 -5.2, 371.36 -1.15 M367.69 0.48 C368.32 72.8, 374.14 142.9, 374.17 212.46 M372.22 1.61 C373.91 79.32, 373.52 157.97, 370.99 210.45 M371.66 210.37 C235.94 209.66, 97.06 211.37, -0.69 209.5 M371.88 209.82 C226.2 213.75, 84.34 213.58, -0.63 210.96 M2.9 210.64 C1.29 129.52, -1.35 47.67, -1.25 -0.73 M-0.86 211.05 C3.58 158.49, 2.66 107.35, -0.73 0.07" stroke="#1e1e1e" stroke-width="2" fill="none"></path></g><g transform="translate(1600.7232668085246 439.8347971617234) rotate(0 142.95596787333488 45)"><text x="142.95596787333488" y="31.716" font-family="Virgil, Segoe UI Emoji" font-size="36px" fill="#1e1e1e" text-anchor="middle" style="white-space: pre;" direction="ltr" dominant-baseline="alphabetic">You forget </text><text x="142.95596787333488" y="76.71600000000001" font-family="Virgil, Segoe UI Emoji" font-size="36px" fill="#1e1e1e" text-anchor="middle" style="white-space: pre;" direction="ltr" dominant-baseline="alphabetic">about project A</text></g><g stroke-linecap="round" transform="translate(1471.8436518609149 38.5578773449605) rotate(0 159.38087994888792 92.91624579444226)"><path d="M-1.63 -2.09 C125.73 -1.98, 250.63 1.68, 316.54 2.68 M0.71 -0.29 C78.4 3.94, 158.61 3.81, 319.06 -0.19 M318.59 2.91 C318.94 61.08, 317.04 128.84, 319.23 184.65 M319.2 -0.7 C318.2 44.63, 318.89 88.92, 317 183.93 M318.41 186.88 C210.08 183.23, 103.47 183.48, -0.3 187.15 M318.83 186.42 C233.43 185.16, 149.57 185.08, 0.64 184.74 M3.72 182.71 C1.58 127.59, -1.1 61.56, -2.79 2.82 M-1.25 187.02 C2.01 131.51, 3.81 72.46, 1.99 0.62" stroke="#1e1e1e" stroke-width="2" fill="none"></path></g><g transform="translate(1522.7925685448606 86.47412313940276) rotate(0 108.43196326494217 45)"><text x="108.43196326494217" y="31.716" font-family="Virgil, Segoe UI Emoji" font-size="36px" fill="#1e1e1e" text-anchor="middle" style="white-space: pre;" direction="ltr" dominant-baseline="alphabetic">Project A is</text><text x="108.43196326494217" y="76.71600000000001" font-family="Virgil, Segoe UI Emoji" font-size="36px" fill="#1e1e1e" text-anchor="middle" style="white-space: pre;" direction="ltr" dominant-baseline="alphabetic">going strong</text></g><g stroke-linecap="round"><g transform="translate(1695.4116333483728 29.24422847006747) rotate(0 1.271083030533191 -7.6138505908550655)"><path d="M-1.29 -1.19 C1.17 -2.79, 1.83 -4.88, 3.88 -16.39 M-0.67 0.01 C0.67 -5.72, 2.6 -11.99, 2.19 -14.58" stroke="#1e1e1e" stroke-width="2" fill="none"></path></g></g><mask></mask><g stroke-linecap="round"><g transform="translate(1759.7878783773629 28.39683978304538) rotate(0 2.6322801565145255 -5.705645096012461)"><path d="M-0.65 0.2 C2.36 -3.44, 2.27 -4.87, 4.37 -12.07 M0.46 -0.59 C2 -4.08, 4.76 -9.03, 5.13 -11.9" stroke="#1e1e1e" stroke-width="2" fill="none"></path></g></g><mask></mask><g stroke-linecap="round"><g transform="translate(1801.6261138500352 92.63396129625596) rotate(0 4.630599746805274 -3.247269334222665)"><path d="M0.03 -0.5 C3.23 -2.71, 7.04 -5.04, 8.62 -6.95 M0.19 0.26 C3.2 -2.53, 7.2 -4.92, 8.97 -6.54" stroke="#1e1e1e" stroke-width="2" fill="none"></path></g></g><mask></mask><g stroke-linecap="round"><g transform="translate(1804.6899930952752 161.3261972125042) rotate(0 5.653473777595082 3.285212111253429)"><path d="M-0.2 0.65 C3.68 0.35, 5.33 3.48, 11.51 5.57 M-0.49 0.14 C3 1.78, 6.02 3.95, 11.4 5.98" stroke="#1e1e1e" stroke-width="2" fill="none"></path></g></g><mask></mask><g stroke-linecap="round"><g transform="translate(1738.4482281956023 241.78069400831248) rotate(0 -0.0015809490430456208 5.17444621758068)"><path d="M-0.24 -0.69 C0.92 3.01, -0.83 6.38, 0.87 11.37 M-0.05 0.04 C-0.11 3.14, 0.26 7.16, 0.25 10.36" stroke="#1e1e1e" stroke-width="2" fill="none"></path></g></g><mask></mask><g stroke-linecap="round"><g transform="translate(1656.2009351850863 238.95711901760092) rotate(0 0 6.90400447056976)"><path d="M1.36 0.65 C1.11 3.94, -0.19 6.24, -0.53 12.61 M0.02 0.49 C0.23 5.28, 0.57 9.78, 0.51 14.09" stroke="#1e1e1e" stroke-width="2" fill="none"></path></g></g><mask></mask><g stroke-linecap="round"><g transform="translate(1568.1515591869386 234.8909180791294) rotate(0 -1.3058639094781483 6.034482496946339)"><path d="M1.03 0.98 C-0.01 5, -2.02 10.01, -3.75 11.02 M-0.35 0.18 C-0.64 3.31, -0.93 5.43, -2.36 12.29" stroke="#1e1e1e" stroke-width="2" fill="none"></path></g></g><mask></mask><g stroke-linecap="round"><g transform="translate(1502.580116681477 243.2288433316562) rotate(0 -1.6710631383998589 8.458077379791234)"><path d="M0.71 0.62 C-2.6 7.12, -2.3 13.77, -3.84 18.6 M-0.75 0.39 C-0.82 6.01, -2.79 10.8, -3.14 17.73" stroke="#1e1e1e" stroke-width="2" fill="none"></path></g></g><mask></mask><g stroke-linecap="round"><g transform="translate(1455.8567486660847 203.51856527079724) rotate(0 -8.537124831938854 0.9786074575870316)"><path d="M0.91 -0.11 C-5.38 0.19, -9.31 2.75, -16.6 2.58 M0.49 -0.07 C-4.62 0.26, -8.58 0.63, -17.79 2.14" stroke="#1e1e1e" stroke-width="2" fill="none"></path></g></g><mask></mask><g stroke-linecap="round"><g transform="translate(1455.243340437419 99.24865209196548) rotate(0 -6.940366298557592 -1.1414452090110672)"><path d="M-0.67 -0.6 C-6.08 -0.76, -8.52 -1.66, -14.92 -1.91 M0.49 0.23 C-4.58 -0.23, -8.75 -1.77, -14.21 -2.86" stroke="#1e1e1e" stroke-width="2" fill="none"></path></g></g><mask></mask><g stroke-linecap="round"><g transform="translate(1455.1263502082409 150.9836285735147) rotate(0 -5.544388293631528 0)"><path d="M-0.91 -0.59 C-3.05 -0.23, -7.56 -0.74, -10.44 0.83 M-0.4 -0.49 C-3.22 -0.17, -6.07 0.35, -11.37 -0.17" stroke="#1e1e1e" stroke-width="2" fill="none"></path></g></g><mask></mask><g stroke-linecap="round"><g transform="translate(1503.0796965790494 19.733239027670493) rotate(0 -2.2907951632369077 -4.689094861394551)"><path d="M0.35 -0.5 C-2.32 -3.61, -3.71 -6.77, -4.21 -9.73 M-0.05 0.01 C-1.42 -2.86, -2.61 -5.07, -4.62 -9.36" stroke="#1e1e1e" stroke-width="2" fill="none"></path></g></g><mask></mask><g stroke-linecap="round"><g transform="translate(1563.0197985935176 19.644705881265168) rotate(0 -1.7643391319340935 -4.34760986811699)"><path d="M-0.32 -0.19 C-1.05 -2.73, -1.93 -4.48, -3.89 -9.24 M0.02 0.2 C-0.72 -2.29, -1.62 -4.63, -3.25 -8.45" stroke="#1e1e1e" stroke-width="2" fill="none"></path></g></g><mask></mask><g stroke-linecap="round"><g transform="translate(1623.1970429644282 25.168541837338125) rotate(0 0 -5.157055778108202)"><path d="M-0.67 -0.12 C-0.51 -3.83, 0.88 -6.69, -0.18 -10.99 M0.35 0.07 C0.22 -3.28, 0.42 -6.65, 0.46 -10.06" stroke="#1e1e1e" stroke-width="2" fill="none"></path></g></g><mask></mask><g stroke-linecap="round"><g transform="translate(369.44048981080755 285.11014337341146) rotate(0 69.9183024468864 -71.58608914647323)"><path d="M0.03 0.28 C24 -24, 119.22 -119.26, 142.24 -143.36 M-3.4 -2.03 C20.55 -24.62, 116.72 -116.53, 141.31 -139.83" stroke="#1e1e1e" stroke-width="2" fill="none"></path></g><g transform="translate(369.44048981080755 285.11014337341146) rotate(0 69.9183024468864 -71.58608914647323)"><path d="M130.4 -115.72 C132.58 -124.08, 134.61 -129.98, 140.65 -139.41 M129.43 -117.75 C133.26 -122.88, 134.8 -127.07, 142.11 -139.71" stroke="#1e1e1e" stroke-width="2" fill="none"></path></g><g transform="translate(369.44048981080755 285.11014337341146) rotate(0 69.9183024468864 -71.58608914647323)"><path d="M118.6 -128.1 C123.78 -133.45, 128.68 -136.32, 140.65 -139.41 M117.64 -130.14 C124.15 -132.49, 128.34 -133.9, 142.11 -139.71" stroke="#1e1e1e" stroke-width="2" fill="none"></path></g></g><mask></mask><g stroke-linecap="round"><g transform="translate(369.44048981080755 324.7166402430331) rotate(0 45.669186812119506 46.70846049041995)"><path d="M-2.29 -1.47 C12.52 14.42, 73.38 77.42, 88.84 93.59 M1.66 3.91 C17.32 20.45, 79.47 82.76, 93.89 97.31" stroke="#1e1e1e" stroke-width="2" fill="none"></path></g><g transform="translate(369.44048981080755 324.7166402430331) rotate(0 45.669186812119506 46.70846049041995)"><path d="M70.22 84.89 C78.09 89.41, 86.26 95, 94.82 99.14 M70.44 85.76 C77.38 88.86, 82.23 92.87, 94.46 96.58" stroke="#1e1e1e" stroke-width="2" fill="none"></path></g><g transform="translate(369.44048981080755 324.7166402430331) rotate(0 45.669186812119506 46.70846049041995)"><path d="M82.34 72.84 C86.51 80.86, 91.06 90.06, 94.82 99.14 M82.57 73.7 C86.25 79.91, 87.93 87.07, 94.46 96.58" stroke="#1e1e1e" stroke-width="2" fill="none"></path></g></g><mask></mask><g stroke-linecap="round"><g transform="translate(898.0609555302719 150.00516664840507) rotate(0 54.346956313808505 -7.700450521252492)"><path d="M0.99 1.96 C19.19 0.01, 92.85 -10.44, 111.22 -13.39 M-1.92 0.55 C15.96 -2.02, 91.57 -15.08, 110.36 -17.31" stroke="#1e1e1e" stroke-width="2" fill="none"></path></g><g transform="translate(898.0609555302719 150.00516664840507) rotate(0 54.346956313808505 -7.700450521252492)"><path d="M89.78 -3.57 C98.06 -8.07, 104.55 -15.96, 110.94 -17.01 M89.38 -5.7 C94.63 -8.43, 100.31 -11.7, 110.9 -16.57" stroke="#1e1e1e" stroke-width="2" fill="none"></path></g><g transform="translate(898.0609555302719 150.00516664840507) rotate(0 54.346956313808505 -7.700450521252492)"><path d="M87.26 -20.49 C96.37 -18.71, 103.8 -20.31, 110.94 -17.01 M86.85 -22.61 C92.87 -20.42, 99.28 -18.78, 110.9 -16.57" stroke="#1e1e1e" stroke-width="2" fill="none"></path></g></g><mask></mask><g stroke-linecap="round"><g transform="translate(925.0748409779574 466.54146783655426) rotate(0 36.727843228653 5.0427747980109245)"><path d="M1.15 -1.88 C13.02 -0.67, 60.79 6.54, 72.67 8.09 M-1.67 3.27 C9.62 4.71, 58.04 9.67, 70 10.63" stroke="#1e1e1e" stroke-width="2" fill="none"></path></g><g transform="translate(925.0748409779574 466.54146783655426) rotate(0 36.727843228653 5.0427747980109245)"><path d="M44.47 16.39 C52.9 13.9, 60.93 14.26, 71.68 9.24 M45.57 16.75 C54.14 14.8, 61.7 13.22, 70.86 11.01" stroke="#1e1e1e" stroke-width="2" fill="none"></path></g><g transform="translate(925.0748409779574 466.54146783655426) rotate(0 36.727843228653 5.0427747980109245)"><path d="M46.06 -0.63 C53.98 2.88, 61.45 9.24, 71.68 9.24 M47.16 -0.28 C55.13 3.66, 62.14 7.96, 70.86 11.01" stroke="#1e1e1e" stroke-width="2" fill="none"></path></g></g><mask></mask><g stroke-linecap="round"><g transform="translate(1378.8659370374578 133.99629525557953) rotate(0 46.422567382060606 -1.3020878326408365)"><path d="M2.64 1.95 C18.62 1.73, 79.75 -2.32, 94.73 -3.23 M0.63 0.54 C16.51 0.92, 78.52 0.29, 93.52 0.05" stroke="#1e1e1e" stroke-width="2" fill="none"></path></g><g transform="translate(1378.8659370374578 133.99629525557953) rotate(0 46.422567382060606 -1.3020878326408365)"><path d="M71.52 10.23 C75.79 6.18, 81.64 2.93, 91.78 -0.21 M69.38 9.53 C79.09 4.33, 88.87 1.81, 94.38 -0.06" stroke="#1e1e1e" stroke-width="2" fill="none"></path></g><g transform="translate(1378.8659370374578 133.99629525557953) rotate(0 46.422567382060606 -1.3020878326408365)"><path d="M71.32 -6.87 C75.52 -6.5, 81.42 -5.33, 91.78 -0.21 M69.18 -7.57 C79.11 -6.21, 88.97 -2.17, 94.38 -0.06" stroke="#1e1e1e" stroke-width="2" fill="none"></path></g></g><mask></mask><g stroke-linecap="round"><g transform="translate(1438.674268338941 484.47435977554386) rotate(0 59.653772916087746 0.08389565111096431)"><path d="M0.87 2.65 C21.01 3, 99.34 3.66, 118.87 2.8 M-2.1 1.62 C17.8 1.19, 96.79 -0.37, 116.39 -0.79" stroke="#1e1e1e" stroke-width="2" fill="none"></path></g><g transform="translate(1438.674268338941 484.47435977554386) rotate(0 59.653772916087746 0.08389565111096431)"><path d="M94.97 7.93 C100.32 5.18, 101.89 3.64, 115.58 -0.89 M92.48 7.44 C101.41 3.99, 110.43 1.21, 116.91 -1.51" stroke="#1e1e1e" stroke-width="2" fill="none"></path></g><g transform="translate(1438.674268338941 484.47435977554386) rotate(0 59.653772916087746 0.08389565111096431)"><path d="M94.62 -9.17 C100.09 -7.97, 101.74 -5.56, 115.58 -0.89 M92.13 -9.65 C101.07 -6.49, 110.23 -2.63, 116.91 -1.51" stroke="#1e1e1e" stroke-width="2" fill="none"></path></g></g><mask></mask><g transform="translate(1845.5567040351832 553.0162959260879) rotate(0 11.366605788583456 -8.11690348680213)" stroke="none"><path fill="#1e1e1e" d="M -2.65,-0.28 Q -2.65,-0.28 -2.56,-1.36 -2.46,-2.44 -2.11,-3.99 -1.75,-5.54 -1.35,-6.79 -0.94,-8.03 -0.37,-9.15 0.19,-10.27 0.80,-11.60 1.40,-12.94 2.16,-14.02 2.92,-15.11 3.81,-16.12 4.71,-17.13 5.78,-18.10 6.85,-19.07 8.08,-19.36 9.31,-19.64 10.43,-19.69 11.55,-19.73 12.65,-19.76 13.76,-19.79 15.47,-19.25 17.19,-18.70 18.36,-17.68 19.54,-16.65 20.25,-15.72 20.97,-14.79 21.67,-13.69 22.36,-12.58 23.02,-11.53 23.68,-10.47 24.17,-9.25 24.66,-8.03 25.06,-6.80 25.46,-5.57 25.90,-3.71 26.34,-1.85 26.31,-1.26 26.27,-0.68 26.05,-0.13 25.83,0.40 25.45,0.85 25.07,1.30 24.57,1.60 24.06,1.90 23.49,2.03 22.92,2.15 22.33,2.09 21.75,2.02 21.22,1.77 20.68,1.52 20.26,1.12 19.83,0.71 19.56,0.19 19.28,-0.32 19.19,-0.90 19.10,-1.48 19.19,-2.05 19.29,-2.63 19.57,-3.15 19.84,-3.67 20.27,-4.07 20.70,-4.48 21.23,-4.72 21.77,-4.97 22.35,-5.03 22.93,-5.09 23.51,-4.96 24.08,-4.83 24.58,-4.53 25.09,-4.23 25.47,-3.78 25.84,-3.33 26.06,-2.78 26.28,-2.24 26.31,-1.65 26.34,-1.06 26.18,-0.50 26.02,0.06 25.69,0.54 25.36,1.03 24.89,1.38 24.42,1.74 23.86,1.92 23.31,2.11 22.72,2.11 22.13,2.11 21.57,1.92 21.02,1.73 20.55,1.37 20.09,1.01 19.76,0.53 19.43,0.04 19.27,-0.52 19.12,-1.08 19.12,-1.08 19.12,-1.08 18.90,-2.19 18.68,-3.30 18.21,-4.76 17.73,-6.23 17.11,-7.37 16.48,-8.52 15.62,-9.80 14.76,-11.08 13.89,-11.88 13.02,-12.69 11.94,-12.72 10.87,-12.75 9.70,-12.46 8.54,-12.17 7.79,-11.17 7.03,-10.18 6.41,-8.96 5.78,-7.73 4.96,-6.33 4.14,-4.93 3.53,-3.39 2.93,-1.85 2.79,-0.78 2.65,0.28 2.58,0.60 2.51,0.91 2.36,1.20 2.22,1.49 2.00,1.73 1.79,1.98 1.53,2.16 1.27,2.35 0.97,2.47 0.67,2.58 0.35,2.63 0.03,2.67 -0.28,2.64 -0.60,2.60 -0.91,2.49 -1.21,2.38 -1.48,2.20 -1.74,2.02 -1.96,1.78 -2.18,1.54 -2.33,1.26 -2.48,0.97 -2.57,0.66 -2.65,0.35 -2.65,0.03 -2.65,-0.28 -2.65,-0.28 L -2.65,-0.28 Z"></path></g><g transform="translate(1855.4969698994553 566.9169832984132) rotate(0 0 3.7447549902879587)" stroke="none"><path fill="#1e1e1e" d="M 2.54,0 Q 2.54,0 2.58,0.94 2.62,1.88 2.72,3.08 2.81,4.28 2.90,5.38 2.99,6.47 3.01,6.76 3.03,7.05 2.98,7.42 2.94,7.78 2.81,8.12 2.68,8.46 2.47,8.76 2.27,9.07 1.99,9.31 1.72,9.55 1.39,9.72 1.07,9.89 0.72,9.98 0.36,10.07 -0.00,10.07 -0.36,10.07 -0.72,9.98 -1.07,9.89 -1.39,9.72 -1.72,9.55 -1.99,9.31 -2.27,9.07 -2.47,8.76 -2.68,8.46 -2.81,8.12 -2.94,7.78 -2.98,7.42 -3.03,7.05 -2.80,3.52 -2.58,0 -2.51,-0.41 -2.44,-0.82 -2.25,-1.19 -2.05,-1.56 -1.75,-1.85 -1.44,-2.13 -1.07,-2.31 -0.69,-2.48 -0.27,-2.53 0.13,-2.57 0.54,-2.48 0.95,-2.39 1.31,-2.18 1.67,-1.96 1.94,-1.65 2.21,-1.33 2.36,-0.94 2.52,-0.55 2.54,-0.13 2.56,0.27 2.45,0.68 2.34,1.08 2.10,1.43 1.87,1.77 1.54,2.02 1.20,2.28 0.81,2.41 0.41,2.54 -0.00,2.54 -0.41,2.54 -0.81,2.41 -1.21,2.28 -1.54,2.02 -1.87,1.77 -2.10,1.43 -2.34,1.08 -2.45,0.68 -2.56,0.27 -2.54,-0.13 -2.52,-0.55 -2.36,-0.94 -2.21,-1.33 -1.94,-1.65 -1.67,-1.96 -1.31,-2.18 -0.95,-2.39 -0.54,-2.48 -0.13,-2.57 0.27,-2.53 0.69,-2.48 1.07,-2.31 1.45,-2.13 1.75,-1.85 2.05,-1.56 2.25,-1.19 2.44,-0.82 2.51,-0.41 2.58,0.00 2.58,0.00 2.58,0 2.80,3.52 3.03,7.05 2.98,7.42 2.94,7.78 2.81,8.12 2.68,8.46 2.47,8.76 2.27,9.07 1.99,9.31 1.72,9.55 1.39,9.72 1.07,9.89 0.72,9.98 0.36,10.07 0.00,10.07 -0.36,10.07 -0.72,9.98 -1.07,9.89 -1.39,9.72 -1.72,9.55 -1.99,9.31 -2.27,9.07 -2.47,8.76 -2.68,8.46 -2.81,8.12 -2.94,7.78 -2.98,7.42 -3.03,7.05 -3.01,6.76 -2.99,6.47 -2.90,5.38 -2.81,4.28 -2.72,3.08 -2.62,1.88 -2.58,0.94 -2.54,0 -2.50,-0.30 -2.47,-0.60 -2.36,-0.89 -2.25,-1.18 -2.08,-1.43 -1.90,-1.68 -1.67,-1.89 -1.44,-2.09 -1.17,-2.23 -0.90,-2.38 -0.60,-2.45 -0.30,-2.52 0.00,-2.52 0.30,-2.52 0.60,-2.45 0.90,-2.38 1.17,-2.23 1.44,-2.09 1.67,-1.89 1.90,-1.68 2.08,-1.43 2.25,-1.18 2.36,-0.89 2.47,-0.60 2.50,-0.30 2.54,0.00 2.54,0.00 L 2.54,0 Z"></path></g><g transform="translate(1865.1186374988472 565.7308174507043) rotate(0 0 3.5364407401737594)" stroke="none"><path fill="#1e1e1e" d="M 2.50,0 Q 2.50,0 2.54,0.74 2.59,1.49 2.69,2.55 2.79,3.61 2.89,4.74 2.99,5.86 3.03,6.35 3.07,6.83 3.02,7.20 2.98,7.57 2.84,7.91 2.71,8.26 2.50,8.56 2.29,8.87 2.02,9.11 1.74,9.36 1.41,9.53 1.08,9.70 0.72,9.79 0.36,9.88 -0.00,9.88 -0.37,9.88 -0.72,9.79 -1.08,9.70 -1.41,9.53 -1.74,9.36 -2.02,9.11 -2.29,8.87 -2.50,8.56 -2.71,8.26 -2.84,7.91 -2.98,7.57 -3.02,7.20 -3.07,6.83 -2.84,3.41 -2.62,0 -2.55,-0.41 -2.48,-0.83 -2.28,-1.21 -2.09,-1.58 -1.78,-1.88 -1.47,-2.17 -1.08,-2.35 -0.70,-2.52 -0.28,-2.57 0.14,-2.62 0.55,-2.53 0.97,-2.43 1.33,-2.21 1.69,-2.00 1.97,-1.67 2.24,-1.35 2.40,-0.95 2.56,-0.56 2.58,-0.14 2.61,0.28 2.49,0.69 2.38,1.10 2.14,1.45 1.90,1.80 1.56,2.06 1.22,2.31 0.82,2.45 0.42,2.59 -0.00,2.59 -0.42,2.59 -0.82,2.45 -1.23,2.31 -1.56,2.06 -1.90,1.80 -2.14,1.45 -2.38,1.10 -2.49,0.69 -2.61,0.28 -2.58,-0.14 -2.56,-0.56 -2.40,-0.95 -2.24,-1.35 -1.97,-1.67 -1.69,-2.00 -1.33,-2.22 -0.97,-2.43 -0.55,-2.53 -0.14,-2.62 0.28,-2.57 0.70,-2.52 1.08,-2.35 1.47,-2.17 1.78,-1.88 2.09,-1.58 2.28,-1.21 2.48,-0.83 2.55,-0.41 2.62,0.00 2.62,0.00 2.62,0 2.84,3.41 3.07,6.83 3.02,7.20 2.98,7.57 2.84,7.91 2.71,8.26 2.50,8.56 2.29,8.87 2.02,9.11 1.74,9.36 1.41,9.53 1.08,9.70 0.72,9.79 0.37,9.88 0.00,9.88 -0.36,9.88 -0.72,9.79 -1.08,9.70 -1.41,9.53 -1.74,9.36 -2.02,9.11 -2.29,8.87 -2.50,8.56 -2.71,8.26 -2.84,7.91 -2.98,7.57 -3.02,7.20 -3.07,6.83 -3.03,6.35 -2.99,5.86 -2.89,4.74 -2.79,3.61 -2.69,2.55 -2.59,1.49 -2.54,0.74 -2.50,0 -2.46,-0.29 -2.42,-0.59 -2.32,-0.88 -2.21,-1.16 -2.04,-1.41 -1.87,-1.65 -1.64,-1.85 -1.42,-2.05 -1.15,-2.19 -0.88,-2.33 -0.59,-2.41 -0.30,-2.48 0.00,-2.48 0.30,-2.48 0.59,-2.41 0.88,-2.33 1.15,-2.19 1.42,-2.05 1.64,-1.85 1.87,-1.65 2.04,-1.41 2.21,-1.16 2.32,-0.88 2.42,-0.59 2.46,-0.29 2.50,0.00 2.50,0.00 L 2.50,0 Z"></path></g></svg>

+5

src/routes/components/alert/+page.svelte

Reviewed

··· 1 1 + <script> 2 2 + import AlertPreview from '$lib/preview/AlertPreview.svelte'; 3 3 + </script> 4 4 + 5 5 + <AlertPreview />

+5

src/routes/components/avatar/+page.svelte

Reviewed

··· 1 1 + <script> 2 2 + import AvatarPreview from '$lib/preview/AvatarPreview.svelte'; 3 3 + </script> 4 4 + 5 5 + <AvatarPreview />

+5

src/routes/components/badge/+page.svelte

Reviewed

··· 1 1 + <script> 2 2 + import BadgesPreview from '$lib/preview/BadgesPreview.svelte'; 3 3 + </script> 4 4 + 5 5 + <BadgesPreview />

+5

src/routes/components/button/+page.svelte

Reviewed

··· 1 1 + <script> 2 2 + import ButtonsPreview from '$lib/preview/ButtonsPreview.svelte'; 3 3 + </script> 4 4 + 5 5 + <ButtonsPreview />

+5

src/routes/components/checkbox/+page.svelte

Reviewed

··· 1 1 + <script> 2 2 + import CheckboxPreview from '$lib/preview/CheckboxPreview.svelte'; 3 3 + </script> 4 4 + 5 5 + <CheckboxPreview />

+5

src/routes/components/color-select/+page.svelte

Reviewed

··· 1 1 + <script> 2 2 + import ColorSelectPreview from '$lib/preview/ColorSelectPreview.svelte'; 3 3 + </script> 4 4 + 5 5 + <ColorSelectPreview />

+5

src/routes/components/depth-3d/+page.svelte

Reviewed

··· 1 1 + <script> 2 2 + import Depth3DPreview from '$lib/preview/Depth3DPreview.svelte'; 3 3 + </script> 4 4 + 5 5 + <Depth3DPreview />

+6

src/routes/components/excalidraw/+page.svelte

Reviewed

··· 1 1 + <script> 2 2 + import ExcalidrawPreview from "$lib/preview/ExcalidrawPreview.svelte"; 3 3 + 4 4 + </script> 5 5 + 6 6 + <ExcalidrawPreview />

+5

src/routes/components/github-corner/+page.svelte

Reviewed

··· 1 1 + <script> 2 2 + import GithubCornerPreview from '$lib/preview/GithubCornerPreview.svelte'; 3 3 + </script> 4 4 + 5 5 + <GithubCornerPreview />

+5

src/routes/components/heatmap/+page.svelte

Reviewed

··· 1 1 + <script> 2 2 + import HeatmapPreview from '$lib/preview/HeatmapPreview.svelte'; 3 3 + </script> 4 4 + 5 5 + <HeatmapPreview />

+5

src/routes/components/input/+page.svelte

Reviewed

··· 1 1 + <script> 2 2 + import InputPreview from '$lib/preview/InputPreview.svelte'; 3 3 + </script> 4 4 + 5 5 + <InputPreview />

+5

src/routes/components/phone/+page.svelte

Reviewed

··· 1 1 + <script> 2 2 + import PhonePreview from '$lib/preview/PhonePreview.svelte'; 3 3 + </script> 4 4 + 5 5 + <PhonePreview />

+5

src/routes/components/piechart/+page.svelte

Reviewed

··· 1 1 + <script> 2 2 + import PieChartPreview from '$lib/preview/PieChartPreview.svelte'; 3 3 + </script> 4 4 + 5 5 + <PieChartPreview />

+5

src/routes/components/progress/+page.svelte

Reviewed

··· 1 1 + <script> 2 2 + import ProgressPreview from '$lib/preview/ProgressPreview.svelte'; 3 3 + </script> 4 4 + 5 5 + <ProgressPreview />

+5

src/routes/components/quote/+page.svelte

Reviewed

··· 1 1 + <script> 2 2 + import QuotePreview from '$lib/preview/QuotePreview.svelte'; 3 3 + </script> 4 4 + 5 5 + <QuotePreview />

+5

src/routes/components/scroll-area/+page.svelte

Reviewed

··· 1 1 + <script> 2 2 + import ScrollAreaPreview from '$lib/preview/ScrollAreaPreview.svelte'; 3 3 + </script> 4 4 + 5 5 + <ScrollAreaPreview />

+5

src/routes/components/star-rating/+page.svelte

Reviewed

··· 1 1 + <script> 2 2 + import StarRatingPreview from '$lib/preview/StarRatingPreview.svelte'; 3 3 + </script> 4 4 + 5 5 + <StarRatingPreview />

+5

src/routes/components/textarea/+page.svelte

Reviewed

··· 1 1 + <script> 2 2 + import TextareaPreview from '$lib/preview/TextareaPreview.svelte'; 3 3 + </script> 4 4 + 5 5 + <TextareaPreview />

+5

src/routes/components/theme/+page.svelte

Reviewed

··· 1 1 + <script> 2 2 + import SelectTheme from '$lib/preview/SelectTheme.svelte'; 3 3 + </script> 4 4 + 5 5 + <SelectTheme />

+5

src/routes/components/tooltip/+page.svelte

Reviewed

··· 1 1 + <script> 2 2 + import TooltipPreview from '$lib/preview/TooltipPreview.svelte'; 3 3 + </script> 4 4 + 5 5 + <TooltipPreview />

+5

src/routes/components/video-player/+page.svelte

Reviewed

··· 1 1 + <script> 2 2 + import VideoPlayerPreview from '$lib/preview/VideoPlayerPreview.svelte'; 3 3 + </script> 4 4 + 5 5 + <VideoPlayerPreview />