blah/Weblah
1
0
Fork 0
mirror of https://github.com/Blah-IM/Weblah.git synced 2025-04-30 08:11:09 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

init

Browse source
This commit is contained in:
Shibo Lyu 2024-08-28 17:08:32 +08:00
commit a6b8910b8e
69 changed files with 5445 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

21
.gitignore vendored Normal file
View file

@ -0,0 +1,21 @@
node_modules
# Output
.output
.vercel
/.svelte-kit
/build
# OS
.DS_Store
Thumbs.db
# Env
.env
.env.*
!.env.example
!.env.test
# Vite
vite.config.js.timestamp-*
vite.config.ts.timestamp-*

1
.npmrc Normal file
View file

@ -0,0 +1 @@
engine-strict=true

4
.prettierignore Normal file
View file

@ -0,0 +1,4 @@
# Package Managers
package-lock.json
pnpm-lock.yaml
yarn.lock

16
.prettierrc Normal file
View file

@ -0,0 +1,16 @@
{
"useTabs": true,
"singleQuote": true,
"trailingComma": "none",
"printWidth": 100,
"plugins": ["prettier-plugin-svelte", "prettier-plugin-tailwindcss"],
"tailwindFunctions": ["tw"],
"overrides": [
{
"files": "*.svelte",
"options": {
"parser": "svelte"
}
}
]
}

6
.zed/tasks.json Normal file
View file

@ -0,0 +1,6 @@
[
{
"label": "Dev",
"command": "npm run dev"
}
]

38
README.md Normal file
View file

