mirror of
https://github.com/catppuccin/website.git
synced 2026-01-09 04:51:07 +08:00
feat!: init website (#19)
Co-authored-by: sgoudham <sgoudham@gmail.com> Co-authored-by: nullishamy <git@amyerskine.me> Co-authored-by: Hamothy <58985301+sgoudham@users.noreply.github.com> Co-authored-by: uncenter <47499684+uncenter@users.noreply.github.com> Co-authored-by: backwardspy <backwardspy@pigeon.life>
This commit is contained in:
lemon
GitHub
parent
22eb166d38
commit
a4f15a080c
@ -8,6 +8,7 @@ root = true
|
||||
charset = utf-8
|
||||
indent_size = 2
|
||||
indent_style = space
|
||||
max_line_length = 120
|
||||
end_of_line = lf
|
||||
insert_final_newline = true
|
||||
trim_trailing_whitespace = true
|
||||
|
||||
12
.env-example
12
.env-example
@ -1,12 +0,0 @@
|
||||
# Note that not all variables here might be in use for your selected configuration
|
||||
|
||||
# Prisma
|
||||
DATABASE_URL=file:./db.sqlite
|
||||
|
||||
# Next Auth
|
||||
NEXTAUTH_SECRET=
|
||||
NEXTAUTH_URL=http://localhost:3000
|
||||
|
||||
# Next Auth Discord Provider
|
||||
DISCORD_CLIENT_ID=
|
||||
DISCORD_CLIENT_SECRET=
|
||||
@ -1,3 +0,0 @@
|
||||
{
|
||||
"extends": ["next/core-web-vitals"]
|
||||
}
|
||||
43
.gitignore
vendored
43
.gitignore
vendored
@ -1,40 +1,21 @@
|
||||
# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
|
||||
# build output
|
||||
dist/
|
||||
|
||||
# generated types
|
||||
.astro/
|
||||
|
||||
# dependencies
|
||||
/node_modules
|
||||
/.pnp
|
||||
.pnp.js
|
||||
node_modules/
|
||||
|
||||
# testing
|
||||
/coverage
|
||||
|
||||
# database
|
||||
/prisma/db.sqlite
|
||||
/prisma/db.sqlite-journal
|
||||
|
||||
# next.js
|
||||
/.next/
|
||||
/out/
|
||||
|
||||
# production
|
||||
/build
|
||||
|
||||
# misc
|
||||
.DS_Store
|
||||
*.pem
|
||||
|
||||
# debug
|
||||
# logs
|
||||
npm-debug.log*
|
||||
yarn-debug.log*
|
||||
yarn-error.log*
|
||||
.pnpm-debug.log*
|
||||
pnpm-debug.log*
|
||||
|
||||
# local env files
|
||||
# environment variables
|
||||
.env
|
||||
.env*.local
|
||||
.env.production
|
||||
|
||||
# vercel
|
||||
.vercel
|
||||
|
||||
# typescript
|
||||
*.tsbuildinfo
|
||||
# macOS-specific files
|
||||
.DS_Store
|
||||
|
||||
1
.husky/pre-commit
Normal file
1
.husky/pre-commit
Normal file
@ -0,0 +1 @@
|
||||
bun check && bunx lint-staged
|
||||
15
.prettierrc.mjs
Normal file
15
.prettierrc.mjs
Normal file
@ -0,0 +1,15 @@
|
||||
// .prettierrc.mjs
|
||||
/** @type {import("prettier").Config} */
|
||||
export default {
|
||||
printWidth: 120,
|
||||
bracketSameLine: true,
|
||||
plugins: ["prettier-plugin-astro"],
|
||||
overrides: [
|
||||
{
|
||||
files: "*.astro",
|
||||
options: {
|
||||
parser: "astro",
|
||||
},
|
||||
},
|
||||
],
|
||||
};
|
||||
|
Before Width: | Height: | Size: 5.2 KiB After Width: | Height: | Size: 5.2 KiB |
9
.vscode/settings.json
vendored
Normal file
9
.vscode/settings.json
vendored
Normal file
@ -0,0 +1,9 @@
|
||||
{
|
||||
"editor.defaultFormatter": "esbenp.prettier-vscode",
|
||||
"[javascript]": {
|
||||
"editor.defaultFormatter": "esbenp.prettier-vscode"
|
||||
},
|
||||
"[typescript]": {
|
||||
"editor.defaultFormatter": "esbenp.prettier-vscode"
|
||||
}
|
||||
}
|
||||
29
LICENSE
29
LICENSE
@ -1,21 +1,20 @@
|
||||
MIT License
|
||||
|
||||
Copyright (c) 2021 Catppuccin
|
||||
Copyright (c) 2024 Catppuccin
|
||||
|
||||
Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||
of this software and associated documentation files (the "Software"), to deal
|
||||
in the Software without restriction, including without limitation the rights
|
||||
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
||||
copies of the Software, and to permit persons to whom the Software is
|
||||
furnished to do so, subject to the following conditions:
|
||||
Permission is hereby granted, free of charge, to any person obtaining a copy of
|
||||
this website and associated documentation files (the "Website"), to deal in the
|
||||
Website without restriction, including without limitation the rights to use,
|
||||
copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the
|
||||
Website, and to permit persons to whom the Website is furnished to do so,
|
||||
subject to the following conditions:
|
||||
|
||||
The above copyright notice and this permission notice shall be included in all
|
||||
copies or substantial portions of the Software.
|
||||
copies or substantial portions of the Website.
|
||||
|
||||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
||||
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
||||
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
||||
SOFTWARE.
|
||||
The Website is provided "as is", without warranty of any kind, express or
|
||||
implied, including but not limited to the warranties of merchantability, fitness
|
||||
for a particular purpose and noninfringement. In no event shall the authors or
|
||||
copyright holders be liable for any claim, damages or other liability, whether
|
||||
in an action of contract, tort or otherwise, araising from, out of or in
|
||||
connection with the Website or the use or other dealings in the Website.
|
||||
|
||||
58
README.md
58
README.md
@ -1,49 +1,43 @@
|
||||
<h3 align="center">
|
||||
<img src="https://raw.githubusercontent.com/catppuccin/catppuccin/main/assets/logos/exports/1544x1544_circle.png" width="100" alt="Logo"/><br/>
|
||||
<img src="https://raw.githubusercontent.com/catppuccin/catppuccin/main/assets/misc/transparent.png" height="30" width="0px"/>
|
||||
Catppuccin Website (WIP)
|
||||
Catppuccin for <a href="https://info.cern.ch/hypertext/WWW/TheProject.html">World Wide Web</a>
|
||||
<img src="https://raw.githubusercontent.com/catppuccin/catppuccin/main/assets/misc/transparent.png" height="30" width="0px"/>
|
||||
</h3>
|
||||
|
||||
<p align="center">
|
||||
<a href="https://github.com/catppuccin/website/stargazers"><img src="https://img.shields.io/github/stars/catppuccin/website?colorA=363a4f&colorB=b7bdf8&style=for-the-badge"></a>
|
||||
<a href="https://github.com/catppuccin/website/issues"><img src="https://img.shields.io/github/issues/catppuccin/website?colorA=363a4f&colorB=f5a97f&style=for-the-badge"></a>
|
||||
<a href="https://github.com/catppuccin/website/contributors"><img src="https://img.shields.io/github/contributors/catppuccin/website?colorA=363a4f&colorB=a6da95&style=for-the-badge"></a>
|
||||
<a href="https://github.com/catppuccin/website/stargazers"><img src="https://img.shields.io/github/stars/catppuccin/website?colorA=363a4f&colorB=b7bdf8&style=for-the-badge"></a>
|
||||
<a href="https://github.com/catppuccin/website/issues"><img src="https://img.shields.io/github/issues/catppuccin/website?colorA=363a4f&colorB=f5a97f&style=for-the-badge"></a>
|
||||
<a href="https://github.com/catppuccin/website/contributors"><img src="https://img.shields.io/github/contributors/catppuccin/website?colorA=363a4f&colorB=a6da95&style=for-the-badge"></a>
|
||||
</p>
|
||||
|
||||
|
||||
<p align="center">
|
||||
<img src="assets/preview.webp"/>
|
||||
</p>
|
||||
|
||||
## Getting Started
|
||||
## Usage
|
||||
|
||||
First, run the development server:
|
||||
1. Open your browser of choice
|
||||
2. Put cursor in address bar
|
||||
3. Type [catppuccin.com](https://catppuccin.com)
|
||||
4. Press enter 😁
|
||||
|
||||
```bash
|
||||
npm run dev
|
||||
# or
|
||||
yarn dev
|
||||
## Development
|
||||
|
||||
```
|
||||
bun install
|
||||
bun dev
|
||||
```
|
||||
|
||||
Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
|
||||
|
||||
You can start editing the page by modifying `pages/index.js`. The page auto-updates as you edit the file.
|
||||
|
||||
[API routes](https://nextjs.org/docs/api-routes/introduction) can be accessed on [http://localhost:3000/api/hello](http://localhost:3000/api/hello). This endpoint can be edited in `pages/api/hello.js`.
|
||||
|
||||
The `pages/api` directory is mapped to `/api/*`. Files in this directory are treated as [API routes](https://nextjs.org/docs/api-routes/introduction) instead of React pages.
|
||||
|
||||
## Learn More
|
||||
|
||||
To learn more about Next.js, take a look at the following resources:
|
||||
|
||||
- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.
|
||||
- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.
|
||||
|
||||
You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome!
|
||||
|
||||
|
||||
|
||||
<p align="center"><img src="https://raw.githubusercontent.com/catppuccin/catppuccin/main/assets/footers/gray0_ctp_on_line.svg?sanitize=true" /></p>
|
||||
<p align="center">
|
||||
<img src="https://raw.githubusercontent.com/catppuccin/catppuccin/main/assets/footers/gray0_ctp_on_line.svg?sanitize=true" />
|
||||
</p>
|
||||
<p align="center">Copyright © 2021-present <a href="https://github.com/catppuccin" target="_blank">Catppuccin Org</a>
|
||||
<p align="center"><a href="https://github.com/catppuccin/catppuccin/blob/main/LICENSE"><img src="https://img.shields.io/static/v1.svg?style=for-the-badge&label=License&message=MIT&logoColor=d9e0ee&colorA=363a4f&colorB=b7bdf8"/></a></p>
|
||||
|
||||
<p align="center"><a href="https://vercel.com?utm_source=catppuccin&utm_campaign=oss"><img src="https://raw.githubusercontent.com/catppuccin/website/main/powered-by-vercel.svg?sanitize=true"/></a></p>
|
||||
<p align="center">
|
||||
<a href="https://github.com/catppuccin/website/blob/main/LICENSE"><img src="https://img.shields.io/static/v1.svg?style=for-the-badge&label=License&message=MIT&logoColor=d9e0ee&colorA=363a4f&colorB=b7bdf8"/></a>
|
||||
</p>
|
||||
<p align="center">
|
||||
<a href="https://vercel.com?utm_source=catppuccin&utm_campaign=oss"><img src="https://raw.githubusercontent.com/catppuccin/website/main/powered-by-vercel.svg?sanitize=true"/></a>
|
||||
</p>
|
||||
|
||||
BIN
assets/preview.webp
Normal file
BIN
assets/preview.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 194 KiB |
9
astro.config.mjs
Normal file
9
astro.config.mjs
Normal file
@ -0,0 +1,9 @@
|
||||
import { defineConfig } from "astro/config";
|
||||
import yaml from "@rollup/plugin-yaml";
|
||||
|
||||
// https://astro.build/config
|
||||
export default defineConfig({
|
||||
vite: {
|
||||
plugins: [yaml()],
|
||||
},
|
||||
});
|
||||
60
flake.lock
generated
Normal file
60
flake.lock
generated
Normal file
@ -0,0 +1,60 @@
|
||||
{
|
||||
"nodes": {
|
||||
"flake-utils": {
|
||||
"inputs": {
|
||||
"systems": "systems"
|
||||
},
|
||||
"locked": {
|
||||
"lastModified": 1709126324,
|
||||
"narHash": "sha256-q6EQdSeUZOG26WelxqkmR7kArjgWCdw5sfJVHPH/7j8=",
|
||||
"owner": "numtide",
|
||||
"repo": "flake-utils",
|
||||
"rev": "d465f4819400de7c8d874d50b982301f28a84605",
|
||||
"type": "github"
|
||||
},
|
||||
"original": {
|
||||
"owner": "numtide",
|
||||
"repo": "flake-utils",
|
||||
"type": "github"
|
||||
}
|
||||
},
|
||||
"nixpkgs": {
|
||||
"locked": {
|
||||
"lastModified": 1709253178,
|
||||
"narHash": "sha256-d9k9p9VkP0U8fUPraf/aQ0kZvoxiY+7aee3+EGuc+7M=",
|
||||
"owner": "nixos",
|
||||
"repo": "nixpkgs",
|
||||
"rev": "8a8b962a17c01bd59864feddf7e4c978c67f14cd",
|
||||
"type": "github"
|
||||
},
|
||||
"original": {
|
||||
"owner": "nixos",
|
||||
"repo": "nixpkgs",
|
||||
"type": "github"
|
||||
}
|
||||
},
|
||||
"root": {
|
||||
"inputs": {
|
||||
"flake-utils": "flake-utils",
|
||||
"nixpkgs": "nixpkgs"
|
||||
}
|
||||
},
|
||||
"systems": {
|
||||
"locked": {
|
||||
"lastModified": 1681028828,
|
||||
"narHash": "sha256-Vy1rq5AaRuLzOxct8nz4T6wlgyUR7zLU309k9mBC768=",
|
||||
"owner": "nix-systems",
|
||||
"repo": "default",
|
||||
"rev": "da67096a3b9bf56a91d16901293e51ba5b49a27e",
|
||||
"type": "github"
|
||||
},
|
||||
"original": {
|
||||
"owner": "nix-systems",
|
||||
"repo": "default",
|
||||
"type": "github"
|
||||
}
|
||||
}
|
||||
},
|
||||
"root": "root",
|
||||
"version": 7
|
||||
}
|
||||
16
flake.nix
Normal file
16
flake.nix
Normal file
@ -0,0 +1,16 @@
|
||||
{
|
||||
inputs = {
|
||||
nixpkgs.url = "github:nixos/nixpkgs";
|
||||
flake-utils.url = "github:numtide/flake-utils";
|
||||
};
|
||||
|
||||
outputs = { self, nixpkgs, flake-utils, ... }:
|
||||
flake-utils.lib.eachDefaultSystem (system:
|
||||
let
|
||||
pkgs = import nixpkgs { inherit system; };
|
||||
in
|
||||
{
|
||||
devShells.default = import ./shell.nix { inherit pkgs; };
|
||||
}
|
||||
);
|
||||
}
|
||||
5
next-env.d.ts
vendored
5
next-env.d.ts
vendored
@ -1,5 +0,0 @@
|
||||
/// <reference types="next" />
|
||||
/// <reference types="next/image-types/global" />
|
||||
|
||||
// NOTE: This file should not be edited
|
||||
// see https://nextjs.org/docs/basic-features/typescript for more information.
|
||||
@ -1,30 +0,0 @@
|
||||
import { env } from "./src/env/server.mjs";
|
||||
|
||||
/**
|
||||
* Don't be scared of the generics here.
|
||||
* All they do is to give us autocompletion when using this.
|
||||
*
|
||||
* @template {import('next').NextConfig} T
|
||||
* @param {T} config - A generic parameter that flows through to the return type
|
||||
* @constraint {{import('next').NextConfig}}
|
||||
*/
|
||||
function defineNextConfig(config) {
|
||||
return config;
|
||||
}
|
||||
|
||||
export default defineNextConfig({
|
||||
reactStrictMode: true,
|
||||
swcMinify: true,
|
||||
i18n: {
|
||||
locales: ["en"],
|
||||
defaultLocale: "en",
|
||||
},
|
||||
webpack: (config, options) => {
|
||||
config.module.rules.push({
|
||||
test: /\.svg$/i,
|
||||
issuer: /\.[jt]sx?$/,
|
||||
use: ["@svgr/webpack"],
|
||||
});
|
||||
return config;
|
||||
},
|
||||
});
|
||||
80
package.json
80
package.json
@ -1,62 +1,34 @@
|
||||
{
|
||||
"name": "catppuccin-website",
|
||||
"description": "Soothing pastel website",
|
||||
"license": "MIT",
|
||||
"version": "0.1.0",
|
||||
"private": true,
|
||||
"name": "website",
|
||||
"type": "module",
|
||||
"version": "0.0.1",
|
||||
"scripts": {
|
||||
"dev": "next dev",
|
||||
"build": "next build",
|
||||
"start": "next start",
|
||||
"lint": "next lint"
|
||||
"fmt": "prettier --plugin=prettier-plugin-astro . --write",
|
||||
"dev": "astro dev",
|
||||
"start": "astro dev",
|
||||
"check": "astro check",
|
||||
"build": "astro check && astro build",
|
||||
"preview": "astro preview",
|
||||
"astro": "astro",
|
||||
"prepare": "husky"
|
||||
},
|
||||
"lint-staged": {
|
||||
"src/*": "bun prettier --plugin=prettier-plugin-astro . --write"
|
||||
},
|
||||
"dependencies": {
|
||||
"@formkit/auto-animate": "1.0.0-beta.3",
|
||||
"@octokit/graphql": "^5.0.1",
|
||||
"@octokit/rest": "^19.0.4",
|
||||
"next": "12.2.5",
|
||||
"react": "18.2.0",
|
||||
"react-dom": "18.2.0",
|
||||
"react-icons": "^4.4.0",
|
||||
"rehype-external-links": "^2.0.1",
|
||||
"rehype-highlight": "^5.0.2",
|
||||
"rehype-sanitize": "^5.0.1",
|
||||
"rehype-stringify": "^9.0.3",
|
||||
"remark": "^14.0.2",
|
||||
"remark-html": "^15.0.1",
|
||||
"remark-parse": "^10.0.1",
|
||||
"remark-rehype": "^10.1.0",
|
||||
"unified": "^10.1.2",
|
||||
"zod": "^3.18.0"
|
||||
"@astrojs/check": "^0.4.1",
|
||||
"@catppuccin/palette": "^1.1.0",
|
||||
"astro": "^4.3.2",
|
||||
"simple-icons": "^11.10.0",
|
||||
"typescript": "^5.3.3",
|
||||
"yaml": "^2.4.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@catppuccin/tailwindcss": "^0.1.0",
|
||||
"@svgr/webpack": "^6.3.1",
|
||||
"@tailwindcss/typography": "^0.5.4",
|
||||
"@types/node": "18.7.14",
|
||||
"@types/react": "18.0.18",
|
||||
"@types/react-dom": "18.0.6",
|
||||
"autoprefixer": "^10.4.8",
|
||||
"eslint": "8.22.0",
|
||||
"eslint-config-next": "12.2.5",
|
||||
"postcss": "^8.4.16",
|
||||
"prettier": "^2.7.1",
|
||||
"tailwindcss": "^3.1.8",
|
||||
"typescript": "4.8.2"
|
||||
},
|
||||
"ct3aMetadata": {
|
||||
"initVersion": "5.6.0",
|
||||
"next": "12.1.5",
|
||||
"react": "18.0.0",
|
||||
"react-dom": "18.0.0",
|
||||
"react-icons": "^4.3.1",
|
||||
"react-lazyload": "^3.2.0",
|
||||
"react-markdown": "^8.0.3",
|
||||
"react-syntax-highlighter": "^15.5.0",
|
||||
"rehype-highlight": "^5.0.2",
|
||||
"rehype-prism": "^2.1.3",
|
||||
"rehype-raw": "^6.1.1",
|
||||
"rehype-sanitize": "^5.0.1",
|
||||
"remark-gfm": "^3.0.1"
|
||||
"@rollup/plugin-yaml": "^4.1.2",
|
||||
"husky": "latest",
|
||||
"lint-staged": "^15.2.2",
|
||||
"prettier": "^3.2.5",
|
||||
"prettier-plugin-astro": "^0.13.0",
|
||||
"sass": "^1.70.0"
|
||||
}
|
||||
}
|
||||
|
||||
4885
pnpm-lock.yaml
generated
4885
pnpm-lock.yaml
generated
File diff suppressed because it is too large
Load Diff
@ -1,6 +0,0 @@
|
||||
module.exports = {
|
||||
plugins: {
|
||||
tailwindcss: {},
|
||||
autoprefixer: {},
|
||||
},
|
||||
};
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 29 KiB |
BIN
public/embed.png
Normal file
BIN
public/embed.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 207 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 8.6 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 9.2 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 12 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 12 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 15 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 16 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.8 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 2.2 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 3.0 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 3.7 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 3.9 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 4.9 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 4.9 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 5.3 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 7.1 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 5.4 KiB |
BIN
public/favicon.png
Normal file
BIN
public/favicon.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 17 KiB |
BIN
public/inter.ttf
Executable file
BIN
public/inter.ttf
Executable file
Binary file not shown.
BIN
public/inter.woff2
Normal file
BIN
public/inter.woff2
Normal file
Binary file not shown.
@ -1,42 +0,0 @@
|
||||
{
|
||||
"name": "Catppuccin Theme",
|
||||
"short_name": "Catppuccin",
|
||||
"icons": [
|
||||
{
|
||||
"src": "\/favicon-36.png",
|
||||
"sizes": "36x36",
|
||||
"type": "image\/png",
|
||||
"density": 0.75
|
||||
},
|
||||
{
|
||||
"src": "\/favicon-48.png",
|
||||
"sizes": "48x48",
|
||||
"type": "image\/png",
|
||||
"density": 1
|
||||
},
|
||||
{
|
||||
"src": "\/favicon-72.png",
|
||||
"sizes": "72x72",
|
||||
"type": "image\/png",
|
||||
"density": 1.5
|
||||
},
|
||||
{
|
||||
"src": "\/favicon-96.png",
|
||||
"sizes": "96x96",
|
||||
"type": "image\/png",
|
||||
"density": 2
|
||||
},
|
||||
{
|
||||
"src": "\/favicon-144.png",
|
||||
"sizes": "144x144",
|
||||
"type": "image\/png",
|
||||
"density": 3
|
||||
},
|
||||
{
|
||||
"src": "\/favicon-192.png",
|
||||
"sizes": "192x192",
|
||||
"type": "image\/png",
|
||||
"density": 4
|
||||
}
|
||||
]
|
||||
}
|
||||
8
shell.nix
Normal file
8
shell.nix
Normal file
@ -0,0 +1,8 @@
|
||||
{ pkgs ? import <nixpkgs> { } }:
|
||||
|
||||
pkgs.mkShell {
|
||||
name = "bunda";
|
||||
buildInputs = with pkgs; [
|
||||
bun
|
||||
];
|
||||
}
|
||||
76
src/components/AccentBar.astro
Normal file
76
src/components/AccentBar.astro
Normal file
@ -0,0 +1,76 @@
|
||||
<div class="accent-bar"></div>
|
||||
|
||||
<style lang="scss">
|
||||
|
||||
@keyframes gradient {
|
||||
100% { background-position: right; }
|
||||
}
|
||||
|
||||
.accent-bar {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(14, 1fr);
|
||||
|
||||
width: 100%;
|
||||
height: 8px;
|
||||
|
||||
background-color: var(--mauve);
|
||||
background-image: linear-gradient(
|
||||
90deg,
|
||||
var(--rosewater),
|
||||
var(--flamingo),
|
||||
var(--pink),
|
||||
var(--mauve),
|
||||
var(--red),
|
||||
var(--maroon),
|
||||
var(--peach),
|
||||
var(--yellow),
|
||||
var(--green),
|
||||
var(--teal),
|
||||
var(--sky),
|
||||
var(--sapphire),
|
||||
var(--blue),
|
||||
var(--lavender),
|
||||
var(--rosewater),
|
||||
var(--flamingo),
|
||||
var(--pink),
|
||||
var(--mauve),
|
||||
var(--red),
|
||||
var(--maroon),
|
||||
var(--peach),
|
||||
var(--yellow),
|
||||
var(--green),
|
||||
var(--teal),
|
||||
var(--sky),
|
||||
var(--sapphire),
|
||||
var(--blue),
|
||||
var(--lavender),
|
||||
var(--rosewater)
|
||||
);
|
||||
background-size: 400% 100%;
|
||||
background-position: left;
|
||||
|
||||
animation: gradient 20s linear infinite forwards;
|
||||
|
||||
@media (prefers-reduced-motion: true) {
|
||||
background-image: linear-gradient(
|
||||
90deg,
|
||||
var(--rosewater),
|
||||
var(--flamingo),
|
||||
var(--pink),
|
||||
var(--mauve),
|
||||
var(--red),
|
||||
var(--maroon),
|
||||
var(--peach),
|
||||
var(--yellow),
|
||||
var(--green),
|
||||
var(--teal),
|
||||
var(--sky),
|
||||
var(--sapphire),
|
||||
var(--blue),
|
||||
var(--lavender)
|
||||
);
|
||||
background-size: 100%;
|
||||
animation: none;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
34
src/components/FlavorName.astro
Normal file
34
src/components/FlavorName.astro
Normal file
@ -0,0 +1,34 @@
|
||||
---
|
||||
import type { FlavorName } from "@catppuccin/palette";
|
||||
import { flavors } from "@catppuccin/palette";
|
||||
|
||||
interface Props {
|
||||
flavor: FlavorName;
|
||||
bold?: boolean;
|
||||
}
|
||||
|
||||
const { flavor, bold } = Astro.props as Props;
|
||||
---
|
||||
|
||||
{
|
||||
bold === false ? (
|
||||
<span data-flavor={flavor}>{flavors[flavor].name}</span>
|
||||
) : (
|
||||
<strong data-flavor={flavor}>{flavors[flavor].name}</strong>
|
||||
)
|
||||
}
|
||||
|
||||
<style lang="scss">
|
||||
[data-flavor="latte"]::before {
|
||||
content: "🌻\00A0";
|
||||
}
|
||||
[data-flavor="frappe"]::before {
|
||||
content: "🪴\00A0";
|
||||
}
|
||||
[data-flavor="macchiato"]::before {
|
||||
content: "🌺\00A0";
|
||||
}
|
||||
[data-flavor="mocha"]::before {
|
||||
content: "🌿\00A0";
|
||||
}
|
||||
</style>
|
||||
762
src/components/LaptopIllustration.astro
Normal file
762
src/components/LaptopIllustration.astro
Normal file
@ -0,0 +1,762 @@
|
||||
<style lang="scss">
|
||||
@import "@catppuccin/palette/scss/catppuccin";
|
||||
|
||||
svg {
|
||||
--mocha-base: #1e1e2e;
|
||||
--latte-mauve: #8839ef;
|
||||
|
||||
--blended-base-laptop: color-mix(in srgb, var(--mauve), var(--mocha-base) 40%);
|
||||
|
||||
--shadow-color: color-mix(in srgb, var(--crust), var(--mauve) 10%);
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
--shadow-color: color-mix(in srgb, var(--crust), var(--mauve) 6%);
|
||||
}
|
||||
}
|
||||
|
||||
svg * {
|
||||
transition:
|
||||
transform 400ms cubic-bezier(0.34, 0.2, 0.56, 0.81),
|
||||
opacity 400ms;
|
||||
}
|
||||
|
||||
#coffee:hover,
|
||||
#laptop:hover {
|
||||
transform: translateY(-32px);
|
||||
}
|
||||
|
||||
@media (prefers-reduced-motion) {
|
||||
#coffee:hover,
|
||||
#laptop:hover {
|
||||
transform: none;
|
||||
}
|
||||
}
|
||||
|
||||
#keyboard *,
|
||||
#trackpad {
|
||||
fill: color-mix(in srgb, var(--mocha-base), var(--blue) 10%) !important;
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
#base-highlight,
|
||||
#lid-shine {
|
||||
fill: var(--crust) !important;
|
||||
}
|
||||
|
||||
#window-background {
|
||||
fill: var(--base) !important;
|
||||
}
|
||||
#window-edge {
|
||||
fill: var(--mantle) !important;
|
||||
}
|
||||
|
||||
#window-content .code-text {
|
||||
fill: var(--text) !important;
|
||||
}
|
||||
#window-content .code-keyword {
|
||||
fill: var(--green) !important;
|
||||
}
|
||||
#window-content .code-function {
|
||||
fill: var(--red) !important;
|
||||
}
|
||||
#window-content .code-int {
|
||||
fill: var(--blue) !important;
|
||||
}
|
||||
|
||||
#window-decorations {
|
||||
#min,
|
||||
#max {
|
||||
fill: var(--subtext0) !important;
|
||||
}
|
||||
|
||||
#close {
|
||||
fill: var(--red) !important;
|
||||
}
|
||||
}
|
||||
|
||||
#paw {
|
||||
fill: var(--inverted-text) !important;
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
#steam {
|
||||
fill: color-mix(in srgb, var(--overlay0), var(--pink) 20%) !important;
|
||||
opacity: 0.5;
|
||||
}
|
||||
</style>
|
||||
|
||||
<svg width="100%" height="100%" viewBox="0 0 1834 1375" version="1.1" xmlns="http://www.w3.org/2000/svg">
|
||||
<g id="squares">
|
||||
<path
|
||||
id="square-three"
|
||||
d="M1762.24,1101.03c-3.679,0 -7.354,0.942 -10.634,2.833l-48.9,28.238c-0.566,0.329 -0.654,0.85 -0.654,1.125c0,0.283 0.088,0.804 0.654,1.133l48.905,28.234l0.004,-0c6.55,3.783 14.696,3.783 21.254,-0l48.904,-28.234c0.563,-0.329 0.65,-0.85 0.65,-1.133c0,-0.275 -0.087,-0.796 -0.65,-1.125l-48.908,-28.238c-3.279,-1.891 -6.954,-2.833 -10.625,-2.833Zm-0,72.154c-5.017,0 -10.034,-1.291 -14.509,-3.879l-48.9,-28.233c-2.837,-1.634 -4.533,-4.571 -4.533,-7.846c0,-3.271 1.696,-6.204 4.533,-7.842l48.9,-28.233c8.946,-5.163 20.067,-5.167 29.009,-0l48.9,28.233c2.841,1.638 4.533,4.571 4.533,7.842c0,3.275 -1.692,6.212 -4.533,7.846l-48.896,28.233c-4.471,2.588 -9.488,3.879 -14.504,3.879Z"
|
||||
style="fill:url(#_Linear1);"></path>
|
||||
<path
|
||||
id="square-two"
|
||||
d="M1602.69,999.96c12.15,7.009 27.229,7.009 39.379,0l84.158,-48.587c2.271,-1.317 2.517,-3.492 2.517,-4.367c-0,-0.875 -0.246,-3.05 -2.517,-4.362l-84.162,-48.588c-12.15,-7.008 -27.23,-7.008 -39.38,0l-84.158,48.588c-2.271,1.312 -2.517,3.487 -2.517,4.362c0,0.875 0.246,3.046 2.517,4.363l84.163,48.591Zm19.687,13.009c-8.15,-0 -16.296,-2.096 -23.562,-6.296l-84.159,-48.592c-4.008,-2.312 -6.4,-6.45 -6.4,-11.075c0,-4.625 2.392,-8.766 6.4,-11.075l84.154,-48.587c14.525,-8.396 32.592,-8.4 47.13,-0l84.162,48.587c4.004,2.309 6.396,6.45 6.396,11.071c-0,4.625 -2.388,8.767 -6.392,11.083l-84.162,48.588c-7.267,4.196 -15.421,6.296 -23.567,6.296Z"
|
||||
style="fill:url(#_Linear2);"></path>
|
||||
<path
|
||||
id="square-one"
|
||||
d="M117.281,965.269c-6.808,-0 -13.616,1.754 -19.691,5.254l-84.163,48.592c-2.271,1.312 -2.512,3.483 -2.512,4.358c-0,0.875 0.241,3.054 2.516,4.367l84.163,48.587c12.15,7.008 27.229,7.008 39.379,0l84.154,-48.587c2.275,-1.313 2.521,-3.488 2.521,-4.363c-0,-0.875 -0.246,-3.046 -2.521,-4.358l-84.158,-48.596c-6.075,-3.5 -12.884,-5.254 -19.688,-5.254Zm0.004,124.166c-8.15,0 -16.3,-2.091 -23.566,-6.291l-84.163,-48.588c-4.008,-2.316 -6.4,-6.458 -6.4,-11.087c0,-4.621 2.396,-8.759 6.4,-11.071l84.159,-48.588c14.533,-8.4 32.6,-8.4 47.129,0l84.158,48.592c4.008,2.313 6.4,6.45 6.4,11.075c0,4.629 -2.392,8.767 -6.4,11.079l-84.154,48.588c-7.263,4.196 -15.417,6.291 -23.563,6.291Z"
|
||||
style="fill:url(#_Linear3);"></path>
|
||||
<path
|
||||
id="square-cup"
|
||||
d="M446.747,559.341c-9.454,0.004 -18.908,2.602 -27.342,7.781l-116.848,71.904c-3.153,1.942 -3.487,5.152 -3.487,6.446c0.001,1.294 0.338,4.516 3.498,6.456l116.907,71.801c16.877,10.357 37.817,10.349 54.686,-0.022l116.836,-71.897c3.158,-1.943 3.499,-5.159 3.498,-6.453c-0,-1.294 -0.343,-4.504 -3.503,-6.444l-116.901,-71.813c-8.439,-5.173 -17.895,-7.763 -27.344,-7.759Zm0.082,183.614c-11.318,0.004 -22.638,-3.084 -32.731,-9.291l-116.907,-71.801c-5.568,-3.424 -8.892,-9.547 -8.895,-16.393c-0.002,-6.833 3.322,-12.952 8.881,-16.374l116.842,-71.898c20.178,-12.43 45.267,-12.44 65.449,-0.027l116.901,71.808c5.568,3.417 8.891,9.534 8.894,16.374c0.003,6.845 -3.316,12.965 -8.881,16.387l-116.836,71.897c-10.083,6.209 -21.405,9.313 -32.717,9.318Z"
|
||||
style="fill:url(#_Linear4);"></path>
|
||||
<path
|
||||
id="square-laptop"
|
||||
d="M983.344,1364.14c-7.034,-0 -13.784,-1.459 -18.938,-4.438l0.004,0l-686.825,-396.537c-5.608,-3.238 -8.7,-7.909 -8.7,-13.146c0,-6.025 4.192,-11.9 11.5,-16.121l260.815,-160.74l7.725,4.462l-264.635,162.982c-4.8,2.775 -7.646,6.288 -7.646,9.413c-0,3.016 2.621,5.166 4.816,6.437l686.825,396.533l0.005,0c3.916,2.267 9.295,3.371 14.97,3.371c7.03,0 14.505,-1.696 20.2,-4.987l468.184,-274.3c4.8,-2.771 7.646,-6.284 7.646,-9.413c-0,-3.016 -2.617,-5.162 -4.817,-6.433l-261.96,-161.426l7.75,-4.475l258.085,159.188c5.612,3.234 8.7,7.905 8.7,13.146c-0,6.021 -4.192,11.892 -11.504,16.113l-468.179,274.3c-6.963,4.021 -15.692,6.071 -24.021,6.071Z"
|
||||
style="fill:url(#_Linear5);"></path>
|
||||
</g>
|
||||
<path
|
||||
id="laptop-shadow"
|
||||
d="M790.681,714.229l601.788,343.015c8.775,5.062 7.675,13.908 -2.454,19.758l-386.238,222.992c-5.537,3.2 -12.633,4.837 -19.358,4.837c-5.571,0 -10.888,-1.125 -14.859,-3.416l-601.795,-347.446c-8.775,-5.067 -7.671,-13.913 2.458,-19.754l386.233,-218.565c5.538,-3.2 12.634,-4.842 19.359,-4.842c5.57,-0 10.891,1.125 14.866,3.421Z"
|
||||
style="fill:var(--shadow-color);"></path>
|
||||
<g id="laptop">
|
||||
<g id="base">
|
||||
<path
|
||||
id="base-border"
|
||||
d="M983.681,1220.09c-5.529,-0 -10.808,-1.117 -14.754,-3.396l-543.996,-314.075l-38.191,-22.046l-7.725,-4.462l-7.638,-4.409c-3.379,-1.954 -5.267,-4.479 -5.742,-7.166l-0.016,0.008l-3.575,-17.842c0.591,2.538 2.462,4.904 5.658,6.767l0.004,-0c0.021,0.012 0.038,0.025 0.059,0.033l601.795,347.446c3.971,2.296 9.292,3.421 14.863,3.421c6.646,-0 13.646,-1.6 19.154,-4.721c0.067,-0.037 0.133,-0.075 0.2,-0.117l386.238,-222.991c0.025,-0.017 0.05,-0.034 0.075,-0.046c4.72,-2.742 7.462,-6.138 8.137,-9.492l-3.662,17.417l-0.021,-0.029c-0.675,3.35 -3.392,6.746 -8.125,9.475l-6.55,3.783l-7.75,4.475l-37.559,21.683l-331.654,191.48c-5.5,3.175 -12.546,4.804 -19.225,4.804Z"
|
||||
style="fill:url(#_Radial6);"></path>
|
||||
<path
|
||||
id="base-top"
|
||||
d="M984.423,1204.37c-5.571,-0 -10.892,-1.125 -14.863,-3.421c3.971,2.296 9.292,3.421 14.863,3.421Zm-0.004,-4.688c-5.571,0 -10.888,-1.12 -14.859,-3.416l-601.795,-347.45c-2.992,-1.725 -4.742,-3.9 -5.475,-6.238c-1.155,4.017 0.529,8.046 5.412,10.892c-3.196,-1.863 -5.067,-4.229 -5.658,-6.767c-1.013,-4.375 1.783,-9.262 8.179,-12.958l386.233,-222.988c5.538,-3.2 12.634,-4.841 19.359,-4.841c5.57,-0 10.891,1.125 14.866,3.421l2.95,1.704c0.442,0.304 0.896,0.591 1.359,0.858l598.745,345.683c3.717,2.6 5.184,5.988 4.492,9.421c-0.675,3.354 -3.417,6.75 -8.137,9.492c6.625,-3.854 9.262,-8.975 7.854,-13.471c-0.904,3.138 -3.496,6.267 -7.929,8.829l-386.238,222.992c-5.537,3.2 -12.633,4.837 -19.358,4.837Zm19.158,-0.033c0.067,-0.037 0.133,-0.075 0.2,-0.117c-0.067,0.042 -0.133,0.08 -0.2,0.117Zm386.438,-223.108c0.025,-0.017 0.05,-0.029 0.075,-0.046c-0.025,0.012 -0.05,0.029 -0.075,0.046Zm-1022.25,-123.038c-0.021,-0.008 -0.038,-0.021 -0.059,-0.033c0.021,0.012 0.038,0.025 0.059,0.033Z"
|
||||
style="fill:url(#_Radial7);"></path>
|
||||
<path
|
||||
id="base-highlight"
|
||||
d="M1390.02,971.856l-386.238,222.992c-10.125,5.85 -25.446,6.483 -34.217,1.421l-601.795,-347.45c-2.992,-1.725 -4.742,-3.9 -5.475,-6.238c-1.159,4.034 0.541,8.079 5.475,10.925l601.795,347.446c8.771,5.067 24.092,4.433 34.217,-1.417l386.238,-222.991c6.679,-3.859 9.341,-9 7.929,-13.517c-0.904,3.138 -3.496,6.267 -7.929,8.829Z"
|
||||
style="fill:#fff;fill-rule:nonzero;"></path>
|
||||
<g id="keyboard">
|
||||
<path
|
||||
d="M657.573,797.76c-1.033,0 -2.021,-0.212 -2.763,-0.637l-20.316,-11.729c-0.738,-0.425 -1.1,-0.996 -1.1,-1.596c-0,-0.725 0.529,-1.483 1.558,-2.079l23.983,-13.846c1.03,-0.596 2.346,-0.9 3.596,-0.9c1.038,-0 2.025,0.208 2.767,0.637l20.317,11.73c0.737,0.425 1.1,0.995 1.1,1.595c0.004,0.721 -0.525,1.484 -1.555,2.075l-23.983,13.85c-1.033,0.592 -2.35,0.9 -3.604,0.9Z"
|
||||
></path>
|
||||
<path
|
||||
d="M688.952,815.873c-1.037,-0 -2.025,-0.208 -2.762,-0.633l-20.317,-11.734c-0.742,-0.425 -1.104,-0.996 -1.104,-1.591c-0,-0.725 0.529,-1.488 1.558,-2.08l23.983,-13.85c1.03,-0.591 2.346,-0.895 3.596,-0.895c1.038,-0 2.029,0.208 2.767,0.637l20.317,11.725c0.741,0.429 1.104,1 1.104,1.6c-0,0.721 -0.529,1.483 -1.559,2.075l-23.983,13.846c-1.029,0.596 -2.35,0.9 -3.6,0.9Z"
|
||||
></path>
|
||||
<path
|
||||
d="M720.327,833.99c-1.033,-0 -2.025,-0.209 -2.762,-0.634l-20.317,-11.733c-0.738,-0.425 -1.1,-0.996 -1.104,-1.596c-0,-0.721 0.529,-1.483 1.558,-2.079l23.983,-13.846c1.034,-0.596 2.35,-0.9 3.605,-0.9c1.033,0 2.02,0.208 2.762,0.638l20.317,11.729c0.737,0.429 1.1,1 1.1,1.596c-0,0.725 -0.529,1.483 -1.559,2.079l-23.983,13.846c-1.029,0.595 -2.35,0.9 -3.6,0.9Z"
|
||||
></path>
|
||||
<path
|
||||
d="M763.723,819.031c-1.038,0 -2.029,-0.212 -2.767,-0.637l-20.316,-11.734c-0.738,-0.425 -1.1,-0.995 -1.1,-1.591c-0,-0.725 0.529,-1.484 1.558,-2.084l20.129,-11.62c1.029,-0.592 2.354,-0.896 3.604,-0.896c1.034,-0 2.021,0.208 2.759,0.633l20.32,11.729c0.738,0.425 1.1,1 1.1,1.596c0,0.725 -0.525,1.488 -1.558,2.079l-20.129,11.621c-1.029,0.596 -2.354,0.904 -3.6,0.904Z"
|
||||
></path>
|
||||
<path
|
||||
d="M795.098,837.144c-1.038,-0 -2.025,-0.209 -2.767,-0.638l-20.321,-11.729c-0.737,-0.425 -1.095,-0.996 -1.095,-1.596c-0,-0.721 0.529,-1.483 1.562,-2.079l20.129,-11.621c1.029,-0.596 2.35,-0.9 3.6,-0.9c1.034,0 2.025,0.209 2.763,0.638l20.316,11.729c0.742,0.425 1.105,0.996 1.105,1.596c-0,0.721 -0.53,1.483 -1.559,2.079l-20.129,11.621c-1.033,0.596 -2.35,0.9 -3.604,0.9Z"
|
||||
></path>
|
||||
<path
|
||||
d="M826.473,855.26c-1.038,0 -2.025,-0.208 -2.763,-0.637l-20.316,-11.729c-0.742,-0.429 -1.104,-1 -1.1,-1.596c-0,-0.721 0.529,-1.483 1.558,-2.079l20.129,-11.621c1.029,-0.596 2.35,-0.9 3.6,-0.9c1.038,-0 2.025,0.208 2.763,0.633l20.316,11.734c0.742,0.425 1.105,0.995 1.105,1.595c-0,0.721 -0.53,1.484 -1.559,2.075l-20.129,11.625c-1.029,0.596 -2.35,0.9 -3.604,0.9Z"
|
||||
></path>
|
||||
<path
|
||||
d="M857.852,873.377c-1.037,0 -2.029,-0.212 -2.767,-0.637l-20.316,-11.734c-0.742,-0.425 -1.1,-0.996 -1.1,-1.591c-0,-0.725 0.529,-1.484 1.558,-2.084l20.129,-11.621c1.034,-0.591 2.35,-0.895 3.6,-0.895c1.038,-0 2.025,0.208 2.767,0.633l20.317,11.729c0.737,0.429 1.1,1 1.1,1.596c-0,0.725 -0.53,1.487 -1.559,2.079l-20.129,11.621c-1.029,0.596 -2.35,0.904 -3.6,0.904Z"
|
||||
></path>
|
||||
<path
|
||||
d="M889.227,891.49c-1.037,-0 -2.029,-0.209 -2.767,-0.638l-20.316,-11.729c-0.738,-0.425 -1.1,-0.996 -1.1,-1.596c-0,-0.721 0.529,-1.483 1.558,-2.079l20.133,-11.621c1.03,-0.596 2.346,-0.9 3.6,-0.9c1.034,0 2.021,0.208 2.763,0.638l20.317,11.729c0.737,0.425 1.1,0.996 1.1,1.596c-0,0.72 -0.525,1.483 -1.555,2.079l-20.133,11.621c-1.029,0.595 -2.35,0.9 -3.6,0.9Z"
|
||||
></path>
|
||||
<path
|
||||
d="M920.598,909.606c-1.033,0 -2.021,-0.208 -2.763,-0.637l-20.316,-11.729c-0.738,-0.43 -1.1,-1 -1.1,-1.596c0.004,-0.725 0.529,-1.488 1.562,-2.079l20.129,-11.621c1.03,-0.596 2.35,-0.9 3.605,-0.9c1.033,-0 2.02,0.208 2.758,0.633l20.317,11.733c0.741,0.425 1.104,0.996 1.104,1.596c-0,0.721 -0.529,1.484 -1.559,2.079l-20.129,11.621c-1.033,0.592 -2.354,0.9 -3.608,0.9Z"
|
||||
></path>
|
||||
<path
|
||||
d="M951.977,927.719c-1.037,-0 -2.025,-0.209 -2.762,-0.634l-20.317,-11.733c-0.742,-0.425 -1.104,-0.996 -1.1,-1.596c-0,-0.721 0.529,-1.483 1.558,-2.079l20.129,-11.621c1.03,-0.596 2.35,-0.9 3.6,-0.9c1.038,0 2.025,0.209 2.763,0.638l20.317,11.729c0.741,0.429 1.104,0.996 1.104,1.596c-0,0.721 -0.529,1.483 -1.559,2.079l-20.129,11.621c-1.029,0.596 -2.35,0.9 -3.604,0.9Z"
|
||||
></path>
|
||||
<path
|
||||
d="M983.352,945.835c-1.033,0 -2.025,-0.208 -2.762,-0.637l-20.317,-11.729c-0.738,-0.421 -1.1,-0.996 -1.1,-1.596c-0,-0.721 0.529,-1.483 1.558,-2.075l20.129,-11.625c1.034,-0.596 2.35,-0.9 3.6,-0.9c1.038,-0 2.025,0.208 2.767,0.637l20.317,11.73c0.737,0.429 1.1,0.995 1.1,1.595c-0,0.721 -0.525,1.484 -1.559,2.084l-20.129,11.621c-1.029,0.591 -2.35,0.895 -3.604,0.895Z"
|
||||
></path>
|
||||
<path
|
||||
d="M1014.73,963.948c-1.037,-0 -2.025,-0.208 -2.766,-0.633l-20.317,-11.73c-0.738,-0.429 -1.1,-1 -1.1,-1.595c-0,-0.725 0.529,-1.488 1.562,-2.08l20.13,-11.62c1.029,-0.6 2.345,-0.905 3.6,-0.905c1.033,0 2.025,0.213 2.762,0.638l20.317,11.733c0.737,0.425 1.1,0.996 1.1,1.592c0.004,0.721 -0.525,1.483 -1.554,2.079l-20.13,11.621c-1.033,0.596 -2.354,0.9 -3.604,0.9Z"
|
||||
></path>
|
||||
<path
|
||||
d="M1046.11,982.065c-1.037,-0 -2.025,-0.209 -2.762,-0.634l-20.321,-11.733c-0.738,-0.425 -1.1,-0.996 -1.1,-1.596c0.004,-0.721 0.533,-1.483 1.562,-2.079l20.13,-11.621c1.029,-0.596 2.35,-0.9 3.6,-0.9c1.033,0 2.025,0.208 2.762,0.638l20.317,11.729c0.741,0.425 1.104,0.996 1.104,1.596c-0,0.72 -0.529,1.483 -1.558,2.079l-20.13,11.621c-1.033,0.595 -2.354,0.9 -3.604,0.9Z"
|
||||
></path>
|
||||
<path
|
||||
d="M809.952,810.452c-1.037,0 -2.025,-0.208 -2.762,-0.633l-20.317,-11.729c-0.742,-0.43 -1.104,-1 -1.104,-1.6c-0,-0.721 0.529,-1.484 1.558,-2.075l20.133,-11.625c1.034,-0.596 2.35,-0.9 3.6,-0.9c1.038,-0 2.025,0.208 2.763,0.633l20.317,11.733c0.741,0.425 1.104,1 1.104,1.596c-0,0.721 -0.529,1.483 -1.559,2.079l-20.133,11.625c-1.029,0.592 -2.35,0.896 -3.6,0.896Z"
|
||||
></path>
|
||||
<path
|
||||
d="M778.11,792.069c-1.037,-0 -2.025,-0.209 -2.766,-0.638l-20.317,-11.729c-0.737,-0.429 -1.1,-1 -1.1,-1.596c0,-0.721 0.525,-1.483 1.558,-2.079l20.134,-11.621c1.025,-0.596 2.35,-0.9 3.6,-0.9c1.033,0 2.021,0.209 2.758,0.634l20.321,11.733c0.737,0.425 1.1,0.996 1.1,1.596c-0,0.721 -0.525,1.483 -1.558,2.075l-20.134,11.621c-1.029,0.6 -2.35,0.904 -3.596,0.904Z"
|
||||
></path>
|
||||
<path
|
||||
d="M746.215,773.652c-1.038,0 -2.03,-0.208 -2.767,-0.637l-43.758,-25.259c-0.742,-0.429 -1.1,-1 -1.1,-1.6c-0,-0.721 0.529,-1.483 1.554,-2.075l20.133,-11.625c1.033,-0.596 2.35,-0.9 3.604,-0.9c1.034,0 2.021,0.209 2.763,0.634l43.758,25.266c0.738,0.425 1.1,1 1.1,1.596c0,0.721 -0.525,1.483 -1.558,2.079l-20.134,11.625c-1.029,0.592 -2.345,0.896 -3.595,0.896Z"
|
||||
></path>
|
||||
<path
|
||||
d="M768.506,751.256c-1.033,0 -2.029,-0.208 -2.766,-0.633l-35.509,-20.504c-0.737,-0.425 -1.1,-1 -1.1,-1.596c0,-0.721 0.529,-1.483 1.559,-2.079l20.129,-11.625c1.029,-0.592 2.35,-0.896 3.6,-0.896c1.033,-0 2.025,0.208 2.766,0.637l35.509,20.5c0.741,0.425 1.104,0.996 1.104,1.596c-0,0.721 -0.529,1.484 -1.558,2.079l-20.13,11.625c-1.037,0.592 -2.354,0.896 -3.604,0.896Z"
|
||||
></path>
|
||||
<path
|
||||
d="M841.327,828.569c-1.037,-0 -2.025,-0.209 -2.762,-0.634l-20.317,-11.733c-0.738,-0.425 -1.1,-0.996 -1.1,-1.596c-0,-0.721 0.525,-1.483 1.554,-2.075l20.133,-11.629c1.034,-0.592 2.355,-0.896 3.605,-0.896c1.033,0 2.02,0.209 2.762,0.634l20.317,11.729c0.737,0.429 1.1,1 1.1,1.6c-0,0.721 -0.525,1.483 -1.559,2.075l-20.133,11.625c-1.029,0.596 -2.35,0.9 -3.6,0.9Z"
|
||||
></path>
|
||||
<path
|
||||
d="M872.706,846.685c-1.033,0 -2.025,-0.212 -2.766,-0.641l-20.317,-11.725c-0.738,-0.429 -1.1,-1 -1.1,-1.596c-0,-0.725 0.525,-1.483 1.558,-2.079l20.134,-11.625c1.029,-0.596 2.35,-0.9 3.6,-0.9c1.037,-0 2.025,0.208 2.762,0.637l20.317,11.729c0.737,0.43 1.1,1 1.1,1.596c0.004,0.725 -0.525,1.484 -1.554,2.079l-20.134,11.625c-1.033,0.592 -2.35,0.9 -3.6,0.9Z"
|
||||
></path>
|
||||
<path
|
||||
d="M904.085,864.798c-1.037,-0 -2.029,-0.208 -2.77,-0.638l-20.313,-11.725c-0.742,-0.429 -1.104,-1 -1.104,-1.6c-0,-0.72 0.529,-1.483 1.558,-2.075l20.134,-11.625c1.029,-0.595 2.35,-0.9 3.6,-0.9c1.037,0 2.025,0.209 2.762,0.634l20.317,11.733c0.741,0.425 1.104,1 1.104,1.596c-0,0.721 -0.529,1.483 -1.558,2.079l-20.134,11.625c-1.029,0.592 -2.346,0.896 -3.596,0.896Z"
|
||||
></path>
|
||||
<path
|
||||
d="M935.46,882.915c-1.037,-0 -2.029,-0.213 -2.766,-0.638l-20.317,-11.729c-0.742,-0.425 -1.104,-1 -1.104,-1.596c-0,-0.721 0.529,-1.483 1.558,-2.079l20.134,-11.625c1.033,-0.592 2.35,-0.896 3.604,-0.896c1.033,0 2.021,0.208 2.762,0.633l20.317,11.73c0.737,0.429 1.1,1 1.1,1.6c-0,0.72 -0.529,1.483 -1.558,2.075l-20.134,11.625c-1.029,0.595 -2.346,0.9 -3.596,0.9Z"
|
||||
></path>
|
||||
<path
|
||||
d="M966.835,901.027c-1.037,0 -2.025,-0.208 -2.766,-0.637l-20.317,-11.73c-0.737,-0.425 -1.1,-0.995 -1.1,-1.595c0,-0.721 0.525,-1.484 1.558,-2.08l20.13,-11.62c1.033,-0.596 2.354,-0.9 3.604,-0.9c1.033,-0 2.025,0.208 2.762,0.637l20.317,11.729c0.737,0.429 1.1,1 1.1,1.596c-0,0.725 -0.525,1.483 -1.558,2.079l-20.134,11.621c-1.029,0.596 -2.346,0.9 -3.596,0.9Z"
|
||||
></path>
|
||||
<path
|
||||
d="M998.21,919.144c-1.037,-0 -2.025,-0.209 -2.766,-0.638l-20.317,-11.729c-0.737,-0.429 -1.1,-1 -1.1,-1.596c0,-0.721 0.525,-1.483 1.558,-2.079l20.134,-11.621c1.029,-0.596 2.35,-0.9 3.6,-0.9c1.037,0 2.025,0.209 2.762,0.634l20.317,11.733c0.742,0.425 1.104,0.996 1.104,1.596c0,0.721 -0.529,1.483 -1.558,2.075l-20.134,11.625c-1.033,0.596 -2.35,0.9 -3.6,0.9Z"
|
||||
></path>
|
||||
<path
|
||||
d="M1029.59,937.26c-1.037,0 -2.025,-0.212 -2.762,-0.637l-20.317,-11.729c-0.741,-0.429 -1.104,-1 -1.104,-1.596c0,-0.721 0.529,-1.483 1.558,-2.083l20.134,-11.621c1.029,-0.592 2.35,-0.896 3.6,-0.896c1.037,-0 2.025,0.208 2.762,0.633l20.317,11.729c0.742,0.425 1.104,1 1.104,1.596c0,0.729 -0.529,1.488 -1.558,2.079l-20.134,11.621c-1.029,0.596 -2.35,0.904 -3.6,0.904Z"
|
||||
></path>
|
||||
<path
|
||||
d="M1060.96,955.373c-1.033,-0 -2.025,-0.208 -2.762,-0.638l-20.317,-11.729c-0.741,-0.421 -1.104,-0.996 -1.104,-1.596c0,-0.72 0.529,-1.483 1.558,-2.075l20.134,-11.62c1.033,-0.6 2.35,-0.905 3.604,-0.905c1.033,0 2.021,0.209 2.762,0.638l20.317,11.729c0.738,0.429 1.1,0.996 1.1,1.596c0,0.721 -0.525,1.483 -1.558,2.083l-20.134,11.617c-1.029,0.596 -2.35,0.9 -3.6,0.9Z"
|
||||
></path>
|
||||
<path
|
||||
d="M1092.34,973.49c-1.038,-0 -2.025,-0.209 -2.767,-0.638l-20.317,-11.729c-0.737,-0.429 -1.1,-1 -1.1,-1.596c0,-0.721 0.525,-1.483 1.559,-2.079l20.133,-11.621c1.029,-0.596 2.35,-0.9 3.6,-0.9c1.033,0 2.025,0.208 2.762,0.633l20.317,11.734c0.738,0.425 1.1,0.996 1.1,1.596c0,0.72 -0.525,1.483 -1.554,2.075l-20.133,11.625c-1.034,0.595 -2.35,0.9 -3.6,0.9Z"
|
||||
></path>
|
||||
<path
|
||||
d="M1148.12,1005.69c-1.038,-0 -2.025,-0.209 -2.763,-0.634l-44.333,-25.595c-0.738,-0.43 -1.1,-1 -1.1,-1.596c-0,-0.725 0.525,-1.484 1.558,-2.079l20.134,-11.625c1.025,-0.596 2.345,-0.9 3.6,-0.9c1.033,-0 2.025,0.208 2.762,0.637l44.329,25.592c0.738,0.429 1.1,1 1.1,1.596c0,0.725 -0.525,1.483 -1.558,2.079l-20.129,11.625c-1.029,0.596 -2.35,0.9 -3.6,0.9Z"
|
||||
></path>
|
||||
<path
|
||||
d="M1209.21,970.427c-1.037,0 -2.025,-0.212 -2.766,-0.637l-37.417,-21.605c-0.742,-0.425 -1.104,-0.995 -1.1,-1.595c-0,-0.717 0.529,-1.484 1.558,-2.08l20.129,-11.62c1.03,-0.596 2.35,-0.9 3.605,-0.9c1.033,-0 2.02,0.208 2.758,0.637l37.421,21.6c0.737,0.429 1.1,1 1.1,1.596c-0,0.725 -0.529,1.487 -1.563,2.079l-20.129,11.621c-1.029,0.596 -2.346,0.904 -3.596,0.904Z"
|
||||
></path>
|
||||
<path
|
||||
d="M896.281,825.023c-1.037,-0 -2.029,-0.208 -2.771,-0.638l-20.316,-11.725c-0.738,-0.429 -1.1,-1 -1.1,-1.6c-0,-0.72 0.529,-1.479 1.558,-2.075l20.129,-11.625c1.029,-0.595 2.35,-0.9 3.604,-0.9c1.034,0 2.021,0.209 2.759,0.634l20.321,11.733c0.741,0.425 1.1,1 1.1,1.596c-0,0.721 -0.53,1.483 -1.559,2.079l-20.129,11.625c-1.029,0.592 -2.346,0.896 -3.596,0.896Z"
|
||||
></path>
|
||||
<path
|
||||
d="M864.119,806.456c-1.038,0 -2.025,-0.208 -2.763,-0.633l-20.316,-11.729c-0.742,-0.429 -1.105,-1 -1.105,-1.6c0,-0.721 0.53,-1.484 1.559,-2.075l20.129,-11.621c1.033,-0.596 2.35,-0.904 3.604,-0.904c1.033,-0 2.025,0.212 2.767,0.637l20.312,11.734c0.742,0.425 1.104,0.995 1.104,1.591c-0.004,0.725 -0.529,1.484 -1.558,2.084l-20.133,11.62c-1.029,0.592 -2.35,0.896 -3.6,0.896Z"
|
||||
></path>
|
||||
<path
|
||||
d="M831.96,787.894c-1.033,-0 -2.025,-0.209 -2.762,-0.638l-20.317,-11.729c-0.737,-0.429 -1.1,-1 -1.104,-1.596c0,-0.721 0.529,-1.483 1.558,-2.079l20.134,-11.621c1.033,-0.596 2.35,-0.9 3.604,-0.9c1.033,0 2.021,0.209 2.762,0.634l20.317,11.733c0.738,0.425 1.1,0.996 1.1,1.596c0,0.721 -0.525,1.483 -1.558,2.075l-20.134,11.625c-1.029,0.596 -2.345,0.9 -3.6,0.9Z"
|
||||
></path>
|
||||
<path
|
||||
d="M799.81,769.327c-1.037,0 -2.029,-0.208 -2.77,-0.637l-20.317,-11.725c-0.738,-0.43 -1.104,-1 -1.104,-1.6c-0,-0.721 0.533,-1.484 1.562,-2.075l20.134,-11.625c1.029,-0.596 2.345,-0.9 3.6,-0.9c1.033,-0 2.025,0.208 2.762,0.633l20.317,11.733c0.737,0.425 1.1,0.996 1.1,1.596c-0,0.721 -0.525,1.483 -1.554,2.079l-20.134,11.625c-1.029,0.592 -2.346,0.896 -3.596,0.896Z"
|
||||
></path>
|
||||
<path
|
||||
d="M927.656,843.14c-1.037,-0 -2.029,-0.209 -2.766,-0.638l-20.317,-11.729c-0.742,-0.425 -1.104,-0.996 -1.104,-1.596c-0,-0.721 0.529,-1.483 1.558,-2.075l20.129,-11.625c1.034,-0.596 2.354,-0.9 3.604,-0.9c1.038,0 2.025,0.208 2.763,0.633l20.321,11.73c0.737,0.429 1.1,1 1.1,1.6c-0.004,0.72 -0.534,1.483 -1.563,2.075l-20.129,11.625c-1.029,0.595 -2.346,0.9 -3.596,0.9Z"
|
||||
></path>
|
||||
<path
|
||||
d="M959.031,861.256c-1.037,0 -2.025,-0.212 -2.766,-0.641l-20.317,-11.725c-0.738,-0.43 -1.1,-1 -1.1,-1.596c-0.004,-0.725 0.525,-1.488 1.554,-2.084l20.133,-11.62c1.03,-0.592 2.35,-0.9 3.6,-0.9c1.034,-0 2.021,0.208 2.763,0.637l20.321,11.729c0.737,0.429 1.1,1 1.1,1.596c-0,0.725 -0.529,1.483 -1.563,2.079l-20.129,11.625c-1.029,0.592 -2.346,0.9 -3.596,0.9Z"
|
||||
></path>
|
||||
<path
|
||||
d="M990.406,879.369c-1.037,-0 -2.025,-0.209 -2.766,-0.638l-20.317,-11.729c-0.738,-0.429 -1.1,-0.996 -1.1,-1.596c-0,-0.721 0.525,-1.483 1.558,-2.079l20.129,-11.621c1.03,-0.596 2.35,-0.9 3.6,-0.9c1.038,0 2.025,0.209 2.763,0.634l20.321,11.733c0.741,0.425 1.1,0.996 1.1,1.596c-0,0.721 -0.529,1.483 -1.559,2.079l-20.129,11.621c-1.033,0.596 -2.35,0.9 -3.6,0.9Z"
|
||||
></path>
|
||||
<path
|
||||
d="M1021.78,897.485c-1.037,0 -2.025,-0.212 -2.762,-0.637l-20.317,-11.733c-0.742,-0.425 -1.104,-0.996 -1.104,-1.592c-0,-0.721 0.529,-1.483 1.558,-2.083l20.129,-11.621c1.03,-0.592 2.35,-0.896 3.6,-0.896c1.038,-0 2.025,0.208 2.763,0.633l20.321,11.729c0.741,0.43 1.104,1 1.1,1.596c-0,0.725 -0.529,1.488 -1.559,2.079l-20.129,11.621c-1.029,0.596 -2.35,0.904 -3.6,0.904Z"
|
||||
></path>
|
||||
<path
|
||||
d="M1053.16,915.598c-1.033,-0 -2.025,-0.208 -2.762,-0.638l-20.317,-11.729c-0.742,-0.425 -1.104,-0.996 -1.104,-1.596c-0,-0.72 0.529,-1.483 1.558,-2.079l20.129,-11.621c1.034,-0.595 2.35,-0.9 3.6,-0.9c1.038,0 2.025,0.209 2.767,0.638l20.321,11.729c0.737,0.425 1.096,0.996 1.096,1.596c-0,0.721 -0.525,1.483 -1.559,2.079l-20.129,11.621c-1.029,0.596 -2.35,0.9 -3.6,0.9Z"
|
||||
></path>
|
||||
<path
|
||||
d="M1084.53,933.715c-1.033,-0 -2.021,-0.209 -2.762,-0.638l-20.317,-11.729c-0.737,-0.429 -1.1,-0.996 -1.1,-1.596c0,-0.721 0.525,-1.483 1.554,-2.079l20.134,-11.621c1.029,-0.596 2.35,-0.9 3.6,-0.9c1.033,0 2.025,0.208 2.762,0.633l20.321,11.734c0.737,0.425 1.1,0.996 1.1,1.596c-0.004,0.72 -0.529,1.483 -1.563,2.079l-20.129,11.621c-1.029,0.595 -2.346,0.9 -3.6,0.9Z"
|
||||
></path>
|
||||
<path
|
||||
d="M1115.91,951.831c-1.037,0 -2.025,-0.212 -2.766,-0.637l-20.317,-11.734c-0.737,-0.425 -1.1,-0.995 -1.1,-1.595c0,-0.721 0.529,-1.484 1.558,-2.075l20.13,-11.625c1.029,-0.592 2.35,-0.896 3.6,-0.896c1.037,-0 2.025,0.208 2.762,0.637l20.321,11.729c0.737,0.43 1.1,0.996 1.1,1.592c-0,0.725 -0.529,1.488 -1.558,2.079l-20.13,11.621c-1.029,0.596 -2.35,0.904 -3.6,0.904Z"
|
||||
></path>
|
||||
<path
|
||||
d="M1147.28,969.944c-1.033,-0 -2.021,-0.209 -2.758,-0.638l-20.317,-11.729c-0.741,-0.425 -1.104,-0.996 -1.104,-1.596c0,-0.721 0.529,-1.483 1.558,-2.079l20.13,-11.621c1.029,-0.591 2.35,-0.9 3.6,-0.9c1.037,0 2.025,0.209 2.766,0.638l20.321,11.729c0.733,0.425 1.096,0.996 1.096,1.596c-0,0.721 -0.529,1.483 -1.558,2.079l-20.13,11.621c-1.033,0.596 -2.354,0.9 -3.604,0.9Z"
|
||||
></path>
|
||||
<path
|
||||
d="M1178.66,988.056c-1.033,0 -2.025,-0.208 -2.762,-0.633l-20.317,-11.729c-0.737,-0.429 -1.104,-1 -1.104,-1.596c0,-0.725 0.529,-1.488 1.558,-2.079l20.13,-11.621c1.033,-0.596 2.35,-0.904 3.6,-0.904c1.037,-0 2.025,0.212 2.766,0.637l20.321,11.734c0.738,0.425 1.096,0.995 1.096,1.591c-0,0.725 -0.525,1.484 -1.558,2.084l-20.13,11.62c-1.029,0.592 -2.35,0.896 -3.6,0.896Z"
|
||||
></path>
|
||||
<path
|
||||
d="M879.752,780.219c-1.033,-0 -2.025,-0.213 -2.762,-0.638l-20.317,-11.729c-0.742,-0.425 -1.104,-1 -1.1,-1.596c-0,-0.725 0.529,-1.483 1.558,-2.079l20.129,-11.621c1.03,-0.596 2.35,-0.904 3.6,-0.904c1.038,0 2.025,0.213 2.763,0.638l20.317,11.733c0.741,0.425 1.104,0.996 1.104,1.596c-0,0.721 -0.529,1.483 -1.559,2.079l-20.129,11.621c-1.029,0.591 -2.35,0.9 -3.604,0.9Z"
|
||||
></path>
|
||||
<path
|
||||
d="M848.535,762.194c-1.037,-0 -2.025,-0.209 -2.766,-0.638l-20.313,-11.729c-0.741,-0.429 -1.104,-1 -1.104,-1.596c0,-0.725 0.529,-1.487 1.558,-2.079l20.13,-11.621c1.029,-0.596 2.35,-0.9 3.604,-0.9c1.033,0 2.021,0.209 2.758,0.634l20.321,11.733c0.742,0.425 1.104,0.996 1.1,1.596c-0,0.721 -0.529,1.483 -1.558,2.079l-20.13,11.621c-1.029,0.596 -2.35,0.9 -3.6,0.9Z"
|
||||
></path>
|
||||
<path
|
||||
d="M817.315,744.169c-1.038,-0 -2.025,-0.209 -2.767,-0.638l-20.317,-11.733c-0.737,-0.425 -1.1,-0.996 -1.1,-1.592c0,-0.721 0.525,-1.483 1.559,-2.079l20.133,-11.621c1.029,-0.596 2.35,-0.9 3.6,-0.9c1.037,0 2.025,0.209 2.762,0.634l20.317,11.729c0.738,0.429 1.1,1 1.104,1.596c0,0.725 -0.529,1.487 -1.558,2.079l-20.133,11.621c-1.034,0.6 -2.35,0.904 -3.6,0.904Z"
|
||||
></path>
|
||||
<path
|
||||
d="M786.098,726.144c-1.038,-0 -2.029,-0.213 -2.767,-0.638l-20.321,-11.729c-0.737,-0.425 -1.1,-1 -1.1,-1.596c0,-0.721 0.525,-1.483 1.559,-2.079l20.133,-11.625c1.029,-0.592 2.35,-0.896 3.6,-0.896c1.033,0 2.025,0.209 2.763,0.634l20.316,11.729c0.738,0.429 1.1,1 1.1,1.6c0,0.721 -0.525,1.483 -1.558,2.075l-20.129,11.625c-1.029,0.596 -2.346,0.9 -3.596,0.9Z"
|
||||
></path>
|
||||
<path
|
||||
d="M818.198,707.606c-1.038,0 -2.025,-0.208 -2.767,-0.633l-20.316,-11.733c-0.738,-0.425 -1.1,-0.996 -1.1,-1.596c-0,-0.721 0.529,-1.484 1.558,-2.079l6.654,-3.842c1.033,-0.592 2.35,-0.896 3.6,-0.896c1.038,0 2.025,0.208 2.767,0.633l20.316,11.73c0.738,0.429 1.1,1 1.1,1.6c0,0.72 -0.525,1.483 -1.558,2.075l-6.654,3.841c-1.029,0.596 -2.35,0.9 -3.6,0.9Z"
|
||||
></path>
|
||||
<path
|
||||
d="M858.94,731.131c-1.038,0 -2.025,-0.208 -2.763,-0.637l-20.317,-11.729c-0.741,-0.43 -1.104,-1 -1.104,-1.596c0,-0.721 0.529,-1.484 1.559,-2.079l6.658,-3.842c1.029,-0.596 2.35,-0.9 3.6,-0.9c1.033,-0 2.025,0.208 2.762,0.633l20.317,11.734c0.738,0.425 1.1,1 1.1,1.595c0,0.721 -0.525,1.484 -1.554,2.08l-6.658,3.841c-1.03,0.596 -2.35,0.9 -3.6,0.9Z"
|
||||
></path>
|
||||
<path
|
||||
d="M890.031,749.081c-1.037,0 -2.025,-0.208 -2.762,-0.633l-20.321,-11.733c-0.738,-0.43 -1.1,-1 -1.1,-1.596c-0,-0.721 0.529,-1.484 1.558,-2.079l6.654,-3.846c1.03,-0.592 2.346,-0.896 3.596,-0.896c1.038,-0 2.029,0.208 2.771,0.637l20.317,11.725c0.737,0.43 1.1,1 1.1,1.6c-0,0.721 -0.529,1.484 -1.563,2.075l-6.65,3.846c-1.029,0.596 -2.35,0.9 -3.6,0.9Z"
|
||||
></path>
|
||||
<path
|
||||
d="M921.119,767.031c-1.038,0 -2.025,-0.212 -2.767,-0.637l-20.317,-11.729c-0.737,-0.425 -1.1,-0.996 -1.1,-1.596c0.005,-0.725 0.534,-1.484 1.563,-2.079l6.65,-3.842c1.033,-0.596 2.35,-0.9 3.6,-0.9c1.037,-0 2.025,0.208 2.767,0.637l20.316,11.73c0.738,0.425 1.1,0.995 1.1,1.595c0,0.721 -0.525,1.484 -1.558,2.08l-6.65,3.841c-1.033,0.592 -2.354,0.9 -3.604,0.9Z"
|
||||
></path>
|
||||
<path
|
||||
d="M952.21,784.981c-1.037,0 -2.025,-0.212 -2.766,-0.637l-20.317,-11.734c-0.737,-0.425 -1.1,-0.995 -1.1,-1.591c0,-0.721 0.525,-1.484 1.558,-2.079l6.655,-3.842c1.033,-0.596 2.354,-0.9 3.604,-0.9c1.033,-0 2.021,0.208 2.762,0.633l20.317,11.734c0.737,0.425 1.1,0.995 1.1,1.595c-0,0.721 -0.525,1.484 -1.558,2.075l-6.655,3.842c-1.033,0.6 -2.35,0.904 -3.6,0.904Z"
|
||||
></path>
|
||||
<path
|
||||
d="M1125.78,885.19c-1.037,-0 -2.025,-0.209 -2.762,-0.634l-20.317,-11.733c-0.742,-0.425 -1.104,-0.996 -1.104,-1.596c-0,-0.721 0.529,-1.483 1.558,-2.079l6.654,-3.838c1.03,-0.595 2.35,-0.9 3.6,-0.9c1.038,0 2.025,0.209 2.763,0.634l20.321,11.729c0.737,0.429 1.1,1 1.1,1.596c-0,0.725 -0.529,1.487 -1.559,2.079l-6.654,3.842c-1.029,0.595 -2.35,0.9 -3.6,0.9Z"
|
||||
></path>
|
||||
<path
|
||||
d="M1156.87,903.14c-1.038,-0 -2.029,-0.209 -2.771,-0.638l-20.312,-11.725c-0.742,-0.429 -1.105,-1 -1.105,-1.6c0.005,-0.721 0.534,-1.483 1.563,-2.079l6.654,-3.842c1.029,-0.596 2.346,-0.9 3.6,-0.9c1.033,0 2.021,0.209 2.763,0.638l20.316,11.729c0.738,0.429 1.1,1 1.1,1.596c0,0.725 -0.525,1.483 -1.558,2.079l-6.65,3.846c-1.029,0.591 -2.35,0.896 -3.6,0.896Z"
|
||||
></path>
|
||||
<path
|
||||
d="M1187.96,921.09c-1.037,-0 -2.025,-0.209 -2.766,-0.634l-20.317,-11.733c-0.737,-0.425 -1.1,-0.996 -1.1,-1.596c0,-0.721 0.529,-1.483 1.558,-2.075l6.655,-3.842c1.033,-0.595 2.35,-0.904 3.6,-0.904c1.037,0 2.025,0.213 2.766,0.638l20.317,11.733c0.737,0.425 1.1,0.996 1.1,1.592c-0,0.721 -0.525,1.483 -1.558,2.083l-6.655,3.838c-1.033,0.595 -2.35,0.9 -3.6,0.9Z"
|
||||
></path>
|
||||
<path
|
||||
d="M1219.05,939.04c-1.033,-0 -2.021,-0.209 -2.763,-0.638l-20.316,-11.729c-0.738,-0.425 -1.1,-0.996 -1.1,-1.596c-0,-0.721 0.525,-1.483 1.558,-2.079l6.65,-3.842c1.033,-0.591 2.354,-0.896 3.604,-0.896c1.038,0 2.025,0.209 2.763,0.634l20.321,11.729c0.737,0.425 1.1,1 1.1,1.6c-0,0.721 -0.53,1.479 -1.563,2.075l-6.65,3.842c-1.033,0.595 -2.354,0.9 -3.604,0.9Z"
|
||||
></path>
|
||||
<path
|
||||
d="M911.131,798.331c-1.037,0 -2.029,-0.208 -2.766,-0.633l-20.317,-11.733c-0.738,-0.425 -1.1,-0.996 -1.1,-1.596c-0,-0.721 0.529,-1.484 1.558,-2.075l20.129,-11.621c1.034,-0.6 2.35,-0.904 3.6,-0.904c1.038,-0 2.025,0.208 2.767,0.637l20.317,11.729c0.737,0.43 1.1,1 1.1,1.596c-0,0.721 -0.525,1.484 -1.559,2.079l-20.129,11.621c-1.029,0.596 -2.35,0.9 -3.6,0.9Z"
|
||||
></path>
|
||||
<path
|
||||
d="M942.506,816.448c-1.037,-0 -2.025,-0.208 -2.766,-0.638l-20.317,-11.729c-0.738,-0.429 -1.1,-1 -1.1,-1.596c-0,-0.725 0.529,-1.483 1.562,-2.079l20.13,-11.625c1.029,-0.591 2.345,-0.896 3.595,-0.896c1.038,0 2.025,0.209 2.767,0.638l20.317,11.725c0.737,0.429 1.1,1 1.1,1.6c-0,0.721 -0.525,1.483 -1.554,2.079l-20.13,11.621c-1.033,0.596 -2.354,0.9 -3.604,0.9Z"
|
||||
></path>
|
||||
<path
|
||||
d="M973.881,834.56c-1.037,0 -2.025,-0.208 -2.762,-0.633l-20.321,-11.729c-0.738,-0.429 -1.1,-1 -1.1,-1.6c0.004,-0.721 0.533,-1.483 1.562,-2.075l20.13,-11.625c1.029,-0.596 2.345,-0.9 3.595,-0.9c1.038,-0 2.03,0.212 2.767,0.637l20.317,11.73c0.741,0.429 1.104,1 1.104,1.595c-0,0.725 -0.529,1.484 -1.558,2.08l-20.13,11.625c-1.033,0.591 -2.35,0.895 -3.604,0.895Z"
|
||||
></path>
|
||||
<path
|
||||
d="M1005.26,852.677c-1.033,0 -2.025,-0.208 -2.762,-0.633l-20.317,-11.734c-0.742,-0.425 -1.1,-0.995 -1.1,-1.595c0,-0.721 0.529,-1.484 1.558,-2.075l20.13,-11.625c1.029,-0.596 2.35,-0.9 3.6,-0.9c1.033,-0 2.025,0.208 2.762,0.637l20.321,11.729c0.737,0.425 1.1,0.996 1.1,1.596c-0,0.721 -0.529,1.483 -1.558,2.075l-20.13,11.625c-1.029,0.596 -2.35,0.9 -3.604,0.9Z"
|
||||
></path>
|
||||
<path
|
||||
d="M1036.63,870.794c-1.037,-0 -2.029,-0.209 -2.766,-0.634l-20.317,-11.733c-0.737,-0.429 -1.1,-1 -1.1,-1.596c0,-0.721 0.529,-1.483 1.558,-2.079l20.134,-11.625c1.029,-0.592 2.35,-0.896 3.6,-0.896c1.033,0 2.021,0.209 2.762,0.634l20.317,11.729c0.737,0.429 1.1,1 1.1,1.6c-0,0.721 -0.525,1.479 -1.558,2.075l-20.13,11.625c-1.029,0.596 -2.35,0.9 -3.6,0.9Z"
|
||||
></path>
|
||||
<path
|
||||
d="M1068.01,888.906c-1.037,0 -2.025,-0.208 -2.766,-0.633l-20.317,-11.729c-0.737,-0.429 -1.1,-1 -1.1,-1.6c0,-0.721 0.529,-1.479 1.563,-2.075l20.129,-11.625c1.029,-0.596 2.35,-0.9 3.6,-0.9c1.037,-0 2.025,0.208 2.762,0.633l20.317,11.733c0.737,0.425 1.1,1 1.104,1.596c0,0.721 -0.529,1.484 -1.558,2.079l-20.129,11.625c-1.034,0.592 -2.355,0.896 -3.605,0.896Z"
|
||||
></path>
|
||||
<path
|
||||
d="M1099.39,907.023c-1.038,-0 -2.03,-0.208 -2.767,-0.638l-20.317,-11.729c-0.741,-0.425 -1.104,-0.996 -1.1,-1.596c0,-0.72 0.529,-1.483 1.559,-2.075l20.129,-11.625c1.029,-0.595 2.35,-0.9 3.6,-0.9c1.037,0 2.025,0.209 2.762,0.634l20.317,11.729c0.742,0.429 1.104,1 1.104,1.6c0,0.721 -0.529,1.483 -1.558,2.075l-20.129,11.625c-1.03,0.596 -2.35,0.9 -3.6,0.9Z"
|
||||
></path>
|
||||
<path
|
||||
d="M1130.77,925.14c-1.038,-0 -2.03,-0.209 -2.767,-0.638l-20.317,-11.729c-0.741,-0.429 -1.1,-1 -1.1,-1.596c0,-0.725 0.529,-1.483 1.559,-2.079l20.129,-11.625c1.033,-0.592 2.35,-0.9 3.604,-0.9c1.033,-0 2.021,0.212 2.762,0.637l20.317,11.73c0.738,0.429 1.1,1 1.1,1.6c0,0.72 -0.525,1.479 -1.558,2.075l-20.129,11.625c-1.03,0.6 -2.346,0.9 -3.6,0.9Z"
|
||||
></path>
|
||||
<path
|
||||
d="M1162.14,943.252c-1.038,0 -2.029,-0.208 -2.771,-0.637l-20.317,-11.721c-0.737,-0.429 -1.1,-1.004 -1.1,-1.6c0,-0.725 0.529,-1.484 1.559,-2.079l20.129,-11.625c1.033,-0.596 2.354,-0.9 3.604,-0.9c1.033,-0 2.025,0.208 2.762,0.633l20.317,11.733c0.738,0.425 1.1,1 1.1,1.596c0,0.721 -0.525,1.488 -1.558,2.079l-20.129,11.625c-1.03,0.592 -2.346,0.896 -3.596,0.896Z"
|
||||
></path>
|
||||
<path
|
||||
d="M731.752,800.569c-1.037,-0 -2.029,-0.209 -2.771,-0.638l-59.833,-34.546c-0.742,-0.425 -1.104,-0.995 -1.104,-1.595c-0,-0.721 0.529,-1.484 1.558,-2.08l20.133,-11.62c1.034,-0.596 2.35,-0.9 3.605,-0.9c1.033,-0 2.02,0.208 2.762,0.637l59.833,34.546c0.738,0.425 1.096,0.996 1.096,1.596c0.009,0.721 -0.521,1.483 -1.55,2.079l-20.129,11.625c-1.033,0.592 -2.35,0.896 -3.6,0.896Z"
|
||||
></path>
|
||||
<path
|
||||
d="M1117.21,1023.12c-1.033,-0 -2.025,-0.209 -2.762,-0.634l-59.838,-34.55c-0.741,-0.425 -1.104,-0.996 -1.104,-1.591c0.004,-0.725 0.534,-1.488 1.563,-2.084l20.129,-11.621c1.029,-0.591 2.35,-0.9 3.6,-0.9c1.037,0 2.025,0.213 2.762,0.638l59.842,34.546c0.738,0.425 1.1,1 1.1,1.596c-0.004,0.72 -0.529,1.483 -1.562,2.079l-20.13,11.625c-1.029,0.591 -2.35,0.896 -3.6,0.896Z"
|
||||
></path>
|
||||
<path
|
||||
d="M991.731,990.685c-1.033,0 -2.021,-0.208 -2.758,-0.633l-20.321,-11.729c-0.742,-0.429 -1.104,-1 -1.1,-1.6c0,-0.721 0.529,-1.483 1.558,-2.075l23.98,-13.85c1.029,-0.592 2.35,-0.896 3.604,-0.896c1.033,0 2.021,0.208 2.758,0.633l20.321,11.73c0.742,0.429 1.104,1 1.1,1.595c-0,0.725 -0.529,1.488 -1.558,2.08l-23.98,13.845c-1.029,0.596 -2.35,0.9 -3.604,0.9Z"
|
||||
></path>
|
||||
<path
|
||||
d="M763.881,859.135c-1.037,0 -2.025,-0.212 -2.766,-0.637l-32.492,-18.758c-0.738,-0.425 -1.1,-1 -1.1,-1.596c-0,-0.725 0.525,-1.484 1.558,-2.079l23.979,-13.846c1.034,-0.596 2.355,-0.9 3.605,-0.9c1.029,-0 2.025,0.208 2.762,0.633l32.492,18.763c0.737,0.425 1.1,0.995 1.1,1.595c-0,0.721 -0.525,1.484 -1.559,2.08l-23.983,13.845c-1.029,0.596 -2.346,0.9 -3.596,0.9Z"
|
||||
></path>
|
||||
<path
|
||||
d="M961.502,973.231c-1.033,0 -2.025,-0.208 -2.762,-0.633l-32.496,-18.758c-0.742,-0.43 -1.1,-1 -1.1,-1.6c-0,-0.721 0.529,-1.484 1.558,-2.075l23.979,-13.846c1.034,-0.592 2.354,-0.9 3.604,-0.9c1.038,-0 2.025,0.208 2.763,0.633l32.492,18.758c0.741,0.43 1.104,1 1.104,1.596c-0,0.725 -0.529,1.488 -1.559,2.084l-23.983,13.841c-1.029,0.596 -2.35,0.9 -3.6,0.9Z"
|
||||
></path>
|
||||
<path
|
||||
d="M806.519,884.71c-0.046,-0.025 -0.092,-0.05 -0.138,-0.075l-32.487,-18.762c-0.742,-0.425 -1.104,-0.996 -1.104,-1.596c-0,-0.721 0.529,-1.483 1.554,-2.079l23.987,-13.846c1.029,-0.592 2.346,-0.896 3.596,-0.896c1.038,0 2.029,0.209 2.767,0.638l0.221,0.125l-30.805,17.779l32.409,18.712Z"
|
||||
></path>
|
||||
<path d="M837.281,866.906l-27.504,-15.879l27.413,15.825c0.029,0.017 0.062,0.033 0.091,0.054Z"></path>
|
||||
<path
|
||||
d="M918.556,948.323c-1.146,-0 -2.296,-0.254 -3.175,-0.758l-108.862,-62.855l-32.409,-18.712l30.805,-17.779l32.366,18.687l108.904,62.875c0.88,0.504 1.317,1.167 1.317,1.834c0,0.662 -0.437,1.325 -1.317,1.829l-24.454,14.121c-0.875,0.504 -2.025,0.758 -3.175,0.758Z"
|
||||
></path>
|
||||
<path
|
||||
d="M1086.16,1045.37c-0.85,-0 -1.662,-0.171 -2.266,-0.521l-22.634,-13.067c-0.604,-0.35 -0.9,-0.816 -0.9,-1.308c0,-0.587 0.434,-1.212 1.279,-1.7l9.809,-5.667c0.846,-0.487 1.929,-0.737 2.954,-0.737c0.85,-0 1.658,0.171 2.267,0.521l22.625,13.066c0.608,0.35 0.904,0.817 0.904,1.309c-0,0.591 -0.434,1.216 -1.279,1.704l-9.809,5.662c-0.846,0.488 -1.925,0.738 -2.95,0.738Z"
|
||||
></path>
|
||||
<path
|
||||
d="M1054.52,1027.11c-0.85,0 -1.659,-0.17 -2.267,-0.525l-22.629,-13.062c-0.604,-0.35 -0.9,-0.821 -0.904,-1.308c-0,-0.592 0.433,-1.217 1.279,-1.705l9.812,-5.662c0.842,-0.488 1.925,-0.738 2.95,-0.738c0.846,0 1.659,0.171 2.267,0.521l22.625,13.067c0.608,0.346 0.904,0.817 0.904,1.304c0,0.592 -0.429,1.217 -1.275,1.704l-9.812,5.667c-0.842,0.487 -1.925,0.737 -2.95,0.737Z"
|
||||
></path>
|
||||
<path
|
||||
d="M1023.14,1008.99c-0.85,-0 -1.663,-0.171 -2.267,-0.521l-22.629,-13.067c-0.604,-0.35 -0.904,-0.816 -0.904,-1.308c-0,-0.592 0.433,-1.217 1.279,-1.704l9.812,-5.663c0.842,-0.487 1.921,-0.737 2.946,-0.737c0.85,-0 1.663,0.171 2.271,0.521l22.625,13.066c0.608,0.35 0.904,0.817 0.904,1.309c0,0.591 -0.433,1.216 -1.279,1.704l-9.808,5.662c-0.846,0.488 -1.925,0.738 -2.95,0.738Z"
|
||||
></path>
|
||||
<path
|
||||
d="M1071.87,1017.06c-0.85,0 -1.662,-0.171 -2.266,-0.521l-22.629,-13.066c-0.605,-0.35 -0.905,-0.817 -0.905,-1.309c0,-0.591 0.434,-1.216 1.279,-1.704l9.813,-5.662c0.842,-0.488 1.921,-0.738 2.946,-0.738c0.85,0 1.662,0.171 2.271,0.521l22.625,13.067c0.608,0.35 0.904,0.816 0.904,1.308c-0,0.592 -0.434,1.217 -1.279,1.704l-9.809,5.663c-0.846,0.487 -1.925,0.737 -2.95,0.737Z"
|
||||
></path>
|
||||
</g>
|
||||
<path
|
||||
id="trackpad"
|
||||
d="M807.948,1056.95c-5.421,-0 -10.613,-1.129 -14.583,-3.421l-0,0.004l-157.688,-91.037c-4.179,-2.417 -6.479,-5.863 -6.479,-9.717c-0.004,-4.471 3.171,-8.862 8.696,-12.054l81.166,-46.867c5.388,-3.104 12.138,-4.691 18.571,-4.691c5.421,-0 10.617,1.125 14.584,3.412l157.687,91.042c4.179,2.412 6.479,5.862 6.483,9.716c0,4.467 -3.17,8.863 -8.695,12.055l-81.175,46.866c-5.384,3.104 -12.134,4.692 -18.567,4.692Zm-70.242,-163.179c-5.7,-0 -11.754,1.375 -16.366,4.033l-81.167,46.867c-4.083,2.354 -6.425,5.312 -6.425,8.108c-0,2.763 2.287,4.663 4.208,5.767l157.688,91.046c3.208,1.845 7.604,2.75 12.233,2.75c5.704,-0 11.754,-1.367 16.358,-4.034l81.175,-46.862c4.08,-2.354 6.421,-5.309 6.421,-8.109c0,-2.762 -2.287,-4.662 -4.208,-5.77l-157.688,-91.038c-3.2,-1.854 -7.6,-2.758 -12.229,-2.758Z"
|
||||
style="fill:url(#_Radial83);"></path>
|
||||
</g>
|
||||
<g id="screen">
|
||||
<path
|
||||
id="screen-border"
|
||||
d="M1407.56,959.44c4.509,-1.655 8.234,-5.609 10.004,-11.371l135.559,-440.129c3.358,-10.913 -1.563,-24.175 -10.988,-29.621l-599.425,-346.075c-2.733,-1.575 -5.541,-2.321 -8.241,-2.321c-1.517,-0 -3,0.237 -4.413,0.696l10.575,-3.684l0.054,-0.02l0.004,-0c1.284,-0.375 2.625,-0.567 3.996,-0.567c2.696,-0 5.504,0.746 8.238,2.325l599.429,346.075c9.421,5.442 14.342,18.7 10.983,29.612l-135.554,440.134c-1.725,5.604 -5.3,9.487 -9.646,11.212l0.029,0.009l-10.604,3.725Z"
|
||||
style="fill:url(#_Radial84);"></path>
|
||||
<path
|
||||
id="screen-frame"
|
||||
d="M1402.66,960.302c-2.7,0 -5.508,-0.746 -8.241,-2.321l-0.68,-0.396l-598.745,-345.683c-0.463,-0.267 -0.917,-0.554 -1.359,-0.858c-8.529,-5.888 -12.821,-18.384 -9.629,-28.759l135.563,-440.129c1.833,-5.966 5.762,-10 10.487,-11.537c1.413,-0.459 2.896,-0.696 4.413,-0.696c2.7,-0 5.508,0.746 8.241,2.321l599.425,346.075c9.425,5.446 14.346,18.708 10.988,29.621l-135.559,440.129c-1.77,5.762 -5.495,9.716 -10.004,11.371c-1.558,0.57 -3.208,0.862 -4.9,0.862Zm-606.825,-375.15c-0.004,8.625 4.425,17.358 11.525,21.458l581.409,335.959c2.616,1.508 5.304,2.225 7.883,2.225c6.321,-0 11.983,-4.292 14.267,-11.709l129.6,-420.762c0.683,-2.225 1.008,-4.55 1.008,-6.883c-0,-8.63 -4.425,-17.363 -11.525,-21.459l-581.408,-335.954c-2.613,-1.512 -5.305,-2.225 -7.884,-2.225c-6.325,0 -11.987,4.292 -14.266,11.708l-129.6,420.759c-0.684,2.225 -1.009,4.55 -1.009,6.883Z"
|
||||
style="fill:url(#_Radial85);"></path>
|
||||
<path
|
||||
id="screen-background"
|
||||
d="M1396.65,944.794c-2.579,-0 -5.267,-0.717 -7.883,-2.225l-581.409,-335.959c-7.1,-4.1 -11.529,-12.833 -11.525,-21.458c0,-2.333 0.325,-4.658 1.009,-6.883l129.6,-420.759c2.279,-7.416 7.941,-11.708 14.266,-11.708c2.579,0 5.271,0.713 7.884,2.225l581.408,335.954c7.1,4.096 11.525,12.829 11.525,21.459c-0,2.333 -0.325,4.658 -1.008,6.883l-129.6,420.762c-2.284,7.417 -7.946,11.709 -14.267,11.709Z"
|
||||
style="fill:url(#_Linear86);"></path>
|
||||
<g id="window">
|
||||
<path
|
||||
id="window-shadow"
|
||||
d="M1362.6,815.617c-1.771,-0 -3.616,-0.492 -5.412,-1.525l-393.583,-227.234c-4.859,-2.804 -7.896,-8.775 -7.909,-14.679c-0.004,-1.616 0.221,-3.229 0.696,-4.766l89.008,-288.996c1.563,-5.088 5.45,-8.029 9.788,-8.029c1.771,-0 3.616,0.487 5.408,1.525l393.583,227.237c4.863,2.804 7.896,8.775 7.909,14.679c0.004,1.617 -0.221,3.229 -0.692,4.767l-83.154,269.975l-5.854,19.012c-1.567,5.092 -5.45,8.034 -9.788,8.034Z"
|
||||
style="fill:url(#_Linear87);"></path>
|
||||
<path
|
||||
id="window-background"
|
||||
d="M1309.76,822.481c-1.77,0 -3.616,-0.491 -5.412,-1.525l-393.583,-227.233c-4.859,-2.804 -7.896,-8.775 -7.909,-14.679c-0.004,-1.617 0.221,-3.229 0.696,-4.767l89.008,-288.996c1.563,-5.087 5.45,-8.029 9.788,-8.029c1.771,0 3.617,0.488 5.408,1.525l393.584,227.238c4.862,2.804 7.895,8.775 7.908,14.679c0.004,1.616 -0.221,3.229 -0.692,4.766l-83.154,269.975l-5.854,19.013c-1.567,5.092 -5.45,8.033 -9.788,8.033Z"
|
||||
style="fill:url(#_Radial88);"></path>
|
||||
<path
|
||||
id="window-edge"
|
||||
d="M1401.34,506.015l-393.588,-227.238c-3.875,-2.237 -7.992,-1.929 -11.071,0.379c1.859,-0.054 3.792,0.367 5.688,1.454l393.579,227.234c6.187,3.575 9.417,12.283 7.217,19.446l-89.009,288.991c-0.825,2.675 -2.287,4.754 -4.125,6.134c4.221,-0.13 7.984,-2.988 9.517,-7.967l89.008,-288.988c2.204,-7.166 -1.025,-15.875 -7.216,-19.445Z"
|
||||
style="fill:#fff;fill-rule:nonzero;"></path>
|
||||
<g id="window-content">
|
||||
<g id="code">
|
||||
<path
|
||||
class="code-function"
|
||||
d="M1103.62,430.394l-24.334,-14.046c-2.258,-1.308 -3.466,-4.442 -2.7,-7c0.763,-2.558 3.213,-3.583 5.471,-2.279l24.329,14.05c2.259,1.304 3.467,4.433 2.709,7c-0.767,2.558 -3.217,3.575 -5.475,2.275Z"
|
||||
style="fill:#fff;fill-rule:nonzero;"></path>
|
||||
<path
|
||||
class="code-keyword"
|
||||
d="M1161.58,463.856l-35.879,-20.716c-2.258,-1.3 -3.467,-4.434 -2.704,-6.996c0.762,-2.563 3.212,-3.579 5.471,-2.275l35.879,20.712c2.254,1.304 3.471,4.438 2.704,7c-0.767,2.559 -3.217,3.575 -5.471,2.275Z"
|
||||
style="fill:#fff;fill-rule:nonzero;"></path>
|
||||
<path
|
||||
class="code-text"
|
||||
d="M1054.55,538.727l-24.333,-14.05c-2.259,-1.304 -3.467,-4.437 -2.7,-6.996c0.758,-2.562 3.208,-3.583 5.466,-2.279l24.334,14.05c2.258,1.304 3.47,4.433 2.704,6.996c-0.763,2.562 -3.213,3.579 -5.471,2.279Z"
|
||||
style="fill:#fff;fill-rule:nonzero;"></path>
|
||||
<path
|
||||
class="code-text"
|
||||
d="M1106.21,568.556l-35.88,-20.716c-2.254,-1.3 -3.466,-4.434 -2.7,-7c0.759,-2.559 3.209,-3.575 5.467,-2.271l35.879,20.712c2.259,1.304 3.467,4.438 2.709,6.996c-0.767,2.563 -3.217,3.579 -5.475,2.279Z"
|
||||
style="fill:#fff;fill-rule:nonzero;"></path>
|
||||
<path
|
||||
class="code-keyword"
|
||||
d="M1030.73,411.09l-15.2,-8.78c-2.258,-1.304 -3.466,-4.433 -2.704,-6.995c0.763,-2.563 3.213,-3.584 5.471,-2.275l15.2,8.77c2.258,1.309 3.467,4.442 2.704,7c-0.762,2.559 -3.212,3.58 -5.471,2.28Z"
|
||||
style="fill:#fff;fill-rule:nonzero;"></path>
|
||||
<path
|
||||
class="code-keyword"
|
||||
d="M1076.47,460.269l-46.446,-26.813c-2.258,-1.304 -3.471,-4.437 -2.704,-6.996c0.762,-2.562 3.212,-3.579 5.471,-2.279l46.441,26.817c2.259,1.3 3.471,4.433 2.705,7c-0.763,2.558 -3.213,3.575 -5.467,2.271Z"
|
||||
style="fill:#fff;fill-rule:nonzero;"></path>
|
||||
<path
|
||||
class="code-function"
|
||||
d="M1033.63,481.098l-15.2,-8.779c-2.254,-1.3 -3.466,-4.434 -2.7,-7c0.763,-2.559 3.213,-3.579 5.467,-2.271l15.2,8.775c2.258,1.3 3.471,4.433 2.708,6.996c-0.766,2.558 -3.216,3.579 -5.475,2.279Z"
|
||||
style="fill:#fff;fill-rule:nonzero;"></path>
|
||||
<path
|
||||
class="code-text"
|
||||
d="M1111.82,617.344l-40.6,-23.438c-2.259,-1.308 -3.467,-4.441 -2.704,-7c0.762,-2.558 3.212,-3.579 5.47,-2.279l40.6,23.442c2.255,1.304 3.467,4.437 2.705,7c-0.767,2.558 -3.213,3.575 -5.471,2.275Z"
|
||||
style="fill:#fff;fill-rule:nonzero;"></path>
|
||||
<path
|
||||
class="code-text"
|
||||
d="M1016.6,516.815l-9.758,-5.638c-2.255,-1.3 -3.467,-4.433 -2.705,-6.992c0.767,-2.566 3.213,-3.583 5.471,-2.279l9.759,5.634c2.258,1.304 3.47,4.437 2.704,6.995c-0.767,2.563 -3.213,3.58 -5.471,2.28Z"
|
||||
style="fill:#fff;fill-rule:nonzero;"></path>
|
||||
<path
|
||||
class="code-keyword"
|
||||
d="M1007.37,557.035l-12.117,-6.995c-2.258,-1.3 -3.471,-4.434 -2.704,-6.996c0.762,-2.563 3.212,-3.579 5.471,-2.275l12.116,6.996c2.259,1.3 3.467,4.433 2.704,6.995c-0.762,2.559 -3.212,3.584 -5.47,2.275Z"
|
||||
style="fill:#fff;fill-rule:nonzero;"></path>
|
||||
<path
|
||||
class="code-text"
|
||||
d="M1054.5,584.252l-31.946,-18.442c-2.258,-1.304 -3.471,-4.437 -2.704,-7c0.763,-2.558 3.213,-3.579 5.471,-2.275l31.946,18.446c2.254,1.3 3.466,4.434 2.704,6.992c-0.763,2.562 -3.213,3.583 -5.471,2.279Z"
|
||||
style="fill:#fff;fill-rule:nonzero;"></path>
|
||||
<path
|
||||
class="code-int"
|
||||
d="M1012.42,582.731l-22.971,-13.258c-2.258,-1.304 -3.471,-4.438 -2.708,-6.996c0.766,-2.562 3.216,-3.583 5.475,-2.279l22.966,13.262c2.259,1.305 3.471,4.434 2.705,6.996c-0.767,2.559 -3.213,3.584 -5.467,2.275Z"
|
||||
style="fill:#fff;fill-rule:nonzero;"></path>
|
||||
<path
|
||||
class="code-text"
|
||||
d="M1146.65,637.548l-14.75,-8.517c-2.258,-1.3 -3.471,-4.433 -2.704,-6.991c0.766,-2.567 3.212,-3.584 5.466,-2.28l14.755,8.517c2.258,1.304 3.47,4.433 2.704,6.996c-0.763,2.562 -3.213,3.583 -5.471,2.275Z"
|
||||
style="fill:#fff;fill-rule:nonzero;"></path>
|
||||
<path
|
||||
class="code-keyword"
|
||||
d="M1090.18,513.744l-40.6,-23.442c-2.254,-1.304 -3.467,-4.437 -2.704,-7c0.767,-2.558 3.217,-3.583 5.471,-2.275l40.6,23.438c2.258,1.304 3.466,4.437 2.704,7c-0.763,2.558 -3.213,3.579 -5.471,2.279Z"
|
||||
style="fill:#fff;fill-rule:nonzero;"></path>
|
||||
<path
|
||||
class="code-text"
|
||||
d="M1094.99,493.744l-70.759,-40.854c-2.258,-1.305 -3.466,-4.438 -2.708,-7c0.767,-2.559 3.217,-3.58 5.475,-2.28l70.758,40.859c2.259,1.304 3.467,4.437 2.704,6.996c-0.762,2.558 -3.212,3.579 -5.47,2.279Z"
|
||||
style="fill:#e9975c;fill-rule:nonzero;"></path>
|
||||
<path
|
||||
class="code-text"
|
||||
d="M1053.24,515.19l-40.6,-23.442c-2.258,-1.3 -3.466,-4.433 -2.704,-6.996c0.767,-2.562 3.213,-3.579 5.471,-2.275l40.604,23.442c2.254,1.3 3.467,4.433 2.7,6.991c-0.766,2.567 -3.212,3.584 -5.471,2.28Z"
|
||||
style="fill:#e9975c;fill-rule:nonzero;"></path>
|
||||
<path
|
||||
class="code-int"
|
||||
d="M1120.97,531.519l-14.75,-8.517c-2.259,-1.304 -3.471,-4.433 -2.704,-7c0.762,-2.558 3.212,-3.579 5.47,-2.271l14.75,8.517c2.259,1.3 3.467,4.433 2.705,6.992c-0.763,2.562 -3.213,3.583 -5.471,2.279Z"
|
||||
style="fill:#e9975c;fill-rule:nonzero;"></path>
|
||||
<path
|
||||
class="code-text"
|
||||
d="M1271.02,527.04l-87.355,-50.438c-2.254,-1.3 -3.466,-4.433 -2.7,-6.992c0.763,-2.566 3.213,-3.583 5.467,-2.279l87.354,50.434c2.259,1.304 3.471,4.437 2.709,6.995c-0.767,2.563 -3.217,3.58 -5.475,2.28Z"
|
||||
style="fill:#e9975c;fill-rule:nonzero;"></path>
|
||||
<path
|
||||
class="code-int"
|
||||
d="M1049.85,558.785l-48.804,-28.175c-2.259,-1.304 -3.471,-4.437 -2.704,-6.995c0.762,-2.563 3.212,-3.584 5.47,-2.275l48.805,28.17c2.254,1.309 3.466,4.438 2.704,7c-0.763,2.559 -3.213,3.584 -5.471,2.275Z"
|
||||
style="fill:#ee3c96;fill-rule:nonzero;"></path>
|
||||
<path
|
||||
class="code-function"
|
||||
d="M1057.21,403.594l-35.879,-20.717c-2.258,-1.3 -3.471,-4.433 -2.704,-6.992c0.762,-2.562 3.212,-3.583 5.471,-2.279l35.879,20.713c2.258,1.308 3.471,4.437 2.704,7c-0.762,2.558 -3.212,3.579 -5.471,2.275Z"
|
||||
style="fill:#ee3c96;fill-rule:nonzero;"></path>
|
||||
<path
|
||||
class="code-function"
|
||||
d="M1004.92,601.177l-41.559,-23.992c-2.258,-1.3 -3.466,-4.433 -2.7,-6.995c0.759,-2.563 3.209,-3.58 5.467,-2.28l41.554,23.992c2.259,1.308 3.471,4.438 2.704,7c-0.762,2.558 -3.212,3.579 -5.466,2.275Z"
|
||||
style="fill:#e9975c;fill-rule:nonzero;"></path>
|
||||
</g>
|
||||
<g id="window-decorations">
|
||||
<path
|
||||
id="max"
|
||||
d="M1314.75,501.702l-17.783,-10.271c-1.655,-0.954 -2.538,-3.241 -1.98,-5.116c0.559,-1.871 2.346,-2.613 4,-1.663l17.788,10.271c1.646,0.95 2.533,3.242 1.971,5.112c-0.559,1.875 -2.346,2.617 -3.996,1.667Z"
|
||||
style="fill:#fff;fill-rule:nonzero;"></path>
|
||||
<path
|
||||
id="min"
|
||||
d="M1348.67,521.285l-17.788,-10.266c-1.645,-0.95 -2.533,-3.242 -1.975,-5.113c0.559,-1.875 2.35,-2.616 4,-1.666l17.784,10.27c1.654,0.955 2.537,3.238 1.979,5.113c-0.558,1.871 -2.35,2.621 -4,1.662Z"
|
||||
style="fill:#fff;fill-rule:nonzero;"></path>
|
||||
<path
|
||||
id="close"
|
||||
d="M1365.35,530.927l-0.533,-0.321c-1.655,-0.954 -2.538,-3.241 -1.98,-5.112c0.559,-1.871 2.35,-2.617 4,-1.667l0.534,0.325c1.654,0.95 2.533,3.238 1.979,5.108c-0.558,1.871 -2.35,2.621 -4,1.667Z"
|
||||
style="fill:#ee3c96;fill-rule:nonzero;"></path>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
<ellipse id="cup-shadow" cx="446.893" cy="648.9" rx="81.558" ry="46.78" style="fill:var(--shadow-color);"></ellipse>
|
||||
<g id="coffee">
|
||||
<path
|
||||
id="cup-base"
|
||||
d="M516.544,604.44c-5.638,3.066 -11.767,5.658 -18.234,7.775c-14.458,4.733 -30.612,7.1 -46.766,7.1c-18.15,-0 -36.304,-2.988 -52.05,-8.967c-5.317,-2.017 -10.359,-4.375 -15.034,-7.075c-3.708,-2.142 -7.041,-4.413 -10.004,-6.792c-2.208,-1.771 -4.212,-3.6 -6.008,-5.479c-7.85,-8.208 -11.775,-17.333 -11.775,-26.454l-19.342,-225.129l0.004,-0c6.025,8.425 14.963,16.316 26.825,23.162c24.13,13.934 55.759,20.9 87.384,20.9c31.625,0 63.25,-6.966 87.379,-20.896c11.854,-6.841 20.792,-14.733 26.821,-23.15l-19.338,225.109c0,10.258 -4.958,20.516 -14.879,29.471c-1.975,1.787 -4.15,3.516 -6.517,5.187c-1.991,1.404 -4.12,2.763 -6.387,4.075c-0.071,0.038 -0.138,0.079 -0.208,0.117c-0.013,0.008 -0.03,0.016 -0.042,0.025c-0.054,0.033 -0.113,0.062 -0.167,0.096c-0.016,0.008 -0.033,0.019 -0.05,0.029c-0.054,0.029 -0.108,0.062 -0.166,0.091c-0.013,0.009 -0.027,0.017 -0.042,0.025c-0.058,0.034 -0.113,0.067 -0.171,0.096c-0.012,0.009 -0.029,0.017 -0.042,0.025c-0.062,0.038 -0.129,0.071 -0.191,0.109c-0.005,0.003 -0.012,0.004 -0.017,0.008c-0.071,0.042 -0.146,0.083 -0.217,0.121c-0.066,0.037 -0.137,0.075 -0.204,0.112c-0.026,0.017 -0.054,0.032 -0.083,0.046c-0.038,0.021 -0.075,0.042 -0.108,0.063c-0.042,0.02 -0.084,0.043 -0.121,0.066c-0.025,0.013 -0.05,0.025 -0.075,0.038c-0.047,0.029 -0.096,0.054 -0.146,0.079c-0.008,0.004 -0.021,0.012 -0.029,0.017Z"
|
||||
style="fill:url(#_Radial89);"></path>
|
||||
<g id="cup-lid">
|
||||
<path
|
||||
id="lid-top-outer"
|
||||
d="M451.544,383.481c-31.625,0 -63.254,-6.966 -87.384,-20.9c-11.862,-6.846 -20.8,-14.737 -26.825,-23.162l-0.004,-0c-6.854,-9.584 -9.937,-19.85 -9.258,-30.05l-0.017,0.016l0.029,-0.329c0.042,-0.529 0.113,-1.046 0.167,-1.571l1.779,-16.783c1.184,16.317 12.163,32.5 32.963,45.367c0.004,-0 0.012,0.008 0.012,0.008c0.042,0.025 0.084,0.05 0.121,0.075c0.008,0.004 0.017,0.008 0.025,0.013c0.038,0.025 0.071,0.045 0.113,0.07c0.008,0.005 0.016,0.009 0.025,0.017c0.037,0.021 0.075,0.042 0.108,0.067c0.012,0.004 0.021,0.012 0.033,0.016c0.038,0.025 0.067,0.042 0.1,0.063c0.017,0.008 0.029,0.017 0.042,0.025c0.029,0.021 0.062,0.037 0.092,0.058c0.016,0.009 0.033,0.017 0.05,0.029c0.029,0.017 0.058,0.034 0.087,0.05c0.017,0.013 0.033,0.025 0.05,0.034c0.029,0.016 0.058,0.033 0.088,0.05c0.016,0.012 0.033,0.025 0.054,0.033c0.025,0.017 0.05,0.033 0.075,0.05c0.021,0.013 0.046,0.025 0.066,0.038c0.025,0.012 0.05,0.029 0.075,0.045c0.021,0.013 0.042,0.025 0.059,0.038c0.029,0.012 0.054,0.029 0.079,0.046c0.021,0.012 0.042,0.025 0.062,0.037c0.025,0.013 0.05,0.029 0.071,0.042c0.025,0.012 0.046,0.025 0.071,0.042c0.025,0.016 0.05,0.029 0.075,0.045c0.021,0.013 0.042,0.025 0.063,0.038c0.025,0.012 0.054,0.029 0.079,0.046c0.021,0.012 0.041,0.025 0.062,0.037c0.025,0.013 0.05,0.029 0.075,0.046c0.021,0.013 0.046,0.025 0.067,0.038c0.046,0.025 0.092,0.054 0.137,0.079c24.1,14.2 55.938,21.333 87.684,21.333c30.496,0 60.912,-6.583 84.3,-19.812c0.05,-0.03 0.096,-0.055 0.146,-0.084c0.008,-0.004 0.016,-0.008 0.02,-0.012c0.042,-0.021 0.084,-0.046 0.125,-0.071c0.009,-0.004 0.017,-0.008 0.025,-0.013c0.042,-0.025 0.08,-0.045 0.121,-0.07c0.004,-0.005 0.009,-0.005 0.017,-0.009c0.042,-0.025 0.083,-0.05 0.129,-0.075c0.004,0 0.008,-0.004 0.013,-0.008c0.045,-0.025 0.087,-0.05 0.133,-0.075c0.004,-0 0.004,-0 0.004,-0.004c0.046,-0.025 0.096,-0.054 0.142,-0.079c-0,-0 0.004,-0 0.004,-0.005c22.975,-13.262 34.708,-30.62 35.167,-48.129l1.804,18.242l0.033,0.346l0.021,0.204l-0.013,-0.017c0.784,10.325 -2.295,20.729 -9.241,30.429c-6.029,8.417 -14.967,16.309 -26.821,23.15c-24.129,13.93 -55.754,20.896 -87.379,20.896Zm70.137,-53.562c0.038,-0.021 0.071,-0.038 0.104,-0.059c-0.033,0.021 -0.066,0.038 -0.104,0.059Zm0.184,-0.104c0.062,-0.038 0.125,-0.071 0.187,-0.109c-0.062,0.038 -0.125,0.071 -0.187,0.109Zm0.204,-0.117c0.066,-0.038 0.133,-0.075 0.2,-0.113c-0.067,0.038 -0.134,0.075 -0.2,0.113Zm0.246,-0.138c0.07,-0.041 0.137,-0.079 0.204,-0.12c20.621,-11.905 30.396,-27.696 29.325,-43.288l-0,-0.012c1.075,15.595 -8.7,31.391 -29.325,43.3c-0.067,0.041 -0.138,0.079 -0.204,0.12Zm37.808,-72.129c-5.588,-6.412 -12.975,-12.454 -22.158,-17.866c-8.413,-4.959 -17.78,-9.055 -27.75,-12.288c9.683,3.1 18.787,7.021 27.004,11.763c9.575,5.529 17.208,11.754 22.904,18.391Z"
|
||||
style="fill:url(#_Linear91);"></path>
|
||||
<path
|
||||
id="lid-top-inner"
|
||||
d="M380.056,247.765c-0.004,0.004 -0.012,0.008 -0.016,0.012c-0.038,0.021 -0.071,0.042 -0.109,0.063c-0.004,0.004 -0.012,0.008 -0.016,0.008c0.047,-0.028 0.094,-0.056 0.141,-0.083Zm0.129,-0.076c0.081,-0.047 0.161,-0.094 0.242,-0.141c-0.004,0.004 -0.012,0.008 -0.017,0.012c-0.033,0.021 -0.066,0.038 -0.1,0.059c-0.008,0.004 -0.016,0.008 -0.029,0.016c-0.029,0.017 -0.062,0.038 -0.096,0.054Zm-0.129,0.076c0.043,-0.026 0.086,-0.051 0.129,-0.076c-0.008,0.009 -0.02,0.013 -0.029,0.021c-0.033,0.017 -0.066,0.038 -0.1,0.055Zm89.509,86.658l-36.05,-0c-2.525,-0 -4.755,1.654 -5.492,4.075l-1.821,5.983c-16.717,-2.508 -32.546,-7.483 -45.646,-15.046c-20.616,-11.904 -30.391,-27.7 -29.321,-43.291c0,0.046 0.005,0.087 0.009,0.129c-0.159,2.404 -0.054,4.817 0.304,7.212c0.004,-0.033 0.012,-0.066 0.017,-0.1c1.9,12.763 11.1,25.234 27.587,35.155c-25.183,-22.455 -20.771,-52.755 13.313,-72.43c12.82,-7.404 28.258,-12.387 44.587,-14.945c4.8,-0.405 9.642,-0.605 14.483,-0.605c1.738,0 3.471,0.025 5.205,0.08c14.083,0.416 28.045,2.541 40.875,6.37c8.97,2.675 17.383,6.184 24.904,10.525c10.521,6.071 18.212,13.159 23.079,20.713c3.179,4.929 5.154,10.058 5.929,15.237c0.363,-2.395 0.463,-4.804 0.308,-7.204c0.005,-0.046 0.005,-0.087 0.009,-0.129c1.071,15.592 -8.704,31.383 -29.325,43.288c-0.067,0.041 -0.134,0.079 -0.204,0.12c-0.017,0.009 -0.034,0.017 -0.046,0.025c-0.067,0.038 -0.134,0.075 -0.2,0.113c-0.004,0.004 -0.013,0.008 -0.017,0.008c-0.062,0.038 -0.125,0.071 -0.187,0.109c-0.025,0.016 -0.055,0.029 -0.08,0.045c-0.033,0.021 -0.066,0.038 -0.104,0.059c-12.929,7.291 -28.441,12.108 -44.808,14.562l-0.208,-0.683l-1.609,-5.3c-0.183,-0.608 -0.462,-1.167 -0.816,-1.663c-1.055,-1.483 -2.784,-2.412 -4.675,-2.412Zm-89.134,-86.875c0.042,-0.025 0.084,-0.05 0.125,-0.071c-0.033,0.021 -0.075,0.042 -0.108,0.063c-0.008,0.004 -0.013,0.008 -0.017,0.008Z"
|
||||
style="fill:url(#_Linear92);"></path>
|
||||
<path
|
||||
id="lid-top-inner-shadow"
|
||||
d="M379.152,328.54c-16.487,-9.921 -25.687,-22.392 -27.587,-35.155c2.004,-13.079 11.654,-25.837 28.991,-35.85c15.909,-9.183 35.821,-14.641 56.496,-16.37c-16.329,2.558 -31.767,7.541 -44.587,14.945c-34.084,19.675 -38.496,49.975 -13.313,72.43Zm-9.133,-73.917c0.004,-0.004 0.008,-0.008 0.012,-0.008c-0.004,0.004 -0.008,0.004 -0.012,0.008Zm0.087,-0.071c0.009,-0.004 0.017,-0.012 0.025,-0.017c-0.008,0.005 -0.016,0.013 -0.025,0.017Zm0.088,-0.067c0.012,-0.012 0.029,-0.025 0.046,-0.037c-0.017,0.012 -0.03,0.025 -0.046,0.037Zm0.096,-0.075c0.791,-0.629 1.608,-1.254 2.45,-1.866l0.004,-0.004c0.029,-0.021 0.058,-0.042 0.087,-0.063c0,0 0.004,-0.004 0.009,-0.004c0.02,-0.017 0.045,-0.033 0.066,-0.05c0.013,-0.013 0.025,-0.021 0.038,-0.029c0.016,-0.013 0.033,-0.021 0.05,-0.034c0.016,-0.012 0.033,-0.025 0.046,-0.033c0.016,-0.012 0.029,-0.025 0.045,-0.033c0.021,-0.017 0.038,-0.029 0.059,-0.042c0.008,-0.008 0.021,-0.017 0.033,-0.025c0.021,-0.017 0.042,-0.029 0.063,-0.046c0.008,-0.008 0.02,-0.012 0.029,-0.021c0.025,-0.016 0.054,-0.037 0.075,-0.054c0.004,-0.004 0.012,-0.008 0.016,-0.012c0.03,-0.021 0.055,-0.038 0.084,-0.059c0.004,-0.004 0.008,-0.008 0.012,-0.008c2.017,-1.437 4.171,-2.833 6.459,-4.179c-3.538,2.079 -6.742,4.271 -9.625,6.562Zm9.641,-6.57c0.038,-0.021 0.071,-0.042 0.109,-0.063c-0.038,0.021 -0.071,0.042 -0.109,0.063Zm0.125,-0.075c0.034,-0.017 0.067,-0.038 0.1,-0.055c-0.033,0.017 -0.066,0.038 -0.1,0.055Zm0.129,-0.075c0.034,-0.017 0.067,-0.038 0.096,-0.055c-0.029,0.017 -0.062,0.038 -0.096,0.055Zm0.125,-0.071c0.034,-0.021 0.067,-0.038 0.1,-0.059c-0.033,0.021 -0.066,0.038 -0.1,0.059Zm0.121,-0.071c0.042,-0.025 0.084,-0.05 0.125,-0.071c-0.041,0.021 -0.083,0.046 -0.125,0.071Z"
|
||||
style="fill:url(#_Linear93);"></path>
|
||||
<path
|
||||
id="lid-top-inner-border"
|
||||
d="M456.74,240.64c-1.734,-0.055 -3.467,-0.08 -5.205,-0.08c-4.841,0 -9.683,0.2 -14.483,0.605c-20.675,1.729 -40.587,7.187 -56.496,16.37c-17.337,10.013 -26.987,22.771 -28.991,35.85c-0.005,0.034 -0.013,0.067 -0.017,0.1c-0.358,-2.395 -0.463,-4.808 -0.304,-7.212l-0,0.037c0.712,-11.158 6.962,-22.22 18.775,-31.687c0.004,-0.004 0.008,-0.004 0.012,-0.008c0.025,-0.021 0.05,-0.042 0.075,-0.063c0.009,-0.004 0.017,-0.012 0.025,-0.017c0.021,-0.016 0.042,-0.037 0.063,-0.05c0.016,-0.012 0.029,-0.025 0.046,-0.037c0.016,-0.013 0.033,-0.025 0.05,-0.038c2.883,-2.291 6.087,-4.483 9.625,-6.562c0.004,-0 0.012,-0.004 0.016,-0.008c0.038,-0.021 0.071,-0.042 0.109,-0.063c0.004,-0.004 0.012,-0.008 0.016,-0.012c0.034,-0.017 0.067,-0.038 0.1,-0.055c0.009,-0.008 0.021,-0.012 0.029,-0.02c0.034,-0.017 0.067,-0.038 0.096,-0.055c0.013,-0.008 0.021,-0.012 0.029,-0.016c0.034,-0.021 0.067,-0.038 0.1,-0.059c0.005,-0.004 0.013,-0.008 0.017,-0.012c0.004,-0 0,0.004 0.004,-0c0.042,-0.025 0.084,-0.05 0.125,-0.071c0.409,-0.237 0.825,-0.475 1.238,-0.704c19.404,-10.829 44.504,-16.254 69.612,-16.271l0.129,0c14.25,0 28.5,1.742 41.709,5.221c10.612,2.796 20.546,6.717 29.275,11.758c3.583,2.067 6.837,4.25 9.762,6.529c12.317,9.605 18.825,20.9 19.554,32.305l0,-0.034c0.155,2.4 0.055,4.809 -0.308,7.204c-0.775,-5.179 -2.75,-10.308 -5.929,-15.237c-4.867,-7.554 -12.558,-14.642 -23.079,-20.713c-7.521,-4.341 -15.934,-7.85 -24.904,-10.525c-12.83,-3.829 -26.792,-5.954 -40.875,-6.37Z"
|
||||
style="fill:url(#_Linear94);"></path>
|
||||
<path
|
||||
id="lid-top-outer1"
|
||||
d="M361.949,335.414c-20.123,-12.758 -30.754,-28.671 -31.918,-44.712c-1.383,-19.071 10.617,-38.317 35.95,-52.65c22.121,-12.512 50.517,-19.079 79.329,-19.758c1.659,-0.038 3.317,-0.059 4.975,-0.059c12.284,0 24.58,1.067 36.438,3.2c8.083,1.455 15.962,3.405 23.492,5.842c9.97,3.233 19.337,7.329 27.75,12.288c9.183,5.412 16.57,11.454 22.158,17.866c8.975,10.309 13.308,21.579 13.017,32.8c-0.459,17.509 -12.192,34.867 -35.167,48.129c24.417,-14.095 36.117,-32.82 35.092,-51.433c-0.875,17.396 -12.855,34.567 -35.971,47.642c-23.388,13.233 -53.804,19.816 -84.304,19.816c-31.746,0 -63.58,-7.133 -87.68,-21.329c-22.483,-13.246 -34.158,-30.262 -35.1,-47.362c-0.89,17.704 9.722,35.634 31.939,49.72Zm87.286,-109.187c-24.916,0.325 -49.662,5.979 -68.679,16.958c-20.475,11.821 -30.237,27.475 -29.321,42.959c-1.07,15.591 8.705,31.387 29.321,43.291c13.1,7.563 28.929,12.538 45.646,15.046l1.821,-5.983c0.737,-2.421 2.967,-4.075 5.492,-4.075l36.05,-0c1.891,-0 3.62,0.929 4.675,2.412c0.354,0.496 0.633,1.055 0.816,1.663l1.609,5.3l0.208,0.683c16.367,-2.454 31.879,-7.271 44.808,-14.562c0.038,-0.021 0.071,-0.038 0.104,-0.059c0.025,-0.016 0.055,-0.029 0.08,-0.045c0.062,-0.038 0.125,-0.071 0.187,-0.109c0.004,0 0.013,-0.004 0.017,-0.008c0.066,-0.038 0.133,-0.075 0.2,-0.113c0.012,-0.008 0.029,-0.016 0.046,-0.025c0.066,-0.041 0.137,-0.079 0.204,-0.12c20.625,-11.909 30.4,-27.705 29.325,-43.3c0.908,-15.484 -8.85,-31.138 -29.325,-42.955c-9.296,-5.366 -19.963,-9.462 -31.35,-12.283c-12.621,-3.129 -26.125,-4.692 -39.634,-4.692c-0.766,0 -1.533,0.005 -2.3,0.017Zm13.075,115.55l-21.545,0c-1.505,0 -2.721,1.217 -2.721,2.721l-0,0.383c-0,1.504 1.216,2.721 2.721,2.721l21.545,0c1.5,0 2.721,-1.217 2.721,-2.721l0,-0.383c0,-0.738 -0.291,-1.408 -0.771,-1.896l0,-0.004c-0.004,-0.004 -0.012,-0.008 -0.016,-0.013c-0,-0.004 -0.004,-0.008 -0.009,-0.012c-0.004,-0 -0.004,-0.004 -0.008,-0.008l-0.004,-0c-0.004,-0.005 -0.008,-0.009 -0.013,-0.013l0,-0.004c-0.491,-0.475 -1.162,-0.771 -1.9,-0.771Zm-100.361,-6.363c0.345,0.219 0.694,0.438 1.045,0.655c-0.351,-0.217 -0.7,-0.436 -1.045,-0.655Zm138.397,-97.618c7.948,2.556 15.422,5.782 22.173,9.681c3.583,2.067 6.837,4.254 9.762,6.533c-2.925,-2.279 -6.179,-4.462 -9.762,-6.529c-6.752,-3.899 -14.224,-7.128 -22.173,-9.685Z"
|
||||
style="fill:url(#_Radial95);"></path>
|
||||
<path
|
||||
id="lid-shine"
|
||||
d="M522.519,243.185c20.55,11.863 30.308,27.588 29.316,43.13c-0.9,-14.113 -10.658,-28.063 -29.316,-38.838c-39.204,-22.633 -102.763,-22.633 -141.963,0c-18.654,10.771 -28.412,24.725 -29.312,38.833c-0.992,-15.537 8.762,-31.262 29.312,-43.125c39.2,-22.633 102.759,-22.633 141.963,0Zm14.575,91.384c23.116,-13.075 35.096,-30.246 35.971,-47.642c1.037,18.833 -10.955,37.783 -35.971,51.938c-47.734,27 -124.734,26.32 -171.984,-1.521c-24.37,-14.354 -36.029,-33.129 -35.1,-51.65c0.942,17.1 12.617,34.116 35.1,47.362c47.25,27.838 124.25,28.517 171.984,1.513Z"
|
||||
style="fill:#fff;"></path>
|
||||
<g id="lid-hole">
|
||||
<path
|
||||
id="hole-inner"
|
||||
d="M462.31,347.602l-21.545,0c-1.505,0 -2.721,-1.221 -2.721,-2.725l-0,-0.379c-0,-1.504 1.216,-2.721 2.721,-2.721l21.545,0c1.505,0 2.721,1.217 2.721,2.721l0,0.379c0,1.504 -1.216,2.725 -2.721,2.725Z"
|
||||
style="fill:#27286f;fill-rule:nonzero;"></path>
|
||||
<path
|
||||
id="hole-border"
|
||||
d="M462.31,343.606l-21.545,0c-1.246,0 -2.255,0.859 -2.575,2l-0.146,-0.725l-0,-0.383c-0,-1.5 1.216,-2.721 2.721,-2.721l21.545,0c0.738,0 1.409,0.296 1.9,0.771l0,0.004c0.005,0.004 0.009,0.008 0.013,0.013l0.004,-0c0.004,0.004 0.004,0.008 0.008,0.008c0.005,0.004 0.009,0.008 0.009,0.012c0.004,0.005 0.012,0.009 0.016,0.013l0,0.004c0.48,0.492 0.771,1.158 0.771,1.896l0,0.383l-0.146,0.725c-0.32,-1.141 -1.329,-2 -2.575,-2Z"
|
||||
style="fill:url(#_Linear96);"></path>
|
||||
</g>
|
||||
</g>
|
||||
<path
|
||||
id="paw"
|
||||
d="M454.84,538.619c-2.646,9.941 -12.846,15.858 -22.784,13.212c-9.937,-2.641 -15.85,-12.841 -13.208,-22.783c2.642,-9.933 12.017,-12.75 21.954,-10.104c9.942,2.637 16.679,9.737 14.038,19.675Zm14.662,-19.617c-3.754,3.667 -8.546,3.192 -11.733,-0.062c-3.179,-3.259 -3.542,-8.063 0.204,-11.73c3.75,-3.662 10.879,-5.466 14.058,-2.212c3.184,3.258 1.217,10.342 -2.529,14.004Zm-19.479,-15.579c-0.921,5.162 -5.096,7.562 -9.579,6.767c-4.484,-0.796 -7.571,-4.492 -6.654,-9.655c0.916,-5.162 5.666,-10.775 10.15,-9.979c4.479,0.796 7.004,7.709 6.083,12.867Zm-24.004,-2.383c1.996,4.85 -0.242,9.116 -4.454,10.85c-4.209,1.733 -8.8,0.275 -10.796,-4.575c-1.992,-4.85 -1,-12.134 3.212,-13.867c4.209,-1.733 10.042,2.746 12.038,7.592Z"
|
||||
></path>
|
||||
<path
|
||||
id="steam"
|
||||
d="M445.31,218.294c-2.05,-4.213 -4.229,-8.804 -6.545,-13.821c-30.309,-65.608 2.125,-114.1 2.125,-114.1c-18.03,52.183 18.637,76.229 45.833,131.062c1.517,3.059 3,6.209 4.446,9.467c0.7,1.579 1.396,3.188 2.075,4.821c1.516,3.633 2.975,7.383 4.371,11.287c0.112,0.317 0.229,0.642 0.341,0.963c17.879,50.737 -6.283,77.125 -23.716,88.862c-3.838,2.588 -7.35,4.459 -10.017,5.73c-0.863,0.408 -1.638,0.754 -2.304,1.041c-1.729,0.742 -2.746,1.084 -2.746,1.084l-14.346,-0c0,-0 0.775,-0.346 2.075,-1.084c0.808,-0.454 1.821,-1.062 2.975,-1.829c2.504,-1.662 5.692,-4.079 8.954,-7.354c7.929,-7.95 16.313,-20.954 16.534,-40.5c0.27,-23.842 -3.505,-25.221 -18.625,-53.283c-1.642,-3.046 -3.417,-6.405 -5.334,-10.138c-0.575,-1.375 -1.429,-2.796 -2.171,-4.275c-1.254,-2.487 -2.558,-5.125 -3.925,-7.933Zm29.955,-83.475c-0,-0 -9.834,-26.042 -10.234,-34.029c0,-0 -6.779,-44.792 35.234,-89.93c-0,0 -37.155,82.988 -25,123.959Z"
|
||||
></path>
|
||||
</g>
|
||||
<defs>
|
||||
<lineargradient
|
||||
id="_Linear1"
|
||||
x1="0"
|
||||
y1="0"
|
||||
x2="1"
|
||||
y2="0"
|
||||
gradientUnits="userSpaceOnUse"
|
||||
gradientTransform="matrix(135.88,0,0,135.88,1694.3,1133.23)">
|
||||
<stop offset="0" style="stop-color:var(--peach);stop-opacity:1"></stop>
|
||||
<stop offset="1" style="stop-color:var(--red);stop-opacity:1"></stop>
|
||||
</lineargradient>
|
||||
<lineargradient
|
||||
id="_Linear2"
|
||||
x1="0"
|
||||
y1="0"
|
||||
x2="1"
|
||||
y2="0"
|
||||
gradientUnits="userSpaceOnUse"
|
||||
gradientTransform="matrix(228.243,0,0,228.243,1508.26,947.006)">
|
||||
<stop offset="0" style="stop-color:var(--peach);stop-opacity:1"></stop>
|
||||
<stop offset="1" style="stop-color:var(--red);stop-opacity:1"></stop>
|
||||
</lineargradient>
|
||||
<lineargradient
|
||||
id="_Linear3"
|
||||
x1="0"
|
||||
y1="0"
|
||||
x2="1"
|
||||
y2="0"
|
||||
gradientUnits="userSpaceOnUse"
|
||||
gradientTransform="matrix(228.243,0,0,228.243,3.15998,1023.47)">
|
||||
<stop offset="0" style="stop-color:var(--peach);stop-opacity:1"></stop>
|
||||
<stop offset="1" style="stop-color:var(--red);stop-opacity:1"></stop>
|
||||
</lineargradient>
|
||||
<lineargradient
|
||||
id="_Linear4"
|
||||
x1="0"
|
||||
y1="0"
|
||||
x2="1"
|
||||
y2="0"
|
||||
gradientUnits="userSpaceOnUse"
|
||||
gradientTransform="matrix(316.963,-0.13018,0.138622,337.518,288.302,645.477)">
|
||||
<stop offset="0" style="stop-color:var(--peach);stop-opacity:1"></stop>
|
||||
<stop offset="1" style="stop-color:var(--red);stop-opacity:1"></stop>
|
||||
</lineargradient>
|
||||
<lineargradient
|
||||
id="_Linear5"
|
||||
x1="0"
|
||||
y1="0"
|
||||
x2="1"
|
||||
y2="0"
|
||||
gradientUnits="userSpaceOnUse"
|
||||
gradientTransform="matrix(1218.16,0,0,1218.16,268.885,1008.84)">
|
||||
<stop offset="0" style="stop-color:var(--peach);stop-opacity:1"></stop>
|
||||
<stop offset="1" style="stop-color:var(--red);stop-opacity:1"></stop>
|
||||
</lineargradient>
|
||||
<radialgradient
|
||||
id="_Radial6"
|
||||
cx="0"
|
||||
cy="0"
|
||||
r="1"
|
||||
gradientUnits="userSpaceOnUse"
|
||||
gradientTransform="matrix(1017.38,0,0,1017.38,372.694,854.119)">
|
||||
<stop offset="0" style="stop-color:var(--yellow);stop-opacity:1"></stop>
|
||||
<stop offset="0.3" style="stop-color:var(--pink);stop-opacity:1"></stop>
|
||||
<stop offset="0.6" style="stop-color:var(--mauve);stop-opacity:1"></stop>
|
||||
<stop offset="1" style="stop-color:var(--blended-base-laptop);stop-opacity:1"></stop>
|
||||
</radialgradient>
|
||||
<radialgradient
|
||||
id="_Radial7"
|
||||
cx="0"
|
||||
cy="0"
|
||||
r="1"
|
||||
gradientUnits="userSpaceOnUse"
|
||||
gradientTransform="matrix(912.333,0,0,912.333,466.265,649.915)">
|
||||
<stop offset="0" style="stop-color:var(--yellow);stop-opacity:1"></stop>
|
||||
<stop offset="0.3" style="stop-color:var(--pink);stop-opacity:1"></stop>
|
||||
<stop offset="0.6" style="stop-color:var(--mauve);stop-opacity:1"></stop>
|
||||
<stop offset="1" style="stop-color:var(--blended-base-laptop);stop-opacity:1"></stop>
|
||||
</radialgradient>
|
||||
<radialgradient
|
||||
id="_Radial84"
|
||||
cx="0"
|
||||
cy="0"
|
||||
r="1"
|
||||
gradientUnits="userSpaceOnUse"
|
||||
gradientTransform="matrix(930.4,0,0,930.4,941.748,106.941)">
|
||||
<stop offset="0" style="stop-color:var(--pink);stop-opacity:1"></stop>
|
||||
<stop offset="0.0" style="stop-color:var(--mauve);stop-opacity:1"></stop>
|
||||
<stop offset="0.6" style="stop-color:var(--blended-base-laptop);stop-opacity:1"></stop>
|
||||
<stop offset="1" style="stop-color:var(--mocha-base);stop-opacity:1"></stop>
|
||||
</radialgradient>
|
||||
<radialgradient
|
||||
id="_Radial85"
|
||||
cx="0"
|
||||
cy="0"
|
||||
r="1"
|
||||
gradientUnits="userSpaceOnUse"
|
||||
gradientTransform="matrix(930.583,0,0,930.583,693.548,301.015)">
|
||||
<stop offset="0" style="stop-color:var(--peach);stop-opacity:1"></stop>
|
||||
<stop offset="0.2" style="stop-color:var(--pink);stop-opacity:1"></stop>
|
||||
<stop offset="0.4" style="stop-color:var(--mauve);stop-opacity:1"></stop>
|
||||
<stop offset="1" style="stop-color:var(--blended-base-laptop);stop-opacity:1"></stop>
|
||||
</radialgradient>
|
||||
<lineargradient
|
||||
id="_Linear86"
|
||||
x1="0"
|
||||
y1="0"
|
||||
x2="1"
|
||||
y2="0"
|
||||
gradientUnits="userSpaceOnUse"
|
||||
gradientTransform="matrix(745.692,0,0,745.692,795.831,545.294)">
|
||||
<stop offset="0" style="stop-color:color-mix(in srgb, var(--mocha-base), var(--latte-mauve) 10%);stop-opacity:1"
|
||||
></stop>
|
||||
<stop offset="1" style="stop-color:color-mix(in srgb, var(--mocha-base), var(--latte-mauve) 20%);stop-opacity:1"
|
||||
></stop>
|
||||
</lineargradient>
|
||||
<lineargradient
|
||||
id="_Linear87"
|
||||
x1="0"
|
||||
y1="0"
|
||||
x2="1"
|
||||
y2="0"
|
||||
gradientUnits="userSpaceOnUse"
|
||||
gradientTransform="matrix(893.666,0,0,745.692,663.214,545.404)">
|
||||
<stop offset="0" style="stop-color:color-mix(in srgb, var(--mocha-base), var(--latte-mauve) 2%);stop-opacity:1"
|
||||
></stop>
|
||||
<stop offset="1" style="stop-color:color-mix(in srgb, var(--mocha-base), var(--latte-mauve) 8%);stop-opacity:1"
|
||||
></stop>
|
||||
</lineargradient>
|
||||
<radialgradient
|
||||
id="_Radial89"
|
||||
cx="0"
|
||||
cy="0"
|
||||
r="1"
|
||||
gradientUnits="userSpaceOnUse"
|
||||
gradientTransform="matrix(688.954,0,0,688.954,315.79,386.36)">
|
||||
<stop offset="0" style="stop-color:var(--peach);stop-opacity:1"></stop>
|
||||
<stop offset="0.1" style="stop-color:var(--pink);stop-opacity:1"></stop>
|
||||
<stop offset="0.3" style="stop-color:var(--mauve);stop-opacity:1"></stop>
|
||||
<stop offset="0.45" style="stop-color:var(--blended-base-laptop);stop-opacity:1"></stop>
|
||||
<stop offset="1" style="stop-color:var(--blended-base-laptop);stop-opacity:1"></stop>
|
||||
</radialgradient>
|
||||
<lineargradient
|
||||
id="_Linear91"
|
||||
x1="0"
|
||||
y1="0"
|
||||
x2="1"
|
||||
y2="0"
|
||||
gradientUnits="userSpaceOnUse"
|
||||
gradientTransform="matrix(247.122,0,0,247.122,327.981,301.015)">
|
||||
<stop offset="0" style="stop-color:var(--peach);stop-opacity:1"></stop>
|
||||
<stop offset="0.1" style="stop-color:var(--pink);stop-opacity:1"></stop>
|
||||
<stop offset="0.4" style="stop-color:var(--mauve);stop-opacity:1"></stop>
|
||||
<stop offset="0.7" style="stop-color:var(--blended-base-laptop);stop-opacity:1"></stop>
|
||||
<stop offset="1" style="stop-color:var(--blended-base-laptop);stop-opacity:1"></stop>
|
||||
</lineargradient>
|
||||
<lineargradient
|
||||
id="_Linear92"
|
||||
x1="0"
|
||||
y1="0"
|
||||
x2="1"
|
||||
y2="0"
|
||||
gradientUnits="userSpaceOnUse"
|
||||
gradientTransform="matrix(200.768,0,0,200.768,351.156,288.456)">
|
||||
<stop offset="0" style="stop-color:var(--blended-base-laptop);stop-opacity:1"></stop>
|
||||
<stop offset="1" style="stop-color:var(--mauve);stop-opacity:1"></stop>
|
||||
</lineargradient>
|
||||
<lineargradient
|
||||
id="_Linear93"
|
||||
x1="0"
|
||||
y1="0"
|
||||
x2="1"
|
||||
y2="0"
|
||||
gradientUnits="userSpaceOnUse"
|
||||
gradientTransform="matrix(200.768,0,0,200.768,346.394,288.456)">
|
||||
<stop offset="0" style="stop-color:var(--mocha-base);stop-opacity:1"></stop>
|
||||
<stop offset="1" style="stop-color:var(--mocha-base);stop-opacity:1"></stop>
|
||||
</lineargradient>
|
||||
<lineargradient
|
||||
id="_Linear94"
|
||||
x1="0"
|
||||
y1="0"
|
||||
x2="1"
|
||||
y2="0"
|
||||
gradientUnits="userSpaceOnUse"
|
||||
gradientTransform="matrix(253.135,0,0,253.135,351.173,261.993)">
|
||||
<stop offset="0" style="stop-color:var(--mocha-base);stop-opacity:1"></stop>
|
||||
<stop offset="0.2" style="stop-color:var(--blended-base-laptop);stop-opacity:1"></stop>
|
||||
<stop offset="0.5" style="stop-color:var(--mauve);stop-opacity:1"></stop>
|
||||
<stop offset="0.8" style="stop-color:var(--pink);stop-opacity:1"></stop>
|
||||
<stop offset="1" style="stop-color:var(--peach);stop-opacity:1"></stop>
|
||||
</lineargradient>
|
||||
<radialgradient
|
||||
id="_Radial95"
|
||||
cx="0"
|
||||
cy="0"
|
||||
r="1"
|
||||
gradientUnits="userSpaceOnUse"
|
||||
gradientTransform="matrix(450.688,0,0,450.688,297.14,231.096)">
|
||||
<stop offset="0" style="stop-color:var(--peach);stop-opacity:1"></stop>
|
||||
<stop offset="0.1" style="stop-color:var(--pink);stop-opacity:1"></stop>
|
||||
<stop offset="0.2" style="stop-color:var(--mauve);stop-opacity:1"></stop>
|
||||
<stop offset="0.7" style="stop-color:var(--blended-base-laptop);stop-opacity:1"></stop>
|
||||
<stop offset="1" style="stop-color:var(--mocha-base);stop-opacity:1"></stop>
|
||||
</radialgradient>
|
||||
<lineargradient
|
||||
id="_Linear96"
|
||||
x1="0"
|
||||
y1="0"
|
||||
x2="1"
|
||||
y2="0"
|
||||
gradientUnits="userSpaceOnUse"
|
||||
gradientTransform="matrix(35.0195,0,0,35.0195,435.652,343.69)">
|
||||
<stop offset="0" style="stop-color:var(--blended-base-laptop);stop-opacity:1"></stop>
|
||||
<stop offset="0.3" style="stop-color:var(--blended-base-laptop);stop-opacity:1"></stop>
|
||||
<stop offset="0.5" style="stop-color:var(--mauve);stop-opacity:1"></stop>
|
||||
<stop offset="0.7" style="stop-color:var(--pink);stop-opacity:1"></stop>
|
||||
<stop offset="1" style="stop-color:var(--peach);stop-opacity:1"></stop>
|
||||
</lineargradient>
|
||||
</defs>
|
||||
</svg>
|
||||
@ -1,71 +0,0 @@
|
||||
import type { ReactElement } from "react";
|
||||
import Head from "next/head";
|
||||
import Image from "next/image";
|
||||
import PoweredByVercel from "./PoweredByVercel";
|
||||
import Link from "next/link";
|
||||
|
||||
const navItems = [
|
||||
{
|
||||
label: "Home",
|
||||
href: "/",
|
||||
},
|
||||
{
|
||||
label: "Ports",
|
||||
href: "/ports",
|
||||
},
|
||||
{
|
||||
label: "Palette",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Donate",
|
||||
href: "https://donate.catppuccin.com",
|
||||
},
|
||||
];
|
||||
|
||||
export default function Layout({
|
||||
children,
|
||||
title,
|
||||
}: {
|
||||
children: ReactElement;
|
||||
title?: string;
|
||||
}): ReactElement {
|
||||
return (
|
||||
<>
|
||||
<Head>
|
||||
<title>{`Catppuccin Theme` + (title ? ` ${title}` : "")}</title>
|
||||
</Head>
|
||||
<main>
|
||||
<div className="h-48 anim-gradient flex flex-col">
|
||||
<div className="h-12 bg-mantle/70 backdrop-blur flex items-center w-screen fixed z-10">
|
||||
<ul className="flex uppercase font-bold text-lg max-w-3xl mx-auto gap-6 lg:gap-12">
|
||||
{navItems.map(({ label, href }) => (
|
||||
<li key={label}>
|
||||
<Link href={href}>
|
||||
<a>{label}</a>
|
||||
</Link>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
</div>
|
||||
<div className="grid place-items-center flex-grow mt-12">
|
||||
<Link href="/">
|
||||
<a>
|
||||
<Image
|
||||
src="/500x500_circle.png"
|
||||
alt="Catppuccin Logo (round)"
|
||||
width={120}
|
||||
height={120}
|
||||
/>
|
||||
</a>
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
{children}
|
||||
</main>
|
||||
<footer className="flex justify-center items-center">
|
||||
<PoweredByVercel />
|
||||
</footer>
|
||||
</>
|
||||
);
|
||||
}
|
||||
36
src/components/Link.astro
Normal file
36
src/components/Link.astro
Normal file
@ -0,0 +1,36 @@
|
||||
---
|
||||
interface Props {
|
||||
href: string;
|
||||
external?: boolean;
|
||||
muted?: boolean;
|
||||
}
|
||||
|
||||
const { href, external = false, muted = false } = Astro.props;
|
||||
---
|
||||
|
||||
<a href={href} class:list={[`${muted ? "muted" : ""}`]}>
|
||||
<slot />{external ? <span class="external">↗</span> : ""}
|
||||
</a>
|
||||
|
||||
<style lang="scss">
|
||||
a {
|
||||
transition: color 250ms ease-in-out;
|
||||
|
||||
color: var(--blue);
|
||||
|
||||
&.muted {
|
||||
color: var(--subtext0);
|
||||
}
|
||||
|
||||
&:hover,
|
||||
&:focus {
|
||||
color: color-mix(in srgb, var(--blue), var(--text) 60%);
|
||||
}
|
||||
|
||||
.external {
|
||||
font-size: 60%;
|
||||
font-weight: 900;
|
||||
vertical-align: super;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
23
src/components/PageIntro.astro
Normal file
23
src/components/PageIntro.astro
Normal file
@ -0,0 +1,23 @@
|
||||
---
|
||||
interface Props {
|
||||
title: string;
|
||||
}
|
||||
|
||||
const { title } = Astro.props;
|
||||
---
|
||||
|
||||
<section class="page-intro">
|
||||
<h1>{title}</h1>
|
||||
|
||||
<slot />
|
||||
</section>
|
||||
|
||||
<style lang="scss">
|
||||
.page-intro {
|
||||
margin-block-end: var(--space-lg);
|
||||
}
|
||||
|
||||
.page-intro h1 {
|
||||
color: var(--accent-color);
|
||||
}
|
||||
</style>
|
||||
@ -1,14 +0,0 @@
|
||||
import Link from "next/link";
|
||||
import VercelFooter from "../../powered-by-vercel.svg";
|
||||
|
||||
export default function PoweredByVercel() {
|
||||
return (
|
||||
<div className="p-2">
|
||||
<Link href="https://vercel.com/?utm_source=catppuccin&utm_campaign=oss">
|
||||
<a>
|
||||
<VercelFooter className="h-12" />
|
||||
</a>
|
||||
</Link>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@ -1,19 +0,0 @@
|
||||
export default function SearchBar(props: any) {
|
||||
const handleChange = (e: any) => {
|
||||
e.preventDefault();
|
||||
const filteredPorts = props.ports.filter((port: any) =>
|
||||
port.name.toLowerCase().includes(e.target.value.toLowerCase())
|
||||
);
|
||||
props.setFilteredPorts(filteredPorts);
|
||||
};
|
||||
return (
|
||||
<div className="flex items-center w-full">
|
||||
<input
|
||||
type="text"
|
||||
className="bg-crust w-full lg:w-full md:w-full placeholder:text-rosewater focus:outline-none border-none p-2 text-text rounded shadow-2xl"
|
||||
placeholder="Search ..."
|
||||
onChange={handleChange}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
50
src/components/TeamName.astro
Normal file
50
src/components/TeamName.astro
Normal file
@ -0,0 +1,50 @@
|
||||
---
|
||||
interface Props {
|
||||
team: string;
|
||||
}
|
||||
|
||||
const { team } = Astro.props as Props;
|
||||
|
||||
const teamPaths: {
|
||||
[key: string]: string
|
||||
} = {
|
||||
userstyles: "M1259.24,392.903c25.241,0.921 49.198,11.36 67.058,29.22c87.114,87.101 355.98,355.967 355.98,355.967c30.455,30.456 30.507,79.856 0.116,110.248l-495.596,495.596l-865.578,-865.578l495.595,-495.596c30.392,-30.392 79.793,-30.34 110.249,0.116c-0,-0 63.271,63.272 100.829,100.83c18.012,18.01 28.472,42.214 29.246,67.674c1.593,54.173 0.156,151.911 -25.18,225.89c74.257,-25.43 172.932,-26.3 227.281,-24.367Zm-687.972,994.663l-267.41,267.41c-69.025,69.024 -181.221,68.906 -250.39,-0.264c-69.17,-69.17 -69.288,-181.366 -0.264,-250.39l267.41,-267.41l-120.42,-120.42c-104.067,-104.067 -104.244,-272.867 -0.397,-376.714l47.04,-47.04l865.578,865.578l-47.039,47.04c-103.848,103.848 -272.648,103.67 -376.714,-0.396l-117.394,-117.394Z",
|
||||
mod: "M907.134,1173.66l-380.657,-380.658l620.29,-722.14c-0,-0 15.593,-23.61 79.019,-29.448c46.131,-4.246 280.925,-28.288 405.55,-41.084c19.047,-1.941 37.953,4.807 51.468,18.368c13.514,13.561 20.196,32.491 18.19,51.531c-13.23,124.254 -38.028,358.018 -42.272,404.121c-5.838,63.427 -29.447,79.02 -29.447,79.02l-722.141,620.29Zm-571.74,-33.132l-88.135,-88.135c-83.879,-83.879 -83.879,-220.078 -0,-303.957l10.132,-10.132c22.368,-22.367 58.687,-22.367 81.055,0l635.241,635.241c22.367,22.368 22.367,58.687 -0,81.055l-10.132,10.132c-83.879,83.879 -220.078,83.879 -303.957,0l-88.135,-88.135l-281.212,281.213c-65.145,65.145 -170.925,65.145 -236.07,-0c-65.145,-65.145 -65.145,-170.925 0,-236.07l281.213,-281.212Z",
|
||||
staff: "M1260.09,1706.67l-813.51,-0c0,-0 -305.612,0.267 -305.612,-296.804c0,-297.07 106.895,-586.998 366.576,-586.998c93.32,-0 137.165,126.942 345.791,129.988c208.627,-3.046 252.472,-129.988 345.792,-129.988c259.681,-0 366.575,289.928 366.575,586.998c0,297.071 -305.612,296.804 -305.612,296.804Zm-406.755,-1706.67c227.635,0 412.445,184.81 412.445,412.445c0,227.634 -184.81,412.444 -412.445,412.444c-227.634,0 -412.444,-184.81 -412.444,-412.444c-0,-227.635 184.81,-412.445 412.444,-412.445Z",
|
||||
core: "M994.227,974.287c-2.013,-26.541 11.955,-51.737 35.531,-64.092c72.054,-37.757 111.05,-87.33 169.367,-87.33c259.681,-0 366.575,289.928 366.575,586.998c0,297.071 -305.612,296.804 -305.612,296.804l-813.51,-0c0,-0 -305.612,0.267 -305.612,-296.804c0,-297.07 106.895,-586.998 366.576,-586.998c60.145,-0 99.739,52.729 176.141,91.035c24.166,12.058 38.627,37.544 36.584,64.473c-8.586,116.218 -30.611,406.518 -30.611,406.518c0,-0 -2.789,13.638 17.246,37.735c14.563,17.515 87.261,107.468 125.885,155.297c5.926,7.322 14.836,11.583 24.256,11.599c9.419,0.016 18.344,-4.214 24.295,-11.515c38.905,-47.808 112.224,-137.855 126.795,-155.381c20.035,-24.097 17.246,-37.735 17.246,-37.735c0,-0 -22.351,-294.597 -31.152,-410.604Zm-140.894,-974.287c227.635,0 412.445,184.81 412.445,412.445c0,227.634 -184.81,412.444 -412.445,412.444c-227.634,0 -412.444,-184.81 -412.444,-412.444c-0,-227.635 184.81,-412.445 412.444,-412.445Z"
|
||||
}
|
||||
---
|
||||
|
||||
<span class="team-title" data-flavor={team}>
|
||||
<slot />
|
||||
<svg class="team-icon" viewBox="0 0 1707 1707" version="1.1" xmlns="http://www.w3.org/2000/svg">
|
||||
<title>{team} icon</title>
|
||||
<path d={teamPaths[team]} />
|
||||
</svg>
|
||||
</span>
|
||||
|
||||
<style lang="scss">
|
||||
.team-title {
|
||||
display: inline-flex;
|
||||
flex-direction: row-reverse;
|
||||
align-items: center;
|
||||
gap: var(--space-xs);
|
||||
text-transform: capitalize;
|
||||
}
|
||||
.team-icon {
|
||||
height: 3.2rem;
|
||||
fill: currentColor;
|
||||
}
|
||||
[data-flavor="core"] .team-icon {
|
||||
color: var(--teal);
|
||||
}
|
||||
[data-flavor="staff"] .team-icon {
|
||||
color: var(--mauve);
|
||||
}
|
||||
[data-flavor="mod"] .team-icon {
|
||||
color: var(--peach);
|
||||
}
|
||||
[data-flavor="userstyles"] .team-icon {
|
||||
color: var(--green);
|
||||
}
|
||||
</style>
|
||||
122
src/components/cards/Callout.astro
Normal file
122
src/components/cards/Callout.astro
Normal file
@ -0,0 +1,122 @@
|
||||
---
|
||||
import PhosphorIcon from "../icons/Phosphor.astro";
|
||||
|
||||
interface Props {
|
||||
type?: string;
|
||||
title?: string;
|
||||
}
|
||||
|
||||
const { type = "note", title } = Astro.props;
|
||||
|
||||
type Callout = {
|
||||
[key: string]: {
|
||||
icon: string;
|
||||
color: string;
|
||||
title: string;
|
||||
};
|
||||
};
|
||||
|
||||
const calloutVariants: Callout = {
|
||||
note: {
|
||||
title: "Note",
|
||||
color: "blue",
|
||||
icon: "pen",
|
||||
},
|
||||
summary: {
|
||||
title: "Summary",
|
||||
color: "rosewater",
|
||||
icon: "clipboard",
|
||||
},
|
||||
info: {
|
||||
title: "Info",
|
||||
color: "teal",
|
||||
icon: "info",
|
||||
},
|
||||
tip: {
|
||||
title: "Tip",
|
||||
color: "yellow",
|
||||
icon: "flame",
|
||||
},
|
||||
success: {
|
||||
title: "Success",
|
||||
color: "green",
|
||||
icon: "checkmark",
|
||||
},
|
||||
question: {
|
||||
title: "Question",
|
||||
color: "sapphire",
|
||||
icon: "questionmark",
|
||||
},
|
||||
warning: {
|
||||
title: "Warning",
|
||||
color: "peach",
|
||||
icon: "danger",
|
||||
},
|
||||
failure: {
|
||||
title: "Failure",
|
||||
color: "red",
|
||||
icon: "fail",
|
||||
},
|
||||
danger: {
|
||||
title: "Danger",
|
||||
color: "red",
|
||||
icon: "lightning",
|
||||
},
|
||||
bug: {
|
||||
title: "Bug",
|
||||
color: "red",
|
||||
icon: "beetle",
|
||||
},
|
||||
example: {
|
||||
title: "Example",
|
||||
color: "mauve",
|
||||
icon: "list",
|
||||
},
|
||||
quote: {
|
||||
title: "Quote",
|
||||
color: "text",
|
||||
icon: "quote",
|
||||
},
|
||||
};
|
||||
---
|
||||
|
||||
<div class="annotation" style={`--callout-color: var(--${calloutVariants[type].color})`}>
|
||||
<div class="annotation-title">
|
||||
<PhosphorIcon icon={calloutVariants[type].icon} />
|
||||
{title ? title : calloutVariants[type].title}
|
||||
</div>
|
||||
<div class="annotation-content">
|
||||
<slot />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style lang="scss">
|
||||
@use "../../styles/utils";
|
||||
|
||||
.annotation {
|
||||
display: inline-block;
|
||||
|
||||
overflow: clip;
|
||||
|
||||
border-radius: var(--border-radius-normal);
|
||||
background-color: var(--mantle);
|
||||
|
||||
&-title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: var(--space-xxs);
|
||||
|
||||
@include utils.containerPadding(xs);
|
||||
|
||||
background-color: color-mix(in srgb, var(--base), var(--callout-color) 15%);
|
||||
|
||||
font-size: 80%;
|
||||
font-weight: 600;
|
||||
color: var(--callout-color);
|
||||
}
|
||||
|
||||
&-content {
|
||||
@include utils.containerPadding(xs);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
74
src/components/cards/Port.astro
Normal file
74
src/components/cards/Port.astro
Normal file
@ -0,0 +1,74 @@
|
||||
---
|
||||
import type { ColorName } from "@catppuccin/palette";
|
||||
import type { Category } from "../../lib/ports";
|
||||
|
||||
import Icon from "../icons/Ports.astro";
|
||||
import PillList from "../lists/Pills.astro";
|
||||
|
||||
interface Props {
|
||||
title: string;
|
||||
link: string;
|
||||
categories: Category[];
|
||||
color?: ColorName;
|
||||
}
|
||||
|
||||
const { title, link, categories, color } = Astro.props;
|
||||
---
|
||||
|
||||
<a href={link} class="port-card">
|
||||
<div class="port-header">
|
||||
<p class="port-name">{title}</p>
|
||||
<div class="port-icon"><Icon port={title} color={color} /></div>
|
||||
</div>
|
||||
|
||||
<PillList list={categories.map((category: Category) => `${category.name}`)} />
|
||||
</a>
|
||||
|
||||
<style lang="scss">
|
||||
@use "../../styles/utils";
|
||||
|
||||
.port-card {
|
||||
@include utils.flex($direction: column, $gap: var(--space-sm));
|
||||
justify-content: space-between;
|
||||
|
||||
@include utils.containerPadding();
|
||||
|
||||
border-radius: var(--border-radius-normal);
|
||||
background-color: var(--mantle);
|
||||
background-size: 200%;
|
||||
background-position: top left;
|
||||
|
||||
color: var(--subtext0);
|
||||
font-size: 1.6rem;
|
||||
|
||||
transition: all 300ms ease-in-out;
|
||||
|
||||
&:hover {
|
||||
transform: scale(105%);
|
||||
|
||||
background-position: top right;
|
||||
|
||||
@media (prefers-reduced-motion) {
|
||||
transform: none;
|
||||
}
|
||||
}
|
||||
|
||||
figure,
|
||||
p {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.port-header {
|
||||
@include utils.flex($gap: var(--space-sm));
|
||||
flex-wrap: nowrap;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.port-name {
|
||||
color: var(--text);
|
||||
font-size: 2rem;
|
||||
font-weight: 600;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
52
src/components/cards/User.astro
Normal file
52
src/components/cards/User.astro
Normal file
@ -0,0 +1,52 @@
|
||||
---
|
||||
import type { ColorName } from "@catppuccin/palette";
|
||||
|
||||
import Link from "../Link.astro";
|
||||
|
||||
interface Props {
|
||||
userName: string;
|
||||
displayName: string;
|
||||
showAvatar?: boolean;
|
||||
color?: ColorName;
|
||||
}
|
||||
|
||||
const { userName, displayName, showAvatar, color } = Astro.props;
|
||||
---
|
||||
|
||||
<div class="card-user" style={`--user-color: var(--${color})`}>
|
||||
<Link href={`https://github.com/${userName}`} external>
|
||||
{
|
||||
showAvatar === true ? (
|
||||
<>
|
||||
<img
|
||||
class="user-avatar"
|
||||
src={`https://github.com/${userName}.png?size=128`}
|
||||
alt={`${displayName}'s Avatar`}
|
||||
/>
|
||||
<br />
|
||||
<span class="user-name">{displayName}</span>
|
||||
</>
|
||||
) : (
|
||||
<span class="user-name">{displayName}</span>
|
||||
)
|
||||
}
|
||||
</Link>
|
||||
</div>
|
||||
|
||||
<style lang="scss">
|
||||
@use "../../styles/utils";
|
||||
|
||||
.card-user {
|
||||
--__user-color: var(--user-color, var(--mantle));
|
||||
|
||||
@include utils.containerPadding(md);
|
||||
border-radius: var(--border-radius-large);
|
||||
background-color: var(--mantle);
|
||||
text-align: center;
|
||||
|
||||
img {
|
||||
border-radius: 50%;
|
||||
border: var(--space-xxs) solid var(--__user-color);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
121
src/components/icons/Logo.astro
Normal file
121
src/components/icons/Logo.astro
Normal file
File diff suppressed because one or more lines are too long
48
src/components/icons/Phosphor.astro
Normal file
48
src/components/icons/Phosphor.astro
Normal file
@ -0,0 +1,48 @@
|
||||
---
|
||||
interface Props {
|
||||
icon: string;
|
||||
size?: number;
|
||||
}
|
||||
|
||||
const { icon, size = 24 } = Astro.props;
|
||||
|
||||
const phosphorIcons: { [key: string]: string } = {
|
||||
info: "M128,24A104,104,0,1,0,232,128,104.11,104.11,0,0,0,128,24Zm-4,48a12,12,0,1,1-12,12A12,12,0,0,1,124,72Zm12,112a16,16,0,0,1-16-16V128a8,8,0,0,1,0-16,16,16,0,0,1,16,16v40a8,8,0,0,1,0,16Z",
|
||||
checkmark:
|
||||
"M243.33,90.91,114.92,219.31a16,16,0,0,1-22.63,0l-71.62-72a16,16,0,0,1,0-22.61l24-24a16,16,0,0,1,22.57-.06l36.64,35.27.11.11h0l92.73-91.37a16,16,0,0,1,22.58,0l24,23.56A16,16,0,0,1,243.33,90.91Z",
|
||||
questionmark:
|
||||
"M128,24A104,104,0,1,0,232,128,104.11,104.11,0,0,0,128,24Zm0,168a12,12,0,1,1,12-12A12,12,0,0,1,128,192Zm8-48.72V144a8,8,0,0,1-16,0v-8a8,8,0,0,1,8-8c13.23,0,24-9,24-20s-10.77-20-24-20-24,9-24,20v4a8,8,0,0,1-16,0v-4c0-19.85,17.94-36,40-36s40,16.15,40,36C168,125.38,154.24,139.93,136,143.28Z",
|
||||
danger:
|
||||
"M236.8,188.09,149.35,36.22h0a24.76,24.76,0,0,0-42.7,0L19.2,188.09a23.51,23.51,0,0,0,0,23.72A24.35,24.35,0,0,0,40.55,224h174.9a24.35,24.35,0,0,0,21.33-12.19A23.51,23.51,0,0,0,236.8,188.09ZM120,104a8,8,0,0,1,16,0v40a8,8,0,0,1-16,0Zm8,88a12,12,0,1,1,12-12A12,12,0,0,1,128,192Z",
|
||||
fail: "M128,24A104,104,0,1,0,232,128,104.11,104.11,0,0,0,128,24Zm37.66,130.34a8,8,0,0,1-11.32,11.32L128,139.31l-26.34,26.35a8,8,0,0,1-11.32-11.32L116.69,128,90.34,101.66a8,8,0,0,1,11.32-11.32L128,116.69l26.34-26.35a8,8,0,0,1,11.32,11.32L139.31,128Z",
|
||||
copy: "M216,32H88a8,8,0,0,0-8,8V80H40a8,8,0,0,0-8,8V216a8,8,0,0,0,8,8H168a8,8,0,0,0,8-8V176h40a8,8,0,0,0,8-8V40A8,8,0,0,0,216,32Zm-8,128H176V88a8,8,0,0,0-8-8H96V48H208Z",
|
||||
box: "M223.68,66.15,135.68,18a15.88,15.88,0,0,0-15.36,0l-88,48.17a16,16,0,0,0-8.32,14v95.64a16,16,0,0,0,8.32,14l88,48.17a15.88,15.88,0,0,0,15.36,0l88-48.17a16,16,0,0,0,8.32-14V80.18A16,16,0,0,0,223.68,66.15ZM128,120,47.65,76,128,32l80.35,44Zm8,99.64V133.83l80-43.78v85.76Z",
|
||||
palette:
|
||||
"M200.77,53.89A103.27,103.27,0,0,0,128,24h-1.07A104,104,0,0,0,24,128c0,43,26.58,79.06,69.36,94.17A32,32,0,0,0,136,192a16,16,0,0,1,16-16h46.21a31.81,31.81,0,0,0,31.2-24.88,104.43,104.43,0,0,0,2.59-24A103.28,103.28,0,0,0,200.77,53.89ZM84,168a12,12,0,1,1,12-12A12,12,0,0,1,84,168Zm0-56a12,12,0,1,1,12-12A12,12,0,0,1,84,112Zm44-24a12,12,0,1,1,12-12A12,12,0,0,1,128,88Zm44,24a12,12,0,1,1,12-12A12,12,0,0,1,172,112Z",
|
||||
note: "M208,32H48A16,16,0,0,0,32,48V208a16,16,0,0,0,16,16H156.69A15.92,15.92,0,0,0,168,219.31L219.31,168A15.92,15.92,0,0,0,224,156.69V48A16,16,0,0,0,208,32ZM96,88h64a8,8,0,0,1,0,16H96a8,8,0,0,1,0-16Zm32,80H96a8,8,0,0,1,0-16h32a8,8,0,0,1,0,16ZM96,136a8,8,0,0,1,0-16h64a8,8,0,0,1,0,16Zm64,68.69V160h44.7Z",
|
||||
list: "M56,128a16,16,0,1,1-16-16A16,16,0,0,1,56,128ZM40,48A16,16,0,1,0,56,64,16,16,0,0,0,40,48Zm0,128a16,16,0,1,0,16,16A16,16,0,0,0,40,176Zm176-64H88a8,8,0,0,0-8,8v16a8,8,0,0,0,8,8H216a8,8,0,0,0,8-8V120A8,8,0,0,0,216,112Zm0-64H88a8,8,0,0,0-8,8V72a8,8,0,0,0,8,8H216a8,8,0,0,0,8-8V56A8,8,0,0,0,216,48Zm0,128H88a8,8,0,0,0-8,8v16a8,8,0,0,0,8,8H216a8,8,0,0,0,8-8V184A8,8,0,0,0,216,176Z",
|
||||
quote:
|
||||
"M116,72v88a48.05,48.05,0,0,1-48,48,8,8,0,0,1,0-16,32,32,0,0,0,32-32v-8H40a16,16,0,0,1-16-16V72A16,16,0,0,1,40,56h60A16,16,0,0,1,116,72ZM216,56H156a16,16,0,0,0-16,16v64a16,16,0,0,0,16,16h60v8a32,32,0,0,1-32,32,8,8,0,0,0,0,16,48.05,48.05,0,0,0,48-48V72A16,16,0,0,0,216,56Z",
|
||||
pen: "M227.31,73.37,182.63,28.68a16,16,0,0,0-22.63,0L36.69,152A15.86,15.86,0,0,0,32,163.31V208a16,16,0,0,0,16,16H92.69A15.86,15.86,0,0,0,104,219.31L227.31,96a16,16,0,0,0,0-22.63ZM192,108.68,147.31,64l24-24L216,84.68Z",
|
||||
clipboard:
|
||||
"M200,32H163.74a47.92,47.92,0,0,0-71.48,0H56A16,16,0,0,0,40,48V216a16,16,0,0,0,16,16H200a16,16,0,0,0,16-16V48A16,16,0,0,0,200,32Zm-72,0a32,32,0,0,1,32,32H96A32,32,0,0,1,128,32Zm32,128H96a8,8,0,0,1,0-16h64a8,8,0,0,1,0,16Zm0-32H96a8,8,0,0,1,0-16h64a8,8,0,0,1,0,16Z",
|
||||
flame:
|
||||
"M143.38,17.85a8,8,0,0,0-12.63,3.41l-22,60.41L84.59,58.26a8,8,0,0,0-11.93.89C51,87.53,40,116.08,40,144a88,88,0,0,0,176,0C216,84.55,165.21,36,143.38,17.85Zm40.51,135.49a57.6,57.6,0,0,1-46.56,46.55A7.65,7.65,0,0,1,136,200a8,8,0,0,1-1.32-15.89c16.57-2.79,30.63-16.85,33.44-33.45a8,8,0,0,1,15.78,2.68Z",
|
||||
lightning:
|
||||
"M213.85,125.46l-112,120a8,8,0,0,1-13.69-7l14.66-73.33L45.19,143.49a8,8,0,0,1-3-13l112-120a8,8,0,0,1,13.69,7L153.18,90.9l57.63,21.61a8,8,0,0,1,3,12.95Z",
|
||||
beetle:
|
||||
"M224,112H208V96h16a8,8,0,0,1,0,16ZM32,96a8,8,0,0,0,0,16H48V96Zm176,56c0,2.7-.14,5.37-.4,8H224a8,8,0,0,1,0,16H204.32a80,80,0,0,1-152.64,0H32a8,8,0,0,1,0-16H48.4c-.26-2.63-.4-5.3-.4-8v-8H32a8,8,0,0,1,0-16H48V112H208v16h16a8,8,0,0,1,0,16H208Zm-72-16a8,8,0,0,0-16,0v64a8,8,0,0,0,16,0ZM69.84,49.15A79.76,79.76,0,0,0,48.4,96H207.6a79.76,79.76,0,0,0-21.44-46.85l19.5-19.49a8,8,0,1,0-11.32-11.32l-20.29,20.3a79.74,79.74,0,0,0-92.1,0L61.66,18.34A8,8,0,0,0,50.34,29.66Z",
|
||||
people:
|
||||
"M64.12,147.8a4,4,0,0,1-4,4.2H16a8,8,0,0,1-7.8-6.17,8.35,8.35,0,0,1,1.62-6.93A67.79,67.79,0,0,1,37,117.51a40,40,0,1,1,66.46-35.8,3.94,3.94,0,0,1-2.27,4.18A64.08,64.08,0,0,0,64,144C64,145.28,64,146.54,64.12,147.8Zm182-8.91A67.76,67.76,0,0,0,219,117.51a40,40,0,1,0-66.46-35.8,3.94,3.94,0,0,0,2.27,4.18A64.08,64.08,0,0,1,192,144c0,1.28,0,2.54-.12,3.8a4,4,0,0,0,4,4.2H240a8,8,0,0,0,7.8-6.17A8.33,8.33,0,0,0,246.17,138.89Zm-89,43.18a48,48,0,1,0-58.37,0A72.13,72.13,0,0,0,65.07,212,8,8,0,0,0,72,224H184a8,8,0,0,0,6.93-12A72.15,72.15,0,0,0,157.19,182.07Z",
|
||||
};
|
||||
---
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width={size} height={size} viewBox="0 0 256 256">
|
||||
<style>
|
||||
.phosphor-icon {
|
||||
fill: currentColor;
|
||||
}
|
||||
</style>
|
||||
|
||||
<path class="phosphor-icon" d={phosphorIcons[icon]}></path>
|
||||
</svg>
|
||||
25
src/components/icons/Ports.astro
Normal file
25
src/components/icons/Ports.astro
Normal file
@ -0,0 +1,25 @@
|
||||
---
|
||||
import type { ColorName } from "@catppuccin/palette";
|
||||
import { getIcon } from "../../lib/icon";
|
||||
|
||||
interface Props {
|
||||
port: string;
|
||||
color: ColorName | undefined;
|
||||
height?: number;
|
||||
}
|
||||
|
||||
const { port, color, height = 2.4 } = Astro.props;
|
||||
|
||||
const { path, viewbox } = getIcon(port);
|
||||
---
|
||||
|
||||
<svg
|
||||
class="icon"
|
||||
height={`${height}rem`}
|
||||
role="img"
|
||||
viewBox={viewbox}
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
style={color ? `fill: var(--${color})` : "fill: currentColor"}>
|
||||
<title>{port}</title>
|
||||
<path d={path}></path>
|
||||
</svg>
|
||||
40
src/components/lists/GitHubUsers.astro
Normal file
40
src/components/lists/GitHubUsers.astro
Normal file
@ -0,0 +1,40 @@
|
||||
---
|
||||
import type { ColorName } from "@catppuccin/palette";
|
||||
|
||||
import UserCard from "../cards/User.astro";
|
||||
|
||||
export type Person = {
|
||||
userName: string;
|
||||
displayName: string;
|
||||
avatar?: string;
|
||||
color?: ColorName;
|
||||
};
|
||||
|
||||
interface Props {
|
||||
users: Person[];
|
||||
}
|
||||
|
||||
const { users } = Astro.props;
|
||||
---
|
||||
|
||||
<ul class="user-list">
|
||||
{
|
||||
users.map((user: Person) => (
|
||||
<li>
|
||||
<UserCard userName={user.userName} displayName={user.displayName} showAvatar={true} />
|
||||
</li>
|
||||
))
|
||||
}
|
||||
</ul>
|
||||
|
||||
<style lang="scss">
|
||||
@use "../../styles/utils";
|
||||
|
||||
.user-list {
|
||||
@include utils.flex($gap: var(--space-md));
|
||||
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
}
|
||||
</style>
|
||||
37
src/components/lists/Pills.astro
Normal file
37
src/components/lists/Pills.astro
Normal file
@ -0,0 +1,37 @@
|
||||
---
|
||||
import type { ColorName } from "@catppuccin/palette";
|
||||
|
||||
interface Props {
|
||||
list: string[];
|
||||
color?: ColorName;
|
||||
}
|
||||
|
||||
const { list } = Astro.props;
|
||||
---
|
||||
|
||||
<ul class="pill-list">
|
||||
{list.map((entry) => <li class="pill">{entry}</li>)}
|
||||
</ul>
|
||||
|
||||
<style lang="scss">
|
||||
@use "../../styles/utils";
|
||||
|
||||
.pill-list {
|
||||
@include utils.flex($gap: var(--space-xs));
|
||||
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
|
||||
line-height: 1;
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
.pill {
|
||||
@include utils.containerPadding(xxs-y);
|
||||
|
||||
border-radius: 9999px;
|
||||
background-color: color-mix(in srgb, var(--base), var(--subtext0) 20%);
|
||||
|
||||
font-size: 80%;
|
||||
}
|
||||
</style>
|
||||
@ -1,47 +0,0 @@
|
||||
<p align="center">
|
||||
Catppuccin is a community-driven pastel theme that aims to be the middle ground between low and high contrast themes. It consists of 4 soothing warm palettes with 26 eye-candy colors each, perfect for coding, designing, and much more! In addition, this repository tracks the development of the actual color palette, <a href="https://github.com/catppuccin/catppuccin/tree/dev/docs"><b>the project's documentation</b></a>, organization-wide assets, resources and code samples for maintainers/developers.
|
||||
</p>
|
||||
|
||||
|
||||
|
||||
### 🧠 Design Philosophy
|
||||
|
||||
- **Colorful is better than colorless**: the colorfulness of something contributes to the distinction amongst the parts of that _something_, making it marginally easier to understand how things are structured.
|
||||
- **There should be balance**: not too dull, not too bright. Suitability under various light conditions is a must.
|
||||
- **Harmony is superior to dissonance**: vivacious colors must complement each other.
|
||||
|
||||
|
||||
|
||||
### 👐 Contribute
|
||||
|
||||
See [CONTRIBUTING.md](https://github.com/catppuccin/catppuccin/blob/dev/CONTRIBUTING.md).
|
||||
|
||||
|
||||
|
||||
### 📜 License
|
||||
|
||||
Catppuccin is released under the MIT license, which grants the following permissions:
|
||||
|
||||
- Commercial use
|
||||
- Distribution
|
||||
- Modification
|
||||
- Private use
|
||||
|
||||
For more convoluted language, see the [LICENSE](https://github.com/catppuccin/catppuccin/blob/main/LICENSE).
|
||||
|
||||
|
||||
|
||||
### ❤️ Gratitude
|
||||
|
||||
Thanks to the following tools developing this project is possible:
|
||||
|
||||
- [coolors.co](https://coolors.co/): A tool for creating and collecting color palettes.
|
||||
- [InkScape](https://inkscape.org/): Free and open-source vector graphics editor.
|
||||
- [colors_converter.asp](https://www.w3schools.com/colors/colors_converter.asp): Color format converter.
|
||||
- [mdigi.tools](https://mdigi.tools/): Web based digital tools.
|
||||
|
||||
|
||||
|
||||
<p align="center"><img src="https://raw.githubusercontent.com/catppuccin/catppuccin/main/assets/footers/gray0_ctp_on_line.svg?sanitize=true" /></p>
|
||||
<p align="center">Copyright © 2021-present <a href="https://github.com/catppuccin" target="_blank">Catppuccin Org</a>
|
||||
<p align="center"><a href="https://github.com/catppuccin/catppuccin/blob/main/LICENSE"><img src="https://img.shields.io/static/v1.svg?style=for-the-badge&label=License&message=MIT&logoColor=d9e0ee&colorA=302d41&colorB=b7bdf8"/></a></p>
|
||||
9
src/contents/links.ts
Normal file
9
src/contents/links.ts
Normal file
@ -0,0 +1,9 @@
|
||||
export const links = {
|
||||
github: "https://github.com/catppuccin",
|
||||
opencollective: "https://opencollective.com/catppuccin",
|
||||
discord: "https://discord.com/servers/catppuccin-907385605422448742",
|
||||
mastodon: "https://fosstodon.org/@catppuccin",
|
||||
twitter: "https://twitter.com/catppuccintheme",
|
||||
twitch: "https://twitch.com/catppuccin",
|
||||
instagram: "https://www.instagram.com/catppuccintheme",
|
||||
};
|
||||
88
src/contents/navigation.ts
Normal file
88
src/contents/navigation.ts
Normal file
@ -0,0 +1,88 @@
|
||||
import { links } from "./links";
|
||||
|
||||
export const header = [
|
||||
{
|
||||
title: "Home",
|
||||
target: "/",
|
||||
accent: "rosewater",
|
||||
},
|
||||
{
|
||||
title: "Ports",
|
||||
target: "ports",
|
||||
accent: "peach",
|
||||
},
|
||||
{
|
||||
title: "Palette",
|
||||
target: "palette",
|
||||
accent: "mauve",
|
||||
},
|
||||
{
|
||||
title: "Community",
|
||||
target: "community",
|
||||
accent: "green",
|
||||
},
|
||||
];
|
||||
|
||||
export const footer = [
|
||||
{
|
||||
categoryTitle: "Project",
|
||||
categoryLinks: [
|
||||
{
|
||||
title: "Ports",
|
||||
target: "/ports",
|
||||
external: false,
|
||||
},
|
||||
{
|
||||
title: "Palette",
|
||||
target: "/palette",
|
||||
external: false,
|
||||
},
|
||||
{
|
||||
title: "Community",
|
||||
target: "/community",
|
||||
external: false,
|
||||
},
|
||||
{
|
||||
title: "Open Collective",
|
||||
target: links.opencollective,
|
||||
external: true,
|
||||
},
|
||||
],
|
||||
},
|
||||
|
||||
{
|
||||
categoryTitle: "Social",
|
||||
categoryLinks: [
|
||||
{
|
||||
title: "GitHub",
|
||||
target: links.github,
|
||||
external: true,
|
||||
},
|
||||
{
|
||||
title: "Discord",
|
||||
target: links.discord,
|
||||
external: true,
|
||||
},
|
||||
{
|
||||
title: "Mastodon",
|
||||
target: links.mastodon,
|
||||
external: true,
|
||||
},
|
||||
{
|
||||
title: "Twitter",
|
||||
target: links.twitter,
|
||||
external: true,
|
||||
},
|
||||
{
|
||||
title: "Twitch",
|
||||
target: links.twitch,
|
||||
external: true,
|
||||
},
|
||||
{
|
||||
title: "Instagram",
|
||||
target: links.instagram,
|
||||
external: true,
|
||||
},
|
||||
],
|
||||
},
|
||||
];
|
||||
2
src/env.d.ts
vendored
Normal file
2
src/env.d.ts
vendored
Normal file
@ -0,0 +1,2 @@
|
||||
/// <reference path="../.astro/types.d.ts" />
|
||||
/// <reference types="astro/client" />
|
||||
36
src/env/client.mjs
vendored
36
src/env/client.mjs
vendored
@ -1,36 +0,0 @@
|
||||
// @ts-check
|
||||
import { clientEnv, clientSchema } from "./schema.mjs";
|
||||
|
||||
const _clientEnv = clientSchema.safeParse(clientEnv);
|
||||
|
||||
export const formatErrors = (
|
||||
/** @type {import('zod').ZodFormattedError<Map<string,string>,string>} */
|
||||
errors
|
||||
) =>
|
||||
Object.entries(errors)
|
||||
.map(([name, value]) => {
|
||||
if (value && "_errors" in value)
|
||||
return `${name}: ${value._errors.join(", ")}\n`;
|
||||
})
|
||||
.filter(Boolean);
|
||||
|
||||
if (_clientEnv.success === false) {
|
||||
console.error(
|
||||
"❌ Invalid environment variables:\n",
|
||||
...formatErrors(_clientEnv.error.format())
|
||||
);
|
||||
throw new Error("Invalid environment variables");
|
||||
}
|
||||
|
||||
/**
|
||||
* Validate that client-side environment variables are exposed to the client.
|
||||
*/
|
||||
for (let key of Object.keys(_clientEnv.data)) {
|
||||
if (!key.startsWith("NEXT_PUBLIC_")) {
|
||||
console.warn("❌ Invalid public environment variable name:", key);
|
||||
|
||||
throw new Error("Invalid public environment variable name");
|
||||
}
|
||||
}
|
||||
|
||||
export const env = _clientEnv.data;
|
||||
29
src/env/schema.mjs
vendored
29
src/env/schema.mjs
vendored
@ -1,29 +0,0 @@
|
||||
// @ts-check
|
||||
import { z } from "zod";
|
||||
|
||||
/**
|
||||
* Specify your server-side environment variables schema here.
|
||||
* This way you can ensure the app isn't built with invalid env vars.
|
||||
*/
|
||||
export const serverSchema = z.object({
|
||||
// FOO: z.string(),
|
||||
});
|
||||
|
||||
/**
|
||||
* Specify your client-side environment variables schema here.
|
||||
* This way you can ensure the app isn't built with invalid env vars.
|
||||
* To expose them to the client, prefix them with `NEXT_PUBLIC_`.
|
||||
*/
|
||||
export const clientSchema = z.object({
|
||||
// NEXT_PUBLIC_BAR: z.string(),
|
||||
});
|
||||
|
||||
/**
|
||||
* You can't destruct `process.env` as a regular object, so you have to do
|
||||
* it manually here. This is because Next.js evaluates this at build time,
|
||||
* and only used environment variables are included in the build.
|
||||
* @type {{ [k in keyof z.infer<typeof clientSchema>]: z.infer<typeof clientSchema>[k] | undefined }}
|
||||
*/
|
||||
export const clientEnv = {
|
||||
// NEXT_PUBLIC_BAR: process.env.NEXT_PUBLIC_BAR,
|
||||
};
|
||||
30
src/env/server.mjs
vendored
30
src/env/server.mjs
vendored
@ -1,30 +0,0 @@
|
||||
// @ts-check
|
||||
/**
|
||||
* This file is included in `/next.config.mjs` which ensures the app isn't built with invalid env vars.
|
||||
* It has to be a `.mjs`-file to be imported there.
|
||||
*/
|
||||
import { serverSchema } from "./schema.mjs";
|
||||
import { env as clientEnv, formatErrors } from "./client.mjs";
|
||||
|
||||
const _serverEnv = serverSchema.safeParse(process.env);
|
||||
|
||||
if (_serverEnv.success === false) {
|
||||
console.error(
|
||||
"❌ Invalid environment variables:\n",
|
||||
...formatErrors(_serverEnv.error.format())
|
||||
);
|
||||
throw new Error("Invalid environment variables");
|
||||
}
|
||||
|
||||
/**
|
||||
* Validate that server-side environment variables are not exposed to the client.
|
||||
*/
|
||||
for (let key of Object.keys(_serverEnv.data)) {
|
||||
if (key.startsWith("NEXT_PUBLIC_")) {
|
||||
console.warn("❌ You are exposing a server-side env-variable:", key);
|
||||
|
||||
throw new Error("You are exposing a server-side env-variable");
|
||||
}
|
||||
}
|
||||
|
||||
export const env = { ..._serverEnv.data, ...clientEnv };
|
||||
@ -1,5 +0,0 @@
|
||||
<svg role="img" viewBox="0 0 24 24" width="2.5rem" height="2.5rem"
|
||||
xmlns="http://www.w3.org/2000/svg">
|
||||
<title>GNOME Terminal</title>
|
||||
<path d="M1.846 0A1.841 1.841 0 000 1.846v18.463c0 1.022.823 1.845 1.846 1.845h20.308A1.841 1.841 0 0024 20.31V1.846A1.841 1.841 0 0022.154 0H1.846zm0 .924h20.308c.512 0 .922.41.922.922v18.463c0 .511-.41.921-.922.921H1.846a.919.919 0 01-.922-.921V1.846c0-.512.41-.922.922-.922zm0 .922v18.463h20.308V1.846H1.846zm1.845 2.14l3.235 1.758v.836L3.69 8.477V7.385l2.243-1.207v-.033L3.69 5.076v-1.09zM7.846 9.23h3.693v.924H7.846V9.23zM0 21.736v.418C0 23.177.823 24 1.846 24h20.308A1.841 1.841 0 0024 22.154v-.418a2.334 2.334 0 01-1.846.918H1.846A2.334 2.334 0 010 21.736Z"/>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 718 B |
@ -1,5 +0,0 @@
|
||||
<svg role="img" viewBox="0 0 24 24" width="2.5rem" height="2.5rem"
|
||||
xmlns="http://www.w3.org/2000/svg">
|
||||
<title>GTK</title>
|
||||
<path d="M9.01 23.773V14.45l-7.584 2.245Zm0-13.87L.91 3.828l.502 12.526 7.597-2.249ZM9.57 24l12.353-5.146-8.285-5.775-4.068 1.204ZM23.09 5.815l-9.257 2.849v4.148l8.237 5.741ZM9.57 9.975v3.964l3.932-1.164v-4.01Zm-.228-.52 4.16-1.28V0L1.231 3.37ZM22.715 5.34 13.833.052v8.021Z"/>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 418 B |
@ -1,22 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:svg="http://www.w3.org/2000/svg" id="svg2" width="2.5rem" height="2.5rem" version="1.1" viewBox="0 0 240 240">
|
||||
<metadata id="metadata7"/>
|
||||
<g id="layer1" transform="translate(0,-812.36217)">
|
||||
<rect style="fill:#ddd;fill-opacity:1;fill-rule:evenodd;stroke:transparent;stroke-width:5.86876726;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:transparent;stroke-opacity:1" id="rect4496" width="100.446" height="161.551" x="72.824" y="850.13" ry="0"/>
|
||||
<path id="path4" d="M 67.895761,1029.7093 H 172.10422 a 7.0649814,7.0649814 0 0 0 7.06499,-7.065 V 918.43587 a 7.0649814,7.0649814 0 0 0 -7.06499,-7.06499 H 67.895761 a 7.0649814,7.0649814 0 0 0 -7.064982,7.06499 v 104.20843 a 7.0649814,7.0649814 0 0 0 7.064982,7.065 z m 55.813329,-38.3487 h 37.4444 a 4.23899,4.23899 0 0 1 0,8.47798 h -37.4444 a 4.23899,4.23899 0 0 1 0,-8.47798 z M 78.676916,945.65018 a 4.2389889,4.2389889 0 0 1 5.991104,-5.99111 l 26.47954,26.46541 a 4.2389889,4.2389889 0 0 1 0,5.99111 l -26.47954,26.47955 a 4.2389889,4.2389889 0 0 1 -5.991104,-5.9911 l 23.483984,-23.484 z" style="stroke-width:1.41299629"/>
|
||||
<path id="path4-3" d="m 96.085398,898.14342 c 1.881045,0 3.385879,-3.57421 3.385879,-8.16963 0,-4.59543 -1.504834,-8.16964 -3.385879,-8.16964 -1.881044,0 -3.385879,3.57421 -3.385879,8.16964 0,4.59542 1.504835,8.16963 3.385879,8.16963 z" style="clip-rule:evenodd;fill:transparent;fill-opacity:1;fill-rule:evenodd;stroke-width:3.09913683"/>
|
||||
<path id="path6" d="m 193.12782,836.88644 c -4.59543,-4.85071 -25.53011,1.0212 -38.29517,8.93554 -9.95674,-5.10602 -21.95589,-8.16962 -34.72093,-8.16962 -13.02037,0 -25.01952,3.0636 -34.976266,8.16962 -12.765052,-7.91434 -33.95504,-14.04156 -38.295158,-8.93554 -4.595418,5.10602 3.318914,26.29601 12.765053,38.03987 0,0 0,0 0,0 -0.765903,3.0636 -1.276505,6.12722 -1.276505,9.44614 0,10.21204 4.340118,19.65818 11.743848,27.31721 h 42.124678 c -1.27651,-2.55301 0.51061,-4.08482 8.16963,-4.08482 7.65905,0.2553 9.19084,1.53181 8.16964,4.08482 h 42.12467 c 7.40374,-7.65903 11.74386,-17.36048 11.74386,-27.31721 0,-3.31892 -0.51061,-6.38254 -1.2765,-9.44614 8.93553,-11.74386 16.59456,-33.18914 11.99915,-38.03987 z m -97.014419,67.39949 c -8.935538,0 -16.339269,-7.40374 -16.339269,-16.33927 0,-8.93553 7.403731,-16.33927 16.339269,-16.33927 8.935529,0 16.339269,7.40374 16.339269,16.33927 0,8.93553 -7.40374,16.33927 -16.339269,16.33927 z m 47.996599,0 c -8.93553,0 -16.33926,-7.40374 -16.33926,-16.33927 0,-8.93553 7.40373,-16.33927 16.33926,-16.33927 8.93555,0 16.33927,7.40374 16.33927,16.33927 0,8.93553 -7.14842,16.33927 -16.33927,16.33927 z" style="clip-rule:evenodd;fill:transparent;fill-opacity:1;fill-rule:evenodd;stroke-width:2.55301046"/>
|
||||
<g id="g4541" style="fill:transparent;fill-opacity:1">
|
||||
<path style="clip-rule:evenodd;fill-rule:evenodd;stroke-width:2.55301046;fill:transparent;fill-opacity:1" id="path10" d="m 168.5072,903.26472 c 15.31805,-19.14757 46.72009,-28.33841 67.65477,-15.06276 -24.50889,-3.82951 -46.72009,2.55301 -67.65477,15.06276 z"/>
|
||||
<path style="clip-rule:evenodd;fill-rule:evenodd;stroke-width:2.55301046;fill:transparent;fill-opacity:1" id="path12" d="m 167.486,898.66931 c 8.68022,-20.42409 34.46564,-33.69975 55.14502,-26.55131 -21.70058,2.80831 -39.31636,11.23323 -55.14502,26.55131 z"/>
|
||||
<path style="clip-rule:evenodd;fill-rule:evenodd;stroke-width:2.55301046;fill:transparent;fill-opacity:1" id="path14" d="m 167.23069,908.62604 c 15.82867,-15.06275 50.80491,-20.16879 61.52756,-4.34011 -21.70059,-6.89313 -40.59288,-3.82953 -61.52756,4.34011 z"/>
|
||||
</g>
|
||||
<g id="g4536" style="fill:transparent;fill-opacity:1">
|
||||
<path style="clip-rule:evenodd;fill-rule:evenodd;stroke-width:2.55301046;fill:transparent;fill-opacity:1" id="path16" d="M 71.492797,903.26472 C 56.174733,884.11715 24.772703,874.92631 3.8380177,888.20196 28.346918,884.37245 50.55811,890.75497 71.492797,903.26472 Z"/>
|
||||
<path style="clip-rule:evenodd;fill-rule:evenodd;stroke-width:2.55301046;fill:transparent;fill-opacity:1" id="path18" d="M 72.514,898.66931 C 63.833764,878.24522 38.048358,864.96956 17.368973,872.118 c 21.70059,2.80831 39.316362,11.23323 55.145027,26.55131 z"/>
|
||||
<path style="clip-rule:evenodd;fill-rule:evenodd;stroke-width:2.55301046;fill:transparent;fill-opacity:1" id="path20" d="m 72.769301,908.62604 c -15.828665,-15.06275 -50.80491,-20.16879 -61.527553,-4.34011 21.70059,-6.89313 40.592868,-3.82953 61.527553,4.34011 z"/>
|
||||
</g>
|
||||
<path id="path8" d="m 52.600515,893.56329 c -6.382526,0 -11.743849,3.3189 -14.29686,8.42492 -0.255301,0 -0.510602,0 -0.765903,0 -6.893128,0 -12.765052,5.10602 -12.765052,11.48856 0,8.93553 9.190838,13.78625 17.615773,10.72264 5.10602,7.40373 16.083966,7.91434 20.168783,0 6.127225,-0.2553 16.083966,-1.2765 17.615773,-10.72264 1.021204,-6.38254 -5.616623,-11.48856 -12.765052,-11.48856 -0.255303,0 -0.510604,0 -0.765905,0 -2.042407,-5.10602 -7.659031,-8.42492 -14.041557,-8.42492 z m 134.798965,0 c 6.38252,0 11.74384,3.3189 14.29685,8.42492 0.2553,0 -2.80831,0 0.7659,0 3.57422,0 12.76506,5.10602 12.76506,11.48856 0,8.93553 -9.19084,13.78625 -17.61578,10.72264 -5.10602,7.40373 -16.08397,7.91434 -20.16878,0 -6.12722,-0.2553 -16.08397,-1.2765 -17.61576,-10.72264 -1.02122,-6.38254 9.19083,-11.48856 12.76504,-11.48856 3.57421,0 0.51061,0 0.7659,0 2.04242,-5.10602 7.65904,-8.42492 14.04157,-8.42492 z" style="clip-rule:evenodd;fill:transparent;fill-opacity:1;fill-rule:evenodd;stroke-width:2.55301046"/>
|
||||
<path id="path4-3-3" d="m 143.54212,898.14341 c 1.88105,0 3.38588,-3.57421 3.38588,-8.16963 0,-4.59543 -1.50483,-8.16964 -3.38588,-8.16964 -1.88104,0 -3.38588,3.57421 -3.38588,8.16964 0,4.59542 1.50484,8.16963 3.38588,8.16963 z" style="clip-rule:evenodd;fill:transparent;fill-opacity:1;fill-rule:evenodd;stroke-width:3.09913683"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 5.8 KiB |
@ -1,14 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:xlink="http://www.w3.org/1999/xlink" style="isolation:isolate" width="2.5rem" height="2.5rem" viewBox="-680 -1030 300 180">
|
||||
<g>
|
||||
<path d="M -430 -910 L -430 -910 C -424.481 -910 -420 -905.519 -420 -900 L -420 -900 C -420 -894.481 -424.481 -890 -430 -890 L -430 -890 C -435.519 -890 -440 -894.481 -440 -900 L -440 -900 C -440 -905.519 -435.519 -910 -430 -910 Z"></path>
|
||||
<path d=" M -570 -910 L -510 -910 C -504.481 -910 -500 -905.519 -500 -900 L -500 -900 C -500 -894.481 -504.481 -890 -510 -890 L -570 -890 C -575.519 -890 -580 -894.481 -580 -900 L -580 -900 C -580 -905.519 -575.519 -910 -570 -910 Z "></path>
|
||||
<path d="M -590 -970 L -590 -970 C -584.481 -970 -580 -965.519 -580 -960 L -580 -940 C -580 -934.481 -584.481 -930 -590 -930 L -590 -930 C -595.519 -930 -600 -934.481 -600 -940 L -600 -960 C -600 -965.519 -595.519 -970 -590 -970 Z"></path>
|
||||
<path d=" M -639.991 -960.515 C -639.72 -976.836 -626.385 -990 -610 -990 L -610 -990 C -602.32 -990 -595.31 -987.108 -590 -982.355 C -584.69 -987.108 -577.68 -990 -570 -990 L -570 -990 C -553.615 -990 -540.28 -976.836 -540.009 -960.515 C -540.001 -960.345 -540 -960.172 -540 -960 L -540 -960 L -540 -940 C -540 -934.481 -544.481 -930 -550 -930 L -550 -930 C -555.519 -930 -560 -934.481 -560 -940 L -560 -960 L -560 -960 C -560 -965.519 -564.481 -970 -570 -970 C -575.519 -970 -580 -965.519 -580 -960 L -580 -960 L -580 -960 L -580 -940 C -580 -934.481 -584.481 -930 -590 -930 L -590 -930 C -595.519 -930 -600 -934.481 -600 -940 L -600 -960 L -600 -960 L -600 -960 L -600 -960 L -600 -960 L -600 -960 L -600 -960 L -600 -960 C -600 -965.519 -604.481 -970 -610 -970 C -615.519 -970 -620 -965.519 -620 -960 L -620 -960 L -620 -940 C -620 -934.481 -624.481 -930 -630 -930 L -630 -930 C -635.519 -930 -640 -934.481 -640 -940 L -640 -960 L -640 -960 C -640 -960.172 -639.996 -960.344 -639.991 -960.515 Z "></path>
|
||||
<path d=" M -460 -930 L -460 -900 C -460 -894.481 -464.481 -890 -470 -890 L -470 -890 C -475.519 -890 -480 -894.481 -480 -900 L -480 -930 L -508.82 -930 C -514.99 -930 -520 -934.481 -520 -940 L -520 -940 C -520 -945.519 -514.99 -950 -508.82 -950 L -431.18 -950 C -425.01 -950 -420 -945.519 -420 -940 L -420 -940 C -420 -934.481 -425.01 -930 -431.18 -930 L -460 -930 Z "></path>
|
||||
<path d="M -470 -990 L -430 -990 C -424.481 -990 -420 -985.519 -420 -980 L -420 -980 C -420 -974.481 -424.481 -970 -430 -970 L -470 -970 C -475.519 -970 -480 -974.481 -480 -980 L -480 -980 C -480 -985.519 -475.519 -990 -470 -990 Z"></path>
|
||||
<path d=" M -630 -910 L -610 -910 C -604.481 -910 -600 -905.519 -600 -900 L -600 -900 C -600 -894.481 -604.481 -890 -610 -890 L -630 -890 C -635.519 -890 -640 -894.481 -640 -900 L -640 -900 C -640 -905.519 -635.519 -910 -630 -910 Z "></path>
|
||||
<path d=" M -515 -990 L -510 -990 C -504.481 -990 -500 -985.519 -500 -980 L -500 -980 C -500 -974.481 -504.481 -970 -510 -970 L -515 -970 C -520.519 -970 -525 -974.481 -525 -980 L -525 -980 C -525 -985.519 -520.519 -990 -515 -990 Z "></path>
|
||||
<path d=" M -660 -910 L -680 -910 L -680 -980 C -680 -1007.596 -657.596 -1030 -630 -1030 L -430 -1030 C -402.404 -1030 -380 -1007.596 -380 -980 L -380 -900 C -380 -872.404 -402.404 -850 -430 -850 L -630 -850 C -657.596 -850 -680 -872.404 -680 -900 L -680 -920 L -660 -920 L -660 -900 C -660 -883.443 -646.557 -870 -630 -870 L -430 -870 C -413.443 -870 -400 -883.443 -400 -900 L -400 -980 C -400 -996.557 -413.443 -1010 -430 -1010 L -630 -1010 C -646.557 -1010 -660 -996.557 -660 -980 L -660 -910 Z "></path>
|
||||
</g>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 3.5 KiB |
@ -1,5 +0,0 @@
|
||||
<svg role="img" viewBox="0 0 24 24" width="2.5rem" height="2.5rem"
|
||||
xmlns="http://www.w3.org/2000/svg">
|
||||
<title>Obsidian</title>
|
||||
<path d="M15.074 0C12.586 1.374 10.1 2.749 7.613 4.124l.823 4.266 6.365-5.015zm.172.059l-.269 3.314 4.497 2.752zm-.353 3.466L8.487 8.576l7.39 15.367 1.177-2.359L19.58 6.4c-.012-.009-4.688-2.875-4.688-2.875zm-7.425.779l-3.05 6.594L9.033 21.51l-.74-12.934-.012-.064zm1.025 4.688l.73 12.784L15.71 24Z"/>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 446 B |
173
src/layouts/Home.astro
Normal file
173
src/layouts/Home.astro
Normal file
@ -0,0 +1,173 @@
|
||||
---
|
||||
import "../styles/global.scss";
|
||||
|
||||
import Footer from "./imports/Footer.astro";
|
||||
|
||||
import Logo from "../components/icons/Logo.astro";
|
||||
import AccentBar from "../components/AccentBar.astro";
|
||||
|
||||
interface Props {
|
||||
title: string;
|
||||
description: string;
|
||||
}
|
||||
|
||||
const { title, description } = Astro.props;
|
||||
|
||||
const isVercelProd = import.meta.env.VERCEL_PROD;
|
||||
---
|
||||
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width" />
|
||||
|
||||
<meta name="generator" content={Astro.generator} />
|
||||
<meta name="description" content={description} />
|
||||
|
||||
<meta property="og:url" content="https://catppuccin.com" />
|
||||
<meta property="og:title" content={title} />
|
||||
<meta property="og:description" content={description} />
|
||||
<meta content="#CBA6F7" data-react-helmet="true" name="theme-color" />
|
||||
<meta property="og:image" content="/embed.png" />
|
||||
|
||||
<meta property="twitter:title" content={title} />
|
||||
<meta property="twitter:description" content={description} />
|
||||
<meta name="twitter:card" content="summary_large_image" />
|
||||
|
||||
<link rel="icon" type="image/svg+xml" href="/favicon.png" />
|
||||
|
||||
<title>{title}</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="hero">
|
||||
<div class="content-wrapper no-padding hero-grid">
|
||||
<div class="hero-content-wrapper">
|
||||
<div class="hero-logo">
|
||||
<Logo type="icon" height={4} />
|
||||
<Logo type="text" color="mauve" height={3} />
|
||||
</div>
|
||||
<slot name="hero-content" />
|
||||
</div>
|
||||
|
||||
<div class="hero-image">
|
||||
<slot name="hero-image" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<section class="footer-container">
|
||||
<div class="content-wrapper no-padding">
|
||||
<Footer />
|
||||
</div>
|
||||
<AccentBar />
|
||||
</section>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
{isVercelProd && <script defer data-domain="catppuccin.com" src="https://p.catppuccin.com/js/script.js" />}
|
||||
|
||||
<style lang="scss" is:global>
|
||||
|
||||
@use "../styles/utils";
|
||||
|
||||
#hero {
|
||||
background-color: color-mix(in srgb, var(--base), var(--mauve) 10%);
|
||||
background-image: linear-gradient(
|
||||
120deg,
|
||||
color-mix(in srgb, var(--base), var(--peach) 5%),
|
||||
color-mix(in srgb, var(--base), var(--mauve) 10%)
|
||||
);
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
background-color: color-mix(in srgb, var(--base), var(--mantle) 30%);
|
||||
background-image: none;
|
||||
}
|
||||
|
||||
+ .footer-container {
|
||||
margin-block-start: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.hero-logo {
|
||||
@include utils.flex($gap: var(--space-sm));
|
||||
align-items: center;
|
||||
|
||||
svg + svg {
|
||||
margin-block-start: 6px;
|
||||
}
|
||||
}
|
||||
|
||||
.hero-grid {
|
||||
@include utils.flex($direction: column, $gap: var(--space-lg));
|
||||
justify-content: space-between;
|
||||
flex-wrap: nowrap;
|
||||
|
||||
min-height: 100svh;
|
||||
|
||||
@media (min-width: 800px) {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
|
||||
padding-block: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.hero-content-wrapper {
|
||||
display: grid;
|
||||
grid-template-rows: max-content auto;
|
||||
gap: var(--space-xl);
|
||||
container-type: inline-size;
|
||||
|
||||
padding-block: var(--padding-body);
|
||||
}
|
||||
|
||||
.hero-content {
|
||||
@include utils.flex($direction: column, $gap: var(--space-md));
|
||||
justify-content: center;
|
||||
align-items: flex-start;
|
||||
|
||||
line-height: 1.1;
|
||||
|
||||
h1 {
|
||||
margin: 0;
|
||||
padding-block: 6px;
|
||||
|
||||
background-image: linear-gradient(120deg, var(--peach), var(--mauve));
|
||||
background-clip: text;
|
||||
|
||||
font-size: clamp(4rem, 4vw, 6rem);
|
||||
color: transparent;
|
||||
}
|
||||
|
||||
p {
|
||||
line-height: 1.5;
|
||||
}
|
||||
}
|
||||
|
||||
.hero-image {
|
||||
display: grid;
|
||||
place-items: center;
|
||||
container-type: inline-size;
|
||||
|
||||
max-height: 40vh;
|
||||
|
||||
svg {
|
||||
padding: var(--space-md);
|
||||
}
|
||||
|
||||
@media (min-width: 800px) {
|
||||
max-height: 100vh;
|
||||
|
||||
svg {
|
||||
@container (min-width: 400px) {
|
||||
padding-inline-start: var(--space-lg);
|
||||
}
|
||||
|
||||
@container (min-width: 500px) {
|
||||
padding-inline-start: var(--space-xl);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
64
src/layouts/Layout.astro
Normal file
64
src/layouts/Layout.astro
Normal file
@ -0,0 +1,64 @@
|
||||
---
|
||||
import "../styles/global.scss";
|
||||
|
||||
import Header from "./imports/Header.astro";
|
||||
import Footer from "./imports/Footer.astro";
|
||||
|
||||
import AccentBar from "../components/AccentBar.astro";
|
||||
|
||||
interface Props {
|
||||
title: string;
|
||||
description: string;
|
||||
}
|
||||
|
||||
const { title, description } = Astro.props;
|
||||
|
||||
const isVercelProd = import.meta.env.VERCEL_PROD;
|
||||
---
|
||||
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width" />
|
||||
|
||||
<meta name="generator" content={Astro.generator} />
|
||||
<meta name="description" content={description} />
|
||||
|
||||
<meta property="og:url" content="https://catppuccin.com" />
|
||||
<meta property="og:title" content={title} />
|
||||
<meta property="og:description" content={description} />
|
||||
<meta content="#CBA6F7" data-react-helmet="true" name="theme-color" />
|
||||
<meta property="og:image" content="/embed.png" />
|
||||
|
||||
<meta property="twitter:title" content={title} />
|
||||
<meta property="twitter:description" content={description} />
|
||||
<meta name="twitter:card" content="summary_large_image" />
|
||||
|
||||
<link rel="icon" type="image/svg+xml" href="/favicon.png" />
|
||||
|
||||
<title>{title}</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="toasts"></div>
|
||||
|
||||
<section class="header-container">
|
||||
<div class="content-wrapper no-padding">
|
||||
<Header />
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<div class="content-wrapper">
|
||||
<slot />
|
||||
</div>
|
||||
|
||||
<section class="footer-container">
|
||||
<div class="content-wrapper no-padding">
|
||||
<Footer />
|
||||
</div>
|
||||
<AccentBar />
|
||||
</section>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
{isVercelProd && <script defer data-domain="catppuccin.com" src="https://p.catppuccin.com/js/script.js" />}
|
||||
75
src/layouts/imports/Footer.astro
Normal file
75
src/layouts/imports/Footer.astro
Normal file
File diff suppressed because one or more lines are too long
92
src/layouts/imports/Header.astro
Normal file
92
src/layouts/imports/Header.astro
Normal file
@ -0,0 +1,92 @@
|
||||
---
|
||||
import Logo from "../../components/icons/Logo.astro";
|
||||
|
||||
import { header as navLinkList } from "../../contents/navigation";
|
||||
---
|
||||
|
||||
<header>
|
||||
<nav id="main-navigation">
|
||||
<a href="/" class="nav-logo" aria-label="Home">
|
||||
<Logo type="icon" color="mauve" height={4} />
|
||||
</a>
|
||||
|
||||
<ul>
|
||||
{
|
||||
navLinkList.map(({ title, target, accent }) => (
|
||||
<li>
|
||||
<a href={target} style={`--accent-colour: var(--${accent});`} class="nav-link">
|
||||
{title}
|
||||
</a>
|
||||
</li>
|
||||
))
|
||||
}
|
||||
</ul>
|
||||
</nav>
|
||||
</header>
|
||||
|
||||
<style>
|
||||
header {
|
||||
--spacing-nav: var(--space-sm);
|
||||
}
|
||||
|
||||
#main-navigation {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: var(--spacing-nav);
|
||||
}
|
||||
|
||||
.nav-logo {
|
||||
width: 4rem;
|
||||
height: 4rem;
|
||||
}
|
||||
|
||||
ul {
|
||||
display: flex;
|
||||
gap: var(--spacing-nav);
|
||||
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
|
||||
list-style: none;
|
||||
|
||||
li {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.nav-link {
|
||||
--__accent-colour: var(--accent-colour, var(--mauve));
|
||||
|
||||
position: relative;
|
||||
|
||||
font-size: 1.6rem;
|
||||
font-weight: 600;
|
||||
color: var(--text);
|
||||
|
||||
&::after {
|
||||
content: "";
|
||||
|
||||
transition: transform 200ms ease-in-out;
|
||||
transition-delay: 200ms;
|
||||
|
||||
position: absolute;
|
||||
bottom: -6px;
|
||||
left: 0;
|
||||
transform: scaleX(0);
|
||||
transform-origin: top right;
|
||||
|
||||
width: 20px;
|
||||
height: 3px;
|
||||
|
||||
background: var(--__accent-colour);
|
||||
}
|
||||
|
||||
&:hover&::after {
|
||||
transition-delay: 10ms;
|
||||
|
||||
transform: scaleX(1);
|
||||
transform-origin: top left;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
9
src/lib/colorFormat.ts
Normal file
9
src/lib/colorFormat.ts
Normal file
@ -0,0 +1,9 @@
|
||||
import type { ColorFormat } from "@catppuccin/palette";
|
||||
|
||||
export function toRgb(rgb: ColorFormat["rgb"]) {
|
||||
return `rgb(${rgb.r}, ${rgb.g}, ${rgb.b})`;
|
||||
}
|
||||
|
||||
export function toHsl(hsl: ColorFormat["hsl"]) {
|
||||
return `hsl(${Math.round(hsl.h)}deg, ${Math.round(hsl.s * 100)}%, ${Math.round(hsl.l * 100)}%)`;
|
||||
}
|
||||
@ -1,161 +0,0 @@
|
||||
import {
|
||||
SiGithub,
|
||||
SiDuckduckgo,
|
||||
SiNeovim,
|
||||
SiVim,
|
||||
SiDiscord,
|
||||
SiAlacritty,
|
||||
SiIterm2,
|
||||
SiLastdotfm,
|
||||
SiAnilist,
|
||||
SiSteam,
|
||||
SiSpotify,
|
||||
SiXcode,
|
||||
SiVisualstudiocode,
|
||||
SiJoplin,
|
||||
SiWindows,
|
||||
SiTailwindcss,
|
||||
SiAlfred,
|
||||
SiThunderbird,
|
||||
SiHyper,
|
||||
SiDarkreader,
|
||||
SiYoutube,
|
||||
SiReddit,
|
||||
SiGooglechrome,
|
||||
SiJetbrains,
|
||||
SiKde,
|
||||
SiTelegram,
|
||||
SiFirefoxbrowser,
|
||||
SiSublimetext,
|
||||
SiWindowsterminal,
|
||||
SiTmux,
|
||||
SiGnuemacs,
|
||||
SiInsomnia,
|
||||
} from "react-icons/si";
|
||||
import { FiCode } from "react-icons/fi";
|
||||
import MonkeyType from "../icons/monkeytype.svg";
|
||||
import GnomeTerminal from "../icons/gnometerminal.svg";
|
||||
import Obsidian from "../icons/obsidian.svg";
|
||||
import GTK from "../icons/gtk.svg";
|
||||
import Kitty from "../icons/kitty.svg";
|
||||
|
||||
type SlugToIcon = {
|
||||
[key: string]: JSX.Element;
|
||||
};
|
||||
|
||||
const slugToIcon: SlugToIcon = {
|
||||
github: SiGithub({
|
||||
size: "2.5rem",
|
||||
}),
|
||||
"github-readme-stats": SiGithub({
|
||||
size: "2.5rem",
|
||||
}),
|
||||
duckduckgo: SiDuckduckgo({
|
||||
size: "2.5rem",
|
||||
}),
|
||||
nvim: SiNeovim({
|
||||
size: "2.5rem",
|
||||
}),
|
||||
discord: SiDiscord({
|
||||
size: "2.5rem",
|
||||
}),
|
||||
vim: SiVim({
|
||||
size: "2.5rem",
|
||||
}),
|
||||
alacritty: SiAlacritty({
|
||||
size: "2.5rem",
|
||||
}),
|
||||
"gnome-terminal": GnomeTerminal(),
|
||||
iterm: SiIterm2({
|
||||
size: "2.5rem",
|
||||
}),
|
||||
lastfm: SiLastdotfm({
|
||||
size: "2.5rem",
|
||||
}),
|
||||
anilist: SiAnilist({
|
||||
size: "2.5rem",
|
||||
}),
|
||||
steam: SiSteam({
|
||||
size: "2.5rem",
|
||||
}),
|
||||
spicetify: SiSpotify({
|
||||
size: "2.5rem",
|
||||
}),
|
||||
"spotify-player": SiSpotify({
|
||||
size: "2.5rem",
|
||||
}),
|
||||
"spotify-tui": SiSpotify({
|
||||
size: "2.5rem",
|
||||
}),
|
||||
xcode: SiXcode({
|
||||
size: "2.5rem",
|
||||
}),
|
||||
vscode: SiVisualstudiocode({
|
||||
size: "2.5rem",
|
||||
}),
|
||||
joplin: SiJoplin({
|
||||
size: "2.5rem",
|
||||
}),
|
||||
"windows-files": SiWindows({
|
||||
size: "2.5rem",
|
||||
}),
|
||||
tailwindcss: SiTailwindcss({
|
||||
size: "2.5rem",
|
||||
}),
|
||||
alfred: SiAlfred({
|
||||
size: "2.5rem",
|
||||
}),
|
||||
thunderbird: SiThunderbird({
|
||||
size: "2.5rem",
|
||||
}),
|
||||
hyper: SiHyper({
|
||||
size: "2.5rem",
|
||||
}),
|
||||
"dark-reader": SiDarkreader({
|
||||
size: "2.5rem",
|
||||
}),
|
||||
youtube: SiYoutube({
|
||||
size: "2.5rem",
|
||||
}),
|
||||
libreddit: SiReddit({
|
||||
size: "2.5rem",
|
||||
}),
|
||||
chrome: SiGooglechrome({
|
||||
size: "2.5rem",
|
||||
}),
|
||||
jetbrains: SiJetbrains({
|
||||
size: "2.5rem",
|
||||
}),
|
||||
kde: SiKde({
|
||||
size: "2.5rem",
|
||||
}),
|
||||
telegram: SiTelegram({
|
||||
size: "2.5rem",
|
||||
}),
|
||||
firefox: SiFirefoxbrowser({
|
||||
size: "2.5rem",
|
||||
}),
|
||||
"sublime-text": SiSublimetext({
|
||||
size: "2.5rem",
|
||||
}),
|
||||
"windows-terminal": SiWindowsterminal({
|
||||
size: "2.5rem",
|
||||
}),
|
||||
tmux: SiTmux({
|
||||
size: "2.5rem",
|
||||
}),
|
||||
monkeytype: MonkeyType(),
|
||||
emacs: SiGnuemacs({
|
||||
size: "2.5rem",
|
||||
}),
|
||||
obsidian: Obsidian(),
|
||||
gtk: GTK(),
|
||||
insomnia: SiInsomnia({
|
||||
size: "2.5rem",
|
||||
}),
|
||||
kitty: Kitty(),
|
||||
};
|
||||
|
||||
export default function getIcon(slug: string) {
|
||||
return slugToIcon[slug] || FiCode({ size: "2.5rem" });
|
||||
}
|
||||
@ -1,50 +0,0 @@
|
||||
type SlugToColor = {
|
||||
[key: string]: string;
|
||||
};
|
||||
|
||||
const slugToIcon: SlugToColor = {
|
||||
github: "text",
|
||||
"github-readme-stats": "text",
|
||||
duckduckgo: "peach",
|
||||
nvim: "green",
|
||||
discord: "blue",
|
||||
vim: "green",
|
||||
alacritty: "peach",
|
||||
"gnome-terminal": "text",
|
||||
iterm: "green",
|
||||
"last.fm": "red",
|
||||
anilist: "blue",
|
||||
steam: "blue",
|
||||
spicetify: "green",
|
||||
"spotify-player": "green",
|
||||
"spotify-tui": "green",
|
||||
xcode: "blue",
|
||||
vscode: "blue",
|
||||
joplin: "blue",
|
||||
"windows-files": "yellow",
|
||||
tailwindcss: "sky",
|
||||
alfred: "mauve",
|
||||
thunderbird: "blue",
|
||||
hyper: "text",
|
||||
"dark-reader": "red",
|
||||
youtube: "red",
|
||||
libreddit: "cyan",
|
||||
chrome: "yellow",
|
||||
jetbrains: "text",
|
||||
kde: "blue",
|
||||
telegram: "blue",
|
||||
firefox: "red",
|
||||
"sublime-text": "yellow",
|
||||
"windows-terminal": "text",
|
||||
tmux: "green",
|
||||
monkeytype: "text",
|
||||
emacs: "blue",
|
||||
obsidian: "mauve",
|
||||
gtk: "green",
|
||||
lastfm: "red",
|
||||
insomnia: "blue",
|
||||
};
|
||||
|
||||
export default function getIconColor(slug: string) {
|
||||
return slugToIcon[slug] || "text";
|
||||
}
|
||||
@ -1,27 +0,0 @@
|
||||
import { Octokit } from "@octokit/rest";
|
||||
|
||||
const octokit = new Octokit();
|
||||
|
||||
export default async function GetPorts() {
|
||||
return octokit
|
||||
.paginate(octokit.rest.repos.listForOrg, {
|
||||
org: "catppuccin",
|
||||
type: "public",
|
||||
})
|
||||
.then((data) => {
|
||||
return data
|
||||
.filter(({ topics = [] }) => {
|
||||
return !topics.includes("catppuccin-meta");
|
||||
})
|
||||
.sort(({ stargazers_count: a }, { stargazers_count: b }) => {
|
||||
if (b !== undefined && a !== undefined) {
|
||||
return b - a;
|
||||
} else {
|
||||
return 0;
|
||||
}
|
||||
});
|
||||
})
|
||||
.catch((err) => {
|
||||
return err;
|
||||
});
|
||||
}
|
||||
28
src/lib/icon.ts
Normal file
28
src/lib/icon.ts
Normal file
@ -0,0 +1,28 @@
|
||||
import * as icons from "simple-icons";
|
||||
import { ports } from "./ports";
|
||||
|
||||
export function getIcon(slug: string) {
|
||||
const port = Object.values(ports).find(({ name }) => name === slug);
|
||||
if (!port) {
|
||||
throw new TypeError(`port '${slug}' not found`);
|
||||
}
|
||||
|
||||
if (port.icon && !port.icon.endsWith(".svg")) {
|
||||
const siKey = `si${port.icon[0].toUpperCase()}${port.icon.substring(1)}`;
|
||||
const si = icons[siKey as keyof typeof icons];
|
||||
|
||||
if (!si) {
|
||||
throw new TypeError(`Icon did not exist for port: ${JSON.stringify(port, undefined, 2)}`);
|
||||
}
|
||||
|
||||
return {
|
||||
path: si.path,
|
||||
viewbox: "0 0 24 24",
|
||||
};
|
||||
}
|
||||
|
||||
return {
|
||||
path: "M223.68,66.15,135.68,18a15.88,15.88,0,0,0-15.36,0l-88,48.17a16,16,0,0,0-8.32,14v95.64a16,16,0,0,0,8.32,14l88,48.17a15.88,15.88,0,0,0,15.36,0l88-48.17a16,16,0,0,0,8.32-14V80.18A16,16,0,0,0,223.68,66.15ZM128,120,47.65,76,128,32l80.35,44Zm8,99.64V133.83l80-43.78v85.76Z",
|
||||
viewbox: "0 0 256 256",
|
||||
};
|
||||
}
|
||||
@ -1,22 +0,0 @@
|
||||
import { unified } from "unified";
|
||||
import remarkParse from "remark-parse";
|
||||
import remarkRehype from "remark-rehype";
|
||||
import rehypeSanitize from "rehype-sanitize";
|
||||
import rehypeStringify from "rehype-stringify";
|
||||
import rehypeExternalLinks from "rehype-external-links";
|
||||
import rehypeHighlight from "rehype-highlight";
|
||||
|
||||
export default async function markdownToHtml(
|
||||
markdown: string,
|
||||
options: { allowHtml?: boolean } = {}
|
||||
) {
|
||||
const result = await unified()
|
||||
.use(remarkParse)
|
||||
.use(remarkRehype, { allowDangerousHtml: options.allowHtml })
|
||||
.use(options.allowHtml ? () => {} : rehypeSanitize)
|
||||
.use(rehypeExternalLinks, { rel: ["nofollow"] })
|
||||
.use(rehypeHighlight)
|
||||
.use(rehypeStringify, { allowDangerousHtml: options.allowHtml })
|
||||
.process(markdown);
|
||||
return result.toString();
|
||||
}
|
||||
56
src/lib/ports.ts
Normal file
56
src/lib/ports.ts
Normal file
@ -0,0 +1,56 @@
|
||||
import type { ColorName } from "@catppuccin/palette";
|
||||
import { parse } from "yaml";
|
||||
|
||||
export type Category = {
|
||||
key: string;
|
||||
name: string;
|
||||
description: string;
|
||||
emoji: string;
|
||||
};
|
||||
|
||||
type Platform = "android" | "windows" | "ios" | "linux" | "macos";
|
||||
|
||||
type Link = {
|
||||
name: string;
|
||||
color: string;
|
||||
icon: string;
|
||||
url: string;
|
||||
};
|
||||
|
||||
export type Port = {
|
||||
categories: string[];
|
||||
name: string;
|
||||
platform: Platform[];
|
||||
color: ColorName;
|
||||
icon?: string;
|
||||
alias?: string;
|
||||
url?: string;
|
||||
links?: Link[];
|
||||
upstreamed?: boolean;
|
||||
};
|
||||
|
||||
export type Userstyle = {
|
||||
name: string;
|
||||
categories: string[];
|
||||
color: ColorName;
|
||||
icon?: string;
|
||||
readme: Record<string, unknown>;
|
||||
};
|
||||
|
||||
export const portsYml = (await fetch("https://github.com/catppuccin/catppuccin/raw/main/resources/ports.yml")
|
||||
.then((r) => r.text())
|
||||
.then((t) => parse(t))) as {
|
||||
ports: Record<string, Port>;
|
||||
categories: Array<Category>;
|
||||
};
|
||||
|
||||
export const userstylesYml = (await fetch("https://github.com/catppuccin/userstyles/raw/main/scripts/userstyles.yml")
|
||||
.then((r) => r.text())
|
||||
.then((t) => parse(t))) as {
|
||||
collaborators: Array<{ url: string; name?: string }>;
|
||||
userstyles: Record<string, Port>;
|
||||
};
|
||||
|
||||
export const ports = { ...portsYml.ports, ...userstylesYml.userstyles } as Record<string, Port | Userstyle>;
|
||||
|
||||
export const { categories } = portsYml;
|
||||
@ -1,64 +0,0 @@
|
||||
import "../styles/globals.css";
|
||||
import type { AppType } from "next/dist/shared/lib/utils";
|
||||
import Head from "next/head";
|
||||
|
||||
const MyApp: AppType = ({ Component, pageProps }) => {
|
||||
return (
|
||||
<>
|
||||
<Head>
|
||||
<meta
|
||||
name="viewport"
|
||||
content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0"
|
||||
/>
|
||||
<link rel="shortcut icon" href="favicon.ico" />
|
||||
<link
|
||||
rel="icon"
|
||||
type="image/x-icon"
|
||||
sizes="16x16 32x32"
|
||||
href="favicon.ico"
|
||||
/>
|
||||
<link
|
||||
rel="apple-touch-icon"
|
||||
sizes="152x152"
|
||||
href="favicon-152-precomposed.png"
|
||||
/>
|
||||
<link
|
||||
rel="apple-touch-icon"
|
||||
sizes="144x144"
|
||||
href="favicon-144-precomposed.png"
|
||||
/>
|
||||
<link
|
||||
rel="apple-touch-icon"
|
||||
sizes="120x120"
|
||||
href="favicon-120-precomposed.png"
|
||||
/>
|
||||
<link
|
||||
rel="apple-touch-icon"
|
||||
sizes="114x114"
|
||||
href="favicon-114-precomposed.png"
|
||||
/>
|
||||
<link
|
||||
rel="apple-touch-icon"
|
||||
sizes="180x180"
|
||||
href="favicon-180-precomposed.png"
|
||||
/>
|
||||
<link
|
||||
rel="apple-touch-icon"
|
||||
sizes="72x72"
|
||||
href="favicon-72-precomposed.png"
|
||||
/>
|
||||
<link rel="apple-touch-icon" sizes="57x57" href="favicon-57.png" />
|
||||
<link rel="icon" sizes="32x32" href="favicon-32.png" />
|
||||
<meta name="msapplication-TileColor" content="#1e1e2e" />
|
||||
<meta name="msapplication-TileImage" content="favicon-144.png" />
|
||||
<meta name="theme-color" content="#ffffff" />
|
||||
<link rel="manifest" href="manifest.json" />
|
||||
<link rel="icon" sizes="192x192" href="favicon-192.png" />
|
||||
</Head>
|
||||
<Component {...pageProps} />
|
||||
</>
|
||||
)
|
||||
;
|
||||
};
|
||||
|
||||
export default MyApp;
|
||||
88
src/pages/community.astro
Normal file
88
src/pages/community.astro
Normal file
@ -0,0 +1,88 @@
|
||||
---
|
||||
import Layout from "../layouts/Layout.astro";
|
||||
|
||||
import PageIntro from "../components/PageIntro.astro";
|
||||
import Callout from "../components/cards/Callout.astro";
|
||||
import GitHubUsers from "../components/lists/GitHubUsers.astro";
|
||||
import TeamName from "../components/TeamName.astro";
|
||||
import Link from "../components/Link.astro";
|
||||
---
|
||||
|
||||
<Layout
|
||||
title="Community • Catppuccin"
|
||||
description="View the Catppuccin community! Learn about our teams, their roles, and how every contributor, including you, is at the heart of our project.">
|
||||
<PageIntro title="Community">
|
||||
<p>
|
||||
Catppuccin is not led by one person, 4 main teams are responsible for various different aspects of the project.
|
||||
</p>
|
||||
<p>
|
||||
<strong>And of course you!</strong> Whether you maintain your own port; have contributed via a pull request; or raised
|
||||
an issue. The community is at the heart and soul of Catppuccin.
|
||||
</p>
|
||||
</PageIntro>
|
||||
|
||||
<section>
|
||||
<h2>Teams</h2>
|
||||
|
||||
<h3><TeamName team="core">Core</TeamName></h3>
|
||||
<p>
|
||||
Owners of the GitHub organisation. <strong>Responsible for org-wide matters.</strong>
|
||||
</p>
|
||||
<GitHubUsers
|
||||
users={[
|
||||
{ userName: "pocco81", displayName: "Pocco" },
|
||||
{ userName: "andreasgrafen", displayName: "Lemon" },
|
||||
{ userName: "sgoudham", displayName: "Hammy" },
|
||||
]}
|
||||
/>
|
||||
|
||||
<h3><TeamName team="staff">Staff</TeamName></h3>
|
||||
<p>
|
||||
Maintainers of all GitHub repositories.
|
||||
<strong>Responsible for assisting core maintainers in their activities.</strong>
|
||||
</p>
|
||||
<GitHubUsers
|
||||
users={[
|
||||
{ userName: "ghostx31", displayName: "Spooky" },
|
||||
{ userName: "taka0o", displayName: "Taka" },
|
||||
{ userName: "isabelincorp", displayName: "Isabel" },
|
||||
{ userName: "backwardspy", displayName: "pigeon" },
|
||||
{ userName: "nullishamy", displayName: "Amy" },
|
||||
]}
|
||||
/>
|
||||
|
||||
<h3><TeamName team="userstyles">userstyles Staff</TeamName></h3>
|
||||
<p>
|
||||
Overseers of all userstyles in
|
||||
<Link href="https://github.com/catppuccin/userstyles" external>catppuccin/userstyles</Link>.
|
||||
<strong>Responsible for all matters regarding userstyles.</strong>
|
||||
</p>
|
||||
<GitHubUsers users={[{ userName: "isabelroses", displayName: "Bell" }]} />
|
||||
|
||||
<h3><TeamName team="mod">Moderator</TeamName></h3>
|
||||
<p>
|
||||
Moderators of the Discord server.
|
||||
<strong>Responsible for moderating the community.</strong>
|
||||
</p>
|
||||
<GitHubUsers users={[{ userName: "nyxkrage", displayName: "Nyx" }]} />
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<h2>Maintainers</h2>
|
||||
<p>GitHub maintainers of ports.</p>
|
||||
<Callout type="info">
|
||||
Coming Soon™, waiting for
|
||||
<Link href="https://github.com/catppuccin/catppuccin/pull/2315" external>catppuccin/catppuccin#2315</Link>
|
||||
to be merged.
|
||||
</Callout>
|
||||
</section>
|
||||
</Layout>
|
||||
|
||||
<style lang="scss">
|
||||
:root {
|
||||
--accent-color: var(--green);
|
||||
}
|
||||
h3 {
|
||||
margin-top: var(--space-sm);
|
||||
}
|
||||
</style>
|
||||
47
src/pages/index.astro
Normal file
47
src/pages/index.astro
Normal file
@ -0,0 +1,47 @@
|
||||
---
|
||||
import Home from "../layouts/Home.astro";
|
||||
|
||||
import Illustration from "../components/LaptopIllustration.astro";
|
||||
import PhosphorIcon from "../components/icons/Phosphor.astro";
|
||||
---
|
||||
|
||||
<Home
|
||||
title="Catppuccin"
|
||||
description="A soothing pastel theme for the high-spirited! We are a community-driven color scheme, perfect for coding, designing, and more. Explore our color palettes, discover our wide range of ports, and view our vibrant community.">
|
||||
<div slot="hero-content" class="hero-content">
|
||||
<h1>Soothing pastel theme for the <nobr>high-spirited!</nobr></h1>
|
||||
<p>A community-driven color scheme meant for coding, designing, and much more!</p>
|
||||
<div class="btn-group">
|
||||
<a href="/ports">
|
||||
<button class="btn btn-has-icon btn-peach">
|
||||
<PhosphorIcon icon="box" />
|
||||
Discover Ports
|
||||
</button>
|
||||
</a>
|
||||
<a href="/palette">
|
||||
<button class="btn btn-has-icon btn-mauve">
|
||||
<PhosphorIcon icon="palette" />
|
||||
Explore Colors
|
||||
</button>
|
||||
</a>
|
||||
<a href="/community">
|
||||
<button class="btn btn-has-icon btn-green">
|
||||
<PhosphorIcon icon="people" />
|
||||
View Community
|
||||
</button>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<Illustration slot="hero-image" />
|
||||
</Home>
|
||||
|
||||
<style lang="scss">
|
||||
:root {
|
||||
--accent-color: var(--rosewater);
|
||||
}
|
||||
|
||||
h2 {
|
||||
color: var(--accent-color);
|
||||
}
|
||||
</style>
|
||||
@ -1,63 +0,0 @@
|
||||
import fs from "fs";
|
||||
import Layout from "../components/Layout";
|
||||
import markdownToHtml from "../lib/markdownToHtml";
|
||||
|
||||
export default function Home({ content }: { content: string }): JSX.Element {
|
||||
return (
|
||||
<Layout>
|
||||
<div className="font-inter">
|
||||
<div className="max-w-3xl mx-auto p-4">
|
||||
<div className="gap-6 flex flex-col pb-8">
|
||||
<h1 className="font-bold text-xl text-center">Catppuccin</h1>
|
||||
<img
|
||||
className="mx-auto"
|
||||
src="https://raw.githubusercontent.com/catppuccin/catppuccin/main/assets/palette/macchiato.png"
|
||||
width="400"
|
||||
alt="Macchiato Palette"
|
||||
/>
|
||||
<div className="flex flex-col items-center md:flex-row justify-between gap-2">
|
||||
<a href="https://github.com/catppuccin/catppuccin/stargazers">
|
||||
<img
|
||||
alt="Stargazers"
|
||||
src="https://img.shields.io/github/stars/catppuccin?style=for-the-badge&logo=starship&color=C9CBFF&logoColor=D9E0EE&labelColor=302D41"
|
||||
/>
|
||||
</a>
|
||||
<a href="https://github.com/catppuccin/catppuccin/releases/latest">
|
||||
<img
|
||||
alt="Releases"
|
||||
src="https://img.shields.io/github/release/catppuccin/catppuccin.svg?style=for-the-badge&logo=github&color=F2CDCD&logoColor=D9E0EE&labelColor=302D41"
|
||||
/>
|
||||
</a>
|
||||
<a href="https://github.com/catppuccin/catppuccin/issues">
|
||||
<img
|
||||
alt="Issues"
|
||||
src="https://img.shields.io/github/issues/catppuccin/catppuccin?style=for-the-badge&logo=gitbook&color=B5E8E0&logoColor=D9E0EE&labelColor=302D41"
|
||||
/>
|
||||
</a>
|
||||
<a href="https://discord.catppuccin.com">
|
||||
<img
|
||||
alt="Discord"
|
||||
src="https://img.shields.io/discord/907385605422448742?style=for-the-badge&logo=discord&color=DDB6F2&logoColor=D9E0EE&labelColor=302D41"
|
||||
/>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
className="prose lg:prose-lg"
|
||||
dangerouslySetInnerHTML={{ __html: content }}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</Layout>
|
||||
);
|
||||
}
|
||||
|
||||
export const getStaticProps = async () => {
|
||||
const markdown = fs.readFileSync("src/content/main.md", "utf8");
|
||||
const content = await markdownToHtml(markdown, { allowHtml: true });
|
||||
return {
|
||||
props: {
|
||||
content,
|
||||
},
|
||||
};
|
||||
};
|
||||
45
src/pages/licensing.astro
Normal file
45
src/pages/licensing.astro
Normal file
@ -0,0 +1,45 @@
|
||||
---
|
||||
import Layout from "../layouts/Layout.astro";
|
||||
|
||||
import Link from "../components/Link.astro";
|
||||
---
|
||||
|
||||
<Layout title="Licensing • Catppuccin" description="General licensing information.">
|
||||
<section class="website">
|
||||
<h2>The Website</h2>
|
||||
<h3>MIT License</h3>
|
||||
<p><b>Copyright (c) {new Date(Date.now()).getFullYear()} Catppuccin</b></p>
|
||||
<p>
|
||||
Permission is hereby granted, free of charge, to any person obtaining a copy of this website and associated
|
||||
documentation files (the "Website"), to deal in the Website without restriction, including without limitation the
|
||||
rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Website, and to
|
||||
permit persons to whom the Website is furnished to do so, subject to the following conditions:
|
||||
</p>
|
||||
<p>
|
||||
The above copyright notice and this permission notice shall be included in all copies or substantial portions of
|
||||
the Website.
|
||||
</p>
|
||||
<p>
|
||||
The Website is provided »<b>as is</b>«, without warranty of any kind, express or implied, including but not
|
||||
limited to the warranties of merchantability, fitness for a particular purpose and noninfringement. In no event
|
||||
shall the authors or copyright holders be liable for any claim, damages or other liability, whether in an action
|
||||
of contract, tort or otherwise, araising from, out of or in connection with the Website or the use or other
|
||||
dealings in the Website.
|
||||
</p>
|
||||
</section>
|
||||
|
||||
<section class="illustration">
|
||||
<h2>The Illustration</h2>
|
||||
<p>
|
||||
The homepage illustration is designed by <Link href="https://www.freepik.com/author/fullvector" external
|
||||
>fullvector</Link
|
||||
> on <Link href="https://www.freepik.com" external>freepik</Link> and has been modified for this website.
|
||||
</p>
|
||||
</section>
|
||||
</Layout>
|
||||
|
||||
<style lang="scss">
|
||||
:root {
|
||||
--accent-color: var(--green);
|
||||
}
|
||||
</style>
|
||||
198
src/pages/palette.astro
Normal file
198
src/pages/palette.astro
Normal file
@ -0,0 +1,198 @@
|
||||
---
|
||||
import Layout from "../layouts/Layout.astro";
|
||||
|
||||
import Link from "../components/Link.astro";
|
||||
import PageIntro from "../components/PageIntro.astro";
|
||||
import PhosphorIcon from "../components/icons/Phosphor.astro";
|
||||
import FlavorName from "../components/FlavorName.astro";
|
||||
|
||||
import { links } from "../contents/links";
|
||||
|
||||
import { flavorEntries } from "@catppuccin/palette";
|
||||
import { toRgb, toHsl } from "../lib/colorFormat";
|
||||
---
|
||||
|
||||
<Layout
|
||||
title="Palette • Catppuccin"
|
||||
description="Dive into Catppuccin's palette: four unique pastel color palettes named 'flavors'. Ideal for your next project!">
|
||||
<PageIntro title="Palette">
|
||||
<p>
|
||||
Catppuccin consists of 4 beautiful pastel color palettes, named <strong>flavors</strong>. The theme comes in one
|
||||
light and three dark variants:
|
||||
<ul>
|
||||
<li>
|
||||
<FlavorName flavor="latte" />: Our lightest theme harmoniously inverting the essence of Catppuccin's dark
|
||||
themes.
|
||||
</li>
|
||||
<li>
|
||||
<FlavorName flavor="frappe" />: A less vibrant alternative using subdued colors for a muted aesthetic.
|
||||
</li>
|
||||
<li>
|
||||
<FlavorName flavor="macchiato" />: Medium contrast with gentle colors creating a soothing atmosphere.
|
||||
</li>
|
||||
<li>
|
||||
<FlavorName flavor="mocha" />: The Original — Our darkest variant offering a cozy feeling with color-rich
|
||||
accents.
|
||||
</li>
|
||||
</ul>
|
||||
<p>
|
||||
If you'd like to use them for your own project, refer to our
|
||||
<Link href=`${links.github}/catppuccin/blob/main/docs/style-guide.md` external>style guide</Link>
|
||||
for general use cases and guidelines. Additionally, you can find integrations with popular frameworks and tools in
|
||||
<Link href=`${links.github}/palette` external>catppuccin/palette</Link>.
|
||||
</p>
|
||||
</p>
|
||||
|
||||
<section class="flavor-grid">
|
||||
{
|
||||
flavorEntries.map(([flavorName, flavor]) => (
|
||||
<div class="flavor">
|
||||
<details open>
|
||||
<summary>
|
||||
<h2 id={`flavor-${flavorName}`} class="flavor-name">
|
||||
<FlavorName flavor={flavorName} bold={false} />
|
||||
</h2>
|
||||
</summary>
|
||||
<table class="color-list" cellspacing="0">
|
||||
<thead>
|
||||
<tr class="color-list-header">
|
||||
<th>Color</th>
|
||||
<th>Hex</th>
|
||||
<th>RGB</th>
|
||||
<th>HSL</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{Object.values(flavor.colors).map(({ hex, rgb, hsl, name }) => (
|
||||
<tr class="color-list-entry" style={`--current-color: ${hex}`}>
|
||||
<td class="color">
|
||||
<h5 class="color-name">{name}</h5>
|
||||
</td>
|
||||
<td class="color-hex">
|
||||
<button class="btn btn-small btn-transparent">
|
||||
<PhosphorIcon icon="copy" size={12} />
|
||||
<span class="color-value">{hex}</span>
|
||||
</button>
|
||||
</td>
|
||||
<td class="color-rgb">
|
||||
<button class="btn btn-small btn-transparent">
|
||||
<PhosphorIcon icon="copy" size={12} />
|
||||
<span class="color-value">{toRgb(rgb)}</span>
|
||||
</button>
|
||||
</td>
|
||||
<td class="color-hsl">
|
||||
<button class="btn btn-small btn-transparent">
|
||||
<PhosphorIcon icon="copy" size={12} />
|
||||
<span class="color-value">{toHsl(hsl)}</span>
|
||||
</button>
|
||||
</td>
|
||||
</tr>
|
||||
))}
|
||||
</tbody>
|
||||
</table>
|
||||
</details>
|
||||
</div>
|
||||
))
|
||||
}
|
||||
</section>
|
||||
</PageIntro>
|
||||
|
||||
<script is:inline>
|
||||
const elements = document.querySelectorAll(".color-list-entry button");
|
||||
elements.forEach((element) =>
|
||||
element.addEventListener("click", () => {
|
||||
navigator.clipboard.writeText(element.querySelector(".color-value").textContent);
|
||||
|
||||
const icon = element.querySelector("svg > path");
|
||||
const iconCopy =
|
||||
"M216,32H88a8,8,0,0,0-8,8V80H40a8,8,0,0,0-8,8V216a8,8,0,0,0,8,8H168a8,8,0,0,0,8-8V176h40a8,8,0,0,0,8-8V40A8,8,0,0,0,216,32Zm-8,128H176V88a8,8,0,0,0-8-8H96V48H208Z";
|
||||
const iconTick =
|
||||
"M243.33,90.91,114.92,219.31a16,16,0,0,1-22.63,0l-71.62-72a16,16,0,0,1,0-22.61l24-24a16,16,0,0,1,22.57-.06l36.64,35.27.11.11h0l92.73-91.37a16,16,0,0,1,22.58,0l24,23.56A16,16,0,0,1,243.33,90.91Z";
|
||||
|
||||
element.classList.add("copy-success");
|
||||
icon.setAttribute("d", iconTick);
|
||||
|
||||
return setTimeout(() => {
|
||||
element.classList.remove("copy-success");
|
||||
icon.setAttribute("d", iconCopy);
|
||||
}, 1500);
|
||||
})
|
||||
);
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
@use "../styles/utils";
|
||||
|
||||
:root {
|
||||
--accent-color: var(--mauve);
|
||||
}
|
||||
|
||||
summary {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.flavor {
|
||||
@include utils.containerPadding();
|
||||
margin-block-start: var(--space-md);
|
||||
|
||||
border-radius: var(--border-radius-normal);
|
||||
background: var(--mantle);
|
||||
|
||||
overflow-x: auto;
|
||||
}
|
||||
|
||||
.flavor-name,
|
||||
.color-name {
|
||||
text-transform: capitalize;
|
||||
}
|
||||
|
||||
.flavor-name {
|
||||
font-size: inherit;
|
||||
}
|
||||
|
||||
.color-list {
|
||||
margin-block-start: var(--space-md);
|
||||
margin-inline: auto;
|
||||
}
|
||||
|
||||
.color-list-entry {
|
||||
--__current-color: var(--current-color, var(--text));
|
||||
}
|
||||
|
||||
.color-name {
|
||||
position: relative;
|
||||
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
padding-inline-start: 3rem;
|
||||
|
||||
&::before {
|
||||
content: "";
|
||||
|
||||
position: absolute;
|
||||
left: 0;
|
||||
|
||||
height: 2rem;
|
||||
aspect-ratio: 1 / 1;
|
||||
|
||||
border-radius: 9999px;
|
||||
border: 1px solid color-mix(in srgb, var(--mantle), var(--surface0) 50%);
|
||||
background-color: var(--__current-color);
|
||||
}
|
||||
}
|
||||
|
||||
.color-hex,
|
||||
.color-rgb,
|
||||
.color-hsl {
|
||||
.btn {
|
||||
font-size: 80%;
|
||||
font-family: monospace;
|
||||
white-space: pre;
|
||||
}
|
||||
}
|
||||
|
||||
.copy-success {
|
||||
color: var(--green);
|
||||
}
|
||||
</style>
|
||||
</Layout>
|
||||
58
src/pages/ports.astro
Normal file
58
src/pages/ports.astro
Normal file
@ -0,0 +1,58 @@
|
||||
---
|
||||
import { ports, categories, type Category } from "../lib/ports";
|
||||
|
||||
import Layout from "../layouts/Layout.astro";
|
||||
|
||||
import PageIntro from "../components/PageIntro.astro";
|
||||
import PortCard from "../components/cards/Port.astro";
|
||||
import Callout from "../components/cards/Callout.astro";
|
||||
---
|
||||
|
||||
<Layout
|
||||
title="Ports • Catppuccin"
|
||||
description="Explore Catppuccin's extensive range of ports. From applications and tools to websites, we have a port for just about anything!">
|
||||
<PageIntro title="Ports">
|
||||
<p>
|
||||
Catppuccin offers ports for all sorts of different applications, tools, websites and just about anything that
|
||||
comes to your mind!
|
||||
</p>
|
||||
<Callout type="info"> Search & Filters Coming Soon™</Callout>
|
||||
</PageIntro>
|
||||
|
||||
<section class="port-list">
|
||||
<div class="port-grid">
|
||||
{
|
||||
Object.entries(ports)
|
||||
.sort(([a], [b]) => (a.toLowerCase() < b.toLowerCase() ? -1 : a.toLowerCase() > b.toLowerCase() ? 1 : 0))
|
||||
.map(([slug, fields]) => (
|
||||
<PortCard
|
||||
title={fields.name}
|
||||
link={
|
||||
"url" in fields
|
||||
? (fields.url as string)
|
||||
: "readme" in fields
|
||||
? `https://github.com/catppuccin/userstyles/blob/main/styles/${slug}`
|
||||
: `https://github.com/catppuccin/${fields.alias || slug}`
|
||||
}
|
||||
categories={fields.categories.map(
|
||||
(portCategory) => categories.find(({ key }) => key == portCategory) as Category
|
||||
)}
|
||||
color={fields.color}
|
||||
/>
|
||||
))
|
||||
}
|
||||
</div>
|
||||
</section>
|
||||
</Layout>
|
||||
|
||||
<style lang="scss" is:global>
|
||||
@use "../styles/utils";
|
||||
|
||||
:root {
|
||||
--accent-color: var(--peach);
|
||||
}
|
||||
|
||||
.port-grid {
|
||||
@include utils.grid($column: 250px, $gap: var(--space-md));
|
||||
}
|
||||
</style>
|
||||
@ -1,77 +0,0 @@
|
||||
import GetPorts from "../lib/getPorts";
|
||||
import { FiStar } from "react-icons/fi";
|
||||
import { VscRepoForked } from "react-icons/vsc";
|
||||
import getIcon from "../lib/getIcon";
|
||||
import getIconColor from "../lib/getIconColor";
|
||||
import { useState } from "react";
|
||||
import SearchBar from "../components/SearchBar";
|
||||
import { useAutoAnimate } from "@formkit/auto-animate/react";
|
||||
import Link from "next/link";
|
||||
import Layout from "../components/Layout";
|
||||
|
||||
export default function Home(props: any) {
|
||||
const [filteredPorts, setFilteredPorts] = useState(
|
||||
props.ports ? props.ports : []
|
||||
);
|
||||
const [parent] = useAutoAnimate<HTMLDivElement>({
|
||||
duration: 500,
|
||||
});
|
||||
|
||||
return (
|
||||
<Layout>
|
||||
<div className="flex flex-col justify-start items-center max-w-screen overflow-x-hidden min-w-screen min-h-screen font-inter p-4 bg-base gap-4 h-max max-h-max overflow-y-hidden">
|
||||
<div className="flex w-[100%] lg:w-2/3 md:w-[80%] justify-center items-center">
|
||||
<SearchBar ports={props.ports} setFilteredPorts={setFilteredPorts} />
|
||||
</div>
|
||||
<div
|
||||
ref={parent}
|
||||
className="grid grid-cols-2 lg:grid-cols-4 md:grid-cols-3 gap-4 w-[100%] lg:w-2/3 md:w-[80%]"
|
||||
>
|
||||
{filteredPorts
|
||||
.filter(
|
||||
(port: any) => port.name !== ".github" && port.name !== "template"
|
||||
)
|
||||
.map((port: any) => {
|
||||
return (
|
||||
<Link href={`/ports/${port.name}`} key={port.name}>
|
||||
<a>
|
||||
<div className="bg-crust flex cursor-pointer hover:-translate-y-1 flex-col py-6 rounded-lg drop-shadow-md hover:drop-shadow-2xl hover:scale-[1.01] duration-300 items-center justify-evenly gap-3 max-h-fit h-fit">
|
||||
<h3 className=" text-zinc-300">{port.name}</h3>
|
||||
<div
|
||||
className={`flex text-${getIconColor(
|
||||
port.name
|
||||
)} justify-center items-center bg-base rounded-full p-3 fill-${getIconColor(
|
||||
port.name
|
||||
)}`}
|
||||
>
|
||||
{getIcon(port.name)}
|
||||
</div>
|
||||
<div className="flex justify-center items-center gap-4 w-full">
|
||||
<p className="text-sm text-zinc-300 flex gap-1 justify-center">
|
||||
<FiStar />
|
||||
{port.stargazers_count}
|
||||
</p>
|
||||
<p className="text-sm text-zinc-300 flex gap-1 justify-center">
|
||||
<VscRepoForked />
|
||||
{port.forks_count}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</Link>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
</div>
|
||||
</Layout>
|
||||
);
|
||||
}
|
||||
|
||||
export async function getStaticProps() {
|
||||
const ports = await GetPorts();
|
||||
return {
|
||||
props: {
|
||||
ports,
|
||||
},
|
||||
};
|
||||
}
|
||||
@ -1,59 +0,0 @@
|
||||
import Layout from "../../components/Layout";
|
||||
import { ReactElement } from "react";
|
||||
import markdownToHtml from "../../lib/markdownToHtml";
|
||||
import { GetStaticPaths, GetStaticProps } from "next";
|
||||
import GetPorts from "../../lib/getPorts";
|
||||
import Link from "next/link";
|
||||
|
||||
export default function PortPage({
|
||||
name,
|
||||
readme,
|
||||
}: {
|
||||
name: string;
|
||||
readme: string;
|
||||
}): ReactElement {
|
||||
return (
|
||||
<Layout>
|
||||
<div className="max-w-3xl prose text-text bg-mantle mx-auto p-4 rounded-md items-baseline">
|
||||
<div className="flex justify-between">
|
||||
<h1>Catppuccin for {name}</h1>
|
||||
<Link href={`https://github.com/catppuccin/${name}`}>
|
||||
<a>
|
||||
View on GitHub
|
||||
</a>
|
||||
</Link>
|
||||
</div>
|
||||
<div dangerouslySetInnerHTML={{ __html: readme }} />
|
||||
</div>
|
||||
</Layout>
|
||||
);
|
||||
}
|
||||
|
||||
export const getStaticProps: GetStaticProps = async (context: any) => {
|
||||
const res = await fetch(
|
||||
`https://raw.githubusercontent.com/catppuccin/${context.params.slug}/main/README.md`
|
||||
);
|
||||
const readme = await markdownToHtml(await res.text());
|
||||
|
||||
return {
|
||||
props: {
|
||||
name: context.params.slug,
|
||||
readme,
|
||||
},
|
||||
};
|
||||
};
|
||||
|
||||
export const getStaticPaths: GetStaticPaths = async () => {
|
||||
const ports = await GetPorts();
|
||||
|
||||
const paths = ports.map((port: any) => {
|
||||
return {
|
||||
params: { slug: port.name },
|
||||
};
|
||||
});
|
||||
|
||||
return {
|
||||
paths,
|
||||
fallback: false,
|
||||
};
|
||||
};
|
||||
47
src/pages/test.astro
Normal file
47
src/pages/test.astro
Normal file
@ -0,0 +1,47 @@
|
||||
---
|
||||
import Layout from "../layouts/Layout.astro";
|
||||
---
|
||||
|
||||
<Layout title="Contributing • Catppuccin" description="🎉 First off, thanks for taking the time to contribute! 🎉">
|
||||
<h1>H1 Lorem Ipsum dolor sit happens…</h1>
|
||||
<h2>H2 Lorem Ipsum dolor sit happens…</h2>
|
||||
<p>
|
||||
<strong>Lorem, ipsum dolor sit amet consectetur adipisicing elit.</strong> Alias repellendus magni natus reiciendis quisquam
|
||||
corrupti voluptatibus saepe optio, maiores tenetur praesentium iste deleniti deserunt cumque voluptas quod labore, molestias
|
||||
voluptatum. Eligendi saepe, qui recusandae id ullam neque nulla delectus labore, eum provident, necessitatibus exercitationem
|
||||
repudiandae quis non accusantium cum dolore maiores veritatis quo nihil ut dolores voluptatum in! Cupiditate aliquid,
|
||||
est laborum modi expedita iure, optio, non provident numquam distinctio totam placeat quaerat vitae assumenda architecto
|
||||
nam voluptate. Ratione velit temporibus veritatis ad ipsa nam alias facere sunt, error numquam est quam asperiores laudantium
|
||||
atque deserunt praesentium iure enim neque!
|
||||
</p>
|
||||
<p>
|
||||
<em>Lorem ipsum dolor sit amet consectetur adipisicing elit.</em> Quas pariatur nemo at, provident nihil totam architecto,
|
||||
sequi id, vero labore doloribus excepturi deleniti impedit. Blanditiis dolor temporibus officia facilis provident?
|
||||
</p>
|
||||
<h3>H3 Lorem Ipsum dolor sit happens…</h3>
|
||||
<p>
|
||||
<code>Lorem ipsum</code> dolor sit amet consectetur adipisicing elit. Reprehenderit, iste cupiditate, culpa excepturi
|
||||
facilis maiores aspernatur qui vero accusantium ut, sint dignissimos eos! Officia cumque eos debitis porro. Laudantium
|
||||
odit praesentium nam deleniti tempore mollitia, minima alias quae reprehenderit. Nihil est quasi ducimus deserunt iure
|
||||
maiores recusandae aspernatur, error magnam!
|
||||
</p>
|
||||
<pre><code>from typing import List
|
||||
def decorator(param):
|
||||
pass
|
||||
</code></pre>
|
||||
<h4>H4 Lorem Ipsum dolor sit happens…</h4>
|
||||
<ul>
|
||||
<li>Lorem ipsum dolor sit amet consectetur.</li>
|
||||
<li>Lorem ipsum dolor sit amet consectetur adipisicing elit. Cum, ratione?</li>
|
||||
</ul>
|
||||
<p>
|
||||
Lorem ipsum dolor sit amet consectetur adipisicing elit. Quidem dolor doloribus quam exercitationem eos temporibus
|
||||
autem consequatur qui aperiam fugit!
|
||||
</p>
|
||||
</Layout>
|
||||
|
||||
<style lang="scss">
|
||||
:root {
|
||||
--accent-color: var(--green);
|
||||
}
|
||||
</style>
|
||||
107
src/styles/_buttons.scss
Normal file
107
src/styles/_buttons.scss
Normal file
@ -0,0 +1,107 @@
|
||||
@use "../styles/utils";
|
||||
|
||||
@keyframes btnFadeOut {
|
||||
to {
|
||||
background-color: var(--surface0);
|
||||
|
||||
color: var(--text);
|
||||
}
|
||||
}
|
||||
|
||||
.btn-group {
|
||||
display: flex;
|
||||
gap: var(--space-xs);
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.btn {
|
||||
@include utils.containerPadding(xs-y);
|
||||
|
||||
border-radius: 9999px;
|
||||
border: none;
|
||||
background-color: var(--surface0);
|
||||
|
||||
font-size: 1.6rem;
|
||||
font-weight: 500;
|
||||
color: var(--text);
|
||||
|
||||
transition: all 350ms ease-in-out;
|
||||
cursor: pointer;
|
||||
|
||||
&-small {
|
||||
@include utils.containerPadding(xxs);
|
||||
|
||||
border-radius: var(--border-radius-normal);
|
||||
}
|
||||
|
||||
&-transparent {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
&-transparent:hover,
|
||||
&-transparent:focus {
|
||||
background-color: color-mix(in srgb, transparent, var(--text) 10%);
|
||||
}
|
||||
|
||||
&-has-icon {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: var(--space-xs);
|
||||
}
|
||||
|
||||
&-peach {
|
||||
background-color: var(--peach);
|
||||
background-image: linear-gradient(120deg, var(--peach), var(--red));
|
||||
background-size: 150% 100%;
|
||||
background-position: top left;
|
||||
|
||||
font-weight: 600;
|
||||
color: var(--inverted-text);
|
||||
|
||||
&:hover {
|
||||
background-position: top right;
|
||||
}
|
||||
}
|
||||
|
||||
&-mauve {
|
||||
background-color: var(--mauve);
|
||||
background-image: linear-gradient(120deg, var(--pink), var(--mauve));
|
||||
background-size: 150% 100%;
|
||||
background-position: top left;
|
||||
|
||||
font-weight: 600;
|
||||
color: var(--inverted-text);
|
||||
|
||||
&:hover {
|
||||
background-position: top right;
|
||||
}
|
||||
}
|
||||
|
||||
&-green {
|
||||
background-color: var(--green);
|
||||
background-image: linear-gradient(120deg, var(--teal), var(--green));
|
||||
background-size: 150% 100%;
|
||||
background-position: top left;
|
||||
|
||||
font-weight: 600;
|
||||
color: var(--inverted-text);
|
||||
|
||||
&:hover {
|
||||
background-position: top right;
|
||||
}
|
||||
}
|
||||
|
||||
&-success {
|
||||
background-color: var(--green);
|
||||
|
||||
color: var(--inverted-text);
|
||||
|
||||
animation: btnFadeOut 350ms linear forwards;
|
||||
animation-delay: 500ms;
|
||||
}
|
||||
}
|
||||
|
||||
.btn,
|
||||
.btn * {
|
||||
transition: background-position 350ms ease-in-out;
|
||||
}
|
||||
27
src/styles/_palette.scss
Normal file
27
src/styles/_palette.scss
Normal file
@ -0,0 +1,27 @@
|
||||
@import "@catppuccin/palette/scss/catppuccin";
|
||||
|
||||
:root {
|
||||
@each $flavor, $colors in $palette {
|
||||
@if str-index($flavor, "latte") {
|
||||
@each $color, $value in $colors {
|
||||
--#{$color}: #{$value};
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
--inverted-text: var(--base);
|
||||
--selection-color: var(--blue);
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
@each $flavor, $colors in $palette {
|
||||
@if str-index($flavor, "mocha") {
|
||||
@each $color, $value in $colors {
|
||||
--#{$color}: #{$value};
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
--inverted-text: var(--crust);
|
||||
--selection-color: var(--mauve);
|
||||
}
|
||||
}
|
||||
78
src/styles/_scaffolding.scss
Normal file
78
src/styles/_scaffolding.scss
Normal file
@ -0,0 +1,78 @@
|
||||
*,
|
||||
*::before,
|
||||
*::after {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
html {
|
||||
font-size: 62.5%;
|
||||
|
||||
scroll-behavior: smooth;
|
||||
}
|
||||
|
||||
@media (prefers-reduced-motion) {
|
||||
*,
|
||||
*::before,
|
||||
*::after {
|
||||
transition: none !important;
|
||||
}
|
||||
html {
|
||||
scroll-behavior: auto;
|
||||
}
|
||||
}
|
||||
|
||||
:root {
|
||||
--website-max-width: 80vw;
|
||||
|
||||
--border-radius-normal: 6px;
|
||||
--border-radius-large: 12px;
|
||||
|
||||
--base-unit: 1em;
|
||||
|
||||
--space-xxs: calc(0.25 * var(--base-unit));
|
||||
--space-xs: calc(0.5 * var(--base-unit));
|
||||
--space-sm: calc(0.75 * var(--base-unit));
|
||||
--space-md: calc(1.25 * var(--base-unit));
|
||||
--space-lg: calc(2 * var(--base-unit));
|
||||
--space-xl: calc(3.25 * var(--base-unit));
|
||||
--space-xxl: calc(5.25 * var(--base-unit));
|
||||
|
||||
--padding-body: clamp(20px, 5vw, 500px);
|
||||
}
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
|
||||
min-height: 100vh;
|
||||
|
||||
background-color: var(--base);
|
||||
}
|
||||
|
||||
section + section {
|
||||
margin-block-start: var(--space-xl);
|
||||
}
|
||||
|
||||
.content-wrapper {
|
||||
margin-inline: auto;
|
||||
padding: var(--space-md) var(--padding-body);
|
||||
max-width: calc(2 * var(--padding-body) + var(--website-max-width));
|
||||
}
|
||||
|
||||
.no-padding {
|
||||
padding-block: 0;
|
||||
}
|
||||
|
||||
.header-container {
|
||||
padding-block: var(--space-md);
|
||||
}
|
||||
|
||||
.footer-container {
|
||||
margin-block-start: var(--space-xl);
|
||||
|
||||
background-color: var(--mantle);
|
||||
|
||||
.content-wrapper {
|
||||
padding-block: var(--space-lg);
|
||||
}
|
||||
}
|
||||
40
src/styles/_tables.scss
Normal file
40
src/styles/_tables.scss
Normal file
@ -0,0 +1,40 @@
|
||||
@use "./utils";
|
||||
|
||||
table {
|
||||
width: 100%;
|
||||
min-width: max-content;
|
||||
overflow-y: scroll;
|
||||
|
||||
text-align: left;
|
||||
|
||||
tr:nth-child(odd):not(:first-child) {
|
||||
background-color: color-mix(in srgb, var(--mantle), var(--crust) 50%);
|
||||
}
|
||||
|
||||
th,
|
||||
td {
|
||||
@include utils.containerPadding(xs-y);
|
||||
}
|
||||
|
||||
th + th,
|
||||
td + td {
|
||||
padding-inline-start: var(--space-lg);
|
||||
}
|
||||
|
||||
th {
|
||||
border-bottom: 1px solid var(--surface0);
|
||||
|
||||
font-size: 80%;
|
||||
font-weight: 500;
|
||||
color: var(--subtext0);
|
||||
}
|
||||
|
||||
tr th:not(:first-child),
|
||||
tr td:not(:first-child) {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
tbody td {
|
||||
padding-right: 0;
|
||||
}
|
||||
}
|
||||
128
src/styles/_typography.scss
Normal file
128
src/styles/_typography.scss
Normal file
@ -0,0 +1,128 @@
|
||||
@use "./utils";
|
||||
|
||||
@font-face {
|
||||
font-family: "Inter";
|
||||
src: url("/inter.woff2") format("woff2-variations");
|
||||
|
||||
font-display: swap;
|
||||
font-weight: 125 950;
|
||||
font-stretch: 75% 125%;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: "Inter", system-ui, sans-serif;
|
||||
font-size: 2rem;
|
||||
color: var(--subtext1);
|
||||
font-weight: 400;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
::selection {
|
||||
background-color: color-mix(in srgb, var(--selection-color), transparent 70%);
|
||||
}
|
||||
|
||||
button,
|
||||
input,
|
||||
optgroup,
|
||||
select,
|
||||
textarea {
|
||||
font-family: inherit;
|
||||
}
|
||||
|
||||
b {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-weight: 900;
|
||||
}
|
||||
h2,
|
||||
h3,
|
||||
h4 {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5 {
|
||||
margin: 0;
|
||||
padding-block: var(--space-md) var(--space-xs);
|
||||
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: 300%;
|
||||
}
|
||||
h2 {
|
||||
font-size: 200%;
|
||||
}
|
||||
h3 {
|
||||
font-size: 125%;
|
||||
}
|
||||
h4 {
|
||||
font-size: 100%;
|
||||
}
|
||||
h5 {
|
||||
font-size: 80%;
|
||||
}
|
||||
|
||||
summary {
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6 {
|
||||
display: inline-block;
|
||||
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
|
||||
p,
|
||||
ul,
|
||||
ol {
|
||||
margin-block: 0 var(--space-xs);
|
||||
}
|
||||
li {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
a {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
pre:has(code) {
|
||||
margin: 0;
|
||||
@include utils.containerPadding(xs);
|
||||
max-width: 100%;
|
||||
overflow-x: scroll;
|
||||
|
||||
border-radius: var(--border-radius-normal);
|
||||
background-color: var(--crust);
|
||||
|
||||
line-height: 1.2;
|
||||
|
||||
code {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
|
||||
code {
|
||||
padding-inline: var(--space-xxs);
|
||||
max-width: 100%;
|
||||
|
||||
border-radius: var(--border-radius-normal);
|
||||
background-color: var(--crust);
|
||||
|
||||
font-family: monospace;
|
||||
font-size: 80%;
|
||||
|
||||
overflow-x: scroll;
|
||||
}
|
||||
37
src/styles/_utils.scss
Normal file
37
src/styles/_utils.scss
Normal file
@ -0,0 +1,37 @@
|
||||
@mixin containerPadding($size: md) {
|
||||
@if $size == xxs {
|
||||
padding: var(--space-xxs);
|
||||
}
|
||||
@if $size == xxs-y {
|
||||
padding: var(--space-xxs) var(--space-xs);
|
||||
}
|
||||
@if $size == xs {
|
||||
padding: var(--space-xs);
|
||||
}
|
||||
@if $size == xs-y {
|
||||
padding: var(--space-xs) var(--space-md);
|
||||
}
|
||||
@if $size == md {
|
||||
padding: var(--space-md);
|
||||
}
|
||||
@if $size == lg {
|
||||
padding: var(--space-lg);
|
||||
}
|
||||
@if $size == xl {
|
||||
padding: var(--space-xl) var(--space-xxl);
|
||||
}
|
||||
}
|
||||
|
||||
@mixin flex($direction: row, $gap: var(--space-md)) {
|
||||
display: flex;
|
||||
flex-direction: $direction;
|
||||
flex-wrap: wrap;
|
||||
gap: $gap;
|
||||
}
|
||||
|
||||
@mixin grid($column: 250px, $gap: var(--space-md)) {
|
||||
display: grid;
|
||||
grid-template-rows: auto;
|
||||
grid-template-columns: repeat(auto-fit, minmax($column, 1fr));
|
||||
gap: $gap;
|
||||
}
|
||||
7
src/styles/global.scss
Normal file
7
src/styles/global.scss
Normal file
@ -0,0 +1,7 @@
|
||||
@import url(_palette.scss);
|
||||
@import url(_typography.scss);
|
||||
|
||||
@import url(_scaffolding.scss);
|
||||
|
||||
@import url(_tables.scss);
|
||||
@import url(_buttons.scss);
|
||||
Some files were not shown because too many files have changed in this diff Show More
Loading…
x
Reference in New Issue
Block a user