Initial commit

This commit is contained in:
Timothy DeHerrera
2022-11-01 15:18:00 -06:00
committed by GitHub
commit 14079f0511
90 changed files with 7473 additions and 0 deletions

29
.github/workflows/main.yml vendored Normal file
View File

@@ -0,0 +1,29 @@
name: CI
# Controls when the workflow will run
on:
# Triggers the workflow on push or pull request events but only for the main branch
push:
branches: [ main ]
pull_request:
branches: [ main ]
schedule:
- cron: 30 */4 * * *
# Allows you to run this workflow manually from the Actions tab
workflow_dispatch:
# A workflow run is made up of one or more jobs that can run sequentially or in parallel
jobs:
publish-drafts:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v2
- name: SSG Publish Drafts
# You may pin to the exact commit or the version.
uses: one-aalam/github-action-astro-publish-drafts@v0.1-beta
with:
github_token: $\{{ secrets.GITHUB_TOKEN }}
github_actor: one-aalam
github_repository: one-aalam/astro-ink

22
.gitignore vendored Normal file
View File

@@ -0,0 +1,22 @@
# build output
dist
# dependencies
node_modules/
.snowpack/
# logs
npm-debug.log*
yarn-debug.log*
yarn-error.log*
# environment variables
.env
.env.production
# macOS-specific files
.DS_Store
# Local Netlify folder
.netlify
netlify

21
LICENSE Normal file
View File

@@ -0,0 +1,21 @@
MIT License
Copyright (c) 2021 Aftab Alam
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:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
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.

52
README.md Normal file
View File

