├── .npmignore
├── .gitignore
├── styles
    ├── vssue.styl
    ├── card.styl
    ├── tool-group.styl
    ├── config.styl
    ├── arrow.styl
    ├── custom-blocks.styl
    ├── mobile.styl
    ├── nprogress.styl
    ├── transition.styl
    ├── code.styl
    └── theme.styl
├── layouts
    ├── TagLayout.vue
    ├── Tags.vue
    ├── Layout.vue
    ├── 404.vue
    ├── Page.vue
    └── Activity.vue
├── lib
    ├── comment.mixin.js
    ├── animation.js
    └── util.js
├── .release-it.json
├── components
    ├── ToolGroup.vue
    ├── List.vue
    ├── Footer.vue
    ├── TagsContainer.vue
    ├── NavLink.vue
    ├── Tag.vue
    ├── AnimationButton.vue
    ├── SidebarButton.vue
    ├── Sidebar.vue
    ├── Pagination.vue
    ├── NavLinks.vue
    ├── Navbar.vue
    ├── NoToolContainer.vue
    ├── SWUpdatePopup.vue
    ├── LayoutContainer.vue
    ├── PostCard.vue
    ├── GithubCard.vue
    └── SearchBox.vue
├── index.js
├── LICENSE
├── assets
    ├── search.svg
    └── 404.svg
├── CHANGELOG.md
├── package.json
├── README.md
└── animation
    └── particleBoom.vue


/.npmignore:
--------------------------------------------------------------------------------
1 | *.lock
2 | node_modules


--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
1 | .DS_Store
2 | node_modules
3 | *.lock
4 | *.log
5 | 


--------------------------------------------------------------------------------
/styles/vssue.styl:
--------------------------------------------------------------------------------
1 | @require './config'
2 | 
3 | $vssue-theme-color = $accentColor
4 | 
5 | @import '~vssue/src/styles/index'


--------------------------------------------------------------------------------
/layouts/TagLayout.vue:
--------------------------------------------------------------------------------
1 | <template>
2 |   <LayoutContainer>
3 |     <List :items="$tag ? $tag.pages : []" />
4 |   </LayoutContainer>
5 | </template>
6 | 


--------------------------------------------------------------------------------
/styles/card.styl:
--------------------------------------------------------------------------------
 1 | @require './config'
 2 | 
 3 | .card
 4 |   background #fff
 5 |   overflow hidden
 6 |   border-radius 2px
 7 |   box-shadow 0 1px 3px rgba(26,26,26,.1)
 8 |   box-sizing border-box
 9 |   margin 0 auto
10 |   margin-bottom 10px  


--------------------------------------------------------------------------------
/layouts/Tags.vue:
--------------------------------------------------------------------------------
 1 | <template>
 2 |   <LayoutContainer>
 3 |     <div>
 4 |       <TagsContainer 
 5 |         :tags="$tags.list" 
 6 |       />
 7 |     </div>
 8 |   </LayoutContainer>
 9 | </template>
10 | 
11 | <style lang="stylus" src='../styles/theme.styl'></style>
12 | 
13 | 


--------------------------------------------------------------------------------
/lib/comment.mixin.js:
--------------------------------------------------------------------------------
 1 | import Gitalk from 'gitalk';
 2 | 
 3 | const commentMixin = {
 4 |   methods: {
 5 |     comment() {
 6 |       if (!this.$site.themeConfig.comment) return;
 7 |       return new Gitalk(this.$site.themeConfig.comment);
 8 |     }
 9 |   }
10 | };
11 | 
12 | export default commentMixin;
13 | 


--------------------------------------------------------------------------------
/.release-it.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "src": {
 3 |     "tagName": "v%s",
 4 |     "commitMessage": "%s"
 5 |   },
 6 |   "increment": "conventional:angular",
 7 |   "beforeChangelogCommand": "conventional-changelog -p angular -i CHANGELOG.md -s",
 8 |   "changelogCommand": "conventional-changelog -p angular | tail -n +3",
 9 |   "safeBump": false
10 | }


--------------------------------------------------------------------------------
/components/ToolGroup.vue:
--------------------------------------------------------------------------------
 1 | <template>
 2 |   <div class="tool-group">
 3 |     <GithubCard />
 4 |   </div>
 5 | </template>
 6 | 
 7 | <script>
 8 | import GithubCard from './GithubCard.vue';
 9 | export default {
10 |   name: 'tool-group',
11 |   components: { GithubCard }
12 | };
13 | </script>
14 | 
15 | <style src='../styles/tool-group.styl' lang=stylus></style>


--------------------------------------------------------------------------------
/styles/tool-group.styl:
--------------------------------------------------------------------------------
 1 | @require './config'
 2 | @require './card'
 3 | 
 4 | .tool-group
 5 |   flex-grow 1
 6 |   position fixed
 7 |   top $navbarHeight + 1rem
 8 |   width $toolWidth + 3rem
 9 |   margin-left $pageWidth
10 | 
11 | @media (max-width ($MQNarrow + 1px))
12 |   .tool-group
13 |     position static
14 |     width auto 
15 |     margin-left 0
16 |     padding 1rem 0
17 | 


--------------------------------------------------------------------------------
/layouts/Layout.vue:
--------------------------------------------------------------------------------
 1 | <template>
 2 |   <LayoutContainer>
 3 |     <List :items="$pagination.posts"/>
 4 |     <Pagination />
 5 |   </LayoutContainer>
 6 | </template>
 7 | 
 8 | <style lang="stylus" src="../styles/theme.styl"></style>
 9 | <style lang='stylus'>
10 | @import '../styles/config.styl';
11 | 
12 | .main
13 |   width $appWidth
14 |   padding 1rem
15 |   margin 0 auto
16 | 
17 | .post-list-wrap
18 |   width 43rem
19 | </style>


--------------------------------------------------------------------------------
/components/List.vue:
--------------------------------------------------------------------------------
 1 | <template>
 2 |   <div>
 3 |     <template v-for="(info, idx) in items">
 4 |       <PostCard :post="info" :key="idx" />
 5 |     </template>
 6 |   </div>
 7 | </template>
 8 | 
 9 | <script>
10 | export default {
11 |   props: ['items']
12 | };
13 | </script>
14 | 
15 | <style lang="stylus">
16 | @import '../styles/config';
17 | 
18 | @media (max-width: ($MQNarrow + 1px)) {
19 |   .post-list {
20 |     margin-right: 0;
21 |   }
22 | }
23 | </style>


--------------------------------------------------------------------------------
/styles/config.styl:
--------------------------------------------------------------------------------
 1 | // colors
 2 | $accentColor = #1c94e0
 3 | $textColor = #2c3e50
 4 | $postColor = #ac3e40
 5 | $borderColor = #e6ecf0
 6 | $focusColor = #1b95e0
 7 | $codeBgColor = #282c34
 8 | 
 9 | // layout
10 | $navbarHeight = 3rem
11 | $sidebarWidth = 20rem
12 | $contentWidth = 740px
13 | $footerHeight = 32px
14 | 
15 | // responsive breakpoints
16 | $MQNarrow = 959px // pad
17 | $MQMobile = 719px // mobile
18 | $MQMobileNarrow = 419px
19 | 
20 | // global
21 | $appWidth = 1000px
22 | $toolWidth = 16rem
23 | $pageWidth = 43rem
24 | 


--------------------------------------------------------------------------------
/components/Footer.vue:
--------------------------------------------------------------------------------
 1 | <template>
 2 |   <footer class="footer">
 3 |     <span v-if="$themeConfig.footer">{{$themeConfig.footer}}</span>
 4 |     <span v-else>powered by vuepress theme Yubisaki</span>
 5 |   </footer>
 6 | </template>
 7 | 
 8 | <style lang="stylus">
 9 | @import '../styles/config.styl';
10 | .footer
11 |   width 100%
12 |   color #93a1a1
13 |   font-size 14px
14 |   padding-left 4rem
15 |   position fixed
16 |   bottom 0
17 |   background #eff5f3
18 |   height $footerHeight
19 |   line-height 32px
20 | 
21 | @media (max-width: ($MQMobile + 1px)) {
22 |   .footer {
23 |     padding-left 0
24 |     text-align center
25 |   }
26 | }
27 | </style>
28 | 


--------------------------------------------------------------------------------
/styles/arrow.styl:
--------------------------------------------------------------------------------
 1 | @require './config'
 2 | 
 3 | .arrow
 4 |   display inline-block
 5 |   width 0
 6 |   height 0
 7 |   &.up
 8 |     border-left 4px solid transparent
 9 |     border-right 4px solid transparent
10 |     border-bottom 6px solid $textColor
11 |   &.down
12 |     border-left 4px solid transparent
13 |     border-right 4px solid transparent
14 |     border-top 6px solid $textColor
15 |   &.right
16 |     border-top 4px solid transparent
17 |     border-bottom 4px solid transparent
18 |     border-left 6px solid $textColor
19 |   &.left
20 |     border-top 4px solid transparent
21 |     border-bottom 4px solid transparent
22 |     border-right 6px solid $textColor
23 | 


--------------------------------------------------------------------------------
/components/TagsContainer.vue:
--------------------------------------------------------------------------------
 1 | <template>
 2 |   <div>
 3 |     <h2>TAGS</h2>
 4 |     <div>
 5 |       <Tag v-for="(tag, idx) in tags"
 6 |         :key="idx"
 7 |         :tag="tag"
 8 |       >
 9 |         <router-link :to="tag.path" class="tag-link">
10 |           # {{tag.name}} {{tag.pages.length}}
11 |         </router-link>
12 |       </Tag>
13 |     </div>
14 |   </div>
15 | </template>
16 | 
17 | <script>
18 | export default {
19 |   props: ['tags'],
20 | }
21 | </script>
22 | 
23 | <style lang="stylus">
24 | @import '../styles/config.styl';
25 | 
26 | .tag-link
27 |   color #657786
28 |   transition all .2s ease-in-out
29 |   &:hover
30 |     color $accentColor
31 | </style>
32 | 


--------------------------------------------------------------------------------
/components/NavLink.vue:
--------------------------------------------------------------------------------
 1 | <template>
 2 |   <router-link
 3 |     class="nav-link"
 4 |     :to="link"
 5 |     v-if="!isExternal(link)"
 6 |     :exact="link === '/'"
 7 |   >{{ item.text }}</router-link>
 8 |   <a
 9 |     v-else
10 |     :href="link"
11 |     class="nav-link"
12 |     :target="isMailto(link) ? null : '_blank'"
13 |     :rel="isMailto(link) ? null : 'noopener noreferrer'"
14 |   >{{ item.text }}</a>
15 | </template>
16 | 
17 | <script>
18 | import { isExternal, isMailto, ensureExt } from '../lib/util'
19 | 
20 | export default {
21 |   props: {
22 |     item: {
23 |       required: true
24 |     }
25 |   },
26 |   computed: {
27 |     link () {
28 |       return ensureExt(this.item.link)
29 |     }
30 |   },
31 |   methods: {
32 |     isExternal,
33 |     isMailto
34 |   }
35 | }
36 | </script>
37 | 


--------------------------------------------------------------------------------
/styles/custom-blocks.styl:
--------------------------------------------------------------------------------
 1 | .custom-block
 2 |   .custom-block-title
 3 |     font-weight 600
 4 |     margin-bottom -0.4rem
 5 |   &.tip, &.warning, &.danger
 6 |     padding .1rem 1.5rem
 7 |     border-left-width .5rem
 8 |     border-left-style solid
 9 |     margin 1rem 0