@ -0,0 +1,38 @@
# create-svelte
Everything you need to build a Svelte project, powered by [`create-svelte`](https://github.com/sveltejs/kit/tree/main/packages/create-svelte).
## Creating a project
If you're seeing this, you've probably already done this step. Congrats!
```bash
# create a new project in the current directory
npm create svelte@latest
# create a new project in my-app
npm create svelte@latest my-app
```
## Developing
Once you've created a project and installed dependencies with `npm install` (or `pnpm install` or `yarn`), start a development server:
```bash
npm run dev
# or start the server and open the app in a new browser tab
npm run dev -- --open
```
## Building
To create a production version of your app:
```bash
npm run build
```
You can preview the production build with `npm run preview`.
> To deploy your app, you may need to install an [adapter](https://kit.svelte.dev/docs/adapters) for your target environment.

33
eslint.config.js Normal file
View file

@ -0,0 +1,33 @@
import js from '@eslint/js';
import ts from 'typescript-eslint';
import svelte from 'eslint-plugin-svelte';
import prettier from 'eslint-config-prettier';
import globals from 'globals';
/** @type {import('eslint').Linter.Config[]} */
export default [
js.configs.recommended,
...ts.configs.recommended,
...svelte.configs['flat/recommended'],
prettier,
...svelte.configs['flat/prettier'],
{
languageOptions: {
globals: {
...globals.browser,
...globals.node
}
}
},
{
files: ['**/*.svelte'],
languageOptions: {
parserOptions: {
parser: ts.parser
}
}
},
{
ignores: ['build/', '.svelte-kit/', 'dist/']
}
];

4640
package-lock.json generated Normal file
View file

File diff suppressed because it is too large Load diff

42
package.json Normal file
View file

@ -0,0 +1,42 @@
{
"name": "weblah",
"version": "0.0.1",
"private": true,
"scripts": {
"dev": "vite dev",
"build": "vite build",
"preview": "vite preview",
"check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
"check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
"test": "vitest",
"lint": "prettier --check . && eslint .",
"format": "prettier --write ."
},
"devDependencies": {
"@sveltejs/adapter-auto": "^3.0.0",
"@sveltejs/kit": "^2.0.0",
"@sveltejs/vite-plugin-svelte": "^3.0.0",
"@tailwindcss/typography": "^0.5.14",
"@types/eslint": "^9.6.0",
"autoprefixer": "^10.4.20",
"eslint": "^9.0.0",
"eslint-config-prettier": "^9.1.0",
"eslint-plugin-svelte": "^2.36.0",
"globals": "^15.0.0",
"prettier": "^3.1.1",
"prettier-plugin-svelte": "^3.1.2",
"prettier-plugin-tailwindcss": "^0.6.5",
"svelte": "^4.2.7",
"svelte-check": "^3.6.0",
"tailwindcss": "^3.4.9",
"typescript": "^5.0.0",
"typescript-eslint": "^8.0.0",
"vite": "^5.0.3",
"vitest": "^2.0.0"
},
"type": "module",
"dependencies": {
"svelte-boring-avatars": "^1.2.6",
"tailwind-merge": "^2.5.2"
}
}

6
postcss.config.js Normal file
View file

@ -0,0 +1,6 @@
export default {
plugins: {
tailwindcss: {},
autoprefixer: {}
}
};

3
src/app.css Normal file
View file

@ -0,0 +1,3 @@
@import 'tailwindcss/base';
@import 'tailwindcss/components';
@import 'tailwindcss/utilities';

26
src/app.d.ts vendored Normal file
View file

@ -0,0 +1,26 @@
/// <reference types="vite/client" />
// See https://kit.svelte.dev/docs/types#app
// for information about these interfaces
declare global {
namespace App {
// interface Error {}
// interface Locals {}
// interface PageData {}
// interface PageState {}
// interface Platform {}
}
interface ViewTransition {
updateCallbackDone: Promise<void>;
ready: Promise<void>;
finished: Promise<void>;
skipTransition: () => void;
}
interface Document {
startViewTransition(updateCallback: () => Promise<void>): ViewTransition;
}
}
export {};

15
src/app.html Normal file
View file

@ -0,0 +1,15 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<link rel="icon" href="%sveltekit.assets%/favicon.png" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
%sveltekit.head%
</head>
<body
data-sveltekit-preload-data="hover"
class="relative h-screen select-none overflow-hidden bg-slate-100 text-black dark:bg-slate-900 dark:text-white"
>
<div style="display: contents">%sveltekit.body%</div>
</body>
</html>

7
src/index.test.ts Normal file
View file

@ -0,0 +1,7 @@
import { describe, it, expect } from 'vitest';
describe('sum test', () => {
it('adds 1 + 2 to equal 3', () => {
expect(1 + 2).toBe(3);
});
});

19
src/lib/components/BgPattern.svelte Normal file
View file

@ -0,0 +1,19 @@
<script lang="ts">
import { tw } from '$lib/tw';
import { patterns, type PatternName } from './BgPattern';
export let pattern: PatternName = 'rain';
let className: string = '';
export { className as class };
</script>
<div
class={tw(
'pattern-container relative before:absolute before:inset-0 before:size-full before:bg-black/5 before:[mask-image:var(--pattern-image)] dark:before:bg-white/5',
className
)}
style:--pattern-image={`url("${patterns[pattern]}")`}
>
<slot />
</div>

1
src/lib/components/BgPattern/4-point-stars.svg Normal file
View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><polygon fill="#000000" fill-rule="evenodd" points="8 4 12 6 8 8 6 12 4 8 0 6 4 4 6 0 8 4"/></svg>
Side by side

After

Width:  |  Height:  |  Size: 158 B

1
src/lib/components/BgPattern/anchors-away.svg Normal file
View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 80 80" width="80" height="80"><path fill="#000" d="M14 16H9v-2h5V9.87a4 4 0 1 1 2 0V14h5v2h-5v15.95A10 10 0 0 0 23.66 27l-3.46-2 8.2-2.2-2.9 5a12 12 0 0 1-21 0l-2.89-5 8.2 2.2-3.47 2A10 10 0 0 0 14 31.95V16zm40 40h-5v-2h5v-4.13a4 4 0 1 1 2 0V54h5v2h-5v15.95A10 10 0 0 0 63.66 67l-3.47-2 8.2-2.2-2.88 5a12 12 0 0 1-21.02 0l-2.88-5 8.2 2.2-3.47 2A10 10 0 0 0 54 71.95V56zm-39 6a2 2 0 1 1 0-4 2 2 0 0 1 0 4zm40-40a2 2 0 1 1 0-4 2 2 0 0 1 0 4zM15 8a2 2 0 1 0 0-4 2 2 0 0 0 0 4zm40 40a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"></path></svg>
Side by side

After

Width:  |  Height:  |  Size: 576 B

1
src/lib/components/BgPattern/bamboo.svg Normal file
View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 32"><path fill="#000000" fill-rule="evenodd" d="M0 24h4v2H0v-2zm0 4h6v2H0v-2zm0-8h2v2H0v-2zM0 0h4v2H0V0zm0 4h2v2H0V4zm16 20h-6v2h6v-2zm0 4H8v2h8v-2zm0-8h-4v2h4v-2zm0-20h-6v2h6V0zm0 4h-4v2h4V4zm-2 12h2v2h-2v-2zm0-8h2v2h-2V8zM2 8h10v2H2V8zm0 8h10v2H2v-2zm-2-4h14v2H0v-2zm4-8h6v2H4V4zm0 16h6v2H4v-2zM6 0h2v2H6V0zm0 24h2v2H6v-2z"/></svg>
Side by side

After

Width:  |  Height:  |  Size: 389 B

12
src/lib/components/BgPattern/bank-note.svg Normal file
View file

@ -0,0 +1,12 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="100px" height="20px" viewBox="0 0 100 20" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 40 (33762) - http://www.bohemiancoding.com/sketch -->
<title>bank-note</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="bank-note" fill="#000000">
<path d="M21.1841339,20 C21.5411448,19.869748 21.9037256,19.7358773 22.272392,19.5983261 C22.6346445,19.4631679 23.8705367,18.9999982 24.0399055,18.9366758 C33.6397477,15.3475548 39.6469349,14 50,14 C60.2711361,14 65.3618399,15.2217689 74.6286093,18.9284767 C75.584355,19.310775 76.4978747,19.6675274 77.3787841,20 L83.604005,20 C81.0931362,19.2694473 78.4649665,18.3089537 75.3713907,17.0715233 C65.8881601,13.2782311 60.5621972,12 50,12 C39.3741437,12 33.144814,13.3973866 23.3395101,17.0633242 C23.1688625,17.1271247 21.9338538,17.5899633 21.5732596,17.7245028 C19.0984715,18.6478581 16.912678,19.3994574 14.8494171,20 L21.1841339,20 L21.1841339,20 Z M21.1841339,0 C13.2575214,2.89194861 8.07672845,4 7.87150385e-14,4 L7.81597009e-14,4 L0,2 C5.74391753,2 9.9514017,1.4256397 14.8494171,1.40165657e-15 L21.1841339,6.9388939e-17 L21.1841339,0 Z M77.3787841,2.21705987e-12 C85.238555,2.9664329 90.5022896,4 100,4 L100,2 C93.1577329,2 88.6144135,1.4578092 83.604005,1.04805054e-13 L77.3787841,0 L77.3787841,2.21705987e-12 Z M7.87150385e-14,14 C8.44050043,14 13.7183277,12.7898887 22.272392,9.59832609 C22.6346445,9.46316794 23.8705367,8.99999822 24.0399055,8.9366758 C33.6397477,5.34755477 39.6469349,4 50,4 C60.2711361,4 65.3618399,5.2217689 74.6286093,8.92847669 C84.1118399,12.7217689 89.4378028,14 100,14 L100,12 C89.7288639,12 84.6381601,10.7782311 75.3713907,7.07152331 C65.8881601,3.2782311 60.5621972,2 50,2 C39.3741437,2 33.144814,3.39738661 23.3395101,7.0633242 C23.1688625,7.12712472 21.9338538,7.58996334 21.5732596,7.72450279 C13.2235239,10.8398294 8.16350991,12 0,12 L7.81597009e-14,14 L7.87150385e-14,14 L7.87150385e-14,14 Z" id="Combined-Shape"></path>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 2.1 KiB

1
src/lib/components/BgPattern/bathroom-floor.svg Normal file
View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 80 80"><path fill="#000000" fill-rule="evenodd" d="M0 0h40v40H0V0zm40 40h40v40H40V40zm0-40h2l-2 2V0zm0 4l4-4h2l-6 6V4zm0 4l8-8h2L40 10V8zm0 4L52 0h2L40 14v-2zm0 4L56 0h2L40 18v-2zm0 4L60 0h2L40 22v-2zm0 4L64 0h2L40 26v-2zm0 4L68 0h2L40 30v-2zm0 4L72 0h2L40 34v-2zm0 4L76 0h2L40 38v-2zm0 4L80 0v2L42 40h-2zm4 0L80 4v2L46 40h-2zm4 0L80 8v2L50 40h-2zm4 0l28-28v2L54 40h-2zm4 0l24-24v2L58 40h-2zm4 0l20-20v2L62 40h-2zm4 0l16-16v2L66 40h-2zm4 0l12-12v2L70 40h-2zm4 0l8-8v2l-6 6h-2zm4 0l4-4v2l-2 2h-2z"/></svg>
Side by side

After

Width:  |  Height:  |  Size: 557 B

1
src/lib/components/BgPattern/brick-wall.svg Normal file
View file

@ -0,0 +1 @@
<svg width="42" height="44" viewBox="0 0 42 44" xmlns="http://www.w3.org/2000/svg"><g id="Page-1" fill="none" fill-rule="evenodd"><g id="brick-wall" fill="#000"><path d="M0 0h42v44H0V0zm1 1h40v20H1V1zM0 23h20v20H0V23zm22 0h20v20H22V23z"/></g></g></svg>
Side by side

After

Width:  |  Height:  |  Size: 252 B

12
src/lib/components/BgPattern/bubbles.svg Normal file
View file

@ -0,0 +1,12 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="100px" height="100px" viewBox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 40.1 (33804) - http://www.bohemiancoding.com/sketch -->
<title>bubbles</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="bubbles" fill="#000000">
<path d="M11,18 C14.8659932,18 18,14.8659932 18,11 C18,7.13400675 14.8659932,4 11,4 C7.13400675,4 4,7.13400675 4,11 C4,14.8659932 7.13400675,18 11,18 Z M59,43 C62.8659932,43 66,39.8659932 66,36 C66,32.1340068 62.8659932,29 59,29 C55.1340068,29 52,32.1340068 52,36 C52,39.8659932 55.1340068,43 59,43 Z M16,36 C17.6568542,36 19,34.6568542 19,33 C19,31.3431458 17.6568542,30 16,30 C14.3431458,30 13,31.3431458 13,33 C13,34.6568542 14.3431458,36 16,36 Z M79,67 C80.6568542,67 82,65.6568542 82,64 C82,62.3431458 80.6568542,61 79,61 C77.3431458,61 76,62.3431458 76,64 C76,65.6568542 77.3431458,67 79,67 Z M34,90 C35.6568542,90 37,88.6568542 37,87 C37,85.3431458 35.6568542,84 34,84 C32.3431458,84 31,85.3431458 31,87 C31,88.6568542 32.3431458,90 34,90 Z M90,14 C91.6568542,14 93,12.6568542 93,11 C93,9.34314575 91.6568542,8 90,8 C88.3431458,8 87,9.34314575 87,11 C87,12.6568542 88.3431458,14 90,14 Z M12,86 C14.209139,86 16,84.209139 16,82 C16,79.790861 14.209139,78 12,78 C9.790861,78 8,79.790861 8,82 C8,84.209139 9.790861,86 12,86 Z M40,21 C42.209139,21 44,19.209139 44,17 C44,14.790861 42.209139,13 40,13 C37.790861,13 36,14.790861 36,17 C36,19.209139 37.790861,21 40,21 Z M63,10 C65.7614237,10 68,7.76142375 68,5 C68,2.23857625 65.7614237,0 63,0 C60.2385763,0 58,2.23857625 58,5 C58,7.76142375 60.2385763,10 63,10 Z M57,70 C59.209139,70 61,68.209139 61,66 C61,63.790861 59.209139,62 57,62 C54.790861,62 53,63.790861 53,66 C53,68.209139 54.790861,70 57,70 Z M86,92 C88.7614237,92 91,89.7614237 91,87 C91,84.2385763 88.7614237,82 86,82 C83.2385763,82 81,84.2385763 81,87 C81,89.7614237 83.2385763,92 86,92 Z M32,63 C34.7614237,63 37,60.7614237 37,58 C37,55.2385763 34.7614237,53 32,53 C29.2385763,53 27,55.2385763 27,58 C27,60.7614237 29.2385763,63 32,63 Z M89,50 C91.7614237,50 94,47.7614237 94,45 C94,42.2385763 91.7614237,40 89,40 C86.2385763,40 84,42.2385763 84,45 C84,47.7614237 86.2385763,50 89,50 Z M80,29 C81.1045695,29 82,28.1045695 82,27 C82,25.8954305 81.1045695,25 80,25 C78.8954305,25 78,25.8954305 78,27 C78,28.1045695 78.8954305,29 80,29 Z M60,91 C61.1045695,91 62,90.1045695 62,89 C62,87.8954305 61.1045695,87 60,87 C58.8954305,87 58,87.8954305 58,89 C58,90.1045695 58.8954305,91 60,91 Z M35,41 C36.1045695,41 37,40.1045695 37,39 C37,37.8954305 36.1045695,37 35,37 C33.8954305,37 33,37.8954305 33,39 C33,40.1045695 33.8954305,41 35,41 Z M12,60 C13.1045695,60 14,59.1045695 14,58 C14,56.8954305 13.1045695,56 12,56 C10.8954305,56 10,56.8954305 10,58 C10,59.1045695 10.8954305,60 12,60 Z" id="Combined-Shape"></path>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 3 KiB

1
src/lib/components/BgPattern/charlie-brown.svg Normal file
View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="12" viewBox="0 0 20 12"><g fill-rule="evenodd"><g id="charlie-brown" fill="#000"><path d="M9.8 12L0 2.2V.8l10 10 10-10v1.4L10.2 12h-.4zm-4 0L0 6.2V4.8L7.2 12H5.8zm8.4 0L20 6.2V4.8L12.8 12h1.4zM9.8 0l.2.2.2-.2h-.4zm-4 0L10 4.2 14.2 0h-1.4L10 2.8 7.2 0H5.8z"/></g></g></svg>
Side by side

After

Width:  |  Height:  |  Size: 331 B

1
src/lib/components/BgPattern/circuit-board.svg Normal file
View file

File diff suppressed because one or more lines are too long
Side by side

After

Width:  |  Height:  |  Size: 5.1 KiB

1
src/lib/components/BgPattern/cutout.svg Normal file
View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="0 0 48 48"><g fill="#000"><path d="M12 0h18v6h6v6h6v18h-6v6h-6v6H12v-6H6v-6H0V12h6V6h6V0zm12 6h-6v6h-6v6H6v6h6v6h6v6h6v-6h6v-6h6v-6h-6v-6h-6V6zm-6 12h6v6h-6v-6zm24 24h6v6h-6v-6z"></path></g></svg>
Side by side

After

Width:  |  Height:  |  Size: 268 B

13
src/lib/components/BgPattern/diagonal-lines.svg Normal file
View file

@ -0,0 +1,13 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="6px" height="6px" viewBox="0 0 6 6" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 40 (33762) - http://www.bohemiancoding.com/sketch -->
<title>Artboard 3 Copy 2</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="Artboard-3-Copy-2" fill="#000000">
<polygon id="Rectangle-9" points="5 0 6 0 0 6 0 5"></polygon>
<polygon id="Rectangle-9-Copy" points="6 5 6 6 5 6"></polygon>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 680 B

1
src/lib/components/BgPattern/endless-clouds.svg Normal file
View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 56 28" width="56" height="28"><path fill="#000" d="M56 26v2h-7.75c2.3-1.27 4.94-2 7.75-2zm-26 2a2 2 0 1 0-4 0h-4.09A25.98 25.98 0 0 0 0 16v-2c.67 0 1.34.02 2 .07V14a2 2 0 0 0-2-2v-2a4 4 0 0 1 3.98 3.6 28.09 28.09 0 0 1 2.8-3.86A8 8 0 0 0 0 6V4a9.99 9.99 0 0 1 8.17 4.23c.94-.95 1.96-1.83 3.03-2.63A13.98 13.98 0 0 0 0 0h7.75c2 1.1 3.73 2.63 5.1 4.45 1.12-.72 2.3-1.37 3.53-1.93A20.1 20.1 0 0 0 14.28 0h2.7c.45.56.88 1.14 1.29 1.74 1.3-.48 2.63-.87 4-1.15-.11-.2-.23-.4-.36-.59H26v.07a28.4 28.4 0 0 1 4 0V0h4.09l-.37.59c1.38.28 2.72.67 4.01 1.15.4-.6.84-1.18 1.3-1.74h2.69a20.1 20.1 0 0 0-2.1 2.52c1.23.56 2.41 1.2 3.54 1.93A16.08 16.08 0 0 1 48.25 0H56c-4.58 0-8.65 2.2-11.2 5.6 1.07.8 2.09 1.68 3.03 2.63A9.99 9.99 0 0 1 56 4v2a8 8 0 0 0-6.77 3.74c1.03 1.2 1.97 2.5 2.79 3.86A4 4 0 0 1 56 10v2a2 2 0 0 0-2 2.07 28.4 28.4 0 0 1 2-.07v2c-9.2 0-17.3 4.78-21.91 12H30zM7.75 28H0v-2c2.81 0 5.46.73 7.75 2zM56 20v2c-5.6 0-10.65 2.3-14.28 6h-2.7c4.04-4.89 10.15-8 16.98-8zm-39.03 8h-2.69C10.65 24.3 5.6 22 0 22v-2c6.83 0 12.94 3.11 16.97 8zm15.01-.4a28.09 28.09 0 0 1 2.8-3.86 8 8 0 0 0-13.55 0c1.03 1.2 1.97 2.5 2.79 3.86a4 4 0 0 1 7.96 0zm14.29-11.86c1.3-.48 2.63-.87 4-1.15a25.99 25.99 0 0 0-44.55 0c1.38.28 2.72.67 4.01 1.15a21.98 21.98 0 0 1 36.54 0zm-5.43 2.71c1.13-.72 2.3-1.37 3.54-1.93a19.98 19.98 0 0 0-32.76 0c1.23.56 2.41 1.2 3.54 1.93a15.98 15.98 0 0 1 25.68 0zm-4.67 3.78c.94-.95 1.96-1.83 3.03-2.63a13.98 13.98 0 0 0-22.4 0c1.07.8 2.09 1.68 3.03 2.63a9.99 9.99 0 0 1 16.34 0z"></path></svg>
Side by side

After

Width:  |  Height:  |  Size: 1.5 KiB

1
src/lib/components/BgPattern/falling-triangles.svg Normal file
View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="36" height="72" viewBox="0 0 36 72"><g fill-rule="evenodd"><g fill="#000"><path d="M2 6h12L8 18 2 6zm18 36h12l-6 12-6-12z"/></g></g></svg>
Side by side

After

Width:  |  Height:  |  Size: 185 B

1
src/lib/components/BgPattern/formal-invitation.svg Normal file
View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 18"><path fill="#000000" d="M61.82 18c3.47-1.45 6.86-3.78 11.3-7.34C78 6.76 80.34 5.1 83.87 3.42 88.56 1.16 93.75 0 100 0v6.16C98.76 6.05 97.43 6 96 6c-9.59 0-14.23 2.23-23.13 9.34-1.28 1.03-2.39 1.9-3.4 2.66h-7.65zm-23.64 0H22.52c-1-.76-2.1-1.63-3.4-2.66C11.57 9.3 7.08 6.78 0 6.16V0c6.25 0 11.44 1.16 16.14 3.42 3.53 1.7 5.87 3.35 10.73 7.24 4.45 3.56 7.84 5.9 11.31 7.34zM61.82 0h7.66a39.57 39.57 0 0 1-7.34 4.58C57.44 6.84 52.25 8 46 8S34.56 6.84 29.86 4.58A39.57 39.57 0 0 1 22.52 0h15.66C41.65 1.44 45.21 2 50 2c4.8 0 8.35-.56 11.82-2z"/></svg>
Side by side

After

Width:  |  Height:  |  Size: 607 B

12
src/lib/components/BgPattern/glamorous.svg Normal file
View file

@ -0,0 +1,12 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="180px" height="180px" viewBox="0 0 180 180" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 40.1 (33804) - http://www.bohemiancoding.com/sketch -->
<title>glamorous</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="glamorous" fill="#000000">
<path d="M81.2792408,88 L68.4142136,88 L87.7117544,107.297541 L81.2792408,88 L81.2792408,88 Z M83.3874259,88 L96.6125741,88 L90,107.837722 L83.3874259,88 L83.3874259,88 Z M98.7207592,88 L111.585786,88 L92.2882456,107.297541 L98.7207592,88 L98.7207592,88 Z M65.7928932,85.7928932 L73.5857864,78 L75.2071068,78 L105.792893,78 L106.414214,78 L106.914214,78.5 L114.207107,85.7928932 L115.414214,87 L90.7071068,111.707107 L90,112.414214 L64.5857864,87 L64.5857864,87 L65.7928932,85.7928932 L65.7928932,85.7928932 Z M68.4142136,86 L74,80.4142136 L79.5857864,86 L68.4142136,86 L68.4142136,86 Z M84.4142136,86 L90,80.4142136 L95.5857864,86 L84.4142136,86 L84.4142136,86 Z M100.414214,86 L106,80.4142136 L111.585786,86 L100.414214,86 L100.414214,86 Z M92.4142136,80 L103.585786,80 L98,85.5857864 L92.4142136,80 L92.4142136,80 Z M82,85.5857864 L87.5857864,80 L76.4142136,80 L82,85.5857864 L82,85.5857864 Z M17.4142136,0 L0.707106781,16.7071068 L0,17.4142136 L0,0 L17.4142136,0 L17.4142136,0 Z M4.27924078,0 L0,12.8377223 L0,0 L4.27924078,0 L4.27924078,0 Z M14.5857864,0 L2.28824561,12.2975408 L6.38742589,0 L14.5857864,0 L14.5857864,0 Z M180,17.4142136 L162.585786,0 L180,0 L180,17.4142136 L180,17.4142136 Z M165.414214,0 L177.711754,12.2975408 L173.612574,0 L165.414214,0 Z M180,12.8377223 L175.720759,0 L180,0 L180,12.8377223 L180,12.8377223 Z M1.42108547e-14,163 L15.7928932,163 L16.4142136,163 L16.9142136,163.5 L24.2071068,170.792893 L25.4142136,172 L17.4142136,180 L0,180 L0,163 L1.42108547e-14,163 Z M0,173 L6.61257411,173 L4.27924078,180 L0,180 L0,173 Z M14.5857864,180 L21.5857864,173 L8.72075922,173 L6.38742589,180 L14.5857864,180 Z M2.4158453e-13,165.414214 L5.58578644,171 L0,171 L0,165.414214 L2.4158453e-13,165.414214 Z M10.4142136,171 L16,165.414214 L21.5857864,171 L10.4142136,171 Z M2.41421356,165 L13.5857864,165 L8,170.585786 L2.41421356,165 Z M180,163 L165.207107,163 L163.585786,163 L155.792893,170.792893 L155.792893,170.792893 L154.585786,172 L162.585786,180 L180,180 L180,163 Z M165.414214,180 L158.414214,173 L171.279241,173 L173.612574,180 L165.414214,180 Z M180,173 L173.387426,173 L175.720759,180 L180,180 L180,173 Z M158.414214,171 L164,165.414214 L169.585786,171 L158.414214,171 Z M180,165.414214 L174.414214,171 L180,171 L180,165.414214 Z M172,170.585786 L177.585786,165 L166.414214,165 L172,170.585786 Z M152.932504,25.6532829 L154.346717,27.0674965 L120.405592,61.008622 L118.991378,59.5944084 L152.932504,25.6532829 Z M154.346717,152.932504 L152.932504,154.346717 L118.991378,120.405592 L120.405592,118.991378 L154.346717,152.932504 Z M27.0674965,154.346717 L25.6532829,152.932504 L59.5944084,118.991378 L61.008622,120.405592 L27.0674965,154.346717 Z M25.6532829,27.0674965 L27.0674965,25.6532829 L61.008622,59.5944084 L59.5944084,61.008622 L25.6532829,27.0674965 Z M0,85 C2.209139,85 4,86.790861 4,89 C4,91.209139 2.209139,93 0,93 L0,85 Z M180,85 C177.790861,85 176,86.790861 176,89 C176,91.209139 177.790861,93 180,93 L180,85 Z M94,0 C94,2.209139 92.209139,4 90,4 C87.790861,4 86,2.209139 86,0 L94,0 Z M94,180 C94,177.790861 92.209139,176 90,176 C87.790861,176 86,177.790861 86,180 L94,180 Z" id="Combined-Shape"></path>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 3.6 KiB

1
src/lib/components/BgPattern/graph-paper.svg Normal file
View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="100" height="100" viewBox="0 0 100 100"><g fill-rule="evenodd"><g fill="#000"><path opacity=".5" d="M96 95h4v1h-4v4h-1v-4h-9v4h-1v-4h-9v4h-1v-4h-9v4h-1v-4h-9v4h-1v-4h-9v4h-1v-4h-9v4h-1v-4h-9v4h-1v-4h-9v4h-1v-4H0v-1h15v-9H0v-1h15v-9H0v-1h15v-9H0v-1h15v-9H0v-1h15v-9H0v-1h15v-9H0v-1h15v-9H0v-1h15v-9H0v-1h15V0h1v15h9V0h1v15h9V0h1v15h9V0h1v15h9V0h1v15h9V0h1v15h9V0h1v15h9V0h1v15h9V0h1v15h4v1h-4v9h4v1h-4v9h4v1h-4v9h4v1h-4v9h4v1h-4v9h4v1h-4v9h4v1h-4v9h4v1h-4v9zm-1 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-9-10h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm9-10v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-9-10h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm9-10v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-9-10h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm9-10v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-9-10h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9z" /><path d="M6 5V0H5v5H0v1h5v94h1V6h94V5H6z" /></g></g></svg>
Side by side

After

Width:  |  Height:  |  Size: 1.6 KiB

1
src/lib/components/BgPattern/hexagons.svg Normal file
View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="28" height="49" viewBox="0 0 28 49"><g fill-rule="evenodd"><g id="hexagons" fill="#000" fill-rule="nonzero"><path d="M13.99 9.25l13 7.5v15l-13 7.5L1 31.75v-15l12.99-7.5zM3 17.9v12.7l10.99 6.34 11-6.35V17.9l-11-6.34L3 17.9zM0 15l12.98-7.5V0h-2v6.35L0 12.69v2.3zm0 18.5L12.98 41v8h-2v-6.85L0 35.81v-2.3zM15 0v7.5L27.99 15H28v-2.31h-.01L17 6.35V0h-2zm0 49v-8l12.99-7.5H28v2.31h-.01L17 42.15V49h-2z"/></g></g></svg>
Side by side

After

Width:  |  Height:  |  Size: 458 B

1
src/lib/components/BgPattern/hideout.svg Normal file
View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 40 40"><g id="Page-1" fill="none" fill-rule="evenodd"><g id="Artboard-5" fill="#000000"><path id="Combined-Shape" d="M0 38.59l2.83-2.83 1.41 1.41L1.41 40H0v-1.41zM0 1.4l2.83 2.83 1.41-1.41L1.41 0H0v1.41zM38.59 40l-2.83-2.83 1.41-1.41L40 38.59V40h-1.41zM40 1.41l-2.83 2.83-1.41-1.41L38.59 0H40v1.41zM20 18.6l2.83-2.83 1.41 1.41L21.41 20l2.83 2.83-1.41 1.41L20 21.41l-2.83 2.83-1.41-1.41L18.59 20l-2.83-2.83 1.41-1.41L20 18.59z"/></g></g></svg>
Side by side

After

Width:  |  Height:  |  Size: 495 B

15
src/lib/components/BgPattern/houndstooth.svg Normal file
View file

@ -0,0 +1,15 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 40.1 (33804) - http://www.bohemiancoding.com/sketch -->
<title>houndstooth</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="houndstooth" fill="#000000">
<polygon id="Rectangle-20" points="1.99840144e-15 18 6 18 12 12 12 18 18 18 12 24 3.99680289e-15 24"></polygon>
<polygon id="Rectangle-20-Copy" points="24 18 24 24 18 24"></polygon>
<polygon id="Rectangle-20-Copy-2" points="24 1.77635684e-15 18 6 12 6 18 1.77635684e-15"></polygon>
<polygon id="Rectangle-20-Copy-3" points="12 -4.08562073e-14 12 6 0 18 1.99840144e-15 12 6 6 1.99840144e-15 6 1.99840144e-15 1.11022302e-15"></polygon>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 1,007 B

1
src/lib/components/BgPattern/i-like-food.svg Normal file
View file

File diff suppressed because one or more lines are too long
Side by side

After

Width:  |  Height:  |  Size: 9.6 KiB

84
src/lib/components/BgPattern/index.ts Normal file
View file

@ -0,0 +1,84 @@
import fourPointStars from './4-point-stars.svg';
import anchorsAway from './anchors-away.svg';
import bamboo from './bamboo.svg';
import bankNote from './bank-note.svg';
import bathroomFloor from './bathroom-floor.svg';
import brickWall from './brick-wall.svg';
import bubbles from './bubbles.svg';
import charlieBrown from './charlie-brown.svg';
import circuitBoard from './circuit-board.svg';
import cutout from './cutout.svg';
import diagonalLines from './diagonal-lines.svg';
import endlessClouds from './endless-clouds.svg';
import fallingTriangles from './falling-triangles.svg';
import formalInvitation from './formal-invitation.svg';
import glamorous from './glamorous.svg';
import graphPaper from './graph-paper.svg';
import hexagons from './hexagons.svg';
import hideout from './hideout.svg';
import houndstooth from './houndstooth.svg';
import iLikeFood from './i-like-food.svg';
import jigsaw from './jigsaw.svg';
import leaf from './leaf.svg';
import lineInMotion from './line-in-motion.svg';
import moroccan from './moroccan.svg';
import morphingDiamonds from './morphing-diamonds.svg';
import overlappingCircles from './overlapping-circles.svg';
import parkayFloor from './parkay-floor.svg';
import pieFactory from './pie-factory.svg';
import plus from './plus.svg';
import polkaDots from './polka-dots.svg';
import rain from './rain.svg';
import randomShapes from './random-shapes.svg';
import signal from './signal.svg';
import temple from './temple.svg';
import texture from './texture.svg';
import ticTacToe from './tic-tac-toe.svg';
import topography from './topography.svg';
import wiggle from './wiggle.svg';
import xEquals from './x-equals.svg';
export const patterns = {
fourPointStars,
anchorsAway,
bamboo,
bankNote,
bathroomFloor,
brickWall,
bubbles,
charlieBrown,
circuitBoard,
cutout,
diagonalLines,
endlessClouds,
fallingTriangles,
formalInvitation,
glamorous,
graphPaper,
hexagons,
hideout,
houndstooth,
iLikeFood,
jigsaw,
leaf,
lineInMotion,
moroccan,
morphingDiamonds,
overlappingCircles,
parkayFloor,
pieFactory,
plus,
polkaDots,
rain,
randomShapes,
signal,
temple,
texture,
ticTacToe,
topography,
wiggle,
xEquals
};
export type PatternName = keyof typeof patterns;
export const patternNames = Object.keys(patterns);

3
src/lib/components/BgPattern/jigsaw.svg Normal file
View file

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" width="192" height="192" viewBox="0 0 192 192">
<path fill="#000000" d="M192 15v2a11 11 0 0 0-11 11c0 1.94 1.16 4.75 2.53 6.11l2.36 2.36a6.93 6.93 0 0 1 1.22 7.56l-.43.84a8.08 8.08 0 0 1-6.66 4.13H145v35.02a6.1 6.1 0 0 0 3.03 4.87l.84.43c1.58.79 4 .4 5.24-.85l2.36-2.36a12.04 12.04 0 0 1 7.51-3.11 13 13 0 1 1 .02 26 12 12 0 0 1-7.53-3.11l-2.36-2.36a4.93 4.93 0 0 0-5.24-.85l-.84.43a6.1 6.1 0 0 0-3.03 4.87V143h35.02a8.08 8.08 0 0 1 6.66 4.13l.43.84a6.91 6.91 0 0 1-1.22 7.56l-2.36 2.36A10.06 10.06 0 0 0 181 164a11 11 0 0 0 11 11v2a13 13 0 0 1-13-13 12 12 0 0 1 3.11-7.53l2.36-2.36a4.93 4.93 0 0 0 .85-5.24l-.43-.84a6.1 6.1 0 0 0-4.87-3.03H145v35.02a8.08 8.08 0 0 1-4.13 6.66l-.84.43a6.91 6.91 0 0 1-7.56-1.22l-2.36-2.36A10.06 10.06 0 0 0 124 181a11 11 0 0 0-11 11h-2a13 13 0 0 1 13-13c2.47 0 5.79 1.37 7.53 3.11l2.36 2.36a4.94 4.94 0 0 0 5.24.85l.84-.43a6.1 6.1 0 0 0 3.03-4.87V145h-35.02a8.08 8.08 0 0 1-6.66-4.13l-.43-.84a6.91 6.91 0 0 1 1.22-7.56l2.36-2.36A10.06 10.06 0 0 0 107 124a11 11 0 0 0-22 0c0 1.94 1.16 4.75 2.53 6.11l2.36 2.36a6.93 6.93 0 0 1 1.22 7.56l-.43.84a8.08 8.08 0 0 1-6.66 4.13H49v35.02a6.1 6.1 0 0 0 3.03 4.87l.84.43c1.58.79 4 .4 5.24-.85l2.36-2.36a12.04 12.04 0 0 1 7.51-3.11A13 13 0 0 1 81 192h-2a11 11 0 0 0-11-11c-1.94 0-4.75 1.16-6.11 2.53l-2.36 2.36a6.93 6.93 0 0 1-7.56 1.22l-.84-.43a8.08 8.08 0 0 1-4.13-6.66V145H11.98a6.1 6.1 0 0 0-4.87 3.03l-.43.84c-.79 1.58-.4 4 .85 5.24l2.36 2.36a12.04 12.04 0 0 1 3.11 7.51A13 13 0 0 1 0 177v-2a11 11 0 0 0 11-11c0-1.94-1.16-4.75-2.53-6.11l-2.36-2.36a6.93 6.93 0 0 1-1.22-7.56l.43-.84a8.08 8.08 0 0 1 6.66-4.13H47v-35.02a6.1 6.1 0 0 0-3.03-4.87l-.84-.43c-1.59-.8-4-.4-5.24.85l-2.36 2.36A12 12 0 0 1 28 109a13 13 0 1 1 0-26c2.47 0 5.79 1.37 7.53 3.11l2.36 2.36a4.94 4.94 0 0 0 5.24.85l.84-.43A6.1 6.1 0 0 0 47 84.02V49H11.98a8.08 8.08 0 0 1-6.66-4.13l-.43-.84a6.91 6.91 0 0 1 1.22-7.56l2.36-2.36A10.06 10.06 0 0 0 11 28 11 11 0 0 0 0 17v-2a13 13 0 0 1 13 13c0 2.47-1.37 5.79-3.11 7.53l-2.36 2.36a4.94 4.94 0 0 0-.85 5.24l.43.84A6.1 6.1 0 0 0 11.98 47H47V11.98a8.08 8.08 0 0 1 4.13-6.66l.84-.43a6.91 6.91 0 0 1 7.56 1.22l2.36 2.36A10.06 10.06 0 0 0 68 11 11 11 0 0 0 79 0h2a13 13 0 0 1-13 13 12 12 0 0 1-7.53-3.11l-2.36-2.36a4.93 4.93 0 0 0-5.24-.85l-.84.43A6.1 6.1 0 0 0 49 11.98V47h35.02a8.08 8.08 0 0 1 6.66 4.13l.43.84a6.91 6.91 0 0 1-1.22 7.56l-2.36 2.36A10.06 10.06 0 0 0 85 68a11 11 0 0 0 22 0c0-1.94-1.16-4.75-2.53-6.11l-2.36-2.36a6.93 6.93 0 0 1-1.22-7.56l.43-.84a8.08 8.08 0 0 1 6.66-4.13H143V11.98a6.1 6.1 0 0 0-3.03-4.87l-.84-.43c-1.59-.8-4-.4-5.24.85l-2.36 2.36A12 12 0 0 1 124 13a13 13 0 0 1-13-13h2a11 11 0 0 0 11 11c1.94 0 4.75-1.16 6.11-2.53l2.36-2.36a6.93 6.93 0 0 1 7.56-1.22l.84.43a8.08 8.08 0 0 1 4.13 6.66V47h35.02a6.1 6.1 0 0 0 4.87-3.03l.43-.84c.8-1.59.4-4-.85-5.24l-2.36-2.36A12 12 0 0 1 179 28a13 13 0 0 1 13-13zM84.02 143a6.1 6.1 0 0 0 4.87-3.03l.43-.84c.8-1.59.4-4-.85-5.24l-2.36-2.36A12 12 0 0 1 83 124a13 13 0 1 1 26 0c0 2.47-1.37 5.79-3.11 7.53l-2.36 2.36a4.94 4.94 0 0 0-.85 5.24l.43.84a6.1 6.1 0 0 0 4.87 3.03H143v-35.02a8.08 8.08 0 0 1 4.13-6.66l.84-.43a6.91 6.91 0 0 1 7.56 1.22l2.36 2.36A10.06 10.06 0 0 0 164 107a11 11 0 0 0 0-22c-1.94 0-4.75 1.16-6.11 2.53l-2.36 2.36a6.93 6.93 0 0 1-7.56 1.22l-.84-.43a8.08 8.08 0 0 1-4.13-6.66V49h-35.02a6.1 6.1 0 0 0-4.87 3.03l-.43.84c-.79 1.58-.4 4 .85 5.24l2.36 2.36a12.04 12.04 0 0 1 3.11 7.51A13 13 0 1 1 83 68a12 12 0 0 1 3.11-7.53l2.36-2.36a4.93 4.93 0 0 0 .85-5.24l-.43-.84A6.1 6.1 0 0 0 84.02 49H49v35.02a8.08 8.08 0 0 1-4.13 6.66l-.84.43a6.91 6.91 0 0 1-7.56-1.22l-2.36-2.36A10.06 10.06 0 0 0 28 85a11 11 0 0 0 0 22c1.94 0 4.75-1.16 6.11-2.53l2.36-2.36a6.93 6.93 0 0 1 7.56-1.22l.84.43a8.08 8.08 0 0 1 4.13 6.66V143h35.02z"></path>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 3.6 KiB

1
src/lib/components/BgPattern/leaf.svg Normal file
View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 80 40"><path fill="#000" d="M0 40a19.96 19.96 0 0 1 5.9-14.11 20.17 20.17 0 0 1 19.44-5.2A20 20 0 0 1 20.2 40H0zM65.32.75A20.02 20.02 0 0 1 40.8 25.26 20.02 20.02 0 0 1 65.32.76zM.07 0h20.1l-.08.07A20.02 20.02 0 0 1 .75 5.25 20.08 20.08 0 0 1 .07 0zm1.94 40h2.53l4.26-4.24v-9.78A17.96 17.96 0 0 0 2 40zm5.38 0h9.8a17.98 17.98 0 0 0 6.67-16.42L7.4 40zm3.43-15.42v9.17l11.62-11.59c-3.97-.5-8.08.3-11.62 2.42zm32.86-.78A18 18 0 0 0 63.85 3.63L43.68 23.8zm7.2-19.17v9.15L62.43 2.22c-3.96-.5-8.05.3-11.57 2.4zm-3.49 2.72c-4.1 4.1-5.81 9.69-5.13 15.03l6.61-6.6V6.02c-.51.41-1 .85-1.48 1.33zM17.18 0H7.42L3.64 3.78A18 18 0 0 0 17.18 0zM2.08 0c-.01.8.04 1.58.14 2.37L4.59 0H2.07z"></path></svg>
Side by side

After

Width:  |  Height:  |  Size: 739 B

12
src/lib/components/BgPattern/line-in-motion.svg Normal file
View file

@ -0,0 +1,12 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="120px" height="120px" viewBox="0 0 120 120" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 40.1 (33804) - http://www.bohemiancoding.com/sketch -->
<title>line-in-motion</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="line-in-motion" fill="#000000">
<path d="M9,0 L11,0 L11,20 L9,20 L9,0 Z M34.1339746,0.839745962 L35.8660254,1.83974596 L25.8660254,19.160254 L24.1339746,18.160254 L34.1339746,0.839745962 Z M14.1339746,20.839746 L15.8660254,21.839746 L5.8660254,39.160254 L4.1339746,38.160254 L14.1339746,20.839746 Z M58.160254,4.1339746 L59.160254,5.8660254 L41.839746,15.8660254 L40.839746,14.1339746 L58.160254,4.1339746 Z M18.160254,44.1339746 L19.160254,45.8660254 L1.83974596,55.8660254 L0.839745962,54.1339746 L18.160254,44.1339746 Z M80,9 L80,11 L60,11 L60,9 L80,9 Z M20,69 L20,71 L0,71 L0,69 L20,69 Z M99.3205081,14 L98.3205081,15.7320508 L81,5.73205081 L82,4 L99.3205081,14 Z M19.3205081,94 L18.3205081,95.7320508 L1,85.7320508 L2,84 L19.3205081,94 Z M115.866025,18.160254 L114.133975,19.160254 L104.133975,1.83974596 L105.866025,0.839745962 L115.866025,18.160254 Z M15.8660254,118.160254 L14.1339746,119.160254 L4.1339746,101.839746 L5.8660254,100.839746 L15.8660254,118.160254 Z M38.160254,24.1339746 L39.160254,25.8660254 L21.839746,35.8660254 L20.839746,34.1339746 L38.160254,24.1339746 Z M60,29 L60,31 L40,31 L40,29 L60,29 Z M79.3205081,34 L78.3205081,35.7320508 L61,25.7320508 L62,24 L79.3205081,34 Z M95.8660254,38.160254 L94.1339746,39.160254 L84.1339746,21.839746 L85.8660254,20.839746 L95.8660254,38.160254 Z M111,40 L109,40 L109,20 L111,20 L111,40 Z M114.133975,40.839746 L115.866025,41.839746 L105.866025,59.160254 L104.133975,58.160254 L114.133975,40.839746 Z M40,49 L40,51 L20,51 L20,49 L40,49 Z M59.3205081,54 L58.3205081,55.7320508 L41,45.7320508 L42,44 L59.3205081,54 Z M75.8660254,58.160254 L74.1339746,59.160254 L64.1339746,41.839746 L65.8660254,40.839746 L75.8660254,58.160254 Z M91,60 L89,60 L89,40 L91,40 L91,60 Z M94.1339746,60.839746 L95.8660254,61.839746 L85.8660254,79.160254 L84.1339746,78.160254 L94.1339746,60.839746 Z M118.160254,64.1339746 L119.160254,65.8660254 L101.839746,75.8660254 L100.839746,74.1339746 L118.160254,64.1339746 Z M39.3205081,74 L38.3205081,75.7320508 L21,65.7320508 L22,64 L39.3205081,74 Z M55.8660254,78.160254 L54.1339746,79.160254 L44.1339746,61.839746 L45.8660254,60.839746 L55.8660254,78.160254 Z M71,80 L69,80 L69,60 L71,60 L71,80 Z M74.1339746,80.839746 L75.8660254,81.839746 L65.8660254,99.160254 L64.1339746,98.160254 L74.1339746,80.839746 Z M98.160254,84.1339746 L99.160254,85.8660254 L81.839746,95.8660254 L80.839746,94.1339746 L98.160254,84.1339746 Z M120,89 L120,91 L100,91 L100,89 L120,89 Z M35.8660254,98.160254 L34.1339746,99.160254 L24.1339746,81.839746 L25.8660254,80.839746 L35.8660254,98.160254 Z M51,100 L49,100 L49,80 L51,80 L51,100 Z M54.1339746,100.839746 L55.8660254,101.839746 L45.8660254,119.160254 L44.1339746,118.160254 L54.1339746,100.839746 Z M78.160254,104.133975 L79.160254,105.866025 L61.839746,115.866025 L60.839746,114.133975 L78.160254,104.133975 Z M100,109 L100,111 L80,111 L80,109 L100,109 Z M119.320508,114 L118.320508,115.732051 L101,105.732051 L102,104 L119.320508,114 Z M31,120 L29,120 L29,100 L31,100 L31,120 Z" id="Combined-Shape"></path>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 3.5 KiB

12
src/lib/components/BgPattern/moroccan.svg Normal file
View file

@ -0,0 +1,12 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="80px" height="88px" viewBox="0 0 80 88" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 40.1 (33804) - http://www.bohemiancoding.com/sketch -->
<title>moroccan</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="moroccan" fill="#000000">
<path d="M22,21.910316 L22,26 L19.9989006,26 C10.0613799,26 2,34.0588745 2,44 C2,53.9433113 10.0583823,62 19.9989006,62 L22,62 L22,66.0897789 C30.0119364,66.8120156 36.7852126,71.8280516 39.9995613,78.820232 C43.2123852,71.8285229 49.9832383,66.8116352 58,66.089684 L58,62 L60.0010994,62 C69.9386201,62 78,53.9411255 78,44 C78,34.0566887 69.9416177,26 60.0010994,26 L58,26 L58,21.9102211 C49.9880636,21.1879844 43.2147874,16.1719484 40.0004387,9.17976804 C36.7876148,16.1714771 30.0167617,21.1883648 22,21.910316 L22,21.910316 Z M54,58 L54,62.6957274 C48.4256128,64.0124934 43.5445087,67.1235896 40,71.385704 C36.4554913,67.1235896 31.5743872,64.0124934 26,62.6957274 L26,58 L20.0071931,58 C12.2712339,58 6,51.7336865 6,44 C6,36.2680135 12.2753906,30 20.0071931,30 L26,30 L26,25.3042726 C31.5743872,23.9875066 36.4554913,20.8764104 40,16.614296 C43.5445087,20.8764104 48.4256128,23.9875066 54,25.3042726 L54,30 L59.9928069,30 C67.7287661,30 74,36.2663135 74,44 C74,51.7319865 67.7246094,58 59.9928069,58 L54,58 L54,58 Z M42,88 C42,78.0588745 50.0613799,70 59.9989006,70 L62,70 L62,65.910316 L62,65.910316 C70.0163968,65.1883977 76.7869984,60.1719338 80,53.1807228 L80,60.614296 C76.4554913,64.8764104 71.5743872,67.9875066 66,69.3042726 L66,74 L60.0071931,74 C52.2753906,74 46,80.2680135 46,88 L42,88 Z M38,88 C38,78.0566887 29.9416177,70 20.0010994,70 L18,70 L18,65.9102211 C9.98806359,65.1879844 3.21478738,60.1719484 0.000438743025,53.179768 L0,60.614296 C3.54450873,64.8764104 8.42561275,67.9875066 14,69.3042726 L14,74 L19.9928069,74 C27.7287661,74 34,80.2663135 34,88 L38,88 Z M42,7.10542736e-15 C42,9.94331128 50.0583823,18 59.9989006,18 L62,18 L62,22.0897789 C70.0119364,22.8120156 76.7852126,27.8280516 79.9995613,34.820232 L80,27.385704 C76.4554913,23.1235896 71.5743872,20.0124934 66,18.6957274 L66,14 L60.0071931,14 C52.2712339,14 46,7.73368655 46,1.42108547e-14 L42,1.42108547e-14 L42,7.10542736e-15 Z M-2.27373675e-13,34.8192772 C3.21300164,27.8280662 9.98360316,22.8116023 18,22.089684 L18,18 L20.0010994,18 C29.9386201,18 38,9.9411255 38,7.10542736e-15 L34,7.10542736e-15 C34,7.7319865 27.7246094,14 19.9928069,14 L14,14 L14,14 L14,18.6957274 C8.42561275,20.0124934 3.54450873,23.1235896 8.31903435e-11,27.385704 L2.84217094e-14,34.8192772 L-2.27373675e-13,34.8192772 Z" id="Combined-Shape"></path>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 2.8 KiB

12
src/lib/components/BgPattern/morphing-diamonds.svg Normal file
View file

File diff suppressed because one or more lines are too long
Side by side

After

Width:  |  Height:  |  Size: 5.9 KiB

1
src/lib/components/BgPattern/overlapping-circles.svg Normal file
View file

@ -0,0 +1 @@
<svg width="80" height="80" viewBox="0 0 80 80" xmlns="http://www.w3.org/2000/svg"><g fill="none" fill-rule="evenodd"><g fill="#000"><path d="M50 50c0-5.523 4.477-10 10-10s10 4.477 10 10-4.477 10-10 10c0 5.523-4.477 10-10 10s-10-4.477-10-10 4.477-10 10-10zM10 10c0-5.523 4.477-10 10-10s10 4.477 10 10-4.477 10-10 10c0 5.523-4.477 10-10 10S0 25.523 0 20s4.477-10 10-10zm10 8c4.418 0 8-3.582 8-8s-3.582-8-8-8-8 3.582-8 8 3.582 8 8 8zm40 40c4.418 0 8-3.582 8-8s-3.582-8-8-8-8 3.582-8 8 3.582 8 8 8z" /></g></g></svg>
Side by side

After

Width:  |  Height:  |  Size: 513 B

12
src/lib/components/BgPattern/parkay-floor.svg Normal file
View file

@ -0,0 +1,12 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="40px" height="40px" viewBox="0 0 40 40" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 40 (33762) - http://www.bohemiancoding.com/sketch -->
<title>parkay</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="parkay" fill="#000000">
<path d="M20,20.5 L20,18 L0,18 L0,16 L20,16 L20,14 L0,14 L0,12 L20,12 L20,10 L0,10 L0,8 L20,8 L20,6 L0,6 L0,4 L20,4 L20,2 L0,2 L0,0 L20.5,0 L22,0 L22,20 L24,20 L24,0 L26,0 L26,20 L28,20 L28,0 L30,0 L30,20 L32,20 L32,0 L34,0 L34,20 L36,20 L36,0 L38,0 L38,20 L40,20 L40,22 L20,22 L20,20.5 L20,20.5 Z M0,20 L2,20 L2,40 L0,40 L0,20 L0,20 Z M4,20 L6,20 L6,40 L4,40 L4,20 L4,20 Z M8,20 L10,20 L10,40 L8,40 L8,20 L8,20 Z M12,20 L14,20 L14,40 L12,40 L12,20 L12,20 Z M16,20 L18,20 L18,40 L16,40 L16,20 L16,20 Z M20,24 L40,24 L40,26 L20,26 L20,24 L20,24 Z M20,28 L40,28 L40,30 L20,30 L20,28 L20,28 Z M20,32 L40,32 L40,34 L20,34 L20,32 L20,32 Z M20,36 L40,36 L40,38 L20,38 L20,36 L20,36 Z" id="Combined-Shape"></path>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 1.2 KiB

1
src/lib/components/BgPattern/pie-factory.svg Normal file
View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="60" height="60" viewBox="0 0 60 60"><g fill-rule="evenodd"><g fill="#000" fill-rule="nonzero"><path d="M29 58.58l7.38-7.39A30.95 30.95 0 0 1 29 37.84a30.95 30.95 0 0 1-7.38 13.36l7.37 7.38zm1.4 1.41l.01.01h-2.84l-7.37-7.38A30.95 30.95 0 0 1 6.84 60H0v-1.02a28.9 28.9 0 0 0 18.79-7.78L0 32.41v-4.84L18.78 8.79A28.9 28.9 0 0 0 0 1.02V0h6.84a30.95 30.95 0 0 1 13.35 7.38L27.57 0h2.84l7.39 7.38A30.95 30.95 0 0 1 51.16 0H60v27.58-.01V60h-8.84a30.95 30.95 0 0 1-13.37-7.4L30.4 60zM29 1.41l-7.4 7.38A30.95 30.95 0 0 1 29 22.16 30.95 30.95 0 0 1 36.38 8.8L29 1.4zM58 1A28.9 28.9 0 0 0 39.2 8.8L58 27.58V1.02zm-20.2 9.2A28.9 28.9 0 0 0 30.02 29h26.56L37.8 10.21zM30.02 31a28.9 28.9 0 0 0 7.77 18.79l18.79-18.79H30.02zm9.18 20.2A28.9 28.9 0 0 0 58 59V32.4L39.2 51.19zm-19-1.4a28.9 28.9 0 0 0 7.78-18.8H1.41l18.8 18.8zm7.78-20.8A28.9 28.9 0 0 0 20.2 10.2L1.41 29h26.57z"/></g></g></svg>
Side by side

After

Width:  |  Height:  |  Size: 923 B

1
src/lib/components/BgPattern/plus.svg Normal file
View file

@ -0,0 +1 @@
<svg width="60" height="60" viewBox="0 0 60 60" xmlns="http://www.w3.org/2000/svg"><g fill="none" fill-rule="evenodd"><g fill="#000"><path d="M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z"/></g></g></svg>
Side by side

After

Width:  |  Height:  |  Size: 291 B

13
src/lib/components/BgPattern/polka-dots.svg Normal file
View file

@ -0,0 +1,13 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="20px" height="20px" viewBox="0 0 20 20" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 40 (33762) - http://www.bohemiancoding.com/sketch -->
<title>dots</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="dots" fill="#000000">
<circle id="Oval-377-Copy-9" cx="3" cy="3" r="3"></circle>
<circle id="Oval-377-Copy-14" cx="13" cy="13" r="3"></circle>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 654 B

12
src/lib/components/BgPattern/rain.svg Normal file
View file

@ -0,0 +1,12 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="12px" height="16px" viewBox="0 0 12 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 40.1 (33804) - http://www.bohemiancoding.com/sketch -->
<title>rain</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="rain" fill="#000000">
<path d="M4,0.990777969 C4,0.443586406 4.44386482,0 5,0 C5.55228475,0 6,0.45097518 6,0.990777969 L6,5.00922203 C6,5.55641359 5.55613518,6 5,6 C4.44771525,6 4,5.54902482 4,5.00922203 L4,0.990777969 Z M10,8.99077797 C10,8.44358641 10.4438648,8 11,8 C11.5522847,8 12,8.45097518 12,8.99077797 L12,13.009222 C12,13.5564136 11.5561352,14 11,14 C10.4477153,14 10,13.5490248 10,13.009222 L10,8.99077797 Z" id="Combined-Shape"></path>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 949 B

1
src/lib/components/BgPattern/random-shapes.svg Normal file
View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 80 80"><path fill="#000000" fill-rule="evenodd" d="M11 0l5 20H6l5-20zm42 31a3 3 0 1 0 0-6 3 3 0 0 0 0 6zM0 72h40v4H0v-4zm0-8h31v4H0v-4zm20-16h20v4H20v-4zM0 56h40v4H0v-4zm63-25a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm10 0a3 3 0 1 0 0-6 3 3 0 0 0 0 6zM53 41a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm10 0a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm10 0a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm-30 0a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm-28-8a5 5 0 0 0-10 0h10zm10 0a5 5 0 0 1-10 0h10zM56 5a5 5 0 0 0-10 0h10zm10 0a5 5 0 0 1-10 0h10zm-3 46a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm10 0a3 3 0 1 0 0-6 3 3 0 0 0 0 6zM21 0l5 20H16l5-20zm43 64v-4h-4v4h-4v4h4v4h4v-4h4v-4h-4zM36 13h4v4h-4v-4zm4 4h4v4h-4v-4zm-4 4h4v4h-4v-4zm8-8h4v4h-4v-4z"/></svg>
Side by side

After

Width:  |  Height:  |  Size: 723 B

12
src/lib/components/BgPattern/signal.svg Normal file
View file

@ -0,0 +1,12 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="84px" height="48px" viewBox="0 0 84 48" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 40 (33762) - http://www.bohemiancoding.com/sketch -->
<title>signal</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="signal" fill="#000000">
<path d="M0,0 L12,0 L12,6 L0,6 L0,0 Z M28,8 L40,8 L40,14 L28,14 L28,8 Z M42,0 L54,0 L54,6 L42,6 L42,0 Z M56,0 L68,0 L68,6 L56,6 L56,0 Z M56,8 L68,8 L68,14 L56,14 L56,8 Z M42,8 L54,8 L54,14 L42,14 L42,8 Z M42,24 L54,24 L54,30 L42,30 L42,24 Z M56,16 L68,16 L68,22 L56,22 L56,16 Z M70,16 L82,16 L82,22 L70,22 L70,16 Z M70,0 L82,0 L82,6 L70,6 L70,0 Z M28,32 L40,32 L40,38 L28,38 L28,32 Z M14,16 L26,16 L26,22 L14,22 L14,16 Z M0,24 L12,24 L12,30 L0,30 L0,24 Z M0,32 L12,32 L12,38 L0,38 L0,32 Z M14,32 L26,32 L26,38 L14,38 L14,32 Z M28,40 L40,40 L40,46 L28,46 L28,40 Z M14,40 L26,40 L26,46 L14,46 L14,40 Z M42,40 L54,40 L54,46 L42,46 L42,40 Z M56,32 L68,32 L68,38 L56,38 L56,32 Z M56,24 L68,24 L68,30 L56,30 L56,24 Z M70,32 L82,32 L82,38 L70,38 L70,32 Z M70,40 L82,40 L82,46 L70,46 L70,40 Z M14,24 L26,24 L26,30 L14,30 L14,24 Z M28,16 L40,16 L40,22 L28,22 L28,16 Z M14,8 L26,8 L26,14 L14,14 L14,8 Z M0,8 L12,8 L12,14 L0,14 L0,8 Z" id="Combined-Shape"></path>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 1.4 KiB

1
src/lib/components/BgPattern/temple.svg Normal file
View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="152" height="152" viewBox="0 0 152 152"><g fill-rule="evenodd"><g id="temple" fill="#000"><path d="M152 150v2H0v-2h28v-8H8v-20H0v-2h8V80h42v20h20v42H30v8h90v-8H80v-42h20V80h42v40h8V30h-8v40h-42V50H80V8h40V0h2v8h20v20h8V0h2v150zm-2 0v-28h-8v20h-20v8h28zM82 30v18h18V30H82zm20 18h20v20h18V30h-20V10H82v18h20v20zm0 2v18h18V50h-18zm20-22h18V10h-18v18zm-54 92v-18H50v18h18zm-20-18H28V82H10v38h20v20h38v-18H48v-20zm0-2V82H30v18h18zm-20 22H10v18h18v-18zm54 0v18h38v-20h20V82h-18v20h-20v20H82zm18-20H82v18h18v-18zm2-2h18V82h-18v18zm20 40v-18h18v18h-18zM30 0h-2v8H8v20H0v2h8v40h42V50h20V8H30V0zm20 48h18V30H50v18zm18-20H48v20H28v20H10V30h20V10h38v18zM30 50h18v18H30V50zm-2-40H10v18h18V10z"/></g></g></svg>
Side by side

After

Width:  |  Height:  |  Size: 743 B

1
src/lib/components/BgPattern/texture.svg Normal file
View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="4" height="4" viewBox="0 0 4 4"><path fill="#000000" d="M1 3h1v1H1V3zm2-2h1v1H3V1z"></path></svg>
Side by side

After

Width:  |  Height:  |  Size: 144 B

12
src/lib/components/BgPattern/tic-tac-toe.svg Normal file
View file

@ -0,0 +1,12 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="64px" height="64px" viewBox="0 0 64 64" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 40.1 (33804) - http://www.bohemiancoding.com/sketch -->
<title>tic-tac-toe</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="tic-tac-toe" fill="#000000">
<path d="M8,16 C12.418278,16 16,12.418278 16,8 C16,3.581722 12.418278,0 8,0 C3.581722,0 0,3.581722 0,8 C0,12.418278 3.581722,16 8,16 Z M8,14 C11.3137085,14 14,11.3137085 14,8 C14,4.6862915 11.3137085,2 8,2 C4.6862915,2 2,4.6862915 2,8 C2,11.3137085 4.6862915,14 8,14 Z M41.4142136,8 L47.363961,2.05025253 L45.9497475,0.636038969 L40,6.58578644 L34.0502525,0.636038969 L32.636039,2.05025253 L38.5857864,8 L32.636039,13.9497475 L34.0502525,15.363961 L40,9.41421356 L45.9497475,15.363961 L47.363961,13.9497475 L41.4142136,8 Z M40,48 C44.418278,48 48,44.418278 48,40 C48,35.581722 44.418278,32 40,32 C35.581722,32 32,35.581722 32,40 C32,44.418278 35.581722,48 40,48 Z M40,46 C43.3137085,46 46,43.3137085 46,40 C46,36.6862915 43.3137085,34 40,34 C36.6862915,34 34,36.6862915 34,40 C34,43.3137085 36.6862915,46 40,46 Z M9.41421356,40 L15.363961,34.0502525 L13.9497475,32.636039 L8,38.5857864 L2.05025253,32.636039 L0.636038969,34.0502525 L6.58578644,40 L0.636038969,45.9497475 L2.05025253,47.363961 L8,41.4142136 L13.9497475,47.363961 L15.363961,45.9497475 L9.41421356,40 Z" id="Combined-Shape"></path>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 1.6 KiB

1
src/lib/components/BgPattern/topography.svg Normal file
View file

File diff suppressed because one or more lines are too long
Side by side

After

Width:  |  Height:  |  Size: 89 KiB

1
src/lib/components/BgPattern/wiggle.svg Normal file
View file

@ -0,0 +1 @@
<svg width="52" height="26" viewBox="0 0 52 26" xmlns="http://www.w3.org/2000/svg"><g fill="none" fill-rule="evenodd"><g fill="#000"><path d="M10 10c0-2.21-1.79-4-4-4-3.314 0-6-2.686-6-6h2c0 2.21 1.79 4 4 4 3.314 0 6 2.686 6 6 0 2.21 1.79 4 4 4 3.314 0 6 2.686 6 6 0 2.21 1.79 4 4 4v2c-3.314 0-6-2.686-6-6 0-2.21-1.79-4-4-4-3.314 0-6-2.686-6-6zm25.464-1.95l8.486 8.486-1.414 1.414-8.486-8.486 1.414-1.414z" /></g></g></svg>
Side by side

After

Width:  |  Height:  |  Size: 423 B

1
src/lib/components/BgPattern/x-equals.svg Normal file
View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48"><path fill="#000000" fill-rule="evenodd" d="M5 3.59L1.46.05.05 1.46 3.59 5 .05 8.54l1.41 1.41L5 6.41l3.54 3.54 1.41-1.41L6.41 5l3.54-3.54L8.54.05 5 3.59zM17 2h24v2H17V2zm0 4h24v2H17V6zM2 17h2v24H2V17zm4 0h2v24H6V17z"/></svg>
Side by side

After

Width:  |  Height:  |  Size: 284 B

15
src/lib/components/ServiceMessage.svelte Normal file
View file

@ -0,0 +1,15 @@
<script lang="ts">
import { tw } from '$lib/tw';
let className: string = '';
export { className as class };
</script>
<div
class={tw(
'backdrop mx-4 cursor-default rounded-full px-2 py-0.5 text-center backdrop-blur-sm',
className
)}
>
<slot />
</div>

1
src/lib/index.ts Normal file
View file

@ -0,0 +1 @@
// place files you want to import through the `$lib` alias in this folder.

3
src/lib/tw.ts Normal file
View file

@ -0,0 +1,3 @@
import { twMerge } from 'tailwind-merge';
export const tw = twMerge;

33
src/routes/+layout.svelte Normal file
View file

@ -0,0 +1,33 @@
<script>
import '../app.css';
import { page } from '$app/stores';
import { onNavigate } from '$app/navigation';
import ChatList from './ChatList.svelte';
onNavigate((navigation) => {
if (!document.startViewTransition) return;
return new Promise((resolve) => {
document.startViewTransition(async () => {
resolve();
await navigation.complete;
});
});
});
</script>
<div
class="group h-screen sm:flex sm:items-stretch"
data-weblah-main-visible={$page.params.chatId ? 'true' : undefined}
>
<aside
class="h-screen min-h-0 overflow-hidden border-slate-300 bg-white shadow-lg sm:w-1/3 sm:border-e lg:w-1/4 dark:bg-black"
>
<ChatList />
</aside>
<main
class="absolute inset-0 w-full translate-x-[110vw] bg-slate-100 shadow-lg transition-transform duration-300 group-data-[weblah-main-visible]:translate-x-0 sm:relative sm:flex-1 sm:translate-x-0 dark:bg-slate-900"
>
<slot></slot>
</main>
</div>

8
src/routes/+page.svelte Normal file
View file

@ -0,0 +1,8 @@
<script>
import BgPattern from '$lib/components/BgPattern.svelte';
import ServiceMessage from '$lib/components/ServiceMessage.svelte';
</script>
<BgPattern class="flex h-screen flex-col items-center justify-center gap-4">
<ServiceMessage class="text-sm">Select a chat to start messaging</ServiceMessage>
</BgPattern>

72
src/routes/ChatList.svelte Normal file
View file

@ -0,0 +1,72 @@
<script>
import ChatListHeader from './ChatListHeader.svelte';
import ChatListItem from './ChatListItem.svelte';
</script>
<div class="flex h-screen flex-col justify-stretch">
<ChatListHeader />
<div class="min-h-0 flex-1 overflow-y-auto">
<ul>
<ChatListItem
chat={{
id: '1',
name: 'septs',
lastMessage: {
content: '验证 checksum 是否正确的代价还是可以接受的',
date: new Date('2024-08-28T02:54Z')
}
}}
/>
<ChatListItem
chat={{
id: '2',
name: 'oxa',
lastMessage: {
content: '但似乎现在大家都讨厌 pgp ，觉得太复杂',
date: new Date('2024-08-28T02:37Z')
}
}}
/>
<ChatListItem
chat={{
id: '3',
name: 'omo',
lastMessage: {
content: '我對 revalidate 的理解是不經過 cache 直接重拉一遍',
date: new Date('2024-08-28T02:11Z')
}
}}
/>
<ChatListItem
chat={{
id: '4',
name: 'Inno Aiolos',
lastMessage: {
content: '至少得把信息分发给所有广播自己是这个public key的destination',
date: new Date('2024-07-28T02:11Z')
}
}}
/>
<ChatListItem
chat={{
id: '5',
name: 'Gary です',
lastMessage: {
content: '没必要8，长毛象那样挺麻烦的',
date: new Date('2023-07-28T02:11Z')
}
}}
/>
<ChatListItem
chat={{
id: '6',
name: 'Chtholly Nota Seniorious',
lastMessage: {
content: '遥遥领先！\n隔壁 nostr 最开始没有注意到这个问题，然后被狂灌置顶 spam',
date: new Date('2022-07-28T02:11Z')
}
}}
/>
</ul>
</div>
</div>

47
src/routes/ChatListHeader.svelte Normal file
View file

@ -0,0 +1,47 @@
<script lang="ts">
import { AvatarBeam } from 'svelte-boring-avatars';
</script>
<header class="flex items-center justify-stretch gap-2 border-b border-slate-200 p-2 shadow-sm">
<div><AvatarBeam size={30} name="Shibo Lyu" /></div>
<div
class="flex flex-1 items-center gap-1 rounded-md bg-slate-50 px-2 py-1 ring-1 ring-slate-100"
>
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24"
fill="currentColor"
class="size-5 text-slate-400"
>
<path
fill-rule="evenodd"
d="M10.5 3.75a6.75 6.75 0 1 0 0 13.5 6.75 6.75 0 0 0 0-13.5ZM2.25 10.5a8.25 8.25 0 1 1 14.59 5.28l4.69 4.69a.75.75 0 1 1-1.06 1.06l-4.69-4.69A8.25 8.25 0 0 1 2.25 10.5Z"
clip-rule="evenodd"
/>
</svg>
<input
type="text"
placeholder="Search"
class="w-full flex-1 bg-transparent text-sm leading-4 text-slate-900 focus:outline-none"
/>
</div>
<button
class="flex size-7 cursor-default items-center justify-center rounded-md text-slate-500 ring-1 ring-slate-100 transition-shadow duration-200 hover:shadow-sm"
>
<svg
xmlns="http://www.w3.org/2000/svg"
fill="none"
viewBox="0 0 24 24"
stroke-width="1.5"
stroke="currentColor"
class="size-5"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
d="m16.862 4.487 1.687-1.688a1.875 1.875 0 1 1 2.652 2.652L10.582 16.07a4.5 4.5 0 0 1-1.897 1.13L6 18l.8-2.685a4.5 4.5 0 0 1 1.13-1.897l8.932-8.931Zm0 0L19.5 7.125M18 14v4.75A2.25 2.25 0 0 1 15.75 21H5.25A2.25 2.25 0 0 1 3 18.75V8.25A2.25 2.25 0 0 1 5.25 6H10"
/>
</svg>
<span class="sr-only">Compose</span>
</button>
</header>

49
src/routes/ChatListItem.svelte Normal file
View file

@ -0,0 +1,49 @@
<script lang="ts">
import { AvatarBeam } from 'svelte-boring-avatars';
export let chat: { id: string; name: string; lastMessage: { content: string; date: Date } };
const sameDayFormatter = new Intl.DateTimeFormat('default', {
hour: '2-digit',
minute: '2-digit'
});
const sameYearFormatter = new Intl.DateTimeFormat('default', {
month: 'short',
day: 'numeric'
});
const otherYearFormatter = new Intl.DateTimeFormat('default', {
year: 'numeric',
month: 'short',
day: 'numeric'
});
const formatDate = (date: Date) => {
const now = new Date();
if (date.getFullYear() === now.getFullYear()) {
if (date.getMonth() === now.getMonth() && date.getDate() === now.getDate()) {
return sameDayFormatter.format(date);
} else {
return sameYearFormatter.format(date);
}
} else {
return otherYearFormatter.format(date);
}
};
</script>
<li
class="relative after:absolute after:bottom-0 after:end-0 after:start-14 after:border-t after:border-slate-100"
>
<a href="/chats/{chat.id}" class="flex h-16 cursor-default items-center gap-2 px-2">
<div class="size-10">
<AvatarBeam size={40} name={chat.name} />
</div>
<div class="relative h-16 min-w-0 flex-1 space-y-0.5 py-1">
<div class="flex items-center">
<h3 class="flex-1 truncate text-sm font-semibold">{chat.name}</h3>
<time class="truncate text-xs text-gray-500">{formatDate(chat.lastMessage.date)}</time>
</div>
<p class="line-clamp-2 text-xs text-gray-500">{chat.lastMessage.content}</p>
</div>
</a>
</li>

5
src/routes/chats/[chatId]/+page.svelte Normal file
View file

@ -0,0 +1,5 @@
<script lang="ts">
import { page } from '$app/stores';
</script>
<p>Chat History Page for {$page.params.chatId}</p>

BIN
static/favicon.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 1.5 KiB

18
svelte.config.js Normal file
View file

@ -0,0 +1,18 @@
import adapter from '@sveltejs/adapter-auto';
import { vitePreprocess } from '@sveltejs/vite-plugin-svelte';
/** @type {import('@sveltejs/kit').Config} */
const config = {
// Consult https://kit.svelte.dev/docs/integrations#preprocessors
// for more information about preprocessors
preprocess: vitePreprocess(),
kit: {
// adapter-auto only supports some environments, see https://kit.svelte.dev/docs/adapter-auto for a list.
// If your environment is not supported, or you settled on a specific environment, switch out the adapter.
// See https://kit.svelte.dev/docs/adapters for more information about adapters.
adapter: adapter()
}
};
export default config;

16
tailwind.config.ts Normal file
View file

@ -0,0 +1,16 @@
import type { Config } from 'tailwindcss';
import colors from 'tailwindcss/colors';
export default {
content: ['./src/**/*.{html,js,svelte,ts}'],
theme: {
extend: {
colors: {
accent: colors.blue
}
}
},
plugins: [require('@tailwindcss/typography')]
} as Config;

19
tsconfig.json Normal file
View file

@ -0,0 +1,19 @@
{
"extends": "./.svelte-kit/tsconfig.json",
"compilerOptions": {
"allowJs": true,
"checkJs": true,
"esModuleInterop": true,
"forceConsistentCasingInFileNames": true,
"resolveJsonModule": true,
"skipLibCheck": true,
"sourceMap": true,
"strict": true,
"moduleResolution": "bundler"
}
// Path aliases are handled by https://kit.svelte.dev/docs/configuration#alias
// except $lib which is handled by https://kit.svelte.dev/docs/configuration#files
//
// If you want to overwrite includes/excludes, make sure to copy over the relevant includes/excludes
// from the referenced tsconfig.json - TypeScript does not merge them in
}

9
vite.config.ts Normal file
View file

@ -0,0 +1,9 @@
import { sveltekit } from '@sveltejs/kit/vite';
import { defineConfig } from 'vitest/config';
export default defineConfig({
plugins: [sveltekit()],
test: {
include: ['src/**/*.{test,spec}.{js,ts}']
}
});