@@ -0,0 +1,52 @@
<div align="center">
<img src="./public/astro-ink-logo.png" height="140px" title="Astro Ink" />
</div>
<br />
<div align="center">Astro Ink is a minimal theme created to serve minimalistic markdown-based blog needs. It ships with almost all the basic Astro components that you might need while creating light-weight, performant, personal blogs, that focus on shipping less Javascript by default.</div>
<br />
<br/>
<div align="center">
<img src="https://img.shields.io/static/v1?label=PRs&message=welcome&style=flat-square&color=5e17eb&labelColor=000000" alt="PRs welcome!" />
<img alt="License" src="https://img.shields.io/github/license/one-aalam/astro-ink?style=flat-square&color=5e17eb&labelColor=000000">
<a href="https://twitter.com/intent/follow?screen_name=aftabbuddy">
<img src="https://img.shields.io/twitter/follow/aftabbuddy?style=flat-square&color=5e17eb&labelColor=000000" alt="Follow @aftabbuddy" />
</a>
</div>
<br/>
<img src="./public/astro-banner.png" alt="Astro Banner" />
It's hugely inspired by [Hugo](https://github.com/knadh/hugo-ink)'s Ink theme and strives to remain light, while providing the basis for a beautiful, minimal blog.
## Features
- __Minimal, Crisp, Markdown-Blog Ready__
- __Uses `astro 1.1.5`__ - It uses Astro's latest `1.1.5` release under the hood
- __Svelte Ready__ - In its effort to remain light-weight, performant, and more approachable from Astro's POV, Svelte is used for interactive components like the theme switcher
- __Modular__ - The structure is highly modular, with components doing just one job, and one job well.
- __Collection + Dynamic Pages__ - It's ready with Next.js like dynamic pages, to support a tag-based classification system with paginated results, all configurable
- __Dark Mode & Color Codes__ - It supports dark mode, and __6+__ color modes that's selected using `tailwind.config.js`. You can pass `THEME_KEY` with the `dev` or `build` script/commands ex: `THEME_KEY=purpleheart astro build/dev` to change the color theme being used. All the available themes can be found in [tailwind.theme.config.js](./tailwind.theme.config.js). To customize the blog section, add any of the Tailwind Typography's `prose-{color}` classes as referred [here](./src/components/Prose.astro)
- __Netlify CMS<sup>*NEW</sup>__ - Add/Edit/Update all the posts in the `/blog` directory by visiting `your-site.netlify.com/admin` ex: [astro-ink.netlify.app/admin](https://astro-ink.netlify.app/admin) with your Netlify credentials. It needs Netlify Identity(https://app.netlify.com/sites/your-site/settings/identity#registration
) and Git Gateway(https://app.netlify.com/sites/your-site/settings/identity#services) enabled.
- __Future Posts<sup>*NEW</sup>__(with Github Actions) - Create posts in the `/src/drafts` directory with a future `date` in the `YYYY-MM-DD` format, and let a specially crafted [Github Action](https://github.com/marketplace/actions/ssg-publish-drafts) take care of auto-publishing it on your specified date. You can configure the check interval in [Github Action](https://github.com/one-aalam/astro-ink/blob/main/.github/workflows/main.yml).
- __Client-Side Search<sup>*NEW</sup>__ - Allow your users get to your blog posts quickly with client-side search feat. Lunr.js
## How to start?
There's not much to know about commands. Just clone this template, and start working from your clone. You have all the common NPM commands at your disposal like `dev`, `build`, etc. Refer [package.json](./package.json) to see a list of all the available commands.
## Built with Astro Ink
- [jamesperkins.dev](https://www.jamesperkins.dev/) - Personal site of developer, YouTube instructor [James R Perkins](https://twitter.com/james_r_perkins)
- [highlandcows.github.io](https://highlandcows.github.io/) [Nick Jacob](https://github.com/njacobs5074)'s personal blog
> know a site built with Astro Ink? Let me know on [Twitter](https://twitter.com/aftabbuddy)
## Wanna learn Astro while building Ink?
This theme was initially built with first an alpha, and then a beta version of the `Astro` Framework. If you're just starting with `Astro`, you can actually learn `Astro` while building this very theme by following a series of blogs I've written that teaches you Astro ground-up!
Head over to `aalam.in/blog` and know
- [How to set Astro up and get it running with essential defaults for styling, prototyping, and incremental deployments](https://aalam.in/blog/astro-get-up-and-running)
- [Managing presentational components and creating Astro pages](https://aalam.in/blog/astro-and-site-strcuture)
- [Feeding local as well as remote data to the Astro pages](https://aalam.in/blog/astro-and-data)
- [Putting interactivity where you absolutely cannot do without it in Astro](https://aalam.in/blog/astro-and-interactivity)
- [Creating data-driven, dynamic pages and paginated results in Astro](https://aalam.in/blog/astro-and-dynamic-pages)
- [Author your Astro site's content with Git-based CMSs](https://aalam.in/blog/astro-and-git-cms-netlify)

49
astro.config.mjs Normal file
View File

@@ -0,0 +1,49 @@
import path, { dirname } from 'path'
import { fileURLToPath } from 'url'
import svelte from '@astrojs/svelte'
import tailwind from '@astrojs/tailwind'
import sitemap from '@astrojs/sitemap'
import mdx from '@astrojs/mdx'
const __filename = fileURLToPath(import.meta.url)
const __dirname = dirname(__filename)
// Full Astro Configuration API Documentation:
// https://docs.astro.build/reference/configuration-reference
// @type-check enabled!
// VSCode and other TypeScript-enabled text editors will provide auto-completion,
// helpful tooltips, and warnings if your exported object is invalid.
// You can disable this by removing "@ts-check" and `@type` comments below.
// @ts-check
export default /** @type {import('astro').AstroUserConfig} */ ({
// root: '.', // Where to resolve all URLs relative to. Useful if you have a monorepo project.
// outDir: './dist', // When running `astro build`, path to final static output
// publicDir: './public', // A folder of static files Astro will copy to the root. Useful for favicons, images, and other files that dont need processing.
site: 'https://astro-ink.vercel.app', // Your public domain, e.g.: https://my-site.dev/. Used to generate sitemaps and canonical URLs.
server: {
// port: 3000, // The port to run the dev server on.
},
integrations: [
mdx(),
svelte(),
tailwind({
config: {
applyBaseStyles: false
},
}),
sitemap()
],
vite: {
plugins: [],
resolve: {
alias: {
'$': path.resolve(__dirname, './src'),
},
},
optimizeDeps: {
allowNodeBuiltins: true
}
}
});

2
netlify.toml Normal file
View File

@@ -0,0 +1,2 @@
[functions]
external_node_modules = ["astro", "vscode-oniguruma"]

34
package.json Normal file
View File

@@ -0,0 +1,34 @@
{
"name": "astro-ink",
"version": "1.0.1",
"private": true,
"scripts": {
"dev": "astro dev",
"build": "astro build",
"check": "astro check",
"postbuild": "node ./scripts/search/prepare-index.js",
"preview": "astro preview"
},
"devDependencies": {
"@astrojs/mdx": "^0.11.1",
"@astrojs/rss": "^1.0.0",
"@astrojs/sitemap": "^1.0.0",
"@astrojs/svelte": "^1.0.0",
"@astrojs/tailwind": "^1.0.0",
"@fontsource/fira-sans": "^4.5.9",
"@tailwindcss/aspect-ratio": "^0.4.0",
"@tailwindcss/forms": "^0.5.0",
"@tailwindcss/line-clamp": "^0.4.2",
"@tailwindcss/typography": "^0.5.2",
"@types/node": "^18.7.14",
"astro": "1.1.5",
"globby": "^13.1.2",
"gray-matter": "^4.0.3",
"lunr": "^2.3.9",
"mdx": "^0.3.1",
"svelte": "^3.50.0",
"tailwindcss": "^3.0.24",
"typescript": "^4.3.5"
},
"dependencies": {}
}

6
postcss.config.cjs Normal file
View File

@@ -0,0 +1,6 @@
module.exports = {
plugins: [
require('tailwindcss/nesting'),
require('tailwindcss')
],
}

27
public/admin/config.yml Normal file
View File

@@ -0,0 +1,27 @@
backend:
name: git-gateway
branch: main
commit_messages:
create: 'Create {{collection}} “{{slug}}”'
update: 'Update {{collection}} “{{slug}}”'
delete: 'Delete {{collection}} “{{slug}}”'
uploadMedia: '[skip ci] Upload “{{path}}”'
deleteMedia: '[skip ci] Delete “{{path}}”'
media_folder: 'public/images/uploads' # Folder where user uploaded files should go
public_folder: '/images/uploads'
collections: # A list of collections the CMS should be able to edit
- name: 'post' # Used in routes, ie.: /admin/collections/:slug/edit
label: 'Post' # Used in the UI, ie.: "New Post"
folder: 'src/pages/blog' # The path to the folder where the documents are stored
create: true # Allow users to create new documents in this collection
fields: # The fields each document in this collection have
- {label: "Layout", name: "layout", widget: "hidden", default: "$/layouts/post.astro"}
- { label: 'Title', name: 'title', widget: 'string' }
- { label: 'Description', name: 'description', widget: 'text' }
- { label: 'Body', name: 'body', widget: 'markdown' }
- { label: 'Tags', name: 'tags', widget: 'list' }
- { label: 'Author', name: 'author', widget: 'string' }
- { label: 'Author Twitter Handle', name: 'authorTwitter', widget: 'string' }
- { label: 'Publish Date', name: 'date', widget: 'datetime' }

12
public/admin/index.html Normal file
View File

@@ -0,0 +1,12 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Astro Ink - Content Manager</title>
<script src="https://identity.netlify.com/v1/netlify-identity-widget.js"></script>
</head>
<body>
<script src="https://unpkg.com/netlify-cms@2.10.161/dist/netlify-cms.js"></script>
</body>
</html>

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 18 KiB

BIN
public/apple-touch-icon.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.1 KiB

12
public/assets/logo.svg Normal file
View File

@@ -0,0 +1,12 @@
<svg width="193" height="256" fill="none" xmlns="http://www.w3.org/2000/svg">
<style>
#flame { fill: #FF5D01; }
#a { fill: #000014; }
@media (prefers-color-scheme: dark) {
#a { fill: #fff; }
}
</style>
<path id="a" fill-rule="evenodd" clip-rule="evenodd" d="M131.496 18.929c1.943 2.413 2.935 5.67 4.917 12.181l43.309 142.27a180.277 180.277 0 00-51.778-17.53L99.746 60.56a3.67 3.67 0 00-7.042.01l-27.857 95.232a180.224 180.224 0 00-52.01 17.557l43.52-142.281c1.989-6.502 2.983-9.752 4.927-12.16a15.999 15.999 0 016.484-4.798c2.872-1.154 6.271-1.154 13.07-1.154h31.085c6.807 0 10.211 0 13.085 1.157a16 16 0 016.488 4.806z" fill="url(#paint0_linear)"/>
<path id="flame" fill-rule="evenodd" clip-rule="evenodd" d="M136.678 180.151c-7.14 6.105-21.39 10.268-37.804 10.268-20.147 0-37.033-6.272-41.513-14.707-1.602 4.835-1.962 10.367-1.962 13.902 0 0-1.055 17.355 11.016 29.426 0-6.268 5.081-11.349 11.349-11.349 10.743 0 10.731 9.373 10.721 16.977v.679c0 11.542 7.054 21.436 17.086 25.606a23.27 23.27 0 01-2.339-10.2c0-11.008 6.463-15.107 13.973-19.87 5.977-3.79 12.616-8.001 17.192-16.449a31.013 31.013 0 003.744-14.82c0-3.299-.513-6.479-1.463-9.463z" />
</svg>

After

Width:  |  Height:  |  Size: 1.2 KiB

925
public/assets/yay.svg Normal file
View File

@@ -0,0 +1,925 @@
<?xml version="1.0" encoding="UTF-8"?><svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 1600 1200" style="enable-background:new 0 0 1600 1200;" xml:space="preserve" width="1600px" height="1200px">
<g id="ground">
<g>
<g>
<path d="M406.9,1031.1c58.3,0,112.5,24.5,169.6,32.5c55.5,7.7,110.4-5,165-13.6c27.5-4.3,55.3-7.7,83.2-6.3
c28.8,1.5,55.5,9.3,81.7,20.9c23.7,10.6,46.9,22.9,72,30c23.9,6.8,48.5,7.1,72.9,2.8c57.4-10.1,110.2-41.4,169.5-41.1
c1.9,0,1.9-3,0-3c-51.9-0.3-99.2,23.4-148.4,36.3c-25.6,6.7-52.3,10.3-78.5,5.5c-26.5-4.8-50.9-17-75.1-28.2
c-24-11.1-48.3-20.8-74.7-24.4c-27.2-3.7-54.7-2.1-81.8,1.5c-55,7.1-109.7,22.1-165.5,18.7c-64.5-4-124.6-34.5-189.7-34.5
C405,1028.1,405,1031.1,406.9,1031.1L406.9,1031.1z" style="fill:#161616;"/>
</g>
</g>
<g>
<g>
<path d="M326.5,1043.1c11.9-4.5,24.1-7.7,36.7-9.6c1.9-0.3,1.1-3.2-0.8-2.9c-12.6,1.8-24.8,5-36.7,9.6
C323.9,1040.9,324.7,1043.8,326.5,1043.1L326.5,1043.1z" style="fill:#161616;"/>
</g>
</g>
<g>
<g>
<path d="M305.1,1069.1c67-29.5,139.3,3.8,204.8,20.7c19.2,5,38.8,8.7,58.7,9.8c1.9,0.1,1.9-2.9,0-3
c-72.2-3.9-137.8-44.2-210.9-41.8c-18.6,0.6-37,4.3-54,11.8C301.9,1067.3,303.4,1069.9,305.1,1069.1L305.1,1069.1z" style="fill:#161616;"/>
</g>
</g>
<g>
<g>
<path d="M615.3,1124.1c15.4-2.3,30-7.4,44.7-12.4c14.6-4.9,29.3-9.1,44.3-12.2c31-6.3,62.8-8.4,94.3-6.2
c18.3,1.3,36.5,4.1,54.3,8.2c1.9,0.4,2.7-2.5,0.8-2.9c-61.8-14.3-127.2-11.7-187.6,7.9c-17.1,5.5-33.8,12-51.7,14.7
C612.6,1121.5,613.4,1124.4,615.3,1124.1L615.3,1124.1z" style="fill:#161616;"/>
</g>
</g>
<g>
<g>
<path d="M973.6,1128.2c20.8,10.7,44.6,10.9,67.3,7.8c26.3-3.5,52.1-10.5,77.6-18.1c50.7-15.1,101.2-33.5,154.5-36.7
c29.3-1.8,58.8,1.3,86.3,11.8c1.8,0.7,2.6-2.2,0.8-2.9c-100.7-38.6-202.7,20.5-300.5,39.7c-27.7,5.4-58.4,9.1-84.4-4.3
C973.4,1124.7,971.9,1127.3,973.6,1128.2L973.6,1128.2z" style="fill:#161616;"/>
</g>
</g>
<g>
<g>
<path d="M1280.5,1057.6c22.7-0.6,45.2,3.8,66,13.2c1.7,0.8,3.3-1.8,1.5-2.6c-21.2-9.6-44.2-14.2-67.5-13.6
C1278.5,1054.7,1278.5,1057.7,1280.5,1057.6L1280.5,1057.6z" style="fill:#161616;"/>
</g>
</g>
</g>
<g id="background_grey">
<g>
<g>
<path d="M573.6,1059.6c-7.8-8.2-13.9-17.9-17.8-28.6c-1.7-4.8-3-9.7-3.8-14.7c-0.5-3-2.5-11.4,4.4-9.5
c2.7,0.8,5.8,5,7.3,7.2c1.1,1.6,3.7,0.1,2.6-1.5c-5.2-7.5-9.1-15.8-11.5-24.6c-1.2-4.4-2-9-2.5-13.6c-0.2-2.2-0.3-4.4-0.3-6.7
c0-1.1,0-2.2,0.1-3.3c-0.2-2.2,0.8-3.9,3.2-5.1c1-0.3,1.9-0.5,2.9-0.8c-1.6-4.1-2.8-8.3-3.6-12.6c-0.4-2.4-0.7-4.9-0.9-7.4
c0-0.3,0.2-9.5,1.8-7.8c1,1.1,3,0,2.5-1.5c-5.1-16.1-6.1-33.2-2.5-49.8c0.7-3.2,1.3-7.9,3.6-10.5c3-3.4,7.3-1.6,9.5,1.6
c1.4,2,2.3,4.3,3.1,6.6c2.5,7.6,3.4,15.8,4.9,23.6c6.5,34.1,12.7,68.3,16.3,102.9c2,19.4,3.2,38.9,3.2,58.4c0,1.9,3,1.9,3,0
c0-40.5-5.2-80.8-12-120.7c-3.4-19.7-6.8-39.6-11-59.2c-1.4-6.4-3.7-15.6-10.6-18.2c-5.1-1.9-8.8,2.2-10.5,6.6
c-7.1,18.4-5.6,40.9,0.2,59.4c0.8-0.5,1.7-1,2.5-1.5c-3.7-3.8-6.7,1.1-7,4.6c-0.7,8.7,1.5,18,4.6,26c0.7,1.8,3.5,1.1,2.9-0.8
c-0.9-2.9-4.4-3.8-6.8-1.8c-4,3.3-2.5,12.6-2.1,16.9c1.1,14.6,6.2,28.5,14.4,40.5c0.9-0.5,1.7-1,2.6-1.5
c-2.6-3.7-8.7-11.4-14.1-9.3c-5.5,2.1-3.6,10.6-2.9,14.8c2.8,16.5,10.7,31.7,22.2,43.8C572.8,1063.1,575,1061,573.6,1059.6
L573.6,1059.6z" style="fill:#E8E8E8;"/>
</g>
</g>
<g>
<g>
<path d="M595,986.3c0-9.8,0.9-19.5,2.8-29c0.8-3.7,5.6-27.6,9.9-26.9c0.7,0.1,1.7-0.2,1.8-1c2-10.6,4.8-21,8.5-31.1
c3.6-9.6,7.6-22,15.9-28.6c-0.7,0-1.4,0-2.1,0c5.3,5.8,3.8,16.3,3.9,23.6c0,8-0.2,16-0.7,24.1c-1,16.9-3,33.7-5.7,50.3
c-5.2,32.5-13,64.6-20.9,96.6c-0.5,1.9,2.4,2.7,2.9,0.8c8.6-34.5,16.9-69,22.1-104.2c2.5-16.7,4.2-33.4,4.9-50.2
c0.4-9,0.5-18,0.2-27c-0.2-5.8-0.5-11.6-4.6-16c-0.6-0.6-1.5-0.5-2.1,0c-8,6.3-11.8,17.3-15.4,26.5c-4.4,11.2-7.6,22.7-9.8,34.5
c0.6-0.3,1.2-0.7,1.8-1c-3.1-0.5-4.7,1.3-6,4c-2.6,5.6-4.4,11.8-5.9,17.8c-3.2,12.1-4.6,24.6-4.6,37.1
C592,988.2,595,988.2,595,986.3L595,986.3z" style="fill:#E8E8E8;"/>
</g>
</g>
<g>
<g>
<path d="M1045,1096c-5-8.2-9.2-16.8-12.5-25.9c-1.5-4.1-2.8-8.3-3.9-12.6c-0.6-2.3-1.1-4.6-1.6-6.9
c-0.2-1.1-0.5-2.3-0.7-3.5c-1-2.4,0-4,2.9-4.8c1-0.1,2-0.3,2.9-0.4c-2.7-7.4-4.6-15-5.6-22.9c-0.5-3.9-0.8-7.7-0.8-11.6
c0-1.9,1.4-11.1,0.3-12.3c0.9,1,2.6,0.2,2.6-1.1c-0.2-9.5,0.3-18.9,1.9-28.3c0.7-4.3,1.7-8.5,2.8-12.7c0.6-2.1,1.2-4.2,1.8-6.3
c0.4-1.2,0.8-2.4,1.2-3.5c0.4-2.6,2-3.7,5-3.2c0.6,1.5,3,1.4,2.9-0.4c-0.1-9.9,1.4-19.6,4.9-28.9c0.9-2.3,3.8-11.6,7.2-11.8
c4.4-0.2,4.5,11.7,4.7,14.1c1.7,19.7,3,39.5,3.7,59.3c1.5,40.3,1.1,80.6-1.3,120.8c-0.1,1.9,2.9,1.9,3,0
c2.1-35.3,2.7-70.6,1.8-105.9c-0.5-17.5-1.3-35-2.5-52.4c-0.6-8.6-1.2-17.1-2.1-25.7c-0.5-5.3-1.5-10.2-6.1-13.4
c-0.5-0.3-1-0.2-1.5,0c-6.5,3.1-9,11.1-11,17.6c-2.7,8.5-3.9,17.4-3.8,26.4c1-0.1,2-0.3,2.9-0.4c-1-2.7-3.9-3.9-6.6-2.6
c-4.4,2-5.5,9.9-6.7,13.8c-4,14.2-5.7,28.9-5.3,43.6c0.9-0.4,1.7-0.7,2.6-1.1c-0.2-0.2-0.3-0.3-0.5-0.5c-0.3-0.4-1-0.6-1.5-0.4
c-2.2,0.8-2.7,2.2-3.1,4.4c-0.9,5.3-0.6,11.1-0.2,16.4c0.7,10.2,2.9,20.2,6.4,29.8c0.5,1.5,3.1,1.4,2.9-0.4
c-0.3-3.1-3.6-4.8-6.5-3.2c-4.7,2.5-2.1,10.2-1.3,14c3.5,15.7,9.7,30.6,18,44.3C1043.4,1099.1,1046,1097.6,1045,1096L1045,1096z" style="fill:#E8E8E8;"/>
</g>
</g>
<g>
<g>
<path d="M1069.1,1021c-0.1-5.4,0.4-10.7,1.5-16c0.5-2.4,1.2-4.8,2-7.1c0.3-0.8,3.5-10,5.4-7.2
c0.8,1.2,2.7,0.8,2.8-0.8c0.3-4.4,0.9-8.7,2.1-12.9c0.5-1.8,4.9-14.3,6.9-13.1c1,0.7,2.2-0.2,2.3-1.3c0.6-8.8,2.6-17.4,6.2-25.4
c1.7-3.9,3.8-7.7,6.2-11.2c1.9-2.9,4.8-7.8,7.8-9.7c7.8-5,6.4,7.2,6.3,10.8c-0.2,4.5-0.5,9-0.8,13.6c-0.7,9.7-1.7,19.3-3,28.9
c-5.2,39.1-14.4,77.5-23.5,115.8c-0.4,1.9,2.4,2.7,2.9,0.8c8.6-35.9,17.2-71.9,22.5-108.5c2.5-17.4,4.3-34.9,5-52.5
c0.2-4.2,0.8-11-3.8-13.3c-4.8-2.4-8.8,3.5-11.4,6.6c-10.3,12.6-16.3,28-17.4,44.3c0.8-0.4,1.5-0.9,2.3-1.3
c-8.6-5.5-13.3,24.1-13.5,28.6c0.9-0.3,1.9-0.5,2.8-0.8c-3.4-5-7.7-0.1-9.3,3.6c-3.7,8.9-5.3,18.6-5.2,28.2
C1066.1,1022.9,1069.1,1022.9,1069.1,1021L1069.1,1021z" style="fill:#E8E8E8;"/>
</g>
</g>
<g>
<g>
<path d="M351.1,1030c-4-1.6-7.8-3.9-10.3-7.5c-1.2-1.7-2-3.6-2.7-5.5c-0.2-0.4-2.1-6.5,0.3-5.3
c1.6,0.8,2.9-1,1.8-2.4c-5.4-6.9-9.3-14.8-11.2-23.4c-0.5-2.3-1.7-5.6-1.2-7.9c1-4.6,5.6-5.2,8.6-2.3c3.2,3.1,6,6.9,8.5,10.6
c9.3,13.5,15,29.1,16.7,45.4c0.2,1.9,3.2,1.9,3,0c-1.1-11.1-4-21.8-8.6-32c-4.3-9.4-10.6-20.8-18.8-27.3
c-2.7-2.1-6.5-3.5-9.6-1.5c-3.6,2.2-2.8,7.1-2.4,10.6c1.4,11.1,6,21.3,12.9,30.1c0.6-0.8,1.2-1.6,1.8-2.4
c-1.7-0.8-3.5-0.9-4.9,0.7c-2.1,2.3-0.8,5.5,0.2,8c2.8,7.5,7.6,12.2,15,15.2C352.1,1033.6,352.9,1030.7,351.1,1030L351.1,1030z" style="fill:#E8E8E8;"/>
</g>
</g>
<g>
<g>
<path d="M354.4,997.6c-4.1-15.6-8.1-30.8-10.1-46.8c-0.5-3.8-1-7.7-1.3-11.5c-0.3-3.9-1.3-9.6-0.3-13.4
c0-0.6,0.1-1.3,0.1-1.9c3.1-3.4,5.4-3.6,6.9-0.4c0.9,1.3,1.7,2.8,2.4,4.3c1.9,3.3,3.6,6.7,5.2,10.2
c13.4,28.1,19.6,59.2,18.3,90.3c-0.1,1.9,2.9,1.9,3,0c1.6-36.1-6.8-74-25.6-105c-2.3-3.8-7.9-9-11.8-3.8
c-1.7,2.2-1.5,5.8-1.5,8.4c-0.2,5.1,0.2,10.3,0.8,15.4c1,9,1.9,18.2,3.9,27.1c2.1,9.5,4.8,18.8,7.3,28.2
C352,1000.2,354.9,999.4,354.4,997.6L354.4,997.6z" style="fill:#E8E8E8;"/>
</g>
</g>
<g>
<g>
<path d="M292.4,763.2c66.1-1.6,130.5,15.1,193.2,34.4c62.7,19.3,124.9,41.7,189.9,52.4c32.6,5.4,65.7,7.5,98.7,5
c36.3-2.7,72-10.1,107.2-19.1c35.9-9.2,71.4-19.9,107.3-29.4c36-9.6,72.2-18.3,108.7-25.8c73.7-15.2,148.6-25.4,224-27.2
c9.1-0.2,18.3-0.3,27.4-0.3c1.9,0,1.9-3,0-3c-73.9-0.2-147.6,8-220.3,21.4c-73.3,13.6-144.9,33.3-216.7,53.1
c-35.6,9.9-71.5,19-108.1,24.2c-34.9,4.9-70.1,5.5-105.1,1.4c-65.8-7.6-128.9-29.2-191.7-49.1c-62-19.6-125.3-38.3-190.6-40.8
c-8-0.3-16-0.3-24-0.1C290.4,760.3,290.4,763.3,292.4,763.2L292.4,763.2z" style="fill:#E8E8E8;"/>
</g>
</g>
<g>
<g>
<path d="M943.4,778.6c68.3-18.8,134.9-42.9,202.5-64.1c67.4-21.2,136.2-39.7,206.7-46.9c39.3-4,79-4.5,118.3,0
c1.9,0.2,1.9-2.8,0-3c-69.8-7.9-140.3-0.2-208.6,14.9c-69.3,15.3-136.5,38.2-203.8,60.4c-38.4,12.7-76.8,25.1-115.8,35.8
C940.7,776.2,941.5,779.1,943.4,778.6L943.4,778.6z" style="fill:#E8E8E8;"/>
</g>
</g>
<g>
<g>
<path d="M723.5,937.4c25.6,5.9,52,3.2,77.6-1.5c26.8-4.9,53.1-11.9,79.4-19.3c53-14.8,105.7-29.9,160.8-34.1
c31.1-2.3,62.4-1.7,93.4,1.6c1.9,0.2,1.9-2.8,0-3c-53.8-5.8-108.2-3.1-161.2,8.1c-52.7,11.1-103.7,29.1-156.3,40.4
c-30.3,6.5-62.1,12-92.8,4.9C722.4,934.1,721.6,937,723.5,937.4L723.5,937.4z" style="fill:#E8E8E8;"/>
</g>
</g>
<g>
<g>
<path d="M1220.6,956.8c67-3.6,129,26.3,193.3,39.9c18,3.8,36.2,6.3,54.6,6.6c1.9,0,1.9-3,0-3
c-66.9-1.1-128.2-31.8-193.4-42.9c-18-3.1-36.2-4.6-54.5-3.6C1218.7,954,1218.6,957,1220.6,956.8L1220.6,956.8z" style="fill:#E8E8E8;"/>
</g>
</g>
<g>
<g>
<path d="M244.7,648.2c69.3-0.8,138.5,11.8,203,37.1c18.5,7.3,36.6,15.7,54.2,25c1.7,0.9,3.2-1.7,1.5-2.6
c-61.5-32.6-129.2-53-198.4-59.9c-20-2-40.2-2.9-60.3-2.6C242.8,645.2,242.8,648.2,244.7,648.2L244.7,648.2z" style="fill:#E8E8E8;"/>
</g>
</g>
<g>
<g>
<path d="M314.5,530.9c54.7,13.7,104.6,40.6,156.3,62.5c52.2,22.1,107,37.4,163.1,45c31.6,4.3,63.6,6.2,95.5,5.7
c1.9,0,1.9-3,0-3c-57.5,0.9-115.1-6.1-170.7-20.7c-27.3-7.2-54-16.2-80.1-27c-25.9-10.7-51.3-22.9-76.9-34.2
c-28.1-12.4-56.6-23.8-86.4-31.2C313.5,527.5,312.7,530.4,314.5,530.9L314.5,530.9z" style="fill:#E8E8E8;"/>
</g>
</g>
<g>
<g>
<path d="M687.2,703.6c51.9,20,108.9,9.1,159.8-8.5c27.4-9.5,54-20.9,81.2-30.8c26.7-9.7,53.8-18.1,81.3-25.2
c31.8-8.2,64.1-14.6,96.6-19.2c1.9-0.3,1.1-3.2-0.8-2.9c-56.3,8-111.7,21.4-165.4,40c-52.8,18.3-103.9,44.2-159.8,52.1
c-30.9,4.4-62.8,2.9-92.1-8.4C686.2,700,685.4,702.9,687.2,703.6L687.2,703.6z" style="fill:#E8E8E8;"/>
</g>
</g>
</g>
<g id="details">
<ellipse cx="497.8" cy="515.9" rx="10.2" ry="10" style="fill:#5222D0;"/>
<ellipse cx="887.7" cy="650.2" rx="7.8" ry="7.6" style="fill:#5222D0;"/>
<ellipse cx="1064.8" cy="105.2" rx="5.2" ry="5.1" style="fill:#5222D0;"/>
<ellipse cx="505.3" cy="795.8" rx="7.5" ry="7.3" style="fill:#5222D0;"/>
<ellipse cx="1152.2" cy="456.3" rx="1.8" ry="1.8" style="fill:#5222D0;"/>
<ellipse cx="477.6" cy="500.8" rx="9.9" ry="9.7" style="fill:#EC615B;"/>
<ellipse cx="487.5" cy="480.9" rx="0" ry="3.1" style="fill:#EC615B;"/>
<ellipse cx="516.2" cy="767.6" rx="3.4" ry="3.3" style="fill:#EC615B;"/>
<ellipse cx="333.8" cy="222.8" rx="7.4" ry="7.2" style="fill:#EC615B;"/>
<ellipse cx="1045.7" cy="70.2" rx="0" ry="1.2" style="fill:#EC615B;"/>
<ellipse cx="1089.6" cy="386.3" rx="7.4" ry="7.2" style="fill:#EC615B;"/>
<ellipse cx="1119.5" cy="360.6" rx="6.2" ry="6" style="fill:#EC615B;"/>
<g>
<g>
<path d="M444.5,656.5c-9.2,0.2-13.1,13-10.1,20.6c1.4,3.5,4.5,4.4,8,3.8c1.1-0.2,2.5-0.9,3.7-0.9
c4.7,0.3,4.6,3.2,3.2,6c-1,2-2.1,3.6-2.6,5.8c-0.6,2.8-0.1,5.9,2.8,7.1c1.6,0.7,3.5-0.5,4.9,0c5,1.6,1,7.9,0.6,11
c-0.4,3.4,0.5,7.3,3.8,8.9c2.9,1.4,6.4,0.5,7.9-2.4c0.9-1.7-1.7-3.2-2.6-1.5c-3.4,2.7-5.4,1.7-6.2-3.2c0-1.4,0.2-2.7,0.6-4
c0.5-2.2,1.5-4.2,1.7-6.5c0.1-1.6,0-3.3-1.2-4.5c-2.4-2.2-8.2,1-9.5-2.9c-0.8-2.4,2.8-6.4,3.5-8.6c1.4-4.3-0.3-8.6-5.4-8.5
c-4.2,0.1-9.2,4.4-10.7-3.1c-1.1-5.2,1.4-14.1,7.8-14.2C446.4,659.4,446.5,656.4,444.5,656.5L444.5,656.5z" style="fill:#EC615B;"/>
</g>
</g>
<g>
<g>
<path d="M1001.8,557.5c-10.1,0.2-19.5,7.2-21.9,17.2c-2.1,8.7,3.3,19.1,13.2,13.7c3.5-1.9,7-5.3,7.6-9.5
c0.4-3.3-1.7-6.1-5.2-5.8c-4.9,0.4-9.4,6.2-12,9.8c-3,4.1-6.1,9.8-5.6,15.1c1,9.1,14.1,10.9,18.7,3.7c0.8-1.2-0.8-3-2.1-2.1
c-6.9,5.3-14.1,14-11.4,23.4c2.1,7.4,10.1,12.7,17.6,10.1c1.8-0.6,1-3.5-0.8-2.9c-6.7,2.3-13.7-3.3-14.3-10.1
c-0.6-7.3,4.9-13.7,10.4-17.9c-0.7-0.7-1.4-1.4-2.1-2.1c-2,3.2-6.5,3.9-9.8,2.2c-4.7-2.5-3.4-7.9-1.6-11.9
c1.5-3.4,3.7-6.5,6.2-9.2c1-1.1,3.6-4.1,5-4.3c1.3,0.3,2.7,0.7,4,1c-0.1,1.3-0.5,2.4-1.2,3.5c-2.7,4.4-9.5,7.9-13.2,2.8
c-2.5-3.3-0.9-9.5,0.8-12.8c3.4-6.6,10.2-10.8,17.5-10.9C1003.7,560.4,1003.7,557.4,1001.8,557.5L1001.8,557.5z" style="fill:#EC615B;"/>
</g>
</g>
<g>
<g>
<path d="M216.4,406c3.2-3.9,8.7-2.6,10.3,1.9c1,2.7,0.9,5,3.4,6.9c4.5,3.4,10.5,0.8,15.3-0.2
c12.5-2.5,8.4,10,15.5,14.9c3.1,2.2,7.8,1.6,9.4-2c0.8-1.7-1.8-3.3-2.6-1.5c-2.6,5.8-7.4-1.7-8.2-4c-0.5-1.4-0.8-2.8-1.4-4.1
c-0.9-2.1-2.1-4.1-4.1-5.4c-5.6-3.5-11.8,0.8-17.5,0.9c-6.1,0.2-5.5-4-7.6-8.1c-0.9-1.8-2.4-3.1-4.3-3.9
c-3.7-1.4-7.9-0.6-10.3,2.5C213,405.4,215.2,407.5,216.4,406L216.4,406z" style="fill:#EC615B;"/>
</g>
</g>
<g>
<g>
<path d="M227.1,434.3c6.3-6.8,15.4-3.6,19.1,3.8c2.3,4.6,3.9,9.6,8.9,11.9c7.6,3.5,17.5-0.4,20.1-8.3
c0.6-1.8-2.3-2.6-2.9-0.8c-1.9,5.8-8.9,8.6-14.5,6.9c-6.9-2-7.4-9.9-11.2-14.9c-5.2-6.9-15.8-7-21.6-0.7
C223.7,433.6,225.8,435.7,227.1,434.3L227.1,434.3z" style="fill:#EC615B;"/>
</g>
</g>
<g>
<g>
<path d="M936.8,873.4c3.7-4.3,8.7-4.2,13.2-1.2c1.5,1,3,2,4.9,1.3c2.4-0.9,2.8-4.1,4.5-5.7c3.5-3.3,9.3-3.3,12.9-0.3
c1.5,1.2,3.6-0.9,2.1-2.1c-5.4-4.5-14.3-4.1-18.6,1.9c-0.4,0.6-0.9,2.2-1.4,2.5c-2.3,1.5-3.2-0.8-4.7-1.4
c-1.6-0.6-3.1-1.3-4.8-1.4c-4-0.3-7.7,1.3-10.3,4.3C933.5,872.7,935.6,874.8,936.8,873.4L936.8,873.4z" style="fill:#5222D0;"/>
</g>
</g>
<g>
<g>
<path d="M966.1,878.5c6.8-10.1,31.4,3.6,33.9-12.6c0.3-1.9-2.6-2.7-2.9-0.8c-1.3,8.5-13.1,6.5-19.1,6.3
c-5.6-0.1-11.2,0.7-14.5,5.6C962.4,878.6,965,880.1,966.1,878.5L966.1,878.5z" style="fill:#5222D0;"/>
</g>
</g>
<g>
<g>
<path d="M436.1,920.5c3.9-6.7,9.1-12.3,15.5-16.6c1.6-1.1,0.1-3.7-1.5-2.6c-6.8,4.7-12.4,10.6-16.6,17.7
C432.5,920.6,435.1,922.1,436.1,920.5L436.1,920.5z" style="fill:#5222D0;"/>
</g>
</g>
<g>
<g>
<path d="M450.3,915.7c5.3-3.6,10.6-7.3,15.9-10.9c1.6-1.1,0.1-3.7-1.5-2.6c-5.3,3.6-10.6,7.3-15.9,10.9
C447.2,914.2,448.7,916.8,450.3,915.7L450.3,915.7z" style="fill:#5222D0;"/>
</g>
</g>
</g>
<g id="gifts">
<g id="lines">
<g>
<g>
<path d="M446.8,63.2c-0.9,77.6-20.9,154.6-57.6,223c-10.3,19.3-22,37.8-34.8,55.5c-1.1,1.6,1.5,3.1,2.6,1.5
c45.8-63.3,76.1-137.5,87.6-214.9c3.2-21.6,4.9-43.4,5.2-65.2C449.9,61.3,446.9,61.3,446.8,63.2L446.8,63.2z" style="fill:#E8E8E8;"/>
</g>
</g>
<g>
<g>
<path d="M459.3,66.5c48.8,29.9,109.2,39.1,164.9,26.6c15.8-3.5,31.1-8.9,45.6-15.8c1.7-0.8,0.2-3.4-1.5-2.6
c-50.7,24.2-110.6,27.2-163.8,9.6c-15.3-5.1-30-11.9-43.7-20.3C459.2,62.9,457.7,65.5,459.3,66.5L459.3,66.5z" style="fill:#E8E8E8;"/>
</g>
</g>
<g>
<g>
<path d="M694.6,76.6c21.3,33.8,55.2,58.8,93.4,70.2c46.1,13.8,95.8,4.7,141.2-7.5c25.3-6.8,50-16.1,72-30.3
c1.6-1,0.1-3.6-1.5-2.6c-19.4,12.4-40.7,21.1-62.7,27.6c-23,6.7-46.8,11.9-70.6,14.8c-22.9,2.8-46.2,2.8-68.7-2.5
c-19-4.5-37.2-12.5-53.5-23.3c-18.8-12.5-34.9-28.8-47-47.9C696.2,73.5,693.6,75,694.6,76.6L694.6,76.6z" style="fill:#E8E8E8;"/>
</g>
</g>
<g>
<g>
<path d="M1013,111c-7,38.2-12.4,78.2-10.5,117.1c1.5,31.9,10.2,65.2,36.2,85.8c15.5,12.3,34.4,19.1,52.9,25.7
c1.8,0.7,2.6-2.2,0.8-2.9c-16.3-5.9-33-11.8-47.3-21.8c-13.7-9.5-23.8-22.8-30.1-38.2c-12.3-30.2-10.7-64.5-8.2-96.4
c1.8-23,4.9-45.9,9-68.6C1016.2,109.9,1013.3,109.1,1013,111L1013,111z" style="fill:#E8E8E8;"/>
</g>
</g>
<g>
<g>
<path d="M362.1,360.3c74.6,11.7,143.4,54.4,187.3,115.9c12.3,17.3,22.6,36,30.4,55.7c0.7,1.8,3.6,1,2.9-0.8
c-28-70.6-86.5-127-156.4-155.9c-20.4-8.4-41.7-14.4-63.4-17.8C361,357.1,360.2,360,362.1,360.3L362.1,360.3z" style="fill:#E8E8E8;"/>
</g>
</g>
<g>
<g>
<path d="M599.1,534.4c35.3-27.4,82.1-34.2,125.4-27.8c46.2,6.8,88.1,29,125.9,55.6c22.8,16,44.3,33.7,65.8,51.4
c1.5,1.2,3.6-0.9,2.1-2.1c-38.8-32-78.2-64.4-123.9-86.1c-40.8-19.4-86.8-29.1-131.8-21.4c-23.8,4.1-46.4,13.4-65.6,28.2
C595.5,533.5,597.6,535.6,599.1,534.4L599.1,534.4z" style="fill:#E8E8E8;"/>
</g>
</g>
<g>
<g>
<path d="M914.9,595.1c17.2-74.3,64.1-140.3,126.9-183.2c18-12.3,37.3-22.7,57.5-30.9c1.8-0.7,1-3.6-0.8-2.9
c-71.6,29.2-131.5,85.3-165,155c-9.4,19.6-16.6,40.1-21.5,61.2C911.6,596.2,914.5,597,914.9,595.1L914.9,595.1z" style="fill:#E8E8E8;"/>
</g>
</g>
<g>
<g>
<path d="M463.8,417.3c15,6.4,26.3,19.1,37,31c11.1,12.3,21.3,25.4,30.7,39.1c18.2,26.7,32.7,55.7,43.1,86.3
c0.6,1.8,3.5,1,2.9-0.8c-10.7-31.3-25.7-61.1-44.4-88.4c-9.2-13.4-19.3-26.2-30.2-38.3c-10.9-12-22.4-25-37.6-31.4
C463.6,413.9,462,416.5,463.8,417.3L463.8,417.3z" style="fill:#161616;"/>
</g>
</g>
<g>
<g>
<path d="M691.4,92.6c16.5,26.6,42.4,46.1,72.2,55.3c1.9,0.6,2.6-2.3,0.8-2.9c-29.1-8.9-54.4-28-70.4-53.9
C693,89.4,690.4,91,691.4,92.6L691.4,92.6z" style="fill:#161616;"/>
</g>
</g>
<g>
<g>
<path d="M448.6,41.9c32,21.7,72.5,28.7,110,19.7c1.9-0.5,1.1-3.3-0.8-2.9c-36.8,8.9-76.4,1.8-107.7-19.4
C448.5,38.3,447,40.9,448.6,41.9L448.6,41.9z" style="fill:#161616;"/>
</g>
</g>
<g>
<g>
<path d="M342.6,322.1c16-17.7,29.9-37.1,41.4-58c0.9-1.7-1.7-3.2-2.6-1.5c-11.4,20.7-25.1,39.9-40.9,57.4
C339.2,321.4,341.3,323.5,342.6,322.1L342.6,322.1z" style="fill:#161616;"/>
</g>
</g>
<g>
<g>
<path d="M439.7,204.9c-1.4,14.2-8.9,27.6-14.7,40.4c-6,13.1-12.2,26-18.5,38.9c-0.9,1.7,1.7,3.2,2.6,1.5
c7-14,13.7-28.2,20.2-42.5c5.6-12.3,12.2-24.8,13.5-38.4C442.9,203,439.9,203,439.7,204.9L439.7,204.9z" style="fill:#161616;"/>
</g>
</g>
<g>
<g>
<path d="M905.3,542.5c15.7-40.5,41-76.8,73.4-105.7c1.4-1.3-0.7-3.4-2.1-2.1c-32.8,29.3-58.3,66-74.2,107
C901.7,543.5,904.6,544.2,905.3,542.5L905.3,542.5z" style="fill:#161616;"/>
</g>
</g>
<g>
<g>
<path d="M434.8,84.4c-1.7,10.7-3.5,21.4-5.2,32.1c-0.3,1.9,2.6,2.7,2.9,0.8c1.7-10.7,3.5-21.4,5.2-32.1
C438,83.3,435.1,82.5,434.8,84.4L434.8,84.4z" style="fill:#EC615B;"/>
</g>
</g>
<g>
<g>
<path d="M690.6,50.3c21.6,25.8,48.4,46.8,78.6,61.6c1.7,0.8,3.2-1.7,1.5-2.6c-30-14.7-56.6-35.5-78-61.1
C691.5,46.7,689.4,48.8,690.6,50.3L690.6,50.3z" style="fill:#EC615B;"/>
</g>
</g>
<g>
<g>
<path d="M867.7,166.8c25.2,1.2,50.3-3.7,73.1-14.5c1.7-0.8,0.2-3.4-1.5-2.6c-22.4,10.5-46.9,15.3-71.6,14.1
C865.7,163.7,865.8,166.7,867.7,166.8L867.7,166.8z" style="fill:#EC615B;"/>
</g>
</g>
<g>
<g>
<path d="M957,121c21.3-10.4,40.5-24.4,56.9-41.6c1.3-1.4-0.8-3.5-2.1-2.1c-16.2,17-35.2,30.8-56.3,41.1
C953.8,119.2,955.3,121.8,957,121L957,121z" style="fill:#EC615B;"/>
</g>
</g>
<g>
<g>
<path d="M605.2,515.2c25.2-26.5,63.6-38.7,99.6-32.3c1.9,0.3,2.7-2.6,0.8-2.9c-37.1-6.6-76.5,5.7-102.5,33.1
C601.7,514.4,603.8,516.6,605.2,515.2L605.2,515.2z" style="fill:#EC615B;"/>
</g>
</g>
<g>
<g>
<path d="M382.3,347.8c21.2,4.4,41.6,11.5,60.9,21.3c1.7,0.9,3.2-1.7,1.5-2.6c-19.5-9.9-40.2-17.2-61.6-21.6
C381.2,344.5,380.4,347.4,382.3,347.8L382.3,347.8z" style="fill:#5222D0;"/>
</g>
</g>
<g>
<g>
<path d="M461,104.1c1.2,11.7,1.4,23.5,0.7,35.2c-0.1,1.9,2.9,1.9,3,0c0.7-11.8,0.4-23.5-0.7-35.2
C463.8,102.2,460.8,102.2,461,104.1L461,104.1z" style="fill:#5222D0;"/>
</g>
</g>
<g>
<g>
<path d="M851.6,506.7c11.8-23,30.9-41.3,54.1-52.6c1.7-0.8,0.2-3.4-1.5-2.6C880.5,463,861,481.8,849,505.2
C848.1,506.9,850.7,508.5,851.6,506.7L851.6,506.7z" style="fill:#5222D0;"/>
</g>
</g>
<g>
<g>
<path d="M789,291.1c8.8-6.1,19-8.9,29.7-8.3c1.9,0.1,1.9-2.9,0-3c-11.2-0.6-22,2.4-31.2,8.8
C785.9,289.6,787.4,292.2,789,291.1L789,291.1z" style="fill:#EC615B;"/>
</g>
</g>
<g>
<g>
<path d="M813.3,264.1c8.7,1.8,17.1,4.3,25.3,7.6c1.8,0.7,2.6-2.2,0.8-2.9c-8.2-3.3-16.6-5.8-25.3-7.6
C812.2,260.8,811.4,263.7,813.3,264.1L813.3,264.1z" style="fill:#EC615B;"/>
</g>
</g>
<g>
<g>
<path d="M595.3,187c3.1-14,10.2-26.5,20.4-36.6c1.4-1.4-0.7-3.5-2.1-2.1c-10.6,10.4-18,23.4-21.2,37.9
C591.9,188.1,594.8,188.9,595.3,187L595.3,187z" style="fill:#EC615B;"/>
</g>
</g>
<g>
<g>
<path d="M617.3,190.2c14.9-11.6,31.7-20.3,49.8-25.9c1.8-0.6,1.1-3.5-0.8-2.9c-18.6,5.7-35.8,14.7-51.1,26.6
C613.7,189.3,615.8,191.4,617.3,190.2L617.3,190.2z" style="fill:#EC615B;"/>
</g>
</g>
<g>
<g>
<path d="M587.2,388c3.7,9.6,4.1,19.6,1.3,29.5c-0.5,1.9,2.4,2.7,2.9,0.8c3-10.4,2.5-21-1.3-31.1
C589.4,385.4,586.5,386.2,587.2,388L587.2,388z" style="fill:#5222D0;"/>
</g>
</g>
<g>
<g>
<path d="M612.8,391.3c5.3,6.4,11.9,11.6,19.3,15.3c1.7,0.9,3.2-1.7,1.5-2.6c-7.3-3.6-13.6-8.6-18.7-14.9
C613.7,387.7,611.6,389.8,612.8,391.3L612.8,391.3z" style="fill:#5222D0;"/>
</g>
</g>
<g>
<g>
<path d="M938.9,371.6c4.5,5,6.5,11.5,5.4,18.2c-0.3,1.9,2.6,2.7,2.9,0.8c1.3-7.8-0.9-15.3-6.2-21.1
C939.7,368,937.6,370.1,938.9,371.6L938.9,371.6z" style="fill:#5222D0;"/>
</g>
</g>
<g>
<g>
<path d="M963.8,367c3.7,4.2,7.3,8.3,11,12.5c1.3,1.5,3.4-0.7,2.1-2.1c-3.7-4.2-7.3-8.3-11-12.5
C964.7,363.4,962.6,365.5,963.8,367L963.8,367z" style="fill:#5222D0;"/>
</g>
</g>
<g>
<g>
<path d="M818.7,402.8c6.9-12.1,16-22.6,27.1-31c1.5-1.2,0-3.8-1.5-2.6c-11.5,8.8-21,19.5-28.2,32.1
C815.2,403,817.8,404.5,818.7,402.8L818.7,402.8z" style="fill:#5222D0;"/>
</g>
</g>
<ellipse cx="1181.5" cy="172.4" rx="14.6" ry="14.2" style="fill:#EC615B;"/>
<ellipse cx="1220.7" cy="203.9" rx="0" ry="1" style="fill:#EC615B;"/>
<ellipse cx="1208.4" cy="206.8" rx="12.3" ry="11.9" style="fill:#5222D0;"/>
</g>
<g id="presents">
<path d="M470.6,286.2c1.4,7.3,3.1,15,5.3,23c7.3,26.1,17.7,47.9,28,65.3c3,0.7,7.3,1.7,12.6,2.3
c7.3,0.9,19.1,2.4,32.4-1.4c3.2-0.9,1.8-0.8,15.9-6.6c14.1-5.8,14.9-5.6,20.3-8c9.2-4,17.5-9.8,33.8-21.1
c4.7-3.3,11.2-7.9,18.8-13.6c0.5-3.2,1.1-7.9,1-13.6c-0.2-9-2.1-15.5-4.8-24.9c-4.3-14.7-7.3-24.7-9.2-31c-3.8-2.4-7.9-4.8-12.6-7
c-15.5-7.5-30.2-10.5-41.5-11.7c-11.6,0.9-20.8,3-27,4.7c-27.2,7.5-45.9,21.6-57.5,30.5C479.2,278.3,473.9,283,470.6,286.2z" style="fill:#FFFFFF;"/>
<path d="M893.2,249.5c-8,8.6-16.5,18.9-24.6,31c-4,6-7.5,11.8-10.6,17.4c6.1,9.1,12.2,18.2,18.4,27.2
c13.7,5.3,27.4,10.6,41.1,16c13-13.6,26.1-27.2,39.1-40.9c-3.4-11-6.8-21.9-10.1-32.9c-6.7-3.4-14.4-6.8-23.2-9.9
C912.1,253.6,902,251.1,893.2,249.5z" style="fill:#FFFFFF;"/>
<g>
<g>
<path d="M469.6,287.1c3.4,32.2,17.6,61.5,33,89.6c0.9,1.7,3.5,0.2,2.6-1.5c-15.1-27.5-29.3-56.4-32.6-88.1
C472.4,285.2,469.4,285.1,469.6,287.1L469.6,287.1z" style="fill:#161616;"/>
</g>
</g>
<g>
<g>
<path d="M472.4,287.9c24.5-26.7,58.1-44,94-48.7c1.9-0.2,1.9-3.2,0-3c-36.7,4.8-71.1,22.2-96.2,49.5
C469,287.2,471.1,289.3,472.4,287.9L472.4,287.9z" style="fill:#161616;"/>
</g>
</g>
<g>
<g>
<path d="M566.6,238.8c16.3,24.5,23.9,53,31.2,81.1c0.5,1.9,3.4,1.1,2.9-0.8c-7.4-28.4-15.1-57.1-31.5-81.8
C568.1,235.7,565.5,237.2,566.6,238.8L566.6,238.8z" style="fill:#161616;"/>
</g>
</g>
<g>
<g>
<path d="M506.1,376.6c18.3-5.5,35.9-12.8,52.7-21.9c8.3-4.5,16.3-9.5,24.1-14.9c7-4.8,14.3-9.8,18.1-17.6
c0.9-1.7-1.7-3.2-2.6-1.5c-4.1,8.3-12.5,13.5-19.9,18.5c-7.3,4.9-14.9,9.5-22.7,13.7c-16.1,8.6-33,15.5-50.4,20.8
C503.5,374.3,504.3,377.2,506.1,376.6L506.1,376.6z" style="fill:#161616;"/>
</g>
</g>
<g>
<g>
<path d="M568.2,239c19.8,0.8,38.8,7.4,54.8,19.2c1.6,1.1,3.1-1.5,1.5-2.6c-16.4-12.1-35.9-18.8-56.3-19.6
C566.3,235.9,566.3,238.9,568.2,239L568.2,239z" style="fill:#161616;"/>
</g>
</g>
<g>
<g>
<path d="M622.8,256.9c9.1,20.9,13.9,43.3,14,66.2c0,1.9,3,1.9,3,0c-0.2-23.4-5.1-46.3-14.5-67.7
C624.6,253.6,622.1,255.1,622.8,256.9L622.8,256.9z" style="fill:#161616;"/>
</g>
</g>
<g>
<g>
<path d="M599.1,322.5c12.4,8,27.1,5.8,40.6,2.2c1.9-0.5,1.1-3.4-0.8-2.9c-12.7,3.4-26.5,5.6-38.2-1.9
C599,318.9,597.5,321.5,599.1,322.5L599.1,322.5z" style="fill:#161616;"/>
</g>
</g>
<g>
<g>
<path d="M504.5,377.1c17.8,4,36.3,2.7,53.3-4c1.8-0.7,1-3.6-0.8-2.9c-16.5,6.5-34.4,8-51.7,4
C503.4,373.8,502.6,376.7,504.5,377.1L504.5,377.1z" style="fill:#161616;"/>
</g>
</g>
<g>
<g>
<path d="M558.6,372.9c29.7-11.2,57.3-27.3,81.5-47.9c1.5-1.3-0.7-3.4-2.1-2.1c-23.8,20.2-50.9,36.1-80.1,47.1
C556,370.7,556.8,373.6,558.6,372.9L558.6,372.9z" style="fill:#161616;"/>
</g>
</g>
<g>
<g>
<path d="M890.9,249.2c-12.7,15-24.3,30.9-34.7,47.5c-1,1.6,1.6,3.1,2.6,1.5c10.3-16.4,21.8-32.1,34.2-46.9
C894.3,249.9,892.2,247.7,890.9,249.2L890.9,249.2z" style="fill:#161616;"/>
</g>
</g>
<g>
<g>
<path d="M892.3,251.8c18,2.9,35.3,8.6,51.4,16.9c1.7,0.9,3.2-1.7,1.5-2.6c-16.4-8.5-33.9-14.2-52.2-17.2
C891.2,248.6,890.4,251.5,892.3,251.8L892.3,251.8z" style="fill:#161616;"/>
</g>
</g>
<g>
<g>
<path d="M856.3,299.9c15.6,7.1,31,14.5,46.3,22.3c1.7,0.9,3.2-1.7,1.5-2.6c-15.3-7.7-30.7-15.1-46.3-22.3
C856,296.5,854.5,299.1,856.3,299.9L856.3,299.9z" style="fill:#161616;"/>
</g>
</g>
<g>
<g>
<path d="M944.5,267.3c-13.4,17.9-26.4,36.1-39,54.6c0.7-0.2,1.4-0.4,2.1-0.5c-1.1-0.6-2.2-1.3-3.4-1.9
c-1.7-1-3.2,1.6-1.5,2.6c1.1,0.6,2.2,1.3,3.4,1.9c0.7,0.4,1.6,0.1,2.1-0.5c12.5-18.5,25.5-36.8,39-54.6
C948.2,267.3,945.6,265.8,944.5,267.3L944.5,267.3z" style="fill:#161616;"/>
</g>
</g>
<g>
<g>
<path d="M944.2,269c4.5,10.5,7.8,21.3,10,32.5c0.4,1.9,3.3,1.1,2.9-0.8c-2.2-11.4-5.7-22.5-10.3-33.2
C946.1,265.8,943.5,267.3,944.2,269L944.2,269z" style="fill:#161616;"/>
</g>
</g>
<g>
<g>
<path d="M906.5,324.2c3.9,5.2,7.3,10.6,10.3,16.4c0.9,1.7,3.5,0.2,2.6-1.5c-3-5.8-6.4-11.2-10.3-16.4
C908,321.2,905.4,322.7,906.5,324.2L906.5,324.2z" style="fill:#161616;"/>
</g>
</g>
<g>
<g>
<path d="M919.4,340.4c13-12,25.2-24.6,36.8-37.9c1.3-1.5-0.9-3.6-2.1-2.1c-11.6,13.3-23.8,26-36.8,37.9
C915.9,339.6,918,341.7,919.4,340.4L919.4,340.4z" style="fill:#161616;"/>
</g>
</g>
<g>
<g>
<path d="M856.6,300.7c6.4,8.3,12.8,16.7,19.2,25c1.2,1.5,3.8,0,2.6-1.5c-6.4-8.3-12.8-16.7-19.2-25
C858,297.7,855.4,299.1,856.6,300.7L856.6,300.7z" style="fill:#161616;"/>
</g>
</g>
<g>
<g>
<path d="M876.4,326.8c13.4,5.1,26.8,10.2,40.2,15.3c1.8,0.7,2.6-2.2,0.8-2.9c-13.4-5.1-26.8-10.2-40.2-15.3
C875.4,323.2,874.6,326.1,876.4,326.8L876.4,326.8z" style="fill:#161616;"/>
</g>
</g>
<path d="M501.2,260.1c12.7,33.6,25.5,67.2,38.2,100.9c9.5,2.7,19.1,5.3,28.6,8c7.1-3.2,14.2-6.5,21.3-9.7
c-8.1-3.5-16.2-7-24.3-10.5c-13-34-26-68.1-39-102.1c-3.6,1.6-7.4,3.4-11.3,5.5C509.6,254.7,505.2,257.5,501.2,260.1z" style="fill:#EC615B;"/>
<path d="M592.7,240.3c8.2,14.8,17.1,35.5,20.8,61.2c1.2,8.4,1.7,16.4,1.7,23.6c-15.9,12.2-35.3,25.1-58.6,37.1
c-13,6.7-25.6,12.3-37.3,16.9c6.5,0,13,0,19.5,0c13.9-5.8,29.3-13.1,45.6-22.4c17.7-10.1,32.9-20.6,45.6-30.4
c-2.4-12-5-24.3-7.8-36.7c-3.1-13.7-6.3-27-9.5-40.1c-1.8-1.8-4.8-4.3-9.1-6.3C599.2,241.2,595.3,240.5,592.7,240.3z" style="fill:#EC615B;"/>
<path d="M513.3,252.5c-2.2-1.8,0.7-12.6,8.7-16c6.1-2.6,14-0.5,19.5,5.5c-3.1,0.9-7.8,2.3-13.4,4.6
C518.1,250.7,514.8,253.7,513.3,252.5z" style="fill:#EC615B;"/>
<path d="M527.2,242c4.7-3,11.5-8.2,17.4-16.5c10.1-14.3,10.9-28.9,10.8-35c1.7-0.5,11.8-3.6,17.4,1.3
c7.6,6.6,0.6,22.4-0.9,25.7c-4.4,9.9-11.6,15.3-13.9,16.9C545.2,243.4,531.2,242.4,527.2,242z" style="fill:#EC615B;"/>
<path d="M476,215.4c5-0.8,7.8,8.1,18.2,16.9c9.3,7.8,19.7,11.3,27.8,13.1c-3.4,2.6-9.8,6.9-18.7,8
c-12.9,1.6-30.5-3.3-34.7-15.6C465.5,228.5,470.4,216.2,476,215.4z" style="fill:#EC615B;"/>
<path d="M911.6,253.3c-12.9,17.2-25.9,34.4-38.8,51.6c4.6,8.4,9.2,16.8,13.9,25.2c4,1.6,8,3.3,12,4.9
c-2.9-7-5.8-14.1-8.8-21.1c11.5-18.9,23.1-37.7,34.6-56.6C920.2,256,915.9,254.7,911.6,253.3z" style="fill:#5222D0;"/>
<path d="M950.8,281.1c-13.2,14.7-26.5,29.3-39.7,44c-15.4-4.5-30.8-9-46.2-13.5c2.6,3.3,5.2,6.6,7.8,9.9
c14.5,4.8,28.9,9.6,43.4,14.4c12.5-14.1,24.9-28.1,37.4-42.2C952.7,289.5,951.8,285.3,950.8,281.1z" style="fill:#5222D0;"/>
<path d="M924.5,256.9c0.5-2.1,7.9-4.2,12.9-0.4c3.2,2.4,5.1,7.1,3.7,8.5C938.5,267.6,923.8,260.1,924.5,256.9z" style="fill:#5222D0;"/>
<path d="M916.7,224.6c2.2-1.2,6.6,2.6,7.8,3.6c1.2,1,5.4,4.8,8.3,15.7c1.5,5.5,3.7,13.7,1.4,14.8
c-2.6,1.3-10.5-6.9-14.8-15.7C916.1,236,913.8,226.2,916.7,224.6z" style="fill:#5222D0;"/>
<path d="M974.7,260.1c0.2-2.4-5.2-4.3-6.7-4.8c-1.4-0.5-6.7-2.2-18,0.3c-5.7,1.3-14.1,3.2-14.2,5.6
c-0.1,2.8,10.9,5.5,20.8,5C964.5,265.8,974.4,263.2,974.7,260.1z" style="fill:#5222D0;"/>
<path d="M505.3,376.2c5.9-2.1,14.6-5.2,25-9.6c17.7-7.4,30.2-12.6,44.1-22c6.9-4.7,16.2-11.9,26.1-22.4
c4.9-9.8,10.9-24.4,13.2-43c1.4-11.3,1.2-21.3,0.4-29.4c3.6,2.1,7.1,4.2,10.7,6.2c3.6,9.4,7.3,20.9,9.9,34.2
c2.6,12.9,3.7,24.6,4,34.5c-10.8,9.4-20.4,16.4-27.6,21.3c-34.7,23.7-58.6,29.3-63.9,30.5c-8.2,1.8-14.5,2.1-17.3,2.2
C519.4,379.1,510.9,377.5,505.3,376.2z" style="opacity:9.000000e-002;fill:#353535;"/>
<path d="M858.3,298.3c6.4,9.1,12.7,18.2,19.1,27.2c13.3,5.2,26.7,10.3,40,15.5c12.7-13.8,25.4-27.5,38.1-41.3
c-3.1-10.6-6.3-21.2-9.4-31.8c-13,17.6-26,35.2-39,52.8C890.8,313.3,874.5,305.8,858.3,298.3z" style="opacity:9.000000e-002;fill:#353535;"/>
</g>
</g>
<g id="girl">
<g id="leg_right">
<path d="M694.1,1067.7c4-5,6.4-7.3,7.3-6.7c2.3,1.4-5.9,21.6-24.7,60.7c-46.1,2.2-69.5,1.1-70.1-3.4c-0.5-3.9,16.6-10.4,51.3-19.4
c7.6-16.1,15.2-32.2,22.8-48.3C685.2,1056.3,689.6,1062,694.1,1067.7z"/>
<path d="M717.5,748.9c-3.8,26.9-8.2,54.3-13,82.1c-14.2,81.6-31.5,158.9-50.8,231.6c2.8,3.1,10.1,10.2,22.1,13.5
c15.1,4.1,27.6-0.4,31.2-1.8c22.6-79,45.1-158.1,67.7-237.1c29.7-32.4,24-74.3,1.3-89.5C761,737.7,737.8,739.1,717.5,748.9z" style="fill:#EC615B;"/>
<path d="M718.7,750.6c2.9,0.3,1.1,45.2-1.2,85.6c-5.2,91.7-22.3,172.2-42.6,239.3c-2.2-0.6-4.8-1.5-7.4-2.8
c-6.4-3.2-10.7-7.4-13.2-10.4c6.1-21.8,14.9-54.6,24-94.8C706.8,841.6,714.6,750.3,718.7,750.6z" style="opacity:0.15;fill:#353535;"/>
<path d="M701.8,855.5c-2.2,26.4-5.4,54.2-9.9,83.2c-7.3,47.7-17,91.5-27.7,131.2c-1.2-0.2-3-0.7-5-2
c-2.7-1.8-4-4.1-4.5-5.2c8-33.3,15.8-66.9,23.6-100.8C686.4,926.1,694.2,890.6,701.8,855.5z" style="opacity:0.13;fill:#353535;"/>
</g>
<g id="leg_left">
<path d="M885.6,1064.7c-4.4-5-7.1-7.3-8.1-6.7c-2.5,1.4,6.5,21.6,27.1,60.7c50.7,2.2,76.3,1.1,77-3.4c0.6-3.9-18.2-10.4-56.4-19.4
c-8.4-16.1-16.7-32.2-25.1-48.3C895.3,1053.3,890.5,1059,885.6,1064.7z"/>
<path d="M755.9,772.8c-3.7,17.8,4.7,32.5,7.8,37.4c33,88.2,65.9,176.5,98.9,264.7c5.6,0.8,17.2,1.6,30.6-3.1
c15.1-5.3,23.9-14.8,27.3-19c-19.7-42-32.1-77.2-39.7-101.1c-19.9-62.5-46.7-122.9-65.7-185.7c-3.2-10.5-8.6-28.9-20.8-31.2
C780.1,732.2,760.2,751.8,755.9,772.8z" style="fill:#EC615B;"/>
<path d="M786.9,735.4c-6.9,5,5.9,31.7,12,45c14.7,32.1,22.3,67,36.4,99.4c15.2,34.9,37.5,91.4,69,186.2
c2.2-1.1,5-2.6,7.8-4.9c3.7-3,6.2-6.1,7.8-8.5c-7.9-17.1-19.3-43-31.3-75.3c-4.3-11.5-4.8-13.6-9.5-28
c-5-15.3-12.8-38.5-14.4-43.2c-7.5-21.6-7.5-18.7-21.6-57c-3-8.1-7.1-19.3-12-33.9c-2.4-7.1-4.2-12.8-5.5-16.9
c-0.2-0.6-6.8-21.1-16.1-45.4c-2.4-6.4-5-12.7-11.5-16C797.6,736.6,790.3,732.9,786.9,735.4z" style="opacity:0.1;fill:#353535;"/>
<path d="M835.7,828.5c-0.6,0.2,12.8,41.9,76.9,232.1c2.6-2.5,5.2-5,7.8-7.6c-3.9-8.7-10-22.5-17-39.7
c-16.1-39.3-23-62.2-41-112.7C852.4,872.5,836.3,828.3,835.7,828.5z" style="opacity:0.12;fill:#353535;"/>
</g>
<g id="hand_left">
<path d="M864,456.1c-2.3,0.2-3.9-6.6-6.4-6.5c-2,0.1-3.4,4.6-3.5,5.2c-1.2,4.1-0.6,8.3,3.5,19.3
c1.2,3.2,2.8,7.3,4.9,12c-1.1,7.8-3.1,18.6-6.7,31.3c-4.5,15.7-12.1,41.5-32.2,68.1c-6.2,8.2-15.5,19.1-29,30.3
c-4.5,10.8-5.1,19.8-4.9,25.4c0.1,3.3,0.5,18.2,6,19.6c3.7,0.9,8.1-4.5,10.3-7.2c22.4-28.3,33.7-42.4,38.2-50.6
c10.5-18.8,19-34.1,26.2-57.1c5.3-16.8,7.8-31.5,9.2-42.3c2.3-3.8,5.5-9.2,9.2-15.8c10.1-18,13.7-26.1,15.9-35.1
c2.3-9.3,2.7-17.3,0.4-18.2c-1.7-0.6-3.8,2.5-5.7,1.7c-2.8-1.2,0.2-9.5-2.8-11.3c-1.1-0.7-3.3-0.6-7.8,2.4
c-3.1-6.5-5.1-7.7-6.4-7.6c-2.7,0.4-4,7.8-4.6,16.2c-0.8-4.1-2.8-12.7-5.3-12.7c-2.1,0-4.3,6.3-4.9,11.3
c-0.9,6.9,1.1,11.9-1.4,18.9C865.7,454.4,865,455.9,864,456.1z" style="fill:#FFFFFF;"/>
<g>
<g>
<path d="M860.5,484.8c-0.3,13.2-4.5,25.9-8.5,38.4c-3.9,11.8-8.3,23.5-13.7,34.7c-10,20.8-23.5,39.8-41.2,54.7
c-1.5,1.2,0.7,3.4,2.1,2.1c18.4-15.4,32.2-35.3,42.4-56.9c5.3-11.2,9.7-22.8,13.5-34.6c4-12.4,8.1-25.1,8.3-38.3
C863.6,482.9,860.6,482.9,860.5,484.8L860.5,484.8z" style="fill:#161616;"/>
</g>
</g>
<g>
<g>
<path d="M878.3,502.2c-2.7,31.6-16.5,61.3-30.5,89.3c-12.8,25.6-28.3,50.5-51.4,68c-1.5,1.2,0,3.8,1.5,2.6
c23.6-17.9,39.5-43,52.5-69.1c14.3-28.5,28.1-58.7,30.9-90.8C881.4,500.3,878.4,500.3,878.3,502.2L878.3,502.2z" style="fill:#161616;"/>
</g>
</g>
<g>
<g>
<path d="M863,483.2c-3.4-7.3-6.6-15.8-7.1-23.9c-0.1-1.1-0.3-5.8,0.5-6.4c2.5-1.7,3.2,1.2,3.8,2.4
c1.1,2.1,1.9,3.6,4,4.8c1.7,0.9,3.2-1.6,1.5-2.6c-3.5-2-3.2-7.5-7.2-9c-3.4-1.3-4.6,1.5-5.3,4.4c-2.4,10.3,2.8,22.6,7,31.8
C861.3,486.5,863.8,484.9,863,483.2L863,483.2z" style="fill:#161616;"/>
</g>
</g>
<g>
<g>
<path d="M866.4,459.2c3.4-7.8,2.6-15.8,2.9-24.1c0.1-1.9-0.3-6.3,0.8-7.8c2-2.5,3.5,2.8,4,4.5
c1.4,5.4,1.7,10.8,1.3,16.3c-0.2,1.9,2.8,1.9,3,0c0.3-3.8-0.1-30.3-8.6-26c-3.5,1.8-3.3,8.9-3.4,12c-0.3,7.9,0.8,16-2.5,23.5
C863.1,459.4,865.7,461,866.4,459.2L866.4,459.2z" style="fill:#161616;"/>
</g>
</g>
<g>
<g>
<path d="M878.7,448.3c0.6-3.6,1.1-7.2,1.4-10.9c0.3-4.1-0.3-8.7,1-12.6c1.1-3.6,1.7-4.3,3.2-1.1
c1.1,2.3,1.5,4.7,1.8,7.1c0.5,4.5,0.9,9.8-0.5,14.2c-0.6,1.9,2.3,2.6,2.9,0.8c1.6-5.3,1.2-11.8,0.3-17.2
c-0.5-2.9-2.1-10.5-6-10.5c-3.4,0-4.8,5.7-5.1,8.1c-1,7-0.8,14.2-1.9,21.2C875.5,449.4,878.4,450.2,878.7,448.3L878.7,448.3z" style="fill:#161616;"/>
</g>
</g>
<g>
<g>
<path d="M889.6,445.7c0.4-3.1,0.4-6.3,0.4-9.4c0.1-2.7-0.1-9.9,3.3-9.6c2.5,0.2,2.3,2.3,2.5,4.5
c0.1,1.5,0.1,3.1,0.1,4.6c0,3.7-0.2,7.3-0.9,11c-0.4,1.9,2.5,2.7,2.9,0.8c1-4.9,4.4-25-4.6-25.2c-8.3-0.2-6.1,18.8-6.7,23.4
C886.4,447.6,889.4,447.6,889.6,445.7L889.6,445.7z" style="fill:#161616;"/>
</g>
</g>
<g>
<g>
<path d="M900.3,436.9c1.2-0.1,2.3-0.2,3.5-0.3c0.2,0.9,0.4,1.8,0.5,2.8c0.2,1.8,0.3,3.5,0.3,5.3
c-0.1,3.2-0.6,6.5-1.5,9.6c-1.6,6.1-4.3,11.9-7.3,17.5c-5.5,10.4-11.4,20.7-17.1,31c-0.9,1.7,1.7,3.2,2.6,1.5
c4.8-8.7,9.7-17.4,14.5-26.1c4.5-8.1,9-16.6,10.9-25.8c1-5,3.1-16.5-2.1-20c-3.3-2.3-7.6,0.8-7.2,4.6
C897.5,438.8,900.5,438.8,900.3,436.9L900.3,436.9z" style="fill:#161616;"/>
</g>
</g>
<path d="M895.2,425.6c-1.5,0.1-1.9,6.3-2.9,13.7c-1.6,13-3.4,27.6-9.6,39.8c-2,4-5.6,9.9-12.1,16.3
c-1,7.1-2.9,17.3-6.1,29.3c-5.6,21-13.8,50.8-37,78.7c-6.3,7.5-16,17.9-30.3,28c-0.4,9.8-0.8,19.5-1.3,29.3
c6.2-4.7,15.2-12.2,24.5-22.9c12.2-14.1,20.1-30.1,35.4-61.5c12.2-25.1,15.5-34.8,17.5-41.8c3.8-12.8,5.7-23.9,6.7-31.9
c6.8-10.7,11.8-20.2,15.3-27.7c6.1-13,15.9-34,9.9-39.2c-1.7-1.4-4.2-1.3-6.1-1C898.2,430.5,896.6,425.5,895.2,425.6z" style="opacity:8.000000e-002;fill:#353535;"/>
<path d="M891.4,484.2c-5.3,5.6-10.6,11.3-15.9,16.9c-0.5,4.8-1.4,11.9-3.5,20.4c-4,16-9.8,27.2-12.1,31.9
c-5.9,11.8-13.6,29.8-21,56.7c3.3-5.7,20.8-36.1,30.6-62.1c3.7-10,5.7-15.2,7.3-23.3c2-9.7,1.5-14.2,4.1-22
C883.8,494.2,888.2,488,891.4,484.2z" style="opacity:0.1;fill:#353535;"/>
</g>
<g id="hand_right">
<path d="M613.6,434.2c-3.2,0.9-3.3,9.6-2.8,14.5c0.8,8.7,4.2,15.2,5.7,18c6.4,11.8,12.6,22.9,18.9,33.6
c0.8,7.2,2.2,17,5,28.4c4.9,20,11.2,33.6,19.9,52.3c13.8,29.5,22,46.4,39.5,64.4c6.6,6.7,12.6,11.7,16.7,14.9
c1.5-1.7,10.7-12.3,8.9-27.4c-1.4-12.3-9.2-19.8-11.4-21.8c-4.8-4-12.1-10.5-19.6-19.7c-15.8-19.6-22.4-39.2-32-68.6
c-2.6-8-6.1-19.3-9.6-33.2c1.9-6.2,3.5-11.1,4.6-14.2c3.3-9.5,5.4-14.3,3.9-20.4c-0.4-1.6-1.2-4.6-3.2-5.2
c-2.3-0.6-5.8,2.2-8.5,7.3c-1.5-8.2-2.2-15-2.5-20.1c-0.4-7.4-0.2-12.8-1.8-13.2c-1.7-0.4-4.3,5.6-4.6,6.2
c-2.5,5.6-2.5,10.9-2.1,14.2c0.8-18.6-1.3-23.3-3.6-23.9c-1.9-0.5-4.3,2-5,2.8c-4.7,5-2.3,12.3-2.1,12.8
c-2.1-11.1-4.3-11.8-5-11.8c-1.8-0.1-3.6,3.9-4.3,6.2c-0.8,2.8-0.3,5.3,0,6.6C617,435.4,615.1,433.8,613.6,434.2z" style="fill:#FFFFFF;"/>
<g>
<g>
<path d="M651.9,485c0.3,12.8,4,25.2,7.8,37.4c3.8,12.1,8.1,24,13.4,35.5c9.9,21.5,23.3,41.4,41.2,56.9
c1.5,1.3,3.6-0.9,2.1-2.1c-17.3-15-30.3-34-40-54.7c-5.3-11.2-9.6-22.9-13.3-34.7c-4-12.5-8-25.2-8.3-38.4
C654.8,483.1,651.8,483.1,651.9,485L651.9,485z" style="fill:#161616;"/>
</g>
</g>
<g>
<g>
<path d="M634.7,502.5c2.6,31.6,15.8,61.3,29.4,89.6c12.6,26.3,28.1,51.9,51.3,70.1c1.5,1.2,3.6-0.9,2.1-2.1
c-22.7-17.7-37.7-42.5-50.2-68c-13.7-28.2-27.1-58-29.7-89.5C637.5,500.6,634.5,500.6,634.7,502.5L634.7,502.5z" style="fill:#161616;"/>
</g>
</g>
<g>
<g>
<path d="M655,485c4.2-9.4,9.5-22.1,6.6-32.6c-0.7-2.6-2-4.7-5-3.5c-3.9,1.5-3.5,7-7,9c-1.7,1-0.2,3.6,1.5,2.6
c1.6-0.9,2.5-2.1,3.4-3.7c0.4-0.8,0.8-2.6,1.5-3.2c3.9-2.9,3.2,3.4,3.2,5.2c-0.2,8.4-3.5,17.2-6.9,24.8
C651.6,485.2,654.2,486.7,655,485L655,485z" style="fill:#161616;"/>
</g>
</g>
<g>
<g>
<path d="M651.6,457.9c-3.1-7.2-2.2-15-2.4-22.6c-0.1-3.2,0.3-11-3.4-12.9c-8.3-4.3-8.8,22.3-8.5,26
c0.2,1.9,3.2,1.9,3,0c-0.4-5.2-0.2-10.4,1-15.5c0.3-1.3,1.4-7.3,3.9-6.2c1.1,0.5,1,7.4,1,8.6c0.2,8.3-0.5,16.3,2.8,24.1
C649.8,461.2,652.4,459.7,651.6,457.9L651.6,457.9z" style="fill:#161616;"/>
</g>
</g>
<g>
<g>
<path d="M640,447.7c-1.1-7-0.9-14.1-1.9-21c-0.3-2.5-1.6-8.2-5.1-8.3c-3.6-0.1-5.2,7.1-5.7,9.7
c-1.1,5.7-1.5,12.4,0.1,18c0.5,1.8,3.4,1.1,2.9-0.8c-1.2-4-0.9-8.6-0.6-12.8c0.2-2.5,0.6-5.1,1.5-7.5c1.5-3.8,2.1-4.6,3.5,0
c1.1,3.7,0.6,8,0.9,11.8c0.3,3.9,0.8,7.8,1.5,11.7C637.4,450.4,640.3,449.6,640,447.7L640,447.7z" style="fill:#161616;"/>
</g>
</g>
<g>
<g>
<path d="M629.5,445.9c-0.6-4.5,1.6-23.7-6.6-23.4c-8.8,0.3-5.4,20.4-4.5,25.2c0.4,1.9,3.3,1.1,2.9-0.8
c-0.7-3.6-0.9-7.3-0.9-11c0-2.7-0.8-8.8,2.4-9.1c3.3-0.3,3.1,7,3.2,9.6c0.1,3.2,0,6.3,0.4,9.4
C626.7,447.8,629.8,447.9,629.5,445.9L629.5,445.9z" style="fill:#161616;"/>
</g>
</g>
<g>
<g>
<path d="M619.2,437.1c0.4-3.7-3.7-6.9-7-4.6c-4.9,3.4-3.1,14.3-2.2,19.1c1.6,8.9,5.6,17.1,9.9,25.1
c4.9,9.3,10,18.5,14.9,27.7c0.9,1.7,3.5,0.2,2.6-1.5c-5.7-10.6-11.6-21.1-17.1-31.8c-2.7-5.3-5.2-10.8-6.6-16.7
c-0.8-3.1-1.3-6.3-1.4-9.6c0-1.2,0-2.4,0.1-3.7c0-1.3,0.2-2.6,0.5-3.8c0.1-1.5,1.3-1.6,3.4-0.3C616,439,619,439,619.2,437.1
L619.2,437.1z" style="fill:#161616;"/>
</g>
</g>
<path d="M623.7,425c2.8,1,0.8,13,0.3,17.5c-1.1,10.3,1.2,25.9,17.5,48.1c4.3,21.4,12.5,50.6,29.3,82.2
c14.2,26.8,30.3,47.2,43.7,61.8c1,8.8,1.9,17.6,2.9,26.5c-6.2-4.3-14.8-11.1-23.3-21c-7.4-8.7-11.8-16.3-18.2-28.4
c-16.5-31.3-24.8-47-30.6-66c-3.2-10.4-7-25.4-9.2-44c-7.9-10.2-13.3-19.6-16.9-26.8c-7-13.9-8.8-22.7-8.6-30.6
c0.2-9,1.8-10.2,2.5-10.5c1.5-0.6,3.5,0.6,4.8,1.6c-0.1-0.5-1.1-5,1.9-8.3C620.3,426.7,622.3,424.5,623.7,425z" style="opacity:9.000000e-002;fill:#353535;"/>
<path d="M615.7,460.7c1-0.5,7.1,8.1,11.5,15.3c10.3,16.9,14.5,32,15.6,35.7c6.6,22.9,15.1,42.3,32.2,81
c5.2,11.7,13.1,28.7,24.2,48.8c-3.2-3-7.8-7.5-12.7-13.4c-4.3-5.1-18.4-22.4-33.1-62.1c-5.7-15.5-12.4-36.4-17.2-62.1
c-3.4-5.8-8.1-14.1-13.1-24.5C620.9,474.7,614.6,461.3,615.7,460.7z" style="opacity:9.000000e-002;fill:#353535;"/>
</g>
<g id="torso">
<path d="M757.7,602.4c-3.5-0.3-9.7-0.8-17.8,0c-9.4,1-17.8,1.8-24.1,7.3c-4.7,4.1-6.1,9.2-8.7,19.3
c-1.5,5.9-3.5,13.9-3.3,24.7c0.4,20,8,22.6,12,46.8c2,11.7,1.8,20.8,1.7,31.7c-0.2,14.5-1.7,26.8-3.3,36.3
c4.3,3.4,10.9,8,19.9,11.6c5.5,2.2,21.1,8.1,41.1,4.6c21-3.6,33.9-15.4,38.2-19.7c-7-18.9-7.7-34.1-7.1-44.4
c0.8-12.5,3.4-15.2,7.1-42.1c2.8-20,2.7-28.3,2.5-32.8c-0.7-18-1.1-27.1-7.1-33.2C802.9,606.5,787.8,605.1,757.7,602.4z" style="fill:#FFFFFF;"/>
<g>
<g>
<path d="M752.7,601.7c-7.4-0.5-14.8-0.1-22.1,1.2c-6.2,1.1-12.6,2.2-16.7,7.3c-7.5,9.2-10.7,21.9-11.3,33.5
c-1.5,29.6,13.2,56.6,18.2,85.2c0.3,1.9,3.2,1.1,2.9-0.8c-4.5-25.8-16.9-49.9-18.1-76.3c-0.5-12.1,1.3-24.5,7.5-35.1
c2.1-3.6,4.4-7.1,8.5-8.6c2.8-1,5.9-1.6,8.8-2.2c7.3-1.4,14.8-1.7,22.2-1.3C754.6,604.8,754.6,601.8,752.7,601.7L752.7,601.7z" style="fill:#161616;"/>
</g>
</g>
<g>
<g>
<path d="M713.9,700.1c2.9,22,2.6,44.2-1,66.1c-0.3,1.9,2.6,2.7,2.9,0.8c3.7-22.2,4.1-44.6,1.1-66.9
C716.6,698.2,713.6,698.2,713.9,700.1L713.9,700.1z" style="fill:#161616;"/>
</g>
</g>
<g>
<g>
<path d="M765,604.4c13.4-0.8,29.9,0.8,41.3,8.8c6.9,4.9,7.2,13.1,7.9,20.8c0.7,6.9,1,13.8,0.5,20.8
c-2,27.3-13,53.2-12.9,80.8c0,1.9,3,1.9,3,0c-0.1-31.1,14.1-60.4,13.1-91.6c-0.4-11.9,0-27.2-11.4-34.2
c-11.9-7.3-27.8-9.2-41.5-8.4C763,601.5,763,604.5,765,604.4L765,604.4z" style="fill:#161616;"/>
</g>
</g>
<g>
<g>
<path d="M804.9,705.6c-0.2,19.6,2.2,39,7,58c0.5,1.9,3.4,1.1,2.9-0.8c-4.7-18.7-7.1-37.9-6.9-57.2
C807.9,703.7,804.9,703.7,804.9,705.6L804.9,705.6z" style="fill:#161616;"/>
</g>
</g>
<g>
<g>
<path d="M713.1,769c13.6,11.3,30.9,18.1,48.7,18.2c20.1,0.1,36.9-9.7,52.4-21.6c1.5-1.2,0-3.8-1.5-2.6
c-14.7,11.2-30.4,20.8-49.3,21.1c-17.5,0.3-34.7-6.2-48.1-17.3C713.7,765.6,711.6,767.7,713.1,769L713.1,769z" style="fill:#161616;"/>
</g>
</g>
<path d="M788.8,603.7c3.1,7.5,7.1,18.8,9.1,32.9c3.9,28.3-2.7,50-10.6,75.1c-5.9,18.7-15.8,44.5-33.2,73.4
c5.5,0.5,12.3,0.5,19.9-0.9c19.8-3.6,33-14.4,38.9-19.9c-0.7-5-1.9-12.8-3.6-22.2c-2.7-14.7-3.6-15.8-3.9-21.1
c-0.4-6.5,0.7-5.7,6.6-33.2c2.3-10.8,4-20.6,5-33.4c0.1-1.1,0.1-2.2,0.2-3.3c0.5-16.5,0.7-26.6-6.3-35.2
C804.2,607.7,794.5,604.8,788.8,603.7z" style="opacity:0.11;fill:#353535;"/>
<path d="M817.7,651.6c-0.7-0.2-4.2,5.3-12.4,27.2c-9,24.1-20.1,58.8-28.7,103.7c4.4-0.6,10.5-1.9,17.2-4.9
c9-4.1,15-9.6,18.4-13.3c-3-10.5-6.4-26.1-6.3-45.1C806,681.8,819.3,652.1,817.7,651.6z" style="opacity:8.000000e-002;fill:#353535;"/>
</g>
<g id="head">
<path d="M721.6,529.6c-3.9,8-2.8,16.1-1.9,19.9c-0.4,0-5.1-0.2-7.6,3.2c-3,4-0.2,9,0.3,9.8c0.7,1.2,1.6,2.9,3.5,3.4
c3,0.9,5.8-1.7,6-1.9c1.5,3.8,4,8.6,7.9,13.5c6,7.6,12.7,12.1,17.2,14.6c0.2,4.8,0.4,9.5,0.5,14.3c1.1,1,3.4,2.8,6.8,3.4
c6.7,1.3,11.9-3.1,12.5-3.7c-0.1-6-0.2-12-0.3-18c2.6-2,5.6-4.8,8.5-8.5c5.8-7.6,7.9-15.3,8.7-19.9c1.1,0.4,2.9,0.8,5.2,0.8
c2.2,0,5-0.1,6.3-1.9c1.4-2-0.1-4.9-1.6-8c-1.5-2.9-2.6-3.3-3-3.4c-1.7-0.5-3.3,0.5-3.8,0.8c0.4-3.2,0.6-9.2-1.9-15.9
c-0.7-1.9-4.7-12.1-14.4-17.5C754.6,506,729.6,513.3,721.6,529.6z" style="fill:#FFFFFF;"/>
<g>
<g>
<path d="M719.8,529.8c-5.9,25.9,3.7,59.3,33.1,64.9c1.9,0.4,2.7-2.5,0.8-2.9c-27.8-5.3-36.5-36.8-31-61.2
C723.1,528.7,720.2,527.9,719.8,529.8L719.8,529.8z" style="fill:#161616;"/>
</g>
</g>
<g>
<g>
<path d="M753.3,594.6c4.1,1.2,9.7-2.7,13-4.9c4.4-2.9,8.3-6.6,11.4-10.9c7.7-10.3,10.6-23.3,9.4-35.9
c-0.2-1.9-3.2-1.9-3,0c1.1,10.9-0.9,22-6.8,31.3c-2.5,3.9-5.6,7.4-9.2,10.4c-2.9,2.4-10,8.2-14,7.1
C752.2,591.2,751.4,594.1,753.3,594.6L753.3,594.6z" style="fill:#161616;"/>
</g>
</g>
<g>
<g>
<path d="M744.5,592.2c1.5,4.1,1.9,8.4,1.2,12.7c-0.3,1.9,2.6,2.7,2.9,0.8c0.8-4.9,0.5-9.6-1.2-14.3
C746.8,589.6,743.9,590.3,744.5,592.2L744.5,592.2z" style="fill:#161616;"/>
</g>
</g>
<g>
<g>
<path d="M765.2,588.8c-0.5,5.1-0.1,10.1,1.2,15.1c0.5,1.9,3.4,1.1,2.9-0.8c-1.2-4.7-1.5-9.5-1.1-14.3
C768.4,586.9,765.4,586.9,765.2,588.8L765.2,588.8z" style="fill:#161616;"/>
</g>
</g>
<g>
<g>
<path d="M745.8,606.8c6.9,7.7,21.3,7.5,23.8-4.2c0.4-1.9-2.5-2.7-2.9-0.8c-2.1,9.5-13.3,8.9-18.8,2.9
C746.6,603.3,744.5,605.4,745.8,606.8L745.8,606.8z" style="fill:#161616;"/>
</g>
</g>
<g>
<g>
<path d="M746.4,594.2c5.8,5.3,14.9,4.1,18.6-3c0.9-1.7-1.7-3.2-2.6-1.5c-2.8,5.3-9.5,6.5-13.9,2.4
C747.1,590.8,745,592.9,746.4,594.2L746.4,594.2z" style="fill:#161616;"/>
</g>
</g>
<g>
<g>
<path d="M752.4,596.4c1.4-0.1,2.7,0,4,0.4c1.9,0.5,2.7-2.4,0.8-2.9c-1.6-0.4-3.2-0.6-4.8-0.5
C750.5,593.5,750.5,596.5,752.4,596.4L752.4,596.4z" style="fill:#161616;"/>
</g>
</g>
<g>
<g>
<path d="M720.1,564.3c-4.1,3.3-7.7-1.3-8.1-5.2c-0.5-3.8,2.8-8.5,7-5.9c1.6,1,3.1-1.6,1.5-2.6
c-6.2-3.9-12.2,2.7-11.5,8.9c0.8,6.6,7.3,11.7,13.2,6.9C723.7,565.2,721.6,563.1,720.1,564.3L720.1,564.3z" style="fill:#161616;"/>
</g>
</g>
<g>
<g>
<path d="M787.6,549.7c3.2-3,6.3,2.7,6.2,5.3c0,1.6-0.8,3.2-2.2,4.1c-1.1,0.7-3.7,1.6-4.6,0.2
c-1-1.6-3.6-0.1-2.6,1.5c1.5,2.5,4.9,2.6,7.4,1.6c2.9-1.2,4.8-3.9,4.9-7c0.3-5.5-6-12.8-11.3-7.8
C784.1,548.9,786.2,551.1,787.6,549.7L787.6,549.7z" style="fill:#161616;"/>
</g>
</g>
<g>
<g>
<path d="M747.4,529.5c0.8,7,0.4,13.6-0.3,20.6c-0.4,4.7,2.1,6.7,5.8,9.7c1.5,1.2,3.6-0.9,2.1-2.1
c-2.6-2.2-4.9-3.7-4.8-7.7c0-1.9,0.5-4,0.7-5.9c0.4-4.9,0.2-9.8-0.4-14.6C750.2,527.6,747.2,527.6,747.4,529.5L747.4,529.5z" style="fill:#161616;"/>
</g>
</g>
<g>
<g>
<path d="M730.7,543.7c-0.1-2.2,3.1-3.6,4.9-3.5c2.1,0,3.2,1.7,4.3,3.3c1.1,1.6,3.7,0.1,2.6-1.5
c-2-2.9-4.3-5.3-8.1-4.7c-3.2,0.6-6.9,2.9-6.8,6.5C727.7,545.7,730.7,545.7,730.7,543.7L730.7,543.7z" style="fill:#161616;"/>
</g>
</g>
<g>
<g>
<path d="M765,541c2.7-5.1,10-4.3,11.3,1.4c0.4,1.9,3.3,1.1,2.9-0.8c-1.8-8.2-12.9-9.5-16.8-2.2
C761.6,541.1,764.1,542.7,765,541L765,541z" style="fill:#161616;"/>
</g>
</g>
<g>
<g>
<path d="M727.8,533.1c1.7-2.6,4.6-4.3,7.7-4.7c1.9-0.2,1.9-3.2,0-3c-4.3,0.5-7.9,2.6-10.3,6.2
C724.1,533.2,726.7,534.7,727.8,533.1L727.8,533.1z" style="fill:#161616;"/>
</g>
</g>
<g>
<g>
<path d="M765,527.5c3.6-0.2,6.9,0.9,9.5,3.3c1.4,1.3,3.6-0.8,2.1-2.1c-3.2-2.9-7.3-4.4-11.7-4.2
C763,524.6,763,527.6,765,527.5L765,527.5z" style="fill:#161616;"/>
</g>
</g>
<g>
<g>
<path d="M731.5,551.4c0-0.1,0-0.1,0-0.2c0-0.8-0.7-1.5-1.5-1.5c-0.8,0-1.5,0.7-1.5,1.5c0,0.1,0,0.1,0,0.2
c0,0.8,0.7,1.5,1.5,1.5C730.8,552.9,731.5,552.3,731.5,551.4L731.5,551.4z" style="fill:#161616;"/>
</g>
</g>
<g>
<g>
<path d="M736.1,550.7c0.1,0,0.2,0,0.2,0c0.8,0,1.5-0.7,1.5-1.5c0-0.8-0.7-1.5-1.5-1.5c-0.1,0-0.2,0-0.2,0
c-0.8,0-1.5,0.7-1.5,1.5C734.7,550,735.3,550.7,736.1,550.7L736.1,550.7z" style="fill:#161616;"/>
</g>
</g>
<g>
<g>
<path d="M735.9,557.3c0.1,0,0.2,0,0.2,0c0.8,0,1.5-0.7,1.5-1.5c0-0.8-0.7-1.5-1.5-1.5c-0.1,0-0.2,0-0.2,0
c-0.8,0-1.5,0.7-1.5,1.5C734.4,556.6,735.1,557.3,735.9,557.3L735.9,557.3z" style="fill:#161616;"/>
</g>
</g>
<g>
<g>
<path d="M768.3,548.5c0.1,0,0.2,0,0.2,0c0.8,0,1.5-0.7,1.5-1.5c0-0.8-0.7-1.5-1.5-1.5c-0.1,0-0.2,0-0.2,0
c-0.8,0-1.5,0.7-1.5,1.5C766.9,547.8,767.5,548.5,768.3,548.5L768.3,548.5z" style="fill:#161616;"/>
</g>
</g>
<g>
<g>
<path d="M777.1,548.3c1.9,0,1.9-3,0-3C775.2,545.3,775.2,548.3,777.1,548.3L777.1,548.3z" style="fill:#161616;"/>
</g>
</g>
<g>
<g>
<path d="M773.8,553.1c1.9,0,1.9-3,0-3C771.8,550.1,771.8,553.1,773.8,553.1L773.8,553.1z" style="fill:#161616;"/>
</g>
</g>
<g>
<g>
<path d="M740.7,566.2c6.1,11,22.1,9.4,26-2.5c0.6-1.8-2.3-2.6-2.9-0.8c-3.1,9.6-15.7,10.4-20.5,1.8
C742.4,563,739.8,564.5,740.7,566.2L740.7,566.2z" style="fill:#161616;"/>
</g>
</g>
<path d="M705,541.7c-3.7,5.5-9,15-11.1,27.7c-1.5,9.1-4.1,25,5.9,37.6c2.7,3.4,12.6,14.5,26.2,12.7
c9.1-1.2,18.8-8,20.6-17.5c0.9-4.4-0.1-8.2-1-10.4c-4.3-2.1-12-6.5-18-15.1c-3-4.2-4.8-8.3-5.8-11.5c-0.5,0.4-2.1,1.6-4.3,1.5
c-2.6-0.1-4.2-1.9-4.6-2.4c-3.1-3.5-2.8-10.7,1.3-13.1c2.1-1.2,4.5-0.8,5.8-0.5c-0.6-3.7-1.2-11.6,3-19.9c2.8-5.6,7.1-9.7,17-15.9
c8.2-5.1,11.8-4.7,13.1-4.5c4.4,0.8,7.1,4.3,8.5,6.1c6.3,8,14.5,18.3,24.3,31c0.4-0.2,3.1-1.5,5.8-0.3c1.9,0.9,2.8,2.6,3.4,3.9
c0.5,1.1,1.3,2.7,0.9,4.6c-0.4,2.4-2.3,4.6-4.9,5.4c-3.2,1-5.8-0.7-6.2-1c-0.8,3.8-2.4,9.5-6.2,15.6c-3.9,6.2-8.4,10.3-11.5,12.7
c-0.4,2.4-0.9,6.8,1,11.8c3,8.2,10.8,13.4,18,15c13.5,2.9,24.4-7.2,27.2-9.9c9.6-9,15.4-24.1,10.5-38.6
c-3.7-10.8-11.9-16.7-15.1-18.8c-3.9-9-7.9-16-11.1-21c-9-14.1-15.2-23.6-26.5-27.1c-6.9-2.1-13.2-1.3-17.4-0.3
c-6.8-1.5-12.1-0.9-15.7,0C721.5,503.6,708.9,520.2,705,541.7z" style="fill:#5222D0;"/>
<path d="M773.6,530.6c-0.8,0.3,0.8,5.5,1.6,10.7c0.1,0.7,1.8,13.6-3,25.9c-5.4,13.8-16.6,21.2-21.5,24
c3.1,0.7,6.3,1.4,9.4,2.2c0.9,5.4,1.7,10.9,2.6,16.3c2-2.4,4.1-4.8,6.1-7.2c0.9,1.7,2.5,4.2,5,6.5c0.8,0.8,6.6,6,15.2,6.7
c9.6,0.9,16.7-4.3,20.7-7.2c2.7-1.9,10.7-7.9,14.4-19.4c4-12.5,0.1-23-1.1-25.9c-1.3,5-4,12.5-9.8,19.8
c-1.4,1.8-14,17.5-21.8,14.8c-6.7-2.3-9-18.1-5.7-38.8c0.2,0.2,1.8,2.1,4.1,2c2.9-0.1,4.2-3,4.4-3.3c1.4-3-0.3-6.3-2-8.1
c-2.2-2.4-5.2-2.8-6.1-2.8c-1.3-1.3-3.2-3.3-5.2-5.9C776.1,535,774.3,530.4,773.6,530.6z" style="opacity:8.000000e-002;fill:#353535;"/>
<path d="M749.4,552.8c0.8-1.3,5.2-1.6,6.5,1.1c1,2.1-0.3,4.9-1.7,5.2C752,559.7,748.3,554.5,749.4,552.8z" style="opacity:9.000000e-002;fill:#353535;"/>
<path d="M726.3,595.1c-2.1,3.6-6.3,6.9-10.5,6.5c-2.5-0.2-5.3-1.7-15-17.2c-3.2-5.1-5.7-9.5-7.4-12.4
c-0.9,3.3-2.1,9.2-1.1,16.3c0.4,2.8,1.4,7.6,4.1,12.8c1.7,3.3,5.7,10.6,14.2,15.2c2.5,1.4,6.9,3.7,12.8,3.7
c9.9-0.1,16.3-6.7,17.6-8.1c2.3-2.3,5.6-5.8,6.1-11.3c0.5-5.3-2-9.4-2.6-10.2c-3-4.6-6.2-4.1-11.3-8.5c-6.5-5.6-8.3-12.5-9.1-12.2
C722.9,570.4,732,585.3,726.3,595.1z" style="opacity:9.000000e-002;fill:#353535;"/>
<path d="M785.3,553c-0.6-0.2-2.4,6.1-7.6,14.6c-7.4,12.1-16.5,20-23.1,24.8c4.6-1.3,12.8-4.3,19.6-11.7
C785,569.1,786.2,553.3,785.3,553z" style="opacity:0.13;fill:#353535;"/>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 48 KiB

BIN
public/astro-banner.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 181 KiB

BIN
public/astro-ink-logo.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 73 KiB

9
public/browserconfig.xml Normal file
View File

@@ -0,0 +1,9 @@
<?xml version="1.0" encoding="utf-8"?>
<browserconfig>
<msapplication>
<tile>
<square150x150logo src="/mstile-150x150.png"/>
<TileColor>#da532c</TileColor>
</tile>
</msapplication>
</browserconfig>

BIN
public/favicon-16x16.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 941 B

BIN
public/favicon-32x32.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.5 KiB

BIN
public/favicon.ico Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 15 KiB

11
public/favicon.svg Normal file
View File

@@ -0,0 +1,11 @@
<svg width="256" height="256" fill="none" xmlns="http://www.w3.org/2000/svg">
<style>
#flame { fill: #FF5D01; }
#a { fill: #000014; }
@media (prefers-color-scheme: dark) {
#a { fill: #fff; }
}
</style>
<path id="a" fill-rule="evenodd" clip-rule="evenodd" d="M163.008 18.929c1.944 2.413 2.935 5.67 4.917 12.181l43.309 142.27a180.277 180.277 0 00-51.778-17.53l-28.198-95.29a3.67 3.67 0 00-7.042.01l-27.857 95.232a180.225 180.225 0 00-52.01 17.557l43.52-142.281c1.99-6.502 2.983-9.752 4.927-12.16a15.999 15.999 0 016.484-4.798c2.872-1.154 6.271-1.154 13.07-1.154h31.085c6.807 0 10.211 0 13.086 1.157a16.004 16.004 0 016.487 4.806z" />
<path id="flame" fill-rule="evenodd" clip-rule="evenodd" d="M168.19 180.151c-7.139 6.105-21.39 10.268-37.804 10.268-20.147 0-37.033-6.272-41.513-14.707-1.602 4.835-1.961 10.367-1.961 13.902 0 0-1.056 17.355 11.015 29.426 0-6.268 5.081-11.349 11.349-11.349 10.743 0 10.731 9.373 10.721 16.977v.679c0 11.542 7.054 21.436 17.086 25.606a23.27 23.27 0 01-2.339-10.2c0-11.008 6.463-15.107 13.974-19.87 5.976-3.79 12.616-8.001 17.192-16.449a31.024 31.024 0 003.743-14.82c0-3.299-.513-6.479-1.463-9.463z" />
</svg>

After

Width:  |  Height:  |  Size: 1.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.3 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.5 MiB

BIN
public/mstile-150x150.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.8 KiB

2
public/robots.txt Normal file
View File

@@ -0,0 +1,2 @@
User-agent: *
Disallow: /

View File

@@ -0,0 +1,103 @@
<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN"
"http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
<svg version="1.0" xmlns="http://www.w3.org/2000/svg"
width="1024.000000pt" height="1024.000000pt" viewBox="0 0 1024.000000 1024.000000"
preserveAspectRatio="xMidYMid meet">
<metadata>
Created by potrace 1.14, written by Peter Selinger 2001-2017
</metadata>
<g transform="translate(0.000000,1024.000000) scale(0.100000,-0.100000)"
fill="#000000" stroke="none">
<path d="M4407 9724 c-1 -1 -69 -5 -152 -8 -155 -7 -190 -10 -215 -19 -91 -31
-124 -46 -177 -79 -78 -50 -172 -151 -209 -226 -15 -31 -28 -59 -29 -62 0 -3
-13 -36 -27 -75 -15 -38 -30 -83 -34 -100 -4 -16 -11 -35 -16 -41 -5 -7 -8
-16 -6 -20 1 -5 -11 -47 -26 -94 -15 -47 -30 -96 -32 -109 -3 -14 -8 -29 -12
-35 -3 -6 -7 -15 -8 -21 -1 -5 -23 -77 -49 -160 -25 -82 -48 -157 -50 -165 -2
-8 -4 -16 -5 -17 -2 -2 -3 -6 -4 -10 -12 -45 -28 -101 -33 -113 -3 -8 -7 -20
-9 -27 -1 -7 -11 -41 -22 -75 -11 -35 -32 -103 -47 -153 -15 -49 -29 -97 -32
-105 -4 -8 -7 -20 -9 -27 -1 -7 -13 -47 -27 -90 -14 -43 -33 -105 -42 -138
-10 -33 -26 -84 -36 -113 -10 -28 -19 -54 -19 -57 0 -3 -2 -10 -5 -17 -2 -7
-22 -76 -45 -153 -23 -77 -55 -180 -71 -229 -16 -49 -26 -93 -23 -97 3 -5 0
-9 -5 -9 -6 0 -11 -9 -11 -20 0 -10 -4 -29 -9 -42 -9 -22 -72 -222 -77 -243
-1 -5 -21 -71 -44 -145 -23 -74 -61 -202 -86 -285 -25 -82 -54 -175 -64 -205
-15 -45 -33 -105 -46 -152 -1 -5 -3 -10 -4 -13 -1 -3 -3 -8 -4 -12 -1 -5 -5
-17 -8 -28 -4 -11 -18 -60 -33 -110 -15 -49 -29 -97 -32 -105 -8 -19 -7 -16
-22 -70 -7 -25 -21 -72 -32 -105 -42 -133 -220 -714 -223 -730 -3 -14 -47
-155 -56 -180 -7 -18 -67 -213 -74 -240 -7 -28 -50 -169 -72 -235 -13 -41 -26
-84 -28 -95 -3 -11 -14 -49 -26 -85 -12 -36 -23 -69 -24 -75 -5 -19 -47 -160
-71 -235 -38 -119 -85 -274 -86 -285 -1 -5 -8 -25 -16 -43 -7 -17 -12 -32 -9
-32 2 0 73 33 157 74 176 84 288 136 295 136 3 0 24 9 47 19 23 10 71 31 107
45 36 15 74 31 85 36 28 12 267 100 285 105 8 2 34 10 58 19 23 8 46 16 50 17
12 3 26 7 62 19 46 15 201 61 220 65 8 2 15 4 15 5 0 1 9 3 19 5 11 2 31 7 45
11 14 4 29 8 34 9 4 2 8 3 10 5 1 1 9 3 17 5 50 11 72 16 130 30 35 9 74 18
85 20 11 2 20 4 20 5 0 1 9 3 20 5 11 2 31 6 45 9 25 6 67 15 105 22 11 2 42
8 69 14 26 5 52 7 57 4 5 -3 9 0 9 6 0 6 4 9 8 6 15 -9 29 9 39 49 6 22 30
103 53 180 23 77 43 145 44 150 2 6 9 30 16 55 15 49 19 63 23 82 1 7 6 19 10
26 5 6 6 12 3 12 -3 0 2 16 10 35 8 19 12 35 9 35 -3 0 -1 9 5 21 6 11 13 28
15 37 3 16 12 47 71 252 14 47 27 93 29 103 2 9 6 21 9 25 3 5 7 19 10 33 2
13 19 69 36 124 17 55 33 107 35 115 20 82 35 132 45 149 6 12 9 21 6 21 -2 0
7 37 21 83 14 45 26 87 28 92 1 6 4 17 7 25 7 20 40 132 43 145 1 5 8 30 15
55 8 25 14 48 16 53 1 4 2 8 4 10 1 1 3 9 5 17 1 8 11 42 21 75 10 33 19 65
20 70 1 6 21 73 44 150 76 257 94 319 119 410 5 17 34 116 65 220 31 105 58
195 60 200 18 65 29 103 32 115 4 21 91 313 110 375 9 28 17 55 18 60 17 78
48 167 69 198 21 30 72 61 87 52 6 -3 10 -2 10 4 0 6 11 6 30 1 32 -9 36 -10
48 -10 28 0 85 -82 97 -139 2 -9 15 -56 30 -106 32 -106 54 -184 60 -205 2 -8
10 -36 19 -61 9 -25 17 -54 19 -65 2 -10 7 -26 10 -34 8 -20 57 -189 63 -216
2 -12 11 -38 19 -58 8 -20 13 -36 11 -36 -3 0 2 -19 10 -42 9 -24 17 -52 19
-62 5 -21 23 -83 32 -106 3 -8 8 -23 10 -33 1 -10 12 -46 22 -80 41 -129 71
-233 75 -252 2 -11 9 -33 15 -48 6 -15 13 -42 16 -59 3 -17 9 -36 13 -42 3 -6
7 -15 7 -21 1 -5 4 -17 7 -25 8 -18 73 -242 94 -320 8 -30 16 -61 19 -68 2 -7
5 -14 5 -17 0 -3 6 -21 15 -41 8 -19 14 -38 13 -42 -2 -6 15 -65 29 -102 3 -8
7 -19 8 -25 2 -5 13 -44 25 -85 12 -41 23 -79 25 -85 1 -5 5 -17 8 -25 6 -14
67 -223 71 -245 2 -5 11 -37 21 -70 10 -33 20 -64 21 -70 1 -5 21 -73 44 -150
23 -77 44 -147 45 -155 2 -8 14 -46 26 -85 12 -38 23 -74 25 -80 1 -5 14 -50
30 -100 15 -49 29 -94 30 -100 4 -21 37 -132 60 -204 13 -41 21 -77 19 -82 -3
-4 -1 -10 5 -14 5 -3 10 -15 10 -25 0 -23 28 -31 180 -56 14 -2 36 -7 50 -11
14 -3 32 -7 40 -8 22 -3 236 -54 252 -60 7 -2 24 -7 38 -9 14 -3 59 -15 100
-26 41 -12 89 -25 105 -30 79 -22 272 -82 290 -90 11 -5 40 -16 65 -24 25 -8
63 -21 85 -29 22 -9 78 -29 125 -47 47 -17 94 -35 105 -40 11 -5 49 -21 85
-36 36 -14 81 -33 100 -41 19 -8 44 -19 55 -24 11 -4 105 -49 209 -98 104 -50
190 -91 191 -91 2 0 -14 55 -35 123 -63 204 -74 242 -76 250 -1 4 -2 8 -4 10
-1 1 -3 9 -5 17 -4 17 -27 93 -80 265 -21 66 -38 125 -39 130 -1 6 -4 15 -8
20 -3 6 -9 26 -14 45 -11 50 -11 50 -14 53 -1 1 -3 9 -5 17 -2 8 -25 83 -50
165 -26 83 -48 155 -50 160 -1 6 -4 17 -7 25 -6 17 -12 36 -58 190 -17 58 -35
116 -40 130 -4 14 -22 70 -38 125 -67 220 -114 374 -137 450 -14 44 -28 95
-31 113 -4 17 -9 32 -13 32 -4 0 -7 10 -8 22 -1 12 -6 33 -12 47 -5 14 -24 73
-41 131 -17 58 -37 123 -45 145 -8 22 -17 55 -20 74 -3 18 -12 46 -21 62 -8
16 -14 30 -13 31 2 5 -12 63 -20 83 -8 20 -51 160 -56 179 -1 6 -5 18 -8 26
-4 8 -8 24 -10 35 -1 11 -5 25 -9 30 -5 9 -36 112 -43 145 -2 8 -14 49 -28 90
-19 62 -46 148 -52 170 -1 3 -10 32 -20 65 -10 33 -20 65 -21 70 -1 6 -9 33
-19 60 -9 28 -18 55 -19 60 -6 26 -30 104 -41 135 -7 19 -13 37 -13 40 -1 3
-3 12 -6 20 -3 8 -16 53 -30 100 -13 47 -36 123 -51 170 -14 47 -27 90 -28 95
-5 18 -39 129 -57 185 -10 30 -21 67 -24 82 -3 15 -11 40 -18 55 -6 15 -12 34
-14 41 -1 7 -12 46 -24 85 -12 40 -23 77 -24 82 -1 6 -4 15 -7 20 -6 10 -22
68 -20 73 1 1 -5 18 -13 37 -8 19 -13 35 -11 35 3 0 -2 17 -9 38 -8 20 -24 71
-36 112 -12 41 -26 84 -30 95 -4 11 -22 70 -40 130 -18 61 -46 152 -62 204
-17 51 -32 101 -33 110 -2 9 -4 16 -5 16 -1 0 -3 7 -5 16 -3 15 -38 119 -55
164 -43 114 -134 245 -200 288 -14 9 -34 22 -45 29 -11 7 -22 16 -25 20 -7 9
-63 32 -72 30 -5 -1 -8 2 -8 8 0 6 -3 9 -7 8 -5 -1 -28 5 -53 12 -44 13 -74
18 -152 23 -21 2 -40 6 -43 9 -4 3 -19 2 -35 -2 -16 -4 -30 -6 -33 -4 -2 2
-51 4 -108 4 -120 0 -121 0 -196 1 -32 0 -67 0 -78 0 -11 -1 -47 -1 -80 0 -33
0 -69 0 -80 0 -11 -1 -47 -1 -80 0 -33 0 -69 0 -80 -1 -11 0 -204 1 -428 2
-225 2 -409 2 -410 2z"/>
<path d="M3534 3143 c-21 -78 -20 -74 -28 -133 -4 -25 -9 -56 -11 -70 -23
-123 -24 -414 -1 -575 46 -319 183 -623 375 -835 l48 -53 2 34 c1 19 3 46 4
61 1 16 5 28 9 28 5 0 8 7 8 16 0 46 102 190 166 232 35 23 123 63 151 68 14
3 31 7 35 10 5 3 44 5 86 5 174 -2 289 -66 356 -199 13 -26 26 -60 30 -77 13
-63 16 -76 21 -97 3 -13 7 -66 9 -120 2 -53 7 -101 10 -107 4 -6 4 -11 -1 -11
-9 0 -8 -73 1 -89 4 -5 2 -12 -4 -16 -6 -4 -8 -11 -4 -16 3 -6 7 -34 9 -62 3
-46 6 -68 20 -152 26 -158 152 -389 288 -529 69 -70 194 -168 247 -194 14 -6
32 -16 40 -21 31 -18 70 -34 74 -30 3 2 -6 27 -18 54 -21 46 -37 103 -54 195
-9 46 -9 253 0 310 15 98 59 203 121 286 76 102 204 213 334 290 78 47 218
139 221 146 2 4 8 8 13 8 23 0 211 151 299 240 111 112 117 119 181 219 27 42
53 81 59 88 5 7 10 14 10 17 0 3 15 38 34 78 32 69 82 216 78 229 0 4 3 21 8
38 28 100 31 344 5 471 -3 14 -7 34 -9 45 -2 11 -9 39 -15 63 -13 47 -9 48
-89 -10 -87 -64 -351 -192 -417 -202 -5 -1 -23 -7 -40 -13 -24 -10 -94 -31
-125 -38 -3 0 -23 -5 -45 -10 -22 -4 -44 -10 -50 -11 -5 -2 -23 -6 -40 -9 -16
-3 -41 -8 -55 -10 -73 -15 -117 -22 -186 -30 -21 -3 -52 -7 -69 -9 -210 -30
-656 -25 -905 10 -76 11 -85 12 -90 14 -3 1 -8 2 -12 1 -11 -1 -228 47 -288
64 -112 31 -195 59 -204 67 -6 4 -16 8 -23 8 -41 0 -309 148 -395 219 -36 29
-92 91 -121 134 -15 22 -29 42 -31 44 -2 2 -11 -27 -22 -64z"/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 7.0 KiB

1
public/search-index.json Normal file

File diff suppressed because one or more lines are too long

19
public/site.webmanifest Normal file
View File

@@ -0,0 +1,19 @@
{
"name": "Astro Ink",
"short_name": "Astro Ink",
"icons": [
{
"src": "/android-chrome-192x192.png",
"sizes": "192x192",
"type": "image/png"
},
{
"src": "/android-chrome-512x512.png",
"sizes": "512x512",
"type": "image/png"
}
],
"theme_color": "#ffffff",
"background_color": "#ffffff",
"display": "standalone"
}

View File

@@ -0,0 +1,12 @@
{
"name": "search",
"version": "1.0.0",
"description": "",
"main": "prepare-index.js",
"type": "module",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "Aftab Alam",
"license": "ISC"
}

View File

@@ -0,0 +1,37 @@
import path from 'path'
import { promises as fs } from 'fs'
import { globby } from 'globby'
import grayMatter from 'gray-matter'
(async function () {
// prepare the dirs
const srcDir = path.join(process.cwd(), 'src')
const publicDir = path.join(process.cwd(), 'public')
const contentDir = path.join(srcDir, 'pages', 'blog')
const contentFilePattern = path.join(contentDir, '*.md')
const indexFile = path.join(publicDir, 'search-index.json')
const getSlugFromPathname = (pathname) => path.basename(pathname, path.extname(pathname))
const contentFilePaths = await globby([ contentFilePattern ])
if(contentFilePaths.length) {
const files = contentFilePaths.map(async(filePath) => await fs.readFile(filePath, 'utf8'))
const index = []
let i = 0
for await (let file of files){
const { data: { title, description, tags }, content } = grayMatter(file)
index.push({
slug: getSlugFromPathname(contentFilePaths[i]),
category: 'blog',
title,
description,
tags,
body: content
})
i++
}
await fs.writeFile(indexFile, JSON.stringify(index))
console.log(`Indexed ${index.length} documents from ${contentDir} to ${indexFile}`)
}
})();

View File

@@ -0,0 +1,65 @@
---
import '@fontsource/fira-sans'
import { SITE } from '$/config'
import '../styles/global.css'
export type Props = {
title: string
description: string
permalink: string
image: string
}
const { title = SITE.title , description, permalink, image } = Astro.props as Props
---
<!-- Use Google Fonts, if you don't wanna prefer a self-hosted version -->
<!-- <link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Fira+Code:wght@300;400;500;600;700&display=swap" rel="stylesheet"> -->
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>{title}</title>
<meta name="title" content={title}/>
{description &&
<meta name="description" content={description}/>
}
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
<link rel="shortcut icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
<link rel="manifest" href="/site.webmanifest">
<link rel="mask-icon" href="/safari-pinned-tab.svg" color="#5bbad5">
<meta httpEquiv="X-UA-Compatible" content="IE=edge" />
<meta name="msapplication-TileColor" content="#da532c" />
<meta name="msapplication-config" content="/browserconfig.xml"/>
<meta name="theme-color" content="#ffffff" />
<!-- Open Graph Tags (Facebook) -->
<meta property="og:type" content="website" />
<meta property="og:title" content={title} />
{permalink &&
<meta property="og:url" content={permalink} />
}
{description &&
<meta property="og:description" content={description} />
}
{image &&
<meta property="og:image" content={image} />
}
<!-- Twitter -->
<meta property="twitter:card" content="summary_large_image" />
<meta property="twitter:title" content={title} />
{permalink &&
<meta property="twitter:url" content={permalink} />
}
{description &&
<meta property="twitter:description" content={description} />
}
{image &&
<meta property="twitter:image" content={image} />
}
<script src="https://identity.netlify.com/v1/netlify-identity-widget.js"></script>

View File

@@ -0,0 +1,7 @@
<body class="font-sans antialiased min-h-screen bg-gray-100 dark:bg-gray-800">
<div class="transition-colors">
<main class="mx-auto max-w-4xl px-4 md:px-0">
<slot />
</main>
</div>
</body>

View File

@@ -0,0 +1,17 @@
---
import { SITE } from '$/config'
import ModeLabel from './ModeLabel.svelte'
import NetlifyIdentity from './NetlifyIdentity.svelte'
---
<footer class="footer">
<nav class="nav">
<div>2021 &copy; Copyright notice | <a href={ SITE.githubUrl } title={`${ SITE.name }'s Github URL'`}>{ SITE.name }</a>
<ModeLabel client:load/> theme on <a href="https://astro.build/">Astro</a></div>
<NetlifyIdentity client:load/>
</nav>
</footer>
<style>
.footer {
@apply py-6 border-t
}
</style>

View File

@@ -0,0 +1,69 @@
---
import { SITE } from '$/config'
import SvgIcon from './SvgIcon.astro'
import ModeSwitcherBtn from './ModeSwitcherBtn.svelte'
import SearchBtn from './SearchBtn.svelte'
---
<header class="header">
<div class="header__logo">
<a href="/" class="avatar">
<img class="header__logo-img" src="/assets/logo.svg" alt="Astro logo" />
</a>
</div>
<div class="header__meta flex-1">
<h3 class="header__title dark:text-theme-dark-secondary">
<a href="">{ SITE.name }</a>
</h3>
<div class="header__meta-more flex">
<p class="header__desc">
{ SITE.description }
</p>
<nav class="header__nav flex">
<ul class="header__ref-list">
<li>
<SearchBtn client:visible />
</li>
<li>
<a href={ SITE.githubUrl } title={`${ SITE.name }'s Github URL'`}>
<SvgIcon>
<path d="M9 19c-5 1.5-5-2.5-7-3m14 6v-3.87a3.37 3.37 0 0 0-.94-2.61c3.14-.35 6.44-1.54 6.44-7A5.44 5.44 0 0 0 20 4.77 5.07 5.07 0 0 0 19.91 1S18.73.65 16 2.48a13.38 13.38 0 0 0-7 0C6.27.65 5.09 1 5.09 1A5.07 5.07 0 0 0 5 4.77a5.44 5.44 0 0 0-1.5 3.78c0 5.42 3.3 6.61 6.44 7A3.37 3.37 0 0 0 9 18.13V22"></path>
</SvgIcon>
</a>
</li>
<li>
<a href="/rss.xml" title="RSS">
<SvgIcon>
<path d="M4 11a9 9 0 0 1 9 9"></path>
<path d="M4 4a16 16 0 0 1 16 16"></path>
<circle cx="5" cy="19" r="1"></circle>
</SvgIcon>
</a>
</li>
<li>
<ModeSwitcherBtn client:visible />
</li>
</ul>
</nav>
</div>
</div>
</header>
<style>
.header {
@apply flex gap-4 border-b py-3 /* border-gray-200 dark:border-gray-700 - check styles/global.css */
}
.header__logo-img {
@apply w-16 h-16 rounded-full overflow-hidden
}
.header__title {
@apply text-4xl font-extrabold md:text-5xl text-theme-secondary dark:text-theme-dark-secondary
}
.header__desc {
@apply text-xl flex-1 dark:text-gray-200
}
.header__ref-list {
@apply flex gap-3 text-gray-400
}
</style>

View File

@@ -0,0 +1,10 @@
<img src="/assets/yay.svg" alt="Yay!" />
<style>
img {
@apply mx-auto w-2/3 mt-6
}
h1 {
@apply w-full justify-center text-center text-3xl font-bold text-purple-600 py-10
}
</style>

View File

@@ -0,0 +1,28 @@
---
import BaseLayout from './BaseLayout.astro';
import Header from './Header.astro';
import Footer from './Footer.astro';
import Nav from './Nav.astro';
import Portal from './Portal.astro';
import SearchModal from './SearchModal.svelte'
---
<BaseLayout>
<br class="my-4"/>
<Header/>
<Nav/>
<div class="content">
<slot />
</div>
<br class="my-4"/>
<Footer/>
<Portal>
<SearchModal client:load/>
</Portal>
</BaseLayout>
<style>
.content {
min-height: 580px
}
</style>

View File

@@ -0,0 +1,48 @@
---
import { getMonthName } from '$/utils'
const { post } = Astro.props
---
<div class="post-preview">
<div class="sm:w-20 md:w-32">
<div class="post-preview__date">
<span class="post-preview__date__day">{ new Date(post.date).getDate() }</span>
<span class="post-preview__date__month-n-year">{ `${getMonthName(post.date)} ${new Date(post.date).getFullYear()}` }</span>
</div>
</div>
<div class="flex-1">
<div class="flex flex-col mb-2">
<h4 class="post-preview__title">
<a href={post.url} title={post.title} target="_blank">{post.title}</a>
</h4>
<div>
<strong>{post.host}</strong>
{
post.participants.length > 0 && ` <em>with</em> ${post.participants.join(', ')}`
}
</div>
</div>
<p class="post-preview__desc">
{post.description}
</p>
</div>
</div>
<style>
.post-preview {
@apply flex gap-6
}
.post-preview__date {
@apply flex flex-col w-full text-center
}
.post-preview__date__day {
@apply text-6xl font-semibold text-gray-500 dark:text-gray-300
}
.post-preview__date__month-n-year {
@apply text-gray-400
}
.post-preview__title {
@apply text-2xl font-semibold text-theme-primary dark:text-theme-dark-primary hover:underline
}
.post-preview__desc {
@apply text-lg leading-6 dark:text-white line-clamp-2
}
</style>

View File

@@ -0,0 +1,14 @@
---
import MediaPreview from './MediaPreview.astro'
const { posts } = Astro.props
---
<section class="media-preview__list">
{posts.map((post) => (
<MediaPreview post={post}/>
))}
</section>
<style>
.media-preview__list {
@apply flex flex-col gap-12
}
</style>

View File

@@ -0,0 +1,7 @@
<script lang="ts">
import ModeSensitive from './ModeSensitive.svelte'
</script>
<ModeSensitive>
<span slot="dark">(dark)</span>
<span slot="light">(light)</span>
</ModeSensitive>

View File

@@ -0,0 +1,8 @@
<script lang="ts">
import { theme } from '../store/theme'
</script>
{#if $theme === 'dark'}
<slot name="dark"/>
{:else}
<slot name="light"/>
{/if}

View File

@@ -0,0 +1,35 @@
<script lang="ts">
import { onMount } from 'svelte'
import { theme } from '../store/theme'
type ThemeType = 'dark' | 'light'
const THEME_DARK: ThemeType = 'dark'
const THEME_LIGHT: ThemeType = 'light'
let currTheme: ThemeType = THEME_DARK
function toggleTheme() {
window.document.documentElement.classList.toggle(THEME_DARK)
currTheme = localStorage.getItem('theme') === THEME_DARK ? THEME_LIGHT : THEME_DARK
// Update Storage
localStorage.setItem('theme', currTheme)
// Update Store
theme.set(currTheme)
}
onMount(() => {
if (localStorage.getItem('theme') === THEME_DARK || (!('theme' in localStorage) && window.matchMedia(`(prefers-color-scheme: ${THEME_DARK})`).matches)) {
window.document.documentElement.classList.add(THEME_DARK)
currTheme = THEME_DARK
} else {
window.document.documentElement.classList.remove(THEME_DARK)
currTheme = THEME_LIGHT
}
// Update Store
theme.set(currTheme)
})
</script>
<button on:click={toggleTheme}>
<slot theme={currTheme}/>
</button>

View File

@@ -0,0 +1,21 @@
<script lang="ts">
import ModeSwitcher from './ModeSwitcher.svelte'
import SvgIcon from './SvgIcon.svelte'
</script>
<ModeSwitcher let:theme>
<SvgIcon>
{#if theme === 'dark'}
<circle cx="12" cy="12" r="5"></circle>
<line x1="12" y1="1" x2="12" y2="3"></line>
<line x1="12" y1="21" x2="12" y2="23"></line>
<line x1="4.22" y1="4.22" x2="5.64" y2="5.64"></line>
<line x1="18.36" y1="18.36" x2="19.78" y2="19.78"></line>
<line x1="1" y1="12" x2="3" y2="12"></line>
<line x1="21" y1="12" x2="23" y2="12"></line>
<line x1="4.22" y1="19.78" x2="5.64" y2="18.36"></line>
<line x1="18.36" y1="5.64" x2="19.78" y2="4.22"></line>
{:else}
<path d="M17.293 13.293A8 8 0 016.707 2.707a8.001 8.001 0 1010.586 10.586z"></path>
{/if}
</SvgIcon>
</ModeSwitcher>

18
src/components/Nav.astro Normal file
View File

@@ -0,0 +1,18 @@
---
import { toTitleCase } from '$/utils'
import { NAV_ITEMS } from '$/config'
---
<nav class="nav py-3">
<ul class="nav-list dark:text-theme-dark-secondary">
{
Object.keys(NAV_ITEMS).map(navItemKey => <li>
<a class="hover:underline" href={NAV_ITEMS[navItemKey].path} title={NAV_ITEMS[navItemKey].title}>{toTitleCase(NAV_ITEMS[navItemKey].title)}</a>
</li>)
}
</ul>
</nav>
<style>
.nav-list {
@apply inline-flex list-none gap-8 text-xl font-semibold text-theme-secondary dark:text-theme-dark-secondary py-2 flex-wrap
}
</style>

View File

@@ -0,0 +1,16 @@
<script lang="ts">
import { onMount} from 'svelte'
onMount(() => {
if (window.netlifyIdentity) {
window.netlifyIdentity.on('init', (user) => {
if (!user) {
window.netlifyIdentity.on('login', () => {
document.location.href = '/admin/';
});
}
});
}
})
</script>

View File

@@ -0,0 +1,15 @@
---
const { page } = Astro.props
---
<div class="page__actions">
{page.url.prev && <a class="action__go-to-x" href={page.url.prev} title="Go to Previous">&larr; Prev</a>}
{page.url.next && <a class="action__go-to-x" href={page.url.next} title="Go to Next">Next &rarr;</a>}
</div>
<style>
.page__actions {
@apply flex justify-center md:justify-end py-6 gap-2
}
.action__go-to-x {
@apply text-base uppercase text-gray-500 dark:text-gray-400 hover:underline
}
</style>

View File

@@ -0,0 +1,3 @@
<div class="portal-root">
<slot/>
</div>

View File

@@ -0,0 +1,40 @@
---
import { getMonthName, getSlugFromPathname } from '$/utils'
const { frontmatter: post, file } = Astro.props.post
---
<div class="post-draft-preview">
<div class="sm:w-20 md:w-32">
<div class="post-draft-preview__date">
<span class="post-draft-preview__date__day">{ new Date(post.date).getDate() }</span>
<span class="post-draft-preview__date__month-n-year">{ `${getMonthName(post.date)} ${new Date(post.date).getFullYear()}` }</span>
</div>
</div>
<div class="flex-1">
<h4 class="post-draft-preview__title">
<a href={`/drafts/${getSlugFromPathname(file)}`} title={post.title}>{post.title}</a>
</h4>
<p class="post-draft-preview__desc">
{post.description}
</p>
</div>
</div>
<style>
.post-draft-preview {
@apply flex gap-6
}
.post-draft-preview__date {
@apply flex flex-col w-full text-center
}
.post-draft-preview__date__day {
@apply text-6xl font-semibold text-gray-500 dark:text-gray-300
}
.post-draft-preview__date__month-n-year {
@apply text-gray-400
}
.post-draft-preview__title {
@apply text-2xl font-semibold text-theme-primary dark:text-theme-dark-primary hover:underline mb-2
}
.post-draft-preview__desc {
@apply text-lg leading-6 dark:text-white line-clamp-2
}
</style>

View File

@@ -0,0 +1,14 @@
---
import PostDraftPreview from './PostDraftPreview.astro'
const { posts } = Astro.props
---
<section class="post-draft-preview__list">
{posts.map((post) => (
<PostDraftPreview post={post}/>
))}
</section>
<style>
.post-draft-preview__list {
@apply flex flex-col gap-12
}
</style>

View File

@@ -0,0 +1,40 @@
---
import { getMonthName } from '$/utils'
const { frontmatter: post, url } = Astro.props.post
---
<div class="post-preview">
<div class="sm:w-20 md:w-32">
<div class="post-preview__date">
<span class="post-preview__date__day">{ new Date(post.date).getDate() }</span>
<span class="post-preview__date__month-n-year">{ `${getMonthName(post.date)} ${new Date(post.date).getFullYear()}` }</span>
</div>
</div>
<div class="flex-1">
<h4 class="post-preview__title">
<a href={url} title={post.title}>{post.title}</a>
</h4>
<p class="post-preview__desc">
{post.description}
</p>
</div>
</div>
<style>
.post-preview {
@apply flex gap-6;
}
.post-preview__date {
@apply flex flex-col w-full text-center;
}
.post-preview__date__day {
@apply text-6xl font-semibold text-gray-500 dark:text-gray-300;
}
.post-preview__date__month-n-year {
@apply text-gray-400;
}
.post-preview__title {
@apply text-2xl font-semibold text-theme-primary dark:text-theme-dark-primary hover:underline mb-2;
}
.post-preview__desc {
@apply text-lg leading-6 line-clamp-2 dark:text-white;
}
</style>

View File

@@ -0,0 +1,15 @@
---
import PostPreview from './PostPreview.astro'
const { posts } = Astro.props
const sortedPosts = posts.sort((a, b) => new Date(b.date) - new Date(a.date));
---
<section class="post-preview__list">
{sortedPosts.map((post) => (
<PostPreview post={post}/>
))}
</section>
<style>
.post-preview__list {
@apply flex flex-col gap-12
}
</style>

View File

@@ -0,0 +1,46 @@
<script lang="ts">
type Props = {
slug: string
title: string
description: string
category: string,
tags: Array<string>
}
export let post: Props
export let isLast: boolean = false
</script>
<div class="post-preview hover:bg-theme-primary">
<div class="flex-1">
<h4 class="post-preview__title">
<a href={`/${post.category}/${post.slug}`} title={post.title}>{post.title} &rarr;</a>
</h4>
<p class="post-preview__desc">
{post.description}
</p>
<ul class="tag-list">
{#each post.tags as tag}
<a class="tag" href={`/tags/${tag}`} title={tag}>{tag}</a>
{/each}
</ul>
</div>
</div>
{#if !isLast}
<hr class="my-4 text-theme-dark-secondary"/>
{/if}
<style lang="postcss">
.post-preview {
@apply flex gap-6 text-left;
}
.post-preview__title {
@apply text-lg leading-tight font-semibold text-white mb-2;
}
.post-preview__desc {
@apply text-base text-theme-dark-primary leading-5 line-clamp-2;
}
.tag-list {
@apply list-none py-2 flex flex-wrap gap-2;
}
.tag {
@apply inline-block text-xs px-4 py-1 rounded-full text-theme-primary bg-theme-dark-primary;
}
</style>

View File

@@ -0,0 +1,11 @@
<article class="prose dark:prose-dark">
<slot />
</article>
<style>
.prose {
@apply max-w-none
/* Size Modifiers: https://github.com/tailwindlabs/tailwindcss-typography#size-modifiers */
/* Color Themes: https://github.com/tailwindlabs/tailwindcss-typography#color-modifiers */
}
</style>

View File

@@ -0,0 +1,96 @@
<script lang="ts">
import { onMount } from 'svelte'
import SearchIcon from './SearchIcon.svelte'
import PostSearchPreview from './PostSearchPreview.svelte'
let searchInput
let searchableDocs
let searchIndex
let searchQuery = ''
let searchResults = []
onMount(async() => {
const lunr = (await import('lunr')).default
const resp = await fetch('/search-index.json')
searchableDocs = await resp.json()
// Initialize indexing
searchIndex = lunr(function(){
// the match key...
this.ref('slug')
// indexable properties
this.field('title')
this.field('description')
this.field('tags')
// Omit, if you don't want to search on `body`
this.field('body')
// Index every document
searchableDocs.forEach(doc => {
this.add(doc)
}, this)
})
searchInput.focus()
})
$: {
if(searchQuery && searchQuery.length >= 3) {
const matches = searchIndex.search(searchQuery)
searchResults = []
matches.map(match => {
searchableDocs.filter(doc => {
if(match.ref === doc.slug) {
searchResults.push(doc)
}
})
})
}
}
</script>
<div class="search">
<div class="search__ctrl">
<label for="search"><SearchIcon found={searchResults.length > 0} /></label>
<input type="text" name="search" bind:this={searchInput} placeholder="What are you looking for?" bind:value={searchQuery} />
</div>
<div class="search__results">
{#if searchResults.length}
{#each searchResults as post, i }
<PostSearchPreview post={post} isLast={ i === searchResults.length - 1 } />
{/each}
{:else}
<div class="search__results--none">
{#if searchQuery.length}
No matching items found!
{:else}
Search something and let me find it for you! :-)
{/if}
</div>
{/if}
</div>
<div class="note"><small>click anywhere outside to close</small></div>
</div>
<style>
.search {
@apply w-full relative bg-theme-primary p-8 rounded-md shadow-lg;
}
input {
@apply w-full px-4 py-2 pl-10 text-xl font-semibold text-gray-600 border-0 shadow-inner rounded-md bg-gray-100 placeholder-theme-dark-secondary;
}
.search__ctrl {
@apply pb-4 relative;
}
.search__ctrl label {
@apply text-theme-primary absolute top-2 left-2;
}
.search__results {
@apply w-96 h-64 py-4 overflow-y-auto;
}
.search__results--none {
@apply text-center text-theme-dark-primary;
}
.note {
@apply w-full text-center text-white;
}
</style>

View File

@@ -0,0 +1,11 @@
<script lang="ts">
import SearchIcon from './SearchIcon.svelte'
import { isSearchVisible } from '../store/search'
function showSearchDialog() {
isSearchVisible.set(true)
}
</script>
<button on:click={showSearchDialog}>
<SearchIcon />
</button>

View File

@@ -0,0 +1,18 @@
<script lang="ts">
import SvgIcon from './SvgIcon.svelte'
export let found:boolean = false
</script>
<SvgIcon>
{#if found}
<path
d="M7.66542 10.2366L9.19751 8.951L10.4831 10.4831L13.5473 7.91194L14.8328 9.44402L10.2366 13.3007L7.66542 10.2366Z"
fill="currentColor"
/>
{/if}
<path
fill-rule="evenodd"
clip-rule="evenodd"
d="M16.2071 4.89344C19.0923 7.77862 19.3131 12.3193 16.8693 15.4578C16.8846 15.4713 16.8996 15.4854 16.9143 15.5L21.1569 19.7427C21.5474 20.1332 21.5474 20.7664 21.1569 21.1569C20.7664 21.5474 20.1332 21.5474 19.7427 21.1569L15.5 16.9143C15.4854 16.8996 15.4713 16.8846 15.4578 16.8693C12.3193 19.3131 7.77862 19.0923 4.89344 16.2071C1.76924 13.083 1.76924 8.01763 4.89344 4.89344C8.01763 1.76924 13.083 1.76924 16.2071 4.89344ZM14.7929 14.7929C17.1361 12.4498 17.1361 8.6508 14.7929 6.30765C12.4498 3.96451 8.6508 3.96451 6.30765 6.30765C3.96451 8.6508 3.96451 12.4498 6.30765 14.7929C8.6508 17.1361 12.4498 17.1361 14.7929 14.7929Z"
fill="currentColor"
/>
</SvgIcon>

View File

@@ -0,0 +1,32 @@
<script lang="ts">
import { fade, fly } from 'svelte/transition'
import { isSearchVisible } from '../store/search'
import Search from './Search.svelte'
const dismissModal = () => isSearchVisible.set(false)
const handleEsc = (event) => {
if (event.key === 'Escape') {
dismissModal()
}
}
</script>
{#if $isSearchVisible}
<div class="modal__backdrop" on:click={dismissModal} on:keydown={handleEsc} transition:fade></div>
<div class="modal">
<div class="modal__cnt" transition:fly="{{ y: 200, duration: 300 }}">
<Search />
</div>
</div>
{/if}
<style>
.modal {
@apply absolute top-0 left-0 w-full h-full grid justify-center content-center pointer-events-none;
}
.modal__backdrop {
@apply absolute top-0 left-0 w-full h-screen opacity-50 bg-gradient-to-tr from-fuchsia-600 to-fuchsia-900 z-0;
}
.modal__cnt {
@apply w-full z-10 pointer-events-auto;
}
</style>

View File

@@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<slot />
</svg>

After

Width:  |  Height:  |  Size: 202 B

View File

@@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<slot/>
</svg>

After

Width:  |  Height:  |  Size: 201 B

37
src/config.ts Normal file
View File

@@ -0,0 +1,37 @@
import type{ NavItems } from './types'
export const NAV_ITEMS: NavItems = {
home: {
path: '/',
title: 'home'
},
blog: {
path: '/blog',
title: 'blog'
},
tags: {
path: '/tags',
title: 'tags'
},
media: {
path: '/media',
title: 'media'
},
about: {
path: '/about',
title: 'about'
}
}
export const SITE = {
// Your site's detail?
name: 'Ink',
title: 'Astro - Ink',
description: 'Crisp, minimal, personal blog theme for Astro',
url: 'https://astro-ink.vercel.app',
githubUrl: 'https://github.com/one-aalam/astro-ink',
listDrafts: true
// description ?
}
export const PAGE_SIZE = 8

0
src/data/.gitkeep Normal file
View File

34
src/data/astro-media.json Normal file
View File

@@ -0,0 +1,34 @@
[
{
"title": "Ship Less JavaScript with Astro",
"description": "Astro is a way to build websites that ships zero JavaScript by default. Only add JS when you need it for maximum performance! Fred K. Schott will teach us how it works.",
"url": "https://youtu.be/z15YLsLMtu4?list=PLz8Iz-Fnk_eTpvd49Sa77NiF8Uqq5Iykx",
"host": "Jason Lengstorf",
"participants": ["Fred K. Schott"],
"date": "2021-05-08"
},
{
"title": "Astro: A New Architecture for the Modern Web",
"description": "JavaScript meetup for mad science, hacking, and experiments. Hang out virtually on Friday at 4pm Pacific Time each week.",
"url": "https://www.youtube.com/watch?v=mgkwZqVkrwo",
"host": "Feross",
"participants": ["Fred K. Schott"],
"date": "2021-06-08"
},
{
"title": "Astro in 100 Seconds",
"description": "Astro is an open-source tool that can build static HTML websites using popular frontend JavaScript frameworks (React, Vue, Svelte), while loading fully interactive components as needed https://github.com/snowpackjs/astro",
"url": "https://www.youtube.com/watch?v=dsTXcSeAZq8",
"host": "Jeff Delaney",
"participants": [],
"date": "2021-07-12"
},
{
"title": "Yapping About Astro",
"description": "Build a static-by-default site using JavaScript components and only load whatever JavaScript you need by opting in very carefully.",
"url": "https://www.youtube.com/watch?v=3jPaidbpUIA",
"host": "Chris Coyier",
"participants": [],
"date": "2021-08-07"
}
]

33
src/layouts/default.astro Normal file
View File

@@ -0,0 +1,33 @@
---
import { SITE } from '$/config'
import BaseHead from '$/components/BaseHead.astro';
import MainLayout from '$/components/MainLayout.astro';
const { content, showPageHeader = true } = Astro.props
---
<!doctype html>
<html lang="en">
<head>
<BaseHead title={ content.title ? `${ SITE.title } | ${content.title}` : SITE.title } description={ content.description }/>
</head>
<MainLayout>
{showPageHeader &&
<div class="page__header">
<h1 class="page__title">{content.title}</h1>
<h5 class="page__desc">{content.description}</h5>
</div>
}
<slot />
</MainLayout>
</html>
<style>
.page__header {
@apply py-4 mb-1
}
.page__title {
@apply text-5xl font-extrabold text-theme-primary dark:text-theme-dark-primary
}
.page__desc {
@apply text-gray-400
}
</style>

View File

@@ -0,0 +1,60 @@
---
import { SITE } from '$/config'
import MainLayout from '$/components/MainLayout.astro'
import BaseHead from '$/components/BaseHead.astro'
import Prose from '$/components/Prose.astro'
const { content } = Astro.props
---
<!doctype html>
<html lang="en">
<head>
<BaseHead title={ content.title ? `${ SITE.title } | ${content.title}` : SITE.title } description={ content.description }/>
</head>
<MainLayout>
<div class="post__header">
<div class="post__tags">
{ content.tags.length > 0 && content.tags.map(tag => <a class="post__tag" href={`/tags/${tag}`} title={tag}>{tag}</a>) }
</div>
<h1 class="post__title">{ content.title }</h1>
<h5 class="post__desc">
<a class="post__author" href={`https://twitter.com/${content.authorTwitter}`} title={`${content.author + "'s"} twitter`} target="_blank" rel="external">{ content.author }</a> |
<span class="post__date">{ new Intl.DateTimeFormat('en-US', { dateStyle: 'full' }).format(new Date(content.date))}</span>
</h5>
</div>
<div class="draft-message">
You're viewing a <strong>preview</strong> of <code>/blog/{content.slug}</code> which isn't published yet!
</div>
<!--<img src={content.image} alt={content.title} />-->
<Prose>
<slot />
</Prose>
</MainLayout>
</html>
<style>
.post__header {
@apply py-4 mb-1
}
.post__title {
@apply text-5xl font-extrabold text-theme-primary dark:text-theme-dark-primary
}
.post__desc {
@apply text-gray-500 dark:text-gray-100
}
.post__author {
@apply no-underline dark:text-white hover:text-theme-primary
}
.post__date {
@apply text-gray-400
}
.post__tags {
@apply inline-flex gap-2
}
.post__tag {
@apply text-gray-400 hover:text-theme-primary dark:hover:text-theme-dark-primary
}
.draft-message {
@apply bg-yellow-300 dark:bg-yellow-700 text-gray-700 dark:text-white px-2 py-1 my-2
}
</style>

53
src/layouts/post.astro Normal file
View File

@@ -0,0 +1,53 @@
---
import { SITE } from '$/config'
import MainLayout from '$/components/MainLayout.astro'
import BaseHead from '$/components/BaseHead.astro'
import Prose from '$/components/Prose.astro'
const { content } = Astro.props
---
<!doctype html>
<html lang="en">
<head>
<BaseHead title={ content.title ? `${ SITE.title } | ${content.title}` : SITE.title } description={ content.description }/>
</head>
<MainLayout>
<div class="post__header">
<div class="post__tags">
{ content.tags.length > 0 && content.tags.map(tag => <a class="post__tag" href={`/tags/${tag}`} title={tag}>{tag}</a>) }
</div>
<h1 class="post__title">{ content.title }</h1>
<h5 class="post__desc">
<a class="post__author" href={`https://twitter.com/${content.authorTwitter}`} title={`${content.author + "'s"} twitter`} target="_blank" rel="external">{ content.author }</a> |
<span class="post__date">{ new Intl.DateTimeFormat('en-US', { dateStyle: 'full' }).format(new Date(content.date))}</span>
</h5>
</div>
<!--<img src={content.image} alt={content.title} />-->
<Prose>
<slot />
</Prose>
</MainLayout>
</html>
<style>
.post__header {
@apply py-4 mb-1
}
.post__title {
@apply text-5xl font-extrabold text-theme-primary dark:text-theme-dark-primary
}
.post__desc {
@apply text-gray-500 dark:text-gray-100
}
.post__author {
@apply no-underline dark:text-white hover:text-theme-primary
}
.post__date {
@apply text-gray-400
}
.post__tags {
@apply inline-flex gap-2
}
.post__tag {
@apply text-gray-400 hover:text-theme-primary dark:hover:text-theme-dark-primary
}
</style>

18
src/pages/about.mdx Normal file
View File

@@ -0,0 +1,18 @@
---
title: 'About'
description: 'There is a simple secret to building a faster website — just ship less.'
---
import DefaultPageLayout from '$/layouts/default.astro'
import Prose from '$/components/Prose.astro'
<DefaultPageLayout content={{ title: frontmatter.title, description: frontmatter.description }}>
<Prose>
Astro-Ink is a crisp, minimal, personal blog theme for Astro, that shows the capability of statically built sites - offering all the goodness and DX of the modern JS ecosystem without actually shipping any JS by default. It's built by...
## Few Bots, Meta-humans & a Guy!
Aftab Alam // [@aftabbuddy](https://twitter.com/aftabbuddy) // [one-aalam](https://github.com/one-aalam)
<div class="author">
<img class="rounded-full" width="160" src="https://assets.website-files.com/5e51c674258ffe10d286d30a/5e5358878e2493fbea064dd9_peep-59.svg" title="Aalam" />
</div>
</Prose>
</DefaultPageLayout>

View File

@@ -0,0 +1,24 @@
---
import DefaultPageLayout from '$/layouts/default.astro'
import PostPreviewList from '$/components/PostPreviewList.astro'
import Paginator from '$/components/Paginator.astro'
import { PAGE_SIZE } from '$/config'
let title = 'Blog'
let description = 'All the articles posted so far...'
export async function getStaticPaths({ paginate }) {
const allPosts = await Astro.glob('./*.md');
const sortedPosts = allPosts.sort((a, b) => new Date(b.date) - new Date(a.date));
return paginate(sortedPosts, {
pageSize: PAGE_SIZE
})
}
const { page } = Astro.props
---
<DefaultPageLayout content={{ title, description }}>
<PostPreviewList posts={page.data} />
<Paginator page={page} />
</DefaultPageLayout>

View File

@@ -0,0 +1,11 @@
---
layout: $/layouts/post.astro
title: hihiiiiii
description: lol
tags:
- test
author: me
authorTwitter: me
date: 2022-10-30T11:25:18.276Z
---
hid

View File

@@ -0,0 +1,65 @@
---
layout: $/layouts/post.astro
title: Introducing Astro - Ship Less JavaScript1
description: There's a simple secret to building a faster website — just ship less.
tags:
- astro
- jam-stack
author: Fred K. Schott
authorTwitter: FredKSchott
date: 2022-09-28T10:23:31.210Z
image: https://images.unsplash.com/photo-1589409514187-c21d14df0d04?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=1650&q=80
category: design
---
Unfortunately, modern web development has been trending in the opposite direction—towards more. More JavaScript, more features, more moving parts, and ultimately more complexity needed to keep it all running smoothly.
Today I'm excited to publicly share Astro: a new kind of static site builder that delivers lightning-fast performance with a modern developer experience. To design Astro, we borrowed the best parts of our favorite tools and then added a few innovations of our own, including:
- Bring Your Own Framework (BYOF): Build your site using React, Svelte, Vue, Preact, web components, or just plain ol' HTML + JavaScript.
- 100% Static HTML, No JS: Astro renders your entire page to static HTML, removing all JavaScript from your final build by default.
- On-Demand Components: Need some JS? Astro can automatically hydrate interactive components when they become visible on the page. If the user never sees it, they never load it.
- Fully-Featured: Astro supports TypeScript, Scoped CSS, CSS Modules, Sass, Tailwind, Markdown, MDX, and any of your favorite npm packages.
- SEO Enabled: Automatic sitemaps, RSS feeds, pagination and collections take the pain out of SEO and syndication.
## H1 is good
### H2 is good too
> links are better
[I know](they-are-better)
This post marks the first public beta release of Astro. Missing features and bugs are still to be expected at this early stage. There are still some months to go before an official 1.0 release, but there are already several fast sites built with Astro in production today. We would love your early feedback as we move towards a v1.0 release later this year.
> To learn more about Astro and start building your first site, check out the project README.
# Example - Syntax Highlighting
## Shell(Bash)
```bash
# make a new project directory and jump into it
mkdir my-astro-project && cd $_
# create a new project with npm
npm create astro@latest
# or yarn
yarn create astro
# or pnpm
pnpm create astro@latest
```
## Python
```python
print('hello world')
```
## Javascript
```js
const func = () => {alert("hello")}
```

View File

@@ -0,0 +1,65 @@
---
layout: $/layouts/post.astro
title: Introducing Astro - Ship Less JavaScript
description: There's a simple secret to building a faster website — just ship less.
tags:
- astro
- jam-stack
author: Fred K. Schott
authorTwitter: FredKSchott
date: 2022-09-18T13:10:23.402Z
image: https://images.unsplash.com/photo-1589409514187-c21d14df0d04?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=1650&q=80
category: design
---
Unfortunately, modern web development has been trending in the opposite direction—towards more. More JavaScript, more features, more moving parts, and ultimately more complexity needed to keep it all running smoothly.
Today I'm excited to publicly share Astro: a new kind of static site builder that delivers lightning-fast performance with a modern developer experience. To design Astro, we borrowed the best parts of our favorite tools and then added a few innovations of our own, including:
- Bring Your Own Framework (BYOF): Build your site using React, Svelte, Vue, Preact, web components, or just plain ol' HTML + JavaScript.
- 100% Static HTML, No JS: Astro renders your entire page to static HTML, removing all JavaScript from your final build by default.
- On-Demand Components: Need some JS? Astro can automatically hydrate interactive components when they become visible on the page. If the user never sees it, they never load it.
- Fully-Featured: Astro supports TypeScript, Scoped CSS, CSS Modules, Sass, Tailwind, Markdown, MDX, and any of your favorite npm packages.
- SEO Enabled: Automatic sitemaps, RSS feeds, pagination and collections take the pain out of SEO and syndication.
## H1 is good
### H2 is good too
> links are better
[I know](they-are-better)
This post marks the first public beta release of Astro. Missing features and bugs are still to be expected at this early stage. There are still some months to go before an official 1.0 release, but there are already several fast sites built with Astro in production today. We would love your early feedback as we move towards a v1.0 release later this year.
> To learn more about Astro and start building your first site, check out the project README.
# Example - Syntax Highlighting
## Shell(Bash)
```bash
# make a new project directory and jump into it
mkdir my-astro-project && cd $_
# create a new project with npm
npm create astro@latest
# or yarn
yarn create astro
# or pnpm
pnpm create astro@latest
```
## Python
```python
print('hello world')
```
## Javascript
```js
const func = () => {alert("hello")}
```

View File

@@ -0,0 +1,35 @@
---
layout: $/layouts/post.astro
title: Introducing Astro - Ship Less JavaScript
date: 2021-06-08
image: https://images.unsplash.com/photo-1589409514187-c21d14df0d04?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=1650&q=80
author: Fred K. Schott
authorTwitter: FredKSchott
category: design
tags:
- astro
- jam-stack
description: There's a simple secret to building a faster website — just ship less.
---
Unfortunately, modern web development has been trending in the opposite direction—towards more. More JavaScript, more features, more moving parts, and ultimately more complexity needed to keep it all running smoothly.
Today I'm excited to publicly share Astro: a new kind of static site builder that delivers lightning-fast performance with a modern developer experience. To design Astro, we borrowed the best parts of our favorite tools and then added a few innovations of our own, including:
- Bring Your Own Framework (BYOF): Build your site using React, Svelte, Vue, Preact, web components, or just plain ol' HTML + JavaScript.
- 100% Static HTML, No JS: Astro renders your entire page to static HTML, removing all JavaScript from your final build by default.
- On-Demand Components: Need some JS? Astro can automatically hydrate interactive components when they become visible on the page. If the user never sees it, they never load it.
- Fully-Featured: Astro supports TypeScript, Scoped CSS, CSS Modules, Sass, Tailwind, Markdown, MDX, and any of your favorite npm packages.
- SEO Enabled: Automatic sitemaps, RSS feeds, pagination and collections take the pain out of SEO and syndication.
## H1 is good
### H2 is good too
> links are better
[I know](they-are-better)
This post marks the first public beta release of Astro. Missing features and bugs are still to be expected at this early stage. There are still some months to go before an official 1.0 release, but there are already several fast sites built with Astro in production today. We would love your early feedback as we move towards a v1.0 release later this year.
> To learn more about Astro and start building your first site, check out the project README.

View File

@@ -0,0 +1,16 @@
---
layout: $/layouts/post.astro
title: Islands Architecture
date: 2021-05-08
image: https://images.unsplash.com/photo-1502085671122-2d218cd434e6?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=1698&q=80
author: Jason Miller
authorTwitter: _developit
category: development
tags:
- astro
- jam-stack
- architecture
- front-end
description: Render HTML pages on the server, and inject placeholders or slots around highly dynamic regions.
---
https://jasonformat.com/islands-architecture/

View File

@@ -0,0 +1,15 @@
---
layout: $/layouts/post.astro
title: Second-guessing the modern web
date: 2021-04-10
image: https://images.unsplash.com/photo-1501772418-b33899635bca?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=1650&q=80
author: Tom MacWright
authorTwitter: tmcw
category: design
tags:
- architecture
- front-end
- spa
description: There is a sweet spot of React - in moderately interactive interfaces..
---
https://macwright.com/2020/05/10/spa-fatigue.html

View File

@@ -0,0 +1,31 @@
---
import DefaultPageLayout from '$/layouts/default.astro'
import PostDraftPreviewList from '$/components/PostDraftPreviewList.astro'
import Paginator from '$/components/Paginator.astro'
import { SITE, PAGE_SIZE } from '$/config'
let title = 'Drafts'
let description = 'You\'re viewing a list of unpublished articles on the site. Accuracy or correctness isn\'t guranteed...'
export async function getStaticPaths({ paginate, rss }) {
let allPosts = []
try {
allPosts = await Astro.glob('../../drafts/*.md');
} catch(error) {
console.log('No draft posts found while generating the index page for the draft pages')
}
const sortedPosts = allPosts.sort((a, b) => new Date(b.date) - new Date(a.date));
return paginate(sortedPosts, {
pageSize: PAGE_SIZE
})
}
const { page } = Astro.props
---
<DefaultPageLayout content={{ title, description }}>
{
(SITE.listDrafts) ? <PostDraftPreviewList posts={page.data} /> : (<p class="text-gray-700 dark:text-gray-100">Looks like you have landed on a unpublished posts page. Please find all the published posts <a href="/blog">here</a>!</p>)
}
<Paginator page={page} />
</DefaultPageLayout>

View File

@@ -0,0 +1,47 @@
---
import { getSlugFromPathname } from '$/utils'
import PostDraftPageLayout from '$/layouts/post-draft.astro'
export async function getStaticPaths({ }) {
let allPosts = []
try {
allPosts = await Astro.glob('../../../drafts/*.md')
} catch(error) {
console.log('No draft posts found while generating the draft pages')
}
const allSlugs = new Set()
const allPostsWithSlug = allPosts.map(post => {
// @ts-ignore
const slug = getSlugFromPathname(post.file)
allSlugs.add(slug.toLowerCase())
return {
...post,
slug
}
})
return Array.from(allSlugs).map((slug) => {
const filteredPosts = allPostsWithSlug.filter((post) => post.slug === slug )
return {
params: { slug },
props: {
pages: filteredPosts
}
};
});
}
const { slug } = Astro.params
const { pages } = Astro.props
const [ post ] = pages
---
<div class="draft-message">
You're viewing a <strong>preview</strong> of <code>/blog/{slug}</code> which isn't published yet!
</div>
<post.Content/>
<style>
.draft-message {
@apply w-full bg-yellow-300 dark:bg-yellow-700 text-gray-700 dark:text-white px-2 py-1 text-center
}
</style>

25
src/pages/index.astro Normal file
View File

@@ -0,0 +1,25 @@
---
import DefaultPageLayout from '$/layouts/default.astro'
import PostPreviewList from '$/components/PostPreviewList.astro'
const title = 'Home'
const description = 'Astro-Ink is a crisp, minimal, personal blog theme for Astro'
const posts = await Astro.glob('./blog/*.md')
---
<DefaultPageLayout content={{ title, description }} showPageHeader={false}>
<PostPreviewList posts={posts} />
<div class="page__actions">
<a class="action__go-to-blog" href="/blog" title="All Posts">All Posts &rarr;</a>
</div>
</DefaultPageLayout>
<style>
.page__actions {
@apply flex justify-center md:justify-end py-6
}
.action__go-to-blog {
@apply text-base uppercase text-gray-500 dark:text-gray-400 hover:underline
}
</style>

15
src/pages/media.astro Normal file
View File

@@ -0,0 +1,15 @@
---
import DefaultPageLayout from '$/layouts/default.astro'
import MediaPreviewList from '$/components/MediaPreviewList.astro'
// import posts from '$/data/astro-media.json'
let title = 'Videos & Screencasts';
let description = 'All the great videos on Astro we could find for ya!'
const response = await fetch('https://raw.githubusercontent.com/one-aalam/astro-ink/main/src/data/astro-media.json')
const allPosts = await response.json()
const sortedPosts = allPosts.sort((a, b) => new Date(b.date) - new Date(a.date))
---
<DefaultPageLayout content={{ title, description }}>
<MediaPreviewList posts={sortedPosts} />
</DefaultPageLayout>

26
src/pages/rss.xml.js Normal file
View File

@@ -0,0 +1,26 @@
import rss from '@astrojs/rss';
import { SITE } from '../config'
const allPosts = import.meta.glob('./**/*.md', { eager: true })
const sortedPosts = Object.values(allPosts).sort((a, b) => new Date(b.date) - new Date(a.date));
export const get = () => rss({
// `<title>` field in output xml
title: `${SITE.name} | Blog`,
// `<description>` field in output xml
description: SITE.description,
// base URL for RSS <item> links
// SITE will use "site" from your project's astro.config.
site: import.meta.env.SITE,
// list of `<item>`s in output xml
// simple example: generate items for every md file in /src/pages
// see "Generating items" section for required frontmatter and advanced use cases
items: sortedPosts.map(item => ({
title: item.frontmatter.title,
description: item.frontmatter.description,
link: item.url,
pubDate: item.frontmatter.date,
})),
// (optional) inject custom xml
customData: `<language>en-us</language>`,
});

View File

@@ -0,0 +1,33 @@
---
import { PAGE_SIZE } from '$/config'
import DefaultPageLayout from '$/layouts/default.astro'
import PostPreviewList from '$/components/PostPreviewList.astro'
import Paginator from '$/components/Paginator.astro'
let title = 'Posts By Tags'
let description = 'All the articles posted so far...'
export async function getStaticPaths({ paginate }) {
const allPosts = await Astro.glob('../../blog/*.md')
const allTags = new Set()
allPosts.map(post => {
post.frontmatter.tags && post.frontmatter.tags.map(tag => allTags.add(tag.toLowerCase()))
})
return Array.from(allTags).map((tag) => {
const filteredPosts = allPosts.filter((post) => post.frontmatter.tags.includes(tag))
return paginate(filteredPosts, {
params: { tag },
pageSize: PAGE_SIZE
});
});
}
const { page } = Astro.props
const { tag } = Astro.params
---
<DefaultPageLayout content={{ title: `Posts by Tag: ${tag}`, description: `all of the articles we have posted and linked so far under the tag: ${tag}` }}>
<PostPreviewList posts={page.data} />
<Paginator page={page} />
</DefaultPageLayout>

View File

@@ -0,0 +1,29 @@
---
import DefaultPageLayout from '$/layouts/default.astro'
import PostPreviewList from '$/components/PostPreviewList.astro'
export async function getStaticPaths({ }) {
const allPosts = await Astro.glob('../../blog/*.md')
const allTags = new Set()
allPosts.map(post => {
post.frontmatter.tags && post.frontmatter.tags.map(tag => allTags.add(tag.toLowerCase()))
})
return Array.from(allTags).map((tag) => {
const filteredPosts = allPosts.filter((post) => post.frontmatter.tags.includes(tag))
return {
params: { tag },
props: {
pages: filteredPosts
}
};
});
}
const { pages } = Astro.props
const { tag } = Astro.params
---
<DefaultPageLayout content={{ title: `Posts by Tag: ${tag}`, description: `all of the articles we have posted and linked so far under the tag: ${tag}` }}>
<PostPreviewList posts={pages} />
</DefaultPageLayout>

View File

@@ -0,0 +1,27 @@
---
import DefaultPageLayout from '$/layouts/default.astro'
let title = 'All Tags'
let description = 'All the tags used so far...'
const allPosts = await Astro.glob('../blog/*.md');
const tags = [...new Set([].concat.apply([], allPosts.map(post => post.frontmatter.tags)))]
---
<DefaultPageLayout content={{ title, description }}>
<ul class="tag-list">
{tags.map((tag) => (
<li><a class="tag" href={`/tags/${tag}`} title={`View posts tagged under "${tag}"`}>{tag}</a></li>
))}
</ul>
</DefaultPageLayout>
<style>
.tag-list {
@apply list-none flex gap-2 flex-wrap
}
.tag {
@apply inline-block text-xl px-4 py-1 rounded-full text-theme-primary bg-theme-dark-primary dark:bg-theme-primary dark:text-theme-dark-primary hover:bg-theme-primary hover:text-theme-dark-primary dark:hover:bg-theme-dark-primary dark:hover:text-theme-primary
}
</style>

3
src/store/search.ts Normal file
View File

@@ -0,0 +1,3 @@
import { writable } from 'svelte/store'
export const isSearchVisible = writable<boolean>(false)

4
src/store/theme.ts Normal file
View File

@@ -0,0 +1,4 @@
import { writable } from 'svelte/store'
type ThemeType = 'dark' | 'light'
export const theme = writable<ThemeType>('dark')

14
src/styles/global.css Normal file
View File

@@ -0,0 +1,14 @@
@tailwind base;
/* https://github.com/tailwindlabs/tailwindcss/discussions/2917 */
@layer base {
body {
&.dark {
@apply text-gray-200;
header, footer {
@apply text-gray-400 border-gray-700;
}
}
}
}
@tailwind components;
@tailwind utilities;

8
src/types.ts Normal file
View File

@@ -0,0 +1,8 @@
export type NavItems = {
[key: string]: NavItem
}
export type NavItem = {
path: string
title: string
}

14
src/utils/index.ts Normal file
View File

@@ -0,0 +1,14 @@
import path from 'path'
const MONTHS = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
export const toTitleCase = (str: string) => str.replace(
/\w\S*/g,
function(txt) {
return txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase();
}
)
export const getMonthName = (date: Date) => MONTHS[new Date(date).getMonth()]
export const getSlugFromPathname = (pathname: string) => path.basename(pathname, path.extname(pathname))

69
tailwind.config.cjs Normal file
View File

@@ -0,0 +1,69 @@
const { fontFamily } = require('tailwindcss/defaultTheme')
const config = require('./tailwind.theme.config')
/**
* Find the applicable theme color palette, or use the default one
*/
const themeConfig = process.env.THEME_KEY && config[process.env.THEME_KEY] ? config[process.env.THEME_KEY] : config.default
const { colors } = themeConfig
module.exports = {
darkMode: 'class',
content: [
'./public/**/*.html',
'./src/**/*.{astro,js,ts}'
],
safelist: ['dark'],
theme: {
fontFamily: {
sans: ['Fira Code', ...fontFamily.sans],
},
extend: {
colors: {
theme: {
...colors
}
},
typography: (theme) => ({
dark: {
css: {
color: theme("colors.gray.200"),
},
},
DEFAULT: {
css: {
a: {
color: colors.dark.primary,
'&:hover': {
color: colors.primary,
},
},
blockquote: {
color: colors.primary,
borderColor: colors.dark.primary
},
'blockquote > p::before, p::after': {
color: colors.dark.primary,
},
h1: {
color: colors.dark.secondary,
},
h2: {
color: colors.dark.secondary,
},
h3: {
color: colors.dark.secondary,
},
}
},
}),
},
},
variants: {
extend: { typography: ["dark"] }
},
plugins: [
require('@tailwindcss/typography'),
require('@tailwindcss/forms'),
require('@tailwindcss/line-clamp'),
require('@tailwindcss/aspect-ratio'),
]
};

164
tailwind.theme.config.js Normal file
View File

@@ -0,0 +1,164 @@
const colors = require('tailwindcss/colors')
module.exports = {
/**
* Color Palette - Purple Heart
*/
purpleheart: {
colors: {
primary: colors.purple[700],
secondary: colors.purple[800],
dark: {
primary: colors.purple[300],
secondary: colors.purple[500]
},
accent: {
gray: {
light: colors.gray[300],
dark: colors.gray[500]
},
default: colors.blue[700]
}
}
},
/**
* Color Palette - Pink Town
*/
pinktown: {
colors: {
primary: colors.pink[700],
secondary: colors.pink[800],
dark: {
primary: colors.pink[300],
secondary: colors.pink[500]
},
accent: {
gray: {
light: colors.gray[300],
dark: colors.gray[500]
},
default: colors.blue[700]
}
}
},
/**
* Color Palette - Orange City
*/
orangecity: {
colors: {
primary: colors.orange[700],
secondary: colors.orange[800],
dark: {
primary: colors.orange[300],
secondary: colors.orange[500]
},
accent: {
gray: {
light: colors.gray[300],
dark: colors.gray[500]
},
default: colors.blue[700]
}
}
},
/**
* Color Palette - Amber Sky
*/
ambersky: {
colors: {
primary: colors.amber[700],
secondary: colors.amber[800],
dark: {
primary: colors.amber[300],
secondary: colors.amber[500]
},
accent: {
gray: {
light: colors.gray[300],
dark: colors.gray[500]
},
default: colors.blue[700]
}
}
},
/**
* Color Palette - Lime Route
*/
limeroute: {
colors: {
primary: colors.lime[700],
secondary: colors.lime[800],
dark: {
primary: colors.lime[300],
secondary: colors.lime[500]
},
accent: {
gray: {
light: colors.gray[300],
dark: colors.gray[500]
},
default: colors.blue[700]
}
}
},
/**
* Color Palette - Indigone
*/
indigone: {
colors: {
primary: colors.indigo[700],
secondary: colors.indigo[800],
dark: {
primary: colors.indigo[300],
secondary: colors.indigo[500]
},
accent: {
gray: {
light: colors.gray[300],
dark: colors.gray[500]
},
default: colors.blue[700]
}
}
},
/**
* Color Palette - Rose Garden
*/
rosegarden: {
colors: {
primary: colors.rose[700],
secondary: colors.rose[800],
dark: {
primary: colors.rose[300],
secondary: colors.rose[500]
},
accent: {
gray: {
light: colors.gray[300],
dark: colors.gray[500]
},
default: colors.blue[700]
}
}
},
/**
* Color Palette - Default/Duplicate of Purple Heart (Never remove this)
*/
default: {
colors: {
primary: colors.purple[700],
secondary: colors.purple[800],
dark: {
primary: colors.purple[300],
secondary: colors.purple[500]
},
accent: {
gray: {
light: colors.gray[300],
dark: colors.gray[500]
},
default: colors.blue[700]
}
}
}
}

24
tsconfig.json Normal file
View File

@@ -0,0 +1,24 @@
{
"compilerOptions": {
"moduleResolution": "node",
"module": "ES2022",
"lib": ["es2020"],
"target": "es2019",
"importsNotUsedAsValues": "error",
"isolatedModules": true,
"resolveJsonModule": true,
"sourceMap": true,
"esModuleInterop": true,
"skipLibCheck": true,
"forceConsistentCasingInFileNames": true,
"allowJs": true,
"checkJs": true,
"baseUrl": ".",
"paths": {
"$components": ["./src/components"],
"$": ["./src"]
},
"types": ["astro/env"]
},
"include": ["src/**/*.d.ts", "src/**/*.js", "src/**/*.ts"],
}

4379
yarn.lock Normal file

File diff suppressed because it is too large Load Diff