10 |   &.tip
11 |     background-color #f3f5f7
12 |     border-color #42b983
13 |   &.warning
14 |     background-color rgba(255,229,100,.3)
15 |     border-color darken(#ffe564, 35%)
16 |     color darken(#ffe564, 70%)
17 |     .custom-block-title
18 |       color darken(#ffe564, 50%)
19 |     a
20 |       color $textColor
21 |   &.danger
22 |     background-color #ffe6e6
23 |     border-color darken(red, 20%)
24 |     color darken(red, 70%)
25 |     .custom-block-title
26 |       color darken(red, 40%)
27 |     a
28 |       color $textColor
29 | 


--------------------------------------------------------------------------------
/index.js:
--------------------------------------------------------------------------------
 1 | const path = require('path');
 2 | 
 3 | module.exports = ({ comments = {} }) => ({
 4 |   layoutDir: 'layouts',
 5 |   plugins: [
 6 |     ['@vuepress/google-analytics'],
 7 |     ['@vuepress/back-to-top'],
 8 |     ['@vuepress/medium-zoom'],
 9 |     ['@vssue/vuepress-plugin-vssue', Object.assign({
10 |       platform: 'github',
11 |     }, comments)],
12 |     ['@vuepress/register-components', {
13 |       componentsDir: [
14 |         path.resolve(__dirname, 'components')
15 |       ]
16 |     }],
17 |     ['@yubisaki/blog', {
18 |       pageEnhancers: [
19 |         {
20 |           when: ({ frontmatter }) => frontmatter.layout === 'Activity',
21 |           frontmatter: { layout: 'Activity' }
22 |         }
23 |       ]
24 |     }],
25 |     ['@yubisaki/pagination'],
26 |     'flowchart'
27 |   ]
28 | })
29 | 


--------------------------------------------------------------------------------
/styles/mobile.styl:
--------------------------------------------------------------------------------
 1 | @require './config'
 2 | 
 3 | $mobileSidebarWidth = $sidebarWidth * 0.8
 4 | 
 5 | // narrow desktop / iPad
 6 | @media (max-width: $MQNarrow)
 7 |   .sidebar
 8 |     font-size 15px
 9 |     width $mobileSidebarWidth
10 |   .content:not(.custom), .content__default:not(.custom)
11 |     padding 2rem
12 |   .content-header
13 |     padding 0 2rem
14 | 
15 | // wide mobile
16 | @media (max-width: $MQMobile)
17 |   .sidebar
18 |     top 0
19 |     padding-top $navbarHeight
20 |     transform translateX(-100%)
21 |     transition transform .2s ease
22 |   .theme.sidebar-open
23 |     .sidebar
24 |       transform translateX(0)
25 | 
26 | // narrow mobile
27 | @media (max-width: $MQMobileNarrow)
28 |   h1
29 |     font-size 1.9rem
30 |   .content:not(.custom), .content__default:not(.custom)
31 |     padding 1.5rem
32 |   .content, .content__default
33 |     pre, pre[class*="language-"]
34 |       margin 0.85rem -1.5rem
35 |       border-radius 0
36 | 


--------------------------------------------------------------------------------
/components/Tag.vue:
--------------------------------------------------------------------------------
 1 | <template>
 2 |   <span tabindex="0" class="tag-wrap">
 3 |     <span class="tag-inner">
 4 |       <slot></slot>
 5 |     </span>
 6 |   </span>
 7 | </template>
 8 | 
 9 | <script>
10 | export default {
11 |   props: ['tag', 'slug']
12 | };
13 | </script>
14 | 
15 | <style lang="stylus">
16 | .tag-wrap {
17 |   font-weight: 400;
18 |   // background #e0e0e0
19 |   // border 1px solid transparent
20 |   border: 1px solid #e8eaec;
21 |   background: #fff;
22 |   color: rgba(0, 0, 0, 0.87);
23 |   height: 24px;
24 |   border-radius: 2px;
25 |   align-items: center;
26 |   display: inline-flex;
27 |   vertical-align: middle;
28 |   font-size: 13px;
29 |   margin: 4px;
30 |   outline: none;
31 |   position: relative;
32 |   transition: 0.3s cubic-bezier(0.25, 0.8, 0.5, 1);
33 |   text-transform: capitalize;
34 | }
35 | 
36 | .tag-inner {
37 |   height: 24px;
38 |   line-height: 24px;
39 |   white-space: nowrap;
40 |   padding: 0 12px;
41 | }
42 | 
43 | .tag-active {
44 |   background-color: #3f51b5;
45 |   color: #fff;
46 | }
47 | </style>


--------------------------------------------------------------------------------
/components/AnimationButton.vue:
--------------------------------------------------------------------------------
 1 | <template>
 2 |   <div
 3 |     @click="go"
 4 |     class="nav-link"
 5 |     v-if="!isExternal(link)"
 6 |   >{{ item.text }}</div>
 7 |   <a
 8 |     v-else
 9 |     :href="link"
10 |     class="nav-link"
11 |     :target="isMailto(link) ? null : '_blank'"
12 |     :rel="isMailto(link) ? null : 'noopener noreferrer'"
13 |   >{{ item.text }}</a>
14 | </template>
15 | 
16 | <script>
17 | import { isExternal, isMailto, ensureExt } from '../lib/util';
18 | 
19 | export default {
20 |   props: {
21 |     item: {
22 |       required: true
23 |     }
24 |   },
25 |   data() {
26 |     return {
27 |       timeout: null
28 |     };
29 |   },
30 |   computed: {
31 |     link() {
32 |       return ensureExt(this.item.link);
33 |     }
34 |   },
35 |   methods: {
36 |     isExternal,
37 |     isMailto,
38 |     go() {
39 |       this.timeout = setTimeout(() => {
40 |         this.$router.push(this.link);
41 |       }, 1000);
42 |     }
43 |   },
44 |   destroyed() {
45 |     clearTimeout(this.timeout);
46 |   }
47 | };
48 | </script>
49 | 


--------------------------------------------------------------------------------
/components/SidebarButton.vue:
--------------------------------------------------------------------------------
 1 | <template>
 2 |   <div class="sidebar-button" @click="$emit('toggle-sidebar')">
 3 |     <svg class="icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" role="img" viewBox="0 0 448 512">
 4 |       <path fill="currentColor" d="M436 124H12c-6.627 0-12-5.373-12-12V80c0-6.627 5.373-12 12-12h424c6.627 0 12 5.373 12 12v32c0 6.627-5.373 12-12 12zm0 160H12c-6.627 0-12-5.373-12-12v-32c0-6.627 5.373-12 12-12h424c6.627 0 12 5.373 12 12v32c0 6.627-5.373 12-12 12zm0 160H12c-6.627 0-12-5.373-12-12v-32c0-6.627 5.373-12 12-12h424c6.627 0 12 5.373 12 12v32c0 6.627-5.373 12-12 12z" class=""></path>
 5 |     </svg>
 6 |   </div>
 7 | </template>
 8 | 
 9 | <style lang="stylus">
10 | @import '../styles/config.styl'
11 | 
12 | .sidebar-button
13 |   display none
14 |   width 1.25rem
15 |   height 1.25rem
16 |   position absolute
17 |   padding 0.6rem
18 |   top 0.275rem // ($navbarHeight - width - padding * 2) / 2
19 |   left 1rem 
20 |   .icon
21 |     display block
22 |     width 1.25rem
23 |     height 1.25rem
24 | 
25 | @media (max-width: $MQMobile)
26 |   .sidebar-button
27 |     display block
28 | </style>
29 | 


--------------------------------------------------------------------------------
/LICENSE:
--------------------------------------------------------------------------------
 1 | MIT License
 2 | 
 3 | Copyright (c) 2018 StickmY
 4 | 
 5 | Permission is hereby granted, free of charge, to any person obtaining a copy
 6 | of this software and associated documentation files (the "Software"), to deal
 7 | in the Software without restriction, including without limitation the rights
 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
 9 | copies of the Software, and to permit persons to whom the Software is
10 | furnished to do so, subject to the following conditions:
11 | 
12 | The above copyright notice and this permission notice shall be included in all
13 | copies or substantial portions of the Software.
14 | 
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21 | SOFTWARE.
22 | 


--------------------------------------------------------------------------------
/assets/search.svg:
--------------------------------------------------------------------------------
1 | <?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1538659434226" class="icon" style="" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2204" xmlns:xlink="http://www.w3.org/1999/xlink" width="32" height="32"><defs><style type="text/css"></style></defs><path d="M745.795714 636.944C825.047144 517.5 813.321432 354.48 708.767143 249.232 590.584286 130.256 398.91 130.256 280.675714 249.232 162.441429 368.208 162.441429 561.076 280.675714 680.052 385.281429 785.3 547.178571 797.052 665.052857 715.984 665.412857 716.4 768.440484 823.446456 768.440484 823.446456 783.762174 839.366568 808.83012 839.550504 824.43572 823.85284L847.747136 800.403904C863.35076 784.708233 863.515464 759.036136 848.227616 743.180462L745.795714 636.944ZM671.776342 642.815187C574.014865 741.11527 415.484203 741.11527 317.668565 642.815187 219.907087 544.405578 219.907087 384.88015 317.668565 286.525303 415.484203 188.115694 574.014865 188.115694 671.776342 286.47054 769.483658 384.88015 769.483658 544.405578 671.776342 642.815187L671.776342 642.815187Z" p-id="2205" fill="#66757f"></path></svg>


--------------------------------------------------------------------------------
/styles/nprogress.styl:
--------------------------------------------------------------------------------
 1 | #nprogress
 2 |   pointer-events none
 3 |   .bar
 4 |     background $accentColor
 5 |     position fixed
 6 |     z-index 1031
 7 |     top 0
 8 |     left 0
 9 |     width 100%
10 |     height 2px
11 |   .peg
12 |     display block
13 |     position absolute
14 |     right 0px
15 |     width 100px
16 |     height 100%
17 |     box-shadow 0 0 10px $accentColor, 0 0 5px $accentColor
18 |     opacity 1.0
19 |     transform rotate(3deg) translate(0px, -4px)
20 |   .spinner
21 |     display block
22 |     position fixed
23 |     z-index 1031
24 |     top 15px
25 |     right 15px
26 |   .spinner-icon
27 |     width 18px
28 |     height 18px
29 |     box-sizing border-box
30 |     border solid 2px transparent
31 |     border-top-color $accentColor
32 |     border-left-color $accentColor
33 |     border-radius 50%
34 |     animation nprogress-spinner 400ms linear infinite
35 | 
36 | .nprogress-custom-parent
37 |   overflow hidden
38 |   position relative
39 | 
40 | .nprogress-custom-parent #nprogress .spinner,
41 | .nprogress-custom-parent #nprogress .bar
42 |   position absolute
43 | 
44 | @keyframes nprogress-spinner
45 |   0% transform rotate(0deg)
46 |   100% transform rotate(360deg)
47 | 


--------------------------------------------------------------------------------
/lib/animation.js:
--------------------------------------------------------------------------------
 1 | /**
 2 |  * 粒子原型, 提供一个绘图函数
 3 |  */
 4 | export function ExplodingParticle() {
 5 |     this.animationDuration = 1000; // in ms
 6 | 
 7 |     // Set the speed for our particle
 8 |     this.speed = {
 9 |         x: -5 + Math.random() * 10,
10 |         y: -5 + Math.random() * 10
11 |     };
12 | 
13 |     // Size our particle
14 |     this.radius = 5 + Math.random() * 5;
15 | 
16 |     // Set a max time to live for our particle
17 |     this.life = 30 + Math.random() * 10;
18 |     this.remainingLife = this.life;
19 | 
20 |     // This function will be called by our animation logic later on
21 |     this.draw = ctx => {
22 |         let p = this;
23 | 
24 |         if (this.remainingLife > 0 && this.radius > 0) {
25 |             // Draw a circle at the current location
26 |             ctx.beginPath();
27 |             ctx.arc(p.startX, p.startY, p.radius, 0, Math.PI * 2);
28 |             ctx.fillStyle =
29 |                 "rgba(" +
30 |                 this.rgbArray[0] +
31 |                 "," +
32 |                 this.rgbArray[1] +
33 |                 "," +
34 |                 this.rgbArray[2] +
35 |                 ", 1)";
36 |             ctx.fill();
37 | 
38 |             // Update the particle's location and life
39 |             p.remainingLife--;
40 |             p.radius -= 0.25;
41 |             p.startX += p.speed.x;
42 |             p.startY += p.speed.y;
43 |         }
44 |     };
45 | };
46 | 


--------------------------------------------------------------------------------
/CHANGELOG.md:
--------------------------------------------------------------------------------
 1 | ## [3.1.9](https://github.com/Bloss/vuepress-theme-yubisaki/compare/v3.1.8...v3.1.9) (2019-04-04)
 2 | 
 3 | 
 4 | 
 5 | ## [3.1.8](https://github.com/Bloss/vuepress-theme-yubisaki/compare/v3.1.7...v3.1.8) (2019-04-04)
 6 | 
 7 | 
 8 | 
 9 | ## [3.1.7](https://github.com/Bloss/vuepress-theme-yubisaki/compare/v3.1.6...v3.1.7) (2019-04-04)
10 | 
11 | 
12 | 
13 | ## [3.1.6](https://github.com/Bloss/vuepress-theme-yubisaki/compare/v3.1.5...v3.1.6) (2019-03-02)
14 | 
15 | 
16 | 
17 | ## [3.1.5](https://github.com/Bloss/vuepress-theme-yubisaki/compare/v3.1.4...v3.1.5) (2019-03-02)
18 | 
19 | 
20 | 
21 | ## [3.1.4](https://github.com/Bloss/vuepress-theme-yubisaki/compare/v3.1.3...v3.1.4) (2019-01-22)
22 | 
23 | 
24 | ### Bug Fixes
25 | 
26 | * hide scroll bar ([c179e2d](https://github.com/Bloss/vuepress-theme-yubisaki/commit/c179e2d))
27 | 
28 | 
29 | 
30 | ## [3.1.3](https://github.com/Bloss/vuepress-theme-yubisaki/compare/v3.1.2...v3.1.3) (2019-01-10)
31 | 
32 | 
33 | 
34 | ## [3.1.2](https://github.com/Bloss/vuepress-theme-yubisaki/compare/v3.1.1...v3.1.2) (2018-12-10)
35 | 
36 | 
37 | 
38 | ## [3.1.1](https://github.com/Bloss/vuepress-theme-yubisaki/compare/v3.1.0...v3.1.1) (2018-11-18)
39 | 
40 | 
41 | 
42 | # [3.1.0](https://github.com/Bloss/vuepress-theme-yubisaki/compare/v3.0.3-alpha.8.0...v3.1.0) (2018-11-10)
43 | 
44 | 
45 | ### Features
46 | 
47 | * flowchart plugin support ([2d16b45](https://github.com/Bloss/vuepress-theme-yubisaki/commit/2d16b45))
48 | 
49 | 
50 | 
51 | 


--------------------------------------------------------------------------------
/styles/transition.styl:
--------------------------------------------------------------------------------
 1 | .bounce-enter-active,
 2 | .bounce-leave-active,
 3 | .fade-enter-active,
 4 | .fade-leave-active
 5 |   absolute(left top)
 6 |   size 100%
 7 | 
 8 | .bounce-enter-active
 9 |   z-index 1
10 |   animation bounce-in .1s
11 | 
12 | .bounce-leave-active
13 |   z-index -1
14 |   animation bounce-out .1s
15 | 
16 | @keyframes bounce-in
17 |   from
18 |     transform scale(1.25)
19 | 
20 |   50%
21 |     transform scale(1.125)
22 | 
23 |   to
24 |     transform scale(1)
25 | 
26 | @keyframes bounce-out
27 |   from
28 |     opacity 1
29 | 
30 |   50%
31 |     opacity .5
32 | 
33 |   to
34 |     opacity 0
35 | 
36 | .fade-enter-active, .fade-leave-active
37 |   transition opacity .1s
38 | 
39 | .fade-enter, .fade-leave-active
40 |   opacity 0
41 | 
42 | .bottom-enter-active, .bottom-leave-active
43 |   transform: translate3d(0, 0, 0)
44 |   transition transform .2s
45 | 
46 | .bottom-enter, .bottom-leave-active
47 |   transform translate3d(0, 100%, 0)
48 | 
49 | .top-enter-active, .top-leave-active
50 |   transform: translate3d(0, 0, 0)
51 |   transition transform .2s
52 | 
53 | .top-enter, .top-leave-active
54 |   transform translate3d(0, -100%, 0)
55 | 
56 | .left-enter-active, .left-leave-active, .right-enter-active, .right-leave-active
57 |   transform: translate3d(0, 0, 0)
58 |   transition transform .2s
59 | 
60 | .left-enter, .left-leave-active
61 |   transform translate3d(-100%, 0, 0)
62 | 
63 | .right-enter, .right-leave-active
64 |   transform translate3d(100%, 0, 0)
65 | 
66 | 
67 | 
68 | 
69 | 
70 | 


--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "name": "vuepress-theme-yubisaki",
 3 |   "version": "3.1.9",
 4 |   "publishConfig": {
 5 |     "registry": "https://registry.npmjs.org/"
 6 |   },
 7 |   "description": "vuepress-theme",
 8 |   "repository": "https://github.com/Bloss/vuepress-theme-yubisaki",
 9 |   "homepage": "https://github.com/Bloss/vuepress-theme-yubisaki/blob/master/README.md",
10 |   "main": "index.js",
11 |   "keywords": [
12 |     "vuepress",
13 |     "theme",
14 |     "vuepress-theme"
15 |   ],
16 |   "author": "子肃 <stickmyc@163.com>",
17 |   "license": "MIT",
18 |   "scripts": {
19 |     "release": "release-it"
20 |   },
21 |   "devDependencies": {
22 |     "conventional-changelog-cli": "^2.0.11",
23 |     "release-it": "^7.6.3"
24 |   },
25 |   "dependencies": {
26 |     "@vuepress/plugin-back-to-top": "^1.0.0-alpha.20",
27 |     "@vuepress/plugin-google-analytics": "^1.0.0-alpha.20",
28 |     "@vuepress/plugin-medium-zoom": "^1.0.0-alpha.20",
29 |     "@vuepress/plugin-pwa": "^1.0.0-alpha.20",
30 |     "@vuepress/plugin-register-components": "^1.0.0-alpha.20",
31 |     "@yubisaki/vuepress-plugin-blog": "0.1.8",
32 |     "@yubisaki/vuepress-plugin-pagination": "0.1.9",
33 |     "@vssue/vuepress-plugin-vssue": "^0.5.2",
34 |     "autosize": "^4.0.2",
35 |     "axios": "^0.18.0",
36 |     "date-fns": "^1.29.0",
37 |     "github-markdown-css": "^2.10.0",
38 |     "html2canvas": "^1.0.0-alpha.12",
39 |     "markdown-it-imsize": "^2.0.1",
40 |     "markdown-it-task-lists": "^2.1.1",
41 |     "node-polyglot": "^2.3.0",
42 |     "raw-loader": "^0.5.1",
43 |     "vuepress": "^1.0.0-alpha.46",
44 |     "vuepress-plugin-flowchart": "^1.4.2"
45 |   }
46 | }
47 | 


--------------------------------------------------------------------------------
/components/Sidebar.vue:
--------------------------------------------------------------------------------
 1 | <template>
 2 |   <div class="sidebar">
 3 |     <NavLinks />
 4 |   </div>
 5 | </template>
 6 | 
 7 | <script>
 8 | import NavLinks from './NavLinks.vue'
 9 | import { isActive } from '../lib/util'
10 | 
11 | export default {
12 |   components: { NavLinks },
13 |   data () {
14 |     return {
15 |       openGroupIndex: 0
16 |     }
17 |   },
18 |   methods: {
19 |     isActive (page) {
20 |       return isActive(this.$route, page.path)
21 |     }
22 |   }
23 | }
24 | </script>
25 | 
26 | <style lang="stylus">
27 | @import '../styles/config.styl'
28 | 
29 | .sidebar
30 |   font-size 15px
31 |   background-color #fff
32 |   position fixed
33 |   z-index 10
34 |   margin 0
35 |   left 0
36 |   bottom 0
37 |   box-sizing border-box
38 |   border-right 1px solid $borderColor
39 |   overflow-y auto
40 | 
41 |   ul
42 |     padding 0
43 |     margin 0
44 |     list-style-type none
45 |     > li
46 |       width 100%
47 |   a
48 |     display inline-block
49 |   .nav-links
50 |     display none
51 |     padding 0.5rem 0 0.75rem 0
52 |     a
53 |       position relative
54 |       font-weight 600
55 |       height 2rem
56 |       line-height 2rem
57 |       border-bottom 0
58 |       &:before
59 |         position absolute
60 |         content ''
61 |         left 2px
62 |         top 0.5rem
63 |         height 1rem
64 |         border-left 4px solid transparent
65 |     .nav-item
66 |       display block
67 |       font-size 1.1em
68 |       .router-link-active:before
69 |         border-left-color $accentColor
70 |   .sidebar-links
71 |     padding 1.5rem 0
72 | 
73 | @media (max-width: $MQMobile)
74 |   .sidebar
75 |     .nav-links
76 |       display block
77 | </style>
78 | 


--------------------------------------------------------------------------------
/layouts/404.vue:
--------------------------------------------------------------------------------
 1 | <template>
 2 |   <NoToolContainer>
 3 |     <div class="not-found-container">
 4 |       <div class="not-found-img"></div>
 5 |       <div class="not-found-action">
 6 |         <h1>404</h1>
 7 |         <blockquote>{{ getMsg() }}</blockquote>
 8 |         <router-link to="/" class="not-found-link">back to home</router-link>
 9 |       </div>
10 |     </div>
11 |   </NoToolContainer>
12 | </template>
13 | 
14 | <script>
15 | const msgs = [
16 |   `The page went on flight 404.`,
17 |   `How did you come here?`,
18 |   `It seems that there is a problem, it is being repaired.`,
19 |   `Hmmm, the page was hit by a two-way foil.`
20 | ]
21 | 
22 | export default {
23 |   methods: {
24 |     getMsg () {
25 |       return msgs[Math.floor(Math.random() * msgs.length)]
26 |     }
27 |   }
28 | }
29 | </script>
30 | 
31 | <style lang="stylus">
32 | @import '../styles/config.styl';
33 | 
34 | .not-found-container
35 |   width $appWidth
36 |   margin 0 auto
37 |   display flex
38 |   flex-direction row
39 |   justify-content center
40 | 
41 | .not-found-link
42 |   color #1890ff
43 |   &:hover
44 |     color #40a9ff
45 | 
46 | .not-found-img
47 |   height 360px
48 |   width 300px
49 |   max-width 300px
50 |   margin-right 90px
51 |   background-image url('../assets/404.svg')
52 |   background-repeat no-repeat
53 |   background-position 50% 50%
54 |   background-size contain
55 | 
56 | .not-found-action
57 |   margin-top 100px
58 | 
59 | @media (max-width: ($MQNarrow + 1px)) {
60 |   .not-found-container {
61 |     width 100%
62 |     padding 0 
63 |     flex-direction column
64 |     align-items center 
65 |   }
66 | 
67 |   .not-found-img {
68 |     margin-right 0
69 |   }
70 | 
71 |   .not-found-action {
72 |     margin-top 20px
73 |   }
74 | }
75 | </style>
76 | 


--------------------------------------------------------------------------------
/components/Pagination.vue:
--------------------------------------------------------------------------------
 1 | <template>
 2 |   <nav class="pagination-nav">
 3 |     <router-link class="pagination-action pagination-prev" 
 4 |       :to="$pagination.prevLink"
 5 |       v-if="$pagination.hasPrev">← </router-link>
 6 |     <div class="pagination-docker">
 7 |       <router-link v-for="({ path }, index) in $pagination.pages"
 8 |         :key="index" 
 9 |         class="pagination-num"
10 |         :to="path"
11 |         :class="hightlightCurrentPage(index + 1)">
12 |         {{ index + 1 }}
13 |       </router-link>  
14 |     </div>
15 |     <router-link class="pagination-action pagination-next" 
16 |       :to="$pagination.nextLink"
17 |       v-if="$pagination.hasNext"> →</router-link>
18 |   </nav>
19 | </template>
20 | 
21 | <script>
22 | export default {
23 |   methods: {
24 |     hightlightCurrentPage(pageNum) {
25 |       return {
26 |         'pagination-current': pageNum === this.$pagination.currentIndex + 1
27 |       }
28 |     }
29 |   }
30 | }
31 | </script>
32 | 
33 | <style lang="stylus">
34 | @import '../styles/config.styl';
35 | 
36 | .pagination-nav
37 |   padding 1rem
38 |   text-align center
39 |   clear both
40 |   line-height 2
41 |   overflow hidden
42 |   a:hover
43 |     color $accentColor
44 | 
45 | .pagination-action
46 |   display block
47 |   color $textColor
48 |   text-align center
49 |   cursor pointer
50 |   width 2rem
51 |   height 2rem
52 |   border-radius 50%
53 |   transition all .2s ease-in-out
54 |   background-color #fff
55 | 
56 | .pagination-num
57 |   cursor pointer
58 |   transition all .2s ease-in-out
59 |   color $textColor
60 |   padding 10px 20px
61 |   line-height 1
62 |   height 2px
63 | 
64 | .pagination-docker
65 |   display inline-block
66 |   a:hover
67 |     font-weight 800
68 |   a:not(.pagination-current):hover
69 |     color $textColor!important
70 | 
71 | .pagination-prev
72 |   float left
73 | 
74 | .pagination-next
75 |   float right
76 | 
77 | .pagination-current
78 |   font-weight 700
79 |   color $accentColor
80 | </style>


--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
 1 | <pre>
 2 | <code style="color: #1890ff">
 3 |                  _       _                 _      _
 4 |  _   _   _   _  | |__   (_)  ___    __ _  | | __ (_)
 5 | | | | | | | | | | '_ \  | | / __|  / _` | | |/ / | |
 6 | | |_| | | |_| | | |_) | | | \__ \ | (_| | |   <  | |
 7 |  \__, |  \__,_| |_.__/  |_| |___/  \__,_| |_|\_\ |_|
 8 |  |___/
 9 | </code>
10 | </pre>
11 | 
12 | <p align="center">
13 |   <!-- <a href="https://wuwaki.me/yubisaki/intro.html">
14 |     <img src="https://blog-1252181333.cos.ap-shanghai.myqcloud.com/blog/yubisaki.png" alt="Logo">
15 |   </a> -->
16 |   <h3 align="center">yubisaki theme</h3>
17 |   <p align="center">A blog theme for vuepress</p>
18 | </p>
19 | 
20 | <p align="center">
21 |   <a href="https://www.npmjs.com/package/vuepress-theme-yubisaki">
22 |     <img src="https://img.shields.io/npm/v/vuepress-theme-yubisaki.svg?style=flat-square" alt="version">
23 |   </a>
24 |   <a href="https://github.com/Yubisaki/vuepress-theme-yubisaki/blob/master/LICENSE">
25 |     <img src="https://img.shields.io/npm/l/vuepress-theme-yubisaki.svg?style=flat-square" alt="MIT license">
26 |   </a>
27 |   <a href="https://npmcharts.com/compare/vuepress-theme-yubisaki">
28 |     <img src="https://img.shields.io/npm/dm/vuepress-theme-yubisaki.svg?style=flat-square" alt="downloads">
29 |   </a>
30 | </p>
31 | 
32 | <p>
33 |   <a href="https://wuwaki.me/yubisaki/intro.html">
34 |     <img src="https://blog-1252181333.cos.ap-shanghai.myqcloud.com/blog/example.png" alt="example" />
35 |   </a>
36 | </p>
37 | 
38 | 
39 | ## Documentation
40 | 
41 | [简体中文](https://wuwaki.me/yubisaki/next.html) | [English](https://wuwaki.me/yubisaki/next-en.html)
42 | 
43 | ## 📦 Installation
44 | 
45 | ```bash
46 | yarn add vuepress-theme-yubisaki@next -S
47 | ```
48 | or with npm
49 | ```bash
50 | npm install vuepress-theme-yubisaki@next --save-dev
51 | ```
52 | 
53 | ## ✨ Features
54 | 
55 | - Post Tags
56 | - Github Card
57 | - Pagiation
58 | - Search by keyword
59 | - Multi scene layout
60 | - Comments
61 | 
62 | ## 🤝 PRs Welcome


--------------------------------------------------------------------------------
/components/NavLinks.vue:
--------------------------------------------------------------------------------
 1 | <template>
 2 |   <nav class="nav-links" v-if="userLinks.length">
 3 |     <ul class="nav-ul">
 4 |       <li class="nav-item" v-for="item in userLinks" :key="item.link">
 5 |         <NavLink :item="item"/>
 6 |       </li>
 7 |     </ul>
 8 |   </nav>
 9 | </template>
10 | 
11 | <script>
12 | import { isActive, resolveNavLinkItem } from '../lib/util'
13 | import NavLink from './NavLink.vue'
14 | 
15 | export default {
16 |   components: { NavLink },
17 |   computed: {
18 |     nav () {
19 |       return this.$site.themeConfig.nav || []
20 |     },
21 |     userLinks () {
22 |       return (this.nav || []).map((link => {
23 |         return Object.assign(resolveNavLinkItem(link), {
24 |           items: (link.items || []).map(resolveNavLinkItem)
25 |         })
26 |       }))
27 |     },
28 |   },
29 |   methods: {
30 |     isActive
31 |   }
32 | }
33 | </script>
34 | 
35 | <style lang="stylus">
36 | @import '../styles/config.styl'
37 | 
38 | .nav-ul
39 |   line-height inherit
40 |   height 100%
41 |   padding 0
42 |   margin 0
43 |   list-style none
44 |   & > li
45 |     color #66757f
46 |     padding 0
47 |     margin 0
48 |     float left
49 |     height inherit
50 |     line-height inherit
51 | 
52 | .nav-links
53 |   display inline-block
54 |   vertical-align top
55 |   height $navbarHeight
56 |   line-height $navbarHeight
57 |   a
58 |     display block
59 |     color inherit
60 |     padding 0 0.75rem
61 |     transition all .15s ease-in-out
62 |     border-bottom 2px solid transparent
63 |     height "calc(%s - 2px)" % $navbarHeight
64 |     &:hover, &.router-link-active
65 |       border-bottom-color lighten($accentColor, 5%)
66 |       color $accentColor
67 |   .nav-item
68 |     cursor pointer
69 |     position relative
70 |     font-weight 500
71 | 
72 | @media (max-width: $MQMobile)
73 |   .nav-links
74 |     .nav-item 
75 |       margin-left 0
76 | 
77 | @media (min-width: $MQMobile)
78 |   .nav-links
79 |     a
80 |       &:hover, &.router-link-active
81 |         color $accentColor
82 | </style>
83 | 


--------------------------------------------------------------------------------
/components/Navbar.vue:
--------------------------------------------------------------------------------
 1 | <template>
 2 |   <header class="navbar">
 3 |     <div class="nav-header">
 4 |       <SidebarButton @toggle-sidebar="$emit('toggle-sidebar')"/>
 5 |       <router-link :to="$localePath" class="home-link">
 6 |         <img class="logo"
 7 |           v-if="$site.themeConfig.logo"
 8 |           :src="$withBase($site.themeConfig.logo)">
 9 |         <span class="site-name"
10 |           v-if="$site.title"
11 |           :class="{ 'can-hide': $site.themeConfig.logo }">
12 |           {{ $site.title }}
13 |         </span>
14 |       </router-link>
15 |       <NavLinks class="can-hide"/>
16 |       <div class="links">
17 |         <SearchBox v-if="$site.themeConfig.search !== false"/>
18 |       </div>
19 |     </div>
20 |   </header>
21 | </template>
22 | 
23 | <style lang="stylus">
24 | @import '../styles/config.styl';
25 | 
26 | .nav-header {
27 |   position relative
28 |   padding 0 1rem
29 |   margin 0 auto
30 |   width $appWidth
31 |   height $navbarHeight
32 |   line-height $navbarHeight
33 | }
34 | 
35 | .home-link
36 |   height $navbarHeight
37 |   line-height $navbarHeight
38 |   margin-right 0.75rem
39 | 
40 | .navbar {
41 |   position fixed
42 |   z-index 20
43 |   top 0
44 |   left 0
45 |   right 0
46 |   height $navbarHeight
47 |   background-color #fff
48 |   box-sizing border-box
49 |   border-bottom 1px solid rgba(0,0,0,0.25)
50 | 
51 |   a, span, img {
52 |     display: inline-block;
53 |   }
54 | 
55 |   .logo {
56 |     height: $navbarHeight - 1.4rem;
57 |     min-width: $navbarHeight - 1.4rem;
58 |     margin-top: 0.7rem;
59 |     margin-right: 0.8rem;
60 |     vertical-align: top;
61 |   }
62 | 
63 |   .site-name {
64 |     font-size: 1.3rem;
65 |     font-weight: 600;
66 |     color: $textColor;
67 |     position: relative;
68 |   }
69 | 
70 |   .links {
71 |     font-size: 0.9rem;
72 |     position: absolute;
73 |     right: 2.5rem;
74 |     top: 0;
75 |   }
76 | }
77 | 
78 | @media (max-width ($MQNarrow + 1px))
79 |   .nav-header {
80 |     position static
81 |     width 100%
82 |     padding 0
83 |   }
84 | 
85 | @media (max-width: $MQMobile) {
86 |   .navbar {
87 |     padding-left: 4rem;
88 |     
89 |     .can-hide {
90 |       display: none;
91 |     }
92 |   }
93 | }
94 | </style>
95 | 


--------------------------------------------------------------------------------
/components/NoToolContainer.vue:
--------------------------------------------------------------------------------
 1 | <template>
 2 |   <div :class="containerClass" class="theme">
 3 |     <!-- emit event for toggle sidebar in mobile mode -->
 4 |     <Navbar @toggle-sidebar="toggleSidebar" />
 5 |     <div class="sidebar-mask" @click="toggleSidebar(false)"></div>
 6 |     <Sidebar v-if="isSidebarOpen" @toggle-sidebar="toggleSidebar"/>
 7 |     <div class="layout-container">
 8 |       <div class="main">
 9 |         <slot />
10 |       </div>
11 |     </div>
12 |     <Footer />
13 |   </div>
14 | </template>
15 | 
16 | <script>
17 | import Vue from 'vue';
18 | import Footer from '@theme/components/Footer';
19 | import nprogress from "nprogress";
20 | 
21 | export default {
22 |   components: { Footer },
23 |   mounted() {
24 |     nprogress.configure({ showSpinner: false });
25 |     this.$router.beforeEach((to, from, next) => {
26 |       if (to.path !== from.path && !Vue.component(to.name)) {
27 |         nprogress.start();
28 |       }
29 |       next();
30 |     });
31 |     this.$router.afterEach(() => {
32 |       nprogress.done();
33 |       this.isSidebarOpen = false;
34 |     });
35 |   },
36 |   data () {
37 |     return {
38 |       isSidebarOpen: false
39 |     }
40 |   },
41 |   methods: {
42 |     toggleSidebar (to) {
43 |       this.isSidebarOpen = typeof to === "boolean" ? to : !this.isSidebarOpen;
44 |     }
45 |   },
46 |   computed: {
47 |     containerClass () {
48 |       return [{
49 |         "sidebar-open": this.isSidebarOpen
50 |       }]
51 |     }
52 |   }
53 | }
54 | </script>
55 | 
56 | <style src="prismjs/themes/prism-tomorrow.css"></style>
57 | <style src="../styles/theme.styl" lang="stylus"></style>
58 | <style src="../styles/mobile.styl" lang="stylus"></style>
59 | <style lang="stylus">
60 | @import '../styles/config.styl';
61 | 
62 | .theme
63 |   &.sidebar-open
64 |     .sidebar-mask
65 |       display: block
66 | 
67 | .sidebar-mask
68 |   position fixed
69 |   z-index 9
70 |   top 0
71 |   left 0
72 |   width 100vw
73 |   height 100vh
74 |   display none
75 | 
76 | .main
77 |   width $appWidth
78 |   padding 1rem
79 |   margin 0 auto
80 | 
81 | .layout-container
82 |   margin-top $navbarHeight
83 |   margin-bottom $footerHeight
84 | 
85 | @media (max-width: ($MQNarrow + 1px)) {
86 |   .main {
87 |     width 100%
88 |     padding 0 
89 |   }
90 | }
91 | </style>
92 | 
93 | 


--------------------------------------------------------------------------------
/components/SWUpdatePopup.vue:
--------------------------------------------------------------------------------
 1 | <template>
 2 |   <transition name="sw-update-popup">
 3 |     <div
 4 |       v-if="enabled"
 5 |       class="sw-update-popup"
 6 |     >
 7 |       {{message}}<br>
 8 |       <button @click="reload">{{buttonText}}</button>
 9 |     </div>
10 |   </transition>
11 | </template>
12 | 
13 | <script>
14 | export default {
15 |   props: {
16 |     updateEvent: {
17 |       type: Object,
18 |       default: null
19 |     }
20 |   },
21 |   computed: {
22 |     popupConfig () {
23 |       for (const config of [this.$themeLocaleConfig, this.$site.themeConfig]) {
24 |         const sw = config.serviceWorker
25 |         if (sw && sw.updatePopup) {
26 |           return typeof sw.updatePopup === 'object' ? sw.updatePopup : {}
27 |         }
28 |       }
29 |       return null
30 |     },
31 |     enabled () {
32 |       return Boolean(this.popupConfig && this.updateEvent)
33 |     },
34 |     message () {
35 |       const c = this.popupConfig
36 |       return (c && c.message) || 'Get new content';
37 |     },
38 |     buttonText () {
39 |       const c = this.popupConfig
40 |       return (c && c.buttonText) || 'Refresh'
41 |     }
42 |   },
43 |   methods: {
44 |     reload () {
45 |       if (this.updateEvent) {
46 |         this.updateEvent.skipWaiting().then(() => {
47 |           console.log('PWA 正在开启新的 serviceWorker');
48 |           location.reload(true)
49 |         })
50 |         this.updateEvent = null
51 |       }
52 |     }
53 |   }
54 | }
55 | </script>
56 | 
57 | <style lang="stylus">
58 | @import '../styles/config.styl'
59 | .sw-update-popup
60 |   position fixed
61 |   right 1em
62 |   bottom 1em
63 |   padding 1em
64 |   border 1px solid $accentColor
65 |   border-radius 3px
66 |   background #fff
67 |   box-shadow 0 4px 16px rgba(0, 0, 0, 0.5)
68 |   text-align center
69 |   button
70 |     cursor pointer
71 |     border 1px solid $accentColor
72 |     border-radius 2px
73 |     margin-top 0.5em
74 |     padding 0.25em 2em
75 |     transition .3s
76 |     &:focus
77 |       outline 0
78 |     &:active, &:hover
79 |       outline 0
80 |       background-color $accentColor
81 |       color #fff
82 | .sw-update-popup-enter-active, .sw-update-popup-leave-active
83 |   transition opacity 0.3s, transform 0.3s
84 | .sw-update-popup-enter, .sw-update-popup-leave-to
85 |   opacity 0
86 |   transform translate(0, 50%) scale(0.5)
87 | </style>


--------------------------------------------------------------------------------
/styles/code.styl:
--------------------------------------------------------------------------------
 1 | @require './config'
 2 | 
 3 | .content, .content__default
 4 |   :not(pre)>code
 5 |     color lighten($textColor, 20%)
 6 |     padding 0.25rem 0.5rem
 7 |     margin 0
 8 |     font-size 0.85em
 9 |     background: rgba(255,229,100,.2);
10 |     border-radius 3px
11 |   code
12 |     color lighten($textColor, 20%)
13 |     padding 0.25rem 0.5rem
14 |     margin 0
15 |     font-size 0.85em
16 |     background-color rgba(27,31,35,0.05)
17 |     border-radius 3px
18 | 
19 | .content, .content__default
20 |   pre, pre[class*="language-"]
21 |     background-color $codeBgColor
22 |     line-height 1.4
23 |     border-radius 6px
24 |     padding 1.25rem 1.5rem
25 |     margin 0.85rem 0
26 |     white-space pre-wrap
27 |     word-break break-word
28 |     overflow auto
29 |     position relative
30 |     code
31 |       color #fff
32 |       padding 0
33 |       background-color none
34 |       border-radius 0
35 |     &:before
36 |       position absolute
37 |       top 0.8em
38 |       right 1em
39 |       font-size 0.75rem
40 |       color rgba(255, 255, 255, 0.4)
41 |   .highlighted-line
42 |     background-color rgba(0, 0, 0, 66%)
43 |     display block
44 |     margin 0.1rem -1.5rem 0
45 |     padding 0.1rem 1.8rem
46 | 
47 | pre[class="language-js"], pre[class="language-javascript"]
48 |   &:before
49 |     content "js"
50 | 
51 | pre[class="language-html"], pre[class="language-markup"]
52 |   &:before
53 |     content "html"
54 | 
55 | pre[class="language-markdown"], pre[class="language-md"]
56 |   &:before
57 |     content "md"
58 | 
59 | pre[class="language-vue"]:before
60 |   content "vue"
61 | 
62 | pre[class="language-css"]:before
63 |   content "css"
64 | 
65 | pre[class="language-sass"]:before
66 |   content "sass"
67 | 
68 | pre[class="language-less"]:before
69 |   content "less"
70 | 
71 | pre[class="language-scss"]:before
72 |   content "scss"
73 | 
74 | pre[class="language-stylus"]:before
75 |   content "stylus"
76 | 
77 | pre[class="language-json"]:before
78 |   content "json"
79 | 
80 | pre[class="language-ruby"]:before
81 |   content "rb"
82 | 
83 | pre[class="language-python"]:before
84 |   content "py"
85 | 
86 | pre[class="language-go"]:before
87 |   content "go"
88 | 
89 | pre[class="language-java"]:before
90 |   content "java"
91 | 
92 | pre[class="language-c"]:before
93 |   content "c"
94 | 
95 | pre[class="language-bash"]:before
96 |   content "sh"
97 | 


--------------------------------------------------------------------------------
/components/LayoutContainer.vue:
--------------------------------------------------------------------------------
  1 | <template>
  2 |   <div :class="containerClass" class="theme">
  3 |     <!-- emit event for toggle sidebar in mobile mode -->
  4 |     <Navbar @toggle-sidebar="toggleSidebar" />
  5 |     <div class="sidebar-mask" @click="toggleSidebar(false)"></div>
  6 |     <Sidebar v-if="isSidebarOpen" @toggle-sidebar="toggleSidebar"/>
  7 |     <div class="layout-container">
  8 |       <div class="main">
  9 |         <div class="layout-inner">
 10 |           <slot />
 11 |         </div>
 12 |         <ToolGroup />
 13 |       </div>
 14 |     </div>
 15 |     <Footer />
 16 |   </div>
 17 | </template>
 18 | 
 19 | <script>
 20 | import Vue from 'vue';
 21 | import Footer from '@theme/components/Footer';
 22 | import nprogress from "nprogress";
 23 | 
 24 | export default {
 25 |   components: { Footer },
 26 |   mounted() {
 27 |     nprogress.configure({ showSpinner: false });
 28 |     this.$router.beforeEach((to, from, next) => {
 29 |       if (to.path !== from.path && !Vue.component(to.name)) {
 30 |         nprogress.start();
 31 |       }
 32 |       next();
 33 |     });
 34 |     this.$router.afterEach(() => {
 35 |       nprogress.done();
 36 |       this.isSidebarOpen = false;
 37 |     });
 38 |   },
 39 |   data () {
 40 |     return {
 41 |       isSidebarOpen: false
 42 |     }
 43 |   },
 44 |   methods: {
 45 |     toggleSidebar (to) {
 46 |       this.isSidebarOpen = typeof to === "boolean" ? to : !this.isSidebarOpen;
 47 |     }
 48 |   },
 49 |   computed: {
 50 |     containerClass () {
 51 |       return [{
 52 |         "sidebar-open": this.isSidebarOpen
 53 |       }]
 54 |     }
 55 |   }
 56 | }
 57 | </script>
 58 | 
 59 | <style src="prismjs/themes/prism-tomorrow.css"></style>
 60 | <style src="../styles/theme.styl" lang="stylus"></style>
 61 | <style src="../styles/mobile.styl" lang="stylus"></style>
 62 | <style lang="stylus">
 63 | @import '../styles/config.styl';
 64 | 
 65 | .theme
 66 |   &.sidebar-open
 67 |     .sidebar-mask
 68 |       display: block
 69 | 
 70 | .sidebar-mask
 71 |   position fixed
 72 |   z-index 9
 73 |   top 0
 74 |   left 0
 75 |   width 100vw
 76 |   height 100vh
 77 |   display none
 78 | 
 79 | .main
 80 |   width $appWidth
 81 |   padding 1rem
 82 |   margin 0 auto
 83 | 
 84 | .layout-container
 85 |   margin-top $navbarHeight
 86 |   margin-bottom $footerHeight
 87 | 
 88 | .layout-inner
 89 |   width 43rem
 90 | 
 91 | @media (max-width: ($MQNarrow + 1px)) {
 92 |   .main {
 93 |     width 100%
 94 |     padding 0.5rem 0
 95 |   }
 96 | 
 97 |   .layout-inner {
 98 |     width 100%
 99 |   }
100 | }
101 | </style>
102 | 
103 | 


--------------------------------------------------------------------------------
/components/PostCard.vue:
--------------------------------------------------------------------------------
  1 | <template>
  2 |   <div class="card article-card">
  3 |     <!-- Article title -->
  4 |     <h2>
  5 |       <router-link class="art-header-link"
  6 |         :to="post.path">{{ title }}</router-link>
  7 |     </h2>
  8 |     <!-- Article overview -->
  9 |     <div v-html="post.excerpt"></div>
 10 |     <!-- Tag area -->
 11 |     <div v-if="post.tags">
 12 |       <div class="divider article-card-line"></div>
 13 |       <tag v-for="tag in post.tags" 
 14 |         :key="tag"
 15 |         :slug="tag">
 16 |         {{tag}}
 17 |       </tag>
 18 |     </div>
 19 |   </div>
 20 | </template>
 21 | 
 22 | <script>
 23 | import Tag from './Tag';
 24 | 
 25 | export default {
 26 |   name: 'post-card',
 27 |   props: {
 28 |     post: {
 29 |       type: Object,
 30 |       required: true
 31 |     }
 32 |   },
 33 |   components: { Tag },
 34 |   computed: {
 35 |     title() {
 36 |       return this.post.frontmatter.title || this.post.title;
 37 |     }
 38 |   }
 39 | };
 40 | </script>
 41 | 
 42 | <style src="../styles/card.styl" lang="stylus"></style>
 43 | <style lang="stylus">
 44 | @import '../styles/config';
 45 | 
 46 | .article-card-line {
 47 |   margin-bottom: 16px;
 48 | }
 49 | 
 50 | .divider
 51 |   width 100%
 52 |   height 1px
 53 |   transform scaleY(0.5)
 54 |   transform-origin 50% 100%
 55 |   background #DCDCDC
 56 | 
 57 | .article-card {
 58 |   position: relative;
 59 |   padding: 16px 20px;
 60 | 
 61 |   h2 {
 62 |     border: 0;
 63 |     padding: 0;
 64 |   }
 65 | 
 66 |   .art-header-link {
 67 |     position: relative;
 68 |     color: $postColor;
 69 |     text-transform: capitalize;
 70 |     font-size: 24px;
 71 |     line-height: 36px;
 72 |     display: inline-block;
 73 | 
 74 |     &:after {
 75 |       content: '';
 76 |       position: absolute;
 77 |       width: 100%;
 78 |       height: 2px;
 79 |       bottom: 0;
 80 |       left: 0;
 81 |       background-color: #ac3e40;
 82 |       visibility: hidden;
 83 |       transform: scaleX(0);
 84 |       transition: 0.3s ease-in-out;
 85 |     }
 86 | 
 87 |     &:hover {
 88 |       &:after {
 89 |         visibility: visible;
 90 |         transform: scaleX(1);
 91 |       }
 92 |     }
 93 |   }
 94 | 
 95 |   img { // article card img css hack
 96 |     display: block;
 97 |     max-width: 100%;
 98 |   }
 99 | 
100 |   a[class*='header-anchor'] { // article card '#' css hack
101 |     display: none;
102 |   }
103 | 
104 |   pre[class*='language-'] { // article card language class css hack
105 |     position: relative;
106 | 
107 |     &:before {
108 |       position: absolute;
109 |       top: 0.8em;
110 |       right: 1em;
111 |       font-size: 0.75rem;
112 |       color: rgba(255, 255, 255, 0.4);
113 |     }
114 |   }
115 | }
116 | </style>


--------------------------------------------------------------------------------
/styles/theme.styl:
--------------------------------------------------------------------------------
  1 | @require './config'
  2 | @require './nprogress'
  3 | @require './code'
  4 | @require './custom-blocks'
  5 | @require './arrow'
  6 | 
  7 | html, body
  8 |   padding 0
  9 |   margin 0
 10 |   overflow-x hidden
 11 | 
 12 | body
 13 |   font-family -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif
 14 |   -webkit-font-smoothing antialiased
 15 |   -moz-osx-font-smoothing grayscale
 16 |   font-size 16px
 17 |   color $textColor
 18 |   background #e6ecf0
 19 | 
 20 | .content:not(.custom), .content__default:not(.custom)
 21 |   max-width $contentWidth
 22 |   margin 0 auto
 23 |   padding 2rem 2.5rem
 24 |   > *:first-child
 25 |     margin-top $navbarHeight - 2rem
 26 |   a:hover
 27 |     text-decoration underline
 28 |   p.demo
 29 |     padding 1rem 1.5rem
 30 |     border 1px solid #ddd
 31 |     border-radius 4px
 32 |   img
 33 |     max-width 100%
 34 | 
 35 | .content-header
 36 |   max-width $contentWidth
 37 |   margin 0 auto
 38 |   padding 0 2rem
 39 | 
 40 | .content.custom, .content__default.custom
 41 |   padding 0
 42 |   margin 0
 43 | 
 44 | a
 45 |   font-weight 500
 46 |   color $accentColor
 47 |   text-decoration none
 48 | 
 49 | p a code
 50 |   font-weight 400
 51 |   color $accentColor
 52 | 
 53 | kbd
 54 |   background #eee
 55 |   border solid 0.15rem #ddd
 56 |   border-bottom solid 0.25rem #ddd
 57 |   border-radius 0.15rem
 58 |   padding 0 0.15em
 59 | 
 60 | blockquote
 61 |   font-size 1rem
 62 |   color #999
 63 |   border-left .25rem solid #dfe2e5
 64 |   margin-left 0
 65 |   padding-left 1rem
 66 | 
 67 | ul, ol
 68 |   padding-left 1.2em
 69 | 
 70 | strong
 71 |   font-weight 600
 72 | 
 73 | h1, h2, h3, h4, h5, h6
 74 |   font-weight 600
 75 |   line-height 1.25
 76 |   .content:not(.custom) > &, .content__default:not(.custom) > &
 77 |     margin-top (0.5rem - $navbarHeight)
 78 |     padding-top ($navbarHeight + 1rem)
 79 |     margin-bottom 0
 80 |     &:first-child
 81 |       margin-top -3.5rem
 82 |       margin-bottom 1rem
 83 |       + p, + pre, + .custom-block
 84 |         margin-top 2rem
 85 |   &:hover .header-anchor
 86 |     opacity: 1
 87 | 
 88 | h1
 89 |   font-size 2rem
 90 | 
 91 | h2
 92 |   font-size 1.5rem
 93 |   padding-bottom .3rem
 94 |   border-bottom 1px solid $borderColor
 95 | 
 96 | h3
 97 |   font-size 1.2rem
 98 | 
 99 | a.header-anchor
100 |   font-size 0.85em
101 |   float left
102 |   margin-left -0.87em
103 |   padding-right 0.23em
104 |   margin-top 0.125em
105 |   opacity 0
106 |   &:hover
107 |     text-decoration none
108 | 
109 | code, kbd
110 |   font-family source-code-pro, Menlo, Monaco, Consolas, "Courier New", monospace
111 | 
112 | p, ul, ol
113 |   line-height 1.7
114 | 
115 | hr
116 |   border 0
117 |   border-top 1px solid $borderColor
118 | 
119 | table
120 |   border-collapse collapse
121 |   margin 1rem 0
122 | 
123 | tr
124 |   border-top 1px solid #dfe2e5
125 |   &:nth-child(2n)
126 |     background-color #f6f8fa
127 | 
128 | th, td
129 |   border 1px solid #dfe2e5
130 |   padding .6em 1em
131 | 
132 | @require './mobile.styl'
133 | 


--------------------------------------------------------------------------------
/layouts/Page.vue:
--------------------------------------------------------------------------------
  1 | <template>
  2 |   <LayoutContainer>
  3 |     <div class="card">
  4 |       <div class="content-header">
  5 |         <h1 v-if="title" class="page-title">{{ title }}</h1>
  6 |         <span class="page-timestamp">{{ createTime }}</span>
  7 |       </div>
  8 |       <Content :custom="false"/>
  9 |       <div class="content page-nav" v-if="prev || next">
 10 |         <p class="inner">
 11 |           <span v-if="prev" class="prev">←
 12 |             <router-link v-if="prev" class="prev" :to="prev.path">{{ prev.title || prev.path }}</router-link>
 13 |           </span>
 14 |           <span v-if="next" class="next">
 15 |             <router-link v-if="next" :to="next.path">{{ next.title || next.path }}</router-link>→
 16 |           </span>
 17 |         </p>
 18 |       </div>
 19 |     </div>
 20 |     <div id="comment-container" v-if="isComment">
 21 |       <Vssue :title="title" :options="$site.themeConfig.comment" />
 22 |     </div>
 23 |   </LayoutContainer>
 24 | </template>
 25 | 
 26 | <script>
 27 | import {
 28 |   resolvePage,
 29 |   normalize,
 30 |   endingSlashRE,
 31 |   pageNormalize
 32 | } from "../lib/util";
 33 | 
 34 | export default {
 35 |   props: ["sidebarItems"],
 36 |   computed: {
 37 |     prev() {
 38 |       const prev = this.$page.frontmatter.prev;
 39 |       if (prev === false) {
 40 |         return;
 41 |       } else if (prev) {
 42 |         return resolvePage(this.$pagination.all, prev, this.$route.name);
 43 |       } else {
 44 |         return resolvePrev(this.$route.name, this.$pagination.all);
 45 |       }
 46 |     },
 47 |     next() {
 48 |       const next = this.$page.frontmatter.next;
 49 |       if (next === false) {
 50 |         return;
 51 |       } else if (next) {
 52 |         return resolvePage(this.$pagination.all, next, this.$route.name);
 53 |       } else {
 54 |         return resolveNext(this.$route.name, this.$pagination.all);
 55 |       }
 56 |     },
 57 |     title() {
 58 |       return this.$page.frontmatter.title;
 59 |     },
 60 |     isComment() {
 61 |       return this.$site.themeConfig.comment && this.$page.type === "post";
 62 |     },
 63 |     createTime() {
 64 |       const stamp = this.$page.frontmatter.date;
 65 |       const format = this.$site.themeConfig["date_format"];
 66 |       if (!stamp || !format) return "";
 67 |       const date = new Date(stamp);
 68 |       return date.Format(format);
 69 |     },
 70 |     overrideStyle() {
 71 |       const accentColor = this.$site.themeConfig["accentColor"];
 72 |       return accentColor ? { color: accentColor } : {};
 73 |     }
 74 |   }
 75 | };
 76 | 
 77 | function resolvePrev(name, pages) {
 78 |   return find(name, pages, -1);
 79 | }
 80 | 
 81 | function resolveNext(name, pages) {
 82 |   return find(name, pages, 1);
 83 | }
 84 | 
 85 | function find(name, pages, offset) {
 86 |   for (let i = 0; i < pages.length; i++) {
 87 |     if (pages[i].key === name) {
 88 |       if (offset < 0 && i === 0) return false;
 89 |       if (offset > 0 && i === pages.length - 1) return false;
 90 |       const page = pages[i + offset];
 91 |       return page.path === "/" ? false : page;
 92 |     }
 93 |   }
 94 | }
 95 | </script>
 96 | 
 97 | <style lang="stylus" src="../styles/theme.styl"></style>
 98 | <style lang="stylus" src="../styles/card.styl"></style>
 99 | <style lang="stylus">
100 | @import '../styles/config.styl';
101 | @import '../styles/vssue.styl';
102 | 
103 | #comment-container {
104 |   color: #6190E8;
105 | }
106 | 
107 | .page {
108 |   padding-bottom: 2rem;
109 | }
110 | 
111 | .page-title {
112 |   margin-bottom: -2rem;
113 |   color: $postColor;
114 | }
115 | 
116 | .page-timestamp {
117 |   display: block;
118 |   font-size: 14px;
119 |   margin-top: 2.5rem;
120 | }
121 | 
122 | .edit-link.content {
123 |   padding-top: 0 !important;
124 | 
125 |   a {
126 |     color: lighten($textColor, 25%);
127 |     margin-right: 0.25rem;
128 |   }
129 | }
130 | 
131 | .page-nav.content {
132 |   padding-top: 1rem !important;
133 |   padding-bottom: 0 !important;
134 | 
135 |   .inner {
136 |     min-height: 2rem;
137 |     margin-top: 0 !important;
138 |     border-top: 1px solid $borderColor;
139 |     padding-top: 1rem;
140 |   }
141 | 
142 |   .next {
143 |     float: right;
144 |   }
145 | }
146 | </style>
147 | 


--------------------------------------------------------------------------------
/components/GithubCard.vue:
--------------------------------------------------------------------------------
  1 | <template>
  2 |   <transition name="right">
  3 |     <div class="card github-card" v-if="show">
  4 |       <div class="github-header"></div>
  5 |       <a :href="userUrl" class="user-link">
  6 |           <img :src="avatar" class="github-avatar">
  7 |       </a>
  8 |       <h1>{{ name }}</h1>
  9 |       <ul class="github-info">
 10 |           <li><a :href="repoUrl" target="_blank"><strong>{{ repoNum }}</strong>repos</a></li>
 11 |           <li><a :href="gistsUrl" target="_blank"><strong>{{ gistsNum }}</strong>gists</a></li>
 12 |           <li><a :href="followersUrl" target="_blank"><strong>{{ followersNum }}</strong>followers</a></li>
 13 |       </ul>
 14 |     </div>
 15 |   </transition>
 16 | </template>
 17 | 
 18 | <script>
 19 | const urlMap = {
 20 |   repoTab: '?tab=repositories',
 21 |   followersTab: '?tab=followers'
 22 | }
 23 | 
 24 | export default {
 25 |   name: "github-card",
 26 |   data() {
 27 |     return {
 28 |       show: false,
 29 |       name: "",
 30 |       userUrl: null,
 31 |       avatar: null,
 32 |       repoNum: null,
 33 |       repoUrl: null,
 34 |       followersNum: null,
 35 |       followersUrl: null,
 36 |       gistsNum: null,
 37 |       gistsUrl: null
 38 |     };
 39 |   },
 40 |   mounted() {
 41 |     if (!this.user) return;
 42 |     this.githubUserInfo(this.user).then(this.githubInfoHandle);
 43 |   },
 44 |   computed: {
 45 |     user() {
 46 |       const { themeConfig } = this.$site;
 47 |       return themeConfig.github
 48 |     }
 49 |   },
 50 |   methods: {
 51 |     githubUserInfo(user) {
 52 |       return fetch(`https://api.github.com/users/${user}`)
 53 |         .then(data => {
 54 |           this.show = true
 55 |           return data.text()
 56 |         })
 57 |         .then(text => JSON.parse(text));
 58 |     },
 59 |     githubInfoHandle(userInfo) {
 60 |       const {
 61 |         avatar_url,
 62 |         name,
 63 |         html_url,
 64 |         followers,
 65 |         public_gists,
 66 |         public_repos
 67 |       } = userInfo;
 68 |       this.avatar = avatar_url;
 69 |       this.name = name;
 70 |       this.userUrl = html_url;
 71 |       this.repoNum = public_repos;
 72 |       this.repoUrl = `${html_url}${urlMap.repoTab}`;
 73 |       this.followersNum = followers;
 74 |       this.followersUrl = `${html_url}${urlMap.followersTab}`;
 75 |       this.gistsNum = public_gists;
 76 |       this.gistsUrl = `https://gist.github.com/${this.user}`;
 77 |     }
 78 |   }
 79 | };
 80 | </script>
 81 | 
 82 | <style src="../styles/transition.styl" lang="stylus"></style>
 83 | <style src="../styles/card.styl" lang="stylus"></style>
 84 | <style lang="stylus">
 85 | @import '../styles/config.styl';
 86 | 
 87 | .github-card {
 88 |   text-align: center;
 89 |   max-width: $toolWidth;
 90 | 
 91 |   h1 {
 92 |     font-size: 24px;
 93 |     font-weight: 500;
 94 |     text-decoration: none;
 95 |   }
 96 | }
 97 | 
 98 | .github-header {
 99 |   height: 148px;
100 |   position: relative;
101 |   padding: 0;
102 |   margin: 0;
103 |   background: linear-gradient(to right, #EAECC6, #2BC0E4);
104 | }
105 | 
106 | .link {
107 |   color: #707070;
108 |   text-decoration: none;
109 | }
110 | 
111 | .user-link {
112 |   display: inline-block;
113 |   overflow: hidden;
114 |   // https://gist.github.com/ayamflow/b602ab436ac9f05660d9c15190f4fd7b
115 |   -webkit-mask-image: -webkit-radial-gradient(white, black); 
116 |   background: #fff;
117 |   border-radius: 100%;
118 |   box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
119 |   text-decoration: none;
120 |   margin-top: -43px;
121 |   border: 3px solid #fff;
122 |   position: relative;
123 | }
124 | 
125 | .github-avatar {
126 |   display: block;
127 |   width: 5rem;
128 |   height: 5rem;
129 |   transition: 0.2s ease-in-out;
130 | 
131 |   &:hover {
132 |     transform: rotate(45deg);
133 |   }
134 | }
135 | 
136 | .github-info {
137 |   font-size: 12px;
138 |   color: #707070;
139 |   list-style-type: none;
140 |   margin: 0;
141 |   padding: 0;
142 |   border-top: 1px solid #eee;
143 |   zoom: 1;
144 | 
145 |   a {
146 |     color: #707070;
147 |   }
148 | 
149 |   strong {
150 |     display: block;
151 |     color: #292f33;
152 |     font-size: 16px;
153 |     line-height: 1.6;
154 |   }
155 | 
156 |   li {
157 |     width: 33.33%;
158 |     float: left;
159 |     font-size: 12px;
160 |     padding: 8px 0;
161 |     box-shadow: 1px 0 0 #eee;
162 |   }
163 | }
164 | </style>


--------------------------------------------------------------------------------
/animation/particleBoom.vue:
--------------------------------------------------------------------------------
  1 | <template>
  2 |   <div 
  3 |     @click="click" 
  4 |     ref="particleContainer" 
  5 |     id="particleContainer">
  6 |     <slot></slot>
  7 |   </div>
  8 | </template>
  9 | 
 10 | <script>
 11 | import html2canvas from 'html2canvas';
 12 | import { ExplodingParticle } from '../lib/animation';
 13 | 
 14 | export default {
 15 |   data() {
 16 |     return {
 17 |       particleCanvas: null,
 18 |       particleCtx: null,
 19 |       reductionFactor: 17,
 20 |       ctx: null,
 21 |       particles: [],
 22 |       slots: this.$slots
 23 |     };
 24 |   },
 25 |   mounted() {
 26 |     window.onresize = this.resize;
 27 |     this.$nextTick(() => {
 28 |       this.play();
 29 |       window.requestAnimationFrame(this.update);
 30 |     });
 31 |   },
 32 |   computed: {
 33 |     btn() {
 34 |       return this.$refs.particleContainer;
 35 |     }
 36 |   },
 37 |   methods: {
 38 |     play() {
 39 |       html2canvas(this.btn, { logging: false }).then(canvas => {
 40 |         this.ctx = canvas.getContext('2d');
 41 |         // 创建 canvas
 42 |         this.createParticleCanvas();
 43 |       });
 44 |     },
 45 |     click() {
 46 |       const width = this.btn.offsetWidth;
 47 |       const height = this.btn.offsetHeight;
 48 | 
 49 |       // 获取色值
 50 |       let colorData = this.ctx.getImageData(0, 0, width, height).data;
 51 | 
 52 |       let count = 0;
 53 | 
 54 |       // 遍历按钮的位置, 创建粒子
 55 |       for (let localX = 0; localX < width; localX++) {
 56 |         for (let localY = 0; localY < height; localY++) {
 57 |           if (count % this.reductionFactor === 0) {
 58 |             let index = (localY * width + localX) * 4;
 59 |             let rgbaColorArr = colorData.slice(index, index + 4);
 60 | 
 61 |             let bcr = this.btn.getBoundingClientRect();
 62 |             let globalX = bcr.left + localX + window.scrollX;
 63 |             let globalY = bcr.top + localY + window.scrollY;
 64 |             // 创建一个粒子
 65 |             this.createParticleAtPoint(globalX, globalY, rgbaColorArr);
 66 |           }
 67 |           count++;
 68 |         }
 69 |       }
 70 |     },
 71 |     createParticleAtPoint(x, y, colorData) {
 72 |       let particle = new ExplodingParticle();
 73 |       particle.rgbArray = colorData;
 74 |       particle.startX = x;
 75 |       particle.startY = y;
 76 |       particle.startTime = Date.now();
 77 | 
 78 |       this.particles.push(particle);
 79 |     },
 80 |     createParticleCanvas() {
 81 |       this.particleCanvas = document.createElement('canvas');
 82 |       this.particleCtx = this.particleCanvas.getContext('2d');
 83 | 
 84 |       // Size our canvas
 85 |       this.particleCanvas.width = window.innerWidth;
 86 |       this.particleCanvas.height = window.innerHeight;
 87 | 
 88 |       // Position out canvas
 89 |       this.particleCanvas.style.position = 'absolute';
 90 |       this.particleCanvas.style.top = '0';
 91 |       this.particleCanvas.style.left = '0';
 92 | 
 93 |       // Make sure it's on top of other elements
 94 |       this.particleCanvas.style.zIndex = '1001';
 95 | 
 96 |       // Make sure other elements under it are clickable
 97 |       this.particleCanvas.style.pointerEvents = 'none';
 98 | 
 99 |       // Add our canvas to the page
100 |       document.body.appendChild(this.particleCanvas);
101 |     },
102 |     resize() {
103 |       if (!this.particleCanvas) return;
104 |       this.particleCanvas.width =
105 |         window.innerWidth ||
106 |         document.documentElement.clientWidth ||
107 |         document.body.clientWidth;
108 |       this.particleCanvas.height =
109 |         window.innerHeight ||
110 |         document.documentElement.clientHeight ||
111 |         document.body.clientHeight;
112 |     },
113 |     update() {
114 |       // Clear out the old particles
115 |       if (this.particleCtx) {
116 |         this.particleCtx.clearRect(0, 0, window.innerWidth, window.innerHeight);
117 |       }
118 | 
119 |       // Draw all of our particles in their new location
120 |       for (let i = 0; i < this.particles.length; i++) {
121 |         this.particles[i].draw(this.particleCtx);
122 | 
123 |         // 最后一个粒子完成动画, 清除旧的粒子
124 |         if (i === this.particles.length - 1) {
125 |           let percent =
126 |             (Date.now() - this.particles[i].startTime) /
127 |             this.particles[i].animationDuration;
128 | 
129 |           if (percent > 1) {
130 |             this.particles = [];
131 |           }
132 |         }
133 |       }
134 |       // Animate performantly
135 |       window.requestAnimationFrame(this.update);
136 |     }
137 |   }
138 | };
139 | </script>
140 | 


--------------------------------------------------------------------------------
/layouts/Activity.vue:
--------------------------------------------------------------------------------
  1 | <template>
  2 |   <NoToolContainer>
  3 |     <div class="home">
  4 |       <div class="hero">
  5 |         <img v-if="data.heroImage" :src="$withBase(data.heroImage)" alt="hero">
  6 |         <h1>{{ data.heroText }}</h1>
  7 |         <p class="description">
  8 |           {{ data.tagline }}
  9 |         </p>
 10 |         <p>
 11 |           <div v-if="actions && actions.length">
 12 |             <Particle>
 13 |               <span class="action" v-for="(action, index) in actions" :key="index">
 14 |                 <AnimationButton class="action-button" :item="action"/>&nbsp;
 15 |               </span>
 16 |             </Particle>
 17 |           </div>
 18 |           <div v-else>
 19 |             <Particle>
 20 |               <span class="action" v-if="data.actionText && data.actionLink">
 21 |                 <AnimationButton class="action-button" :item="actionLink"/>
 22 |               </span>
 23 |             </Particle>
 24 |           </div>
 25 |         </p>
 26 |       </div>
 27 |       <div class="features" v-if="data.features && data.features.length">
 28 |         <div class="feature" v-for="(feature, index) in data.features" :key="index">
 29 |           <h2>{{ feature.title }}</h2>
 30 |           <p>{{ feature.details }}</p>
 31 |         </div>
 32 |       </div>
 33 |       <Content custom />
 34 |       <div class="act-footer" v-if="data.footer">
 35 |         {{ data.footer }}
 36 |       </div>
 37 |     </div>
 38 |   </NoToolContainer>
 39 | </template>
 40 | 
 41 | <script>
 42 | import AnimationButton from '../components/AnimationButton.vue';
 43 | import Particle from '../animation/particleBoom.vue';
 44 | 
 45 | export default {
 46 |   components: { Particle, AnimationButton },
 47 |   computed: {
 48 |     data () {
 49 |       return this.$page.frontmatter
 50 |     },
 51 |     actions () {
 52 |       return this.$page.frontmatter.actions || []
 53 |     },
 54 |     actionLink () {
 55 |       return {
 56 |         link: this.data.actionLink,
 57 |         text: this.data.actionText
 58 |       }
 59 |     }
 60 |   }
 61 | }
 62 | </script>
 63 | 
 64 | <style lang="stylus">
 65 | @import '../styles/config.styl'
 66 | 
 67 | .home
 68 |   padding $navbarHeight 2rem 0
 69 |   max-width 960px
 70 |   margin 0px auto
 71 |   .hero
 72 |     text-align center
 73 |     display flex
 74 |     flex-direction column
 75 |     align-items center
 76 |     img
 77 |       max-height 280px
 78 |       display block
 79 |       margin 3rem auto 1.5rem
 80 |     h1
 81 |       font-size 3rem
 82 |       margin 0
 83 |     .description
 84 |       margin 1.8rem auto
 85 |     .description
 86 |       max-width 35rem
 87 |       font-size 1.6rem
 88 |       line-height 1.3
 89 |       color lighten($textColor, 40%)
 90 |     .action-button
 91 |       display inline-block
 92 |       font-size 1.2rem
 93 |       color #fff
 94 |       background-color $accentColor
 95 |       padding 0.8rem 1.6rem
 96 |       border-radius 4px
 97 |       transition background-color .1s ease
 98 |       box-sizing border-box
 99 |       border-bottom 1px solid darken($accentColor, 10%)
100 |       &:hover
101 |         background-color lighten($accentColor, 10%)
102 |   .features
103 |     border-top 1px solid $borderColor
104 |     padding 1.2rem 0
105 |     margin-top 2.5rem
106 |     display flex
107 |     flex-wrap wrap
108 |     align-items flex-start
109 |     align-content strech
110 |     justify-content space-between
111 |   .feature
112 |     flex-grow 1
113 |     flex-basis 30%
114 |     max-width 30%
115 |     h2
116 |       font-size 1.4rem
117 |       font-weight 500
118 |       border-bottom none
119 |       padding-bottom 0
120 |       color lighten($textColor, 10%)
121 |     p
122 |       color lighten($textColor, 25%)
123 |   .act-footer
124 |     padding 2.5rem
125 |     border-top 1px solid $borderColor
126 |     text-align center
127 |     color lighten($textColor, 25%)
128 | 
129 | .content
130 |   img
131 |     max-width 100%
132 | @media (max-width: $MQMobile)
133 |   .home
134 |     .features
135 |       flex-direction column
136 |     .feature
137 |       max-width 100%
138 |       padding 0 2.5rem
139 | 
140 | @media (max-width: $MQMobileNarrow)
141 |   .home
142 |     padding-left 1.5rem
143 |     padding-right 1.5rem
144 |     .hero
145 |       img
146 |         max-height 210px
147 |         margin 2rem auto 1.2rem
148 |       h1
149 |         font-size 2rem
150 |       h1, .description, .action
151 |         margin 1.2rem auto
152 |       .description
153 |         font-size 1.2rem
154 |       .action-button
155 |         font-size 1rem
156 |         padding 0.6rem 1.2rem
157 |     .feature
158 |       h2
159 |         font-size 1.25rem
160 | </style>
161 | 


--------------------------------------------------------------------------------
/lib/util.js:
--------------------------------------------------------------------------------
  1 | export const hashRE = /#.*$/
  2 | export const indexRE = /(.+\/)index$/
  3 | export const navLayoutRE = /(\/.+\/)(.*)$/g
  4 | export const extRE = /\.(md|html)$/
  5 | export const endingSlashRE = /\/$/
  6 | export const outboundRE = /^(https?:|mailto:)/
  7 | 
  8 | export function normalize (path) {
  9 |   return path
 10 |     .replace(hashRE, '')
 11 |     .replace(extRE, '')
 12 | }
 13 | 
 14 | export function getHash (path) {
 15 |   const match = path.match(hashRE)
 16 |   if (match) {
 17 |     return match[0]
 18 |   }
 19 | }
 20 | 
 21 | export function isExternal (path) {
 22 |   return outboundRE.test(path)
 23 | }
 24 | 
 25 | export function isMailto (path) {
 26 |   return /^mailto:/.test(path)
 27 | }
 28 | 
 29 | export function ensureExt (path) {
 30 |   if (isExternal(path)) {
 31 |     return path
 32 |   }
 33 |   const hashMatch = path.match(hashRE)
 34 |   const hash = hashMatch ? hashMatch[0] : ''
 35 |   const normalized = normalize(path)
 36 | 
 37 |   if (endingSlashRE.test(normalized)) {
 38 |     return path
 39 |   }
 40 |   return normalized + '.html' + hash
 41 | }
 42 | 
 43 | export function isActive (route, path) {
 44 |   const routeHash = route.hash
 45 |   const linkHash = getHash(path)
 46 |   if (linkHash && routeHash !== linkHash) {
 47 |     return false
 48 |   }
 49 |   const routePath = normalize(route.path)
 50 |   const pagePath = normalize(path)
 51 |   if (endingSlashRE.test(routePath) || endingSlashRE.test(pagePath)) {
 52 |     return routePath === pagePath
 53 |   } else {
 54 |     return routePath.indexOf(pagePath) === 0
 55 |   }
 56 | }
 57 | 
 58 | export function getTitle (siteTitle, page) {
 59 |   if(page.frontmatter.activity) {
 60 |     return page.frontmatter.title || siteTitle
 61 |   }
 62 | 
 63 |   return siteTitle
 64 | }
 65 | 
 66 | // /about/index ==> /about/
 67 | export function navsLinksNormalize(link) {
 68 |   const re = link.match(indexRE)
 69 |   return re ? re[1] : link 
 70 | }
 71 | 
 72 | export function resolvePage (pages, rawPath, base) {
 73 |   if (base) {
 74 |     rawPath = resolvePath(rawPath, base)
 75 |   }
 76 |   const path = normalize(rawPath)
 77 |   for (let i = 0; i < pages.length; i++) {
 78 |     if (normalize(pages[i].path) === path) {
 79 |       return Object.assign({}, pages[i], {
 80 |         type: 'page',
 81 |         path: ensureExt(rawPath)
 82 |       })
 83 |     }
 84 |   }
 85 |   console.error(`[vuepress] No matching page found for sidebar item "${rawPath}"`)
 86 |   return {}
 87 | }
 88 | 
 89 | function resolvePath (relative, base, append) {
 90 |   const firstChar = relative.charAt(0)
 91 |   if (firstChar === '/') {
 92 |     return relative
 93 |   }
 94 | 
 95 |   if (firstChar === '?' || firstChar === '#') {
 96 |     return base + relative
 97 |   }
 98 | 
 99 |   const stack = base.split('/')
100 | 
101 |   // remove trailing segment if:
102 |   // - not appending
103 |   // - appending to trailing slash (last segment is empty)
104 |   if (!append || !stack[stack.length - 1]) {
105 |     stack.pop()
106 |   }
107 | 
108 |   // resolve relative path
109 |   const segments = relative.replace(/^\//, '').split('/')
110 |   for (let i = 0; i < segments.length; i++) {
111 |     const segment = segments[i]
112 |     if (segment === '..') {
113 |       stack.pop()
114 |     } else if (segment !== '.') {
115 |       stack.push(segment)
116 |     }
117 |   }
118 | 
119 |   // ensure leading slash
120 |   if (stack[0] !== '') {
121 |     stack.unshift('')
122 |   }
123 | 
124 |   return stack.join('/')
125 | }
126 | 
127 | export function resolveNavLinkItem (linkItem) {
128 |   return Object.assign(linkItem, {
129 |     type: linkItem.items && linkItem.items.length ? 'links' : 'link'
130 |   })
131 | }
132 | 
133 | export function resolveMatchingConfig (route, config) {
134 |   if (Array.isArray(config)) {
135 |     return {
136 |       base: '/',
137 |       config: config
138 |     }
139 |   }
140 |   for (const base in config) {
141 |     if (ensureEndingSlash(route.path).indexOf(base) === 0) {
142 |       return {
143 |         base,
144 |         config: config[base]
145 |       }
146 |     }
147 |   }
148 |   return {}
149 | }
150 | 
151 | function ensureEndingSlash (path) {
152 |   return /(\.html|\/)$/.test(path)
153 |     ? path
154 |     : path + '/'
155 | }
156 | 
157 | Date.prototype.Format = function (fmt) {
158 | 	var o = {
159 | 		"y+": this.getFullYear(),
160 | 		"M+": this.getMonth() + 1, // month
161 | 		"d+": this.getDate(), // day
162 | 		"H+": this.getHours(), // hour
163 | 		"m+": this.getMinutes(), // Minute
164 | 		"s+": this.getSeconds(), // Seconds
165 | 		"q+": Math.floor((this.getMonth() + 3) / 3), // Quarter
166 | 		"S": this.getMilliseconds() // millisecond
167 | 	};
168 | 	if (!fmt) fmt = 'yyyy-MM-dd HH:mm:ss'
169 | 	if (/(y+)/.test(fmt)) fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length));
170 | 	for (var k in o)
171 | 		if (new RegExp("(" + k + ")").test(fmt)) {
172 | 			fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
173 | 		}
174 | 	return fmt;
175 | }


--------------------------------------------------------------------------------
/components/SearchBox.vue:
--------------------------------------------------------------------------------
  1 | <template>
  2 |   <div class="search-box">
  3 |     <input
  4 |       @input="query = $event.target.value"
  5 |       aria-label="Search"
  6 |       :value="query"
  7 |       autocomplete="off"
  8 |       spellcheck="false"
  9 |       @focus="focused = true"
 10 |       @blur="focused = false"
 11 |       @keyup.enter="go(focusIndex)"
 12 |       @keyup.up="onUp"
 13 |       @keyup.down="onDown">
 14 |     <ul class="suggestions"
 15 |       v-if="showSuggestions"
 16 |       :class="{ 'align-right': alignRight }"
 17 |       @mouseleave="unfocus">
 18 |       <li class="suggestion" v-for="(s, i) in suggestions"
 19 |         :key="i"
 20 |         :class="{ focused: i === focusIndex }"
 21 |         @mousedown="go(i)"
 22 |         @mouseenter="focus(i)">
 23 |         <a :href="s.path" @click.prevent>
 24 |           <span class="suggestion-title">{{ s.title || s.path }}</span>
 25 |           <span v-if="s.header" class="header">&gt; {{ s.header.title }}</span>
 26 |         </a>
 27 |       </li>
 28 |     </ul>
 29 |   </div>
 30 | </template>
 31 | 
 32 | <script>
 33 | import { pageNormalize } from "../lib/util";
 34 | 
 35 | export default {
 36 |   data() {
 37 |     return {
 38 |       query: "",
 39 |       focused: false,
 40 |       focusIndex: 0
 41 |     };
 42 |   },
 43 |   computed: {
 44 |     showSuggestions() {
 45 |       return this.focused && this.suggestions && this.suggestions.length;
 46 |     },
 47 |     suggestions() {
 48 |       const query = this.query.trim().toLowerCase();
 49 |       if (!query) {
 50 |         return;
 51 |       }
 52 | 
 53 |       const max = 5;
 54 |       const pages = this.$pagination.all;
 55 |       const localePath = this.$localePath;
 56 |       const matches = item => {
 57 |         const keywords = this.getKeywords(item);
 58 |         return (
 59 |           item.title && 
 60 |           item.title.toLowerCase().indexOf(query) > -1 ||
 61 |           keywords.some(keyword => keyword.indexOf(query) > -1)
 62 |         );
 63 |       };
 64 |       const res = [];
 65 |       for (let i = 0; i < pages.length; i++) {
 66 |         if (res.length >= max) break;
 67 |         const p = pages[i];
 68 |         // filter out results that do not match current locale
 69 |         if (this.getPageLocalePath(p) !== localePath) {
 70 |           continue;
 71 |         }
 72 |         if (matches(p)) {
 73 |           res.push(p);
 74 |         } else if (p.headers) {
 75 |           for (let j = 0; j < p.headers.length; j++) {
 76 |             if (res.length >= max) break;
 77 |             const h = p.headers[j];
 78 |             if (matches(h)) {
 79 |               res.push(
 80 |                 Object.assign({}, p, {
 81 |                   path: p.path + "#" + h.slug,
 82 |                   header: h
 83 |                 })
 84 |               );
 85 |             }
 86 |           }
 87 |         }
 88 |       }
 89 |       return res;
 90 |     },
 91 |     // make suggestions align right when there are not enough items
 92 |     alignRight() {
 93 |       const navCount = (this.$site.themeConfig.nav || []).length;
 94 |       return navCount <= 2;
 95 |     }
 96 |   },
 97 |   methods: {
 98 |     getKeywords(page) {
 99 |       const metaList = (page.frontmatter ? page.frontmatter.meta : []) || [];
100 |       let keywords = metaList.filter(meta => meta.name === "keywords");
101 |       keywords = keywords.length ? keywords[0].content.split(" ") : [];
102 |       return keywords.map(keyword => keyword.toLowerCase())
103 |     },
104 |     getPageLocalePath(page) {
105 |       for (const localePath in this.$site.locales || {}) {
106 |         if (localePath !== "/" && page.path.indexOf(localePath) === 0) {
107 |           return localePath;
108 |         }
109 |       }
110 |       return "/";
111 |     },
112 |     onUp() {
113 |       if (this.showSuggestions) {
114 |         if (this.focusIndex > 0) {
115 |           this.focusIndex--;
116 |         } else {
117 |           this.focusIndex = this.suggestions.length - 1;
118 |         }
119 |       }
120 |     },
121 |     onDown() {
122 |       if (this.showSuggestions) {
123 |         if (this.focusIndex < this.suggestions.length - 1) {
124 |           this.focusIndex++;
125 |         } else {
126 |           this.focusIndex = 0;
127 |         }
128 |       }
129 |     },
130 |     go(i) {
131 |       this.$router.push(this.suggestions[i].path);
132 |       this.query = "";
133 |       this.focusIndex = 0;
134 |     },
135 |     focus(i) {
136 |       this.focusIndex = i;
137 |     },
138 |     unfocus() {
139 |       this.focusIndex = -1;
140 |     }
141 |   }
142 | };
143 | </script>
144 | 
145 | <style lang="stylus">
146 | @import '../styles/config.styl';
147 | 
148 | .search-box {
149 |   display: inline-block;
150 |   position: relative;
151 |   margin-right: 0.5rem;
152 | 
153 |   input {
154 |     cursor: pointer;
155 |     width: 10rem;
156 |     color: lighten($textColor, 25%);
157 |     display: inline-block;
158 |     border: 1px solid #e6ecf0;
159 |     border-radius: 2rem;
160 |     font-size: 0.9rem;
161 |     line-height: 2rem;
162 |     padding: 0 0.5rem 0 2rem;
163 |     outline: none;
164 |     transition: all 0.2s ease;
165 |     background: #f5f8fa url('../assets/search.svg') 0.6rem 0.5rem no-repeat;
166 |     background-size: 1rem;
167 | 
168 |     &:focus {
169 |       cursor: auto;
170 |       background-color #fff;
171 |       border: 2px solid $focusColor;
172 |     }
173 |   }
174 | 
175 |   .suggestions {
176 |     background: #fff;
177 |     box-shadow: 0 1px 4px rgba(0,0,0,0.25);
178 |     width: 20rem;
179 |     position: absolute;
180 |     top: 2rem;
181 |     border-radius: 3px;
182 |     padding: 0.4rem;
183 |     list-style-type: none;
184 | 
185 |     &.align-right {
186 |       right: 0;
187 |     }
188 |   }
189 | 
190 |   .suggestion {
191 |     line-height: 1.4;
192 |     padding: 0.4rem 0.6rem;
193 |     border-radius: 3px;
194 | 
195 |     a {
196 |       color: lighten($textColor, 35%);
197 | 
198 |       .suggestion-title {
199 |         font-weight: 600;
200 |       }
201 | 
202 |       .header {
203 |         font-size: 0.9em;
204 |         margin-left: 0.25em;
205 |       }
206 |     }
207 | 
208 |     &.focused {
209 |       // background-color: #f3f4f5;
210 |       background-color lighten(#ebf8f3, 20%);
211 | 
212 |       a {
213 |         color: $accentColor;
214 |       }
215 |     }
216 |   }
217 | }
218 | 
219 | @media (max-width: $MQNarrow) {
220 |   .search-box input {
221 |     width: 0;
222 |     border-color: transparent;
223 |     position: relative;
224 |     left: 1rem;
225 | 
226 |     &:focus {
227 |       left: 0;
228 |       width: 8rem;
229 |     }
230 |   }
231 | }
232 | 
233 | @media (max-width: $MQMobile) {
234 |   .search-box {
235 |     margin-right: 0;
236 | 
237 |     .suggestions {
238 |       right: 0;
239 |     }
240 |   }
241 | }
242 | 
243 | @media (max-width: $MQMobileNarrow) {
244 |   .search-box {
245 |     .suggestions {
246 |       width: calc(100vw - 4rem);
247 |     }
248 | 
249 |     input:focus {
250 |       width: 8rem;
251 |     }
252 |   }
253 | }
254 | </style>
255 | 


--------------------------------------------------------------------------------
/assets/404.svg:
--------------------------------------------------------------------------------
  1 | <?xml version="1.0" encoding="UTF-8" standalone="no"?>
  2 | <svg width="423px" height="341px" viewBox="0 0 423 341" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
  3 |     <!-- Generator: Sketch 46.2 (44496) - http://www.bohemiancoding.com/sketch -->
  4 |     <title>Group 4</title>
  5 |     <desc>Created with Sketch.</desc>
  6 |     <defs></defs>
  7 |     <g id="Ant-Design-Pro-3.0" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
  8 |         <g id="404" transform="translate(-484.000000, -221.000000)">
  9 |             <g id="Group-4" transform="translate(464.000000, 222.000000)">
 10 |                 <g id="Group-5" transform="translate(75.417348, 0.163879)" stroke="#A3B1BF" stroke-width="1.62" opacity="0.6" stroke-linejoin="round" stroke-dasharray="12.15">
 11 |                     <path d="M169.575185,288.890375 C103.647066,288.890375 50.2010204,235.455806 50.2010204,169.540425 C50.2010204,103.625045 103.647066,50.1904762 169.575185,50.1904762 C235.50394,50.1904762 288.94935,103.625045 288.94935,169.540425 C288.94935,235.455806 235.50394,288.890375 169.575185,288.890375 Z" id="Stroke-1"></path>
 12 |                     <path d="M169.405699,338.555288 C76.0274364,338.555288 0.329411882,262.872619 0.329411882,169.513299 C0.329411882,76.1539786 76.0274364,0.471309613 169.405699,0.471309613 C262.783961,0.471309613 338.481985,76.1539786 338.481985,169.513299 C338.481985,262.872619 262.783961,338.555288 169.405699,338.555288 Z" id="Stroke-3"></path>
 13 |                 </g>
 14 |                 <polygon id="Fill-6" fill="#F5F5F5" transform="translate(106.914750, 199.432805) rotate(22.000000) translate(-106.914750, -199.432805) " points="97.7112298 198.803016 116.11827 190.231152 107.544667 208.634458"></polygon>
 15 |                 <polygon id="Stroke-7" stroke="#A3B1BF" stroke-width="1.62" stroke-linejoin="round" transform="translate(106.914750, 199.432805) rotate(22.000000) translate(-106.914750, -199.432805) " points="97.7112298 198.803016 116.11827 190.231152 107.544667 208.634458"></polygon>
 16 |                 <polygon id="Fill-8" transform="translate(58.996118, 219.767028) rotate(22.000000) translate(-58.996118, -219.767028) " points="38.8543444 215.183828 54.4119879 199.629341 79.1378915 224.350228 63.580248 239.904716"></polygon>
 17 |                 <polygon id="Stroke-9" stroke="#A3B1BF" stroke-width="1.62" stroke-linejoin="round" transform="translate(58.996118, 219.767028) rotate(22.000000) translate(-58.996118, -219.767028) " points="38.8543444 215.183828 54.4119879 199.629341 79.1378915 224.350228 63.580248 239.904716"></polygon>
 18 |                 <polygon id="Fill-10" fill="#F5F5F5" transform="translate(71.226096, 214.577614) rotate(22.000000) translate(-71.226096, -214.577614) " points="51.4642422 198.657893 55.3028278 194.820086 90.9879502 230.497335 87.1487294 234.335141"></polygon>
 19 |                 <polygon id="Stroke-11" stroke="#A3B1BF" stroke-width="1.62" fill="#F0F2F5" stroke-linejoin="round" transform="translate(71.226096, 214.577614) rotate(22.000000) translate(-71.226096, -214.577614) " points="51.4642422 198.657893 55.3028278 194.820086 90.9879502 230.497335 87.1487294 234.335141"></polygon>
 20 |                 <polygon id="Fill-12" transform="translate(84.698338, 273.903349) rotate(22.000000) translate(-84.698338, -273.903349) " points="56.0769883 259.690379 70.4821667 245.288122 113.319688 288.116319 98.9145099 302.518575"></polygon>
 21 |                 <polygon id="Stroke-13" stroke="#A3B1BF" stroke-width="1.62" stroke-linejoin="round" transform="translate(84.698338, 273.903349) rotate(22.000000) translate(-84.698338, -273.903349) " points="56.0769883 259.690379 70.4821667 245.288122 113.319688 288.116319 98.9145099 302.518575"></polygon>
 22 |                 <polygon id="Fill-14" transform="translate(75.456149, 212.782520) rotate(22.000000) translate(-75.456149, -212.782520) " points="63.8911557 203.879723 66.5512281 201.22019 87.0211429 221.685318 84.3604352 224.34485"></polygon>
 23 |                 <polygon id="Stroke-15" stroke="#A3B1BF" stroke-width="1.62" stroke-linejoin="round" transform="translate(75.456149, 212.782520) rotate(22.000000) translate(-75.456149, -212.782520) " points="63.8911557 203.879723 66.5512281 201.22019 87.0211429 221.685318 84.3604352 224.34485"></polygon>
 24 |                 <polygon id="Fill-16" fill="#F5F5F5" transform="translate(78.176142, 202.618192) rotate(22.000000) translate(-78.176142, -202.618192) " points="74.4026766 205.006817 80.5652518 198.845492 81.9496076 200.229567 75.7870324 206.390892"></polygon>
 25 |                 <polygon id="Stroke-17" stroke="#A3B1BF" stroke-width="1.62" stroke-linejoin="round" transform="translate(78.176142, 202.618192) rotate(22.000000) translate(-78.176142, -202.618192) " points="74.4026766 205.006817 80.5652518 198.845492 81.9496076 200.229567 75.7870324 206.390892"></polygon>
 26 |                 <polygon id="Fill-18" fill="#F5F5F5" transform="translate(84.676979, 217.928886) rotate(22.000000) translate(-84.676979, -217.928886) " points="80.9035138 220.317511 87.066089 214.156186 88.4504448 215.540261 82.2878696 221.701586"></polygon>
 27 |                 <polygon id="Stroke-19" stroke="#A3B1BF" stroke-width="1.62" stroke-linejoin="round" transform="translate(84.676979, 217.928886) rotate(22.000000) translate(-84.676979, -217.928886) " points="80.9035138 220.317511 87.066089 214.156186 88.4504448 215.540261 82.2878696 221.701586"></polygon>
 28 |                 <polygon id="Fill-20" transform="translate(70.238421, 242.404581) rotate(22.000000) translate(-70.238421, -242.404581) " points="67.8493111 238.631881 74.0118863 244.793206 72.6275305 246.177281 66.4649553 240.015956"></polygon>
 29 |                 <polygon id="Stroke-21" stroke="#A3B1BF" stroke-width="1.62" stroke-linejoin="round" transform="translate(70.238421, 242.404581) rotate(22.000000) translate(-70.238421, -242.404581) " points="67.8493111 238.631881 74.0118863 244.793206 72.6275305 246.177281 66.4649553 240.015956"></polygon>
 30 |                 <polygon id="Fill-22" transform="translate(48.081755, 224.398789) rotate(22.000000) translate(-48.081755, -224.398789) " points="35.1127107 220.725179 36.3242602 211.432376 61.0507992 236.153899 51.756111 237.365203"></polygon>
 31 |                 <polygon id="Stroke-23" stroke="#A3B1BF" stroke-width="1.62" stroke-linejoin="round" transform="translate(48.081755, 224.398789) rotate(22.000000) translate(-48.081755, -224.398789) " points="35.1127107 220.725179 36.3242602 211.432376 61.0507992 236.153899 51.756111 237.365203"></polygon>
 32 |                 <polygon id="Fill-24" transform="translate(38.612968, 228.416820) rotate(22.000000) translate(-38.612968, -228.416820) " points="32.9179858 217.470622 26.2496982 216.056058 50.9762371 240.777581 49.5613861 234.110647"></polygon>
 33 |                 <polygon id="Stroke-25" stroke="#A3B1BF" stroke-width="1.62" stroke-linejoin="round" transform="translate(38.612968, 228.416820) rotate(22.000000) translate(-38.612968, -228.416820) " points="32.9179858 217.470622 26.2496982 216.056058 50.9762371 240.777581 49.5613861 234.110647"></polygon>
 34 |                 <polygon id="Fill-26" transform="translate(31.086342, 221.523909) rotate(22.000000) translate(-31.086342, -221.523909) " points="32.6469986 217.297684 26.8592604 218.37941 34.2314793 225.750133 35.3134242 219.963569"></polygon>
 35 |                 <polygon id="Stroke-27" stroke="#A3B1BF" stroke-width="1.62" stroke-linejoin="round" transform="translate(31.086342, 221.523909) rotate(22.000000) translate(-31.086342, -221.523909) " points="32.6469986 217.297684 26.8592604 218.37941 34.2314793 225.750133 35.3134242 219.963569"></polygon>
 36 |                 <polygon id="Fill-28" transform="translate(38.344372, 238.617819) rotate(22.000000) translate(-38.344372, -238.617819) " points="39.9050284 234.391595 34.1172902 235.47332 41.4895091 242.844044 42.571454 237.05748"></polygon>
 37 |                 <polygon id="Stroke-29" stroke="#A3B1BF" stroke-width="1.62" stroke-linejoin="round" transform="translate(38.344372, 238.617819) rotate(22.000000) translate(-38.344372, -238.617819) " points="39.9050284 234.391595 34.1172902 235.47332 41.4895091 242.844044 42.571454 237.05748"></polygon>
 38 |                 <polygon id="Fill-30" fill="#F0F2F5" transform="translate(75.352798, 203.766862) rotate(22.000000) translate(-75.352798, -203.766862) " points="71.4417859 201.708217 73.2937351 199.856644 79.2638092 205.824871 77.4118601 207.67708"></polygon>
 39 |                 <polygon id="Stroke-31" stroke="#A3B1BF" stroke-width="1.62" stroke-linejoin="round" transform="translate(75.352798, 203.766862) rotate(22.000000) translate(-75.352798, -203.766862) " points="71.4417859 201.708217 73.2937351 199.856644 79.2638092 205.824871 77.4118601 207.67708"></polygon>
 40 |                 <polygon id="Fill-32" fill="#F0F2F5" transform="translate(81.871541, 219.119730) rotate(22.000000) translate(-81.871541, -219.119730) " points="77.9605297 217.061085 79.8124789 215.209512 85.7825531 221.177739 83.9306039 223.029948"></polygon>
 41 |                 <polygon id="Stroke-33" stroke="#A3B1BF" stroke-width="1.62" stroke-linejoin="round" transform="translate(81.871541, 219.119730) rotate(22.000000) translate(-81.871541, -219.119730) " points="77.9605297 217.061085 79.8124789 215.209512 85.7825531 221.177739 83.9306039 223.029948"></polygon>
 42 |                 <polygon id="Fill-34" transform="translate(68.034935, 237.215417) rotate(22.000000) translate(-68.034935, -237.215417) " points="65.1594898 237.106164 67.9256601 234.340555 70.9103796 237.324669 68.1442092 240.090278"></polygon>
 43 |                 <polygon id="Stroke-35" stroke="#A3B1BF" stroke-width="1.62" fill="#F5F5F5" stroke-linejoin="round" transform="translate(68.034935, 237.215417) rotate(22.000000) translate(-68.034935, -237.215417) " points="65.1594898 237.106164 67.9256601 234.340555 70.9103796 237.324669 68.1442092 240.090278"></polygon>
 44 |                 <path d="M90.2556147,213.065319 C79.2271463,202.039088 74.6433339,188.153875 78.4889079,179.512775 C79.1248602,178.084237 80.8319571,175.429786 84.5339495,179.131027 C88.2353065,182.832268 120.560237,215.150007 123.931865,218.52095 C127.303492,221.891894 125.245065,224.192545 123.817508,224.827733 C115.174655,228.675068 101.284718,224.092186 90.2556147,213.065319 Z" id="Fill-36" fill="#F5F5F5" transform="translate(101.453924, 201.708917) rotate(22.000000) translate(-101.453924, -201.708917) "></path>
 45 |                 <path d="M90.2556147,213.065319 C79.2271463,202.039088 74.6433339,188.153875 78.4889079,179.512775 C79.1248602,178.084237 80.8319571,175.429786 84.5339495,179.131027 C88.2353065,182.832268 120.560237,215.150007 123.931865,218.52095 C127.303492,221.891894 125.245065,224.192545 123.817508,224.827733 C115.174655,228.675068 101.284718,224.092186 90.2556147,213.065319 Z" id="Stroke-38" stroke="#A3B1BF" stroke-width="1.62" fill="#F0F2F5" stroke-linejoin="round" transform="translate(101.453924, 201.708917) rotate(22.000000) translate(-101.453924, -201.708917) "></path>
 46 |                 <polygon id="Fill-40" fill="#F0F2F5" transform="translate(86.633853, 208.038961) rotate(22.000000) translate(-86.633853, -208.038961) " points="77.9716233 201.230061 79.8235724 199.378488 95.2960835 214.84786 93.4441343 216.699433"></polygon>
 47 |                 <polygon id="Stroke-42" stroke="#A3B1BF" stroke-width="1.62" stroke-linejoin="round" transform="translate(86.633853, 208.038961) rotate(22.000000) translate(-86.633853, -208.038961) " points="77.9716233 201.230061 79.8235724 199.378488 95.2960835 214.84786 93.4441343 216.699433"></polygon>
 48 |                 <path d="M121.635514,196.068815 C120.517356,197.186746 118.704797,197.186746 117.586639,196.068815 C116.469116,194.950884 116.469116,193.138692 117.586639,192.020761 C118.704797,190.903465 120.517356,190.903465 121.635514,192.020761 C122.753672,193.138692 122.753672,194.950884 121.635514,196.068815" id="Fill-44" fill="#A3B1BF" transform="translate(119.611315, 194.045026) rotate(22.000000) translate(-119.611315, -194.045026) "></path>
 49 |                 <polygon id="Fill-46" fill-opacity="0.6" fill="#A3B1BF" transform="translate(81.250567, 248.056422) rotate(22.000000) translate(-81.250567, -248.056422) " points="81.2505672 249.672341 79.6343206 248.056422 81.2505672 246.440503 82.8668137 248.056422"></polygon>
 50 |                 <polygon id="Stroke-48" transform="translate(81.250567, 248.056422) rotate(22.000000) translate(-81.250567, -248.056422) " points="81.2505672 249.672341 79.6343206 248.056422 81.2505672 246.440503 82.8668137 248.056422"></polygon>
 51 |                 <polygon id="Fill-50" fill-opacity="0.6" fill="#A3B1BF" transform="translate(82.702196, 251.475282) rotate(22.000000) translate(-82.702196, -251.475282) " points="82.7021965 253.091201 81.0859499 251.475282 82.7021965 249.859363 84.318443 251.475282"></polygon>
 52 |                 <polygon id="Stroke-52" transform="translate(82.702196, 251.475282) rotate(22.000000) translate(-82.702196, -251.475282) " points="82.7021965 253.091201 81.0859499 251.475282 82.7021965 249.859363 84.318443 251.475282"></polygon>
 53 |                 <polygon id="Fill-54" fill-opacity="0.6" fill="#A3B1BF" transform="translate(84.153791, 254.894059) rotate(22.000000) translate(-84.153791, -254.894059) " points="84.1537906 256.509978 82.5375441 254.894059 84.1537906 253.278141 85.7700372 254.894059"></polygon>
 54 |                 <polygon id="Stroke-56" transform="translate(84.153791, 254.894059) rotate(22.000000) translate(-84.153791, -254.894059) " points="84.1537906 256.509978 82.5375441 254.894059 84.1537906 253.278141 85.7700372 254.894059"></polygon>
 55 |                 <polygon id="Fill-58" fill-opacity="0.6" fill="#A3B1BF" transform="translate(85.605385, 258.312837) rotate(22.000000) translate(-85.605385, -258.312837) " points="85.6053848 259.928756 83.9891383 258.312837 85.6053848 256.696918 87.2216313 258.312837"></polygon>
 56 |                 <polygon id="Stroke-60" transform="translate(85.605385, 258.312837) rotate(22.000000) translate(-85.605385, -258.312837) " points="85.6053848 259.928756 83.9891383 258.312837 85.6053848 256.696918 87.2216313 258.312837"></polygon>
 57 |                 <polygon id="Fill-62" fill-opacity="0.6" fill="#A3B1BF" transform="translate(78.094482, 249.395723) rotate(22.000000) translate(-78.094482, -249.395723) " points="78.0944819 251.011642 76.4782353 249.395723 78.0944819 247.779804 79.7107284 249.395723"></polygon>
 58 |                 <polygon id="Stroke-64" transform="translate(78.094482, 249.395723) rotate(22.000000) translate(-78.094482, -249.395723) " points="78.0944819 251.011642 76.4782353 249.395723 78.0944819 247.779804 79.7107284 249.395723"></polygon>
 59 |                 <polygon id="Fill-66" fill-opacity="0.6" fill="#A3B1BF" transform="translate(79.546052, 252.814559) rotate(22.000000) translate(-79.546052, -252.814559) " points="79.5460522 254.430478 77.9298057 252.814559 79.5460522 251.198641 81.1622988 252.814559"></polygon>
 60 |                 <polygon id="Stroke-68" transform="translate(79.546052, 252.814559) rotate(22.000000) translate(-79.546052, -252.814559) " points="79.5460522 254.430478 77.9298057 252.814559 79.5460522 251.198641 81.1622988 252.814559"></polygon>
 61 |                 <polygon id="Fill-70" fill-opacity="0.6" fill="#A3B1BF" transform="translate(80.997705, 256.233360) rotate(22.000000) translate(-80.997705, -256.233360) " points="80.9977053 257.849279 79.3814588 256.23336 80.9977053 254.617442 82.6139518 256.23336"></polygon>
 62 |                 <polygon id="Stroke-72" transform="translate(80.997705, 256.233360) rotate(22.000000) translate(-80.997705, -256.233360) " points="79.3814588 256.23336 80.9977053 254.617442 82.6139518 256.23336 80.9977053 257.849279"></polygon>
 63 |                 <polygon id="Fill-74" fill-opacity="0.6" fill="#A3B1BF" transform="translate(82.449276, 259.652197) rotate(22.000000) translate(-82.449276, -259.652197) " points="82.4492757 261.268115 80.8330292 259.652197 82.4492757 258.036278 84.0655222 259.652197"></polygon>
 64 |                 <polygon id="Stroke-76" transform="translate(82.449276, 259.652197) rotate(22.000000) translate(-82.449276, -259.652197) " points="82.4492757 261.268115 80.8330292 259.652197 82.4492757 258.036278 84.0655222 259.652197"></polygon>
 65 |                 <polygon id="Fill-78" fill-opacity="0.6" fill="#A3B1BF" transform="translate(74.938373, 250.735083) rotate(22.000000) translate(-74.938373, -250.735083) " points="74.9383727 252.351002 73.3221262 250.735083 74.9383727 249.119164 76.5546193 250.735083"></polygon>
 66 |                 <polygon id="Stroke-80" transform="translate(74.938373, 250.735083) rotate(22.000000) translate(-74.938373, -250.735083) " points="74.9383727 252.351002 73.3221262 250.735083 74.9383727 249.119164 76.5546193 250.735083"></polygon>
 67 |                 <polygon id="Fill-82" fill-opacity="0.6" fill="#A3B1BF" transform="translate(76.389967, 254.153860) rotate(22.000000) translate(-76.389967, -254.153860) " points="76.3899669 255.769779 74.7737204 254.15386 76.3899669 252.537942 78.0062134 254.15386"></polygon>
 68 |                 <polygon id="Stroke-84" transform="translate(76.389967, 254.153860) rotate(22.000000) translate(-76.389967, -254.153860) " points="76.3899669 255.769779 74.7737204 254.15386 76.3899669 252.537942 78.0062134 254.15386"></polygon>
 69 |                 <polygon id="Fill-86" fill-opacity="0.6" fill="#A3B1BF" transform="translate(77.841620, 257.572661) rotate(22.000000) translate(-77.841620, -257.572661) " points="77.84162 259.18858 76.2253735 257.572661 77.84162 255.956743 79.4578665 257.572661"></polygon>
 70 |                 <polygon id="Stroke-88" transform="translate(77.841620, 257.572661) rotate(22.000000) translate(-77.841620, -257.572661) " points="77.84162 259.18858 76.2253735 257.572661 77.84162 255.956743 79.4578665 257.572661"></polygon>
 71 |                 <polygon id="Fill-90" fill-opacity="0.6" fill="#A3B1BF" transform="translate(79.293190, 260.991498) rotate(22.000000) translate(-79.293190, -260.991498) " points="79.2931904 262.607416 77.6769438 260.991498 79.2931904 259.375579 80.9094369 260.991498"></polygon>
 72 |                 <polygon id="Stroke-92" transform="translate(79.293190, 260.991498) rotate(22.000000) translate(-79.293190, -260.991498) " points="79.2931904 262.607416 77.6769438 260.991498 79.2931904 259.375579 80.9094369 260.991498"></polygon>
 73 |                 <polygon id="Fill-94" fill-opacity="0.6" fill="#A3B1BF" transform="translate(71.782287, 252.074384) rotate(22.000000) translate(-71.782287, -252.074384) " points="71.7822874 253.690302 70.1660409 252.074384 71.7822874 250.458465 73.3985339 252.074384"></polygon>
 74 |                 <polygon id="Stroke-96" transform="translate(71.782287, 252.074384) rotate(22.000000) translate(-71.782287, -252.074384) " points="71.7822874 253.690302 70.1660409 252.074384 71.7822874 250.458465 73.3985339 252.074384"></polygon>
 75 |                 <polygon id="Fill-98" fill-opacity="0.6" fill="#A3B1BF" transform="translate(73.233882, 255.493161) rotate(22.000000) translate(-73.233882, -255.493161) " points="73.2338816 257.10908 71.6176351 255.493161 73.2338816 253.877242 74.8501281 255.493161"></polygon>
 76 |                 <polygon id="Stroke-100" transform="translate(73.233882, 255.493161) rotate(22.000000) translate(-73.233882, -255.493161) " points="73.2338816 257.10908 71.6176351 255.493161 73.2338816 253.877242 74.8501281 255.493161"></polygon>
 77 |                 <polygon id="Fill-102" fill-opacity="0.6" fill="#A3B1BF" transform="translate(74.685535, 258.911962) rotate(22.000000) translate(-74.685535, -258.911962) " points="74.6855347 260.527881 73.0692881 258.911962 74.6855347 257.296044 76.3017812 258.911962"></polygon>
 78 |                 <polygon id="Stroke-104" transform="translate(74.685535, 258.911962) rotate(22.000000) translate(-74.685535, -258.911962) " points="74.6855347 260.527881 73.0692881 258.911962 74.6855347 257.296044 76.3017812 258.911962"></polygon>
 79 |                 <polygon id="Fill-106" fill-opacity="0.6" fill="#A3B1BF" transform="translate(76.137105, 262.330799) rotate(22.000000) translate(-76.137105, -262.330799) " points="76.137105 263.946717 74.5208585 262.330799 76.137105 260.71488 77.7533516 262.330799"></polygon>
 80 |                 <polygon id="Stroke-108" transform="translate(76.137105, 262.330799) rotate(22.000000) translate(-76.137105, -262.330799) " points="76.137105 263.946717 74.5208585 262.330799 76.137105 260.71488 77.7533516 262.330799"></polygon>
 81 |                 <polygon id="Fill-110" fill-opacity="0.6" fill="#A3B1BF" transform="translate(68.626202, 253.413685) rotate(22.000000) translate(-68.626202, -253.413685) " points="68.6262021 255.029603 67.0099556 253.413685 68.6262021 251.797766 70.2424486 253.413685"></polygon>
 82 |                 <polygon id="Stroke-112" transform="translate(68.626202, 253.413685) rotate(22.000000) translate(-68.626202, -253.413685) " points="68.6262021 255.029603 67.0099556 253.413685 68.6262021 251.797766 70.2424486 253.413685"></polygon>
 83 |                 <polygon id="Fill-114" fill-opacity="0.6" fill="#A3B1BF" transform="translate(70.077796, 256.832462) rotate(22.000000) translate(-70.077796, -256.832462) " points="70.0777963 258.448381 68.4615497 256.832462 70.0777963 255.216543 71.6940428 256.832462"></polygon>
 84 |                 <polygon id="Stroke-116" transform="translate(70.077796, 256.832462) rotate(22.000000) translate(-70.077796, -256.832462) " points="70.0777963 258.448381 68.4615497 256.832462 70.0777963 255.216543 71.6940428 256.832462"></polygon>
 85 |                 <polygon id="Fill-118" fill-opacity="0.6" fill="#A3B1BF" transform="translate(71.529426, 260.251322) rotate(22.000000) translate(-71.529426, -260.251322) " points="71.5294256 261.867241 69.913179 260.251322 71.5294256 258.635403 73.1456721 260.251322"></polygon>
 86 |                 <polygon id="Stroke-120" transform="translate(71.529426, 260.251322) rotate(22.000000) translate(-71.529426, -260.251322) " points="71.5294256 261.867241 69.913179 260.251322 71.5294256 258.635403 73.1456721 260.251322"></polygon>
 87 |                 <polygon id="Fill-122" fill-opacity="0.6" fill="#A3B1BF" transform="translate(72.981020, 263.670099) rotate(22.000000) translate(-72.981020, -263.670099) " points="72.9810197 265.286018 71.3647732 263.670099 72.9810197 262.054181 74.5972663 263.670099"></polygon>
 88 |                 <polygon id="Stroke-124" transform="translate(72.981020, 263.670099) rotate(22.000000) translate(-72.981020, -263.670099) " points="72.9810197 265.286018 71.3647732 263.670099 72.9810197 262.054181 74.5972663 263.670099"></polygon>
 89 |                 <polygon id="Fill-126" fill-opacity="0.6" fill="#A3B1BF" transform="translate(88.852907, 265.961362) rotate(22.000000) translate(-88.852907, -265.961362) " points="88.8529067 267.577281 87.2366602 265.961362 88.8529067 264.345443 90.4691533 265.961362"></polygon>
 90 |                 <polygon id="Stroke-128" transform="translate(88.852907, 265.961362) rotate(22.000000) translate(-88.852907, -265.961362) " points="88.8529067 267.577281 87.2366602 265.961362 88.8529067 264.345443 90.4691533 265.961362"></polygon>
 91 |                 <polygon id="Fill-130" fill-opacity="0.6" fill="#A3B1BF" transform="translate(90.304501, 269.380139) rotate(22.000000) translate(-90.304501, -269.380139) " points="90.3045009 270.996058 88.6882544 269.380139 90.3045009 267.764221 91.9207474 269.380139"></polygon>
 92 |                 <polygon id="Stroke-132" transform="translate(90.304501, 269.380139) rotate(22.000000) translate(-90.304501, -269.380139) " points="90.3045009 270.996058 88.6882544 269.380139 90.3045009 267.764221 91.9207474 269.380139"></polygon>
 93 |                 <polygon id="Fill-134" fill-opacity="0.6" fill="#A3B1BF" transform="translate(91.756130, 272.798999) rotate(22.000000) translate(-91.756130, -272.798999) " points="91.7561302 274.414918 90.1398837 272.798999 91.7561302 271.183081 93.3723767 272.798999"></polygon>
 94 |                 <polygon id="Stroke-136" transform="translate(91.756130, 272.798999) rotate(22.000000) translate(-91.756130, -272.798999) " points="91.7561302 274.414918 90.1398837 272.798999 91.7561302 271.183081 93.3723767 272.798999"></polygon>
 95 |                 <polygon id="Fill-138" fill-opacity="0.6" fill="#A3B1BF" transform="translate(93.207724, 276.217777) rotate(22.000000) translate(-93.207724, -276.217777) " points="93.2077244 277.833695 91.5914778 276.217777 93.2077244 274.601858 94.8239709 276.217777"></polygon>
 96 |                 <polygon id="Stroke-140" transform="translate(93.207724, 276.217777) rotate(22.000000) translate(-93.207724, -276.217777) " points="93.2077244 277.833695 91.5914778 276.217777 93.2077244 274.601858 94.8239709 276.217777"></polygon>
 97 |                 <polygon id="Fill-142" fill-opacity="0.6" fill="#A3B1BF" transform="translate(85.696821, 267.300663) rotate(22.000000) translate(-85.696821, -267.300663) " points="85.6968214 268.916582 84.0805749 267.300663 85.6968214 265.684744 87.313068 267.300663"></polygon>
 98 |                 <polygon id="Stroke-144" transform="translate(85.696821, 267.300663) rotate(22.000000) translate(-85.696821, -267.300663) " points="85.6968214 268.916582 84.0805749 267.300663 85.6968214 265.684744 87.313068 267.300663"></polygon>
 99 |                 <polygon id="Fill-146" fill-opacity="0.6" fill="#A3B1BF" transform="translate(87.148416, 270.719440) rotate(22.000000) translate(-87.148416, -270.719440) " points="87.1484156 272.335359 85.5321691 270.71944 87.1484156 269.103521 88.7646621 270.71944"></polygon>
100 |                 <polygon id="Stroke-148" transform="translate(87.148416, 270.719440) rotate(22.000000) translate(-87.148416, -270.719440) " points="87.1484156 272.335359 85.5321691 270.71944 87.1484156 269.103521 88.7646621 270.71944"></polygon>
101 |                 <polygon id="Fill-150" fill-opacity="0.6" fill="#A3B1BF" transform="translate(88.599986, 274.138276) rotate(22.000000) translate(-88.599986, -274.138276) " points="88.599986 275.754195 86.9837394 274.138276 88.599986 272.522358 90.2162325 274.138276"></polygon>
102 |                 <polygon id="Stroke-152" transform="translate(88.599986, 274.138276) rotate(22.000000) translate(-88.599986, -274.138276) " points="88.599986 275.754195 86.9837394 274.138276 88.599986 272.522358 90.2162325 274.138276"></polygon>
103 |                 <polygon id="Fill-154" fill-opacity="0.6" fill="#A3B1BF" transform="translate(90.051639, 277.557078) rotate(22.000000) translate(-90.051639, -277.557078) " points="90.0516391 279.172996 88.4353925 277.557078 90.0516391 275.941159 91.6678856 277.557078"></polygon>
104 |                 <polygon id="Stroke-156" transform="translate(90.051639, 277.557078) rotate(22.000000) translate(-90.051639, -277.557078) " points="90.0516391 279.172996 88.4353925 277.557078 90.0516391 275.941159 91.6678856 277.557078"></polygon>
105 |                 <polygon id="Fill-158" fill-opacity="0.6" fill="#A3B1BF" transform="translate(82.540736, 268.639964) rotate(22.000000) translate(-82.540736, -268.639964) " points="82.5407361 270.255882 80.9244896 268.639964 82.5407361 267.024045 84.1569826 268.639964"></polygon>
106 |                 <polygon id="Stroke-160" transform="translate(82.540736, 268.639964) rotate(22.000000) translate(-82.540736, -268.639964) " points="82.5407361 270.255882 80.9244896 268.639964 82.5407361 267.024045 84.1569826 268.639964"></polygon>
107 |                 <polygon id="Fill-162" fill-opacity="0.6" fill="#A3B1BF" transform="translate(83.992306, 272.058800) rotate(22.000000) translate(-83.992306, -272.058800) " points="83.9923065 273.674719 82.3760599 272.0588 83.9923065 270.442881 85.608553 272.0588"></polygon>
108 |                 <polygon id="Stroke-164" transform="translate(83.992306, 272.058800) rotate(22.000000) translate(-83.992306, -272.058800) " points="83.9923065 273.674719 82.3760599 272.0588 83.9923065 270.442881 85.608553 272.0588"></polygon>
109 |                 <polygon id="Fill-166" fill-opacity="0.6" fill="#A3B1BF" transform="translate(85.443901, 275.477577) rotate(22.000000) translate(-85.443901, -275.477577) " points="85.4439007 277.093496 83.8276541 275.477577 85.4439007 273.861659 87.0601472 275.477577"></polygon>
110 |                 <polygon id="Stroke-168" transform="translate(85.443901, 275.477577) rotate(22.000000) translate(-85.443901, -275.477577) " points="85.4439007 277.093496 83.8276541 275.477577 85.4439007 273.861659 87.0601472 275.477577"></polygon>
111 |                 <polygon id="Fill-170" fill-opacity="0.6" fill="#A3B1BF" transform="translate(86.895554, 278.896378) rotate(22.000000) translate(-86.895554, -278.896378) " points="86.8955537 280.512297 85.2793072 278.896378 86.8955537 277.28046 88.5118003 278.896378"></polygon>
112 |                 <polygon id="Stroke-172" transform="translate(86.895554, 278.896378) rotate(22.000000) translate(-86.895554, -278.896378) " points="86.8955537 280.512297 85.2793072 278.896378 86.8955537 277.28046 88.5118003 278.896378"></polygon>
113 |                 <polygon id="Fill-174" fill-opacity="0.6" fill="#A3B1BF" transform="translate(79.384651, 269.979265) rotate(22.000000) translate(-79.384651, -269.979265) " points="79.3846508 271.595183 77.7684043 269.979265 79.3846508 268.363346 81.0008973 269.979265"></polygon>
114 |                 <polygon id="Stroke-176" transform="translate(79.384651, 269.979265) rotate(22.000000) translate(-79.384651, -269.979265) " points="79.3846508 271.595183 77.7684043 269.979265 79.3846508 268.363346 81.0008973 269.979265"></polygon>
115 |                 <polygon id="Fill-178" fill-opacity="0.6" fill="#A3B1BF" transform="translate(80.836221, 273.398101) rotate(22.000000) translate(-80.836221, -273.398101) " points="80.8362212 275.01402 79.2199746 273.398101 80.8362212 271.782182 82.4524677 273.398101"></polygon>
116 |                 <polygon id="Stroke-180" transform="translate(80.836221, 273.398101) rotate(22.000000) translate(-80.836221, -273.398101) " points="80.8362212 275.01402 79.2199746 273.398101 80.8362212 271.782182 82.4524677 273.398101"></polygon>
117 |                 <polygon id="Fill-182" fill-opacity="0.6" fill="#A3B1BF" transform="translate(82.287815, 276.816878) rotate(22.000000) translate(-82.287815, -276.816878) " points="82.2878153 278.432797 80.6715688 276.816878 82.2878153 275.20096 83.9040619 276.816878"></polygon>
118 |                 <polygon id="Stroke-184" transform="translate(82.287815, 276.816878) rotate(22.000000) translate(-82.287815, -276.816878) " points="82.2878153 278.432797 80.6715688 276.816878 82.2878153 275.20096 83.9040619 276.816878"></polygon>
119 |                 <polygon id="Fill-186" fill-opacity="0.6" fill="#A3B1BF" transform="translate(83.739445, 280.235738) rotate(22.000000) translate(-83.739445, -280.235738) " points="83.7394446 281.851657 82.1231981 280.235738 83.7394446 278.61982 85.3556912 280.235738"></polygon>
120 |                 <polygon id="Stroke-188" transform="translate(83.739445, 280.235738) rotate(22.000000) translate(-83.739445, -280.235738) " points="83.7394446 281.851657 82.1231981 280.235738 83.7394446 278.61982 85.3556912 280.235738"></polygon>
121 |                 <polygon id="Fill-190" fill-opacity="0.6" fill="#A3B1BF" transform="translate(76.228483, 271.318601) rotate(22.000000) translate(-76.228483, -271.318601) " points="76.2284828 272.934519 74.6122362 271.318601 76.2284828 269.702682 77.8447293 271.318601"></polygon>
122 |                 <polygon id="Stroke-192" transform="translate(76.228483, 271.318601) rotate(22.000000) translate(-76.228483, -271.318601) " points="76.2284828 272.934519 74.6122362 271.318601 76.2284828 269.702682 77.8447293 271.318601"></polygon>
123 |                 <polygon id="Fill-194" fill-opacity="0.6" fill="#A3B1BF" transform="translate(77.680136, 274.737402) rotate(22.000000) translate(-77.680136, -274.737402) " points="77.6801358 276.353321 76.0638893 274.737402 77.6801358 273.121483 79.2963824 274.737402"></polygon>
124 |                 <polygon id="Stroke-196" transform="translate(77.680136, 274.737402) rotate(22.000000) translate(-77.680136, -274.737402) " points="77.6801358 276.353321 76.0638893 274.737402 77.6801358 273.121483 79.2963824 274.737402"></polygon>
125 |                 <polygon id="Fill-198" fill-opacity="0.6" fill="#A3B1BF" transform="translate(79.131730, 278.156179) rotate(22.000000) translate(-79.131730, -278.156179) " points="79.13173 279.772098 77.5154835 278.156179 79.13173 276.540261 80.7479765 278.156179"></polygon>
126 |                 <polygon id="Stroke-200" transform="translate(79.131730, 278.156179) rotate(22.000000) translate(-79.131730, -278.156179) " points="79.13173 279.772098 77.5154835 278.156179 79.13173 276.540261 80.7479765 278.156179"></polygon>
127 |                 <polygon id="Fill-202" fill-opacity="0.6" fill="#A3B1BF" transform="translate(80.583359, 281.575039) rotate(22.000000) translate(-80.583359, -281.575039) " points="80.5833593 283.190958 78.9671128 281.575039 80.5833593 279.959121 82.1996058 281.575039"></polygon>
128 |                 <polygon id="Stroke-204" transform="translate(80.583359, 281.575039) rotate(22.000000) translate(-80.583359, -281.575039) " points="80.5833593 283.190958 78.9671128 281.575039 80.5833593 279.959121 82.1996058 281.575039"></polygon>
129 |                 <polygon id="Fill-206" fill-opacity="0.6" fill="#A3B1BF" transform="translate(96.455246, 283.866302) rotate(22.000000) translate(-96.455246, -283.866302) " points="96.4552463 285.48222 94.8389998 283.866302 96.4552463 282.250383 98.0714929 283.866302"></polygon>
130 |                 <polygon id="Stroke-208" transform="translate(96.455246, 283.866302) rotate(22.000000) translate(-96.455246, -283.866302) " points="96.4552463 285.48222 94.8389998 283.866302 96.4552463 282.250383 98.0714929 283.866302"></polygon>
131 |                 <polygon id="Fill-210" fill-opacity="0.6" fill="#A3B1BF" transform="translate(97.906840, 287.285079) rotate(22.000000) translate(-97.906840, -287.285079) " points="97.9068405 288.900998 96.290594 287.285079 97.9068405 285.66916 99.523087 287.285079"></polygon>
132 |                 <polygon id="Stroke-212" transform="translate(97.906840, 287.285079) rotate(22.000000) translate(-97.906840, -287.285079) " points="97.9068405 288.900998 96.290594 287.285079 97.9068405 285.66916 99.523087 287.285079"></polygon>
133 |                 <polygon id="Fill-214" fill-opacity="0.6" fill="#A3B1BF" transform="translate(99.358435, 290.703856) rotate(22.000000) translate(-99.358435, -290.703856) " points="99.3584347 292.319775 97.7421881 290.703856 99.3584347 289.087938 100.974681 290.703856"></polygon>
134 |                 <polygon id="Stroke-216" transform="translate(99.358435, 290.703856) rotate(22.000000) translate(-99.358435, -290.703856) " points="99.3584347 292.319775 97.7421881 290.703856 99.3584347 289.087938 100.974681 290.703856"></polygon>
135 |                 <polygon id="Fill-218" fill-opacity="0.6" fill="#A3B1BF" transform="translate(100.810064, 294.122716) rotate(22.000000) translate(-100.810064, -294.122716) " points="100.810064 295.738635 99.1938174 294.122716 100.810064 292.506798 102.42631 294.122716"></polygon>
136 |                 <polygon id="Stroke-220" transform="translate(100.810064, 294.122716) rotate(22.000000) translate(-100.810064, -294.122716) " points="100.810064 295.738635 99.1938174 294.122716 100.810064 292.506798 102.42631 294.122716"></polygon>
137 |                 <polygon id="Fill-222" fill-opacity="0.6" fill="#A3B1BF" transform="translate(93.299102, 285.205579) rotate(22.000000) translate(-93.299102, -285.205579) " points="93.2991021 286.821497 91.6828556 285.205579 93.2991021 283.58966 94.9153486 285.205579"></polygon>
138 |                 <polygon id="Stroke-224" transform="translate(93.299102, 285.205579) rotate(22.000000) translate(-93.299102, -285.205579) " points="93.2991021 286.821497 91.6828556 285.205579 93.2991021 283.58966 94.9153486 285.205579"></polygon>
139 |                 <polygon id="Fill-226" fill-opacity="0.6" fill="#A3B1BF" transform="translate(94.750755, 288.624380) rotate(22.000000) translate(-94.750755, -288.624380) " points="94.7507552 290.240299 93.1345086 288.62438 94.7507552 287.008461 96.3670017 288.62438"></polygon>
140 |                 <polygon id="Stroke-228" transform="translate(94.750755, 288.624380) rotate(22.000000) translate(-94.750755, -288.624380) " points="94.7507552 290.240299 93.1345086 288.62438 94.7507552 287.008461 96.3670017 288.62438"></polygon>
141 |                 <polygon id="Fill-230" fill-opacity="0.6" fill="#A3B1BF" transform="translate(96.202326, 292.043216) rotate(22.000000) translate(-96.202326, -292.043216) " points="96.2023255 293.659135 94.586079 292.043216 96.2023255 290.427297 97.8185721 292.043216"></polygon>
142 |                 <polygon id="Stroke-232" transform="translate(96.202326, 292.043216) rotate(22.000000) translate(-96.202326, -292.043216) " points="96.2023255 293.659135 94.586079 292.043216 96.2023255 290.427297 97.8185721 292.043216"></polygon>
143 |                 <polygon id="Fill-234" fill-opacity="0.6" fill="#A3B1BF" transform="translate(97.653979, 295.462017) rotate(22.000000) translate(-97.653979, -295.462017) " points="97.6539786 297.077936 96.0377321 295.462017 97.6539786 293.846099 99.2702252 295.462017"></polygon>
144 |                 <polygon id="Stroke-236" transform="translate(97.653979, 295.462017) rotate(22.000000) translate(-97.653979, -295.462017) " points="97.6539786 297.077936 96.0377321 295.462017 97.6539786 293.846099 99.2702252 295.462017"></polygon>
145 |                 <polygon id="Fill-238" fill-opacity="0.6" fill="#A3B1BF" transform="translate(90.143017, 286.544880) rotate(22.000000) translate(-90.143017, -286.544880) " points="90.1430168 288.160798 88.5267702 286.54488 90.1430168 284.928961 91.7592633 286.54488"></polygon>
146 |                 <polygon id="Stroke-240" transform="translate(90.143017, 286.544880) rotate(22.000000) translate(-90.143017, -286.544880) " points="90.1430168 288.160798 88.5267702 286.54488 90.1430168 284.928961 91.7592633 286.54488"></polygon>
147 |                 <polygon id="Fill-242" fill-opacity="0.6" fill="#A3B1BF" transform="translate(91.594670, 289.963681) rotate(22.000000) translate(-91.594670, -289.963681) " points="91.5946698 291.5796 89.9784233 289.963681 91.5946698 288.347762 93.2109164 289.963681"></polygon>
148 |                 <polygon id="Stroke-244" transform="translate(91.594670, 289.963681) rotate(22.000000) translate(-91.594670, -289.963681) " points="91.5946698 291.5796 89.9784233 289.963681 91.5946698 288.347762 93.2109164 289.963681"></polygon>
149 |                 <polygon id="Fill-246" fill-opacity="0.6" fill="#A3B1BF" transform="translate(93.046240, 293.382517) rotate(22.000000) translate(-93.046240, -293.382517) " points="93.0462402 294.998436 91.4299937 293.382517 93.0462402 291.766598 94.6624868 293.382517"></polygon>
150 |                 <polygon id="Stroke-248" transform="translate(93.046240, 293.382517) rotate(22.000000) translate(-93.046240, -293.382517) " points="93.0462402 294.998436 91.4299937 293.382517 93.0462402 291.766598 94.6624868 293.382517"></polygon>
151 |                 <polygon id="Fill-250" fill-opacity="0.6" fill="#A3B1BF" transform="translate(94.497893, 296.801318) rotate(22.000000) translate(-94.497893, -296.801318) " points="94.4978933 298.417237 92.8816468 296.801318 94.4978933 295.1854 96.1141398 296.801318"></polygon>
152 |                 <polygon id="Stroke-252" transform="translate(94.497893, 296.801318) rotate(22.000000) translate(-94.497893, -296.801318) " points="94.4978933 298.417237 92.8816468 296.801318 94.4978933 295.1854 96.1141398 296.801318"></polygon>
153 |                 <polygon id="Fill-254" fill-opacity="0.6" fill="#A3B1BF" transform="translate(86.986931, 287.884181) rotate(22.000000) translate(-86.986931, -287.884181) " points="86.9869315 289.500099 85.3706849 287.884181 86.9869315 286.268262 88.603178 287.884181"></polygon>
154 |                 <polygon id="Stroke-256" transform="translate(86.986931, 287.884181) rotate(22.000000) translate(-86.986931, -287.884181) " points="86.9869315 289.500099 85.3706849 287.884181 86.9869315 286.268262 88.603178 287.884181"></polygon>
155 |                 <polygon id="Fill-258" fill-opacity="0.6" fill="#A3B1BF" transform="translate(88.438585, 291.302982) rotate(22.000000) translate(-88.438585, -291.302982) " points="88.4385845 292.9189 86.822338 291.302982 88.4385845 289.687063 90.0548311 291.302982"></polygon>
156 |                 <polygon id="Stroke-260" transform="translate(88.438585, 291.302982) rotate(22.000000) translate(-88.438585, -291.302982) " points="88.4385845 292.9189 86.822338 291.302982 88.4385845 289.687063 90.0548311 291.302982"></polygon>
157 |                 <polygon id="Fill-262" fill-opacity="0.6" fill="#A3B1BF" transform="translate(89.890155, 294.721818) rotate(22.000000) translate(-89.890155, -294.721818) " points="89.8901549 296.337737 88.2739084 294.721818 89.8901549 293.105899 91.5064014 294.721818"></polygon>
158 |                 <polygon id="Stroke-264" transform="translate(89.890155, 294.721818) rotate(22.000000) translate(-89.890155, -294.721818) " points="89.8901549 296.337737 88.2739084 294.721818 89.8901549 293.105899 91.5064014 294.721818"></polygon>
159 |                 <polygon id="Fill-266" fill-opacity="0.6" fill="#A3B1BF" transform="translate(91.341749, 298.140595) rotate(22.000000) translate(-91.341749, -298.140595) " points="91.3417491 299.756514 89.7255025 298.140595 91.3417491 296.524677 92.9579956 298.140595"></polygon>
160 |                 <polygon id="Stroke-268" transform="translate(91.341749, 298.140595) rotate(22.000000) translate(-91.341749, -298.140595) " points="91.3417491 299.756514 89.7255025 298.140595 91.3417491 296.524677 92.9579956 298.140595"></polygon>
161 |                 <polygon id="Fill-270" fill-opacity="0.6" fill="#A3B1BF" transform="translate(83.830846, 289.223482) rotate(22.000000) translate(-83.830846, -289.223482) " points="83.8308461 290.8394 82.2145996 289.223482 83.8308461 287.607563 85.4470927 289.223482"></polygon>
162 |                 <polygon id="Stroke-272" transform="translate(83.830846, 289.223482) rotate(22.000000) translate(-83.830846, -289.223482) " points="82.2145996 289.223482 83.8308461 287.607563 85.4470927 289.223482 83.8308461 290.8394"></polygon>
163 |                 <polygon id="Fill-274" fill-opacity="0.6" fill="#A3B1BF" transform="translate(85.282417, 292.642318) rotate(22.000000) translate(-85.282417, -292.642318) " points="85.2824165 294.258236 83.66617 292.642318 85.2824165 291.026399 86.898663 292.642318"></polygon>
164 |                 <polygon id="Stroke-276" transform="translate(85.282417, 292.642318) rotate(22.000000) translate(-85.282417, -292.642318) " points="85.2824165 294.258236 83.66617 292.642318 85.2824165 291.026399 86.898663 292.642318"></polygon>
165 |                 <polygon id="Fill-278" fill-opacity="0.6" fill="#A3B1BF" transform="translate(86.734070, 296.061119) rotate(22.000000) translate(-86.734070, -296.061119) " points="86.7340696 297.677038 85.1178231 296.061119 86.7340696 294.4452 88.3503161 296.061119"></polygon>
166 |                 <polygon id="Stroke-280" transform="translate(86.734070, 296.061119) rotate(22.000000) translate(-86.734070, -296.061119) " points="86.7340696 297.677038 85.1178231 296.061119 86.7340696 294.4452 88.3503161 296.061119"></polygon>
167 |                 <polygon id="Fill-282" fill-opacity="0.6" fill="#A3B1BF" transform="translate(88.185664, 299.479896) rotate(22.000000) translate(-88.185664, -299.479896) " points="88.1856638 301.095815 86.5694172 299.479896 88.1856638 297.863978 89.8019103 299.479896"></polygon>
168 |                 <polygon id="Stroke-284" transform="translate(88.185664, 299.479896) rotate(22.000000) translate(-88.185664, -299.479896) " points="88.1856638 301.095815 86.5694172 299.479896 88.1856638 297.863978 89.8019103 299.479896"></polygon>
169 |                 <polygon id="Fill-286" transform="translate(37.779995, 163.402514) rotate(22.000000) translate(-37.779995, -163.402514) " points="51.9961666 192.018058 66.401345 177.615802 23.5644587 134.78697 9.15864501 149.189862"></polygon>
170 |                 <polygon id="Fill-290" transform="translate(50.400318, 195.682118) rotate(22.000000) translate(-50.400318, -195.682118) " points="54.1737837 198.070743 48.0112085 191.909418 46.6268527 193.293493 52.7894279 199.454818"></polygon>
171 |                 <polygon id="Stroke-292" stroke="#A3B1BF" stroke-width="1.62" stroke-linejoin="round" transform="translate(50.400318, 195.682118) rotate(22.000000) translate(-50.400318, -195.682118) " points="54.1737837 198.070743 48.0112085 191.909418 46.6268527 193.293493 52.7894279 199.454818"></polygon>
172 |                 <polygon id="Fill-294" fill-opacity="0.8" fill="#A3B1BF" transform="translate(52.603532, 200.871447) rotate(22.000000) translate(-52.603532, -200.871447) " points="52.712807 203.746308 55.4789773 200.980699 52.4942579 197.996585 49.7280876 200.762195"></polygon>
173 |                 <polygon id="Stroke-296" stroke="#A3B1BF" stroke-width="1.62" fill="#FFFFFF" stroke-linejoin="round" transform="translate(52.603532, 200.871447) rotate(22.000000) translate(-52.603532, -200.871447) " points="52.712807 203.746308 55.4789773 200.980699 52.4942579 197.996585 49.7280876 200.762195"></polygon>
174 |                 <polygon id="Fill-298" fill-opacity="0.8" fill="#A3B1BF" transform="translate(53.983257, 183.836778) rotate(22.000000) translate(-53.983257, -183.836778) " points="52.3670108 183.836778 53.9832574 185.452697 55.5995039 183.836778 53.9832574 182.22086"></polygon>
175 |                 <polygon id="Stroke-300" transform="translate(53.983257, 183.836778) rotate(22.000000) translate(-53.983257, -183.836778) " points="52.3670108 183.836778 53.9832574 185.452697 55.5995039 183.836778 53.9832574 182.22086"></polygon>
176 |                 <polygon id="Fill-302" fill-opacity="0.8" fill="#A3B1BF" transform="translate(52.531663, 180.418001) rotate(22.000000) translate(-52.531663, -180.418001) " points="50.9154167 180.418001 52.5316632 182.03392 54.1479097 180.418001 52.5316632 178.802082"></polygon>
177 |                 <polygon id="Stroke-304" transform="translate(52.531663, 180.418001) rotate(22.000000) translate(-52.531663, -180.418001) " points="50.9154167 180.418001 52.5316632 182.03392 54.1479097 180.418001 52.5316632 178.802082"></polygon>
178 |                 <polygon id="Fill-306" fill-opacity="0.8" fill="#A3B1BF" transform="translate(51.080034, 176.999141) rotate(22.000000) translate(-51.080034, -176.999141) " points="49.4637874 176.999141 51.0800339 178.61506 52.6962805 176.999141 51.0800339 175.383222"></polygon>
179 |                 <polygon id="Stroke-308" transform="translate(51.080034, 176.999141) rotate(22.000000) translate(-51.080034, -176.999141) " points="49.4637874 176.999141 51.0800339 178.61506 52.6962805 176.999141 51.0800339 175.383222"></polygon>
180 |                 <polygon id="Fill-310" fill-opacity="0.8" fill="#A3B1BF" transform="translate(49.628440, 173.580364) rotate(22.000000) translate(-49.628440, -173.580364) " points="48.0121932 173.580364 49.6284397 175.196282 51.2446863 173.580364 49.6284397 171.964445"></polygon>
181 |                 <polygon id="Stroke-312" transform="translate(49.628440, 173.580364) rotate(22.000000) translate(-49.628440, -173.580364) " points="48.0121932 173.580364 49.6284397 175.196282 51.2446863 173.580364 49.6284397 171.964445"></polygon>
182 |                 <polygon id="Fill-314" fill-opacity="0.8" fill="#A3B1BF" transform="translate(50.827172, 185.176079) rotate(22.000000) translate(-50.827172, -185.176079) " points="49.2109255 185.176079 50.8271721 186.791998 52.4434186 185.176079 50.8271721 183.560161"></polygon>
183 |                 <polygon id="Stroke-316" transform="translate(50.827172, 185.176079) rotate(22.000000) translate(-50.827172, -185.176079) " points="49.2109255 185.176079 50.8271721 186.791998 52.4434186 185.176079 50.8271721 183.560161"></polygon>
184 |                 <polygon id="Fill-318" fill-opacity="0.8" fill="#A3B1BF" transform="translate(49.375578, 181.757302) rotate(22.000000) translate(-49.375578, -181.757302) " points="47.7593313 181.757302 49.3755779 183.373221 50.9918244 181.757302 49.3755779 180.141383"></polygon>
185 |                 <polygon id="Stroke-320" transform="translate(49.375578, 181.757302) rotate(22.000000) translate(-49.375578, -181.757302) " points="47.7593313 181.757302 49.3755779 183.373221 50.9918244 181.757302 49.3755779 180.141383"></polygon>
186 |                 <polygon id="Fill-322" fill-opacity="0.8" fill="#A3B1BF" transform="translate(47.923949, 178.338442) rotate(22.000000) translate(-47.923949, -178.338442) " points="46.3077021 178.338442 47.9239486 179.954361 49.5401951 178.338442 47.9239486 176.722523"></polygon>
187 |                 <polygon id="Stroke-324" transform="translate(47.923949, 178.338442) rotate(22.000000) translate(-47.923949, -178.338442) " points="46.3077021 178.338442 47.9239486 179.954361 49.5401951 178.338442 47.9239486 176.722523"></polygon>
188 |                 <polygon id="Fill-326" fill-opacity="0.8" fill="#A3B1BF" transform="translate(46.472354, 174.919665) rotate(22.000000) translate(-46.472354, -174.919665) " points="44.8561079 174.919665 46.4723544 176.535583 48.088601 174.919665 46.4723544 173.303746"></polygon>
189 |                 <polygon id="Stroke-328" transform="translate(46.472354, 174.919665) rotate(22.000000) translate(-46.472354, -174.919665) " points="44.8561079 174.919665 46.4723544 176.535583 48.088601 174.919665 46.4723544 173.303746"></polygon>
190 |                 <polygon id="Fill-330" fill-opacity="0.8" fill="#A3B1BF" transform="translate(47.671087, 186.515380) rotate(22.000000) translate(-47.671087, -186.515380) " points="46.0548402 186.51538 47.6710867 188.131299 49.2873333 186.51538 47.6710867 184.899461"></polygon>
191 |                 <polygon id="Stroke-332" transform="translate(47.671087, 186.515380) rotate(22.000000) translate(-47.671087, -186.515380) " points="46.0548402 186.51538 47.6710867 188.131299 49.2873333 186.51538 47.6710867 184.899461"></polygon>
192 |                 <polygon id="Fill-334" fill-opacity="0.8" fill="#A3B1BF" transform="translate(46.219493, 183.096603) rotate(22.000000) translate(-46.219493, -183.096603) " points="44.603246 183.096603 46.2194926 184.712521 47.8357391 183.096603 46.2194926 181.480684"></polygon>
193 |                 <polygon id="Stroke-336" transform="translate(46.219493, 183.096603) rotate(22.000000) translate(-46.219493, -183.096603) " points="44.603246 183.096603 46.2194926 184.712521 47.8357391 183.096603 46.2194926 181.480684"></polygon>
194 |                 <polygon id="Fill-338" fill-opacity="0.8" fill="#A3B1BF" transform="translate(44.767839, 179.677802) rotate(22.000000) translate(-44.767839, -179.677802) " points="43.1515929 179.677802 44.7678395 181.29372 46.384086 179.677802 44.7678395 178.061883"></polygon>
195 |                 <polygon id="Stroke-340" transform="translate(44.767839, 179.677802) rotate(22.000000) translate(-44.767839, -179.677802) " points="43.1515929 179.677802 44.7678395 181.29372 46.384086 179.677802 44.7678395 178.061883"></polygon>
196 |                 <polygon id="Fill-342" fill-opacity="0.8" fill="#A3B1BF" transform="translate(43.316269, 176.258965) rotate(22.000000) translate(-43.316269, -176.258965) " points="41.7000226 176.258965 43.3162691 177.874884 44.9325156 176.258965 43.3162691 174.643047"></polygon>
197 |                 <polygon id="Stroke-344" transform="translate(43.316269, 176.258965) rotate(22.000000) translate(-43.316269, -176.258965) " points="41.7000226 176.258965 43.3162691 177.874884 44.9325156 176.258965 43.3162691 174.643047"></polygon>
198 |                 <polygon id="Fill-346" fill-opacity="0.8" fill="#A3B1BF" transform="translate(44.514978, 187.854740) rotate(22.000000) translate(-44.514978, -187.854740) " points="42.8987311 187.85474 44.5149776 189.470659 46.1312242 187.85474 44.5149776 186.238821"></polygon>
199 |                 <polygon id="Stroke-348" transform="translate(44.514978, 187.854740) rotate(22.000000) translate(-44.514978, -187.854740) " points="42.8987311 187.85474 44.5149776 189.470659 46.1312242 187.85474 44.5149776 186.238821"></polygon>
200 |                 <polygon id="Fill-350" fill-opacity="0.8" fill="#A3B1BF" transform="translate(43.063348, 184.435880) rotate(22.000000) translate(-43.063348, -184.435880) " points="41.4471018 184.43588 43.0633483 186.051799 44.6795949 184.43588 43.0633483 182.819961"></polygon>
201 |                 <polygon id="Stroke-352" transform="translate(43.063348, 184.435880) rotate(22.000000) translate(-43.063348, -184.435880) " points="41.4471018 184.43588 43.0633483 186.051799 44.6795949 184.43588 43.0633483 182.819961"></polygon>
202 |                 <polygon id="Fill-354" fill-opacity="0.8" fill="#A3B1BF" transform="translate(41.611754, 181.017103) rotate(22.000000) translate(-41.611754, -181.017103) " points="39.9955076 181.017103 41.6117542 182.633021 43.2280007 181.017103 41.6117542 179.401184"></polygon>
203 |                 <polygon id="Stroke-356" transform="translate(41.611754, 181.017103) rotate(22.000000) translate(-41.611754, -181.017103) " points="39.9955076 181.017103 41.6117542 182.633021 43.2280007 181.017103 41.6117542 179.401184"></polygon>
204 |                 <polygon id="Fill-358" fill-opacity="0.8" fill="#A3B1BF" transform="translate(40.160184, 177.598266) rotate(22.000000) translate(-40.160184, -177.598266) " points="38.5439373 177.598266 40.1601838 179.214185 41.7764303 177.598266 40.1601838 175.982348"></polygon>
205 |                 <polygon id="Stroke-360" transform="translate(40.160184, 177.598266) rotate(22.000000) translate(-40.160184, -177.598266) " points="38.5439373 177.598266 40.1601838 179.214185 41.7764303 177.598266 40.1601838 175.982348"></polygon>
206 |                 <polygon id="Fill-362" fill-opacity="0.8" fill="#A3B1BF" transform="translate(41.358892, 189.194041) rotate(22.000000) translate(-41.358892, -189.194041) " points="39.7426458 189.194041 41.3588923 190.80996 42.9751388 189.194041 41.3588923 187.578122"></polygon>
207 |                 <polygon id="Stroke-364" transform="translate(41.358892, 189.194041) rotate(22.000000) translate(-41.358892, -189.194041) " points="39.7426458 189.194041 41.3588923 190.80996 42.9751388 189.194041 41.3588923 187.578122"></polygon>
208 |                 <polygon id="Fill-366" fill-opacity="0.8" fill="#A3B1BF" transform="translate(39.907263, 185.775181) rotate(22.000000) translate(-39.907263, -185.775181) " points="38.2910165 185.775181 39.907263 187.3911 41.5235095 185.775181 39.907263 184.159262"></polygon>
209 |                 <polygon id="Stroke-368" transform="translate(39.907263, 185.775181) rotate(22.000000) translate(-39.907263, -185.775181) " points="38.2910165 185.775181 39.907263 187.3911 41.5235095 185.775181 39.907263 184.159262"></polygon>
210 |                 <polygon id="Fill-370" fill-opacity="0.8" fill="#A3B1BF" transform="translate(38.455669, 182.356404) rotate(22.000000) translate(-38.455669, -182.356404) " points="36.8394223 182.356404 38.4556688 183.972322 40.0719154 182.356404 38.4556688 180.740485"></polygon>
211 |                 <polygon id="Stroke-372" transform="translate(38.455669, 182.356404) rotate(22.000000) translate(-38.455669, -182.356404) " points="36.8394223 182.356404 38.4556688 183.972322 40.0719154 182.356404 38.4556688 180.740485"></polygon>
212 |                 <polygon id="Fill-374" fill-opacity="0.8" fill="#A3B1BF" transform="translate(37.004016, 178.937602) rotate(22.000000) translate(-37.004016, -178.937602) " points="35.3877692 178.937602 37.0040158 180.553521 38.6202623 178.937602 37.0040158 177.321684"></polygon>
213 |                 <polygon id="Stroke-376" transform="translate(37.004016, 178.937602) rotate(22.000000) translate(-37.004016, -178.937602) " points="35.3877692 178.937602 37.0040158 180.553521 38.6202623 178.937602 37.0040158 177.321684"></polygon>
214 |                 <polygon id="Fill-378" fill-opacity="0.8" fill="#A3B1BF" transform="translate(46.380894, 165.931897) rotate(22.000000) translate(-46.380894, -165.931897) " points="44.7646475 165.931897 46.380894 167.547816 47.9971405 165.931897 46.380894 164.315979"></polygon>
215 |                 <polygon id="Stroke-380" transform="translate(46.380894, 165.931897) rotate(22.000000) translate(-46.380894, -165.931897) " points="44.7646475 165.931897 46.380894 167.547816 47.9971405 165.931897 46.380894 164.315979"></polygon>
216 |                 <polygon id="Fill-382" fill-opacity="0.8" fill="#A3B1BF" transform="translate(44.929324, 162.513061) rotate(22.000000) translate(-44.929324, -162.513061) " points="43.3130771 162.513061 44.9293236 164.12898 46.5455702 162.513061 44.9293236 160.897143"></polygon>
217 |                 <polygon id="Stroke-384" transform="translate(44.929324, 162.513061) rotate(22.000000) translate(-44.929324, -162.513061) " points="43.3130771 162.513061 44.9293236 164.12898 46.5455702 162.513061 44.9293236 160.897143"></polygon>
218 |                 <polygon id="Fill-386" fill-opacity="0.8" fill="#A3B1BF" transform="translate(43.477729, 159.094284) rotate(22.000000) translate(-43.477729, -159.094284) " points="41.8614829 159.094284 43.4777295 160.710203 45.093976 159.094284 43.4777295 157.478365"></polygon>
219 |                 <polygon id="Stroke-388" transform="translate(43.477729, 159.094284) rotate(22.000000) translate(-43.477729, -159.094284) " points="41.8614829 159.094284 43.4777295 160.710203 45.093976 159.094284 43.4777295 157.478365"></polygon>
220 |                 <polygon id="Fill-390" fill-opacity="0.8" fill="#A3B1BF" transform="translate(42.026100, 155.675424) rotate(22.000000) translate(-42.026100, -155.675424) " points="40.4098536 155.675424 42.0261002 157.291342 43.6423467 155.675424 42.0261002 154.059505"></polygon>
221 |                 <polygon id="Stroke-392" transform="translate(42.026100, 155.675424) rotate(22.000000) translate(-42.026100, -155.675424) " points="40.4098536 155.675424 42.0261002 157.291342 43.6423467 155.675424 42.0261002 154.059505"></polygon>
222 |                 <polygon id="Fill-394" fill-opacity="0.8" fill="#A3B1BF" transform="translate(43.224809, 167.271198) rotate(22.000000) translate(-43.224809, -167.271198) " points="41.6085622 167.271198 43.2248087 168.887117 44.8410552 167.271198 43.2248087 165.65528"></polygon>
223 |                 <polygon id="Stroke-396" transform="translate(43.224809, 167.271198) rotate(22.000000) translate(-43.224809, -167.271198) " points="41.6085622 167.271198 43.2248087 168.887117 44.8410552 167.271198 43.2248087 165.65528"></polygon>
224 |                 <polygon id="Fill-398" fill-opacity="0.8" fill="#A3B1BF" transform="translate(41.773238, 163.852362) rotate(22.000000) translate(-41.773238, -163.852362) " points="40.1569918 163.852362 41.7732383 165.468281 43.3894848 163.852362 41.7732383 162.236443"></polygon>
225 |                 <polygon id="Stroke-400" transform="translate(41.773238, 163.852362) rotate(22.000000) translate(-41.773238, -163.852362) " points="40.1569918 163.852362 41.7732383 165.468281 43.3894848 163.852362 41.7732383 162.236443"></polygon>
226 |                 <polygon id="Fill-402" fill-opacity="0.8" fill="#A3B1BF" transform="translate(40.321585, 160.433561) rotate(22.000000) translate(-40.321585, -160.433561) " points="38.7053387 160.433561 40.3215852 162.04948 41.9378318 160.433561 40.3215852 158.817642"></polygon>
227 |                 <polygon id="Stroke-404" transform="translate(40.321585, 160.433561) rotate(22.000000) translate(-40.321585, -160.433561) " points="38.7053387 160.433561 40.3215852 162.04948 41.9378318 160.433561 40.3215852 158.817642"></polygon>
228 |                 <polygon id="Fill-406" fill-opacity="0.8" fill="#A3B1BF" transform="translate(38.869991, 157.014784) rotate(22.000000) translate(-38.869991, -157.014784) " points="37.2537445 157.014784 38.8699911 158.630702 40.4862376 157.014784 38.8699911 155.398865"></polygon>
229 |                 <polygon id="Stroke-408" transform="translate(38.869991, 157.014784) rotate(22.000000) translate(-38.869991, -157.014784) " points="37.2537445 157.014784 38.8699911 158.630702 40.4862376 157.014784 38.8699911 155.398865"></polygon>
230 |                 <polygon id="Fill-410" fill-opacity="0.8" fill="#A3B1BF" transform="translate(40.068723, 168.610499) rotate(22.000000) translate(-40.068723, -168.610499) " points="38.4524768 168.610499 40.0687234 170.226418 41.6849699 168.610499 40.0687234 166.994581"></polygon>
231 |                 <polygon id="Stroke-412" transform="translate(40.068723, 168.610499) rotate(22.000000) translate(-40.068723, -168.610499) " points="38.4524768 168.610499 40.0687234 170.226418 41.6849699 168.610499 40.0687234 166.994581"></polygon>
232 |                 <polygon id="Fill-414" fill-opacity="0.8" fill="#A3B1BF" transform="translate(38.617129, 165.191722) rotate(22.000000) translate(-38.617129, -165.191722) " points="37.0008827 165.191722 38.6171292 166.807641 40.2333757 165.191722 38.6171292 163.575803"></polygon>
233 |                 <polygon id="Stroke-416" transform="translate(38.617129, 165.191722) rotate(22.000000) translate(-38.617129, -165.191722) " points="37.0008827 165.191722 38.6171292 166.807641 40.2333757 165.191722 38.6171292 163.575803"></polygon>
234 |                 <polygon id="Fill-418" fill-opacity="0.8" fill="#A3B1BF" transform="translate(37.165500, 161.772862) rotate(22.000000) translate(-37.165500, -161.772862) " points="35.5492534 161.772862 37.1654999 163.388781 38.7817464 161.772862 37.1654999 160.156943"></polygon>
235 |                 <polygon id="Stroke-420" transform="translate(37.165500, 161.772862) rotate(22.000000) translate(-37.165500, -161.772862) " points="35.5492534 161.772862 37.1654999 163.388781 38.7817464 161.772862 37.1654999 160.156943"></polygon>
236 |                 <polygon id="Fill-422" fill-opacity="0.8" fill="#A3B1BF" transform="translate(35.713906, 158.354085) rotate(22.000000) translate(-35.713906, -158.354085) " points="34.0976592 158.354085 35.7139057 159.970003 37.3301523 158.354085 35.7139057 156.738166"></polygon>
237 |                 <polygon id="Stroke-424" transform="translate(35.713906, 158.354085) rotate(22.000000) translate(-35.713906, -158.354085) " points="34.0976592 158.354085 35.7139057 159.970003 37.3301523 158.354085 35.7139057 156.738166"></polygon>
238 |                 <polygon id="Fill-426" fill-opacity="0.8" fill="#A3B1BF" transform="translate(36.912638, 169.949800) rotate(22.000000) translate(-36.912638, -169.949800) " points="35.2963915 169.9498 36.912638 171.565719 38.5288846 169.9498 36.912638 168.333882"></polygon>
239 |                 <polygon id="Stroke-428" transform="translate(36.912638, 169.949800) rotate(22.000000) translate(-36.912638, -169.949800) " points="35.2963915 169.9498 36.912638 171.565719 38.5288846 169.9498 36.912638 168.333882"></polygon>
240 |                 <polygon id="Fill-430" fill-opacity="0.8" fill="#A3B1BF" transform="translate(35.461068, 166.530964) rotate(22.000000) translate(-35.461068, -166.530964) " points="33.8448211 166.530964 35.4610677 168.146883 37.0773142 166.530964 35.4610677 164.915045"></polygon>
241 |                 <polygon id="Stroke-432" transform="translate(35.461068, 166.530964) rotate(22.000000) translate(-35.461068, -166.530964) " points="33.8448211 166.530964 35.4610677 168.146883 37.0773142 166.530964 35.4610677 164.915045"></polygon>
242 |                 <polygon id="Fill-434" fill-opacity="0.8" fill="#A3B1BF" transform="translate(34.009415, 163.112163) rotate(22.000000) translate(-34.009415, -163.112163) " points="32.3931681 163.112163 34.0094146 164.728081 35.6256611 163.112163 34.0094146 161.496244"></polygon>
243 |                 <polygon id="Stroke-436" transform="translate(34.009415, 163.112163) rotate(22.000000) translate(-34.009415, -163.112163) " points="32.3931681 163.112163 34.0094146 164.728081 35.6256611 163.112163 34.0094146 161.496244"></polygon>
244 |                 <polygon id="Fill-438" fill-opacity="0.8" fill="#A3B1BF" transform="translate(32.557820, 159.693385) rotate(22.000000) translate(-32.557820, -159.693385) " points="30.9415739 159.693385 32.5578204 161.309304 34.174067 159.693385 32.5578204 158.077467"></polygon>
245 |                 <polygon id="Stroke-440" transform="translate(32.557820, 159.693385) rotate(22.000000) translate(-32.557820, -159.693385) " points="30.9415739 159.693385 32.5578204 161.309304 34.174067 159.693385 32.5578204 158.077467"></polygon>
246 |                 <polygon id="Fill-442" fill-opacity="0.8" fill="#A3B1BF" transform="translate(33.756553, 171.289101) rotate(22.000000) translate(-33.756553, -171.289101) " points="32.1403062 171.289101 33.7565527 172.90502 35.3727993 171.289101 33.7565527 169.673182"></polygon>
247 |                 <polygon id="Stroke-444" transform="translate(33.756553, 171.289101) rotate(22.000000) translate(-33.756553, -171.289101) " points="32.1403062 171.289101 33.7565527 172.90502 35.3727993 171.289101 33.7565527 169.673182"></polygon>
248 |                 <polygon id="Fill-446" fill-opacity="0.8" fill="#A3B1BF" transform="translate(32.304959, 167.870324) rotate(22.000000) translate(-32.304959, -167.870324) " points="30.688712 167.870324 32.3049586 169.486242 33.9212051 167.870324 32.3049586 166.254405"></polygon>
249 |                 <polygon id="Stroke-448" transform="translate(32.304959, 167.870324) rotate(22.000000) translate(-32.304959, -167.870324) " points="30.688712 167.870324 32.3049586 169.486242 33.9212051 167.870324 32.3049586 166.254405"></polygon>
250 |                 <polygon id="Fill-450" fill-opacity="0.8" fill="#A3B1BF" transform="translate(30.853329, 164.451464) rotate(22.000000) translate(-30.853329, -164.451464) " points="29.2370827 164.451464 30.8533293 166.067382 32.4695758 164.451464 30.8533293 162.835545"></polygon>
251 |                 <polygon id="Stroke-452" transform="translate(30.853329, 164.451464) rotate(22.000000) translate(-30.853329, -164.451464) " points="29.2370827 164.451464 30.8533293 166.067382 32.4695758 164.451464 30.8533293 162.835545"></polygon>
252 |                 <polygon id="Fill-454" fill-opacity="0.8" fill="#A3B1BF" transform="translate(29.401735, 161.032686) rotate(22.000000) translate(-29.401735, -161.032686) " points="27.7854886 161.032686 29.4017351 162.648605 31.0179816 161.032686 29.4017351 159.416768"></polygon>
253 |                 <polygon id="Stroke-456" transform="translate(29.401735, 161.032686) rotate(22.000000) translate(-29.401735, -161.032686) " points="27.7854886 161.032686 29.4017351 162.648605 31.0179816 161.032686 29.4017351 159.416768"></polygon>
254 |                 <polygon id="Fill-458" fill-opacity="0.8" fill="#A3B1BF" transform="translate(38.778613, 148.026981) rotate(22.000000) translate(-38.778613, -148.026981) " points="37.1623668 148.026981 38.7786133 149.6429 40.3948599 148.026981 38.7786133 146.411063"></polygon>
255 |                 <polygon id="Stroke-460" transform="translate(38.778613, 148.026981) rotate(22.000000) translate(-38.778613, -148.026981) " points="37.1623668 148.026981 38.7786133 149.6429 40.3948599 148.026981 38.7786133 146.411063"></polygon>
256 |                 <polygon id="Fill-462" fill-opacity="0.8" fill="#A3B1BF" transform="translate(37.326984, 144.608121) rotate(22.000000) translate(-37.326984, -144.608121) " points="35.7107375 144.608121 37.3269841 146.22404 38.9432306 144.608121 37.3269841 142.992203"></polygon>
257 |                 <polygon id="Stroke-464" transform="translate(37.326984, 144.608121) rotate(22.000000) translate(-37.326984, -144.608121) " points="35.7107375 144.608121 37.3269841 146.22404 38.9432306 144.608121 37.3269841 142.992203"></polygon>
258 |                 <polygon id="Fill-466" fill-opacity="0.8" fill="#A3B1BF" transform="translate(35.875390, 141.189344) rotate(22.000000) translate(-35.875390, -141.189344) " points="34.2591433 141.189344 35.8753899 142.805263 37.4916364 141.189344 35.8753899 139.573425"></polygon>
259 |                 <polygon id="Stroke-468" transform="translate(35.875390, 141.189344) rotate(22.000000) translate(-35.875390, -141.189344) " points="34.2591433 141.189344 35.8753899 142.805263 37.4916364 141.189344 35.8753899 139.573425"></polygon>
260 |                 <polygon id="Fill-470" fill-opacity="0.8" fill="#A3B1BF" transform="translate(34.423796, 137.770567) rotate(22.000000) translate(-34.423796, -137.770567) " points="32.8075492 137.770567 34.4237957 139.386485 36.0400422 137.770567 34.4237957 136.154648"></polygon>
261 |                 <polygon id="Stroke-472" fill="#B2BECA" transform="translate(34.423796, 137.770567) rotate(22.000000) translate(-34.423796, -137.770567) " points="34.4237957 139.386485 36.0400422 137.770567 34.4237957 136.154648 32.8075492 137.770567"></polygon>
262 |                 <polygon id="Fill-474" fill-opacity="0.8" fill="#A3B1BF" transform="translate(35.622528, 149.366282) rotate(22.000000) translate(-35.622528, -149.366282) " points="34.0062815 149.366282 35.622528 150.982201 37.2387746 149.366282 35.622528 147.750364"></polygon>
263 |                 <polygon id="Stroke-476" transform="translate(35.622528, 149.366282) rotate(22.000000) translate(-35.622528, -149.366282) " points="34.0062815 149.366282 35.622528 150.982201 37.2387746 149.366282 35.622528 147.750364"></polygon>
264 |                 <polygon id="Fill-478" fill-opacity="0.8" fill="#A3B1BF" transform="translate(34.170875, 145.947481) rotate(22.000000) translate(-34.170875, -145.947481) " points="32.5546284 145.947481 34.1708749 147.5634 35.7871215 145.947481 34.1708749 144.331563"></polygon>
265 |                 <polygon id="Stroke-480" transform="translate(34.170875, 145.947481) rotate(22.000000) translate(-34.170875, -145.947481) " points="32.5546284 145.947481 34.1708749 147.5634 35.7871215 145.947481 34.1708749 144.331563"></polygon>
266 |                 <polygon id="Fill-482" fill-opacity="0.8" fill="#A3B1BF" transform="translate(32.719305, 142.528645) rotate(22.000000) translate(-32.719305, -142.528645) " points="31.103058 142.528645 32.7193046 144.144564 34.3355511 142.528645 32.7193046 140.912726"></polygon>
267 |                 <polygon id="Stroke-484" transform="translate(32.719305, 142.528645) rotate(22.000000) translate(-32.719305, -142.528645) " points="31.103058 142.528645 32.7193046 144.144564 34.3355511 142.528645 32.7193046 140.912726"></polygon>
268 |                 <polygon id="Fill-486" fill-opacity="0.8" fill="#A3B1BF" transform="translate(31.267651, 139.109844) rotate(22.000000) translate(-31.267651, -139.109844) " points="29.651405 139.109844 31.2676515 140.725763 32.883898 139.109844 31.2676515 137.493925"></polygon>
269 |                 <polygon id="Stroke-488" transform="translate(31.267651, 139.109844) rotate(22.000000) translate(-31.267651, -139.109844) " points="29.651405 139.109844 31.2676515 140.725763 32.883898 139.109844 31.2676515 137.493925"></polygon>
270 |                 <polygon id="Fill-490" fill-opacity="0.8" fill="#A3B1BF" transform="translate(32.466384, 150.705559) rotate(22.000000) translate(-32.466384, -150.705559) " points="30.8501373 150.705559 32.4663838 152.321478 34.0826303 150.705559 32.4663838 149.089641"></polygon>
271 |                 <polygon id="Stroke-492" transform="translate(32.466384, 150.705559) rotate(22.000000) translate(-32.466384, -150.705559) " points="30.8501373 150.705559 32.4663838 152.321478 34.0826303 150.705559 32.4663838 149.089641"></polygon>
272 |                 <polygon id="Fill-494" fill-opacity="0.8" fill="#A3B1BF" transform="translate(31.014790, 147.286782) rotate(22.000000) translate(-31.014790, -147.286782) " points="29.3985431 147.286782 31.0147896 148.902701 32.6310362 147.286782 31.0147896 145.670863"></polygon>
273 |                 <polygon id="Stroke-496" transform="translate(31.014790, 147.286782) rotate(22.000000) translate(-31.014790, -147.286782) " points="29.3985431 147.286782 31.0147896 148.902701 32.6310362 147.286782 31.0147896 145.670863"></polygon>
274 |                 <polygon id="Fill-498" fill-opacity="0.8" fill="#A3B1BF" transform="translate(29.563219, 143.867946) rotate(22.000000) translate(-29.563219, -143.867946) " points="27.9469727 143.867946 29.5632192 145.483865 31.1794658 143.867946 29.5632192 142.252027"></polygon>
275 |                 <polygon id="Stroke-500" transform="translate(29.563219, 143.867946) rotate(22.000000) translate(-29.563219, -143.867946) " points="27.9469727 143.867946 29.5632192 145.483865 31.1794658 143.867946 29.5632192 142.252027"></polygon>
276 |                 <polygon id="Fill-502" fill-opacity="0.8" fill="#A3B1BF" transform="translate(28.111566, 140.449145) rotate(22.000000) translate(-28.111566, -140.449145) " points="26.4953196 140.449145 28.1115662 142.065063 29.7278127 140.449145 28.1115662 138.833226"></polygon>
277 |                 <polygon id="Stroke-504" transform="translate(28.111566, 140.449145) rotate(22.000000) translate(-28.111566, -140.449145) " points="26.4953196 140.449145 28.1115662 142.065063 29.7278127 140.449145 28.1115662 138.833226"></polygon>
278 |                 <polygon id="Fill-506" fill-opacity="0.8" fill="#A3B1BF" transform="translate(29.310298, 152.044860) rotate(22.000000) translate(-29.310298, -152.044860) " points="27.6940519 152.04486 29.3102985 153.660779 30.926545 152.04486 29.3102985 150.428942"></polygon>
279 |                 <polygon id="Stroke-508" transform="translate(29.310298, 152.044860) rotate(22.000000) translate(-29.310298, -152.044860) " points="27.6940519 152.04486 29.3102985 153.660779 30.926545 152.04486 29.3102985 150.428942"></polygon>
280 |                 <polygon id="Fill-510" fill-opacity="0.8" fill="#A3B1BF" transform="translate(27.858704, 148.626083) rotate(22.000000) translate(-27.858704, -148.626083) " points="26.2424578 148.626083 27.8587043 150.242002 29.4749508 148.626083 27.8587043 147.010164"></polygon>
281 |                 <polygon id="Stroke-512" transform="translate(27.858704, 148.626083) rotate(22.000000) translate(-27.858704, -148.626083) " points="26.2424578 148.626083 27.8587043 150.242002 29.4749508 148.626083 27.8587043 147.010164"></polygon>
282 |                 <polygon id="Fill-514" fill-opacity="0.8" fill="#A3B1BF" transform="translate(26.407134, 145.207247) rotate(22.000000) translate(-26.407134, -145.207247) " points="24.7908874 145.207247 26.4071339 146.823166 28.0233805 145.207247 26.4071339 143.591328"></polygon>
283 |                 <polygon id="Stroke-516" transform="translate(26.407134, 145.207247) rotate(22.000000) translate(-26.407134, -145.207247) " points="24.7908874 145.207247 26.4071339 146.823166 28.0233805 145.207247 26.4071339 143.591328"></polygon>
284 |                 <polygon id="Fill-518" fill-opacity="0.8" fill="#A3B1BF" transform="translate(24.955481, 141.788446) rotate(22.000000) translate(-24.955481, -141.788446) " points="23.3392343 141.788446 24.9554808 143.404364 26.5717274 141.788446 24.9554808 140.172527"></polygon>
285 |                 <polygon id="Stroke-520" transform="translate(24.955481, 141.788446) rotate(22.000000) translate(-24.955481, -141.788446) " points="23.3392343 141.788446 24.9554808 143.404364 26.5717274 141.788446 24.9554808 140.172527"></polygon>
286 |                 <polygon id="Fill-522" fill-opacity="0.8" fill="#A3B1BF" transform="translate(26.154213, 153.384161) rotate(22.000000) translate(-26.154213, -153.384161) " points="24.5379666 153.384161 26.1542132 155.00008 27.7704597 153.384161 26.1542132 151.768243"></polygon>
287 |                 <polygon id="Stroke-524" transform="translate(26.154213, 153.384161) rotate(22.000000) translate(-26.154213, -153.384161) " points="24.5379666 153.384161 26.1542132 155.00008 27.7704597 153.384161 26.1542132 151.768243"></polygon>
288 |                 <polygon id="Fill-526" fill-opacity="0.8" fill="#A3B1BF" transform="translate(24.702619, 149.965384) rotate(22.000000) translate(-24.702619, -149.965384) " points="23.0863724 149.965384 24.702619 151.581303 26.3188655 149.965384 24.702619 148.349465"></polygon>
289 |                 <polygon id="Stroke-528" transform="translate(24.702619, 149.965384) rotate(22.000000) translate(-24.702619, -149.965384) " points="23.0863724 149.965384 24.702619 151.581303 26.3188655 149.965384 24.702619 148.349465"></polygon>
290 |                 <polygon id="Fill-530" fill-opacity="0.8" fill="#A3B1BF" transform="translate(23.250966, 146.546583) rotate(22.000000) translate(-23.250966, -146.546583) " points="21.6347194 146.546583 23.2509659 148.162502 24.8672124 146.546583 23.2509659 144.930664"></polygon>
291 |                 <polygon id="Stroke-532" transform="translate(23.250966, 146.546583) rotate(22.000000) translate(-23.250966, -146.546583) " points="21.6347194 146.546583 23.2509659 148.162502 24.8672124 146.546583 23.2509659 144.930664"></polygon>
292 |                 <polygon id="Fill-534" fill-opacity="0.8" fill="#A3B1BF" transform="translate(21.799396, 143.127747) rotate(22.000000) translate(-21.799396, -143.127747) " points="20.183149 143.127747 21.7993955 144.743665 23.4156421 143.127747 21.7993955 141.511828"></polygon>
293 |                 <polygon id="Stroke-536" transform="translate(21.799396, 143.127747) rotate(22.000000) translate(-21.799396, -143.127747) " points="20.183149 143.127747 21.7993955 144.743665 23.4156421 143.127747 21.7993955 141.511828"></polygon>
294 |                 <path d="M129.314819,189.942425 C126.372666,187.000233 124.490222,184.112668 125.110927,183.492089 C125.731631,182.87151 128.619783,184.753573 131.562571,187.695129 C134.504724,190.637321 136.387169,193.524886 135.766464,194.145465 C135.145759,194.766044 132.257608,192.883981 129.314819,189.942425 Z" id="Fill-538" fill="#F5F5F5" transform="translate(130.438695, 188.818777) rotate(22.000000) translate(-130.438695, -188.818777) "></path>
295 |                 <path d="M129.314819,189.942425 C126.372666,187.000233 124.490222,184.112668 125.110927,183.492089 C125.731631,182.87151 128.619783,184.753573 131.562571,187.695129 C134.504724,190.637321 136.387169,193.524886 135.766464,194.145465 C135.145759,194.766044 132.257608,192.883981 129.314819,189.942425 Z" id="Stroke-540" stroke="#A3B1BF" stroke-width="1.62" stroke-linejoin="round" transform="translate(130.438695, 188.818777) rotate(22.000000) translate(-130.438695, -188.818777) "></path>
296 |                 <path d="M136.083433,187.715086 C130.20421,181.837055 126.443133,176.067006 127.683272,174.827118 C128.92341,173.587231 134.69463,177.347545 140.573854,183.225576 C146.453713,189.104243 150.21479,194.874292 148.974651,196.114179 C147.734513,197.354066 141.963293,193.593752 136.083433,187.715086 Z" id="Fill-542" fill="#F5F5F5" transform="translate(138.328961, 185.470648) rotate(22.000000) translate(-138.328961, -185.470648) "></path>
297 |                 <path d="M136.083433,187.715086 C130.20421,181.837055 126.443133,176.067006 127.683272,174.827118 C128.92341,173.587231 134.69463,177.347545 140.573854,183.225576 C146.453713,189.104243 150.21479,194.874292 148.974651,196.114179 C147.734513,197.354066 141.963293,193.593752 136.083433,187.715086 Z" id="Stroke-544" stroke="#A3B1BF" stroke-width="1.62" stroke-linejoin="round" transform="translate(138.328961, 185.470648) rotate(22.000000) translate(-138.328961, -185.470648) "></path>
298 |                 <path d="M146.697288,183.650834 C138.818086,175.773231 133.777481,168.04045 135.43947,166.378798 C137.101459,164.717146 144.835809,169.756729 152.715011,177.634332 C160.594213,185.511936 165.634818,193.244716 163.972829,194.906369 C162.310839,196.568021 154.57649,191.528438 146.697288,183.650834 Z" id="Fill-546" fill-opacity="0.35" fill="#F5F5F5" transform="translate(149.706149, 180.642583) rotate(22.000000) translate(-149.706149, -180.642583) "></path>
299 |                 <path d="M146.697288,183.650834 C138.818086,175.773231 133.777481,168.04045 135.43947,166.378798 C137.101459,164.717146 144.835809,169.756729 152.715011,177.634332 C160.594213,185.511936 165.634818,193.244716 163.972829,194.906369 C162.310839,196.568021 154.57649,191.528438 146.697288,183.650834 Z" id="Stroke-548" stroke="#A3B1BF" stroke-width="1.62" stroke-linejoin="round" transform="translate(149.706149, 180.642583) rotate(22.000000) translate(-149.706149, -180.642583) "></path>
300 |                 <path d="M65.2279553,90.2345285 C62.4548336,90.0320836 60.4105231,89.3345405 60.4105231,88.5051511 C60.4105231,87.676673 62.4503446,86.9797514 65.2188187,86.7764428 C65.4149139,84.0068366 66.0879499,81.9659221 66.8880741,81.9659221 C67.6881984,81.9659221 68.3612344,84.0068366 68.5573295,86.7764428 C71.3258036,86.9797514 73.3656251,87.676673 73.3656251,88.5051511 C73.3656251,89.3345405 71.3213146,90.0320836 68.548193,90.2345285 C68.3410329,92.9408238 67.6762073,94.9210242 66.8880741,94.9210242 C66.0999409,94.9210242 65.4351154,92.9408238 65.2279553,90.2345285 Z" id="Oval-80-Copy-3" fill-opacity="0.4" fill="#A3B1BF" opacity="0.85" transform="translate(66.888074, 88.443473) rotate(-340.000000) translate(-66.888074, -88.443473) "></path>
301 |                 <path d="M118.775569,329.140492 L118.424988,329.526146 C117.522244,330.5192 115.985396,330.592411 114.992341,329.689667 C114.596934,329.330218 114.331035,328.850456 114.235803,328.324641 L114.143075,327.812647 L113.669257,327.599091 C112.445737,327.047635 111.900921,325.608734 112.452377,324.385214 C112.672015,323.8979 113.046204,323.496601 113.516991,323.243469 L113.97521,322.997095 L114.032158,322.478985 C114.178786,321.144967 115.379087,320.182398 116.713105,320.329026 C117.24418,320.387399 117.741214,320.61917 118.127299,320.988476 L118.503957,321.348765 L119.01334,321.242962 C120.327346,320.970031 121.613813,321.813989 121.886744,323.127995 C121.995449,323.651349 121.928561,324.195943 121.696437,324.677436 L121.470742,325.145594 L121.728812,325.597409 C122.394441,326.762759 121.989337,328.247061 120.823987,328.91269 C120.359975,329.177726 119.82154,329.282421 119.292023,329.21057 L118.775569,329.140492 Z" id="Star-1-Copy-16" fill-opacity="0.4" fill="#A3B1BF"></path>
302 |                 <path d="M432.83752,120.004816 L432.837087,120.005044 L432.837087,120.005044 C432.092472,120.396429 431.171561,120.110079 430.780176,119.365464 C430.624337,119.068978 430.570573,118.729391 430.627206,118.399266 L430.627206,118.399266 L430.627206,118.399266 L430.627206,118.399266 C430.024845,117.812233 430.01242,116.848039 430.599453,116.245678 C430.833262,116.005765 431.139652,115.849637 431.471171,115.801474 L431.471471,115.801431 L431.471471,115.801431 L431.471471,115.801431 C431.843891,115.046982 432.757399,114.737288 433.511848,115.109709 C433.812195,115.25797 434.055308,115.501083 434.20357,115.801431 L434.20357,115.801431 L434.203869,115.801474 L434.203869,115.801474 C435.036229,115.922398 435.612963,116.695187 435.492039,117.527547 C435.443876,117.859067 435.287748,118.165457 435.047835,118.399266 L435.047835,118.399266 L435.047835,118.399266 L435.047835,118.399266 C435.190066,119.228364 434.63325,120.015783 433.804152,120.158014 C433.474027,120.214647 433.134439,120.160883 432.837954,120.005044 L432.83752,120.004816 Z" id="Star-1-Copy-18" fill-opacity="0.4" fill="#A3B1BF" transform="translate(432.837619, 117.566125) rotate(-3.000000) translate(-432.837619, -117.566125) "></path>
303 |                 <path d="M99.7727703,38.762372 L99.0266308,39.1545584 L99.0266308,39.1545584 C97.8386845,39.7789675 96.36948,39.3221304 95.7450708,38.134184 C95.4964477,37.6611755 95.4106732,37.1194035 95.5010241,36.5927278 L95.6433921,35.7628333 L95.0407812,35.1755563 L95.0407812,35.1755563 C94.0796578,34.2388893 94.059832,32.7004261 94.996499,31.7393027 C95.369563,31.3564979 95.8584376,31.1073808 96.3874089,31.0305329 L97.2206742,30.9094778 L97.5937913,30.1536188 L97.5937913,30.1536188 C98.1878378,28.950202 99.6449697,28.4562097 100.848387,29.0502562 C101.327469,29.2867472 101.715258,29.6745363 101.951749,30.1536188 L102.324866,30.9094778 L103.158132,31.0305329 L103.158132,31.0305329 C104.486241,31.223478 105.406474,32.4565366 105.213529,33.7846464 C105.136681,34.3136177 104.887564,34.8024923 104.504759,35.1755563 L103.902148,35.7628333 L104.044516,36.5927278 L104.044516,36.5927278 C104.27143,37.9154575 103.383095,39.1716915 102.060366,39.398605 C101.53369,39.4889559 100.991918,39.4031814 100.51891,39.1545584 L99.7727703,38.762372 Z" id="Star-1-Copy-19" fill-opacity="0.4" fill="#A3B1BF" transform="translate(99.772928, 34.116388) rotate(19.000000) translate(-99.772928, -34.116388) "></path>
304 |                 <path d="M396.631073,305.744172 L396.098125,305.608596 C394.797498,305.277731 394.01135,303.955146 394.342215,302.654518 C394.473956,302.136643 394.772729,301.676633 395.192288,301.345694 L395.623376,301.00566 L395.587617,300.458372 C395.500116,299.119176 396.514815,297.962609 397.854012,297.875108 C398.387399,297.840257 398.917395,297.982247 399.361919,298.279089 L399.818473,298.583965 L400.329362,298.380373 C401.576068,297.883555 402.989473,298.491459 403.486291,299.738164 C403.684076,300.23448 403.712777,300.782145 403.567956,301.296416 L403.418882,301.825788 L403.76981,302.247972 C404.627682,303.280038 404.486471,304.812135 403.454406,305.670007 C403.043346,306.011688 402.531095,306.208301 401.996987,306.229395 L401.44896,306.251039 L401.15585,306.715309 C400.439401,307.850123 398.938655,308.189275 397.80384,307.472826 C397.351988,307.187555 397.006767,306.761296 396.821614,306.260029 L396.631073,305.744172 Z" id="Star-1-Copy-20" fill-opacity="0.4" fill="#A3B1BF"></path>
305 |                 <path d="M439.755536,146.347757 L439.755103,146.347984 L439.755103,146.347984 C439.010488,146.739369 438.089577,146.45302 437.698192,145.708405 C437.542353,145.411919 437.488589,145.072331 437.545222,144.742206 L437.545222,144.742206 L437.545222,144.742206 L437.545222,144.742206 C436.942861,144.155173 436.930436,143.190979 437.517469,142.588619 C437.751277,142.348705 438.057668,142.192577 438.389187,142.144415 L438.389487,142.144371 L438.389487,142.144371 L438.389487,142.144371 C438.761907,141.389923 439.675415,141.080228 440.429864,141.452649 C440.730211,141.600911 440.973324,141.844024 441.121586,142.144371 L441.121586,142.144371 L441.121885,142.144415 L441.121885,142.144415 C441.954245,142.265338 442.530978,143.038128 442.410055,143.870488 C442.361892,144.202007 442.205764,144.508398 441.965851,144.742206 L441.965851,144.742206 L441.965851,144.742206 L441.965851,144.742206 C442.108082,145.571305 441.551266,146.358723 440.722168,146.500955 C440.392043,146.557588 440.052455,146.503823 439.755969,146.347984 L439.755536,146.347757 Z" id="Star-1-Copy-21" fill-opacity="0.4" fill="#A3B1BF" transform="translate(439.755635, 143.909066) rotate(-12.000000) translate(-439.755635, -143.909066) "></path>
306 |                 <path d="M244.621971,220.61341 C277.15945,220.61341 303.536288,194.242112 303.536288,161.711467 C303.536288,129.180822 277.15945,102.809524 244.621971,102.809524 C212.084491,102.809524 185.707653,129.180822 185.707653,161.711467 C185.707653,194.242112 212.084491,220.61341 244.621971,220.61341 Z" id="Oval-8-Copy-2" fill-opacity="0.66" fill="#A3B1BF"></path>
307 |                 <path d="M245.345696,141.060063 C241.146656,141.060063 237.880736,142.342349 235.547936,144.906921 C233.215136,147.354921 232.107056,150.618921 232.107056,154.698921 L236.714336,154.698921 C236.714336,151.842921 237.355856,149.628063 238.638896,147.996063 C240.038576,146.072635 242.196416,145.140063 245.112416,145.140063 C247.561856,145.140063 249.486416,145.781206 250.827776,147.180063 C252.110816,148.462349 252.810656,150.269206 252.810656,152.600635 C252.810656,154.232635 252.227456,155.748063 251.061056,157.205206 C250.711136,157.671492 250.011296,158.370921 249.078176,159.303492 C245.928896,162.101206 244.004336,164.316063 243.187856,166.064635 C242.488016,167.521778 242.138096,169.212063 242.138096,171.135492 L242.138096,172.476063 L246.803696,172.476063 L246.803696,171.135492 C246.803696,169.561778 247.153616,168.162921 247.911776,166.880635 C248.494976,165.831492 249.369776,164.782349 250.652816,163.674921 C253.218896,161.401778 254.793536,159.886349 255.376736,159.186921 C256.834736,157.263492 257.592896,154.990349 257.592896,152.367492 C257.592896,148.870349 256.484816,146.130921 254.326976,144.149206 C252.052496,142.050921 249.078176,141.060063 245.345696,141.060063 Z M244.470896,176.556063 C243.479456,176.556063 242.662976,176.847492 241.963136,177.546921 C241.263296,178.188063 240.971696,179.004063 240.971696,179.994921 C240.971696,180.985778 241.263296,181.801778 241.963136,182.501206 C242.662976,183.142349 243.479456,183.492063 244.470896,183.492063 C245.462336,183.492063 246.278816,183.142349 246.978656,182.501206 C247.678496,181.860063 248.028416,181.044063 248.028416,179.994921 C248.028416,179.004063 247.678496,178.188063 247.036976,177.546921 C246.337136,176.847492 245.462336,176.556063 244.470896,176.556063 Z" id="？" fill="#FFFFFF"></path>
308 |                 <path d="M223.261662,133.139924 C229.077338,129.782947 239.631808,125.828273 236.274126,120.013819 C232.916444,114.199364 220.565868,115.043746 214.750193,118.400722 C208.934517,121.757699 202.729834,131.623951 206.087516,137.438405 C209.445198,143.252859 217.445986,136.4969 223.261662,133.139924" id="Oval-8-Copy-2" fill="#FAFAFA"></path>
309 |                 <path d="M249.679003,119.820589 C252.365149,119.820589 254.5427,117.643495 254.5427,114.957913 C254.5427,112.272332 252.365149,110.095238 249.679003,110.095238 C246.992857,110.095238 244.815306,112.272332 244.815306,114.957913 C244.815306,117.643495 246.992857,119.820589 249.679003,119.820589 Z" id="Oval-10-Copy" fill="#FAFAFA"></path>
310 |                 <path d="M421.5,321.5 L423,323" id="Line-2" stroke="#979797" stroke-linecap="square"></path>
311 |             </g>
312 |         </g>
313 |     </g>
314 | </svg>


--------------------------------------------------------------------------------