├── .DS_Store
├── .gitignore
├── .vscode
└── extensions.json
├── LICENSE
├── README.md
├── about.html
├── assets
├── .DS_Store
├── about
│ ├── .DS_Store
│ ├── abstract.svg
│ ├── code.svg
│ ├── growup.svg
│ ├── lighting.svg
│ ├── menu.svg
│ ├── pen.svg
│ ├── pin.svg
│ └── wechat.png
├── blog
│ ├── avatar.svg
│ └── line-dot.svg
├── index
│ ├── .DS_Store
│ ├── adapter.png
│ ├── biliui.png
│ ├── dippermap.png
│ ├── figicon.png
│ ├── figma.png
│ ├── github.png
│ ├── larkmap.png
│ ├── qingicon.png
│ ├── rpb.png
│ ├── wechat-public.png
│ └── yuque.png
├── public
│ ├── favicon.svg
│ ├── head_bottom_line.svg
│ ├── logo.svg
│ ├── logo_text.svg
│ ├── menu_icon.svg
│ ├── skin_light.svg
│ └── star.svg
└── work
│ ├── .DS_Store
│ └── empty.png
├── blog.html
├── css
├── .DS_Store
├── style.css
├── style.min.css
└── style.scss
├── index.html
├── js
├── anime.js
├── firework.js
├── main.js
└── main.min.js
└── work.html
/.DS_Store:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/asorn/asorn-open/d90dff94c3744ce02e572824fd530ed91cae88b7/.DS_Store
--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
1 | node_modules
2 | .DS_Store
--------------------------------------------------------------------------------
/.vscode/extensions.json:
--------------------------------------------------------------------------------
1 | {
2 | "recommendations": [
3 | // 自动把 scss 转成 css 和压缩 css 插件
4 | "spook.easysass",
5 | // 开启本地服务器插件
6 | "yandeu.five-server"
7 | ]
8 | }
--------------------------------------------------------------------------------
/LICENSE:
--------------------------------------------------------------------------------
1 | Apache License
2 | Version 2.0, January 2004
3 | http://www.apache.org/licenses/
4 |
5 | TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION
6 |
7 | 1. Definitions.
8 |
9 | "License" shall mean the terms and conditions for use, reproduction,
10 | and distribution as defined by Sections 1 through 9 of this document.
11 |
12 | "Licensor" shall mean the copyright owner or entity authorized by
13 | the copyright owner that is granting the License.
14 |
15 | "Legal Entity" shall mean the union of the acting entity and all
16 | other entities that control, are controlled by, or are under common
17 | control with that entity. For the purposes of this definition,
18 | "control" means (i) the power, direct or indirect, to cause the
19 | direction or management of such entity, whether by contract or
20 | otherwise, or (ii) ownership of fifty percent (50%) or more of the
21 | outstanding shares, or (iii) beneficial ownership of such entity.
22 |
23 | "You" (or "Your") shall mean an individual or Legal Entity
24 | exercising permissions granted by this License.
25 |
26 | "Source" form shall mean the preferred form for making modifications,
27 | including but not limited to software source code, documentation
28 | source, and configuration files.
29 |
30 | "Object" form shall mean any form resulting from mechanical
31 | transformation or translation of a Source form, including but
32 | not limited to compiled object code, generated documentation,
33 | and conversions to other media types.
34 |
35 | "Work" shall mean the work of authorship, whether in Source or
36 | Object form, made available under the License, as indicated by a
37 | copyright notice that is included in or attached to the work
38 | (an example is provided in the Appendix below).
39 |
40 | "Derivative Works" shall mean any work, whether in Source or Object
41 | form, that is based on (or derived from) the Work and for which the
42 | editorial revisions, annotations, elaborations, or other modifications
43 | represent, as a whole, an original work of authorship. For the purposes
44 | of this License, Derivative Works shall not include works that remain
45 | separable from, or merely link (or bind by name) to the interfaces of,
46 | the Work and Derivative Works thereof.
47 |
48 | "Contribution" shall mean any work of authorship, including
49 | the original version of the Work and any modifications or additions
50 | to that Work or Derivative Works thereof, that is intentionally
51 | submitted to Licensor for inclusion in the Work by the copyright owner
52 | or by an individual or Legal Entity authorized to submit on behalf of
53 | the copyright owner. For the purposes of this definition, "submitted"
54 | means any form of electronic, verbal, or written communication sent
55 | to the Licensor or its representatives, including but not limited to
56 | communication on electronic mailing lists, source code control systems,
57 | and issue tracking systems that are managed by, or on behalf of, the
58 | Licensor for the purpose of discussing and improving the Work, but
59 | excluding communication that is conspicuously marked or otherwise
60 | designated in writing by the copyright owner as "Not a Contribution."
61 |
62 | "Contributor" shall mean Licensor and any individual or Legal Entity
63 | on behalf of whom a Contribution has been received by Licensor and
64 | subsequently incorporated within the Work.
65 |
66 | 2. Grant of Copyright License. Subject to the terms and conditions of
67 | this License, each Contributor hereby grants to You a perpetual,
68 | worldwide, non-exclusive, no-charge, royalty-free, irrevocable
69 | copyright license to reproduce, prepare Derivative Works of,
70 | publicly display, publicly perform, sublicense, and distribute the
71 | Work and such Derivative Works in Source or Object form.
72 |
73 | 3. Grant of Patent License. Subject to the terms and conditions of
74 | this License, each Contributor hereby grants to You a perpetual,
75 | worldwide, non-exclusive, no-charge, royalty-free, irrevocable
76 | (except as stated in this section) patent license to make, have made,
77 | use, offer to sell, sell, import, and otherwise transfer the Work,
78 | where such license applies only to those patent claims licensable
79 | by such Contributor that are necessarily infringed by their
80 | Contribution(s) alone or by combination of their Contribution(s)
81 | with the Work to which such Contribution(s) was submitted. If You
82 | institute patent litigation against any entity (including a
83 | cross-claim or counterclaim in a lawsuit) alleging that the Work
84 | or a Contribution incorporated within the Work constitutes direct
85 | or contributory patent infringement, then any patent licenses
86 | granted to You under this License for that Work shall terminate
87 | as of the date such litigation is filed.
88 |
89 | 4. Redistribution. You may reproduce and distribute copies of the
90 | Work or Derivative Works thereof in any medium, with or without
91 | modifications, and in Source or Object form, provided that You
92 | meet the following conditions:
93 |
94 | (a) You must give any other recipients of the Work or
95 | Derivative Works a copy of this License; and
96 |
97 | (b) You must cause any modified files to carry prominent notices
98 | stating that You changed the files; and
99 |
100 | (c) You must retain, in the Source form of any Derivative Works
101 | that You distribute, all copyright, patent, trademark, and
102 | attribution notices from the Source form of the Work,
103 | excluding those notices that do not pertain to any part of
104 | the Derivative Works; and
105 |
106 | (d) If the Work includes a "NOTICE" text file as part of its
107 | distribution, then any Derivative Works that You distribute must
108 | include a readable copy of the attribution notices contained
109 | within such NOTICE file, excluding those notices that do not
110 | pertain to any part of the Derivative Works, in at least one
111 | of the following places: within a NOTICE text file distributed
112 | as part of the Derivative Works; within the Source form or
113 | documentation, if provided along with the Derivative Works; or,
114 | within a display generated by the Derivative Works, if and
115 | wherever such third-party notices normally appear. The contents
116 | of the NOTICE file are for informational purposes only and
117 | do not modify the License. You may add Your own attribution
118 | notices within Derivative Works that You distribute, alongside
119 | or as an addendum to the NOTICE text from the Work, provided
120 | that such additional attribution notices cannot be construed
121 | as modifying the License.
122 |
123 | You may add Your own copyright statement to Your modifications and
124 | may provide additional or different license terms and conditions
125 | for use, reproduction, or distribution of Your modifications, or
126 | for any such Derivative Works as a whole, provided Your use,
127 | reproduction, and distribution of the Work otherwise complies with
128 | the conditions stated in this License.
129 |
130 | 5. Submission of Contributions. Unless You explicitly state otherwise,
131 | any Contribution intentionally submitted for inclusion in the Work
132 | by You to the Licensor shall be under the terms and conditions of
133 | this License, without any additional terms or conditions.
134 | Notwithstanding the above, nothing herein shall supersede or modify
135 | the terms of any separate license agreement you may have executed
136 | with Licensor regarding such Contributions.
137 |
138 | 6. Trademarks. This License does not grant permission to use the trade
139 | names, trademarks, service marks, or product names of the Licensor,
140 | except as required for reasonable and customary use in describing the
141 | origin of the Work and reproducing the content of the NOTICE file.
142 |
143 | 7. Disclaimer of Warranty. Unless required by applicable law or
144 | agreed to in writing, Licensor provides the Work (and each
145 | Contributor provides its Contributions) on an "AS IS" BASIS,
146 | WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or
147 | implied, including, without limitation, any warranties or conditions
148 | of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A
149 | PARTICULAR PURPOSE. You are solely responsible for determining the
150 | appropriateness of using or redistributing the Work and assume any
151 | risks associated with Your exercise of permissions under this License.
152 |
153 | 8. Limitation of Liability. In no event and under no legal theory,
154 | whether in tort (including negligence), contract, or otherwise,
155 | unless required by applicable law (such as deliberate and grossly
156 | negligent acts) or agreed to in writing, shall any Contributor be
157 | liable to You for damages, including any direct, indirect, special,
158 | incidental, or consequential damages of any character arising as a
159 | result of this License or out of the use or inability to use the
160 | Work (including but not limited to damages for loss of goodwill,
161 | work stoppage, computer failure or malfunction, or any and all
162 | other commercial damages or losses), even if such Contributor
163 | has been advised of the possibility of such damages.
164 |
165 | 9. Accepting Warranty or Additional Liability. While redistributing
166 | the Work or Derivative Works thereof, You may choose to offer,
167 | and charge a fee for, acceptance of support, warranty, indemnity,
168 | or other liability obligations and/or rights consistent with this
169 | License. However, in accepting such obligations, You may act only
170 | on Your own behalf and on Your sole responsibility, not on behalf
171 | of any other Contributor, and only if You agree to indemnify,
172 | defend, and hold each Contributor harmless for any liability
173 | incurred by, or claims asserted against, such Contributor by reason
174 | of your accepting any such warranty or additional liability.
175 |
176 | END OF TERMS AND CONDITIONS
177 |
178 | APPENDIX: How to apply the Apache License to your work.
179 |
180 | To apply the Apache License to your work, attach the following
181 | boilerplate notice, with the fields enclosed by brackets "[]"
182 | replaced with your own identifying information. (Don't include
183 | the brackets!) The text should be enclosed in the appropriate
184 | comment syntax for the file format. We also recommend that a
185 | file or class name and description of purpose be included on the
186 | same "printed page" as the copyright notice for easier
187 | identification within third-party archives.
188 |
189 | Copyright [yyyy] [name of copyright owner]
190 |
191 | Licensed under the Apache License, Version 2.0 (the "License");
192 | you may not use this file except in compliance with the License.
193 | You may obtain a copy of the License at
194 |
195 | http://www.apache.org/licenses/LICENSE-2.0
196 |
197 | Unless required by applicable law or agreed to in writing, software
198 | distributed under the License is distributed on an "AS IS" BASIS,
199 | WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
200 | See the License for the specific language governing permissions and
201 | limitations under the License.
202 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | # asorn-open
2 |
3 | ### 最新消息
4 |
5 | **注意,这个版本往后不再维护了,请查看最新版本(切换分支至“2025”即可)**
6 |
7 | ### 介绍
8 |
9 | 欢迎使用我的个人博客开源版。
10 |
11 | > 我的博客地址:https://asorn.cn/
12 |
13 | 该博客非常适用于设计师、开发者,用来呈现自己的作品、技术文章以及个人简历工作经历等。
14 |
15 | 该博客使用 html、css、js 开发,纯静态页面,非常简单。如果你具备基础的开发能力,那么你可以直接将项目克隆下来替换内容后自由部署即可。
16 |
17 | > 我这里写了一篇使用 Github Pages 和阿里云对象存储 OSS 搭建部署的教程,照着教程走就能快速上线 [戳我查看](https://www.yuque.com/asorn/ok/sxstt3arfa05e7ve?singleDoc#)
18 |
19 | 如果你没有开发能力,但又很喜欢这套博客,那你可以联系我,我来教你怎么玩;或者,你还可以去 B 站看看 [草帽](https://www.bilibili.com/video/BV1Vq421A7pM/?share_source=copy_web&vd_source=12e2e419822b275e3fb0ad8671011ac3) 的新手使用教程。
20 |
21 | ---
22 |
23 | ### 注意事项
24 |
25 | - 原则上来说,你可以随意拿着这套项目去玩耍;
26 | - 但请不要直接用于商业用途;
27 | - 如果你同样崇尚开源精神,请为我们署个名吧(直接署名、代码注释、友链等任何形式)。
28 |
29 | ---
30 |
31 | ### 创作
32 |
33 | 一起欣赏下大家的创作吧(如果你愿意,可以联系我添加你的创作):
34 |
35 | - [SCOTT-STUDIO](https://scott-studio.cn/)
36 | - [tutuzly](https://tutuzly.com/)
37 | - [Icnon](https://icnon.github.io/)
38 | - [Henry](https://henryblog.cn/)
39 | - [Jerry](https://lanxx.top/)
40 | - [Htm](http://htm.wang/)
41 | - [Taoqibao](https://www.liangwangan.top/)
42 | - [Ethan Zhi](https://ethanzhi.top/)
43 | - [NextEcho](https://nextecho.github.io/)
44 | - [limitlessjoy](http://limitlessjoy.cn/)
45 | - [Jiang](https://freedesignfreecreation.cn/)
46 | - [51921](https://51921.work/)
47 | - [Ethink](https://huaeyl.cn/)
48 | - [leonardo_zi](http://leonardozi4.cloud/)
49 |
50 | ---
51 |
52 | ### 联系我
53 |
54 | 微信:imasorn
55 |
56 | 邮箱:cjl294114430@gmail.com
57 |
58 | ---
59 |
60 | ### 致谢
61 |
62 | 在这里,感谢我的好基友 [hmwl](https://github.com/hmwl) 所提供的技术支持!
63 |
64 | ### 赞赏
65 |
66 | 如果你愿意,可以请我喝杯咖啡吗?
67 |
68 |
69 |
70 |
71 |
--------------------------------------------------------------------------------
/about.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 | Asorn - About Me
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
21 |
22 |
23 |
24 |
32 |
33 |
34 |
35 |
36 |
37 |
Name
38 |
39 |
40 |
Introduce
41 |
42 | I am currently a product designer, junior developer, and aspire to become a design engineer. Having insights and practical experience in multiple industries such as cloud computing, low code, e-commerce, intelligent customer service, and zero trust.
43 | I am passionate about the infinite possibilities of technology and also focused on exploring the values of product design, seeking a balance between ultimate design, interaction, technological inclusion, and business understanding to solve problems.
44 | In addition, I have won three patents for appearance invention, which can be found in the
China National Intellectual Property Administration ↗ Enter my name on the official website to search.
45 |
46 |
47 |
48 |
70 |
71 |
Resume
72 |
73 |
Download my resume (PDF & 1MB)
74 |
75 |
76 |
77 |
78 |
79 |
80 |
81 |
82 |
83 |
89 |
95 |
101 |
107 |
108 |
109 |
115 |
121 |
127 |
133 |
139 |
140 |
141 |
142 |
143 |
144 |
145 |
❖ 2023.10 ~ Now
146 |
147 |
148 |
UI Designer
149 |
150 |
151 |
152 |
Project Title
153 |
154 |
155 | App, Web, H5, Mini Program, Backend Design, Design Asset Building, Axure Interaction Design, Enterprise VI Design, etc. Welcome to consult
156 |
157 |
158 |
159 |
160 |
161 |
162 |
❖ 2019.08 ~ 2023.08
163 |
164 |
165 |
Product Designer
166 |
167 |
168 |
169 |
Project Title One
170 |
171 |
172 | This is a project description that can introduce one's project achievements, project experience, and achievements;
173 | This is a project description that can introduce one's project achievements, project experience, and achievements;
174 | This is a project description that can introduce one's project achievements, project experience, and achievements.
175 |
176 |
177 |
178 |
179 |
Project Title Two
180 |
181 |
182 | This is a project description that can introduce one's project achievements, project experience, and achievements;
183 | This is a project description that can introduce one's project achievements, project experience, and achievements.
184 |
185 |
186 |
187 |
188 |
Project Title Three
189 |
190 |
191 | This is a project description that can introduce one's project achievements, project experience, and achievements;
192 | This is a project description that can introduce one's project achievements, project experience, and achievements.
193 |
194 |
195 |
196 |
197 |
198 |
199 |
❖ 2016.05 ~ 2019.06
200 |
201 |
202 |
UI Designer
203 |
204 |
205 |
206 |
Project Title
207 |
208 |
209 | This is a project description that can introduce one's project achievements, project experience, and achievements;
210 | This is a project description that can introduce one's project achievements, project experience, and achievements.
211 |
212 |
213 |
214 |
215 |
216 |
217 |
218 |
219 |
232 |
243 |
244 |
245 |
246 |
247 |
--------------------------------------------------------------------------------
/assets/.DS_Store:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/asorn/asorn-open/d90dff94c3744ce02e572824fd530ed91cae88b7/assets/.DS_Store
--------------------------------------------------------------------------------
/assets/about/.DS_Store:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/asorn/asorn-open/d90dff94c3744ce02e572824fd530ed91cae88b7/assets/about/.DS_Store
--------------------------------------------------------------------------------
/assets/about/abstract.svg:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 |
8 |
9 |
10 |
--------------------------------------------------------------------------------
/assets/about/code.svg:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
--------------------------------------------------------------------------------
/assets/about/growup.svg:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
--------------------------------------------------------------------------------
/assets/about/lighting.svg:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 |
8 |
--------------------------------------------------------------------------------
/assets/about/menu.svg:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 |
8 |
9 |
10 |
11 |
12 |
--------------------------------------------------------------------------------
/assets/about/pen.svg:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
--------------------------------------------------------------------------------
/assets/about/pin.svg:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
--------------------------------------------------------------------------------
/assets/about/wechat.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/asorn/asorn-open/d90dff94c3744ce02e572824fd530ed91cae88b7/assets/about/wechat.png
--------------------------------------------------------------------------------
/assets/blog/avatar.svg:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
--------------------------------------------------------------------------------
/assets/blog/line-dot.svg:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 |
8 |
9 |
10 |
11 |
12 |
--------------------------------------------------------------------------------
/assets/index/.DS_Store:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/asorn/asorn-open/d90dff94c3744ce02e572824fd530ed91cae88b7/assets/index/.DS_Store
--------------------------------------------------------------------------------
/assets/index/adapter.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/asorn/asorn-open/d90dff94c3744ce02e572824fd530ed91cae88b7/assets/index/adapter.png
--------------------------------------------------------------------------------
/assets/index/biliui.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/asorn/asorn-open/d90dff94c3744ce02e572824fd530ed91cae88b7/assets/index/biliui.png
--------------------------------------------------------------------------------
/assets/index/dippermap.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/asorn/asorn-open/d90dff94c3744ce02e572824fd530ed91cae88b7/assets/index/dippermap.png
--------------------------------------------------------------------------------
/assets/index/figicon.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/asorn/asorn-open/d90dff94c3744ce02e572824fd530ed91cae88b7/assets/index/figicon.png
--------------------------------------------------------------------------------
/assets/index/figma.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/asorn/asorn-open/d90dff94c3744ce02e572824fd530ed91cae88b7/assets/index/figma.png
--------------------------------------------------------------------------------
/assets/index/github.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/asorn/asorn-open/d90dff94c3744ce02e572824fd530ed91cae88b7/assets/index/github.png
--------------------------------------------------------------------------------
/assets/index/larkmap.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/asorn/asorn-open/d90dff94c3744ce02e572824fd530ed91cae88b7/assets/index/larkmap.png
--------------------------------------------------------------------------------
/assets/index/qingicon.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/asorn/asorn-open/d90dff94c3744ce02e572824fd530ed91cae88b7/assets/index/qingicon.png
--------------------------------------------------------------------------------
/assets/index/rpb.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/asorn/asorn-open/d90dff94c3744ce02e572824fd530ed91cae88b7/assets/index/rpb.png
--------------------------------------------------------------------------------
/assets/index/wechat-public.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/asorn/asorn-open/d90dff94c3744ce02e572824fd530ed91cae88b7/assets/index/wechat-public.png
--------------------------------------------------------------------------------
/assets/index/yuque.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/asorn/asorn-open/d90dff94c3744ce02e572824fd530ed91cae88b7/assets/index/yuque.png
--------------------------------------------------------------------------------
/assets/public/favicon.svg:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
--------------------------------------------------------------------------------
/assets/public/head_bottom_line.svg:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 |
8 |
9 |
10 |
11 |
--------------------------------------------------------------------------------
/assets/public/logo.svg:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
--------------------------------------------------------------------------------
/assets/public/logo_text.svg:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 |
8 |
--------------------------------------------------------------------------------
/assets/public/menu_icon.svg:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
--------------------------------------------------------------------------------
/assets/public/skin_light.svg:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 |
8 |
9 |
10 |
11 |
--------------------------------------------------------------------------------
/assets/public/star.svg:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
17 |
18 |
19 |
20 |
21 |
22 |
--------------------------------------------------------------------------------
/assets/work/.DS_Store:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/asorn/asorn-open/d90dff94c3744ce02e572824fd530ed91cae88b7/assets/work/.DS_Store
--------------------------------------------------------------------------------
/assets/work/empty.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/asorn/asorn-open/d90dff94c3744ce02e572824fd530ed91cae88b7/assets/work/empty.png
--------------------------------------------------------------------------------
/blog.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 | Asorn - My Blog
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
21 |
22 |
23 |
24 |
32 |
33 |
34 |
35 |
36 |
39 |
40 |
60 |
79 |
98 |
117 |
136 |
155 |
174 |
193 |
212 |
231 |
249 |
250 |
251 |
264 |
275 |
276 |
287 |
288 |
289 |
290 |
--------------------------------------------------------------------------------
/css/.DS_Store:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/asorn/asorn-open/d90dff94c3744ce02e572824fd530ed91cae88b7/css/.DS_Store
--------------------------------------------------------------------------------
/css/style.css:
--------------------------------------------------------------------------------
1 | @charset "UTF-8";
2 | @media screen and (max-width: 768px) {
3 | /* about */
4 | .about-info {
5 | flex-direction: column;
6 | }
7 | .list-00, .list-01 {
8 | grid-template-columns: 1fr 1fr !important;
9 | }
10 | .about-bottom .experience .item {
11 | grid-template-columns: none !important;
12 | grid-template-rows: 1fr !important;
13 | }
14 | /* blog */
15 | .blog-left {
16 | display: none;
17 | }
18 | /* head */
19 | .menu {
20 | display: none !important;
21 | }
22 | #menu-expand {
23 | display: block !important;
24 | }
25 | /* index */
26 | .hello::after {
27 | width: 320px !important;
28 | height: 320px !important;
29 | }
30 | /* all pages */
31 | .copyright span, .fillings, .friends {
32 | display: none !important;
33 | }
34 | }
35 |
36 | @media screen and (min-width: 769px) {
37 | #menu-panel {
38 | left: 100vw !important;
39 | }
40 | }
41 |
42 | * {
43 | border: 0;
44 | margin: 0;
45 | padding: 0;
46 | box-sizing: border-box;
47 | list-style: none;
48 | font-size: 12px;
49 | text-decoration: unset;
50 | }
51 |
52 | body {
53 | background-color: #0E0E13;
54 | color: #E8E8F6;
55 | font-family: Roboto, system-ui, -apple-system, "Segoe UI", "Helvetica Neue", Arial, "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
56 | -webkit-font-smoothing: antialiased;
57 | overflow-x: hidden;
58 | }
59 |
60 | .fireworks {
61 | position: fixed;
62 | top: 0;
63 | left: 0;
64 | width: 100%;
65 | height: 100%;
66 | display: block;
67 | z-index: -999;
68 | }
69 |
70 | .icon {
71 | font-size: 0;
72 | }
73 |
74 | .icon.dark::before {
75 | content: url(../assets/public/skin_light.svg);
76 | }
77 |
78 | .icon.menu-icon::before {
79 | content: url(../assets/public/menu_icon.svg);
80 | }
81 |
82 | .magical {
83 | --circle-size: 600px;
84 | --inset: 1px;
85 | --border: 6px;
86 | position: relative;
87 | display: flex;
88 | align-items: center;
89 | justify-content: center;
90 | border-radius: var(--border);
91 | background-color: #0E0E13;
92 | }
93 |
94 | .magical::before, .magical::after {
95 | content: '';
96 | position: absolute;
97 | width: calc(100% + var(--inset)*2);
98 | height: calc(100% + var(--inset)*2);
99 | border-radius: var(--border);
100 | inset: calc(0 - var(--inset));
101 | }
102 |
103 | .magical::before {
104 | background: radial-gradient(var(--circle-size) circle at var(--mouse-x) var(--mouse-y), rgba(255, 255, 255, 0.3), transparent 40%);
105 | /* hover border */
106 | z-index: -1;
107 | }
108 |
109 | .magical::after {
110 | background: linear-gradient(180deg, rgba(78, 78, 100, 0.48) 0%, rgba(78, 78, 100, 0.2) 100%);
111 | /* border */
112 | z-index: -2;
113 | }
114 |
115 | .magical .show {
116 | width: 100%;
117 | height: 100%;
118 | position: absolute;
119 | border-radius: var(--border);
120 | opacity: 0;
121 | pointer-events: none;
122 | background: radial-gradient(var(--circle-size) circle at var(--mouse-x) var(--mouse-y), rgba(255, 255, 255, 0.01), transparent 40%);
123 | /* hover fill */
124 | }
125 |
126 | .btn {
127 | --border: 9999px;
128 | background-image: radial-gradient(var(--circle-size) circle at var(--mouse-x) var(--mouse-y), rgba(255, 255, 255, 0.06), transparent 40%);
129 | /* hover fill */
130 | }
131 |
132 | .btn::before {
133 | background: radial-gradient(var(--circle-size) circle at var(--mouse-x) var(--mouse-y), rgba(255, 255, 255, 0.4), transparent 40%);
134 | /* hover border */
135 | }
136 |
137 | .btn::after {
138 | background: linear-gradient(180deg, rgba(78, 78, 100, 0.68) 0%, rgba(78, 78, 100, 0.2) 100%);
139 | /* border */
140 | }
141 |
142 | .head {
143 | position: fixed;
144 | padding: 0 40px;
145 | width: 100%;
146 | --height: 56px;
147 | height: var(--height);
148 | display: flex;
149 | justify-content: center;
150 | align-items: center;
151 | --mw: 968px;
152 | background: rgba(25, 25, 32, 0.8);
153 | backdrop-filter: blur(4px);
154 | flex-direction: column;
155 | z-index: 100;
156 | }
157 |
158 | .head .main {
159 | width: 100%;
160 | display: flex;
161 | justify-content: space-between;
162 | align-items: center;
163 | max-width: var(--mw);
164 | }
165 |
166 | .head .logo {
167 | height: 20px;
168 | }
169 |
170 | .head #menu-expand {
171 | display: none;
172 | }
173 |
174 | .head #menu-expand.active {
175 | pointer-events: none;
176 | /* 防止在动画期间再次点击 */
177 | }
178 |
179 | .head #menu-expand.active + #menu-panel {
180 | left: 40px;
181 | }
182 |
183 | .head #menu-expand > .menu-icon {
184 | transition: transform .5s;
185 | }
186 |
187 | .head #menu-expand .active #menu-expand > .menu-icon {
188 | transform: rotate(45deg);
189 | }
190 |
191 | @keyframes goOut {
192 | 0% {
193 | left: 40px;
194 | }
195 | 100% {
196 | left: 100vw;
197 | }
198 | }
199 |
200 | .head .menu {
201 | display: flex;
202 | gap: 12px;
203 | }
204 |
205 | .head .menu li {
206 | --circle-size: 100px;
207 | border-radius: 9999px;
208 | padding: 6px 16px;
209 | cursor: pointer;
210 | background-color: #1F1F26;
211 | transition: .3s background ease-in-out;
212 | }
213 |
214 | .head .menu li.nav, .head .menu li.nav::before {
215 | background-color: #6361DC;
216 | }
217 |
218 | .head .menu .skin {
219 | width: 14px;
220 | padding: 6px 13px;
221 | }
222 |
223 | .head #menu-panel {
224 | width: calc(100vw - 80px);
225 | position: absolute;
226 | top: 44px;
227 | left: 100vw;
228 | padding: 16px 24px;
229 | background: rgba(25, 25, 32, 0.96);
230 | backdrop-filter: blur(4px);
231 | border-radius: 6px;
232 | box-shadow: 0px 0px 8px 0px rgba(10, 10, 14, 0.4);
233 | z-index: 101;
234 | }
235 |
236 | .head #menu-panel .menu-panel-content {
237 | display: flex;
238 | flex-direction: row;
239 | flex-wrap: wrap;
240 | justify-content: flex-end;
241 | gap: 16px;
242 | }
243 |
244 | .head #menu-panel .menu-panel-content li {
245 | --circle-size: 100px;
246 | border-radius: 9999px;
247 | padding: 6px 16px;
248 | cursor: pointer;
249 | background-color: #1F1F26;
250 | transition: .3s background ease-in-out;
251 | }
252 |
253 | .head #menu-panel .menu-panel-content li.nav, .head #menu-panel .menu-panel-content li.nav::before {
254 | background-color: #6361DC;
255 | }
256 |
257 | .head blockquote {
258 | position: absolute;
259 | inset: calc(20px + var(--height)) 0 0;
260 | font-size: 0;
261 | width: 100%;
262 | display: flex;
263 | align-items: flex-end;
264 | justify-content: center;
265 | }
266 |
267 | .head blockquote::after {
268 | content: '';
269 | position: absolute;
270 | bottom: 0;
271 | left: 0;
272 | right: 0;
273 | height: 20px;
274 | background: url("../assets/public/head_bottom_line.svg") no-repeat center top;
275 | z-index: -1;
276 | }
277 |
278 | .head blockquote img {
279 | margin-bottom: 10px;
280 | animation: rotate 6s linear infinite;
281 | }
282 |
283 | @keyframes rotate {
284 | 0% {
285 | transform: rotate(0deg);
286 | }
287 | 100% {
288 | transform: rotate(360deg);
289 | }
290 | }
291 |
292 | .footer {
293 | padding: 60px 40px 20px 40px;
294 | font-size: 12px;
295 | line-height: 20px;
296 | color: #62616F;
297 | }
298 |
299 | .footer .copyright {
300 | display: flex;
301 | justify-content: center;
302 | align-items: center;
303 | --mw: 968px;
304 | gap: 12px;
305 | }
306 |
307 | .footer .copyright .main {
308 | width: 100%;
309 | display: flex;
310 | justify-content: space-between;
311 | align-items: center;
312 | max-width: var(--mw);
313 | }
314 |
315 | .footer .copyright a {
316 | transition: color .15s ease-in;
317 | color: #62616F;
318 | }
319 |
320 | .footer .copyright a:hover {
321 | color: #6361DC;
322 | }
323 |
324 | .footer .copyright .friends {
325 | display: flex;
326 | justify-content: center;
327 | align-items: center;
328 | --mw: 968px;
329 | gap: 8px;
330 | }
331 |
332 | .footer .copyright .friends .main {
333 | width: 100%;
334 | display: flex;
335 | justify-content: space-between;
336 | align-items: center;
337 | max-width: var(--mw);
338 | }
339 |
340 | .widget {
341 | display: flex;
342 | justify-content: center;
343 | align-items: center;
344 | --mw: 968px;
345 | }
346 |
347 | .widget .main {
348 | width: 100%;
349 | display: flex;
350 | justify-content: space-between;
351 | align-items: center;
352 | max-width: var(--mw);
353 | }
354 |
355 | .widget .shape-light {
356 | z-index: -99;
357 | position: fixed;
358 | bottom: -180px;
359 | width: 600px;
360 | height: 200px;
361 | border-radius: 9999px;
362 | background: rgba(99, 97, 220, 0.4);
363 | filter: blur(100px);
364 | }
365 |
366 | .widget .shape-star {
367 | position: fixed;
368 | z-index: -98;
369 | bottom: 0;
370 | height: 150px;
371 | width: var(--mw);
372 | -webkit-mask-image: linear-gradient(180deg, rgba(217, 217, 217, 0) 0%, rgba(217, 217, 217, 0.8) 25%, #d9d9d9 50%, rgba(217, 217, 217, 0.8) 75%, rgba(217, 217, 217, 0) 100%);
373 | mask-image: linear-gradient(180deg, rgba(217, 217, 217, 0) 0%, rgba(217, 217, 217, 0.8) 25%, #d9d9d9 50%, rgba(217, 217, 217, 0.8) 75%, rgba(217, 217, 217, 0) 100%);
374 | -webkit-mask-size: cover;
375 | mask-size: cover;
376 | }
377 |
378 | @keyframes risingStarsAnination {
379 | 0% {
380 | transform: translateZ(0) translateY(0);
381 | }
382 | to {
383 | transform: translateZ(0) translateY(-2000px);
384 | }
385 | }
386 |
387 | .widget .shape-star .rising-stars {
388 | opacity: .7;
389 | pointer-events: none;
390 | }
391 |
392 | .widget .shape-star .rising-stars div {
393 | background: transparent;
394 | border-radius: 50%;
395 | }
396 |
397 | .widget .shape-star .rising-stars div:nth-child(1) {
398 | animation-duration: 100s !important;
399 | box-shadow: 136px 13273px #fff,347px 1735px #fff,813px 1674px #fff,1949px 440px #fff,1440px 41px #fff,437px 1122px #fff,406px 430px #fff,1014px 25px #fff,1330px 1616px #fff,1636px 1496px #fff,1358px 800px #fff,48px 857px #fff,900px 1821px #fff,906px 1975px #fff,832px 163px #fff,1911px 1480px #fff,576px 523px #fff,783px 1435px #fff,738px 1712px #fff,1822px 193px #fff,1168px 1172px #fff,480px 687px #fff,798px 337px #fff,1747px 824px #fff,1296px 1690px #fff,1277px 1786px #fff,1941px 1271px #fff,1925px 784px #fff,400px 1302px #fff,112px 882px #fff,1008px 1624px #fff,55px 1604px #fff,1143px 1555px #fff,1354px 1344px #fff,1687px 601px #fff,651px 617px #fff,984px 1737px #fff,505px 1689px #fff,634px 1460px #fff,770px 827px #fff,315px 833px #fff,192px 1677px #fff,1324px 580px #fff,1862px 1217px #fff,157px 1255px #fff,1265px 1949px #fff,259px 482px #fff,1925px 39px #fff,1823px 1401px #fff,172px 1227px #fff,1120px 662px #fff,621px 681px #fff,959px 1389px #fff,370px 367px #fff,1629px 754px #fff,117px 756px #fff,415px 19px #fff,1158px 1227px #fff,36px 322px #fff,315px 1172px #fff,1156px 1010px #fff,758px 828px #fff,1576px 1585px #fff,725px 1487px #fff,1987px 1199px #fff,832px 827px #fff,1162px 92px #fff,103px 1868px #fff,588px 198px #fff,695px 984px #fff,1256px 1513px #fff,29px 924px #fff,1991px 1022px #fff,317px 932px #fff,114px 1610px #fff,1073px 1420px #fff,1161px 1045px #fff,684px 312px #fff,250px 419px #fff,151px 76px #fff,1228px 400px #fff,1381px 202px #fff,1210px 207px #fff,951px 1633px #fff,1585px 1768px #fff,1187px 1462px #fff,231px 1455px #fff,1457px 1778px #fff,1604px 75px #fff,1952px 1575px #fff,1870px 10px #fff,1240px 1824px #fff,591px 554px #fff,1696px 112px #fff,1618px 662px #fff,860px 1971px #fff,899px 1140px #fff,1334px 285px #fff,1051px 732px #fff,267px 1737px #fff,1363px 965px #fff,1829px 1718px #fff,1966px 1063px #fff,979px 1908px #fff,1654px 1085px #fff,416px 1055px #fff,1758px 576px #fff,1604px 720px #fff,840px 143px #fff,852px 1385px #fff,411px 1808px #fff,992px 28px #fff,1461px 122px #fff,1110px 671px #fff,221px 1734px #fff,1886px 1139px #fff,1963px 1765px #fff,406px 456px #fff,461px 1710px #fff,524px 1305px #fff,905px 1265px #fff,731px 126px #fff,1748px 186px #fff,759px 1511px #fff,1502px 1174px #fff,163px 1326px #fff,1236px 416px #fff,963px 1543px #fff,509px 373px #fff,1965px 942px #fff,1621px 1614px #fff,211px 515px #fff,1064px 990px #fff,475px 715px #fff,1977px 366px #fff,1480px 1801px #fff,693px 701px #fff,944px 628px #fff,1870px 1324px #fff,1745px 442px #fff,753px 1087px #fff,1639px 620px #fff,1838px 1570px #fff,1945px 1028px #fff,1692px 1037px #fff,276px 440px #fff,668px 1787px #fff,440px 1541px #fff,1493px 199px #fff,1930px 1584px #fff,1856px 700px #fff,1161px 682px #fff,1671px 664px #fff,286px 1182px #fff,1933px 1388px #fff,743px 1367px #fff,849px 1823px #fff,136px 25px #fff,568px 102px #fff,659px 687px #fff,27px 211px #fff,1980px 602px #fff,383px 176px #fff,1124px 470px #fff,1143px 100px #fff,1744px 1751px #fff,689px 614px #fff,596px 1867px #fff,710px 883px #fff,637px 202px #fff,1372px 962px #fff,1595px 1650px #fff,1491px 1428px #fff,873px 235px #fff,1127px 582px #fff,700px 140px #fff,1470px 1395px #fff,1133px 1532px #fff,1736px 1749px #fff,1841px 228px #fff,529px 1790px #fff,1084px 1246px #fff,1365px 230px #fff,529px 304px #fff,528px 1689px #fff,1549px 1892px #fff,975px 1315px #fff,1924px 1909px #fff,423px 115px #fff,1198px 432px #fff,1081px 956px #fff,1890px 1360px #fff,872px 535px #fff,781px 630px #fff,1010px 197px #fff,651px 125px #fff,1569px 1159px #fff,233px 759px #fff,372px 139px #fff,742px 1233px #fff,302px 1514px #fff,1159px 879px #fff,1536px 213px #fff,1212px 49px #fff,897px 1653px #fff,1735px 765px #fff,1086px 410px #fff,609px 1933px #fff,127px 172px #fff,179px 1873px #fff,584px 299px #fff,861px 1050px #fff,400px 234px #fff,1401px 806px #fff,1086px 47px #fff,1735px 1844px #fff,1874px 1698px #fff,975px 720px #fff,164px 845px #fff,461px 66px #fff,894px 1102px #fff,151px 1968px #fff,258px 1303px #fff,366px 593px #fff,390px 1023px #fff,1296px 661px #fff,308px 285px #fff,554px 1926px #fff,1409px 527px #fff,1661px 316px #fff,101px 439px #fff,1051px 1323px #fff,1144px 1541px #fff,479px 16px #fff,1172px 911px #fff,1087px 1807px #fff,1699px 628px #fff,1859px 1056px #fff,571px 1977px #fff,137px 1578px #fff,906px 847px #fff,1071px 430px #fff,212px 323px #fff,353px 276px #fff,680px 316px #fff,1781px 1151px #fff,137px 1426px #fff,1270px 1679px #fff,696px 220px #fff,587px 184px #fff,704px 795px #fff,1646px 907px #fff,1546px 11px #fff,369px 1976px #fff,1199px 815px #fff,290px 913px #fff,159px 1921px #fff,955px 1406px #fff,748px 1132px #fff,1388px 1674px #fff,1390px 1925px #fff,961px 70px #fff,1015px 927px #fff,470px 64px #fff,1125px 684px #fff,615px 1839px #fff,1318px 1437px #fff,1338px 1130px #fff,295px 1857px #fff,1656px 1208px #fff,1550px 1250px #fff,595px 1523px #fff,943px 1812px #fff,976px 1048px #fff,175px 1883px #fff,641px 1066px #fff,1115px 758px #fff,1726px 1072px #fff,1403px 1085px #fff,1601px 935px #fff,221px 877px #fff,1318px 1484px #fff,1382px 1995px #fff,737px 1875px #fff,772px 1635px #fff,869px 1654px #fff,1179px 18px #fff,518px 695px #fff,691px 1963px #fff,1290px 1259px #fff,121px 1616px #fff,531px 1751px #fff,538px 968px #fff,1492px 1387px #fff,848px 1586px #fff,665px 1946px #fff,307px 984px #fff,593px 1790px #fff,282px 981px #fff,1383px 1886px #fff,1220px 1353px #fff,537px 1893px #fff,1228px 1085px #fff,1415px 532px #fff,660px 982px #fff,308px 1837px #fff,1644px 694px #fff,1137px 296px #fff,1010px 450px #fff,1405px 1366px #fff,1823px 1910px #fff,623px 1983px #fff,585px 716px #fff,1521px 888px #fff,334px 1235px #fff,989px 1957px #fff,1055px 1917px #fff,1012px 1921px #fff,502px 793px #fff,362px 394px #fff,437px 1451px #fff,49px 1224px #fff,1883px 326px #fff,235px 1679px #fff,355px 1148px #fff,204px 907px #fff,1405px 851px #fff,404px 986px #fff,126px 239px #fff,1311px 1960px #fff,1178px 804px #fff,692px 1467px #fff,523px 1043px #fff,259px 1128px #fff,940px 229px #fff,733px 590px #fff,845px 1397px #fff,64px 383px #fff,220px 1136px #fff,307px 48px #fff,1996px 1239px #fff,495px 322px #fff,1245px 1786px #fff,392px 26px #fff,1053px 835px #fff,68px 296px #fff,1165px 63px #fff,1992px 584px #fff,1947px 881px #fff,1012px 205px #fff,419px 1901px #fff,91px 667px #fff,558px 1692px #fff,129px 252px #fff,369px 428px #fff,241px 1865px #fff,289px 1345px #fff,1591px 1655px #fff,29px 585px #fff,489px 885px #fff,342px 307px #fff,589px 658px #fff,1069px 348px #fff,355px 690px #fff,1141px 483px #fff,299px 1211px #fff,217px 1040px #fff,266px 524px #fff,1151px 304px #fff,777px 1096px #fff,1166px 1726px #fff,1332px 819px #fff,986px 1727px #fff,87px 1949px #fff,1962px 83px #fff,133px 708px #fff,1603px 504px #fff,487px 1316px #fff,216px 863px #fff,877px 162px #fff,1234px 1181px #fff,1102px 1118px #fff,509px 475px #fff,621px 935px #fff,658px 589px #fff,665px 1606px #fff,878px 1542px #fff,864px 882px #fff,1070px 1310px #fff,1983px 1146px #fff,1673px 1885px #fff,1008px 351px #fff,1896px 494px #fff,1523px 1071px #fff,1424px 773px #fff,1077px 571px #fff,281px 602px #fff,19px 1135px #fff,852px 1826px #fff,1114px 1291px #fff,956px 257px #fff,1956px 1188px #fff,1779px 284px #fff,204px 613px #fff,1892px 1213px #fff,1787px 1914px #fff,1732px 695px #fff,1497px 375px #fff,1266px 1719px #fff,1668px 1242px #fff,931px 147px #fff,399px 1359px #fff,1626px 518px #fff,840px 1495px #fff,145px 926px #fff,924px 46px #fff,1907px 1649px #fff,953px 1435px #fff,1530px 373px #fff,320px 1346px #fff,1007px 581px #fff,897px 46px #fff,926px 1693px #fff,1187px 370px #fff,69px 939px #fff,64px 1548px #fff,66px 491px #fff,1871px 676px #fff,1240px 722px #fff,1223px 216px #fff,1743px 1566px #fff,1901px 1944px #fff,918px 583px #fff,285px 601px #fff,1303px 263px #fff,1156px 1288px #fff,1897px 61px #fff,463px 1533px #fff,98px 1153px #fff,1430px 1811px #fff,304px 651px #fff,722px 260px #fff,219px 1577px #fff,157px 112px #fff,1146px 1534px #fff,972px 230px #fff,529px 962px #fff,91px 947px #fff,410px 1245px #fff,1556px 586px #fff,591px 1038px #fff,1571px 892px #fff,236px 1129px #fff,976px 1915px #fff,903px 590px #fff,939px 521px #fff,697px 859px #fff,1192px 71px #fff,614px 366px #fff,1197px 1094px #fff,1433px 839px #fff,1689px 1700px #fff,1023px 1084px #fff,176px 1110px #fff,12px 830px #fff,1880px 1619px #fff,1914px 994px #fff,218px 987px #fff,1585px 517px #fff,1837px 502px #fff,1878px 1043px #fff,30px 837px #fff,1582px 1999px #fff,1698px 940px #fff,613px 266px #fff,1628px 29px #fff,1113px 180px #fff,239px 269px #fff,1903px 449px #fff,1788px 1095px #fff,51px 1761px #fff,421px 1073px #fff,353px 292px #fff,1612px 749px #fff,986px 601px #fff,450px 343px #fff,1386px 1341px #fff,204px 848px #fff,1527px 110px #fff,379px 1993px #fff,820px 1197px #fff,279px 1804px #fff,160px 1801px #fff,1475px 1135px #fff,1374px 1626px #fff,873px 1542px #fff,1637px 1435px #fff,470px 1761px #fff,628px 919px #fff,628px 574px #fff;
400 | }
401 |
402 | .widget .shape-star .rising-stars div:nth-child(2) {
403 | animation-duration: 150s !important;
404 | box-shadow: 1046px 2770px #fff,584px 202px #fff,195px 1038px #fff,84px 741px #fff,466px 961px #fff,192px 609px #fff,704px 571px #fff,1498px 1059px #fff,21px 1214px #fff,643px 408px #fff,848px 514px #fff,420px 1928px #fff,866px 698px #fff,1071px 119px #fff,1284px 570px #fff,907px 89px #fff,1990px 137px #fff,768px 1886px #fff,1602px 623px #fff,223px 255px #fff,1224px 1955px #fff,1216px 1001px #fff,817px 1781px #fff,1586px 684px #fff,221px 71px #fff,1885px 1713px #fff,1441px 15px #fff,1946px 1649px #fff,437px 1773px #fff,1831px 657px #fff,1230px 220px #fff,906px 1681px #fff,906px 184px #fff,1689px 859px #fff,1655px 564px #fff,1900px 1354px #fff,378px 1964px #fff,985px 1685px #fff,1357px 999px #fff,1518px 1502px #fff,1068px 338px #fff,920px 1753px #fff,1589px 1108px #fff,1212px 1920px #fff,199px 596px #fff,172px 67px #fff,1104px 797px #fff,682px 571px #fff,228px 1285px #fff,401px 751px #fff,558px 1703px #fff,1382px 736px #fff,463px 1746px #fff,579px 1384px #fff,208px 1771px #fff,290px 881px #fff,408px 1189px #fff,1024px 768px #fff,247px 282px #fff,1254px 1274px #fff,592px 1785px #fff,460px 914px #fff,275px 429px #fff,991px 93px #fff,1961px 429px #fff,998px 1797px #fff,1363px 1258px #fff,1387px 611px #fff,1850px 482px #fff,401px 482px #fff,899px 966px #fff,1424px 1844px #fff,1555px 1899px #fff,625px 506px #fff,41px 219px #fff,958px 1518px #fff,1894px 717px #fff,1207px 807px #fff,183px 614px #fff,1146px 467px #fff,349px 1521px #fff,587px 1330px #fff,940px 1640px #fff,1167px 1990px #fff,1728px 1870px #fff,88px 336px #fff,1326px 944px #fff,1103px 117px #fff,1531px 1508px #fff,588px 1497px #fff,1193px 1036px #fff,475px 345px #fff,775px 731px #fff,1189px 411px #fff,1657px 108px #fff,828px 1788px #fff,622px 357px #fff,1441px 1292px #fff,1332px 361px #fff,979px 376px #fff,504px 412px #fff,1470px 290px #fff,1422px 1637px #fff,911px 1694px #fff,1304px 1729px #fff,1378px 890px #fff,181px 1238px #fff,166px 1011px #fff,570px 823px #fff,1842px 771px #fff,1495px 189px #fff,324px 1077px #fff,850px 883px #fff,1718px 1273px #fff,1559px 215px #fff,425px 254px #fff,114px 1855px #fff,1425px 253px #fff,1327px 477px #fff,1644px 234px #fff,851px 1060px #fff,384px 1151px #fff,78px 433px #fff,269px 847px #fff,11px 1426px #fff,1583px 31px #fff,1067px 48px #fff,1532px 544px #fff,1418px 923px #fff,1609px 1733px #fff,96px 1597px #fff,1818px 421px #fff,1059px 181px #fff,156px 1830px #fff,1565px 11px #fff,989px 287px #fff,827px 459px #fff,1730px 1155px #fff,688px 939px #fff,694px 6px #fff,360px 1041px #fff,1230px 1560px #fff,1228px 1637px #fff,207px 460px #fff,1869px 627px #fff,69px 872px #fff,438px 154px #fff,217px 721px #fff,141px 678px #fff,606px 1622px #fff,1836px 1505px #fff,568px 1817px #fff,1692px 901px #fff,1726px 1257px #fff,272px 77px #fff,1327px 405px #fff,833px 628px #fff,974px 782px #fff,828px 1085px #fff,1516px 57px #fff,1432px 279px #fff,1308px 608px #fff,419px 1365px #fff,989px 1354px #fff,343px 557px #fff,1787px 1617px #fff,609px 281px #fff,397px 635px #fff,330px 1483px #fff,1039px 1891px #fff,623px 390px #fff,849px 1113px #fff,774px 1584px #fff,339px 1374px #fff,910px 294px #fff,348px 1997px #fff,961px 1571px #fff,108px 1103px #fff,761px 1908px #fff,1612px 1543px #fff,1978px 1013px #fff,1420px 170px #fff,250px 157px #fff,760px 804px #fff,503px 1240px #fff,913px 1425px #fff,694px 541px #fff,999px 1757px #fff,1792px 865px #fff,521px 1962px #fff,892px 1943px #fff,1266px 744px #fff,1315px 121px #fff,957px 1880px #fff,1387px 334px #fff,101px 132px #fff,760px 1557px #fff,1100px 112px #fff,879px 173px #fff,1712px 1707px #fff,888px 28px #fff,33px 1189px #fff,1316px 1591px #fff,254px 1751px #fff,494px 1485px #fff,1654px 782px #fff,1983px 693px #fff,754px 1919px #fff,1116px 85px #fff,1417px 634px #fff,343px 657px #fff,481px 1867px #fff,805px 1831px #fff,213px 1734px #fff,1305px 225px #fff,1158px 1852px #fff,1335px 1897px #fff,995px 514px #fff,1297px 1704px #fff,732px 25px #fff,1190px 1980px #fff,515px 1537px #fff,1675px 639px #fff,1693px 1862px #fff,417px 1885px #fff,1303px 1332px #fff,1422px 259px #fff,1176px 1403px #fff,1477px 980px #fff,1960px 461px #fff,99px 980px #fff,1139px 418px #fff,1357px 487px #fff,1009px 1329px #fff,293px 355px #fff,301px 464px #fff,222px 138px #fff,307px 265px #fff,989px 856px #fff,182px 1885px #fff,1064px 1909px #fff,885px 155px #fff,403px 166px #fff,1540px 1180px #fff,310px 1519px #fff,777px 496px #fff,664px 1389px #fff,1950px 758px #fff,63px 1412px #fff,1247px 1151px #fff,365px 60px #fff,1793px 502px #fff,533px 320px #fff,927px 766px #fff,206px 340px #fff,1261px 292px #fff,1908px 1564px #fff,99px 50px #fff,1693px 1858px #fff,641px 1034px #fff,1063px 453px #fff,1973px 163px #fff,712px 600px #fff,264px 1682px #fff,1686px 289px #fff,1305px 745px #fff,30px 349px #fff,649px 1772px #fff,1032px 141px #fff,204px 1345px #fff,46px 289px #fff,173px 466px #fff,1369px 1116px #fff,528px 196px #fff,1355px 1117px #fff,1344px 1192px #fff,220px 304px #fff,1816px 1984px #fff,1903px 683px #fff,389px 934px #fff,79px 1352px #fff,1317px 1295px #fff,1169px 1389px #fff,1061px 914px #fff,1777px 1736px #fff,1859px 286px #fff,1479px 569px #fff,930px 1613px #fff,1892px 682px #fff,867px 1193px #fff,40px 1606px #fff,624px 1860px #fff,1829px 1897px #fff,1891px 1944px #fff,1633px 1642px #fff,71px 627px #fff,1334px 1548px #fff,1461px 1437px #fff,220px 547px #fff,334px 907px #fff,1512px 34px #fff,789px 64px #fff,190px 1169px #fff,358px 22px #fff,438px 115px #fff,1576px 248px #fff,117px 836px #fff,957px 1773px #fff,213px 1553px #fff,1211px 1094px #fff,1768px 1569px #fff,541px 725px #fff,1027px 1196px #fff,996px 677px #fff,1406px 1504px #fff,707px 1457px #fff,1704px 445px #fff,1403px 1557px #fff,1743px 223px #fff,1866px 1923px #fff,1137px 762px #fff,1566px 1760px #fff,1289px 1717px #fff,1397px 634px #fff,1286px 516px #fff,1179px 1503px #fff,1143px 1306px #fff,489px 1107px #fff,1663px 145px #fff,1553px 1813px #fff,1611px 1558px #fff,969px 946px #fff,243px 25px #fff,518px 117px #fff,1510px 12px #fff,1461px 1296px #fff,453px 697px #fff,726px 1082px #fff,1727px 410px #fff,1242px 1258px #fff,1847px 1331px #fff,1746px 1023px #fff,972px 1887px #fff,704px 453px #fff,424px 993px #fff,1437px 797px #fff,1947px 235px #fff,916px 1060px #fff,1034px 1354px #fff,723px 1738px #fff,447px 1609px #fff,167px 780px #fff,462px 1224px #fff,704px 1676px #fff,1880px 495px #fff,665px 1497px #fff,773px 1221px #fff,471px 771px #fff,549px 221px #fff,846px 242px #fff,638px 300px #fff,75px 492px #fff,856px 1803px #fff,1605px 1288px #fff,740px 11px #fff,1009px 1229px #fff,650px 1734px #fff,565px 1651px #fff,1314px 949px #fff,852px 1135px #fff,1742px 360px #fff,512px 487px #fff,965px 1638px #fff,619px 1818px #fff,982px 838px #fff,36px 1269px #fff,14px 542px #fff,1913px 1614px #fff,1231px 1455px #fff,950px 1539px #fff,1599px 124px #fff,854px 661px #fff,45px 810px #fff,1098px 425px #fff,1088px 579px #fff,100px 673px #fff,1729px 1110px #fff,35px 507px #fff,435px 708px #fff,893px 127px #fff,953px 1523px #fff,1067px 1352px #fff,1806px 376px #fff,738px 1173px #fff,676px 1910px #fff,405px 805px #fff,1289px 1838px #fff,1794px 677px #fff,1727px 1763px #fff,729px 181px #fff,417px 1509px #fff,402px 867px #fff,1047px 1577px #fff,1748px 619px #fff,815px 156px #fff,1668px 13px #fff,285px 1014px #fff,499px 1355px #fff,384px 819px #fff,364px 1484px #fff,968px 534px #fff,1935px 1915px #fff,662px 870px #fff,1837px 1960px #fff,1063px 1369px #fff,388px 271px #fff,1406px 1113px #fff,1909px 897px #fff,506px 101px #fff,680px 1579px #fff,1908px 1476px #fff,1065px 1308px #fff,892px 1806px #fff,1303px 1738px #fff,1112px 935px #fff,1112px 354px #fff,799px 1222px #fff,1131px 1922px #fff,341px 1281px #fff,744px 298px #fff,1519px 698px #fff,934px 1143px #fff,989px 584px #fff,1250px 161px #fff,49px 1336px #fff,1154px 1944px #fff,260px 1720px #fff,243px 963px #fff,1336px 834px #fff,1373px 578px #fff,1624px 146px #fff,493px 141px #fff,991px 1986px #fff,715px 465px #fff,1380px 373px #fff,1134px 284px #fff,1469px 1534px #fff,1074px 1672px #fff,836px 1225px #fff,1115px 1213px #fff,500px 509px #fff,350px 817px #fff,1352px 1204px #fff,530px 786px #fff,53px 906px #fff,414px 601px #fff,977px 552px #fff,447px 196px #fff,67px 548px #fff,837px 399px #fff,1786px 792px #fff,1681px 1843px #fff,1695px 847px #fff,726px 768px #fff,667px 1145px #fff,382px 395px #fff,502px 1182px #fff,1930px 100px #fff,492px 1356px #fff,221px 977px #fff,998px 848px #fff,482px 531px #fff,497px 239px #fff,1795px 681px #fff,1721px 1218px #fff,521px 349px #fff,1573px 1747px #fff,294px 1103px #fff,39px 235px #fff,1502px 1754px #fff,1918px 1587px #fff,1448px 604px #fff,583px 62px #fff,790px 1923px #fff,510px 344px #fff,165px 1091px #fff,1474px 1639px #fff,1577px 1452px #fff,1017px 99px #fff,1547px 679px #fff,852px 1216px #fff,83px 1818px #fff,1240px 1423px #fff,1122px 1475px #fff,418px 230px #fff,1989px 1326px #fff,1828px 1633px #fff,1412px 373px #fff,685px 1113px #fff,1909px 1468px #fff;
405 | opacity: .5;
406 | }
407 |
408 | .widget .shape-star .rising-stars div:nth-child(3) {
409 | animation-duration: 200s !important;
410 | box-shadow: 1858px 10327px #fff,1161px 1700px #fff,271px 1050px #fff,1378px 1738px #fff,1479px 1467px #fff,1866px 1558px #fff,802px 12px #fff,1322px 341px #fff,1593px 1458px #fff,1500px 710px #fff,1933px 1717px #fff,487px 1255px #fff,1547px 240px #fff,1460px 931px #fff,1725px 1308px #fff,69px 335px #fff,802px 1969px #fff,1621px 1871px #fff,1553px 113px #fff,1166px 124px #fff,1987px 79px #fff,180px 1271px #fff,466px 765px #fff,129px 1528px #fff,73px 117px #fff,1836px 1944px #fff,335px 125px #fff,145px 364px #fff,1864px 1974px #fff,525px 559px #fff,865px 876px #fff,1097px 828px #fff,1544px 1001px #fff,1362px 411px #fff,1218px 312px #fff,185px 1270px #fff,1273px 493px #fff,1241px 1593px #fff,1410px 1164px #fff,398px 1009px #fff,1700px 570px #fff,1985px 937px #fff,706px 958px #fff,651px 1650px #fff,765px 1675px #fff,1557px 316px #fff,779px 1365px #fff,1150px 581px #fff,251px 1600px #fff,1244px 906px #fff,912px 1051px #fff,733px 1393px #fff,1081px 847px #fff,592px 420px #fff,1820px 736px #fff,912px 807px #fff,1925px 711px #fff,1862px 1277px #fff,985px 1024px #fff,162px 1318px #fff,1714px 559px #fff,1588px 1205px #fff,763px 955px #fff,1760px 1228px #fff,756px 1980px #fff,1119px 382px #fff,1887px 1961px #fff,1869px 798px #fff,1105px 800px #fff,1110px 1166px #fff,1669px 1354px #fff,1014px 128px #fff,290px 692px #fff,1666px 102px #fff,249px 559px #fff,1874px 1811px #fff,1998px 1676px #fff,1728px 1882px #fff,1730px 736px #fff,890px 426px #fff,1388px 1047px #fff,701px 374px #fff,1542px 1736px #fff,781px 163px #fff,791px 809px #fff,1649px 438px #fff,1094px 1475px #fff,241px 382px #fff,1632px 1472px #fff,62px 1676px #fff,1154px 909px #fff,501px 1121px #fff,886px 526px #fff,1587px 1752px #fff,1247px 131px #fff,1800px 242px #fff,590px 1059px #fff,837px 1819px #fff,281px 1355px #fff,161px 1898px #fff,1465px 371px #fff,1578px 823px #fff,877px 1360px #fff,276px 1713px #fff,296px 522px #fff,804px 173px #fff,1793px 617px #fff,1622px 1824px #fff,237px 1068px #fff,1933px 545px #fff,1543px 1870px #fff,884px 578px #fff,125px 250px #fff,986px 882px #fff,1400px 1211px #fff,570px 1508px #fff,1449px 115px #fff,726px 914px #fff,1499px 1532px #fff,1308px 968px #fff,1876px 630px #fff,843px 606px #fff,144px 1085px #fff,878px 1315px #fff,1779px 1571px #fff,1145px 1510px #fff,1368px 1857px #fff,852px 627px #fff,1680px 641px #fff,1652px 1798px #fff,1303px 1056px #fff,1391px 45px #fff,365px 972px #fff,1031px 1860px #fff,1806px 1213px #fff,1249px 233px #fff,1126px 1513px #fff,1921px 1055px #fff,1490px 1176px #fff,641px 1781px #fff,1640px 854px #fff,542px 1083px #fff,106px 679px #fff,1423px 857px #fff,1254px 781px #fff,1775px 950px #fff,681px 239px #fff,756px 478px #fff,1199px 973px #fff,346px 1704px #fff,421px 911px #fff,339px 1168px #fff,586px 1762px #fff,801px 274px #fff,1901px 1693px #fff,914px 1706px #fff,976px 1023px #fff,787px 802px #fff,1057px 1614px #fff,438px 173px #fff,56px 1526px #fff,258px 1960px #fff,1756px 4px #fff,434px 1702px #fff,1590px 1362px #fff,607px 1053px #fff,1510px 1225px #fff,683px 262px #fff,184px 1205px #fff,1579px 891px #fff,131px 1755px #fff,1929px 761px #fff,1867px 1152px #fff,1875px 280px #fff,271px 1683px #fff,671px 1224px #fff,1836px 1011px #fff,1323px 1211px #fff,1149px 1503px #fff,57px 1496px #fff,149px 647px #fff,1927px 142px #fff,381px 1755px #fff,265px 1660px #fff,322px 1161px #fff,946px 304px #fff,1616px 1035px #fff,1283px 1371px #fff,1232px 1532px #fff,1869px 387px #fff,1101px 1882px #fff,1428px 1762px #fff,1666px 620px #fff,444px 739px #fff,1525px 1091px #fff,1372px 1186px #fff,1733px 898px #fff,1076px 72px #fff,538px 1382px #fff,424px 1995px #fff,571px 526px #fff,412px 521px #fff,1372px 564px #fff,1358px 1203px #fff,1427px 689px #fff,1599px 1873px #fff,589px 384px #fff,855px 739px #fff,1431px 1233px #fff,983px 1877px #fff,1174px 1911px #fff,1194px 337px #fff,206px 865px #fff,621px 423px #fff,934px 1528px #fff,853px 1336px #fff,722px 1341px #fff,1806px 1361px #fff,1077px 281px #fff,1298px 79px #fff,258px 389px #fff,666px 560px #fff,1898px 1083px #fff,869px 1141px #fff,345px 1500px #fff,1025px 1327px #fff,1953px 302px #fff,1709px 773px #fff,1565px 467px #fff,1937px 55px #fff,435px 510px #fff,833px 271px #fff,711px 1105px #fff,121px 1869px #fff,1934px 948px #fff,175px 387px #fff,899px 1971px #fff,1784px 1443px #fff,1080px 1296px #fff,1733px 1938px #fff,677px 949px #fff,998px 1514px #fff,455px 1734px #fff,318px 574px #fff,140px 84px #fff,1555px 1854px #fff,1244px 471px #fff,874px 1216px #fff,1590px 358px #fff,1251px 1027px #fff,855px 1210px #fff,540px 1026px #fff,1035px 1680px #fff,814px 1264px #fff,1852px 974px #fff,757px 1443px #fff,836px 22px #fff,1477px 1364px #fff,92px 1002px #fff,114px 1147px #fff,748px 1621px #fff,1293px 1083px #fff,1222px 40px #fff,1870px 210px #fff,943px 1762px #fff,340px 785px #fff,916px 1916px #fff,1993px 1791px #fff,1811px 556px #fff,1839px 1073px #fff,1193px 331px #fff,613px 35px #fff,1858px 1384px #fff,1730px 1678px #fff,1379px 787px #fff,1312px 73px #fff,231px 1475px #fff,903px 939px #fff,1037px 801px #fff,853px 631px #fff,1256px 861px #fff,1329px 685px #fff,1078px 115px #fff,229px 876px #fff,667px 1493px #fff,418px 674px #fff,558px 1881px #fff,1745px 633px #fff,1677px 676px #fff,1407px 616px #fff,1874px 67px #fff,276px 1509px #fff,1757px 543px #fff,280px 249px #fff,1738px 609px #fff,1908px 23px #fff,1677px 580px #fff,32px 1763px #fff,32px 447px #fff,1702px 1504px #fff,1190px 1477px #fff,215px 82px #fff,327px 407px #fff,1559px 1114px #fff,933px 668px #fff,451px 621px #fff,1929px 846px #fff,32px 774px #fff,1956px 1642px #fff,1475px 1964px #fff,676px 1033px #fff,1810px 1514px #fff,1518px 1712px #fff,1436px 1851px #fff,523px 1439px #fff,374px 1219px #fff,609px 1850px #fff,1515px 1935px #fff,54px 775px #fff,1775px 1760px #fff,638px 1563px #fff,319px 560px #fff,1624px 180px #fff,156px 879px #fff,997px 296px #fff,1015px 1008px #fff,1003px 1273px #fff,1916px 585px #fff,729px 692px #fff,576px 742px #fff,346px 1712px #fff,1632px 1017px #fff,1820px 1786px #fff,529px 1067px #fff,1641px 1899px #fff,1034px 1776px #fff,936px 1016px #fff,1372px 1163px #fff,1877px 117px #fff,1400px 1800px #fff,855px 1426px #fff,1333px 1970px #fff,686px 628px #fff,1594px 1839px #fff,1025px 475px #fff,103px 738px #fff,1984px 632px #fff,1471px 1777px #fff,761px 1601px #fff,1892px 277px #fff,1134px 1234px #fff,1811px 198px #fff,87px 704px #fff,1651px 1976px #fff,52px 1767px #fff,704px 1337px #fff,802px 191px #fff,1558px 1521px #fff,561px 1204px #fff,693px 921px #fff,97px 1563px #fff,855px 1409px #fff,458px 250px #fff,144px 1721px #fff,1783px 863px #fff,1595px 691px #fff,345px 308px #fff,1528px 1854px #fff,989px 130px #fff,1325px 1593px #fff,206px 749px #fff,836px 1724px #fff,1278px 208px #fff,232px 829px #fff,199px 638px #fff,1519px 215px #fff,14px 69px #fff,1677px 1092px #fff,1894px 579px #fff,958px 408px #fff,105px 377px #fff,896px 1369px #fff,1793px 864px #fff,279px 987px #fff,1431px 636px #fff,1255px 1430px #fff,1169px 79px #fff,920px 227px #fff,1211px 721px #fff,535px 552px #fff,51px 332px #fff,933px 146px #fff,377px 1335px #fff,249px 63px #fff,1535px 535px #fff,457px 616px #fff,1722px 813px #fff,998px 1478px #fff,308px 1395px #fff,1860px 1153px #fff,146px 1334px #fff,1200px 1599px #fff,1758px 861px #fff,1676px 1494px #fff,344px 1423px #fff,1281px 1775px #fff,1617px 942px #fff,190px 660px #fff,1783px 399px #fff,1364px 1781px #fff,1439px 1725px #fff,146px 1650px #fff,1209px 656px #fff,1181px 938px #fff,1710px 72px #fff,1176px 757px #fff,219px 1728px #fff,1271px 353px #fff,471px 665px #fff,1212px 1531px #fff,1805px 1687px #fff,1225px 1591px #fff,107px 532px #fff,7px 1980px #fff,1366px 89px #fff,1276px 574px #fff,1200px 1144px #fff,1886px 924px #fff,665px 1543px #fff,1418px 55px #fff,1755px 1828px #fff,1626px 48px #fff,697px 1868px #fff,901px 1643px #fff,21px 1696px #fff,932px 1471px #fff,1468px 1972px #fff,1682px 1786px #fff,323px 332px #fff,1798px 1661px #fff,827px 1124px #fff,1790px 1828px #fff,1117px 219px #fff,364px 1082px #fff,808px 1877px #fff,1542px 1281px #fff,1929px 704px #fff,1867px 1408px #fff,1850px 1264px #fff,299px 199px #fff,413px 1414px #fff,117px 1574px #fff,1361px 61px #fff,746px 1194px #fff,1719px 1803px #fff,374px 155px #fff,140px 570px #fff,1797px 850px #fff,1540px 509px #fff,1278px 603px #fff,1520px 1385px #fff,805px 207px #fff,1977px 1386px #fff,1452px 1361px #fff,937px 38px #fff,1294px 1911px #fff,1898px 1002px #fff,657px 972px #fff,1050px 641px #fff,1072px 255px #fff,438px 638px #fff,261px 1056px #fff,620px 1078px #fff,558px 1957px #fff,1767px 1500px #fff,182px 565px #fff,565px 48px #fff,227px 504px #fff,1483px 371px #fff,693px 236px #fff,766px 317px #fff,1305px 669px #fff,885px 537px #fff,1935px 44px #fff,1391px 1152px #fff,220px 1369px #fff,654px 1800px #fff,1974px 264px #fff,1930px 959px #fff,1197px 1905px #fff,543px 1035px #fff,156px 1975px #fff,1828px 1156px #fff,319px 242px #fff,1657px 83px #fff,682px 879px #fff,1293px 1716px #fff,1561px 739px #fff,1365px 927px #fff,1753px 812px #fff;
411 | opacity: .3;
412 | }
413 |
414 | .widget .shape-star .rising-stars-visible div {
415 | animation: risingStarsAnination linear infinite;
416 | }
417 |
418 | .widget .shape-earth {
419 | position: fixed;
420 | z-index: -97;
421 | bottom: -1840px;
422 | width: 1920px;
423 | height: 1920px;
424 | border-radius: 9999px;
425 | background: #0E0E13;
426 | filter: blur(2px);
427 | }
428 |
429 | .index {
430 | display: flex;
431 | justify-content: center;
432 | align-items: center;
433 | --mw: 968px;
434 | flex-direction: column;
435 | justify-content: flex-start;
436 | padding: 96px 40px 60px 40px;
437 | min-height: calc(100vh - 100px);
438 | /* 防止项目数量不够一屏高度时 footer 上移 */
439 | }
440 |
441 | .index .main {
442 | width: 100%;
443 | display: flex;
444 | justify-content: space-between;
445 | align-items: center;
446 | max-width: var(--mw);
447 | }
448 |
449 | .index .hello {
450 | display: flex;
451 | justify-content: center;
452 | align-items: center;
453 | --mw: 968px;
454 | height: 400px;
455 | width: 100%;
456 | max-width: var(--mw);
457 | flex-direction: column;
458 | }
459 |
460 | .index .hello .main {
461 | width: 100%;
462 | display: flex;
463 | justify-content: space-between;
464 | align-items: center;
465 | max-width: var(--mw);
466 | }
467 |
468 | .index .hello .title {
469 | display: flex;
470 | justify-content: center;
471 | align-items: flex-start;
472 | gap: 8px;
473 | }
474 |
475 | .index .hello .title * {
476 | font-size: 32px;
477 | font-weight: 700;
478 | }
479 |
480 | .index .hello .title .title-hi {
481 | font-size: 32px;
482 | font-weight: 700;
483 | background: linear-gradient(180deg, #E8E8F6 0%, rgba(232, 232, 246, 0.72) 100%);
484 | background-clip: text;
485 | -webkit-background-clip: text;
486 | -webkit-text-fill-color: transparent;
487 | }
488 |
489 | .index .hello .title .title-name {
490 | --bg: linear-gradient(90deg, #A29CD3 0%, #E8BFAC 100%);
491 | position: relative;
492 | background: var(--bg);
493 | background-clip: text;
494 | -webkit-background-clip: text;
495 | -webkit-text-fill-color: transparent;
496 | }
497 |
498 | .index .hello .title .title-name:hover::after {
499 | content: '';
500 | position: absolute;
501 | inset: auto 0 0;
502 | width: 100%;
503 | height: 1px;
504 | background: var(--bg);
505 | }
506 |
507 | .index .hello .hello-desc {
508 | height: 28px;
509 | color: #B3B3C1;
510 | font-size: 16px;
511 | line-height: 28px;
512 | font-weight: 300;
513 | letter-spacing: 1px;
514 | margin: 24px 0 0 0;
515 | }
516 |
517 | .index .hello::after {
518 | content: '';
519 | position: absolute;
520 | width: 512px;
521 | height: 512px;
522 | background-image: radial-gradient(circle at center, rgba(255, 255, 255, 0.3) 1px, transparent 1px);
523 | background-size: 8px 8px;
524 | mask-image: radial-gradient(at center, #fff, transparent 72%);
525 | -webkit-mask-image: radial-gradient(at center, #fff, transparent 72%);
526 | opacity: 0.6;
527 | z-index: -1;
528 | }
529 |
530 | .index .content-divider {
531 | display: flex;
532 | justify-content: center;
533 | align-items: center;
534 | --mw: 968px;
535 | width: 100%;
536 | max-width: var(--mw);
537 | height: 1px;
538 | background-image: radial-gradient(circle at center, #4E4E64 1px, transparent 1px);
539 | background-size: 6px 1px;
540 | background-repeat: repeat;
541 | mask-image: radial-gradient(at center, #fff, transparent 90%);
542 | -webkit-mask-image: radial-gradient(at center, #fff, transparent 90%);
543 | }
544 |
545 | .index .content-divider .main {
546 | width: 100%;
547 | display: flex;
548 | justify-content: space-between;
549 | align-items: center;
550 | max-width: var(--mw);
551 | }
552 |
553 | .index .quickly-link {
554 | display: flex;
555 | justify-content: center;
556 | align-items: center;
557 | --mw: 968px;
558 | flex-direction: column;
559 | padding-top: 80px;
560 | width: 100%;
561 | max-width: var(--mw);
562 | }
563 |
564 | .index .quickly-link .main {
565 | width: 100%;
566 | display: flex;
567 | justify-content: space-between;
568 | align-items: center;
569 | max-width: var(--mw);
570 | }
571 |
572 | .index .quickly-link .title-hi {
573 | font-size: 32px;
574 | font-weight: 700;
575 | background: linear-gradient(180deg, #E8E8F6 0%, rgba(232, 232, 246, 0.72) 100%);
576 | background-clip: text;
577 | -webkit-background-clip: text;
578 | -webkit-text-fill-color: transparent;
579 | }
580 |
581 | .index .quickly-link .loader {
582 | margin: 32px 0 48px 0;
583 | width: 40px;
584 | height: 8px;
585 | --c: #6361DC 90deg, #0E0E13 0;
586 | background: conic-gradient(from 135deg at top, var(--c)) 0 0, conic-gradient(from -45deg at bottom, var(--c)) 0 100%;
587 | background-size: calc(100%/4) 50%;
588 | background-repeat: repeat-x;
589 | animation: l12 2s infinite;
590 | }
591 |
592 | @keyframes l12 {
593 | 60%, 100% {
594 | background-position: calc(100%/3) 0, calc(100%/-3) 100%;
595 | }
596 | }
597 |
598 | .index .quickly-link .link-card {
599 | display: flex;
600 | justify-content: center;
601 | align-items: center;
602 | --mw: 968px;
603 | flex-direction: column;
604 | gap: 16px;
605 | width: 100%;
606 | max-width: var(--mw);
607 | }
608 |
609 | .index .quickly-link .link-card .main {
610 | width: 100%;
611 | display: flex;
612 | justify-content: space-between;
613 | align-items: center;
614 | max-width: var(--mw);
615 | }
616 |
617 | .index .quickly-link .link-card .link-card-list {
618 | width: 100%;
619 | max-width: var(--mw);
620 | display: grid;
621 | grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
622 | grid-gap: 16px;
623 | }
624 |
625 | .index .quickly-link .link-card .link-card-list .link-card-item {
626 | background-color: #141419;
627 | box-shadow: 0px 0px 8px 0px rgba(10, 10, 14, 0.4);
628 | --circle-size: 400px;
629 | }
630 |
631 | .index .quickly-link .link-card .link-card-list .link-card-item * {
632 | transition: opacity .4s;
633 | }
634 |
635 | .index .quickly-link .link-card .link-card-list .link-card-item a {
636 | width: 100%;
637 | display: flex;
638 | flex-direction: row;
639 | align-items: center;
640 | padding: 16px;
641 | gap: 12px;
642 | }
643 |
644 | .index .quickly-link .link-card .link-card-list .link-card-item a:hover {
645 | color: #6361DC;
646 | transition: all .15s ease-in;
647 | }
648 |
649 | .index .quickly-link .link-card .link-card-list .link-card-item a:hover .info,
650 | .index .quickly-link .link-card .link-card-list .link-card-item a:hover .icon-arrow,
651 | .index .quickly-link .link-card .link-card-list .link-card-item a:hover img {
652 | opacity: 1;
653 | }
654 |
655 | .index .quickly-link .link-card .link-card-list .link-card-item img {
656 | width: 40px;
657 | opacity: .6;
658 | }
659 |
660 | .index .quickly-link .link-card .link-card-list .link-card-item .info {
661 | width: 100%;
662 | display: flex;
663 | flex-direction: column;
664 | align-items: flex-start;
665 | gap: 4px;
666 | opacity: .8;
667 | }
668 |
669 | .index .quickly-link .link-card .link-card-list .link-card-item .info .info-title {
670 | width: 100%;
671 | font-size: 14px;
672 | font-weight: 500;
673 | line-height: 24px;
674 | background: linear-gradient(180deg, #E8E8F6 0%, rgba(232, 232, 246, 0.72) 100%);
675 | background-clip: text;
676 | -webkit-background-clip: text;
677 | -webkit-text-fill-color: transparent;
678 | }
679 |
680 | .index .quickly-link .link-card .link-card-list .link-card-item .info .info-desc {
681 | width: 100%;
682 | font-size: 12px;
683 | font-weight: 400;
684 | line-height: 20px;
685 | color: #B3B3C1;
686 | }
687 |
688 | .index .quickly-link .link-card .link-card-list .link-card-item .icon-arrow {
689 | width: 14px;
690 | height: 14px;
691 | opacity: 0;
692 | }
693 |
694 | .work {
695 | display: flex;
696 | justify-content: center;
697 | align-items: center;
698 | --mw: 968px;
699 | padding: 154px 40px 60px 40px;
700 | flex-direction: column;
701 | align-items: center;
702 | justify-content: flex-start;
703 | min-height: calc(100vh - 100px);
704 | /* 防止项目数量不够一屏高度时 footer 上移 */
705 | }
706 |
707 | .work .main {
708 | width: 100%;
709 | display: flex;
710 | justify-content: space-between;
711 | align-items: center;
712 | max-width: var(--mw);
713 | }
714 |
715 | .work .card-list {
716 | width: 100%;
717 | max-width: var(--mw);
718 | display: grid;
719 | grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
720 | grid-gap: 16px;
721 | }
722 |
723 | .work .card-list .item {
724 | --circle-size: 600px;
725 | border-radius: 6px;
726 | background-color: #141419;
727 | box-shadow: 0px 0px 8px 0px rgba(10, 10, 14, 0.4);
728 | align-content: start;
729 | flex-wrap: wrap;
730 | }
731 |
732 | .work .card-list .item a {
733 | display: flex;
734 | flex-direction: column;
735 | padding: 16px;
736 | gap: 16px;
737 | }
738 |
739 | .work .card-list .item a .dark {
740 | position: relative;
741 | font-size: 0;
742 | /* >img{
743 | backdrop-filter: brightness(1);
744 | mix-blend-mode: plus-lighter;
745 | } */
746 | }
747 |
748 | .work .card-list .item a .dark::after {
749 | content: "";
750 | position: absolute;
751 | width: 100%;
752 | height: 100%;
753 | left: 0;
754 | }
755 |
756 | .work .card-list .item a .dark .cover {
757 | width: 100%;
758 | border-radius: 6px;
759 | opacity: .9;
760 | transition: opacity .2s;
761 | }
762 |
763 | .work .card-list .item a .text {
764 | display: flex;
765 | flex-direction: column;
766 | align-items: flex-start;
767 | gap: 4px;
768 | word-wrap: break-word;
769 | opacity: .8;
770 | transition: opacity .2s;
771 | }
772 |
773 | .work .card-list .item a .text .title-area {
774 | display: flex;
775 | width: 100%;
776 | justify-content: space-between;
777 | align-items: center;
778 | gap: 8px;
779 | }
780 |
781 | .work .card-list .item a .text .title-area .title {
782 | display: flex;
783 | align-items: center;
784 | gap: 4px;
785 | }
786 |
787 | .work .card-list .item a .text .title-area .title .name {
788 | font-size: 14px;
789 | line-height: 24px;
790 | font-weight: 500;
791 | background: linear-gradient(180deg, #E8E8F6 0%, rgba(232, 232, 246, 0.72) 100%);
792 | background-clip: text;
793 | -webkit-background-clip: text;
794 | -webkit-text-fill-color: transparent;
795 | }
796 |
797 | .work .card-list .item a .text .title-area .title .link {
798 | opacity: 0;
799 | transition: opacity .2s;
800 | }
801 |
802 | .work .card-list .item a .text .title-area .tag {
803 | font-size: 12px;
804 | line-height: 100%;
805 | font-weight: 500;
806 | padding: 4px 8px;
807 | border-radius: 9999px;
808 | }
809 |
810 | .work .card-list .item a .text .title-area .tag-web {
811 | color: #57AC84;
812 | background: rgba(87, 172, 132, 0.1);
813 | border: 1px solid rgba(87, 172, 132, 0.16);
814 | }
815 |
816 | .work .card-list .item a .text .title-area .tag-assets {
817 | color: #D59A78;
818 | background: rgba(213, 154, 120, 0.1);
819 | border: 1px solid rgba(213, 154, 120, 0.16);
820 | }
821 |
822 | .work .card-list .item a .text .title-area .tag-app {
823 | color: #cb55d2;
824 | background: rgba(203, 85, 210, 0.1);
825 | border: 1px solid rgba(203, 85, 210, 0.16);
826 | }
827 |
828 | .work .card-list .item a .text .title-area .tag-2b {
829 | color: #6F98FF;
830 | background: rgba(111, 152, 255, 0.1);
831 | border: 1px solid rgba(111, 152, 255, 0.16);
832 | }
833 |
834 | .work .card-list .item a .text .title-area .tag-other {
835 | color: #939EA9;
836 | background: rgba(147, 158, 169, 0.1);
837 | border: 1px solid rgba(147, 158, 169, 0.16);
838 | }
839 |
840 | .work .card-list .item a .text .desc {
841 | width: 100%;
842 | font-size: 12px;
843 | line-height: 20px;
844 | color: #B3B3C1;
845 | }
846 |
847 | .work .card-list .item a:hover .cover,
848 | .work .card-list .item a:hover .text,
849 | .work .card-list .item a:hover .link {
850 | opacity: 1 !important;
851 | transition: opacity .4s;
852 | }
853 |
854 | .blog {
855 | display: flex;
856 | justify-content: center;
857 | align-items: center;
858 | --mw: 968px;
859 | padding: 154px 40px 60px 40px;
860 | flex-direction: row;
861 | align-items: flex-start;
862 | min-height: calc(100vh - 100px);
863 | /* 防止项目数量不够一屏高度时 footer 上移 */
864 | }
865 |
866 | .blog .main {
867 | width: 100%;
868 | display: flex;
869 | justify-content: space-between;
870 | align-items: center;
871 | max-width: var(--mw);
872 | }
873 |
874 | .blog .blog-left {
875 | min-width: 100px;
876 | padding-top: 10px;
877 | }
878 |
879 | .blog .blog-left .blog-left-line {
880 | width: 6px;
881 | position: fixed;
882 | }
883 |
884 | .blog .blog-list {
885 | display: flex;
886 | flex-direction: column;
887 | align-items: flex-start;
888 | max-width: 868px;
889 | }
890 |
891 | .blog .blog-list .item {
892 | width: 100%;
893 | }
894 |
895 | .blog .blog-list .item .content-divider {
896 | display: flex;
897 | justify-content: center;
898 | align-items: center;
899 | --mw: 968px;
900 | width: 100%;
901 | max-width: var(--mw);
902 | height: 1px;
903 | background-image: radial-gradient(circle at center, #4E4E64 1px, transparent 1px);
904 | background-size: 6px 1px;
905 | background-repeat: repeat;
906 | mask-image: radial-gradient(at center, #fff, transparent 90%);
907 | -webkit-mask-image: radial-gradient(at center, #fff, transparent 90%);
908 | margin: 24px 0;
909 | }
910 |
911 | .blog .blog-list .item .content-divider .main {
912 | width: 100%;
913 | display: flex;
914 | justify-content: space-between;
915 | align-items: center;
916 | max-width: var(--mw);
917 | }
918 |
919 | .blog .blog-list .item a {
920 | display: flex;
921 | flex-direction: column;
922 | gap: 16px;
923 | }
924 |
925 | .blog .blog-list .item a .text {
926 | display: flex;
927 | flex-direction: column;
928 | align-items: flex-start;
929 | gap: 8px;
930 | opacity: .8;
931 | transition: opacity .2s;
932 | }
933 |
934 | .blog .blog-list .item a .text .title-area {
935 | width: 100%;
936 | display: flex;
937 | justify-content: space-between;
938 | align-items: center;
939 | gap: 12px;
940 | }
941 |
942 | .blog .blog-list .item a .text .title-area .title {
943 | display: flex;
944 | align-items: center;
945 | gap: 6px;
946 | }
947 |
948 | .blog .blog-list .item a .text .title-area .title .name {
949 | font-size: 16px;
950 | line-height: 28px;
951 | font-weight: 500;
952 | background: linear-gradient(180deg, #E8E8F6 0%, rgba(232, 232, 246, 0.72) 100%);
953 | background-clip: text;
954 | -webkit-background-clip: text;
955 | -webkit-text-fill-color: transparent;
956 | transition: text-shadow .2s;
957 | }
958 |
959 | .blog .blog-list .item a .text .title-area .title .link {
960 | font-size: 16px;
961 | line-height: 28px;
962 | font-weight: 500;
963 | color: #6361DC;
964 | opacity: 0;
965 | transition: opacity .2s;
966 | }
967 |
968 | .blog .blog-list .item a .text .title-area .tag {
969 | font-size: 14px;
970 | line-height: 24px;
971 | font-weight: 400;
972 | color: #62616F;
973 | }
974 |
975 | .blog .blog-list .item a .text .desc {
976 | width: 100%;
977 | font-size: 14px;
978 | line-height: 24px;
979 | font-weight: 400;
980 | color: #B3B3C1;
981 | }
982 |
983 | .blog .blog-list .item a .info {
984 | display: flex;
985 | flex-direction: row;
986 | align-items: center;
987 | justify-content: flex-start;
988 | gap: 8px;
989 | opacity: .8;
990 | transition: opacity .2s;
991 | }
992 |
993 | .blog .blog-list .item a .info .info-avatar {
994 | width: 12px;
995 | height: 12px;
996 | }
997 |
998 | .blog .blog-list .item a .info .info-name {
999 | font-size: 12px;
1000 | line-height: 20px;
1001 | font-weight: 400;
1002 | color: #B3B3C1;
1003 | }
1004 |
1005 | .blog .blog-list .item a .info .info-time {
1006 | font-size: 12px;
1007 | line-height: 20px;
1008 | font-weight: 400;
1009 | color: #62616F;
1010 | }
1011 |
1012 | .blog .blog-list .item a:hover .link,
1013 | .blog .blog-list .item a:hover .text,
1014 | .blog .blog-list .item a:hover .info {
1015 | opacity: 1 !important;
1016 | transition: opacity .4s;
1017 | }
1018 |
1019 | .blog .blog-list .item a:hover .text .name {
1020 | text-shadow: 0 0 #6361DC;
1021 | }
1022 |
1023 | .about {
1024 | display: flex;
1025 | justify-content: center;
1026 | align-items: center;
1027 | --mw: 968px;
1028 | flex-direction: column;
1029 | padding: 154px 40px 60px 40px;
1030 | }
1031 |
1032 | .about .main {
1033 | width: 100%;
1034 | display: flex;
1035 | justify-content: space-between;
1036 | align-items: center;
1037 | max-width: var(--mw);
1038 | }
1039 |
1040 | .about .about-top {
1041 | max-width: var(--mw);
1042 | display: flex;
1043 | flex-direction: column;
1044 | }
1045 |
1046 | .about .about-name {
1047 | font-size: 32px;
1048 | line-height: 100%;
1049 | font-weight: 700;
1050 | margin-bottom: 48px;
1051 | background: linear-gradient(180deg, #E8E8F6 0%, rgba(232, 232, 246, 0.72) 100%);
1052 | background-clip: text;
1053 | -webkit-background-clip: text;
1054 | -webkit-text-fill-color: transparent;
1055 | }
1056 |
1057 | .about .about-info {
1058 | display: flex;
1059 | gap: 72px;
1060 | }
1061 |
1062 | .about .about-info-title {
1063 | font-size: 18px;
1064 | line-height: 100%;
1065 | font-weight: 500;
1066 | margin-bottom: 24px;
1067 | background: linear-gradient(180deg, #E8E8F6 0%, rgba(232, 232, 246, 0.72) 100%);
1068 | background-clip: text;
1069 | -webkit-background-clip: text;
1070 | -webkit-text-fill-color: transparent;
1071 | }
1072 |
1073 | .about .about-info-left {
1074 | max-width: 696px;
1075 | }
1076 |
1077 | .about .about-info-left .introduce-desc {
1078 | font-size: 14px;
1079 | line-height: 24px;
1080 | color: #B3B3C1;
1081 | }
1082 |
1083 | .about .about-info-left .introduce-desc a {
1084 | font-size: 14px;
1085 | line-height: 24px;
1086 | font-weight: 500;
1087 | text-decoration: underline;
1088 | color: #B3B3C1;
1089 | transition: color .15s ease-in;
1090 | }
1091 |
1092 | .about .about-info-left .introduce-desc a:hover {
1093 | color: #6361DC;
1094 | }
1095 |
1096 | .about .about-info-right {
1097 | display: flex;
1098 | flex-direction: column;
1099 | gap: 40px;
1100 | min-width: 200px;
1101 | }
1102 |
1103 | .about .about-info-right .contact-desc {
1104 | font-size: 14px;
1105 | line-height: 24px;
1106 | color: #B3B3C1;
1107 | }
1108 |
1109 | .about .about-info-right .contact-desc .list {
1110 | display: flex;
1111 | flex-direction: row;
1112 | }
1113 |
1114 | .about .about-info-right .contact-desc .list .list-label {
1115 | font-size: 14px;
1116 | line-height: 24px;
1117 | }
1118 |
1119 | .about .about-info-right .contact-desc .list .list-value a {
1120 | font-size: 14px;
1121 | line-height: 24px;
1122 | color: #B3B3C1;
1123 | transition: color .15s ease-in;
1124 | text-decoration: underline;
1125 | display: flex;
1126 | align-items: center;
1127 | gap: 4px;
1128 | }
1129 |
1130 | .about .about-info-right .contact-desc .list .list-value a:hover {
1131 | cursor: pointer;
1132 | color: #6361DC;
1133 | }
1134 |
1135 | .about .about-info-right .contact-desc .list .copied {
1136 | opacity: 0;
1137 | color: #15a675;
1138 | transition: opacity .4s;
1139 | margin-left: 4px;
1140 | }
1141 |
1142 | .about .about-info-right .resume-title {
1143 | margin-bottom: 8px;
1144 | }
1145 |
1146 | .about .about-info-right .resume-desc {
1147 | display: flex;
1148 | flex-direction: column;
1149 | align-items: flex-start;
1150 | }
1151 |
1152 | .about .about-info-right .resume-desc .resume-desc-helptext {
1153 | font-size: 12px;
1154 | line-height: 20px;
1155 | color: #62616F;
1156 | margin-bottom: 16px;
1157 | }
1158 |
1159 | .about .about-info-right .resume-desc .resume-btn {
1160 | --circle-size: 100px;
1161 | --border: 9999px;
1162 | border-radius: 9999px;
1163 | padding: 4px 16px;
1164 | cursor: pointer;
1165 | background-color: #6361DC;
1166 | }
1167 |
1168 | .about .about-info-right .resume-desc .resume-btn::before {
1169 | background-color: #6361DC;
1170 | }
1171 |
1172 | .about .about-info-right .resume-desc .resume-btn a {
1173 | font-size: 12px;
1174 | line-height: 20px;
1175 | color: #E8E8F6;
1176 | text-decoration: none;
1177 | }
1178 |
1179 | .about .about-middle {
1180 | width: 100%;
1181 | max-width: var(--mw);
1182 | display: flex;
1183 | flex-direction: column;
1184 | margin: 40px 0 80px 0;
1185 | }
1186 |
1187 | .about .about-middle .power {
1188 | display: flex;
1189 | flex-direction: column;
1190 | gap: 16px;
1191 | }
1192 |
1193 | .about .about-middle .power .list-00 {
1194 | width: 100%;
1195 | display: grid;
1196 | grid-template-columns: 1fr 1fr 1fr 1fr;
1197 | grid-gap: 16px;
1198 | }
1199 |
1200 | .about .about-middle .power .list-01 {
1201 | width: 100%;
1202 | display: grid;
1203 | grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
1204 | grid-gap: 16px;
1205 | }
1206 |
1207 | .about .about-middle .power .power-card {
1208 | --circle-size: 400px;
1209 | background-color: #141419;
1210 | box-shadow: 0px 0px 8px 0px rgba(10, 10, 14, 0.4);
1211 | }
1212 |
1213 | .about .about-middle .power .power-card a {
1214 | width: 100%;
1215 | display: flex;
1216 | flex-direction: column;
1217 | align-items: flex-start;
1218 | gap: 12px;
1219 | padding: 16px;
1220 | }
1221 |
1222 | .about .about-middle .power .power-card a .card-img {
1223 | width: 32px;
1224 | height: 32px;
1225 | opacity: .8;
1226 | transition: opacity .2s;
1227 | display: flex;
1228 | align-items: center;
1229 | justify-content: center;
1230 | background: no-repeat center;
1231 | }
1232 |
1233 | .about .about-middle .power .power-card a .card-img img {
1234 | z-index: 1;
1235 | }
1236 |
1237 | .about .about-middle .power .power-card a .card-img::after {
1238 | content: '';
1239 | position: absolute;
1240 | width: 32px;
1241 | height: 32px;
1242 | filter: blur(10px);
1243 | background: inherit;
1244 | background-size: 100%;
1245 | }
1246 |
1247 | .about .about-middle .power .power-card a:hover .card-img,
1248 | .about .about-middle .power .power-card a:hover .card-text {
1249 | opacity: 1;
1250 | transition: opacity .4s;
1251 | }
1252 |
1253 | .about .about-middle .power .power-card a .card-text {
1254 | font-size: 12px;
1255 | line-height: 20px;
1256 | color: #B3B3C1;
1257 | opacity: .8;
1258 | transition: opacity .2s;
1259 | }
1260 |
1261 | .about .about-middle .power .power-card-number {
1262 | --circle-size: 400px;
1263 | background-color: #141419;
1264 | box-shadow: 0px 0px 8px 0px rgba(10, 10, 14, 0.4);
1265 | }
1266 |
1267 | .about .about-middle .power .power-card-number a {
1268 | width: 100%;
1269 | display: flex;
1270 | flex-direction: column;
1271 | align-items: flex-start;
1272 | gap: 12px;
1273 | padding: 16px;
1274 | }
1275 |
1276 | .about .about-middle .power .power-card-number a:hover .card-title,
1277 | .about .about-middle .power .power-card-number a:hover .card-text {
1278 | opacity: 1;
1279 | transition: opacity .4s;
1280 | }
1281 |
1282 | .about .about-middle .power .power-card-number a .card-title {
1283 | font-size: 18px;
1284 | line-height: 28px;
1285 | font-weight: 500;
1286 | background: linear-gradient(180deg, #E8E8F6 0%, rgba(232, 232, 246, 0.72) 100%);
1287 | background-clip: text;
1288 | -webkit-background-clip: text;
1289 | -webkit-text-fill-color: transparent;
1290 | opacity: .8;
1291 | transition: opacity .2s;
1292 | }
1293 |
1294 | .about .about-middle .power .power-card-number a .card-text {
1295 | font-size: 12px;
1296 | line-height: 20px;
1297 | color: #B3B3C1;
1298 | opacity: .8;
1299 | transition: opacity .2s;
1300 | }
1301 |
1302 | .about .about-bottom {
1303 | width: 100%;
1304 | max-width: var(--mw);
1305 | display: flex;
1306 | flex-direction: column;
1307 | }
1308 |
1309 | .about .about-bottom .experience {
1310 | width: 100%;
1311 | display: flex;
1312 | flex-direction: column;
1313 | gap: 48px;
1314 | }
1315 |
1316 | .about .about-bottom .experience .item {
1317 | display: grid;
1318 | grid-template-columns: 1fr 1fr 3fr;
1319 | gap: 16px;
1320 | }
1321 |
1322 | .about .about-bottom .experience .item .time {
1323 | font-size: 14px;
1324 | line-height: 24px;
1325 | color: #B3B3C1;
1326 | }
1327 |
1328 | .about .about-bottom .experience .item .name {
1329 | display: flex;
1330 | flex-direction: column;
1331 | gap: 4px;
1332 | }
1333 |
1334 | .about .about-bottom .experience .item .name .company a {
1335 | font-size: 14px;
1336 | line-height: 24px;
1337 | color: #B3B3C1;
1338 | transition: color .15s ease-in;
1339 | }
1340 |
1341 | .about .about-bottom .experience .item .name .company a:hover {
1342 | color: #6361DC;
1343 | }
1344 |
1345 | .about .about-bottom .experience .item .name .job {
1346 | font-size: 12px;
1347 | line-height: 20px;
1348 | color: #62616F;
1349 | }
1350 |
1351 | .about .about-bottom .experience .item .project-experience {
1352 | display: flex;
1353 | flex-direction: column;
1354 | gap: 40px;
1355 | }
1356 |
1357 | .about .about-bottom .experience .item .project-experience .item {
1358 | display: flex;
1359 | flex-direction: column;
1360 | gap: 16px;
1361 | }
1362 |
1363 | .about .about-bottom .experience .item .project-experience .item .title {
1364 | font-size: 14px;
1365 | line-height: 24px;
1366 | font-weight: 500;
1367 | background: linear-gradient(180deg, #E8E8F6 0%, rgba(232, 232, 246, 0.72) 100%);
1368 | background-clip: text;
1369 | -webkit-background-clip: text;
1370 | -webkit-text-fill-color: transparent;
1371 | }
1372 |
1373 | .about .about-bottom .experience .item .project-experience .item .desc {
1374 | color: #B3B3C1;
1375 | }
1376 |
1377 | .about .about-bottom .experience .item .project-experience .item .desc li {
1378 | font-size: 14px;
1379 | line-height: 28px;
1380 | list-style: circle;
1381 | }
1382 |
1383 | /* tooltip */
1384 | .tooltip {
1385 | position: relative;
1386 | display: inline-block;
1387 | }
1388 |
1389 | .tooltip .tooltip-box {
1390 | width: 160px;
1391 | height: 160px;
1392 | visibility: hidden;
1393 | background-color: #ffffff;
1394 | text-align: center;
1395 | border-radius: 6px;
1396 | padding: 20px;
1397 | box-shadow: 0px 4px 24px rgba(10, 10, 14, 0.12);
1398 | position: absolute;
1399 | right: 0px;
1400 | top: 32px;
1401 | z-index: 9999;
1402 | opacity: 0;
1403 | transition: opacity .4s;
1404 | }
1405 |
1406 | .tooltip .tooltip-box::after {
1407 | content: " ";
1408 | position: absolute;
1409 | bottom: 100%;
1410 | right: 10%;
1411 | border-width: 8px;
1412 | border-style: solid;
1413 | border-color: transparent transparent white transparent;
1414 | }
1415 |
1416 | .tooltip .tooltip-box img {
1417 | width: 120px;
1418 | height: 120px;
1419 | border-radius: 4px;
1420 | }
1421 |
1422 | .tooltip:hover .tooltip-box {
1423 | visibility: visible;
1424 | opacity: 1;
1425 | }
1426 |
--------------------------------------------------------------------------------
/css/style.min.css:
--------------------------------------------------------------------------------
1 | @media screen and (max-width: 768px){.about-info{flex-direction:column}.list-00,.list-01{grid-template-columns:1fr 1fr !important}.about-bottom .experience .item{grid-template-columns:none !important;grid-template-rows:1fr !important}.blog-left{display:none}.menu{display:none !important}#menu-expand{display:block !important}.hello::after{width:320px !important;height:320px !important}.copyright span,.fillings,.friends{display:none !important}}@media screen and (min-width: 769px){#menu-panel{left:100vw !important}}*{border:0;margin:0;padding:0;box-sizing:border-box;list-style:none;font-size:12px;text-decoration:unset}body{background-color:#0E0E13;color:#E8E8F6;font-family:Roboto, system-ui, -apple-system, "Segoe UI", "Helvetica Neue", Arial, "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";-webkit-font-smoothing:antialiased;overflow-x:hidden}.fireworks{position:fixed;top:0;left:0;width:100%;height:100%;display:block;z-index:-999}.icon{font-size:0}.icon.dark::before{content:url(../assets/public/skin_light.svg)}.icon.menu-icon::before{content:url(../assets/public/menu_icon.svg)}.magical{--circle-size:600px;--inset:1px;--border:6px;position:relative;display:flex;align-items:center;justify-content:center;border-radius:var(--border);background-color:#0E0E13}.magical::before,.magical::after{content:'';position:absolute;width:calc(100% + var(--inset)*2);height:calc(100% + var(--inset)*2);border-radius:var(--border);inset:calc(0 - var(--inset))}.magical::before{background:radial-gradient(var(--circle-size) circle at var(--mouse-x) var(--mouse-y), rgba(255,255,255,0.3), transparent 40%);z-index:-1}.magical::after{background:linear-gradient(180deg, rgba(78,78,100,0.48) 0%, rgba(78,78,100,0.2) 100%);z-index:-2}.magical .show{width:100%;height:100%;position:absolute;border-radius:var(--border);opacity:0;pointer-events:none;background:radial-gradient(var(--circle-size) circle at var(--mouse-x) var(--mouse-y), rgba(255,255,255,0.01), transparent 40%)}.btn{--border:9999px;background-image:radial-gradient(var(--circle-size) circle at var(--mouse-x) var(--mouse-y), rgba(255,255,255,0.06), transparent 40%)}.btn::before{background:radial-gradient(var(--circle-size) circle at var(--mouse-x) var(--mouse-y), rgba(255,255,255,0.4), transparent 40%)}.btn::after{background:linear-gradient(180deg, rgba(78,78,100,0.68) 0%, rgba(78,78,100,0.2) 100%)}.head{position:fixed;padding:0 40px;width:100%;--height:56px;height:var(--height);display:flex;justify-content:center;align-items:center;--mw:968px;background:rgba(25,25,32,0.8);backdrop-filter:blur(4px);flex-direction:column;z-index:100}.head .main{width:100%;display:flex;justify-content:space-between;align-items:center;max-width:var(--mw)}.head .logo{height:20px}.head #menu-expand{display:none}.head #menu-expand.active{pointer-events:none}.head #menu-expand.active+#menu-panel{left:40px}.head #menu-expand>.menu-icon{transition:transform .5s}.head #menu-expand .active #menu-expand>.menu-icon{transform:rotate(45deg)}@keyframes goOut{0%{left:40px}100%{left:100vw}}.head .menu{display:flex;gap:12px}.head .menu li{--circle-size:100px;border-radius:9999px;padding:6px 16px;cursor:pointer;background-color:#1F1F26;transition:.3s background ease-in-out}.head .menu li.nav,.head .menu li.nav::before{background-color:#6361DC}.head .menu .skin{width:14px;padding:6px 13px}.head #menu-panel{width:calc(100vw - 80px);position:absolute;top:44px;left:100vw;padding:16px 24px;background:rgba(25,25,32,0.96);backdrop-filter:blur(4px);border-radius:6px;box-shadow:0px 0px 8px 0px rgba(10,10,14,0.4);z-index:101}.head #menu-panel .menu-panel-content{display:flex;flex-direction:row;flex-wrap:wrap;justify-content:flex-end;gap:16px}.head #menu-panel .menu-panel-content li{--circle-size:100px;border-radius:9999px;padding:6px 16px;cursor:pointer;background-color:#1F1F26;transition:.3s background ease-in-out}.head #menu-panel .menu-panel-content li.nav,.head #menu-panel .menu-panel-content li.nav::before{background-color:#6361DC}.head blockquote{position:absolute;inset:calc(20px + var(--height)) 0 0;font-size:0;width:100%;display:flex;align-items:flex-end;justify-content:center}.head blockquote::after{content:'';position:absolute;bottom:0;left:0;right:0;height:20px;background:url("../assets/public/head_bottom_line.svg") no-repeat center top;z-index:-1}.head blockquote img{margin-bottom:10px;animation:rotate 6s linear infinite}@keyframes rotate{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}.footer{padding:60px 40px 20px 40px;font-size:12px;line-height:20px;color:#62616F}.footer .copyright{display:flex;justify-content:center;align-items:center;--mw:968px;gap:12px}.footer .copyright .main{width:100%;display:flex;justify-content:space-between;align-items:center;max-width:var(--mw)}.footer .copyright a{transition:color .15s ease-in;color:#62616F}.footer .copyright a:hover{color:#6361DC}.footer .copyright .friends{display:flex;justify-content:center;align-items:center;--mw:968px;gap:8px}.footer .copyright .friends .main{width:100%;display:flex;justify-content:space-between;align-items:center;max-width:var(--mw)}.widget{display:flex;justify-content:center;align-items:center;--mw:968px}.widget .main{width:100%;display:flex;justify-content:space-between;align-items:center;max-width:var(--mw)}.widget .shape-light{z-index:-99;position:fixed;bottom:-180px;width:600px;height:200px;border-radius:9999px;background:rgba(99,97,220,0.4);filter:blur(100px)}.widget .shape-star{position:fixed;z-index:-98;bottom:0;height:150px;width:var(--mw);-webkit-mask-image:linear-gradient(180deg, rgba(217,217,217,0) 0%, rgba(217,217,217,0.8) 25%, #d9d9d9 50%, rgba(217,217,217,0.8) 75%, rgba(217,217,217,0) 100%);mask-image:linear-gradient(180deg, rgba(217,217,217,0) 0%, rgba(217,217,217,0.8) 25%, #d9d9d9 50%, rgba(217,217,217,0.8) 75%, rgba(217,217,217,0) 100%);-webkit-mask-size:cover;mask-size:cover}@keyframes risingStarsAnination{0%{transform:translateZ(0) translateY(0)}to{transform:translateZ(0) translateY(-2000px)}}.widget .shape-star .rising-stars{opacity:.7;pointer-events:none}.widget .shape-star .rising-stars div{background:transparent;border-radius:50%}.widget .shape-star .rising-stars div:nth-child(1){animation-duration:100s !important;box-shadow:136px 13273px #fff,347px 1735px #fff,813px 1674px #fff,1949px 440px #fff,1440px 41px #fff,437px 1122px #fff,406px 430px #fff,1014px 25px #fff,1330px 1616px #fff,1636px 1496px #fff,1358px 800px #fff,48px 857px #fff,900px 1821px #fff,906px 1975px #fff,832px 163px #fff,1911px 1480px #fff,576px 523px #fff,783px 1435px #fff,738px 1712px #fff,1822px 193px #fff,1168px 1172px #fff,480px 687px #fff,798px 337px #fff,1747px 824px #fff,1296px 1690px #fff,1277px 1786px #fff,1941px 1271px #fff,1925px 784px #fff,400px 1302px #fff,112px 882px #fff,1008px 1624px #fff,55px 1604px #fff,1143px 1555px #fff,1354px 1344px #fff,1687px 601px #fff,651px 617px #fff,984px 1737px #fff,505px 1689px #fff,634px 1460px #fff,770px 827px #fff,315px 833px #fff,192px 1677px #fff,1324px 580px #fff,1862px 1217px #fff,157px 1255px #fff,1265px 1949px #fff,259px 482px #fff,1925px 39px #fff,1823px 1401px #fff,172px 1227px #fff,1120px 662px #fff,621px 681px #fff,959px 1389px #fff,370px 367px #fff,1629px 754px #fff,117px 756px #fff,415px 19px #fff,1158px 1227px #fff,36px 322px #fff,315px 1172px #fff,1156px 1010px #fff,758px 828px #fff,1576px 1585px #fff,725px 1487px #fff,1987px 1199px #fff,832px 827px #fff,1162px 92px #fff,103px 1868px #fff,588px 198px #fff,695px 984px #fff,1256px 1513px #fff,29px 924px #fff,1991px 1022px #fff,317px 932px #fff,114px 1610px #fff,1073px 1420px #fff,1161px 1045px #fff,684px 312px #fff,250px 419px #fff,151px 76px #fff,1228px 400px #fff,1381px 202px #fff,1210px 207px #fff,951px 1633px #fff,1585px 1768px #fff,1187px 1462px #fff,231px 1455px #fff,1457px 1778px #fff,1604px 75px #fff,1952px 1575px #fff,1870px 10px #fff,1240px 1824px #fff,591px 554px #fff,1696px 112px #fff,1618px 662px #fff,860px 1971px #fff,899px 1140px #fff,1334px 285px #fff,1051px 732px #fff,267px 1737px #fff,1363px 965px #fff,1829px 1718px #fff,1966px 1063px #fff,979px 1908px #fff,1654px 1085px #fff,416px 1055px #fff,1758px 576px #fff,1604px 720px #fff,840px 143px #fff,852px 1385px #fff,411px 1808px #fff,992px 28px #fff,1461px 122px #fff,1110px 671px #fff,221px 1734px #fff,1886px 1139px #fff,1963px 1765px #fff,406px 456px #fff,461px 1710px #fff,524px 1305px #fff,905px 1265px #fff,731px 126px #fff,1748px 186px #fff,759px 1511px #fff,1502px 1174px #fff,163px 1326px #fff,1236px 416px #fff,963px 1543px #fff,509px 373px #fff,1965px 942px #fff,1621px 1614px #fff,211px 515px #fff,1064px 990px #fff,475px 715px #fff,1977px 366px #fff,1480px 1801px #fff,693px 701px #fff,944px 628px #fff,1870px 1324px #fff,1745px 442px #fff,753px 1087px #fff,1639px 620px #fff,1838px 1570px #fff,1945px 1028px #fff,1692px 1037px #fff,276px 440px #fff,668px 1787px #fff,440px 1541px #fff,1493px 199px #fff,1930px 1584px #fff,1856px 700px #fff,1161px 682px #fff,1671px 664px #fff,286px 1182px #fff,1933px 1388px #fff,743px 1367px #fff,849px 1823px #fff,136px 25px #fff,568px 102px #fff,659px 687px #fff,27px 211px #fff,1980px 602px #fff,383px 176px #fff,1124px 470px #fff,1143px 100px #fff,1744px 1751px #fff,689px 614px #fff,596px 1867px #fff,710px 883px #fff,637px 202px #fff,1372px 962px #fff,1595px 1650px #fff,1491px 1428px #fff,873px 235px #fff,1127px 582px #fff,700px 140px #fff,1470px 1395px #fff,1133px 1532px #fff,1736px 1749px #fff,1841px 228px #fff,529px 1790px #fff,1084px 1246px #fff,1365px 230px #fff,529px 304px #fff,528px 1689px #fff,1549px 1892px #fff,975px 1315px #fff,1924px 1909px #fff,423px 115px #fff,1198px 432px #fff,1081px 956px #fff,1890px 1360px #fff,872px 535px #fff,781px 630px #fff,1010px 197px #fff,651px 125px #fff,1569px 1159px #fff,233px 759px #fff,372px 139px #fff,742px 1233px #fff,302px 1514px #fff,1159px 879px #fff,1536px 213px #fff,1212px 49px #fff,897px 1653px #fff,1735px 765px #fff,1086px 410px #fff,609px 1933px #fff,127px 172px #fff,179px 1873px #fff,584px 299px #fff,861px 1050px #fff,400px 234px #fff,1401px 806px #fff,1086px 47px #fff,1735px 1844px #fff,1874px 1698px #fff,975px 720px #fff,164px 845px #fff,461px 66px #fff,894px 1102px #fff,151px 1968px #fff,258px 1303px #fff,366px 593px #fff,390px 1023px #fff,1296px 661px #fff,308px 285px #fff,554px 1926px #fff,1409px 527px #fff,1661px 316px #fff,101px 439px #fff,1051px 1323px #fff,1144px 1541px #fff,479px 16px #fff,1172px 911px #fff,1087px 1807px #fff,1699px 628px #fff,1859px 1056px #fff,571px 1977px #fff,137px 1578px #fff,906px 847px #fff,1071px 430px #fff,212px 323px #fff,353px 276px #fff,680px 316px #fff,1781px 1151px #fff,137px 1426px #fff,1270px 1679px #fff,696px 220px #fff,587px 184px #fff,704px 795px #fff,1646px 907px #fff,1546px 11px #fff,369px 1976px #fff,1199px 815px #fff,290px 913px #fff,159px 1921px #fff,955px 1406px #fff,748px 1132px #fff,1388px 1674px #fff,1390px 1925px #fff,961px 70px #fff,1015px 927px #fff,470px 64px #fff,1125px 684px #fff,615px 1839px #fff,1318px 1437px #fff,1338px 1130px #fff,295px 1857px #fff,1656px 1208px #fff,1550px 1250px #fff,595px 1523px #fff,943px 1812px #fff,976px 1048px #fff,175px 1883px #fff,641px 1066px #fff,1115px 758px #fff,1726px 1072px #fff,1403px 1085px #fff,1601px 935px #fff,221px 877px #fff,1318px 1484px #fff,1382px 1995px #fff,737px 1875px #fff,772px 1635px #fff,869px 1654px #fff,1179px 18px #fff,518px 695px #fff,691px 1963px #fff,1290px 1259px #fff,121px 1616px #fff,531px 1751px #fff,538px 968px #fff,1492px 1387px #fff,848px 1586px #fff,665px 1946px #fff,307px 984px #fff,593px 1790px #fff,282px 981px #fff,1383px 1886px #fff,1220px 1353px #fff,537px 1893px #fff,1228px 1085px #fff,1415px 532px #fff,660px 982px #fff,308px 1837px #fff,1644px 694px #fff,1137px 296px #fff,1010px 450px #fff,1405px 1366px #fff,1823px 1910px #fff,623px 1983px #fff,585px 716px #fff,1521px 888px #fff,334px 1235px #fff,989px 1957px #fff,1055px 1917px #fff,1012px 1921px #fff,502px 793px #fff,362px 394px #fff,437px 1451px #fff,49px 1224px #fff,1883px 326px #fff,235px 1679px #fff,355px 1148px #fff,204px 907px #fff,1405px 851px #fff,404px 986px #fff,126px 239px #fff,1311px 1960px #fff,1178px 804px #fff,692px 1467px #fff,523px 1043px #fff,259px 1128px #fff,940px 229px #fff,733px 590px #fff,845px 1397px #fff,64px 383px #fff,220px 1136px #fff,307px 48px #fff,1996px 1239px #fff,495px 322px #fff,1245px 1786px #fff,392px 26px #fff,1053px 835px #fff,68px 296px #fff,1165px 63px #fff,1992px 584px #fff,1947px 881px #fff,1012px 205px #fff,419px 1901px #fff,91px 667px #fff,558px 1692px #fff,129px 252px #fff,369px 428px #fff,241px 1865px #fff,289px 1345px #fff,1591px 1655px #fff,29px 585px #fff,489px 885px #fff,342px 307px #fff,589px 658px #fff,1069px 348px #fff,355px 690px #fff,1141px 483px #fff,299px 1211px #fff,217px 1040px #fff,266px 524px #fff,1151px 304px #fff,777px 1096px #fff,1166px 1726px #fff,1332px 819px #fff,986px 1727px #fff,87px 1949px #fff,1962px 83px #fff,133px 708px #fff,1603px 504px #fff,487px 1316px #fff,216px 863px #fff,877px 162px #fff,1234px 1181px #fff,1102px 1118px #fff,509px 475px #fff,621px 935px #fff,658px 589px #fff,665px 1606px #fff,878px 1542px #fff,864px 882px #fff,1070px 1310px #fff,1983px 1146px #fff,1673px 1885px #fff,1008px 351px #fff,1896px 494px #fff,1523px 1071px #fff,1424px 773px #fff,1077px 571px #fff,281px 602px #fff,19px 1135px #fff,852px 1826px #fff,1114px 1291px #fff,956px 257px #fff,1956px 1188px #fff,1779px 284px #fff,204px 613px #fff,1892px 1213px #fff,1787px 1914px #fff,1732px 695px #fff,1497px 375px #fff,1266px 1719px #fff,1668px 1242px #fff,931px 147px #fff,399px 1359px #fff,1626px 518px #fff,840px 1495px #fff,145px 926px #fff,924px 46px #fff,1907px 1649px #fff,953px 1435px #fff,1530px 373px #fff,320px 1346px #fff,1007px 581px #fff,897px 46px #fff,926px 1693px #fff,1187px 370px #fff,69px 939px #fff,64px 1548px #fff,66px 491px #fff,1871px 676px #fff,1240px 722px #fff,1223px 216px #fff,1743px 1566px #fff,1901px 1944px #fff,918px 583px #fff,285px 601px #fff,1303px 263px #fff,1156px 1288px #fff,1897px 61px #fff,463px 1533px #fff,98px 1153px #fff,1430px 1811px #fff,304px 651px #fff,722px 260px #fff,219px 1577px #fff,157px 112px #fff,1146px 1534px #fff,972px 230px #fff,529px 962px #fff,91px 947px #fff,410px 1245px #fff,1556px 586px #fff,591px 1038px #fff,1571px 892px #fff,236px 1129px #fff,976px 1915px #fff,903px 590px #fff,939px 521px #fff,697px 859px #fff,1192px 71px #fff,614px 366px #fff,1197px 1094px #fff,1433px 839px #fff,1689px 1700px #fff,1023px 1084px #fff,176px 1110px #fff,12px 830px #fff,1880px 1619px #fff,1914px 994px #fff,218px 987px #fff,1585px 517px #fff,1837px 502px #fff,1878px 1043px #fff,30px 837px #fff,1582px 1999px #fff,1698px 940px #fff,613px 266px #fff,1628px 29px #fff,1113px 180px #fff,239px 269px #fff,1903px 449px #fff,1788px 1095px #fff,51px 1761px #fff,421px 1073px #fff,353px 292px #fff,1612px 749px #fff,986px 601px #fff,450px 343px #fff,1386px 1341px #fff,204px 848px #fff,1527px 110px #fff,379px 1993px #fff,820px 1197px #fff,279px 1804px #fff,160px 1801px #fff,1475px 1135px #fff,1374px 1626px #fff,873px 1542px #fff,1637px 1435px #fff,470px 1761px #fff,628px 919px #fff,628px 574px #fff}.widget .shape-star .rising-stars div:nth-child(2){animation-duration:150s !important;box-shadow:1046px 2770px #fff,584px 202px #fff,195px 1038px #fff,84px 741px #fff,466px 961px #fff,192px 609px #fff,704px 571px #fff,1498px 1059px #fff,21px 1214px #fff,643px 408px #fff,848px 514px #fff,420px 1928px #fff,866px 698px #fff,1071px 119px #fff,1284px 570px #fff,907px 89px #fff,1990px 137px #fff,768px 1886px #fff,1602px 623px #fff,223px 255px #fff,1224px 1955px #fff,1216px 1001px #fff,817px 1781px #fff,1586px 684px #fff,221px 71px #fff,1885px 1713px #fff,1441px 15px #fff,1946px 1649px #fff,437px 1773px #fff,1831px 657px #fff,1230px 220px #fff,906px 1681px #fff,906px 184px #fff,1689px 859px #fff,1655px 564px #fff,1900px 1354px #fff,378px 1964px #fff,985px 1685px #fff,1357px 999px #fff,1518px 1502px #fff,1068px 338px #fff,920px 1753px #fff,1589px 1108px #fff,1212px 1920px #fff,199px 596px #fff,172px 67px #fff,1104px 797px #fff,682px 571px #fff,228px 1285px #fff,401px 751px #fff,558px 1703px #fff,1382px 736px #fff,463px 1746px #fff,579px 1384px #fff,208px 1771px #fff,290px 881px #fff,408px 1189px #fff,1024px 768px #fff,247px 282px #fff,1254px 1274px #fff,592px 1785px #fff,460px 914px #fff,275px 429px #fff,991px 93px #fff,1961px 429px #fff,998px 1797px #fff,1363px 1258px #fff,1387px 611px #fff,1850px 482px #fff,401px 482px #fff,899px 966px #fff,1424px 1844px #fff,1555px 1899px #fff,625px 506px #fff,41px 219px #fff,958px 1518px #fff,1894px 717px #fff,1207px 807px #fff,183px 614px #fff,1146px 467px #fff,349px 1521px #fff,587px 1330px #fff,940px 1640px #fff,1167px 1990px #fff,1728px 1870px #fff,88px 336px #fff,1326px 944px #fff,1103px 117px #fff,1531px 1508px #fff,588px 1497px #fff,1193px 1036px #fff,475px 345px #fff,775px 731px #fff,1189px 411px #fff,1657px 108px #fff,828px 1788px #fff,622px 357px #fff,1441px 1292px #fff,1332px 361px #fff,979px 376px #fff,504px 412px #fff,1470px 290px #fff,1422px 1637px #fff,911px 1694px #fff,1304px 1729px #fff,1378px 890px #fff,181px 1238px #fff,166px 1011px #fff,570px 823px #fff,1842px 771px #fff,1495px 189px #fff,324px 1077px #fff,850px 883px #fff,1718px 1273px #fff,1559px 215px #fff,425px 254px #fff,114px 1855px #fff,1425px 253px #fff,1327px 477px #fff,1644px 234px #fff,851px 1060px #fff,384px 1151px #fff,78px 433px #fff,269px 847px #fff,11px 1426px #fff,1583px 31px #fff,1067px 48px #fff,1532px 544px #fff,1418px 923px #fff,1609px 1733px #fff,96px 1597px #fff,1818px 421px #fff,1059px 181px #fff,156px 1830px #fff,1565px 11px #fff,989px 287px #fff,827px 459px #fff,1730px 1155px #fff,688px 939px #fff,694px 6px #fff,360px 1041px #fff,1230px 1560px #fff,1228px 1637px #fff,207px 460px #fff,1869px 627px #fff,69px 872px #fff,438px 154px #fff,217px 721px #fff,141px 678px #fff,606px 1622px #fff,1836px 1505px #fff,568px 1817px #fff,1692px 901px #fff,1726px 1257px #fff,272px 77px #fff,1327px 405px #fff,833px 628px #fff,974px 782px #fff,828px 1085px #fff,1516px 57px #fff,1432px 279px #fff,1308px 608px #fff,419px 1365px #fff,989px 1354px #fff,343px 557px #fff,1787px 1617px #fff,609px 281px #fff,397px 635px #fff,330px 1483px #fff,1039px 1891px #fff,623px 390px #fff,849px 1113px #fff,774px 1584px #fff,339px 1374px #fff,910px 294px #fff,348px 1997px #fff,961px 1571px #fff,108px 1103px #fff,761px 1908px #fff,1612px 1543px #fff,1978px 1013px #fff,1420px 170px #fff,250px 157px #fff,760px 804px #fff,503px 1240px #fff,913px 1425px #fff,694px 541px #fff,999px 1757px #fff,1792px 865px #fff,521px 1962px #fff,892px 1943px #fff,1266px 744px #fff,1315px 121px #fff,957px 1880px #fff,1387px 334px #fff,101px 132px #fff,760px 1557px #fff,1100px 112px #fff,879px 173px #fff,1712px 1707px #fff,888px 28px #fff,33px 1189px #fff,1316px 1591px #fff,254px 1751px #fff,494px 1485px #fff,1654px 782px #fff,1983px 693px #fff,754px 1919px #fff,1116px 85px #fff,1417px 634px #fff,343px 657px #fff,481px 1867px #fff,805px 1831px #fff,213px 1734px #fff,1305px 225px #fff,1158px 1852px #fff,1335px 1897px #fff,995px 514px #fff,1297px 1704px #fff,732px 25px #fff,1190px 1980px #fff,515px 1537px #fff,1675px 639px #fff,1693px 1862px #fff,417px 1885px #fff,1303px 1332px #fff,1422px 259px #fff,1176px 1403px #fff,1477px 980px #fff,1960px 461px #fff,99px 980px #fff,1139px 418px #fff,1357px 487px #fff,1009px 1329px #fff,293px 355px #fff,301px 464px #fff,222px 138px #fff,307px 265px #fff,989px 856px #fff,182px 1885px #fff,1064px 1909px #fff,885px 155px #fff,403px 166px #fff,1540px 1180px #fff,310px 1519px #fff,777px 496px #fff,664px 1389px #fff,1950px 758px #fff,63px 1412px #fff,1247px 1151px #fff,365px 60px #fff,1793px 502px #fff,533px 320px #fff,927px 766px #fff,206px 340px #fff,1261px 292px #fff,1908px 1564px #fff,99px 50px #fff,1693px 1858px #fff,641px 1034px #fff,1063px 453px #fff,1973px 163px #fff,712px 600px #fff,264px 1682px #fff,1686px 289px #fff,1305px 745px #fff,30px 349px #fff,649px 1772px #fff,1032px 141px #fff,204px 1345px #fff,46px 289px #fff,173px 466px #fff,1369px 1116px #fff,528px 196px #fff,1355px 1117px #fff,1344px 1192px #fff,220px 304px #fff,1816px 1984px #fff,1903px 683px #fff,389px 934px #fff,79px 1352px #fff,1317px 1295px #fff,1169px 1389px #fff,1061px 914px #fff,1777px 1736px #fff,1859px 286px #fff,1479px 569px #fff,930px 1613px #fff,1892px 682px #fff,867px 1193px #fff,40px 1606px #fff,624px 1860px #fff,1829px 1897px #fff,1891px 1944px #fff,1633px 1642px #fff,71px 627px #fff,1334px 1548px #fff,1461px 1437px #fff,220px 547px #fff,334px 907px #fff,1512px 34px #fff,789px 64px #fff,190px 1169px #fff,358px 22px #fff,438px 115px #fff,1576px 248px #fff,117px 836px #fff,957px 1773px #fff,213px 1553px #fff,1211px 1094px #fff,1768px 1569px #fff,541px 725px #fff,1027px 1196px #fff,996px 677px #fff,1406px 1504px #fff,707px 1457px #fff,1704px 445px #fff,1403px 1557px #fff,1743px 223px #fff,1866px 1923px #fff,1137px 762px #fff,1566px 1760px #fff,1289px 1717px #fff,1397px 634px #fff,1286px 516px #fff,1179px 1503px #fff,1143px 1306px #fff,489px 1107px #fff,1663px 145px #fff,1553px 1813px #fff,1611px 1558px #fff,969px 946px #fff,243px 25px #fff,518px 117px #fff,1510px 12px #fff,1461px 1296px #fff,453px 697px #fff,726px 1082px #fff,1727px 410px #fff,1242px 1258px #fff,1847px 1331px #fff,1746px 1023px #fff,972px 1887px #fff,704px 453px #fff,424px 993px #fff,1437px 797px #fff,1947px 235px #fff,916px 1060px #fff,1034px 1354px #fff,723px 1738px #fff,447px 1609px #fff,167px 780px #fff,462px 1224px #fff,704px 1676px #fff,1880px 495px #fff,665px 1497px #fff,773px 1221px #fff,471px 771px #fff,549px 221px #fff,846px 242px #fff,638px 300px #fff,75px 492px #fff,856px 1803px #fff,1605px 1288px #fff,740px 11px #fff,1009px 1229px #fff,650px 1734px #fff,565px 1651px #fff,1314px 949px #fff,852px 1135px #fff,1742px 360px #fff,512px 487px #fff,965px 1638px #fff,619px 1818px #fff,982px 838px #fff,36px 1269px #fff,14px 542px #fff,1913px 1614px #fff,1231px 1455px #fff,950px 1539px #fff,1599px 124px #fff,854px 661px #fff,45px 810px #fff,1098px 425px #fff,1088px 579px #fff,100px 673px #fff,1729px 1110px #fff,35px 507px #fff,435px 708px #fff,893px 127px #fff,953px 1523px #fff,1067px 1352px #fff,1806px 376px #fff,738px 1173px #fff,676px 1910px #fff,405px 805px #fff,1289px 1838px #fff,1794px 677px #fff,1727px 1763px #fff,729px 181px #fff,417px 1509px #fff,402px 867px #fff,1047px 1577px #fff,1748px 619px #fff,815px 156px #fff,1668px 13px #fff,285px 1014px #fff,499px 1355px #fff,384px 819px #fff,364px 1484px #fff,968px 534px #fff,1935px 1915px #fff,662px 870px #fff,1837px 1960px #fff,1063px 1369px #fff,388px 271px #fff,1406px 1113px #fff,1909px 897px #fff,506px 101px #fff,680px 1579px #fff,1908px 1476px #fff,1065px 1308px #fff,892px 1806px #fff,1303px 1738px #fff,1112px 935px #fff,1112px 354px #fff,799px 1222px #fff,1131px 1922px #fff,341px 1281px #fff,744px 298px #fff,1519px 698px #fff,934px 1143px #fff,989px 584px #fff,1250px 161px #fff,49px 1336px #fff,1154px 1944px #fff,260px 1720px #fff,243px 963px #fff,1336px 834px #fff,1373px 578px #fff,1624px 146px #fff,493px 141px #fff,991px 1986px #fff,715px 465px #fff,1380px 373px #fff,1134px 284px #fff,1469px 1534px #fff,1074px 1672px #fff,836px 1225px #fff,1115px 1213px #fff,500px 509px #fff,350px 817px #fff,1352px 1204px #fff,530px 786px #fff,53px 906px #fff,414px 601px #fff,977px 552px #fff,447px 196px #fff,67px 548px #fff,837px 399px #fff,1786px 792px #fff,1681px 1843px #fff,1695px 847px #fff,726px 768px #fff,667px 1145px #fff,382px 395px #fff,502px 1182px #fff,1930px 100px #fff,492px 1356px #fff,221px 977px #fff,998px 848px #fff,482px 531px #fff,497px 239px #fff,1795px 681px #fff,1721px 1218px #fff,521px 349px #fff,1573px 1747px #fff,294px 1103px #fff,39px 235px #fff,1502px 1754px #fff,1918px 1587px #fff,1448px 604px #fff,583px 62px #fff,790px 1923px #fff,510px 344px #fff,165px 1091px #fff,1474px 1639px #fff,1577px 1452px #fff,1017px 99px #fff,1547px 679px #fff,852px 1216px #fff,83px 1818px #fff,1240px 1423px #fff,1122px 1475px #fff,418px 230px #fff,1989px 1326px #fff,1828px 1633px #fff,1412px 373px #fff,685px 1113px #fff,1909px 1468px #fff;opacity:.5}.widget .shape-star .rising-stars div:nth-child(3){animation-duration:200s !important;box-shadow:1858px 10327px #fff,1161px 1700px #fff,271px 1050px #fff,1378px 1738px #fff,1479px 1467px #fff,1866px 1558px #fff,802px 12px #fff,1322px 341px #fff,1593px 1458px #fff,1500px 710px #fff,1933px 1717px #fff,487px 1255px #fff,1547px 240px #fff,1460px 931px #fff,1725px 1308px #fff,69px 335px #fff,802px 1969px #fff,1621px 1871px #fff,1553px 113px #fff,1166px 124px #fff,1987px 79px #fff,180px 1271px #fff,466px 765px #fff,129px 1528px #fff,73px 117px #fff,1836px 1944px #fff,335px 125px #fff,145px 364px #fff,1864px 1974px #fff,525px 559px #fff,865px 876px #fff,1097px 828px #fff,1544px 1001px #fff,1362px 411px #fff,1218px 312px #fff,185px 1270px #fff,1273px 493px #fff,1241px 1593px #fff,1410px 1164px #fff,398px 1009px #fff,1700px 570px #fff,1985px 937px #fff,706px 958px #fff,651px 1650px #fff,765px 1675px #fff,1557px 316px #fff,779px 1365px #fff,1150px 581px #fff,251px 1600px #fff,1244px 906px #fff,912px 1051px #fff,733px 1393px #fff,1081px 847px #fff,592px 420px #fff,1820px 736px #fff,912px 807px #fff,1925px 711px #fff,1862px 1277px #fff,985px 1024px #fff,162px 1318px #fff,1714px 559px #fff,1588px 1205px #fff,763px 955px #fff,1760px 1228px #fff,756px 1980px #fff,1119px 382px #fff,1887px 1961px #fff,1869px 798px #fff,1105px 800px #fff,1110px 1166px #fff,1669px 1354px #fff,1014px 128px #fff,290px 692px #fff,1666px 102px #fff,249px 559px #fff,1874px 1811px #fff,1998px 1676px #fff,1728px 1882px #fff,1730px 736px #fff,890px 426px #fff,1388px 1047px #fff,701px 374px #fff,1542px 1736px #fff,781px 163px #fff,791px 809px #fff,1649px 438px #fff,1094px 1475px #fff,241px 382px #fff,1632px 1472px #fff,62px 1676px #fff,1154px 909px #fff,501px 1121px #fff,886px 526px #fff,1587px 1752px #fff,1247px 131px #fff,1800px 242px #fff,590px 1059px #fff,837px 1819px #fff,281px 1355px #fff,161px 1898px #fff,1465px 371px #fff,1578px 823px #fff,877px 1360px #fff,276px 1713px #fff,296px 522px #fff,804px 173px #fff,1793px 617px #fff,1622px 1824px #fff,237px 1068px #fff,1933px 545px #fff,1543px 1870px #fff,884px 578px #fff,125px 250px #fff,986px 882px #fff,1400px 1211px #fff,570px 1508px #fff,1449px 115px #fff,726px 914px #fff,1499px 1532px #fff,1308px 968px #fff,1876px 630px #fff,843px 606px #fff,144px 1085px #fff,878px 1315px #fff,1779px 1571px #fff,1145px 1510px #fff,1368px 1857px #fff,852px 627px #fff,1680px 641px #fff,1652px 1798px #fff,1303px 1056px #fff,1391px 45px #fff,365px 972px #fff,1031px 1860px #fff,1806px 1213px #fff,1249px 233px #fff,1126px 1513px #fff,1921px 1055px #fff,1490px 1176px #fff,641px 1781px #fff,1640px 854px #fff,542px 1083px #fff,106px 679px #fff,1423px 857px #fff,1254px 781px #fff,1775px 950px #fff,681px 239px #fff,756px 478px #fff,1199px 973px #fff,346px 1704px #fff,421px 911px #fff,339px 1168px #fff,586px 1762px #fff,801px 274px #fff,1901px 1693px #fff,914px 1706px #fff,976px 1023px #fff,787px 802px #fff,1057px 1614px #fff,438px 173px #fff,56px 1526px #fff,258px 1960px #fff,1756px 4px #fff,434px 1702px #fff,1590px 1362px #fff,607px 1053px #fff,1510px 1225px #fff,683px 262px #fff,184px 1205px #fff,1579px 891px #fff,131px 1755px #fff,1929px 761px #fff,1867px 1152px #fff,1875px 280px #fff,271px 1683px #fff,671px 1224px #fff,1836px 1011px #fff,1323px 1211px #fff,1149px 1503px #fff,57px 1496px #fff,149px 647px #fff,1927px 142px #fff,381px 1755px #fff,265px 1660px #fff,322px 1161px #fff,946px 304px #fff,1616px 1035px #fff,1283px 1371px #fff,1232px 1532px #fff,1869px 387px #fff,1101px 1882px #fff,1428px 1762px #fff,1666px 620px #fff,444px 739px #fff,1525px 1091px #fff,1372px 1186px #fff,1733px 898px #fff,1076px 72px #fff,538px 1382px #fff,424px 1995px #fff,571px 526px #fff,412px 521px #fff,1372px 564px #fff,1358px 1203px #fff,1427px 689px #fff,1599px 1873px #fff,589px 384px #fff,855px 739px #fff,1431px 1233px #fff,983px 1877px #fff,1174px 1911px #fff,1194px 337px #fff,206px 865px #fff,621px 423px #fff,934px 1528px #fff,853px 1336px #fff,722px 1341px #fff,1806px 1361px #fff,1077px 281px #fff,1298px 79px #fff,258px 389px #fff,666px 560px #fff,1898px 1083px #fff,869px 1141px #fff,345px 1500px #fff,1025px 1327px #fff,1953px 302px #fff,1709px 773px #fff,1565px 467px #fff,1937px 55px #fff,435px 510px #fff,833px 271px #fff,711px 1105px #fff,121px 1869px #fff,1934px 948px #fff,175px 387px #fff,899px 1971px #fff,1784px 1443px #fff,1080px 1296px #fff,1733px 1938px #fff,677px 949px #fff,998px 1514px #fff,455px 1734px #fff,318px 574px #fff,140px 84px #fff,1555px 1854px #fff,1244px 471px #fff,874px 1216px #fff,1590px 358px #fff,1251px 1027px #fff,855px 1210px #fff,540px 1026px #fff,1035px 1680px #fff,814px 1264px #fff,1852px 974px #fff,757px 1443px #fff,836px 22px #fff,1477px 1364px #fff,92px 1002px #fff,114px 1147px #fff,748px 1621px #fff,1293px 1083px #fff,1222px 40px #fff,1870px 210px #fff,943px 1762px #fff,340px 785px #fff,916px 1916px #fff,1993px 1791px #fff,1811px 556px #fff,1839px 1073px #fff,1193px 331px #fff,613px 35px #fff,1858px 1384px #fff,1730px 1678px #fff,1379px 787px #fff,1312px 73px #fff,231px 1475px #fff,903px 939px #fff,1037px 801px #fff,853px 631px #fff,1256px 861px #fff,1329px 685px #fff,1078px 115px #fff,229px 876px #fff,667px 1493px #fff,418px 674px #fff,558px 1881px #fff,1745px 633px #fff,1677px 676px #fff,1407px 616px #fff,1874px 67px #fff,276px 1509px #fff,1757px 543px #fff,280px 249px #fff,1738px 609px #fff,1908px 23px #fff,1677px 580px #fff,32px 1763px #fff,32px 447px #fff,1702px 1504px #fff,1190px 1477px #fff,215px 82px #fff,327px 407px #fff,1559px 1114px #fff,933px 668px #fff,451px 621px #fff,1929px 846px #fff,32px 774px #fff,1956px 1642px #fff,1475px 1964px #fff,676px 1033px #fff,1810px 1514px #fff,1518px 1712px #fff,1436px 1851px #fff,523px 1439px #fff,374px 1219px #fff,609px 1850px #fff,1515px 1935px #fff,54px 775px #fff,1775px 1760px #fff,638px 1563px #fff,319px 560px #fff,1624px 180px #fff,156px 879px #fff,997px 296px #fff,1015px 1008px #fff,1003px 1273px #fff,1916px 585px #fff,729px 692px #fff,576px 742px #fff,346px 1712px #fff,1632px 1017px #fff,1820px 1786px #fff,529px 1067px #fff,1641px 1899px #fff,1034px 1776px #fff,936px 1016px #fff,1372px 1163px #fff,1877px 117px #fff,1400px 1800px #fff,855px 1426px #fff,1333px 1970px #fff,686px 628px #fff,1594px 1839px #fff,1025px 475px #fff,103px 738px #fff,1984px 632px #fff,1471px 1777px #fff,761px 1601px #fff,1892px 277px #fff,1134px 1234px #fff,1811px 198px #fff,87px 704px #fff,1651px 1976px #fff,52px 1767px #fff,704px 1337px #fff,802px 191px #fff,1558px 1521px #fff,561px 1204px #fff,693px 921px #fff,97px 1563px #fff,855px 1409px #fff,458px 250px #fff,144px 1721px #fff,1783px 863px #fff,1595px 691px #fff,345px 308px #fff,1528px 1854px #fff,989px 130px #fff,1325px 1593px #fff,206px 749px #fff,836px 1724px #fff,1278px 208px #fff,232px 829px #fff,199px 638px #fff,1519px 215px #fff,14px 69px #fff,1677px 1092px #fff,1894px 579px #fff,958px 408px #fff,105px 377px #fff,896px 1369px #fff,1793px 864px #fff,279px 987px #fff,1431px 636px #fff,1255px 1430px #fff,1169px 79px #fff,920px 227px #fff,1211px 721px #fff,535px 552px #fff,51px 332px #fff,933px 146px #fff,377px 1335px #fff,249px 63px #fff,1535px 535px #fff,457px 616px #fff,1722px 813px #fff,998px 1478px #fff,308px 1395px #fff,1860px 1153px #fff,146px 1334px #fff,1200px 1599px #fff,1758px 861px #fff,1676px 1494px #fff,344px 1423px #fff,1281px 1775px #fff,1617px 942px #fff,190px 660px #fff,1783px 399px #fff,1364px 1781px #fff,1439px 1725px #fff,146px 1650px #fff,1209px 656px #fff,1181px 938px #fff,1710px 72px #fff,1176px 757px #fff,219px 1728px #fff,1271px 353px #fff,471px 665px #fff,1212px 1531px #fff,1805px 1687px #fff,1225px 1591px #fff,107px 532px #fff,7px 1980px #fff,1366px 89px #fff,1276px 574px #fff,1200px 1144px #fff,1886px 924px #fff,665px 1543px #fff,1418px 55px #fff,1755px 1828px #fff,1626px 48px #fff,697px 1868px #fff,901px 1643px #fff,21px 1696px #fff,932px 1471px #fff,1468px 1972px #fff,1682px 1786px #fff,323px 332px #fff,1798px 1661px #fff,827px 1124px #fff,1790px 1828px #fff,1117px 219px #fff,364px 1082px #fff,808px 1877px #fff,1542px 1281px #fff,1929px 704px #fff,1867px 1408px #fff,1850px 1264px #fff,299px 199px #fff,413px 1414px #fff,117px 1574px #fff,1361px 61px #fff,746px 1194px #fff,1719px 1803px #fff,374px 155px #fff,140px 570px #fff,1797px 850px #fff,1540px 509px #fff,1278px 603px #fff,1520px 1385px #fff,805px 207px #fff,1977px 1386px #fff,1452px 1361px #fff,937px 38px #fff,1294px 1911px #fff,1898px 1002px #fff,657px 972px #fff,1050px 641px #fff,1072px 255px #fff,438px 638px #fff,261px 1056px #fff,620px 1078px #fff,558px 1957px #fff,1767px 1500px #fff,182px 565px #fff,565px 48px #fff,227px 504px #fff,1483px 371px #fff,693px 236px #fff,766px 317px #fff,1305px 669px #fff,885px 537px #fff,1935px 44px #fff,1391px 1152px #fff,220px 1369px #fff,654px 1800px #fff,1974px 264px #fff,1930px 959px #fff,1197px 1905px #fff,543px 1035px #fff,156px 1975px #fff,1828px 1156px #fff,319px 242px #fff,1657px 83px #fff,682px 879px #fff,1293px 1716px #fff,1561px 739px #fff,1365px 927px #fff,1753px 812px #fff;opacity:.3}.widget .shape-star .rising-stars-visible div{animation:risingStarsAnination linear infinite}.widget .shape-earth{position:fixed;z-index:-97;bottom:-1840px;width:1920px;height:1920px;border-radius:9999px;background:#0E0E13;filter:blur(2px)}.index{display:flex;justify-content:center;align-items:center;--mw:968px;flex-direction:column;justify-content:flex-start;padding:96px 40px 60px 40px;min-height:calc(100vh - 100px)}.index .main{width:100%;display:flex;justify-content:space-between;align-items:center;max-width:var(--mw)}.index .hello{display:flex;justify-content:center;align-items:center;--mw:968px;height:400px;width:100%;max-width:var(--mw);flex-direction:column}.index .hello .main{width:100%;display:flex;justify-content:space-between;align-items:center;max-width:var(--mw)}.index .hello .title{display:flex;justify-content:center;align-items:flex-start;gap:8px}.index .hello .title *{font-size:32px;font-weight:700}.index .hello .title .title-hi{font-size:32px;font-weight:700;background:linear-gradient(180deg, #E8E8F6 0%, rgba(232,232,246,0.72) 100%);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}.index .hello .title .title-name{--bg:linear-gradient(90deg, #A29CD3 0%, #E8BFAC 100%);position:relative;background:var(--bg);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}.index .hello .title .title-name:hover::after{content:'';position:absolute;inset:auto 0 0;width:100%;height:1px;background:var(--bg)}.index .hello .hello-desc{height:28px;color:#B3B3C1;font-size:16px;line-height:28px;font-weight:300;letter-spacing:1px;margin:24px 0 0 0}.index .hello::after{content:'';position:absolute;width:512px;height:512px;background-image:radial-gradient(circle at center, rgba(255,255,255,0.3) 1px, transparent 1px);background-size:8px 8px;mask-image:radial-gradient(at center, #fff, transparent 72%);-webkit-mask-image:radial-gradient(at center, #fff, transparent 72%);opacity:0.6;z-index:-1}.index .content-divider{display:flex;justify-content:center;align-items:center;--mw:968px;width:100%;max-width:var(--mw);height:1px;background-image:radial-gradient(circle at center, #4E4E64 1px, transparent 1px);background-size:6px 1px;background-repeat:repeat;mask-image:radial-gradient(at center, #fff, transparent 90%);-webkit-mask-image:radial-gradient(at center, #fff, transparent 90%)}.index .content-divider .main{width:100%;display:flex;justify-content:space-between;align-items:center;max-width:var(--mw)}.index .quickly-link{display:flex;justify-content:center;align-items:center;--mw:968px;flex-direction:column;padding-top:80px;width:100%;max-width:var(--mw)}.index .quickly-link .main{width:100%;display:flex;justify-content:space-between;align-items:center;max-width:var(--mw)}.index .quickly-link .title-hi{font-size:32px;font-weight:700;background:linear-gradient(180deg, #E8E8F6 0%, rgba(232,232,246,0.72) 100%);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}.index .quickly-link .loader{margin:32px 0 48px 0;width:40px;height:8px;--c:#6361DC 90deg,#0E0E13 0;background:conic-gradient(from 135deg at top, var(--c)) 0 0,conic-gradient(from -45deg at bottom, var(--c)) 0 100%;background-size:calc(100%/4) 50%;background-repeat:repeat-x;animation:l12 2s infinite}@keyframes l12{60%,100%{background-position:calc(100%/3) 0,calc(100%/-3) 100%}}.index .quickly-link .link-card{display:flex;justify-content:center;align-items:center;--mw:968px;flex-direction:column;gap:16px;width:100%;max-width:var(--mw)}.index .quickly-link .link-card .main{width:100%;display:flex;justify-content:space-between;align-items:center;max-width:var(--mw)}.index .quickly-link .link-card .link-card-list{width:100%;max-width:var(--mw);display:grid;grid-template-columns:repeat(auto-fill, minmax(240px, 1fr));grid-gap:16px}.index .quickly-link .link-card .link-card-list .link-card-item{background-color:#141419;box-shadow:0px 0px 8px 0px rgba(10,10,14,0.4);--circle-size:400px}.index .quickly-link .link-card .link-card-list .link-card-item *{transition:opacity .4s}.index .quickly-link .link-card .link-card-list .link-card-item a{width:100%;display:flex;flex-direction:row;align-items:center;padding:16px;gap:12px}.index .quickly-link .link-card .link-card-list .link-card-item a:hover{color:#6361DC;transition:all .15s ease-in}.index .quickly-link .link-card .link-card-list .link-card-item a:hover .info,.index .quickly-link .link-card .link-card-list .link-card-item a:hover .icon-arrow,.index .quickly-link .link-card .link-card-list .link-card-item a:hover img{opacity:1}.index .quickly-link .link-card .link-card-list .link-card-item img{width:40px;opacity:.6}.index .quickly-link .link-card .link-card-list .link-card-item .info{width:100%;display:flex;flex-direction:column;align-items:flex-start;gap:4px;opacity:.8}.index .quickly-link .link-card .link-card-list .link-card-item .info .info-title{width:100%;font-size:14px;font-weight:500;line-height:24px;background:linear-gradient(180deg, #E8E8F6 0%, rgba(232,232,246,0.72) 100%);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}.index .quickly-link .link-card .link-card-list .link-card-item .info .info-desc{width:100%;font-size:12px;font-weight:400;line-height:20px;color:#B3B3C1}.index .quickly-link .link-card .link-card-list .link-card-item .icon-arrow{width:14px;height:14px;opacity:0}.work{display:flex;justify-content:center;align-items:center;--mw:968px;padding:154px 40px 60px 40px;flex-direction:column;align-items:center;justify-content:flex-start;min-height:calc(100vh - 100px)}.work .main{width:100%;display:flex;justify-content:space-between;align-items:center;max-width:var(--mw)}.work .card-list{width:100%;max-width:var(--mw);display:grid;grid-template-columns:repeat(auto-fill, minmax(280px, 1fr));grid-gap:16px}.work .card-list .item{--circle-size:600px;border-radius:6px;background-color:#141419;box-shadow:0px 0px 8px 0px rgba(10,10,14,0.4);align-content:start;flex-wrap:wrap}.work .card-list .item a{display:flex;flex-direction:column;padding:16px;gap:16px}.work .card-list .item a .dark{position:relative;font-size:0}.work .card-list .item a .dark::after{content:"";position:absolute;width:100%;height:100%;left:0}.work .card-list .item a .dark .cover{width:100%;border-radius:6px;opacity:.9;transition:opacity .2s}.work .card-list .item a .text{display:flex;flex-direction:column;align-items:flex-start;gap:4px;word-wrap:break-word;opacity:.8;transition:opacity .2s}.work .card-list .item a .text .title-area{display:flex;width:100%;justify-content:space-between;align-items:center;gap:8px}.work .card-list .item a .text .title-area .title{display:flex;align-items:center;gap:4px}.work .card-list .item a .text .title-area .title .name{font-size:14px;line-height:24px;font-weight:500;background:linear-gradient(180deg, #E8E8F6 0%, rgba(232,232,246,0.72) 100%);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}.work .card-list .item a .text .title-area .title .link{opacity:0;transition:opacity .2s}.work .card-list .item a .text .title-area .tag{font-size:12px;line-height:100%;font-weight:500;padding:4px 8px;border-radius:9999px}.work .card-list .item a .text .title-area .tag-web{color:#57AC84;background:rgba(87,172,132,0.1);border:1px solid rgba(87,172,132,0.16)}.work .card-list .item a .text .title-area .tag-assets{color:#D59A78;background:rgba(213,154,120,0.1);border:1px solid rgba(213,154,120,0.16)}.work .card-list .item a .text .title-area .tag-app{color:#cb55d2;background:rgba(203,85,210,0.1);border:1px solid rgba(203,85,210,0.16)}.work .card-list .item a .text .title-area .tag-2b{color:#6F98FF;background:rgba(111,152,255,0.1);border:1px solid rgba(111,152,255,0.16)}.work .card-list .item a .text .title-area .tag-other{color:#939EA9;background:rgba(147,158,169,0.1);border:1px solid rgba(147,158,169,0.16)}.work .card-list .item a .text .desc{width:100%;font-size:12px;line-height:20px;color:#B3B3C1}.work .card-list .item a:hover .cover,.work .card-list .item a:hover .text,.work .card-list .item a:hover .link{opacity:1 !important;transition:opacity .4s}.blog{display:flex;justify-content:center;align-items:center;--mw:968px;padding:154px 40px 60px 40px;flex-direction:row;align-items:flex-start;min-height:calc(100vh - 100px)}.blog .main{width:100%;display:flex;justify-content:space-between;align-items:center;max-width:var(--mw)}.blog .blog-left{min-width:100px;padding-top:10px}.blog .blog-left .blog-left-line{width:6px;position:fixed}.blog .blog-list{display:flex;flex-direction:column;align-items:flex-start;max-width:868px}.blog .blog-list .item{width:100%}.blog .blog-list .item .content-divider{display:flex;justify-content:center;align-items:center;--mw:968px;width:100%;max-width:var(--mw);height:1px;background-image:radial-gradient(circle at center, #4E4E64 1px, transparent 1px);background-size:6px 1px;background-repeat:repeat;mask-image:radial-gradient(at center, #fff, transparent 90%);-webkit-mask-image:radial-gradient(at center, #fff, transparent 90%);margin:24px 0}.blog .blog-list .item .content-divider .main{width:100%;display:flex;justify-content:space-between;align-items:center;max-width:var(--mw)}.blog .blog-list .item a{display:flex;flex-direction:column;gap:16px}.blog .blog-list .item a .text{display:flex;flex-direction:column;align-items:flex-start;gap:8px;opacity:.8;transition:opacity .2s}.blog .blog-list .item a .text .title-area{width:100%;display:flex;justify-content:space-between;align-items:center;gap:12px}.blog .blog-list .item a .text .title-area .title{display:flex;align-items:center;gap:6px}.blog .blog-list .item a .text .title-area .title .name{font-size:16px;line-height:28px;font-weight:500;background:linear-gradient(180deg, #E8E8F6 0%, rgba(232,232,246,0.72) 100%);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;transition:text-shadow .2s}.blog .blog-list .item a .text .title-area .title .link{font-size:16px;line-height:28px;font-weight:500;color:#6361DC;opacity:0;transition:opacity .2s}.blog .blog-list .item a .text .title-area .tag{font-size:14px;line-height:24px;font-weight:400;color:#62616F}.blog .blog-list .item a .text .desc{width:100%;font-size:14px;line-height:24px;font-weight:400;color:#B3B3C1}.blog .blog-list .item a .info{display:flex;flex-direction:row;align-items:center;justify-content:flex-start;gap:8px;opacity:.8;transition:opacity .2s}.blog .blog-list .item a .info .info-avatar{width:12px;height:12px}.blog .blog-list .item a .info .info-name{font-size:12px;line-height:20px;font-weight:400;color:#B3B3C1}.blog .blog-list .item a .info .info-time{font-size:12px;line-height:20px;font-weight:400;color:#62616F}.blog .blog-list .item a:hover .link,.blog .blog-list .item a:hover .text,.blog .blog-list .item a:hover .info{opacity:1 !important;transition:opacity .4s}.blog .blog-list .item a:hover .text .name{text-shadow:0 0 #6361DC}.about{display:flex;justify-content:center;align-items:center;--mw:968px;flex-direction:column;padding:154px 40px 60px 40px}.about .main{width:100%;display:flex;justify-content:space-between;align-items:center;max-width:var(--mw)}.about .about-top{max-width:var(--mw);display:flex;flex-direction:column}.about .about-name{font-size:32px;line-height:100%;font-weight:700;margin-bottom:48px;background:linear-gradient(180deg, #E8E8F6 0%, rgba(232,232,246,0.72) 100%);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}.about .about-info{display:flex;gap:72px}.about .about-info-title{font-size:18px;line-height:100%;font-weight:500;margin-bottom:24px;background:linear-gradient(180deg, #E8E8F6 0%, rgba(232,232,246,0.72) 100%);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}.about .about-info-left{max-width:696px}.about .about-info-left .introduce-desc{font-size:14px;line-height:24px;color:#B3B3C1}.about .about-info-left .introduce-desc a{font-size:14px;line-height:24px;font-weight:500;text-decoration:underline;color:#B3B3C1;transition:color .15s ease-in}.about .about-info-left .introduce-desc a:hover{color:#6361DC}.about .about-info-right{display:flex;flex-direction:column;gap:40px;min-width:200px}.about .about-info-right .contact-desc{font-size:14px;line-height:24px;color:#B3B3C1}.about .about-info-right .contact-desc .list{display:flex;flex-direction:row}.about .about-info-right .contact-desc .list .list-label{font-size:14px;line-height:24px}.about .about-info-right .contact-desc .list .list-value a{font-size:14px;line-height:24px;color:#B3B3C1;transition:color .15s ease-in;text-decoration:underline;display:flex;align-items:center;gap:4px}.about .about-info-right .contact-desc .list .list-value a:hover{cursor:pointer;color:#6361DC}.about .about-info-right .contact-desc .list .copied{opacity:0;color:#15a675;transition:opacity .4s;margin-left:4px}.about .about-info-right .resume-title{margin-bottom:8px}.about .about-info-right .resume-desc{display:flex;flex-direction:column;align-items:flex-start}.about .about-info-right .resume-desc .resume-desc-helptext{font-size:12px;line-height:20px;color:#62616F;margin-bottom:16px}.about .about-info-right .resume-desc .resume-btn{--circle-size:100px;--border:9999px;border-radius:9999px;padding:4px 16px;cursor:pointer;background-color:#6361DC}.about .about-info-right .resume-desc .resume-btn::before{background-color:#6361DC}.about .about-info-right .resume-desc .resume-btn a{font-size:12px;line-height:20px;color:#E8E8F6;text-decoration:none}.about .about-middle{width:100%;max-width:var(--mw);display:flex;flex-direction:column;margin:40px 0 80px 0}.about .about-middle .power{display:flex;flex-direction:column;gap:16px}.about .about-middle .power .list-00{width:100%;display:grid;grid-template-columns:1fr 1fr 1fr 1fr;grid-gap:16px}.about .about-middle .power .list-01{width:100%;display:grid;grid-template-columns:1fr 1fr 1fr 1fr 1fr;grid-gap:16px}.about .about-middle .power .power-card{--circle-size:400px;background-color:#141419;box-shadow:0px 0px 8px 0px rgba(10,10,14,0.4)}.about .about-middle .power .power-card a{width:100%;display:flex;flex-direction:column;align-items:flex-start;gap:12px;padding:16px}.about .about-middle .power .power-card a .card-img{width:32px;height:32px;opacity:.8;transition:opacity .2s;display:flex;align-items:center;justify-content:center;background:no-repeat center}.about .about-middle .power .power-card a .card-img img{z-index:1}.about .about-middle .power .power-card a .card-img::after{content:'';position:absolute;width:32px;height:32px;filter:blur(10px);background:inherit;background-size:100%}.about .about-middle .power .power-card a:hover .card-img,.about .about-middle .power .power-card a:hover .card-text{opacity:1;transition:opacity .4s}.about .about-middle .power .power-card a .card-text{font-size:12px;line-height:20px;color:#B3B3C1;opacity:.8;transition:opacity .2s}.about .about-middle .power .power-card-number{--circle-size:400px;background-color:#141419;box-shadow:0px 0px 8px 0px rgba(10,10,14,0.4)}.about .about-middle .power .power-card-number a{width:100%;display:flex;flex-direction:column;align-items:flex-start;gap:12px;padding:16px}.about .about-middle .power .power-card-number a:hover .card-title,.about .about-middle .power .power-card-number a:hover .card-text{opacity:1;transition:opacity .4s}.about .about-middle .power .power-card-number a .card-title{font-size:18px;line-height:28px;font-weight:500;background:linear-gradient(180deg, #E8E8F6 0%, rgba(232,232,246,0.72) 100%);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;opacity:.8;transition:opacity .2s}.about .about-middle .power .power-card-number a .card-text{font-size:12px;line-height:20px;color:#B3B3C1;opacity:.8;transition:opacity .2s}.about .about-bottom{width:100%;max-width:var(--mw);display:flex;flex-direction:column}.about .about-bottom .experience{width:100%;display:flex;flex-direction:column;gap:48px}.about .about-bottom .experience .item{display:grid;grid-template-columns:1fr 1fr 3fr;gap:16px}.about .about-bottom .experience .item .time{font-size:14px;line-height:24px;color:#B3B3C1}.about .about-bottom .experience .item .name{display:flex;flex-direction:column;gap:4px}.about .about-bottom .experience .item .name .company a{font-size:14px;line-height:24px;color:#B3B3C1;transition:color .15s ease-in}.about .about-bottom .experience .item .name .company a:hover{color:#6361DC}.about .about-bottom .experience .item .name .job{font-size:12px;line-height:20px;color:#62616F}.about .about-bottom .experience .item .project-experience{display:flex;flex-direction:column;gap:40px}.about .about-bottom .experience .item .project-experience .item{display:flex;flex-direction:column;gap:16px}.about .about-bottom .experience .item .project-experience .item .title{font-size:14px;line-height:24px;font-weight:500;background:linear-gradient(180deg, #E8E8F6 0%, rgba(232,232,246,0.72) 100%);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}.about .about-bottom .experience .item .project-experience .item .desc{color:#B3B3C1}.about .about-bottom .experience .item .project-experience .item .desc li{font-size:14px;line-height:28px;list-style:circle}.tooltip{position:relative;display:inline-block}.tooltip .tooltip-box{width:160px;height:160px;visibility:hidden;background-color:#fff;text-align:center;border-radius:6px;padding:20px;box-shadow:0px 4px 24px rgba(10,10,14,0.12);position:absolute;right:0px;top:32px;z-index:9999;opacity:0;transition:opacity .4s}.tooltip .tooltip-box::after{content:" ";position:absolute;bottom:100%;right:10%;border-width:8px;border-style:solid;border-color:transparent transparent white transparent}.tooltip .tooltip-box img{width:120px;height:120px;border-radius:4px}.tooltip:hover .tooltip-box{visibility:visible;opacity:1}
2 |
--------------------------------------------------------------------------------
/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 | Asorn - Product Designer
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
22 |
23 |
24 |
25 |
33 |
34 |
35 |
36 |
37 |
38 |
39 |
Hi, I'm
40 |
Asorn
41 |
42 |
43 |
44 |
45 |
46 |
What did I do
47 |
48 |
49 |
50 |
64 |
78 |
92 |
106 |
120 |
134 |
148 |
149 |
150 |
151 |
152 |
153 |
197 |
198 |
199 |
200 |
213 |
224 |
225 |
240 |
241 |
242 |
243 |
--------------------------------------------------------------------------------
/js/anime.js:
--------------------------------------------------------------------------------
1 | /*
2 | 2017 Julian Garnier
3 | Released under the MIT license
4 | */
5 | var $jscomp$this=this;
6 | (function(v,p){"function"===typeof define&&define.amd?define([],p):"object"===typeof module&&module.exports?module.exports=p():v.anime=p()})(this,function(){function v(a){if(!g.col(a))try{return document.querySelectorAll(a)}catch(b){}}function p(a){return a.reduce(function(a,d){return a.concat(g.arr(d)?p(d):d)},[])}function w(a){if(g.arr(a))return a;g.str(a)&&(a=v(a)||a);return a instanceof NodeList||a instanceof HTMLCollection?[].slice.call(a):[a]}function F(a,b){return a.some(function(a){return a===b})}
7 | function A(a){var b={},d;for(d in a)b[d]=a[d];return b}function G(a,b){var d=A(a),c;for(c in a)d[c]=b.hasOwnProperty(c)?b[c]:a[c];return d}function B(a,b){var d=A(a),c;for(c in b)d[c]=g.und(a[c])?b[c]:a[c];return d}function S(a){a=a.replace(/^#?([a-f\d])([a-f\d])([a-f\d])$/i,function(a,b,d,h){return b+b+d+d+h+h});var b=/^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(a);a=parseInt(b[1],16);var d=parseInt(b[2],16),b=parseInt(b[3],16);return"rgb("+a+","+d+","+b+")"}function T(a){function b(a,b,c){0>
8 | c&&(c+=1);1c?b:c<2/3?a+(b-a)*(2/3-c)*6:a}var d=/hsl\((\d+),\s*([\d.]+)%,\s*([\d.]+)%\)/g.exec(a);a=parseInt(d[1])/360;var c=parseInt(d[2])/100,d=parseInt(d[3])/100;if(0==c)c=d=a=d;else{var e=.5>d?d*(1+c):d+c-d*c,l=2*d-e,c=b(l,e,a+1/3),d=b(l,e,a);a=b(l,e,a-1/3)}return"rgb("+255*c+","+255*d+","+255*a+")"}function x(a){if(a=/([\+\-]?[0-9#\.]+)(%|px|pt|em|rem|in|cm|mm|ex|pc|vw|vh|deg|rad|turn)?/.exec(a))return a[2]}function U(a){if(-1=f.currentTime)for(var u=0;ul&&r=n&&(f.began=!0,e("begin")),e("run")):(r<=l&&0!==P&&(c(0),q&&g()),r>=h&&P!==h&&(c(h),q||g()));a>=h&&(f.remaining?(t=m,"alternate"===f.direction&&(f.reversed=!f.reversed)):(f.pause(),"Promise"in window&&(Q(),R=b()),f.completed||(f.completed=!0,e("complete"))),
19 | k=0);e("update")}a=void 0===a?{}:a;var m,t,k=0,Q=null,R=b(),f=fa(a);f.reset=function(){var a=f.direction,b=f.loop;f.currentTime=0;f.progress=0;f.paused=!0;f.began=!1;f.completed=!1;f.reversed="reverse"===a;f.remaining="alternate"===a&&1===b?2:b;for(a=f.children.length;a--;)b=f.children[a],b.seek(b.offset),b.reset()};f.tick=function(a){m=a;t||(t=m);h((k+m-t)*n.speed)};f.seek=function(a){h(d(a))};f.pause=function(){var a=q.indexOf(f);-1=b&&0<=c&&1>=c){var g=new Float32Array(11);if(b!==d||c!==e)for(var h=0;11>h;++h)g[h]=a(.1*h,b,c);return function(h){if(b===d&&c===e)return h;if(0===h)return 0;if(1===h)return 1;for(var m=0,k=1;10!==k&&g[k]<=h;++k)m+=.1;--k;var k=m+(h-g[k])/(g[k+1]-g[k])*.1,l=3*(1-3*c+3*b)*k*k+2*(3*c-6*b)*k+3*b;if(.001<=l){for(m=0;4>m;++m){l=3*(1-3*c+3*b)*k*k+2*(3*c-6*b)*k+3*b;if(0===l)break;
23 | var n=a(k,b,c)-h,k=k-n/l}h=k}else if(0===l)h=k;else{var k=m,m=m+.1,f=0;do n=k+(m-k)/2,l=a(n,b,c)-h,0++f);h=n}return a(h,d,e)}}}}(),N=function(){function a(a,b){return 0===a||1===a?a:-Math.pow(2,10*(a-1))*Math.sin(2*(a-1-b/(2*Math.PI)*Math.asin(1))*Math.PI/b)}var b="Quad Cubic Quart Quint Sine Expo Circ Back Elastic".split(" "),d={In:[[.55,.085,.68,.53],[.55,.055,.675,.19],[.895,.03,.685,.22],[.755,.05,.855,.06],[.47,0,.745,.715],[.95,.05,.795,.035],[.6,.04,.98,
24 | .335],[.6,-.28,.735,.045],a],Out:[[.25,.46,.45,.94],[.215,.61,.355,1],[.165,.84,.44,1],[.23,1,.32,1],[.39,.575,.565,1],[.19,1,.22,1],[.075,.82,.165,1],[.175,.885,.32,1.275],function(b,c){return 1-a(1-b,c)}],InOut:[[.455,.03,.515,.955],[.645,.045,.355,1],[.77,0,.175,1],[.86,0,.07,1],[.445,.05,.55,.95],[1,0,0,1],[.785,.135,.15,.86],[.68,-.55,.265,1.55],function(b,c){return.5>b?a(2*b,c)/2:1-a(-2*b+2,c)/2}]},c={linear:y(.25,.25,.75,.75)},e={},l;for(l in d)e.type=l,d[e.type].forEach(function(a){return function(d,
25 | e){c["ease"+a.type+b[e]]=g.fnc(d)?d:y.apply($jscomp$this,d)}}(e)),e={type:e.type};return c}(),ia={css:function(a,b,d){return a.style[b]=d},attribute:function(a,b,d){return a.setAttribute(b,d)},object:function(a,b,d){return a[b]=d},transform:function(a,b,d,c,e){c[e]||(c[e]=[]);c[e].push(b+"("+d+")")}},q=[],z=0,ja=function(){function a(){z=requestAnimationFrame(b)}function b(b){var c=q.length;if(c){for(var d=0;dc&&(b.duration=a.duration);a.began=!0;b.children.push(a)});b.reset();b.seek(0);b.autoplay&&b.restart();return b};return b};n.random=function(a,b){return Math.floor(Math.random()*(b-a+1))+a};return n});
--------------------------------------------------------------------------------
/js/firework.js:
--------------------------------------------------------------------------------
1 | // 设置初始状态,用户是否进行了交互
2 | window.human = false;
3 |
4 | // 获取 canvas 元素及其 2D 渲染上下文
5 | var canvasEl = document.querySelector('.fireworks');
6 | var ctx = canvasEl.getContext('2d');
7 |
8 | // 烟花粒子数量
9 | var numberOfParticules = 20;
10 |
11 | // 鼠标指针的位置
12 | var pointerX = 0;
13 | var pointerY = 0;
14 |
15 | // 根据设备支持情况设置触摸或点击事件
16 | var tap = ('ontouchstart' in window || navigator.msMaxTouchPoints) ? 'touchstart' : 'mousedown';
17 |
18 | // 烟花颜色数组
19 | var colors = ['rgba(99, 97, 220, 0.2)', 'rgba(99, 97, 220, 0.4)', 'rgba(139, 240, 254, 0.2)'];
20 |
21 | // 设置 canvas 大小
22 | function setCanvasSize() {
23 | canvasEl.width = window.innerWidth * 2;
24 | canvasEl.height = window.innerHeight * 2;
25 | canvasEl.style.width = window.innerWidth + 'px';
26 | canvasEl.style.height = window.innerHeight + 'px';
27 | canvasEl.getContext('2d').scale(2, 2);
28 | }
29 |
30 | // 更新鼠标指针位置
31 | function updateCoords(e) {
32 | pointerX = e.clientX || e.touches[0].clientX;
33 | pointerY = e.clientY || e.touches[0].clientY;
34 | }
35 |
36 | // 计算烟花粒子的运动方向
37 | function setParticuleDirection(p) {
38 | var angle = anime.random(0, 360) * Math.PI / 180;
39 | var value = anime.random(50, 180);
40 | var radius = [-1, 1][anime.random(0, 1)] * value;
41 | return {
42 | x: p.x + radius * Math.cos(angle),
43 | y: p.y + radius * Math.sin(angle)
44 | }
45 | }
46 |
47 | // 创建烟花粒子
48 | function createParticule(x,y) {
49 | var p = {};
50 | p.x = x;
51 | p.y = y;
52 | p.color = colors[anime.random(0, colors.length - 1)];
53 | p.radius = anime.random(8, 16); //烟花粒子尺寸大小区间
54 | p.endPos = setParticuleDirection(p);
55 | p.draw = function() {
56 | ctx.beginPath();
57 | ctx.arc(p.x, p.y, p.radius, 0, 2 * Math.PI, true);
58 | ctx.fillStyle = p.color;
59 | ctx.fill();
60 | }
61 | return p;
62 | }
63 |
64 | // 创建烟花中心圆
65 | function createCircle(x,y) {
66 | var p = {};
67 | p.x = x;
68 | p.y = y;
69 | p.color = '#6361DC';
70 | p.radius = 0.1;
71 | p.alpha = .01; //不透明度很小,所以等于没有,若需显示可以把不透明度调高
72 | p.lineWidth = 2;
73 | p.draw = function() {
74 | ctx.globalAlpha = p.alpha;
75 | ctx.beginPath();
76 | ctx.arc(p.x, p.y, p.radius, 0, 2 * Math.PI, true);
77 | ctx.lineWidth = p.lineWidth;
78 | ctx.strokeStyle = p.color;
79 | ctx.stroke();
80 | ctx.globalAlpha = 1;
81 | }
82 | return p;
83 | }
84 |
85 | // 渲染烟花粒子
86 | function renderParticule(anim) {
87 | for (var i = 0; i < anim.animatables.length; i++) {
88 | anim.animatables[i].target.draw();
89 | }
90 | }
91 |
92 | // 烟花粒子动画
93 | function animateParticules(x, y) {
94 | var circle = createCircle(x, y);
95 | var particules = [];
96 | for (var i = 0; i < numberOfParticules; i++) {
97 | particules.push(createParticule(x, y));
98 | }
99 | anime.timeline().add({
100 | targets: particules,
101 | x: function(p) { return p.endPos.x; },
102 | y: function(p) { return p.endPos.y; },
103 | radius: 0.1,
104 | duration: anime.random(1200, 1800),
105 | easing: 'easeOutExpo',
106 | update: renderParticule
107 | })
108 | .add({
109 | targets: circle,
110 | radius: anime.random(80, 160),
111 | lineWidth: 0,
112 | alpha: {
113 | value: 0,
114 | easing: 'linear',
115 | duration: anime.random(600, 800),
116 | },
117 | duration: anime.random(1200, 1800),
118 | easing: 'easeOutExpo',
119 | update: renderParticule,
120 | offset: 0
121 | });
122 | }
123 |
124 | // 动画渲染控制器
125 | var render = anime({
126 | duration: Infinity,
127 | update: function() {
128 | ctx.clearRect(0, 0, canvasEl.width, canvasEl.height);
129 | }
130 | });
131 |
132 | // 用户交互触发事件
133 | document.addEventListener(tap, function(e) {
134 | window.human = true;
135 | render.play();
136 | updateCoords(e);
137 | animateParticules(pointerX, pointerY);
138 | }, false);
139 |
140 | // 设置 canvas 尺寸及窗口大小变化时的处理
141 | setCanvasSize();
142 | window.addEventListener('resize', setCanvasSize, false);
143 |
--------------------------------------------------------------------------------
/js/main.js:
--------------------------------------------------------------------------------
1 | //特殊效果
2 | window.addEventListener("mousemove", function(e) {
3 | document.querySelectorAll(".magical").forEach(element => {
4 | if (!element.querySelector(".show")) {
5 | element.insertAdjacentHTML("beforeend", "
");
6 | }
7 | const rect = element.getBoundingClientRect();
8 | const offsetX = e.clientX - rect.left;
9 | const offsetY = e.clientY - rect.top;
10 | element.style.setProperty("--mouse-x", `${offsetX}px`);
11 | element.style.setProperty("--mouse-y", `${offsetY}px`);
12 |
13 | const hoverElement = element.querySelector(".show");
14 | if (hoverElement) {
15 | hoverElement.style.opacity = (offsetX >= 0 && offsetX <= element.clientWidth && offsetY >= 0 && offsetY <= element.clientHeight) ? 1 : 0;
16 | }
17 | });
18 | });
19 |
20 | //邮箱复制
21 | var timeoutId;
22 | document.addEventListener("DOMContentLoaded", function() {
23 | var Ecopied = document.getElementById('emailCopied');
24 | if(Ecopied){
25 | Ecopied.addEventListener("click", function() {
26 | clearTimeout(timeoutId);
27 |
28 | var inputElement = document.createElement("input");
29 | inputElement.value = this.textContent;
30 | document.body.appendChild(inputElement);
31 | inputElement.select();
32 | document.execCommand("copy");
33 | document.body.removeChild(inputElement);
34 |
35 | var copiedElement = document.getElementsByClassName('copied')[0];
36 | copiedElement.style.opacity = 1;
37 |
38 | timeoutId = setTimeout(function() {
39 | copiedElement.style.opacity = 0;
40 | }, 1000);
41 | });
42 | }
43 | });
44 |
45 | //移动端菜单
46 | const menuExpand = document.getElementById("menu-expand");
47 | const menuExpandChild = document.getElementById("menu-expand-child");
48 | const menuPanel = document.getElementById("menu-panel");
49 | let isMenuOpen = false;
50 |
51 | menuExpand.addEventListener("click", function(event) {
52 | event.stopPropagation();
53 |
54 | if (!isMenuOpen) {
55 | menuPanel.style.left = "40px";
56 | menuPanel.style.transition = "left .5s";
57 | } else {
58 | menuPanel.style.left = "100vw";
59 | menuPanel.style.transition = "left .5s";
60 | }
61 | isMenuOpen = !isMenuOpen;
62 |
63 | menuExpand.classList.toggle("active");
64 |
65 | // 添加旋转动画
66 | menuExpandChild.children[0].style.transition = "transform .5s";
67 | menuExpandChild.children[0].style.transform = isMenuOpen ? "rotate(45deg)" : "rotate(0deg)";
68 |
69 | // 防止在动画期间再次点击
70 | menuExpand.style.pointerEvents = "none";
71 |
72 | // 监听动画结束事件
73 | menuPanel.addEventListener("transitionend", function() {
74 | menuExpand.style.pointerEvents = "auto";
75 | menuPanel.style.transition = "none";
76 | }, { once: true });
77 | });
78 |
79 | // 点击文档其他部分来关闭菜单
80 | document.addEventListener("click", function(event) {
81 | if (isMenuOpen && event.target !== menuExpand && event.target !== menuPanel) {
82 | menuPanel.style.left = "100vw";
83 | menuPanel.style.transition = "left .5s";
84 | isMenuOpen = false;
85 | menuExpand.classList.remove("active");
86 |
87 | // 添加反向旋转动画
88 | menuExpandChild.children[0].style.transition = "transform .5s";
89 | menuExpandChild.children[0].style.transform = "rotate(0deg)";
90 | }
91 | });
--------------------------------------------------------------------------------
/js/main.min.js:
--------------------------------------------------------------------------------
1 | var timeoutId;window.addEventListener("mousemove",function(e){document.querySelectorAll(".magical").forEach(n=>{n.querySelector(".show")||n.insertAdjacentHTML("beforeend","
");const t=n.getBoundingClientRect(),i=e.clientX-t.left,o=e.clientY-t.top;n.style.setProperty("--mouse-x",`${i}px`),n.style.setProperty("--mouse-y",`${o}px`);const l=n.querySelector(".show");l&&(l.style.opacity=i>=0&&i<=n.clientWidth&&o>=0&&o<=n.clientHeight?1:0)})}),document.addEventListener("DOMContentLoaded",function(){var e=document.getElementById("emailCopied");e&&e.addEventListener("click",function(){clearTimeout(timeoutId);var e=document.createElement("input");e.value=this.textContent,document.body.appendChild(e),e.select(),document.execCommand("copy"),document.body.removeChild(e);var n=document.getElementsByClassName("copied")[0];n.style.opacity=1,timeoutId=setTimeout(function(){n.style.opacity=0},1e3)})});const menuExpand=document.getElementById("menu-expand"),menuExpandChild=document.getElementById("menu-expand-child"),menuPanel=document.getElementById("menu-panel");let isMenuOpen=!1;menuExpand.addEventListener("click",function(e){e.stopPropagation(),isMenuOpen?(menuPanel.style.left="100vw",menuPanel.style.transition="left .5s"):(menuPanel.style.left="40px",menuPanel.style.transition="left .5s"),isMenuOpen=!isMenuOpen,menuExpand.classList.toggle("active"),menuExpandChild.children[0].style.transition="transform .5s",menuExpandChild.children[0].style.transform=isMenuOpen?"rotate(45deg)":"rotate(0deg)",menuExpand.style.pointerEvents="none",menuPanel.addEventListener("transitionend",function(){menuExpand.style.pointerEvents="auto",menuPanel.style.transition="none"},{once:!0})}),document.addEventListener("click",function(e){isMenuOpen&&e.target!==menuExpand&&e.target!==menuPanel&&(menuPanel.style.left="100vw",menuPanel.style.transition="left .5s",isMenuOpen=!1,menuExpand.classList.remove("active"),menuExpandChild.children[0].style.transition="transform .5s",menuExpandChild.children[0].style.transform="rotate(0deg)")});
--------------------------------------------------------------------------------
/work.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 | Asorn - My Work
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
21 |
22 |
23 |
24 |
32 |
33 |
34 |
35 |
36 |
37 |
52 |
67 |
82 |
97 |
112 |
127 |
142 |
157 |
158 |
159 |
172 |
183 |
184 |
195 |
196 |
197 |
198 |
--------------------------------------------------------------------------------