├── .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 | 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 |
49 |
Contact
50 |
51 |
52 |
Email:
53 |
54 | hi@asorn.cn 55 |
56 | copied ✓ 57 |
58 |
59 |
Wechat:
60 | 67 |
68 |
69 |
70 |
71 |
Resume
72 |
73 |
Download my resume (PDF & 1MB)
74 | 75 |
76 |
77 |
78 |
79 |
80 |
81 | 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 |
233 |
234 |
235 |
236 |
237 |
238 |
239 |
240 |
241 |
242 |
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 | 24 | 32 |
33 |
34 |
35 |
36 |
37 |
38 |
39 |
40 | 60 | 79 | 98 | 117 | 136 | 155 | 174 | 193 | 212 | 231 | 249 |
250 |
251 | 264 |
265 |
266 |
267 |
268 |
269 |
270 |
271 |
272 |
273 |
274 |
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 | 25 | 33 |
34 |
35 |
36 |
37 |
38 |
39 |
Hi, I'm
40 | Asorn 41 |
42 |
43 |
44 |
45 | 199 |
200 | 213 |
214 |
215 |
216 |
217 |
218 |
219 |
220 |
221 |
222 |
223 |
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 | 24 | 32 |
33 |
34 |
35 | 159 | 172 |
173 |
174 |
175 |
176 |
177 |
178 |
179 |
180 |
181 |
182 |
183 | 184 | 195 | 196 | 197 | 198 | --------------------------------------------------------------------------------