portosaurus 2.0.3 → 2.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/bin/portosaurus.mjs +14 -327
- package/package.json +16 -11
- package/src/cli/build.mjs +43 -0
- package/src/cli/dev.mjs +31 -0
- package/src/cli/init.mjs +135 -0
- package/src/cli/serve.mjs +30 -0
- package/src/core/buildDocuConfig.mjs +664 -0
- package/src/core/{themePlugin.mjs → plugins/themePlugin.mjs} +1 -1
- package/src/template/.github/workflows/deploy.yml +52 -0
- package/src/template/.nojekyll +0 -0
- package/src/template/README.md +58 -0
- package/src/template/blog/authors.yml +1 -1
- package/src/template/blog/welcome.md +1 -1
- package/src/template/config.js +40 -23
- package/src/template/package.json +20 -0
- package/src/template/static/img/svg/icon-blog.svg +2 -0
- package/src/template/static/img/svg/icon-note.svg +2 -0
- package/src/{components → theme/components}/AboutSection/index.js +22 -13
- package/src/{components → theme/components}/AboutSection/styles.module.css +59 -48
- package/src/{components → theme/components}/ContactSection/index.js +31 -24
- package/src/{components → theme/components}/ContactSection/styles.module.css +31 -26
- package/src/{components → theme/components}/ExperienceSection/index.js +12 -7
- package/src/{components → theme/components}/ExperienceSection/styles.module.css +23 -20
- package/src/{components → theme/components}/HeroSection/index.js +9 -11
- package/src/{components → theme/components}/HeroSection/styles.module.css +44 -32
- package/src/{components → theme/components}/NoteIndex/index.js +10 -3
- package/src/{components → theme/components}/Preview/components/PreviewHeader.js +14 -8
- package/src/{components → theme/components}/Preview/components/Triggers/Pv.js +32 -7
- package/src/{components → theme/components}/Preview/components/Triggers/SrcPv.js +1 -5
- package/src/theme/components/Preview/index.js +3 -0
- package/src/{components → theme/components}/ProjectsSection/index.js +279 -224
- package/src/{components → theme/components}/ProjectsSection/styles.module.css +21 -17
- package/src/{components → theme/components}/ScrollToTop/index.js +18 -21
- package/src/{components → theme/components}/ScrollToTop/styles.module.css +10 -9
- package/src/theme/components/SocialLinks/index.js +125 -0
- package/src/{components → theme/components}/SocialLinks/styles.module.css +9 -7
- package/src/{components → theme/components}/Tooltip/index.js +4 -1
- package/src/theme/config/iconMappings.js +465 -0
- package/src/theme/config/metaTags.js +239 -0
- package/src/theme/config/prism.js +179 -0
- package/src/theme/config/sidebar.js +17 -0
- package/src/{css → theme/css}/bootstrap.css +0 -1
- package/src/theme/css/catppuccin.css +618 -0
- package/src/{css → theme/css}/custom.css +3 -9
- package/src/{css → theme/css}/tasks.css +43 -37
- package/src/theme/{MDXComponents.js → overrides/MDXComponents.js} +3 -3
- package/src/theme/{Root.js → overrides/Root.js} +2 -4
- package/src/{pages → theme/pages}/index.js +23 -39
- package/src/theme/pages/notes.js +83 -0
- package/src/{pages → theme/pages}/tasks.js +115 -56
- package/src/{core/client-utils → theme/utils}/HashNavigation.js +60 -49
- package/src/{core/client-utils → theme/utils}/updateTitle.js +21 -25
- package/src/{core/build-utils → utils/build}/cssUtils.mjs +5 -3
- package/src/{core/build-utils → utils/build}/generateFavicon.mjs +44 -12
- package/src/{core/build-utils → utils/build}/generateRobotsTxt.mjs +4 -3
- package/src/{core/build-utils → utils/build}/iconExtractor.mjs +7 -3
- package/src/utils/build/imageDownloader.mjs +159 -0
- package/src/{core/build-utils → utils/build}/imageProcessor.mjs +5 -6
- package/src/utils/helpers.mjs +153 -0
- package/src/utils/logger.mjs +53 -0
- package/src/utils/packageManager.mjs +88 -0
- package/src/components/Preview/index.js +0 -3
- package/src/components/SocialLinks/index.js +0 -130
- package/src/config/iconMappings.js +0 -329
- package/src/config/metaTags.js +0 -240
- package/src/config/prism.js +0 -179
- package/src/config/sidebar.js +0 -20
- package/src/core/build-utils/imageDownloader.mjs +0 -98
- package/src/core/createDocuConf.mjs +0 -472
- package/src/core/defaults.mjs +0 -67
- package/src/core/logger.mjs +0 -17
- package/src/core/packageManager.mjs +0 -72
- package/src/css/catppuccin.css +0 -632
- package/src/pages/notes.js +0 -87
- /package/src/template/notes/{welcome.md → welcome.mdx} +0 -0
- /package/src/{components → theme/components}/NoteIndex/styles.module.css +0 -0
- /package/src/{components → theme/components}/Preview/components/FeedbackStates.js +0 -0
- /package/src/{components → theme/components}/Preview/components/FileTabs.js +0 -0
- /package/src/{components → theme/components}/Preview/components/Triggers/index.js +0 -0
- /package/src/{components → theme/components}/Preview/components/ViewerWindow.js +0 -0
- /package/src/{components → theme/components}/Preview/hooks/useDeepLinkHash.js +0 -0
- /package/src/{components → theme/components}/Preview/hooks/useDockLayout.js +0 -0
- /package/src/{components → theme/components}/Preview/hooks/useFileFetch.js +0 -0
- /package/src/{components → theme/components}/Preview/renderers/CodeRenderer.js +0 -0
- /package/src/{components → theme/components}/Preview/renderers/ImageRenderer.js +0 -0
- /package/src/{components → theme/components}/Preview/renderers/PdfRenderer.js +0 -0
- /package/src/{components → theme/components}/Preview/renderers/WebRenderer.js +0 -0
- /package/src/{components → theme/components}/Preview/state/index.js +0 -0
- /package/src/{components → theme/components}/Preview/styles.module.css +0 -0
- /package/src/{components → theme/components}/Preview/utils/index.js +0 -0
- /package/src/{components → theme/components}/Tooltip/styles.module.css +0 -0
|
@@ -0,0 +1,52 @@
|
|
|
1
|
+
name: Deploy to GitHub Pages
|
|
2
|
+
|
|
3
|
+
on:
|
|
4
|
+
push:
|
|
5
|
+
branches:
|
|
6
|
+
- main
|
|
7
|
+
paths-ignore:
|
|
8
|
+
- "README.md"
|
|
9
|
+
- ".gitignore"
|
|
10
|
+
|
|
11
|
+
permissions:
|
|
12
|
+
contents: read
|
|
13
|
+
pages: write
|
|
14
|
+
id-token: write
|
|
15
|
+
|
|
16
|
+
jobs:
|
|
17
|
+
deploy:
|
|
18
|
+
name: Deploy
|
|
19
|
+
runs-on: ubuntu-latest
|
|
20
|
+
steps:
|
|
21
|
+
- name: Checkout
|
|
22
|
+
uses: actions/checkout@v6
|
|
23
|
+
with:
|
|
24
|
+
fetch-depth: 0
|
|
25
|
+
|
|
26
|
+
- name: Setup Bun
|
|
27
|
+
uses: oven-sh/setup-bun@v2
|
|
28
|
+
with:
|
|
29
|
+
bun-version: latest
|
|
30
|
+
|
|
31
|
+
- name: Cache Bun dependencies
|
|
32
|
+
uses: actions/cache@v5
|
|
33
|
+
with:
|
|
34
|
+
path: ~/.bun/install/cache
|
|
35
|
+
key: ${{ runner.os }}-bun-${{ hashFiles('**/bun.lockb') }}
|
|
36
|
+
restore-keys: |
|
|
37
|
+
${{ runner.os }}-bun-
|
|
38
|
+
|
|
39
|
+
- name: Install dependencies
|
|
40
|
+
run: bun install --frozen-lockfile
|
|
41
|
+
|
|
42
|
+
- name: Build site
|
|
43
|
+
run: bun run build
|
|
44
|
+
|
|
45
|
+
- name: Upload artifact
|
|
46
|
+
uses: actions/upload-pages-artifact@v5
|
|
47
|
+
with:
|
|
48
|
+
path: build
|
|
49
|
+
|
|
50
|
+
- name: Deploy to GitHub Pages
|
|
51
|
+
id: deployment
|
|
52
|
+
uses: actions/deploy-pages@v5
|
|
File without changes
|
|
@@ -0,0 +1,58 @@
|
|
|
1
|
+
# {{projectName}}
|
|
2
|
+
|
|
3
|
+
Welcome to my digital personality and portfolio! 👋
|
|
4
|
+
|
|
5
|
+
This is my personal space on the web to express myself, share my thoughts, and showcase my work to the world.
|
|
6
|
+
|
|
7
|
+
## About This Repository
|
|
8
|
+
|
|
9
|
+
This repository contains the source code for my personal website, built with [Portosaurus]({{portoHome}}).
|
|
10
|
+
|
|
11
|
+
It serves as my:
|
|
12
|
+
|
|
13
|
+
- **Portfolio**: Highlighting my projects, skills, and professional experience.
|
|
14
|
+
- **Digital Notebook**: A collection of notes, snippets, and ongoing learnings.
|
|
15
|
+
- **Blog**: Long-form articles and deep dives.
|
|
16
|
+
|
|
17
|
+
## Local Development
|
|
18
|
+
|
|
19
|
+
If you'd like to explore the code or run this site locally:
|
|
20
|
+
|
|
21
|
+
1. **Clone the repository:**
|
|
22
|
+
|
|
23
|
+
```bash
|
|
24
|
+
git clone https://github.com/<MyUserName>/{{projectName}}.git
|
|
25
|
+
cd {{projectName}}
|
|
26
|
+
```
|
|
27
|
+
|
|
28
|
+
2. **Install dependencies:**
|
|
29
|
+
|
|
30
|
+
```bash
|
|
31
|
+
bun install
|
|
32
|
+
```
|
|
33
|
+
|
|
34
|
+
_(npm, yarn, or pnpm work too!)_
|
|
35
|
+
|
|
36
|
+
3. **Start the development server:**
|
|
37
|
+
|
|
38
|
+
```bash
|
|
39
|
+
bun run dev
|
|
40
|
+
```
|
|
41
|
+
|
|
42
|
+
4. **Build for production:**
|
|
43
|
+
```bash
|
|
44
|
+
bun run build
|
|
45
|
+
```
|
|
46
|
+
|
|
47
|
+
## Structure
|
|
48
|
+
|
|
49
|
+
- `config.js` — The configuration for my site.
|
|
50
|
+
- `notes/` — Markdown/MDX files for my digital Notebook.
|
|
51
|
+
- `blog/` — Articles and blog posts.
|
|
52
|
+
- `static/` — Static assets like images and my resume.
|
|
53
|
+
|
|
54
|
+
---
|
|
55
|
+
|
|
56
|
+
<br/>
|
|
57
|
+
|
|
58
|
+
_Powered by [Portosaurus]({{portoHome}})_
|
package/src/template/config.js
CHANGED
|
@@ -1,50 +1,67 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Portosaurus Site Configuration
|
|
3
|
+
* Defines your digital personality, theme, and layouts.
|
|
4
|
+
*/
|
|
1
5
|
exports.usrConf = {
|
|
2
|
-
|
|
3
6
|
dark_mode: true,
|
|
4
7
|
|
|
5
8
|
site_url: "auto",
|
|
6
9
|
site_path: "auto",
|
|
10
|
+
robots_txt: true,
|
|
11
|
+
social_card: "@porto/img/social-card.jpeg",
|
|
12
|
+
collapsable_sidebar: true,
|
|
13
|
+
hide_navbar_on_scroll: true,
|
|
14
|
+
disable_theme_switch: false,
|
|
15
|
+
rss: true,
|
|
16
|
+
|
|
17
|
+
cors_proxy: [],
|
|
7
18
|
|
|
8
19
|
hero_section: {
|
|
9
|
-
title: "
|
|
20
|
+
title: "Your Name",
|
|
21
|
+
intro: "Hello there, I'm",
|
|
22
|
+
subtitle: "I am a",
|
|
10
23
|
profession: "Your Profession",
|
|
11
|
-
description: "Short description about
|
|
12
|
-
|
|
24
|
+
description: "Short description about your profession, passion, goals.",
|
|
25
|
+
learn_more_button_txt: "Learn More",
|
|
26
|
+
profile_pic: "@porto/img/icon.png",
|
|
13
27
|
},
|
|
14
28
|
|
|
15
29
|
about_me: {
|
|
16
30
|
enable: true,
|
|
31
|
+
image: null, // Falls back to hero_section.profile_pic
|
|
17
32
|
description: [
|
|
18
33
|
"Write about yourself here.",
|
|
19
34
|
"Add as many paragraphs as you want.",
|
|
20
35
|
],
|
|
21
|
-
skills: ["Skill 1", "Skill 2"
|
|
36
|
+
skills: ["Skill 1", "Skill 2"],
|
|
22
37
|
resume_link: "",
|
|
23
38
|
},
|
|
24
39
|
|
|
25
40
|
project_shelf: {
|
|
26
41
|
enable: true,
|
|
27
|
-
projects: [
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
github: "https://github.com/you/your-project",
|
|
34
|
-
tags: ["tag1", "tag2"],
|
|
35
|
-
},
|
|
36
|
-
],
|
|
42
|
+
projects: [],
|
|
43
|
+
},
|
|
44
|
+
|
|
45
|
+
experience: {
|
|
46
|
+
enable: false,
|
|
47
|
+
list: [],
|
|
37
48
|
},
|
|
38
49
|
|
|
39
50
|
social_links: {
|
|
40
51
|
enable: true,
|
|
41
|
-
links: [
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
],
|
|
52
|
+
links: [],
|
|
53
|
+
},
|
|
54
|
+
|
|
55
|
+
tasks_page: {
|
|
56
|
+
enable: false,
|
|
57
|
+
title: "Tasks",
|
|
58
|
+
description: "Track your tasks and projects here.",
|
|
59
|
+
tasks: [],
|
|
60
|
+
},
|
|
61
|
+
|
|
62
|
+
link_shortener: {
|
|
63
|
+
enable: false,
|
|
64
|
+
deploy_path: "/l",
|
|
65
|
+
short_links: {},
|
|
49
66
|
},
|
|
50
67
|
};
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "{{projectName}}",
|
|
3
|
+
"version": "0.0.1",
|
|
4
|
+
"private": true,
|
|
5
|
+
"scripts": {
|
|
6
|
+
"dev": "portosaurus dev",
|
|
7
|
+
"start": "portosaurus start",
|
|
8
|
+
"build": "portosaurus build",
|
|
9
|
+
"serve": "portosaurus serve"
|
|
10
|
+
},
|
|
11
|
+
"dependencies": {
|
|
12
|
+
"portosaurus": "^{{portoVer}}"
|
|
13
|
+
},
|
|
14
|
+
"overrides": {
|
|
15
|
+
"webpack": "5.105.4"
|
|
16
|
+
},
|
|
17
|
+
"resolutions": {
|
|
18
|
+
"webpack": "5.105.4"
|
|
19
|
+
}
|
|
20
|
+
}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
|
2
|
+
<svg stroke="#fab387" fill="#2e8555" stroke-width="0" viewBox="0 0 448 512" color="#fab387" style="color:#fab387" height="24" width="24" xmlns="http://www.w3.org/2000/svg"><path d="M162.4 196c4.8-4.9 6.2-5.1 36.4-5.1 27.2 0 28.1.1 32.1 2.1 5.8 2.9 8.3 7 8.3 13.6 0 5.9-2.4 10-7.6 13.4-2.8 1.8-4.5 1.9-31.1 2.1-16.4.1-29.5-.2-31.5-.8-10.3-2.9-14.1-17.7-6.6-25.3zm61.4 94.5c-53.9 0-55.8.2-60.2 4.1-3.5 3.1-5.7 9.4-5.1 13.9.7 4.7 4.8 10.1 9.2 12 2.2 1 14.1 1.7 56.3 1.2l47.9-.6 9.2-1.5c9-5.1 10.5-17.4 3.1-24.4-5.3-4.7-5-4.7-60.4-4.7zm223.4 130.1c-3.5 28.4-23 50.4-51.1 57.5-7.2 1.8-9.7 1.9-172.9 1.8-157.8 0-165.9-.1-172-1.8-8.4-2.2-15.6-5.5-22.3-10-5.6-3.8-13.9-11.8-17-16.4-3.8-5.6-8.2-15.3-10-22C.1 423 0 420.3 0 256.3 0 93.2 0 89.7 1.8 82.6 8.1 57.9 27.7 39 53 33.4c7.3-1.6 332.1-1.9 340-.3 21.2 4.3 37.9 17.1 47.6 36.4 7.7 15.3 7-1.5 7.3 180.6.2 115.8 0 164.5-.7 170.5zm-85.4-185.2c-1.1-5-4.2-9.6-7.7-11.5-1.1-.6-8-1.3-15.5-1.7-12.4-.6-13.8-.8-17.8-3.1-6.2-3.6-7.9-7.6-8-18.3 0-20.4-8.5-39.4-25.3-56.5-12-12.2-25.3-20.5-40.6-25.1-3.6-1.1-11.8-1.5-39.2-1.8-42.9-.5-52.5.4-67.1 6.2-27 10.7-46.3 33.4-53.4 62.4-1.3 5.4-1.6 14.2-1.9 64.3-.4 62.8 0 72.1 4 84.5 9.7 30.7 37.1 53.4 64.6 58.4 9.2 1.7 122.2 2.1 133.7.5 20.1-2.7 35.9-10.8 50.7-25.9 10.7-10.9 17.4-22.8 21.8-38.5 3.2-10.9 2.9-88.4 1.7-93.9z"></path></svg>
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
|
2
|
+
<svg stroke="#fab387" fill="#2e8555" stroke-width="0" viewBox="0 0 448 512" color="#fab387" style="color:#fab387" height="24" width="24" xmlns="http://www.w3.org/2000/svg"><path d="M162.4 196c4.8-4.9 6.2-5.1 36.4-5.1 27.2 0 28.1.1 32.1 2.1 5.8 2.9 8.3 7 8.3 13.6 0 5.9-2.4 10-7.6 13.4-2.8 1.8-4.5 1.9-31.1 2.1-16.4.1-29.5-.2-31.5-.8-10.3-2.9-14.1-17.7-6.6-25.3zm61.4 94.5c-53.9 0-55.8.2-60.2 4.1-3.5 3.1-5.7 9.4-5.1 13.9.7 4.7 4.8 10.1 9.2 12 2.2 1 14.1 1.7 56.3 1.2l47.9-.6 9.2-1.5c9-5.1 10.5-17.4 3.1-24.4-5.3-4.7-5-4.7-60.4-4.7zm223.4 130.1c-3.5 28.4-23 50.4-51.1 57.5-7.2 1.8-9.7 1.9-172.9 1.8-157.8 0-165.9-.1-172-1.8-8.4-2.2-15.6-5.5-22.3-10-5.6-3.8-13.9-11.8-17-16.4-3.8-5.6-8.2-15.3-10-22C.1 423 0 420.3 0 256.3 0 93.2 0 89.7 1.8 82.6 8.1 57.9 27.7 39 53 33.4c7.3-1.6 332.1-1.9 340-.3 21.2 4.3 37.9 17.1 47.6 36.4 7.7 15.3 7-1.5 7.3 180.6.2 115.8 0 164.5-.7 170.5zm-85.4-185.2c-1.1-5-4.2-9.6-7.7-11.5-1.1-.6-8-1.3-15.5-1.7-12.4-.6-13.8-.8-17.8-3.1-6.2-3.6-7.9-7.6-8-18.3 0-20.4-8.5-39.4-25.3-56.5-12-12.2-25.3-20.5-40.6-25.1-3.6-1.1-11.8-1.5-39.2-1.8-42.9-.5-52.5.4-67.1 6.2-27 10.7-46.3 33.4-53.4 62.4-1.3 5.4-1.6 14.2-1.9 64.3-.4 62.8 0 72.1 4 84.5 9.7 30.7 37.1 53.4 64.6 58.4 9.2 1.7 122.2 2.1 133.7.5 20.1-2.7 35.9-10.8 50.7-25.9 10.7-10.9 17.4-22.8 21.8-38.5 3.2-10.9 2.9-88.4 1.7-93.9z"></path></svg>
|
|
@@ -1,13 +1,18 @@
|
|
|
1
|
-
import useDocusaurusContext from
|
|
2
|
-
import styles from
|
|
1
|
+
import useDocusaurusContext from "@docusaurus/useDocusaurusContext";
|
|
2
|
+
import styles from "./styles.module.css";
|
|
3
3
|
|
|
4
|
-
export default function AboutSection({ id, className}) {
|
|
4
|
+
export default function AboutSection({ id, className }) {
|
|
5
5
|
const { siteConfig } = useDocusaurusContext();
|
|
6
6
|
const { customFields } = siteConfig;
|
|
7
7
|
const aboutMe = customFields.aboutMe || {};
|
|
8
8
|
|
|
9
9
|
return (
|
|
10
|
-
<div
|
|
10
|
+
<div
|
|
11
|
+
id={id}
|
|
12
|
+
className={`${styles.aboutSection} ${className || ""}`}
|
|
13
|
+
role="region"
|
|
14
|
+
aria-label="About me section"
|
|
15
|
+
>
|
|
11
16
|
<div className={styles.aboutContainer}>
|
|
12
17
|
<div className={styles.aboutHeader}>
|
|
13
18
|
<h2 className={styles.aboutHeading}>{"About Me"}</h2>
|
|
@@ -18,9 +23,9 @@ export default function AboutSection({ id, className}) {
|
|
|
18
23
|
<div className={styles.bioImageContainer}>
|
|
19
24
|
{aboutMe.image && (
|
|
20
25
|
<div className={styles.imageWrapper}>
|
|
21
|
-
<img
|
|
22
|
-
src={aboutMe.image}
|
|
23
|
-
alt="About Me"
|
|
26
|
+
<img
|
|
27
|
+
src={aboutMe.image}
|
|
28
|
+
alt="About Me"
|
|
24
29
|
className={styles.aboutImage}
|
|
25
30
|
loading="lazy"
|
|
26
31
|
/>
|
|
@@ -32,7 +37,9 @@ export default function AboutSection({ id, className}) {
|
|
|
32
37
|
<div className={styles.bioText}>
|
|
33
38
|
{Array.isArray(aboutMe.description) ? (
|
|
34
39
|
aboutMe.description.map((paragraph, index) => (
|
|
35
|
-
<p key={index} className={styles.aboutParagraph}>
|
|
40
|
+
<p key={index} className={styles.aboutParagraph}>
|
|
41
|
+
{paragraph}
|
|
42
|
+
</p>
|
|
36
43
|
))
|
|
37
44
|
) : (
|
|
38
45
|
<p className={styles.aboutParagraph}>
|
|
@@ -40,15 +47,17 @@ export default function AboutSection({ id, className}) {
|
|
|
40
47
|
</p>
|
|
41
48
|
)}
|
|
42
49
|
</div>
|
|
43
|
-
|
|
50
|
+
|
|
44
51
|
{aboutMe.skills && aboutMe.skills.length > 0 && (
|
|
45
52
|
<div className={styles.skillsContainer}>
|
|
46
|
-
<h3 className={styles.skillsTitle} id="skills-heading">
|
|
53
|
+
<h3 className={styles.skillsTitle} id="skills-heading">
|
|
54
|
+
My Skills
|
|
55
|
+
</h3>
|
|
47
56
|
<div className={styles.skillsGrid} role="list">
|
|
48
57
|
{aboutMe.skills.map((skill, index) => (
|
|
49
|
-
<div
|
|
50
|
-
key={index}
|
|
51
|
-
className={styles.skillBadge}
|
|
58
|
+
<div
|
|
59
|
+
key={index}
|
|
60
|
+
className={styles.skillBadge}
|
|
52
61
|
role="listitem"
|
|
53
62
|
style={{ animationDelay: `${index * 0.05}s` }}
|
|
54
63
|
>
|
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
|
|
2
1
|
/* Animations*/
|
|
3
2
|
|
|
4
3
|
@keyframes skillAppear {
|
|
@@ -20,22 +19,25 @@
|
|
|
20
19
|
}
|
|
21
20
|
|
|
22
21
|
@keyframes slideUp {
|
|
23
|
-
from {
|
|
22
|
+
from {
|
|
24
23
|
opacity: 0;
|
|
25
|
-
transform: translateY(20px);
|
|
24
|
+
transform: translateY(20px);
|
|
26
25
|
}
|
|
27
|
-
to {
|
|
26
|
+
to {
|
|
28
27
|
opacity: 1;
|
|
29
|
-
transform: translateY(0);
|
|
28
|
+
transform: translateY(0);
|
|
30
29
|
}
|
|
31
30
|
}
|
|
32
31
|
|
|
33
32
|
@keyframes fadeIn {
|
|
34
|
-
from {
|
|
35
|
-
|
|
33
|
+
from {
|
|
34
|
+
opacity: 0;
|
|
35
|
+
}
|
|
36
|
+
to {
|
|
37
|
+
opacity: 1;
|
|
38
|
+
}
|
|
36
39
|
}
|
|
37
40
|
|
|
38
|
-
|
|
39
41
|
/* Styles */
|
|
40
42
|
|
|
41
43
|
.aboutSection {
|
|
@@ -75,7 +77,7 @@
|
|
|
75
77
|
}
|
|
76
78
|
|
|
77
79
|
.aboutHeading::after {
|
|
78
|
-
content:
|
|
80
|
+
content: "";
|
|
79
81
|
position: absolute;
|
|
80
82
|
width: 30%;
|
|
81
83
|
height: 3px;
|
|
@@ -117,14 +119,16 @@
|
|
|
117
119
|
border-radius: var(--ifm-card-border-radius);
|
|
118
120
|
overflow: hidden;
|
|
119
121
|
box-shadow: 0 10px 20px var(--ifm-shadow-color);
|
|
120
|
-
transform: none;
|
|
121
|
-
transition:
|
|
122
|
+
transform: none;
|
|
123
|
+
transition:
|
|
124
|
+
transform 0.4s ease,
|
|
125
|
+
box-shadow 0.4s ease;
|
|
122
126
|
max-width: 350px;
|
|
123
127
|
margin: auto 0;
|
|
124
128
|
}
|
|
125
129
|
|
|
126
130
|
.imageWrapper::before {
|
|
127
|
-
content:
|
|
131
|
+
content: "";
|
|
128
132
|
position: absolute;
|
|
129
133
|
top: 0;
|
|
130
134
|
left: 0;
|
|
@@ -184,7 +188,7 @@
|
|
|
184
188
|
}
|
|
185
189
|
|
|
186
190
|
.aboutParagraph::before {
|
|
187
|
-
content:
|
|
191
|
+
content: "";
|
|
188
192
|
position: absolute;
|
|
189
193
|
left: 0;
|
|
190
194
|
top: 0.5rem;
|
|
@@ -208,7 +212,9 @@
|
|
|
208
212
|
color: var(--ifm-background-color);
|
|
209
213
|
background-color: var(--ifm-color-primary);
|
|
210
214
|
border-radius: var(--ifm-global-radius);
|
|
211
|
-
transition:
|
|
215
|
+
transition:
|
|
216
|
+
all 0.3s ease,
|
|
217
|
+
transform 0.2s ease;
|
|
212
218
|
border: 2px solid var(--ifm-color-primary);
|
|
213
219
|
position: relative;
|
|
214
220
|
overflow: hidden;
|
|
@@ -217,15 +223,15 @@
|
|
|
217
223
|
}
|
|
218
224
|
|
|
219
225
|
.resumeButton::before {
|
|
220
|
-
content:
|
|
226
|
+
content: "";
|
|
221
227
|
position: absolute;
|
|
222
228
|
top: 0;
|
|
223
229
|
left: -100%;
|
|
224
230
|
width: 100%;
|
|
225
231
|
height: 100%;
|
|
226
232
|
background: linear-gradient(
|
|
227
|
-
90deg,
|
|
228
|
-
transparent,
|
|
233
|
+
90deg,
|
|
234
|
+
transparent,
|
|
229
235
|
rgba(255, 255, 255, 0.2),
|
|
230
236
|
transparent
|
|
231
237
|
);
|
|
@@ -269,7 +275,7 @@
|
|
|
269
275
|
}
|
|
270
276
|
|
|
271
277
|
.skillsTitle::after {
|
|
272
|
-
content:
|
|
278
|
+
content: "";
|
|
273
279
|
position: absolute;
|
|
274
280
|
width: 40%;
|
|
275
281
|
height: 2px;
|
|
@@ -325,60 +331,60 @@
|
|
|
325
331
|
scroll-margin-top: var(--ifm-scroll-margin-top-mobile);
|
|
326
332
|
padding: 1.5rem 0 4rem;
|
|
327
333
|
}
|
|
328
|
-
|
|
334
|
+
|
|
329
335
|
.aboutContainer {
|
|
330
336
|
padding: 0 1.5rem;
|
|
331
337
|
}
|
|
332
|
-
|
|
338
|
+
|
|
333
339
|
.aboutHeader {
|
|
334
340
|
margin-bottom: 2rem;
|
|
335
341
|
}
|
|
336
|
-
|
|
342
|
+
|
|
337
343
|
.aboutHeading {
|
|
338
344
|
font-size: 2.4rem;
|
|
339
345
|
}
|
|
340
|
-
|
|
346
|
+
|
|
341
347
|
.aboutBio {
|
|
342
348
|
flex-direction: column;
|
|
343
349
|
gap: 2rem;
|
|
344
350
|
}
|
|
345
|
-
|
|
351
|
+
|
|
346
352
|
.bioImageContainer {
|
|
347
353
|
width: 100%;
|
|
348
354
|
padding-top: 0;
|
|
349
355
|
padding-bottom: 0.8rem;
|
|
350
356
|
margin-bottom: 0.8rem;
|
|
351
357
|
}
|
|
352
|
-
|
|
358
|
+
|
|
353
359
|
.imageWrapper {
|
|
354
360
|
transform: none;
|
|
355
361
|
max-width: 300px;
|
|
356
362
|
margin: 0 auto;
|
|
357
363
|
}
|
|
358
|
-
|
|
364
|
+
|
|
359
365
|
.bioTextContainer {
|
|
360
366
|
width: 100%;
|
|
361
367
|
gap: 1rem;
|
|
362
368
|
}
|
|
363
|
-
|
|
369
|
+
|
|
364
370
|
.skillsContainer {
|
|
365
371
|
padding: 0.6rem 0 0.5rem;
|
|
366
372
|
margin-top: 0;
|
|
367
373
|
}
|
|
368
|
-
|
|
374
|
+
|
|
369
375
|
.skillsTitle {
|
|
370
376
|
margin-bottom: 1rem;
|
|
371
377
|
display: block;
|
|
372
378
|
text-align: center;
|
|
373
379
|
width: 100%;
|
|
374
380
|
}
|
|
375
|
-
|
|
381
|
+
|
|
376
382
|
.skillsTitle::after {
|
|
377
383
|
width: 40px;
|
|
378
384
|
left: 50%;
|
|
379
385
|
transform: translateX(-50%);
|
|
380
386
|
}
|
|
381
|
-
|
|
387
|
+
|
|
382
388
|
.skillsGrid {
|
|
383
389
|
justify-content: center;
|
|
384
390
|
}
|
|
@@ -390,70 +396,70 @@
|
|
|
390
396
|
padding: 0.5rem 0 2.5rem;
|
|
391
397
|
min-height: auto;
|
|
392
398
|
}
|
|
393
|
-
|
|
399
|
+
|
|
394
400
|
.aboutContainer {
|
|
395
401
|
padding: 0 1rem;
|
|
396
402
|
}
|
|
397
|
-
|
|
403
|
+
|
|
398
404
|
.aboutHeader {
|
|
399
405
|
margin-bottom: 1.4rem;
|
|
400
406
|
}
|
|
401
|
-
|
|
407
|
+
|
|
402
408
|
.aboutHeading {
|
|
403
409
|
font-size: 1.8rem;
|
|
404
410
|
}
|
|
405
|
-
|
|
411
|
+
|
|
406
412
|
.aboutContent {
|
|
407
413
|
gap: 1.5rem;
|
|
408
414
|
}
|
|
409
|
-
|
|
415
|
+
|
|
410
416
|
.aboutBio {
|
|
411
417
|
gap: 1.6rem;
|
|
412
418
|
}
|
|
413
|
-
|
|
419
|
+
|
|
414
420
|
.bioImageContainer {
|
|
415
421
|
padding-top: 0;
|
|
416
422
|
padding-bottom: 0.3rem;
|
|
417
423
|
margin-bottom: 0;
|
|
418
424
|
}
|
|
419
|
-
|
|
425
|
+
|
|
420
426
|
.imageWrapper {
|
|
421
427
|
max-width: 200px;
|
|
422
428
|
margin: 0 auto 0.5rem;
|
|
423
429
|
}
|
|
424
|
-
|
|
430
|
+
|
|
425
431
|
.aboutParagraph {
|
|
426
432
|
font-size: 0.95rem;
|
|
427
433
|
line-height: 1.6;
|
|
428
434
|
padding-left: 0.6rem;
|
|
429
435
|
}
|
|
430
|
-
|
|
436
|
+
|
|
431
437
|
.aboutParagraph::before {
|
|
432
438
|
width: 2px;
|
|
433
439
|
}
|
|
434
|
-
|
|
440
|
+
|
|
435
441
|
.skillsTitle {
|
|
436
442
|
font-size: 1.1rem;
|
|
437
443
|
margin-bottom: 0.8rem;
|
|
438
444
|
text-align: center;
|
|
439
445
|
}
|
|
440
|
-
|
|
446
|
+
|
|
441
447
|
.skillsGrid {
|
|
442
448
|
gap: 0.6rem;
|
|
443
449
|
justify-content: center;
|
|
444
450
|
padding-top: 0.3rem;
|
|
445
451
|
}
|
|
446
|
-
|
|
452
|
+
|
|
447
453
|
.skillBadge {
|
|
448
454
|
font-size: 0.8rem;
|
|
449
455
|
padding: 0.35rem 0.8rem;
|
|
450
456
|
border-radius: 16px;
|
|
451
457
|
}
|
|
452
|
-
|
|
458
|
+
|
|
453
459
|
.bioTextContainer {
|
|
454
460
|
gap: 0.6rem;
|
|
455
461
|
}
|
|
456
|
-
|
|
462
|
+
|
|
457
463
|
.skillsContainer {
|
|
458
464
|
padding: 0.3rem 0 0.5rem;
|
|
459
465
|
}
|
|
@@ -463,16 +469,16 @@
|
|
|
463
469
|
.aboutHeading {
|
|
464
470
|
font-size: 1.6rem;
|
|
465
471
|
}
|
|
466
|
-
|
|
472
|
+
|
|
467
473
|
.imageWrapper {
|
|
468
474
|
max-width: 180px;
|
|
469
475
|
}
|
|
470
|
-
|
|
476
|
+
|
|
471
477
|
.skillBadge {
|
|
472
478
|
font-size: 0.75rem;
|
|
473
479
|
padding: 0.3rem 0.7rem;
|
|
474
480
|
}
|
|
475
|
-
|
|
481
|
+
|
|
476
482
|
.aboutParagraph {
|
|
477
483
|
font-size: 0.9rem;
|
|
478
484
|
line-height: 1.5;
|
|
@@ -480,8 +486,13 @@
|
|
|
480
486
|
}
|
|
481
487
|
|
|
482
488
|
@media (prefers-reduced-motion: reduce) {
|
|
483
|
-
.aboutHeading,
|
|
484
|
-
.
|
|
489
|
+
.aboutHeading,
|
|
490
|
+
.aboutContent,
|
|
491
|
+
.aboutImage,
|
|
492
|
+
.resumeButton,
|
|
493
|
+
.skillBadge,
|
|
494
|
+
.imageWrapper,
|
|
495
|
+
.resumeButton::before,
|
|
485
496
|
.aboutParagraph {
|
|
486
497
|
animation: none !important;
|
|
487
498
|
transition: none !important;
|