Compare commits
171 commits
example-si
...
main
Author | SHA1 | Date | |
---|---|---|---|
|
c7fb163e66 | ||
|
7223361464 | ||
|
b79aee97d6 | ||
|
e6dfa1327a | ||
|
a9fcfdba26 | ||
|
f329b3f2cb | ||
|
23cc80dea8 | ||
|
aa91957832 | ||
|
ba6bb5d369 | ||
|
417ef950c7 | ||
|
181c12376e | ||
|
9a8d3af57d | ||
|
f8befe62cc | ||
|
35a1686bfe | ||
|
0c4b9edf48 | ||
|
5c1de702ad | ||
|
07372519ee | ||
|
047bb517cb | ||
|
4e4acdbb6b | ||
|
3be5a58a7c | ||
|
515b7eb3bf | ||
|
024ffa7b48 | ||
|
aa9b49b318 | ||
|
2f670db6a0 | ||
|
bc67ca1187 | ||
|
22531ce9a8 | ||
|
d6df1f4b7c | ||
|
cad7dae666 | ||
|
0d4d8a8e3c | ||
|
9da3e3420b | ||
|
0f6737eee0 | ||
|
0e8f82703f | ||
|
9300a22068 | ||
|
804a866371 | ||
|
da8dbea6ca | ||
|
618039a87e | ||
|
55da71cd90 | ||
|
f032986c23 | ||
|
aab2b39c50 | ||
|
f2e549772d | ||
|
0090f7b1fa | ||
|
577e3a5d00 | ||
|
7bc37c74c7 | ||
|
3ce670e2a5 | ||
|
02e5e99cf6 | ||
|
dde735d3af | ||
|
d0329531d7 | ||
|
05dce9c509 | ||
|
8599c634e3 | ||
|
6350e5e2e2 | ||
|
b40f6f85b9 | ||
|
6f318f5480 | ||
|
f3dacf112c | ||
|
a959cb174d | ||
|
a3213b46f9 | ||
|
3edd8e7858 | ||
|
6f4e23ad40 | ||
|
2b47657a12 | ||
|
e3da3d413b | ||
|
612048a7f9 | ||
|
5b1248da4d | ||
|
3290d40918 | ||
1d79da23ba | |||
|
03148c9f3f | ||
|
f8c6d8c613 | ||
|
07763e7737 | ||
|
d90b878f92 | ||
|
7baa0b34ad | ||
|
2574f609a1 | ||
|
a69388d9b8 | ||
|
600c50c71c | ||
|
36e3e4c09c | ||
|
803821d7e8 | ||
|
1ec4cd2688 | ||
|
9f5a44e24e | ||
|
32e95a572f | ||
|
b8bee52c7c | ||
|
35bca71987 | ||
|
cbdb07dbf1 | ||
|
970656789c | ||
|
df78c743c8 | ||
|
96768ade2d | ||
|
11bddc36a2 | ||
|
e8b0cfb32e | ||
|
de1cee3951 | ||
|
3283a3b844 | ||
|
3d1b8f830f | ||
|
5159cdf6bb | ||
|
b3aae4de33 | ||
|
c74672c1c1 | ||
|
def5ce662e | ||
|
1aa27921d0 | ||
|
2c5cbeee94 | ||
|
b9713b5461 | ||
|
0c0072eac1 | ||
|
fdfee4d3bb | ||
|
d3968ca711 | ||
|
48a7b47319 | ||
|
2801749573 | ||
|
d5fb8e5313 | ||
|
bb9fec2e5d | ||
|
93dc9dbb26 | ||
|
434061ea6b | ||
|
40d121bf2c | ||
|
bb56bfbc77 | ||
|
93fc487111 | ||
|
e5230e8c93 | ||
|
017ab6262a | ||
|
cd2546d4e8 | ||
|
c00d676b26 | ||
|
05c9d3d850 | ||
|
e61d6b796b | ||
|
fbbef3b2c5 | ||
|
69611695e7 | ||
|
fecc0546e6 | ||
|
45b0b5b704 | ||
|
acd4f63cda | ||
|
aa7bdb0899 | ||
|
5b31653ed2 | ||
|
e35f917370 | ||
|
a917e1e3f7 | ||
|
bd2181eaca | ||
|
e8f8f3b22b | ||
|
1dbe8aca45 | ||
|
a1188673ad | ||
|
539828cbff | ||
|
42d3c650f8 | ||
|
03d263c4a1 | ||
|
c943f39617 | ||
|
5f0aebcf68 | ||
|
6dc9d1d33d | ||
|
77447b7723 | ||
|
bd7ad1148d | ||
|
cc0b957979 | ||
|
80205a7117 | ||
|
8f2d583ab6 | ||
|
08017d5977 | ||
|
0e12222cc3 | ||
|
678d955044 | ||
|
55560f40bd | ||
|
0afcdcd468 | ||
|
5372e856d7 | ||
|
a128873f20 | ||
|
9a759090cd | ||
|
cd80fc9015 | ||
|
53f1bc9137 | ||
|
147a4c1a0f | ||
|
83d10c59ad | ||
|
4940d4a929 | ||
|
88bfd76efd | ||
|
8d34a7573b | ||
|
951557050e | ||
|
aa2aea46ee | ||
|
5bfe8b7428 | ||
|
5b281a7f57 | ||
|
a71b73840e | ||
|
b99f5ada20 | ||
|
0d20efe1b7 | ||
|
b498330793 | ||
|
e5fcc95e8b | ||
|
d9eccf58f4 | ||
|
cef76eb748 | ||
|
0c8c8ce2d4 | ||
|
cefa24409e | ||
|
2f3a30a4ff | ||
|
3957190425 | ||
|
6620c35f5d | ||
|
374b4019d8 | ||
|
95ecdfb83c | ||
|
38ea2c6c6e | ||
|
85f6413b7e |
807 changed files with 14961 additions and 13985 deletions
|
@ -1 +1,3 @@
|
|||
node_modules
|
||||
node_modules
|
||||
exampleSite/node_modules
|
||||
exampleSite/public
|
||||
|
|
8
.github/workflows/autoprefixer.yml
vendored
8
.github/workflows/autoprefixer.yml
vendored
|
@ -8,12 +8,12 @@ jobs:
|
|||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- name: Checkout to latest commit
|
||||
uses: actions/checkout@v3.2.0
|
||||
uses: actions/checkout@v4.2.2
|
||||
|
||||
- name: Setup Node
|
||||
uses: actions/setup-node@v3
|
||||
uses: actions/setup-node@v4
|
||||
with:
|
||||
node-version: "15.x"
|
||||
node-version: "20.x"
|
||||
|
||||
- name: Run autoprefixer
|
||||
run: |
|
||||
|
@ -21,7 +21,7 @@ jobs:
|
|||
npm run autoprefixer
|
||||
|
||||
- name: Create Pull Request
|
||||
uses: peter-evans/create-pull-request@v4
|
||||
uses: peter-evans/create-pull-request@v7
|
||||
with:
|
||||
branch: autoprefixer
|
||||
branch-suffix: timestamp
|
||||
|
|
28
.github/workflows/build.yml
vendored
28
.github/workflows/build.yml
vendored
|
@ -1,28 +0,0 @@
|
|||
name: Run Build
|
||||
|
||||
# Run action on pull request event
|
||||
on: [pull_request]
|
||||
|
||||
|
||||
jobs:
|
||||
build:
|
||||
runs-on: ubuntu-18.04
|
||||
steps:
|
||||
# checkout to the commit that has been pushed
|
||||
- uses: actions/checkout@v3.2.0
|
||||
with:
|
||||
submodules: true # Fetch Hugo themes (true OR recursive)
|
||||
fetch-depth: 0 # Fetch all history for .GitInfo and .Lastmod
|
||||
|
||||
# install Hugo
|
||||
- name: Setup Hugo
|
||||
uses: peaceiris/actions-hugo@v2.6.0
|
||||
with:
|
||||
hugo-version: 'latest'
|
||||
extended: true
|
||||
|
||||
# build website
|
||||
- name: Create Config
|
||||
run: touch config.toml
|
||||
- name: Build
|
||||
run: hugo --minify
|
8
.github/workflows/codeql-analysis.yml
vendored
8
.github/workflows/codeql-analysis.yml
vendored
|
@ -39,11 +39,11 @@ jobs:
|
|||
|
||||
steps:
|
||||
- name: Checkout repository
|
||||
uses: actions/checkout@v3.2.0
|
||||
uses: actions/checkout@v4.2.2
|
||||
|
||||
# Initializes the CodeQL tools for scanning.
|
||||
- name: Initialize CodeQL
|
||||
uses: github/codeql-action/init@v2
|
||||
uses: github/codeql-action/init@v3
|
||||
with:
|
||||
languages: ${{ matrix.language }}
|
||||
# If you wish to specify custom queries, you can do so here or in a config file.
|
||||
|
@ -54,7 +54,7 @@ jobs:
|
|||
# Autobuild attempts to build any compiled languages (C/C++, C#, or Java).
|
||||
# If this step fails, then you should remove it and run the build manually (see below)
|
||||
- name: Autobuild
|
||||
uses: github/codeql-action/autobuild@v2
|
||||
uses: github/codeql-action/autobuild@v3
|
||||
|
||||
# ℹ️ Command-line programs to run using the OS shell.
|
||||
# 📚 https://git.io/JvXDl
|
||||
|
@ -68,4 +68,4 @@ jobs:
|
|||
# make release
|
||||
|
||||
- name: Perform CodeQL Analysis
|
||||
uses: github/codeql-action/analyze@v2
|
||||
uses: github/codeql-action/analyze@v3
|
||||
|
|
|
@ -1,9 +1,12 @@
|
|||
name: Enforce Labels
|
||||
name: Label Enforcer
|
||||
|
||||
# Run action on pull request creation, reopening, or label changes
|
||||
on:
|
||||
pull_request:
|
||||
types: [labeled, unlabeled, opened, edited, synchronize]
|
||||
types: [opened, reopened, labeled, unlabeled]
|
||||
|
||||
jobs:
|
||||
# Ensure that PR has desired labels
|
||||
enforce-label:
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
13
.github/workflows/md-link-checker.yml
vendored
13
.github/workflows/md-link-checker.yml
vendored
|
@ -1,13 +0,0 @@
|
|||
name: Check Markdown links
|
||||
|
||||
# Run action on pull request event
|
||||
on: [pull_request]
|
||||
|
||||
jobs:
|
||||
markdown-link-check:
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
# checkout to latest commit
|
||||
- uses: actions/checkout@v3.2.0
|
||||
# run markdown linter
|
||||
- uses: gaurav-nelson/github-action-markdown-link-check@1.0.14
|
|
@ -1,4 +1,4 @@
|
|||
name: Release Drafter
|
||||
name: Merge to main workflows
|
||||
# Run action on push in mater branch
|
||||
on:
|
||||
push:
|
||||
|
@ -10,6 +10,6 @@ jobs:
|
|||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
# Create/Update release draft
|
||||
- uses: release-drafter/release-drafter@v5.22.0
|
||||
- uses: release-drafter/release-drafter@v6.1.0
|
||||
env:
|
||||
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
|
150
.github/workflows/project-automation-issue.yaml
vendored
150
.github/workflows/project-automation-issue.yaml
vendored
|
@ -1,150 +0,0 @@
|
|||
name: Project Automation (Issue)
|
||||
on:
|
||||
issues:
|
||||
types:
|
||||
- opened
|
||||
- reopened
|
||||
- closed
|
||||
- labeled
|
||||
- unlabeled
|
||||
jobs:
|
||||
issue_automation:
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- name: Get project data
|
||||
env:
|
||||
GITHUB_TOKEN: ${{secrets.PROJECT_AUTOMATION}}
|
||||
ORGANIZATION: hugo-toha
|
||||
PROJECT_NUMBER: 4
|
||||
run: |
|
||||
gh api graphql --header 'GraphQL-Features: projects_next_graphql' -f query='
|
||||
query($org: String!, $number: Int!) {
|
||||
organization(login: $org){
|
||||
projectNext(number: $number) {
|
||||
id
|
||||
fields(first:20) {
|
||||
nodes {
|
||||
id
|
||||
name
|
||||
settings
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}' -f org="$ORGANIZATION" -F number=$PROJECT_NUMBER > project_data.json
|
||||
|
||||
echo 'PROJECT_ID='$(jq -r '.data.organization.projectNext.id' project_data.json) >> $GITHUB_ENV
|
||||
|
||||
# Read the ID of the "Type" field options
|
||||
echo 'TYPE_ID='$(jq -r '.data.organization.projectNext.fields.nodes[] | select(.name== "Type") |.id' project_data.json) >> $GITHUB_ENV
|
||||
echo 'PROJECT_ID='$(jq -r '.data.organization.projectNext.id' project_data.json) >> $GITHUB_ENV
|
||||
echo 'TYPE_ID='$(jq -r '.data.organization.projectNext.fields.nodes[] | select(.name== "Type") |.id' project_data.json) >> $GITHUB_ENV
|
||||
echo 'TYPE_BUG='$(jq -r '.data.organization.projectNext.fields.nodes[] | select(.name== "Type") |.settings | fromjson.options[] | select(.name=="Bug") |.id' project_data.json) >> $GITHUB_ENV
|
||||
echo 'TYPE_FEATURE='$(jq -r '.data.organization.projectNext.fields.nodes[] | select(.name== "Type") |.settings | fromjson.options[] | select(.name=="Feature") |.id' project_data.json) >> $GITHUB_ENV
|
||||
echo 'TYPE_ENHANCEMENT='$(jq -r '.data.organization.projectNext.fields.nodes[] | select(.name== "Type") |.settings | fromjson.options[] | select(.name=="Enhancement") |.id' project_data.json) >> $GITHUB_ENV
|
||||
echo 'TYPE_DOCUMENTATION='$(jq -r '.data.organization.projectNext.fields.nodes[] | select(.name== "Type") |.settings | fromjson.options[] | select(.name=="Documentation") |.id' project_data.json) >> $GITHUB_ENV
|
||||
echo 'TYPE_TRANSLATION='$(jq -r '.data.organization.projectNext.fields.nodes[] | select(.name== "Type") |.settings | fromjson.options[] | select(.name=="Translation") |.id' project_data.json) >> $GITHUB_ENV
|
||||
|
||||
# Read the id of the "Status" field options
|
||||
echo 'STATUS_ID='$(jq -r '.data.organization.projectNext.fields.nodes[] | select(.name== "Status") |.id' project_data.json) >> $GITHUB_ENV
|
||||
echo 'STATUS_TODO='$(jq -r '.data.organization.projectNext.fields.nodes[] | select(.name== "Status") |.settings | fromjson.options[] | select(.name=="Todo") |.id' project_data.json) >> $GITHUB_ENV
|
||||
echo 'STATUS_IN_PROGRESS='$(jq -r '.data.organization.projectNext.fields.nodes[] | select(.name== "Status") |.settings | fromjson.options[] | select(.name=="In Progress") |.id' project_data.json) >> $GITHUB_ENV
|
||||
echo 'STATUS_READY_FOR_REVIEW='$(jq -r '.data.organization.projectNext.fields.nodes[] | select(.name== "Status") |.settings | fromjson.options[] | select(.name=="Ready for Review") |.id' project_data.json) >> $GITHUB_ENV
|
||||
echo 'STATUS_DONE='$(jq -r '.data.organization.projectNext.fields.nodes[] | select(.name== "Status") |.settings | fromjson.options[] | select(.name=="Done") |.id' project_data.json) >> $GITHUB_ENV
|
||||
|
||||
- name: Add Issue to project
|
||||
env:
|
||||
GITHUB_TOKEN: ${{secrets.PROJECT_AUTOMATION}}
|
||||
ISSUE_ID: ${{ github.event.issue.node_id }}
|
||||
run: |
|
||||
item_id="$( gh api graphql -f query='
|
||||
mutation($project:ID!, $issue:ID!) {
|
||||
addProjectNextItem(input: {projectId: $project, contentId: $issue}) {
|
||||
projectNextItem {
|
||||
id
|
||||
}
|
||||
}
|
||||
}' -f project="$PROJECT_ID" -f issue="$ISSUE_ID" --jq '.data.addProjectNextItem.projectNextItem.id')"
|
||||
|
||||
echo 'ITEM_ID='$item_id >> $GITHUB_ENV
|
||||
|
||||
- name: Export Labels
|
||||
env:
|
||||
ISSUE_DATA: ${{ toJson(github.event.issue) }}
|
||||
run: |
|
||||
echo 'LABELS='$(echo "$ISSUE_DATA" | jq -r '[.labels[].name] | join(" ")') >> $GITHUB_ENV
|
||||
|
||||
- name: Set "Type" field
|
||||
env:
|
||||
GITHUB_TOKEN: ${{secrets.PROJECT_AUTOMATION}}
|
||||
run: |
|
||||
# Only execute this step if the Issue contains at least one label
|
||||
if [ "${#LABELS[@]}" -gt 0 ]; then
|
||||
|
||||
# Let by default the type is "Bug"
|
||||
OPTION_ID=$TYPE_BUG
|
||||
|
||||
# If it has "feature" label then set the type to "Feature"
|
||||
if [[ "${LABELS[*]}" =~ "feature" ]]; then
|
||||
OPTION_ID=$TYPE_FEATURE
|
||||
fi
|
||||
|
||||
# If it has "enhancement" label then set the type to "Enhancement"
|
||||
if [[ "${LABELS[*]}" =~ "enhancement" ]]; then
|
||||
OPTION_ID=$TYPE_ENHANCEMENT
|
||||
fi
|
||||
|
||||
# If it has "documentation" label then set the type to "Documentation"
|
||||
if [[ "${LABELS[*]}" =~ "documentation" ]]; then
|
||||
OPTION_ID=$TYPE_DOCUMENTATION
|
||||
fi
|
||||
|
||||
# If it has "translation" label then set the type to "Translation"
|
||||
if [[ "${LABELS[*]}" =~ "translation" ]]; then
|
||||
OPTION_ID=$TYPE_TRANSLATION
|
||||
fi
|
||||
|
||||
# Set the "Type" field to appropriate option
|
||||
gh api graphql -f query='
|
||||
mutation ($project: ID!, $item: ID!, $field: ID!, $opt_id: String!) {
|
||||
updateProjectNextItemField(input: {
|
||||
projectId: $project
|
||||
itemId: $item
|
||||
fieldId: $field
|
||||
value: $opt_id
|
||||
}) {
|
||||
projectNextItem {
|
||||
id
|
||||
}
|
||||
}
|
||||
}' -f project="$PROJECT_ID" -f item="$ITEM_ID" -f field="$TYPE_ID" -f opt_id="$OPTION_ID" --silent
|
||||
fi
|
||||
|
||||
- name: Set "Status" field
|
||||
env:
|
||||
GITHUB_TOKEN: ${{secrets.PROJECT_AUTOMATION}}
|
||||
run: |
|
||||
STATE=${{github.event.issue.state}}
|
||||
|
||||
echo "State: $STATE"
|
||||
|
||||
OPTION_ID=$STATUS_TODO
|
||||
|
||||
if [[ "${STATE}" == "closed" ]]
|
||||
then
|
||||
OPTION_ID=$STATUS_DONE
|
||||
fi
|
||||
|
||||
gh api graphql -f query='
|
||||
mutation ($project: ID!, $item: ID!, $field: ID!, $status_id: String!) {
|
||||
updateProjectNextItemField(input: {
|
||||
projectId: $project
|
||||
itemId: $item
|
||||
fieldId: $field
|
||||
value: $status_id
|
||||
}) {
|
||||
projectNextItem {
|
||||
id
|
||||
}
|
||||
}
|
||||
}' -f project="$PROJECT_ID" -f item="$ITEM_ID" -f field="$STATUS_ID" -f status_id="$OPTION_ID" --silent
|
219
.github/workflows/project-automation-pr.yaml
vendored
219
.github/workflows/project-automation-pr.yaml
vendored
|
@ -1,219 +0,0 @@
|
|||
name: Project Automation (PR)
|
||||
on:
|
||||
pull_request:
|
||||
types:
|
||||
- opened
|
||||
- ready_for_review
|
||||
- reopened
|
||||
- review_requested
|
||||
- closed
|
||||
- labeled
|
||||
- unlabeled
|
||||
- synchronize
|
||||
jobs:
|
||||
pr_automation:
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- name: Get project data
|
||||
env:
|
||||
GITHUB_TOKEN: ${{secrets.PROJECT_AUTOMATION}}
|
||||
ORGANIZATION: hugo-toha
|
||||
PROJECT_NUMBER: 4
|
||||
run: |
|
||||
gh api graphql --header 'GraphQL-Features: projects_next_graphql' -f query='
|
||||
query($org: String!, $number: Int!) {
|
||||
organization(login: $org){
|
||||
projectNext(number: $number) {
|
||||
id
|
||||
fields(first:20) {
|
||||
nodes {
|
||||
id
|
||||
name
|
||||
settings
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}' -f org="$ORGANIZATION" -F number=$PROJECT_NUMBER > project_data.json
|
||||
|
||||
echo 'PROJECT_ID='$(jq -r '.data.organization.projectNext.id' project_data.json) >> $GITHUB_ENV
|
||||
|
||||
# Read the ID of the "Type" field options
|
||||
echo 'TYPE_ID='$(jq -r '.data.organization.projectNext.fields.nodes[] | select(.name== "Type") |.id' project_data.json) >> $GITHUB_ENV
|
||||
echo 'PROJECT_ID='$(jq -r '.data.organization.projectNext.id' project_data.json) >> $GITHUB_ENV
|
||||
echo 'TYPE_ID='$(jq -r '.data.organization.projectNext.fields.nodes[] | select(.name== "Type") |.id' project_data.json) >> $GITHUB_ENV
|
||||
echo 'TYPE_BUG='$(jq -r '.data.organization.projectNext.fields.nodes[] | select(.name== "Type") |.settings | fromjson.options[] | select(.name=="Bug") |.id' project_data.json) >> $GITHUB_ENV
|
||||
echo 'TYPE_FEATURE='$(jq -r '.data.organization.projectNext.fields.nodes[] | select(.name== "Type") |.settings | fromjson.options[] | select(.name=="Feature") |.id' project_data.json) >> $GITHUB_ENV
|
||||
echo 'TYPE_ENHANCEMENT='$(jq -r '.data.organization.projectNext.fields.nodes[] | select(.name== "Type") |.settings | fromjson.options[] | select(.name=="Enhancement") |.id' project_data.json) >> $GITHUB_ENV
|
||||
echo 'TYPE_DOCUMENTATION='$(jq -r '.data.organization.projectNext.fields.nodes[] | select(.name== "Type") |.settings | fromjson.options[] | select(.name=="Documentation") |.id' project_data.json) >> $GITHUB_ENV
|
||||
echo 'TYPE_TRANSLATION='$(jq -r '.data.organization.projectNext.fields.nodes[] | select(.name== "Type") |.settings | fromjson.options[] | select(.name=="Translation") |.id' project_data.json) >> $GITHUB_ENV
|
||||
|
||||
# Read the id of the "Status" field options
|
||||
echo 'STATUS_ID='$(jq -r '.data.organization.projectNext.fields.nodes[] | select(.name== "Status") |.id' project_data.json) >> $GITHUB_ENV
|
||||
echo 'STATUS_TODO='$(jq -r '.data.organization.projectNext.fields.nodes[] | select(.name== "Status") |.settings | fromjson.options[] | select(.name=="Todo") |.id' project_data.json) >> $GITHUB_ENV
|
||||
echo 'STATUS_IN_PROGRESS='$(jq -r '.data.organization.projectNext.fields.nodes[] | select(.name== "Status") |.settings | fromjson.options[] | select(.name=="In Progress") |.id' project_data.json) >> $GITHUB_ENV
|
||||
echo 'STATUS_READY_FOR_REVIEW='$(jq -r '.data.organization.projectNext.fields.nodes[] | select(.name== "Status") |.settings | fromjson.options[] | select(.name=="Ready for Review") |.id' project_data.json) >> $GITHUB_ENV
|
||||
echo 'STATUS_DONE='$(jq -r '.data.organization.projectNext.fields.nodes[] | select(.name== "Status") |.settings | fromjson.options[] | select(.name=="Done") |.id' project_data.json) >> $GITHUB_ENV
|
||||
|
||||
- name: Add PR to project
|
||||
env:
|
||||
GITHUB_TOKEN: ${{secrets.PROJECT_AUTOMATION}}
|
||||
PR_ID: ${{ github.event.pull_request.node_id }}
|
||||
run: |
|
||||
item_id="$( gh api graphql -f query='
|
||||
mutation($project:ID!, $pr:ID!) {
|
||||
addProjectNextItem(input: {projectId: $project, contentId: $pr}) {
|
||||
projectNextItem {
|
||||
id
|
||||
}
|
||||
}
|
||||
}' -f project="$PROJECT_ID" -f pr="$PR_ID" --jq '.data.addProjectNextItem.projectNextItem.id')"
|
||||
|
||||
echo 'ITEM_ID='$item_id >> $GITHUB_ENV
|
||||
|
||||
- name: Export Labels
|
||||
env:
|
||||
PR_DATA: ${{ toJson(github.event.pull_request) }}
|
||||
run: |
|
||||
echo 'LABELS='$(echo "$PR_DATA" | jq -r '[.labels[].name] | join(" ")') >> $GITHUB_ENV
|
||||
|
||||
- name: Set "Type" field
|
||||
env:
|
||||
GITHUB_TOKEN: ${{secrets.PROJECT_AUTOMATION}}
|
||||
run: |
|
||||
# Only execute this step if the PR contains at least one label
|
||||
if [ "${#LABELS[@]}" -gt 0 ]; then
|
||||
|
||||
# Let by default the type is "Bug"
|
||||
OPTION_ID=$TYPE_BUG
|
||||
|
||||
# If it has "feature" label then set the type to "Feature"
|
||||
if [[ "${LABELS[*]}" =~ "feature" ]]; then
|
||||
OPTION_ID=$TYPE_FEATURE
|
||||
fi
|
||||
|
||||
# If it has "enhancement" label then set the type to "Enhancement"
|
||||
if [[ "${LABELS[*]}" =~ "enhancement" ]]; then
|
||||
OPTION_ID=$TYPE_ENHANCEMENT
|
||||
fi
|
||||
|
||||
# If it has "documentation" label then set the type to "Documentation"
|
||||
if [[ "${LABELS[*]}" =~ "documentation" ]]; then
|
||||
OPTION_ID=$TYPE_DOCUMENTATION
|
||||
fi
|
||||
|
||||
# If it has "translation" label then set the type to "Translation"
|
||||
if [[ "${LABELS[*]}" =~ "translation" ]]; then
|
||||
OPTION_ID=$TYPE_TRANSLATION
|
||||
fi
|
||||
|
||||
# Set the "Type" field to appropriate option
|
||||
gh api graphql -f query='
|
||||
mutation ($project: ID!, $item: ID!, $field: ID!, $opt_id: String!) {
|
||||
updateProjectNextItemField(input: {
|
||||
projectId: $project
|
||||
itemId: $item
|
||||
fieldId: $field
|
||||
value: $opt_id
|
||||
}) {
|
||||
projectNextItem {
|
||||
id
|
||||
}
|
||||
}
|
||||
}' -f project="$PROJECT_ID" -f item="$ITEM_ID" -f field="$TYPE_ID" -f opt_id="$OPTION_ID" --silent
|
||||
fi
|
||||
|
||||
- name: Set "Status" field
|
||||
env:
|
||||
GITHUB_TOKEN: ${{secrets.PROJECT_AUTOMATION}}
|
||||
run: |
|
||||
MERGED=${{github.event.pull_request.merged}}
|
||||
STATE=${{github.event.pull_request.state}}
|
||||
REVIEWERS=${{github.event.pull_request.requested_reviewers}}
|
||||
DRAFT=${{github.event.pull_request.draft}}
|
||||
|
||||
echo "Merged: $MERGED"
|
||||
echo "State: $STATE"
|
||||
echo "Draft: $DRAFT"
|
||||
echo "Reviewer: $REVIEWER"
|
||||
|
||||
OPTION_ID=$STATUS_TODO
|
||||
|
||||
if [[ ("${MERGED}" == "true") || ("${STATE}" == "closed") ]]
|
||||
then
|
||||
OPTION_ID=$STATUS_DONE
|
||||
elif [[ ${#REVIEWERS[@]} -gt 0 ]]
|
||||
then
|
||||
OPTION_ID=$STATUS_READY_FOR_REVIEW
|
||||
else
|
||||
OPTION_ID=$STATUS_IN_PROGRESS
|
||||
fi
|
||||
|
||||
# Expose the OPTION_ID so that it can be used in later steps
|
||||
echo 'PR_STATUS='$OPTION_ID >> $GITHUB_ENV
|
||||
|
||||
gh api graphql -f query='
|
||||
mutation ($project: ID!, $item: ID!, $field: ID!, $status_id: String!) {
|
||||
updateProjectNextItemField(input: {
|
||||
projectId: $project
|
||||
itemId: $item
|
||||
fieldId: $field
|
||||
value: $status_id
|
||||
}) {
|
||||
projectNextItem {
|
||||
id
|
||||
}
|
||||
}
|
||||
}' -f project="$PROJECT_ID" -f item="$ITEM_ID" -f field="$STATUS_ID" -f status_id="$OPTION_ID" --silent
|
||||
|
||||
- name: Find Linked Issues
|
||||
id: linked_issues
|
||||
uses: hossainemruz/linked-issues@main
|
||||
with:
|
||||
pr_url: ${{github.event.pull_request.html_url}}
|
||||
format: IssueNumber
|
||||
|
||||
- name: Update Linked Issues Status
|
||||
env:
|
||||
GITHUB_TOKEN: ${{secrets.PROJECT_AUTOMATION}}
|
||||
run: |
|
||||
declare -a issues=(${{ steps.linked_issues.outputs.issues }})
|
||||
|
||||
# Loop through the every issues and update their Status to same as the PR Status
|
||||
for i in "${issues[@]}"
|
||||
do
|
||||
# Find the Issue ID
|
||||
ISSUE_ID="$(gh api graphql -f query='
|
||||
query($owner: String!, $name: String!, $issue_number: Int!) {
|
||||
repository(owner: $owner, name: $name) {
|
||||
issue(number: $issue_number) {
|
||||
id
|
||||
}
|
||||
}
|
||||
}' -f owner="${{github.event.pull_request.head.repo.owner.login}}" -f name="${{github.event.pull_request.head.repo.name}}" -F issue_number=$i --jq='.data.repository.issue.id')"
|
||||
|
||||
# Find the id of the Issue at the project board
|
||||
item_id="$( gh api graphql -f query='
|
||||
mutation($project:ID!, $pr:ID!) {
|
||||
addProjectNextItem(input: {projectId: $project, contentId: $pr}) {
|
||||
projectNextItem {
|
||||
id
|
||||
}
|
||||
}
|
||||
}' -f project="$PROJECT_ID" -f pr="$ISSUE_ID" --jq '.data.addProjectNextItem.projectNextItem.id')"
|
||||
|
||||
# Update the Issue Status
|
||||
gh api graphql -f query='
|
||||
mutation ($project: ID!, $item: ID!, $field: ID!, $status_id: String!) {
|
||||
updateProjectNextItemField(input: {
|
||||
projectId: $project
|
||||
itemId: $item
|
||||
fieldId: $field
|
||||
value: $status_id
|
||||
}) {
|
||||
projectNextItem {
|
||||
id
|
||||
}
|
||||
}
|
||||
}' -f project="$PROJECT_ID" -f item="$item_id" -f field="$STATUS_ID" -f status_id="$PR_STATUS" --silent
|
||||
done
|
83
.github/workflows/pull-request.yml
vendored
Normal file
83
.github/workflows/pull-request.yml
vendored
Normal file
|
@ -0,0 +1,83 @@
|
|||
name: PR Workflows
|
||||
|
||||
# Run action on pull request event
|
||||
on: [pull_request]
|
||||
|
||||
|
||||
jobs:
|
||||
# Build exampleSite
|
||||
build:
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
# checkout to the commit that has been pushed
|
||||
- uses: actions/checkout@v4.2.2
|
||||
|
||||
- name: Setup Node
|
||||
uses: actions/setup-node@v4
|
||||
with:
|
||||
node-version: 20
|
||||
|
||||
- name: Install node modules
|
||||
run: npm install
|
||||
|
||||
- name: Setup Hugo
|
||||
uses: peaceiris/actions-hugo@v3.0.0
|
||||
with:
|
||||
hugo-version: 'latest'
|
||||
extended: true
|
||||
|
||||
- name: Build
|
||||
run: |
|
||||
cd exampleSite
|
||||
hugo --minify
|
||||
|
||||
# Run linter
|
||||
lint:
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- uses: actions/checkout@v4.2.2
|
||||
|
||||
- name: Setup Node
|
||||
uses: actions/setup-node@v4
|
||||
with:
|
||||
node-version: 20
|
||||
|
||||
- name: Install node modules
|
||||
run: npm install
|
||||
|
||||
- name: Lint
|
||||
run: |
|
||||
npm run lint
|
||||
|
||||
lighthouse-check:
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- name: Waiting for Netlify Preview
|
||||
uses: kamranayub/wait-for-netlify-action@v2.1.1
|
||||
id: preview
|
||||
with:
|
||||
site_name: "toha-ci"
|
||||
max_timeout: 300
|
||||
env:
|
||||
NETLIFY_TOKEN: ${{secrets.NETLIFY_TOKEN}}
|
||||
|
||||
- name: Run Lighthouse
|
||||
uses: foo-software/lighthouse-check-action@v12.0.1
|
||||
id: lighthouseCheck
|
||||
with:
|
||||
accessToken: ${{ secrets.LIGHTHOUSE_TOKEN }}
|
||||
gitHubAccessToken: ${{secrets.GITHUB_TOKEN}}
|
||||
emulatedFormFactor: 'all'
|
||||
prCommentEnabled: true
|
||||
prCommentSaveOld: false
|
||||
timeout: 5
|
||||
urls: "${{ steps.preview.outputs.url }},${{ steps.preview.outputs.url }}/posts/,${{ steps.preview.outputs.url }}/posts/markdown-sample/,${{ steps.preview.outputs.url }}/posts/shortcodes/"
|
||||
|
||||
# Check for any broken links
|
||||
markdown-link-check:
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
# checkout to latest commit
|
||||
- uses: actions/checkout@v4.2.2
|
||||
# run markdown linter
|
||||
- uses: gaurav-nelson/github-action-markdown-link-check@1.0.17
|
349
README.md
349
README.md
|
@ -1,3 +1,6 @@
|
|||
> [!IMPORTANT]
|
||||
> If you are migrating from v3 (`git submodule` based) theme to v4 (`hugo modules` based) theme, please read this [migration guide](https://toha-guides.netlify.app/posts/update-v3-to-v4/).
|
||||
|
||||
# Toha
|
||||
|
||||
[](https://app.netlify.com/sites/toha/deploys)
|
||||
|
@ -35,6 +38,7 @@ A [Hugo](https://gohugo.io/) theme for a personal portfolio with minimalist desi
|
|||
- counter.dev
|
||||
- Google Analytics
|
||||
- Matomo/Piwik
|
||||
- [Umami](https://umami.is/)
|
||||
- Comment Support
|
||||
- [Disqus](https://disqus.com/)
|
||||
- [Valine](https://valine.js.org/)
|
||||
|
@ -52,6 +56,7 @@ For more details about the features please visit [here](https://toha-guides.netl
|
|||
- Deutsch
|
||||
- Español
|
||||
- 简体中文
|
||||
- 繁體中文
|
||||
- हिन्दी
|
||||
- Italiano
|
||||
- 日本語
|
||||
|
@ -59,10 +64,14 @@ For more details about the features please visit [here](https://toha-guides.netl
|
|||
- русский
|
||||
- suomi
|
||||
- Tiếng Việt
|
||||
- Azerbaijan
|
||||
- Turkish
|
||||
- Arabic (العربية)
|
||||
- Português
|
||||
- Português Europeu
|
||||
- Català
|
||||
- Português Brasileiro
|
||||
- Nederlands
|
||||
- Hebrew
|
||||
|
||||
To know more about how to translate your site, please visit [here](https://toha-guides.netlify.app/posts/translation/). Follow, the data and post format from this [example site](https://hugo-toha.github.io).
|
||||
|
||||
|
@ -84,95 +93,70 @@ Here are few screenshots from the [example site](https://hugo-toha.github.io).
|
|||
|
||||
## Requirements
|
||||
|
||||
- Hugo Version 0.87.0 or higher
|
||||
- Hugo Version 0.128.0 (extended) or higher
|
||||
- Go language 1.18 or higher (require for hugo modules)
|
||||
- Node version v18.x or later and npm 8.x or later.
|
||||
|
||||
## Usage
|
||||
|
||||
In order to use this theme, follow the following steps:
|
||||
The easiest way to use this theme is to fork [hugo-toha.github.io](https://github.com/hugo-toha/hugo-toha.github.io) sample repo.Then change the configurations according to your need.
|
||||
|
||||
#### Add theme as git submodule
|
||||
If you want to start from scratch, then follow these steps:
|
||||
|
||||
At first, add [Toha](https://github.com/hugo-toha/toha) theme as git submodule to your hugo-site.
|
||||
##### 1. Initialize Hugo module on you repo
|
||||
|
||||
```console
|
||||
$ git submodule add https://github.com/hugo-toha/toha.git themes/toha
|
||||
At first, initialize [Hugo modules](https://gohugo.io/hugo-modules/) in your repo. This will create a `go.mod` file.
|
||||
|
||||
```bash
|
||||
hugo mod init github.com/<your username>/<your repo name>
|
||||
```
|
||||
|
||||
> Don't use SSH URL of the theme during adding as git sub-module. Also, don't clone the theme in your `themes` directory using `git clone`. They don't work well with Github Action or Netlify.
|
||||
##### 2. Add this theme as your module dependency
|
||||
|
||||
If you don't already have a hugo site, create one by following the step-by-step guide from [here](https://toha-guides.netlify.app/posts/getting-started/prepare-site/).
|
||||
|
||||
#### Configuring Site
|
||||
|
||||
Now, configure your site to use `toha` theme by adding the following configuration in `config.yaml` file of your site.
|
||||
Now, in your `hugo.yaml` file, add a `module` section.
|
||||
|
||||
```yaml
|
||||
baseURL: https://hugo-toha.github.io
|
||||
|
||||
languageCode: en-us
|
||||
title: "John's Blog"
|
||||
theme: "toha"
|
||||
|
||||
# Manage languages
|
||||
# For any more details, you can check the official documentation: https://gohugo.io/content-management/multilingual/
|
||||
languages:
|
||||
en:
|
||||
languageName: English
|
||||
weight: 1
|
||||
|
||||
# Control TOC depth
|
||||
markup:
|
||||
tableOfContents:
|
||||
startLevel: 2
|
||||
endLevel: 6
|
||||
ordered: false
|
||||
|
||||
# At least HTML and JSON are required for the main HTML content and
|
||||
# client-side JavaScript search
|
||||
outputs:
|
||||
home:
|
||||
- HTML
|
||||
- RSS
|
||||
- JSON
|
||||
|
||||
# Enable global emoji support
|
||||
enableEmoji: true
|
||||
|
||||
# Site parameters
|
||||
params:
|
||||
# GitHub repo URL and branch of your site
|
||||
gitRepo: https://github.com/hugo-toha/hugo-toha.github.io
|
||||
gitBranch: main
|
||||
|
||||
# specify whether you want to write some blog posts or not
|
||||
enableBlogPost: true
|
||||
|
||||
# specify whether you want to show Table of Contents in reading page
|
||||
enableTOC: true
|
||||
|
||||
# specify whether you want the language flags to be displayed.
|
||||
showFlags: true
|
||||
|
||||
# Provide newsletter configuration.
|
||||
# This feature has been implemented for Mailchimp only for now.
|
||||
# You can also hide it from the footer.
|
||||
newsletter:
|
||||
# specify whether you want to display the newsletter form
|
||||
enable: true
|
||||
# specify which newsletter provider you want to use
|
||||
provider: mailchimp
|
||||
# specify the target URL for the subscription form
|
||||
mailchimpURL: https://github.us1.list-manage.com/subscribe/post?u=19de52a4603135aae97163fd8&id=094a24c76e
|
||||
# Use Hugo modules to add theme
|
||||
module:
|
||||
imports:
|
||||
- path: github.com/hugo-toha/toha/v4
|
||||
```
|
||||
|
||||
Don't forget to update `title`, `baseURL`, and `gitRepo` fields with your own information. To know about more available configuration options, please visit [here](https://toha-guides.netlify.app/posts/configuration/site-parameters/).
|
||||
Check this sample [hugo.yaml](https://github.com/hugo-toha/hugo-toha.github.io/blob/main/hugo.yaml) for further reference.
|
||||
|
||||
##### 3. Update your module
|
||||
|
||||
Now, run this command to load this theme as your module.
|
||||
|
||||
```bash
|
||||
hugo mod tidy
|
||||
```
|
||||
|
||||
#### Running Locally
|
||||
|
||||
Now, you can run your hugo site with `toha` theme locally with the following command:
|
||||
Now, you can run your hugo site locally with the following steps:
|
||||
|
||||
```console
|
||||
$ hugo server --theme toha --watch
|
||||
##### 1. Generate node dependency configuration
|
||||
|
||||
Now run the following command to generate node dependency configuration. This will create the a `package.json` file in you repo.
|
||||
|
||||
```bash
|
||||
hugo mod npm pack
|
||||
```
|
||||
|
||||
##### 2. Install dependencies
|
||||
|
||||
Install the node dependencies using following command:
|
||||
```bash
|
||||
npm install
|
||||
```
|
||||
|
||||
##### 3. Run your site
|
||||
|
||||
Now, run you site locally using following command.
|
||||
|
||||
```bash
|
||||
hugo server -w
|
||||
```
|
||||
|
||||
When you run your site for first time, it will start with the default parameters. It should look similar to the [example site](https://hugo-toha.github.io). However, it will not have any sections in the homepage as we haven't configured them yet. You can configure your site by following the guides from [here](https://toha-guides.netlify.app/posts/configuration/).
|
||||
|
@ -188,139 +172,6 @@ Here, are some handy shortcodes you can use with this theme.
|
|||
- [Video](https://toha-guides.netlify.app/posts/shortcodes/#video)
|
||||
- [Mermaid](https://hugo-toha.github.io/posts/shortcodes/#mermaid)
|
||||
|
||||
## Project Roadmap
|
||||
|
||||
Here, are the current plan and progress of various components of this theme. The components will be prioritized based on users requests.
|
||||
|
||||
### 1. Portfolio Mode
|
||||
|
||||
Here is the check list for portfolio mode,
|
||||
|
||||
- [x] **Home**
|
||||
|
||||
- [x] Configurable Background
|
||||
- [x] Author Image
|
||||
- [x] Greeting
|
||||
- [x] Typing Carousel
|
||||
|
||||
- [x] **About**
|
||||
|
||||
- [x] Name and Designation
|
||||
- [x] Summary
|
||||
- [x] Markdown Support
|
||||
- [x] Social Links
|
||||
- [x] Font Awesome Support
|
||||
- [x] Resume Link
|
||||
- [x] Soft Skills Indicator
|
||||
|
||||
- [x] **Skills**
|
||||
|
||||
- [x] Skill Cards
|
||||
- [x] Markdown Support
|
||||
|
||||
- [x] **Experiences**
|
||||
|
||||
- [x] Designation
|
||||
- [x] Timeline
|
||||
- [x] Company Overview
|
||||
- [x] Responsibilities
|
||||
|
||||
- [x] **Projects**
|
||||
|
||||
- [x] Category Filter
|
||||
- [x] Project Card
|
||||
- [x] Overview
|
||||
- [x] Markdown Support
|
||||
- [x] Github Stars
|
||||
- [x] External URL Support
|
||||
- [x] Technology Tags
|
||||
|
||||
- [x] **Recent Posts**
|
||||
|
||||
- [x] **Academic Career**
|
||||
|
||||
- [x] Degree
|
||||
- [x] Institution
|
||||
- [x] Timeline
|
||||
- [x] Taken Courses
|
||||
- [x] CGPA
|
||||
- [x] Extracurricular Activities
|
||||
|
||||
- [ ] **Publications**
|
||||
|
||||
- [x] Category Filter
|
||||
- [x] Card
|
||||
- [x] Tags
|
||||
- [x] Links
|
||||
- [ ] Dedicated Page
|
||||
- [ ] Abstract
|
||||
- [ ] Authors
|
||||
- [ ] Gallery
|
||||
|
||||
- [x] **Accomplishment / Courses**
|
||||
|
||||
- [x] Overview
|
||||
- [x] Certificate
|
||||
|
||||
- [x] **Achievements Gallery**
|
||||
- [x] Image
|
||||
- [x] Summary
|
||||
|
||||
### 2. Blog Mode
|
||||
|
||||
Here is the checklist for blog mode,
|
||||
|
||||
- [ ] **Dedicated Home page**
|
||||
|
||||
- [x] **List Page**
|
||||
|
||||
- [x] Post Cards
|
||||
- [x] Sidebar
|
||||
- [x] Pagination
|
||||
|
||||
- [x] **Reading Page**
|
||||
|
||||
- [x] Hero Image
|
||||
- [x] Author Information
|
||||
- [x] Sidebar
|
||||
- [x] Table of Contents
|
||||
- [x] Next & Previous Page Navigation
|
||||
- [x] `Improve This Page` Button
|
||||
- [x] Disqus Comment
|
||||
|
||||
### 3. Documentation Mode
|
||||
|
||||
Here is the check list for documentation mode,
|
||||
|
||||
- [ ] **Dedicated Home Page**
|
||||
- [ ] **Doc Page**
|
||||
- [ ] Redesign sidebar
|
||||
- [ ] Redesign TOC menu
|
||||
- [ ] Search Capability
|
||||
|
||||
### 4. Note Mode
|
||||
|
||||
- [ ] **Dedicated Home Page**
|
||||
- [ ] **Note Page**
|
||||
- [x] Add note view
|
||||
- [ ] Redesign sidebar
|
||||
- [ ] Add search capability
|
||||
|
||||
### 5. Tracking and Comments
|
||||
|
||||
- [x] Google Analytics
|
||||
- [x] Disqus Comment
|
||||
|
||||
### 6. Shortcodes
|
||||
|
||||
- [x] Image
|
||||
- [x] Split Page into Multiple Column
|
||||
- [x] Vertical space between two sections
|
||||
- [x] Alert
|
||||
- [ ] Figure & sub-figure
|
||||
- [ ] Tabs
|
||||
- [x] Notes
|
||||
|
||||
## Contributing
|
||||
|
||||
You can contribute to this theme in various ways. You can report a [bug](https://github.com/hugo-toha/toha/issues/new?template=bug.md), file an [feature request](https://github.com/hugo-toha/toha/issues/new?template=feature_request.md), send a PR, [share your thoughts](https://github.com/hugo-toha/toha/issues/new?template=question.md) etc.
|
||||
|
@ -342,34 +193,72 @@ For local development, you can make changes in the theme submodule and test the
|
|||
|
||||
At first, fork [this repo](https://github.com/hugo-toha/toha). Then, follow the following steps to use the forked theme for local developments,
|
||||
|
||||
**Using the forked theme in your own site:**
|
||||
|
||||
If you want to run your local development against your own site, follow the following steps:
|
||||
|
||||
```bash
|
||||
# add the original theme as a submodule of your site if you haven't done already
|
||||
$ git submodule add https://github.com/hugo-toha/toha.git themes/toha
|
||||
# navigate into the toha theme folder
|
||||
$ cd themes/toha
|
||||
# add your own fork as a remote
|
||||
$ git remote add my-fork https://github.com/<your-github-user>/toha
|
||||
# create a new branch for your changes
|
||||
$ git checkout -b my-feature-branch
|
||||
```
|
||||
|
||||
**Using the forked theme in the example site:**
|
||||
#### Running the forked theme against the example site
|
||||
|
||||
If your want to run your local development against this [example site](https://github.com/hugo-toha/hugo-toha.github.io), follow the following steps:
|
||||
|
||||
```bash
|
||||
# clone the example site along with the submodules
|
||||
$ git clone git@github.com:hugo-toha/hugo-toha.github.io.git --recursive
|
||||
# navigate into the toha theme folder
|
||||
$ cd themes/toha
|
||||
# add your own fork as a remote
|
||||
$ git remote add my-fork https://github.com/<your-github-user>/toha
|
||||
# create a new branch for your changes
|
||||
$ git checkout -b my-feature-branch
|
||||
# go to exampleSite directory
|
||||
$ cd exampleSite
|
||||
# install hugo modules
|
||||
$ hugo mod tidy
|
||||
# install dependencies
|
||||
$ hugo mod npm pack
|
||||
$ npm install
|
||||
# run the example site locally
|
||||
$ hugo server -w
|
||||
```
|
||||
|
||||
Now, you can make change in the theme and they will be reflected immediately on the running site. If you need to change any configuration, you can do that in the `hugo.yaml` file inside `exampleSite` folder. If you need to add any content or data, you can create the respective folder inside `exampleSite` directory and add your desired content or data there.
|
||||
|
||||
#### Running the forked theme against your own site
|
||||
|
||||
If you want to run your local development against your own site, follow the following steps:
|
||||
|
||||
**Replace the theme module:**
|
||||
|
||||
Open your site's `go.mod` file and replace the `github.com/hugo-toha/toha/v4` with your forked repo's path. For example, if your forked repo is `github.com/<your-github-user>/toha`, then replace the `github.com/hugo-toha/toha/v4` with `github.com/<your-github-user>/toha/v4`.
|
||||
|
||||
```go
|
||||
module github.com/hugo-toha/hugo-toha.github.io
|
||||
|
||||
go 1.19
|
||||
|
||||
require github.com/hugo-toha/toha/v4 v4.0.1-0.20231229170427-d3968ca711ef // indirect
|
||||
|
||||
replace(
|
||||
github.com/hugo-toha/toha/v4 => github.com/<your-github-user>/toha/v4 <git branch>
|
||||
)
|
||||
```
|
||||
|
||||
For interactive development, you can replace the theme with your locally cloned fork. For example, if you have cloned your fork in `/home/my-projects/toha`, then replace the `github.com/hugo-toha/toha/v4` with `/home/my-projects/toha`.
|
||||
|
||||
```go
|
||||
module github.com/hugo-toha/hugo-toha.github.io
|
||||
|
||||
go 1.19
|
||||
|
||||
require github.com/hugo-toha/toha/v4 v4.0.1-0.20231229170427-d3968ca711ef // indirect
|
||||
|
||||
replace(
|
||||
github.com/hugo-toha/toha/v4 => /home/my-projects/toha
|
||||
)
|
||||
```
|
||||
|
||||
**Update dependencies:**
|
||||
|
||||
```bash
|
||||
# update hugo modules
|
||||
$ hugo mod tidy
|
||||
# install dependencies
|
||||
$ hugo mod npm pack
|
||||
$ npm install
|
||||
```
|
||||
|
||||
**Run your site locally:**
|
||||
|
||||
```bash
|
||||
$ hugo server -w
|
||||
```
|
||||
|
||||
From there you can make changes to the source code of the theme while testing with your running Hugo site or the example site.
|
||||
|
|
10
assets/jsconfig.json
Normal file
10
assets/jsconfig.json
Normal file
|
@ -0,0 +1,10 @@
|
|||
{
|
||||
"compilerOptions": {
|
||||
"baseUrl": ".",
|
||||
"paths": {
|
||||
"*": [
|
||||
"*"
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
|
@ -1,8 +1,11 @@
|
|||
import 'popper.js'
|
||||
import 'bootstrap'
|
||||
import '@fortawesome/fontawesome-free/js/all'
|
||||
import feather from 'feather-icons'
|
||||
|
||||
import './core'
|
||||
import './features'
|
||||
import './sections'
|
||||
import './pages'
|
||||
|
||||
feather.replace();
|
||||
|
|
9
assets/scripts/core/theme-scheme.js
Normal file
9
assets/scripts/core/theme-scheme.js
Normal file
|
@ -0,0 +1,9 @@
|
|||
let theme = localStorage.getItem('theme-scheme') || localStorage.getItem('darkmode:color-scheme') || 'light'
|
||||
if (theme === 'system') {
|
||||
if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) {
|
||||
theme = 'dark'
|
||||
} else {
|
||||
theme = 'light'
|
||||
}
|
||||
}
|
||||
document.documentElement.setAttribute('data-theme', theme)
|
22
assets/scripts/features/copyCode/copyCode.js
Normal file
22
assets/scripts/features/copyCode/copyCode.js
Normal file
|
@ -0,0 +1,22 @@
|
|||
addCopyButtons(navigator.clipboard)
|
||||
|
||||
function addCopyButtons(clipboard) {
|
||||
document.querySelectorAll('pre > code').forEach(function (codeBlock) {
|
||||
const button = document.createElement('button')
|
||||
button.title = "Copy"
|
||||
button.className = 'copy-code-button btn btn-sm'
|
||||
button.innerHTML = "<i class='fa-regular fa-copy'></i>"
|
||||
|
||||
button.addEventListener('click', function () {
|
||||
clipboard.writeText(codeBlock.innerText)
|
||||
})
|
||||
|
||||
const pre = codeBlock.parentNode
|
||||
if (pre.parentNode.classList.contains('highlight')) {
|
||||
const highlight = pre.parentNode
|
||||
highlight.parentNode.insertBefore(button, highlight)
|
||||
} else {
|
||||
pre.parentNode.insertBefore(button, pre)
|
||||
}
|
||||
})
|
||||
}
|
1
assets/scripts/features/copyCode/index.js
Normal file
1
assets/scripts/features/copyCode/index.js
Normal file
|
@ -0,0 +1 @@
|
|||
import './copyCode'
|
|
@ -1,30 +0,0 @@
|
|||
import { enable, disable, auto, setFetchMethod } from 'darkreader'
|
||||
import * as params from '@params'
|
||||
|
||||
const darkreader = params?.darkmode?.darkreader || {}
|
||||
const defaultColorScheme = darkreader.defaultColorScheme || 'system'
|
||||
const theme = {
|
||||
brightness: 100,
|
||||
contrast: 100,
|
||||
sepia: 0,
|
||||
...(darkreader.theme || {})
|
||||
}
|
||||
const fixes = {
|
||||
invert: ['img[src$=".svg"]'],
|
||||
...(darkreader.fixes || {})
|
||||
}
|
||||
setFetchMethod(window.fetch)
|
||||
|
||||
export function setSchemeDark () {
|
||||
enable(theme, fixes)
|
||||
}
|
||||
|
||||
export function setSchemeLight () {
|
||||
disable()
|
||||
}
|
||||
|
||||
export function setSchemeSystem () {
|
||||
auto(theme, fixes)
|
||||
}
|
||||
|
||||
export { defaultColorScheme }
|
|
@ -1,14 +1,6 @@
|
|||
const PERSISTENCE_KEY = 'darkmode:color-scheme'
|
||||
|
||||
async function getService () {
|
||||
if (process.env.FEATURE_DARKMODE_DARKREADER === '1') {
|
||||
return await import('./darkreader')
|
||||
}
|
||||
|
||||
throw Error(' No service defined for feature darkMode.')
|
||||
}
|
||||
|
||||
window.addEventListener('DOMContentLoaded', async () => {
|
||||
window.addEventListener('load', async () => {
|
||||
const menu = document.getElementById('themeMenu')
|
||||
const $icon = document.getElementById('navbar-theme-icon-svg')
|
||||
if (menu == null || $icon == null) return
|
||||
|
@ -20,33 +12,35 @@ window.addEventListener('DOMContentLoaded', async () => {
|
|||
return map
|
||||
}, {})
|
||||
|
||||
const {
|
||||
setSchemeDark,
|
||||
setSchemeLight,
|
||||
setSchemeSystem,
|
||||
defaultColorScheme
|
||||
} = await getService()
|
||||
|
||||
function loadScheme () {
|
||||
return localStorage.getItem(PERSISTENCE_KEY) || defaultColorScheme
|
||||
function loadScheme() {
|
||||
return localStorage.getItem(PERSISTENCE_KEY) || "system"
|
||||
}
|
||||
|
||||
function saveScheme (scheme) {
|
||||
function saveScheme(scheme) {
|
||||
localStorage.setItem(PERSISTENCE_KEY, scheme)
|
||||
}
|
||||
|
||||
function setScheme (newScheme) {
|
||||
function getPreferredColorScheme() {
|
||||
const isDarkMode = window.matchMedia("(prefers-color-scheme: dark)").matches;
|
||||
return isDarkMode ? "dark" : "light";
|
||||
}
|
||||
|
||||
function setScheme(newScheme) {
|
||||
let theme = newScheme
|
||||
if (newScheme === 'system') {
|
||||
theme = getPreferredColorScheme()
|
||||
}
|
||||
// set data-theme attribute on html tag
|
||||
document.querySelector("html").dataset.theme = theme;
|
||||
|
||||
// update icon
|
||||
$icon.src = iconMap[newScheme]
|
||||
|
||||
if (newScheme === 'dark') {
|
||||
setSchemeDark()
|
||||
} else if (newScheme === 'system') {
|
||||
setSchemeSystem()
|
||||
} else {
|
||||
setSchemeLight()
|
||||
}
|
||||
|
||||
// save preference to local storage
|
||||
saveScheme(newScheme)
|
||||
|
||||
setImages(theme)
|
||||
}
|
||||
|
||||
setScheme(loadScheme())
|
||||
|
@ -58,3 +52,19 @@ window.addEventListener('DOMContentLoaded', async () => {
|
|||
})
|
||||
})
|
||||
})
|
||||
|
||||
function setImages(newScheme) {
|
||||
const els = Array.from(document.getElementsByClassName('logo-holder'));
|
||||
for (const el of els) {
|
||||
const light = el.querySelector('.light-logo');
|
||||
const dark = el.querySelector('.dark-logo');
|
||||
if (newScheme === "dark" && dark !== null) {
|
||||
if (light !== null) light.style.display = 'none'
|
||||
dark.style.display = 'inline'
|
||||
}
|
||||
else {
|
||||
if (light !== null) light.style.display = 'inline'
|
||||
if (dark !== null) dark.style.display = 'none'
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -38,7 +38,7 @@ class PDFViewer {
|
|||
this.loadingWrapper = el.getElementsByClassName('loading-wrapper')[0]
|
||||
this.next = el.getElementsByClassName('next')[0]
|
||||
this.prev = el.getElementsByClassName('prev')[0]
|
||||
this.pageNum = el.getElementsByClassName('page-num')[0]
|
||||
this.curPage = el.getElementsByClassName('page-num')[0]
|
||||
this.pageCount = el.getElementsByClassName('page-count')[0]
|
||||
|
||||
// context
|
||||
|
@ -121,7 +121,7 @@ class PDFViewer {
|
|||
this.pageNumPending = null
|
||||
}
|
||||
// Update page counters
|
||||
this.pageNum.textContent = num
|
||||
this.curPage.textContent = num
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
|
@ -10,6 +10,10 @@ if (process.env.FEATURE_DARKMODE === '1') {
|
|||
import('./darkmode')
|
||||
}
|
||||
|
||||
if (process.env.FEATURE_THEME === '1') {
|
||||
import('./theme')
|
||||
}
|
||||
|
||||
if (process.env.FEATURE_FLOWCHART === '1') {
|
||||
import('./flowchart')
|
||||
}
|
||||
|
@ -25,3 +29,7 @@ if (process.env.FEATURE_MATH === '1') {
|
|||
if (process.env.FEATURE_EMBEDPDF === '1') {
|
||||
import('./embedpdf')
|
||||
}
|
||||
|
||||
if (process.env.FEATURE_COPYCODEBUTTON === '1') {
|
||||
import('./copyCode')
|
||||
}
|
||||
|
|
|
@ -1,4 +1,12 @@
|
|||
import hljs from 'highlight.js'
|
||||
import * as params from '@params'
|
||||
|
||||
hljs.highlightAll(params.syntaxhighlight?.hljs)
|
||||
const defaultOptions = {
|
||||
ignoreUnescapedHTML: true
|
||||
}
|
||||
|
||||
hljs.configure({
|
||||
...defaultOptions,
|
||||
...(params.syntaxhighlight?.hljs || {}),
|
||||
});
|
||||
hljs.highlightAll();
|
||||
|
|
88
assets/scripts/features/theme/index.js
Normal file
88
assets/scripts/features/theme/index.js
Normal file
|
@ -0,0 +1,88 @@
|
|||
import * as params from '@params';
|
||||
const PERSISTENCE_KEY = 'theme-scheme'
|
||||
|
||||
const themeOptions = params.theme || {}
|
||||
const THEME_DARK = typeof themeOptions.dark === 'undefined' ? true : themeOptions.dark;
|
||||
const THEME_LIGHT = typeof themeOptions.light === 'undefined' ? true : themeOptions.light;
|
||||
const THEME_DEFAULT = typeof themeOptions.default === 'undefined' ? "system" : themeOptions.default;
|
||||
|
||||
window.addEventListener('load', async () => {
|
||||
const menu = document.getElementById('themeMenu')
|
||||
const $icon = document.getElementById('navbar-theme-icon-svg')
|
||||
if (menu == null || $icon == null) return
|
||||
|
||||
const btns = menu.getElementsByTagName('a')
|
||||
const iconMap = Array.from(btns).reduce((map, btn) => {
|
||||
const $img = btn.getElementsByTagName('img')[0]
|
||||
map[btn.dataset.scheme] = $img.src
|
||||
return map
|
||||
}, {})
|
||||
|
||||
|
||||
function checkScheme(scheme) {
|
||||
if (THEME_LIGHT === false) return "dark"
|
||||
if (THEME_DARK === false) return "light"
|
||||
return scheme
|
||||
}
|
||||
|
||||
function loadScheme() {
|
||||
return localStorage.getItem(PERSISTENCE_KEY) || loadDefaultScheme()
|
||||
}
|
||||
|
||||
function loadDefaultScheme() {
|
||||
return THEME_DEFAULT || "system"
|
||||
}
|
||||
|
||||
function saveScheme(scheme) {
|
||||
localStorage.setItem(PERSISTENCE_KEY, scheme)
|
||||
}
|
||||
|
||||
function getPreferredColorScheme() {
|
||||
const isDarkMode = window.matchMedia("(prefers-color-scheme: dark)").matches;
|
||||
return isDarkMode ? "dark" : "light";
|
||||
}
|
||||
|
||||
function setScheme(newScheme) {
|
||||
let theme = newScheme
|
||||
if (newScheme === 'system') {
|
||||
theme = getPreferredColorScheme()
|
||||
}
|
||||
// set data-theme attribute on html tag
|
||||
document.querySelector("html").dataset.theme = theme;
|
||||
|
||||
// update icon
|
||||
$icon.src = iconMap[newScheme]
|
||||
|
||||
// save preference to local storage
|
||||
saveScheme(newScheme)
|
||||
|
||||
setImages(theme)
|
||||
}
|
||||
|
||||
const checkedScheme = checkScheme(loadScheme())
|
||||
setScheme(checkedScheme)
|
||||
|
||||
Array.from(menu.getElementsByTagName('a')).forEach((btn) => {
|
||||
btn.addEventListener('click', () => {
|
||||
const { scheme } = btn.dataset
|
||||
setScheme(scheme)
|
||||
})
|
||||
})
|
||||
})
|
||||
|
||||
function setImages(newScheme) {
|
||||
const els = Array.from(document.getElementsByClassName('logo-holder'));
|
||||
for (const el of els) {
|
||||
const light = el.querySelector('.light-logo');
|
||||
const dark = el.querySelector('.dark-logo');
|
||||
|
||||
if (newScheme === "dark" && dark !== null) {
|
||||
if (light !== null) light.style.display = 'none'
|
||||
dark.style.display = 'inline'
|
||||
}
|
||||
else {
|
||||
if (light !== null) light.style.display = 'inline'
|
||||
if (dark !== null) dark.style.display = 'none'
|
||||
}
|
||||
}
|
||||
}
|
|
@ -7,7 +7,7 @@ window.addEventListener('DOMContentLoaded', () => {
|
|||
const fuseOptions = {
|
||||
shouldSort: true,
|
||||
includeMatches: true,
|
||||
threshold: 0.0,
|
||||
threshold: 0.1,
|
||||
tokenize: true,
|
||||
location: 0,
|
||||
distance: 100,
|
||||
|
@ -26,7 +26,7 @@ window.addEventListener('DOMContentLoaded', () => {
|
|||
|
||||
const searchQuery = param('keyword')
|
||||
if (searchQuery) {
|
||||
document.getElementById('search-query').value = searchQuery
|
||||
document.getElementById('search-box').value = searchQuery
|
||||
executeSearch(searchQuery)
|
||||
} else {
|
||||
const node = document.createElement('p')
|
||||
|
@ -37,7 +37,7 @@ window.addEventListener('DOMContentLoaded', () => {
|
|||
function executeSearch (searchQuery) {
|
||||
const url = window.location.href.split('/search/')[0] + '/index.json'
|
||||
|
||||
fetch(url).then(function (data) {
|
||||
fetch(url).then(response => response.json()).then(function (data) {
|
||||
const pages = data
|
||||
const fuse = new Fuse(pages, fuseOptions)
|
||||
const results = fuse.search(searchQuery)
|
||||
|
@ -79,6 +79,13 @@ window.addEventListener('DOMContentLoaded', () => {
|
|||
// pull template from hugo template definition
|
||||
const templateDefinition = document.getElementById('search-result-template').innerHTML
|
||||
// replace values
|
||||
function adaptTags() {
|
||||
const tags = value.item.tags;
|
||||
let string = '';
|
||||
if (tags) tags.forEach((t) => {string += '<li class="rounded"><a href="/tags/' + t.toLowerCase() + '/" class="btn btn-sm btn-info">' + t + "</a></li>"});
|
||||
return string;
|
||||
}
|
||||
|
||||
const output = render(templateDefinition, {
|
||||
key,
|
||||
title: value.item.title,
|
||||
|
@ -86,13 +93,13 @@ window.addEventListener('DOMContentLoaded', () => {
|
|||
date: value.item.date,
|
||||
summary: value.item.summary,
|
||||
link: value.item.permalink,
|
||||
tags: value.item.tags,
|
||||
tags: adaptTags(),
|
||||
categories: value.item.categories,
|
||||
snippet
|
||||
})
|
||||
|
||||
const doc = new DOMParser().parseFromString(output, 'text/html')
|
||||
document.getElementById('search-results').append(doc)
|
||||
const dom = new DOMParser().parseFromString(output, 'text/html')
|
||||
document.getElementById('search-results').append(dom.getElementsByClassName('post-card')[0])
|
||||
|
||||
snippetHighlights.forEach(function (snipvalue) {
|
||||
const context = document.getElementById('#summary-' + key)
|
||||
|
|
|
@ -15,7 +15,7 @@ window.addEventListener('DOMContentLoaded', () => {
|
|||
}
|
||||
}
|
||||
|
||||
// =============== Make TOC Compatible wit Bootstrap Scroll Spy ========
|
||||
// =============== Make TOC Compatible with Bootstrap Scroll Spy ========
|
||||
// add "navbar" class to the "nav" element
|
||||
const toc = document.getElementById('TableOfContents')
|
||||
if (toc) {
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
import { getDeviceState } from '../core'
|
||||
|
||||
function fourColumRow (gallery, entries, i) {
|
||||
function fourColumnRow (gallery, entries, i) {
|
||||
const entry1 = document.createElement('div')
|
||||
entry1.classList.add('col-lg-6', 'm-0', 'p-0')
|
||||
entry1.appendChild(entries[i].cloneNode(true))
|
||||
|
@ -140,7 +140,7 @@ function showAchievements () {
|
|||
if (isLaptop) {
|
||||
if (i + 4 <= len) {
|
||||
if (rowNumber % 2) {
|
||||
fourColumRow(gallery, entries, i)
|
||||
fourColumnRow(gallery, entries, i)
|
||||
} else {
|
||||
fourColumnReversedRow(gallery, entries, i)
|
||||
}
|
||||
|
|
|
@ -22,12 +22,9 @@ function toggleCourseVisibility (elem) {
|
|||
}
|
||||
|
||||
window.addEventListener('DOMContentLoaded', () => {
|
||||
const els = [
|
||||
document.getElementById('show-more-btn'),
|
||||
document.getElementById('show-less-btn')
|
||||
]
|
||||
const els = Array.from(document.getElementsByClassName('btn'));
|
||||
|
||||
els.filter((el) => el != null).forEach((el) =>
|
||||
els.filter((el) => el != null && (el.id === 'show-more-btn' || el.id === 'show-less-btn')).forEach((el) =>
|
||||
el.addEventListener('click', ({ target }) =>
|
||||
toggleCourseVisibility(target)))
|
||||
})
|
||||
|
|
|
@ -4,4 +4,5 @@ import './sidebar'
|
|||
import './education'
|
||||
import './achievements'
|
||||
import './projects'
|
||||
import './skills'
|
||||
import './publications'
|
||||
|
|
|
@ -4,14 +4,14 @@ const updateNavBar = () => {
|
|||
const themeIcon = document.getElementById('navbar-theme-icon-svg')
|
||||
|
||||
if (window.scrollY > 40) {
|
||||
topNavbar?.classList.remove('initial-navbar')
|
||||
topNavbar?.classList.add('final-navbar', 'shadow')
|
||||
topNavbar?.classList.remove('transparent-navbar')
|
||||
topNavbar?.classList.add('shadow')
|
||||
|
||||
navbarToggler?.classList.remove('navbar-dark')
|
||||
navbarToggler?.classList.add('navbar-light')
|
||||
|
||||
// color theme selector a.k.a. dark mode
|
||||
themeIcon?.classList.remove('navbar-icon-svg-dark')
|
||||
themeIcon?.classList.remove('svg-inverted')
|
||||
|
||||
// get the main logo from hidden img tag
|
||||
const mainLogo = document.getElementById('main-logo')
|
||||
|
@ -20,14 +20,14 @@ const updateNavBar = () => {
|
|||
document.getElementById('logo')?.setAttribute('src', logoURL)
|
||||
}
|
||||
} else {
|
||||
topNavbar?.classList.remove('final-navbar', 'shadow')
|
||||
topNavbar?.classList.add('initial-navbar')
|
||||
topNavbar?.classList.remove('shadow')
|
||||
topNavbar?.classList.add('transparent-navbar')
|
||||
|
||||
navbarToggler?.classList.remove('navbar-light')
|
||||
navbarToggler?.classList.add('navbar-dark')
|
||||
|
||||
// color theme selector a.k.a. dark mode
|
||||
themeIcon?.classList.add('navbar-icon-svg-dark')
|
||||
themeIcon?.classList.add('svg-inverted')
|
||||
|
||||
// get the inverted logo from hidden img tag
|
||||
const invertedLogo = document.getElementById('inverted-logo')
|
||||
|
@ -43,18 +43,21 @@ document.addEventListener('DOMContentLoaded', function () {
|
|||
// ==================================================
|
||||
// When the user scrolls down 80px from the top of the document,
|
||||
// resize the navbar's padding and the logo's font size
|
||||
document.addEventListener('scroll', updateNavBar)
|
||||
const topNavbar = document.getElementById('top-navbar')
|
||||
if (topNavbar?.classList.contains('homepage')) {
|
||||
document.addEventListener('scroll', updateNavBar)
|
||||
updateNavBar()
|
||||
}
|
||||
|
||||
// Creates a click handler to collapse the navigation when
|
||||
// anchors in the mobile nav pop up are clicked
|
||||
const navMain =document.getElementsByClassName('navbar-collapse')
|
||||
Array.from(navMain).forEach(function(el) {
|
||||
const navMain = document.getElementsByClassName('navbar-collapse')
|
||||
Array.from(navMain).forEach(function (el) {
|
||||
el.addEventListener('click', function (e) {
|
||||
if (e.target.tagName === 'A') {
|
||||
if (e.target.tagName === 'A' && !e.target.classList.contains("dropdown-toggle")) {
|
||||
el.classList.add('collapse')
|
||||
el.classList.remove('show')
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
updateNavBar()
|
||||
})
|
||||
|
|
|
@ -6,19 +6,19 @@ function toggleSidebar () {
|
|||
if (sidebar == null) {
|
||||
return
|
||||
}
|
||||
if (sidebar.classList.contains('hide')) {
|
||||
sidebar.classList.remove('hide')
|
||||
if (sidebar.classList.contains('expanded')) {
|
||||
sidebar.classList.remove('expanded')
|
||||
} else {
|
||||
// if toc-section is open, then close it first
|
||||
const toc = document.getElementById('toc-section')
|
||||
if (toc != null && toc.classList.contains('hide')) {
|
||||
toc.classList.remove('hide')
|
||||
}
|
||||
// add "hide" class
|
||||
sidebar.classList.add('hide')
|
||||
// add "expanded" class
|
||||
sidebar.classList.add('expanded')
|
||||
// if it is mobile device. then scroll to top.
|
||||
const { isMobile } = getDeviceState()
|
||||
if (isMobile && sidebar.classList.contains('hide')) {
|
||||
if (isMobile && sidebar.classList.contains('expanded')) {
|
||||
document.body.scrollTop = 0
|
||||
document.documentElement.scrollTop = 0
|
||||
if (document.getElementById('hero-area') != null) {
|
||||
|
|
15
assets/scripts/sections/skills.js
Normal file
15
assets/scripts/sections/skills.js
Normal file
|
@ -0,0 +1,15 @@
|
|||
import Filterizr from 'filterizr'
|
||||
|
||||
document.addEventListener('DOMContentLoaded', () => {
|
||||
// ================== Skill cards =====================
|
||||
|
||||
// setup skill filter buttons
|
||||
const skillCardHolder = document.getElementById('skill-card-holder')
|
||||
if (skillCardHolder != null && skillCardHolder.children.length !== 0) {
|
||||
// eslint-disable-next-line no-new
|
||||
new Filterizr('.filtr-skills', {
|
||||
layout: 'sameWidth',
|
||||
controlsSelector: '.skill-filtr-control'
|
||||
})
|
||||
}
|
||||
})
|
80
assets/styles/application.template.scss
Normal file
80
assets/styles/application.template.scss
Normal file
|
@ -0,0 +1,80 @@
|
|||
// loading bootstrap
|
||||
// TODO: Refactor to use bootstrap sass variable for theming.
|
||||
@import 'bootstrap/scss/bootstrap';
|
||||
|
||||
@import 'include-media/dist/_include-media';
|
||||
|
||||
// The Mulish font, we use font-weight 300 - 700
|
||||
@import '@fontsource/mulish/300';
|
||||
@import '@fontsource/mulish/index'; // 400
|
||||
@import '@fontsource/mulish/500';
|
||||
@import '@fontsource/mulish/600';
|
||||
@import '@fontsource/mulish/700';
|
||||
|
||||
@import './variables';
|
||||
@import './mixins';
|
||||
|
||||
// components
|
||||
@import './components/cards';
|
||||
@import './components/buttons';
|
||||
@import './components/links';
|
||||
@import './components/texts';
|
||||
@import './components/images';
|
||||
@import './components/tables';
|
||||
@import './components/misc';
|
||||
|
||||
// layouts
|
||||
@import './layouts/main';
|
||||
@import './layouts/list';
|
||||
@import './layouts/single';
|
||||
@import './layouts/notes';
|
||||
@import './layouts/404';
|
||||
|
||||
// navigators
|
||||
@import './navigators/navbar';
|
||||
@import './navigators/sidebar';
|
||||
|
||||
|
||||
// sections
|
||||
@import './sections/home';
|
||||
@import './sections/about';
|
||||
@import './sections/skills';
|
||||
@import './sections/experiences';
|
||||
@import './sections/education';
|
||||
@import './sections/projects';
|
||||
@import './sections/recent-posts';
|
||||
@import './sections/achievements';
|
||||
@import './sections/accomplishments';
|
||||
@import './sections/publications';
|
||||
@import './sections/footer';
|
||||
|
||||
|
||||
|
||||
// override
|
||||
@import './override';
|
||||
|
||||
// features and services, only imported if enabled.
|
||||
{{ range $feature, $featureDef := site.Params.features }}
|
||||
{{ with $featureDef }}
|
||||
{{ $featureEnabled := or (not (isset . "enable")) .enable }}
|
||||
{{ if $featureEnabled }}
|
||||
{{ with (index site.Data.toha.styles $feature) }}
|
||||
{{ range .styles }}
|
||||
@import '{{.}}';
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
|
||||
{{ range $service, $config := .services }}
|
||||
{{ with (index site.Data.toha.styles $feature) }}
|
||||
{{ with .services }}
|
||||
{{ with (index . $service) }}
|
||||
{{ range .styles }}
|
||||
@import '{{ . }}';
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
{{ end }}
|
217
assets/styles/components/buttons.scss
Normal file
217
assets/styles/components/buttons.scss
Normal file
|
@ -0,0 +1,217 @@
|
|||
.btn-dark {
|
||||
background-color: get-light-color('text-color') !important;
|
||||
border-color: get-light-color('text-color') !important;
|
||||
color: get-light-color('text-over-accent-color') !important;
|
||||
@include transition();
|
||||
|
||||
&:hover,
|
||||
&:focus {
|
||||
background-color: get-light-color('accent-color') !important;
|
||||
border-color: get-light-color('accent-color') !important;
|
||||
@include transition();
|
||||
}
|
||||
}
|
||||
|
||||
.btn-info {
|
||||
background-color: get-light-color('accent-color') !important;
|
||||
color: get-light-color('text-over-accent-color') !important;
|
||||
|
||||
&:hover,
|
||||
&:focus {
|
||||
background-color: get-light-color('hover-over-accent-color') !important;
|
||||
}
|
||||
}
|
||||
|
||||
.btn-outline-info {
|
||||
color: get-light-color('accent-color') !important;
|
||||
border-color: get-light-color('accent-color') !important;
|
||||
|
||||
&:hover,
|
||||
&:focus {
|
||||
background-color: get-light-color('accent-color') !important;
|
||||
color: get-light-color('text-over-accent-color') !important;
|
||||
}
|
||||
}
|
||||
|
||||
.btn-link {
|
||||
color: get-light-color('accent-color');
|
||||
|
||||
&:hover,
|
||||
&:focus {
|
||||
color: get-light-color('hover-over-accent-color');
|
||||
}
|
||||
}
|
||||
|
||||
.nav-button {
|
||||
background-color: transparent;
|
||||
border: 1px solid transparent;
|
||||
border-radius: 0.25rem;
|
||||
color: get-light-color('muted-text-color');
|
||||
}
|
||||
|
||||
.navbar-toggler {
|
||||
border: none;
|
||||
&:focus {
|
||||
border: none;
|
||||
outline: none !important;
|
||||
box-shadow: none;
|
||||
}
|
||||
}
|
||||
|
||||
.tags {
|
||||
text-align: left;
|
||||
padding-top: 0.5em;
|
||||
li {
|
||||
font-size: 0.5em;
|
||||
list-style-type: none;
|
||||
display: inline-block;
|
||||
margin-left: 0.2em;
|
||||
margin-right: 0.2em;
|
||||
margin-top: 0.6em;
|
||||
margin-bottom: 0.6em;
|
||||
}
|
||||
a {
|
||||
text-decoration: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
.icon-button {
|
||||
background-color: get-light-color('text-color');
|
||||
color: get-light-color('text-over-accent-color') !important;
|
||||
padding: 0.25rem 0.5rem;
|
||||
line-height: 1.5;
|
||||
border-radius: 0.2rem;
|
||||
border: none;
|
||||
|
||||
&:hover,
|
||||
&:focus {
|
||||
background-color: get-light-color('accent-color') !important;
|
||||
@include transition();
|
||||
}
|
||||
}
|
||||
|
||||
.filled-button {
|
||||
background-color: get-light-color('accent-color') !important;
|
||||
color: get-light-color('text-over-accent-color') !important;
|
||||
@include transition();
|
||||
|
||||
&:hover,
|
||||
&:active {
|
||||
background-color: get-light-color('hover-over-accent-color') !important;
|
||||
@include transition();
|
||||
}
|
||||
}
|
||||
|
||||
.copy-code-button {
|
||||
float: right;
|
||||
margin-top: 0.5em;
|
||||
margin-left: -2.6em;
|
||||
margin-right: 3em;
|
||||
|
||||
background-color: get-light-color('text-color') !important;
|
||||
color: get-light-color('inverse-text-color') !important;
|
||||
padding: 0.25rem 0.5rem;
|
||||
line-height: 1.5;
|
||||
border-radius: 0.2rem;
|
||||
border: none;
|
||||
|
||||
&:hover,
|
||||
&:focus {
|
||||
background-color: get-light-color('accent-color') !important;
|
||||
color: get-light-color('text-over-accent-color') !important;
|
||||
@include transition();
|
||||
}
|
||||
&:focus {
|
||||
&::before {
|
||||
content: 'Copied!';
|
||||
position: absolute;
|
||||
padding: 0.3em;
|
||||
border-radius: 0.2em;
|
||||
margin-left: -5em;
|
||||
margin-top: -0.2em;
|
||||
background-color: get-light-color('accent-color') !important;
|
||||
color: get-light-color('text-over-accent-color') !important;
|
||||
@include transition();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
html[data-theme='dark'] {
|
||||
.btn-dark {
|
||||
background-color: get-dark-color('accent-color') !important;
|
||||
border-color: get-dark-color('accent-color') !important;
|
||||
color: get-dark-color('text-over-accent-color') !important;
|
||||
|
||||
&:hover,
|
||||
&:focus {
|
||||
background-color: get-dark-color('hover-over-accent-color') !important;
|
||||
border-color: get-dark-color('hover-over-accent-color') !important;
|
||||
}
|
||||
}
|
||||
|
||||
.btn-info {
|
||||
background-color: get-dark-color('bg-card') !important;
|
||||
color: get-dark-color('text-color') !important;
|
||||
border: 1px solid get-dark-color('muted-text-color') !important;
|
||||
|
||||
&:hover,
|
||||
&:focus {
|
||||
background-color: get-dark-color('hover-over-accent-color') !important;
|
||||
}
|
||||
}
|
||||
|
||||
.btn-outline-info {
|
||||
color: get-dark-color('accent-color') !important;
|
||||
border-color: get-dark-color('accent-color') !important;
|
||||
|
||||
&:hover,
|
||||
&:focus {
|
||||
background-color: get-dark-color('accent-color') !important;
|
||||
color: get-dark-color('text-over-accent-color') !important;
|
||||
}
|
||||
}
|
||||
|
||||
.btn-link {
|
||||
color: get-dark-color('accent-color');
|
||||
|
||||
&:hover,
|
||||
&:focus {
|
||||
color: get-dark-color('hover-over-accent-color');
|
||||
}
|
||||
}
|
||||
|
||||
.nav-button {
|
||||
color: get-dark-color('muted-text-color');
|
||||
}
|
||||
|
||||
.icon-button {
|
||||
background-color: get-dark-color('muted-text-color');
|
||||
color: get-dark-color('text-over-accent-color') !important;
|
||||
|
||||
&:hover,
|
||||
&:focus {
|
||||
background-color: get-dark-color('accent-color') !important;
|
||||
}
|
||||
}
|
||||
|
||||
.filled-button {
|
||||
background-color: get-dark-color('accent-color') !important;
|
||||
color: get-dark-color('text-over-accent-color') !important;
|
||||
|
||||
&:hover,
|
||||
&:active {
|
||||
background-color: get-dark-color('hover-over-accent-color') !important;
|
||||
}
|
||||
}
|
||||
.copy-code-button {
|
||||
background-color: get-dark-color('bg-primary') !important;
|
||||
color: get-dark-color('muted-text-color') !important;
|
||||
|
||||
&:hover,
|
||||
&:focus,
|
||||
&::before {
|
||||
background-color: get-dark-color('accent-color') !important;
|
||||
color: get-dark-color('text-over-accent-color') !important;
|
||||
}
|
||||
}
|
||||
}
|
129
assets/styles/components/cards.scss
Normal file
129
assets/styles/components/cards.scss
Normal file
|
@ -0,0 +1,129 @@
|
|||
.card {
|
||||
box-shadow: none;
|
||||
@include transition();
|
||||
overflow: hidden;
|
||||
background: get-light-color('bg-card');
|
||||
|
||||
&:hover,
|
||||
&:focus {
|
||||
box-shadow: $box-shadow;
|
||||
border: 1px solid get-light-color('bg-primary');
|
||||
@include transition();
|
||||
.card-img-top {
|
||||
transform: scale(1.2);
|
||||
object-fit: cover;
|
||||
@include transition();
|
||||
}
|
||||
}
|
||||
|
||||
.card-head {
|
||||
height: 172px;
|
||||
display: flex;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.card-title {
|
||||
font-size: large;
|
||||
}
|
||||
|
||||
.card-body {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.card-img-top {
|
||||
-o-object-fit: cover;
|
||||
object-fit: cover;
|
||||
@include transition();
|
||||
}
|
||||
|
||||
.card-img-sm {
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
}
|
||||
|
||||
.card-img-xs {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
}
|
||||
|
||||
.card-footer {
|
||||
background: get-light-color('bg-card') !important;
|
||||
a.btn {
|
||||
text-decoration: none !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.post-card {
|
||||
width: 24rem;
|
||||
display: inline-flex;
|
||||
|
||||
.post-card-link {
|
||||
text-decoration: none !important;
|
||||
color: get-light-color('text-color');
|
||||
}
|
||||
|
||||
.card {
|
||||
margin: 5px;
|
||||
position: relative;
|
||||
|
||||
&:hover,
|
||||
&:focus {
|
||||
.card-img-top {
|
||||
transform: scale(1.2);
|
||||
-o-object-fit: cover;
|
||||
object-fit: cover;
|
||||
@include transition();
|
||||
}
|
||||
}
|
||||
|
||||
.card-body {
|
||||
padding: 1.25rem !important;
|
||||
padding-bottom: 0 !important;
|
||||
|
||||
.post-summary {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
display: -webkit-box;
|
||||
max-height: 144px;
|
||||
/* fallback */
|
||||
-webkit-line-clamp: 5;
|
||||
/* number of lines to show */
|
||||
-webkit-box-orient: vertical;
|
||||
}
|
||||
}
|
||||
.card-footer {
|
||||
margin-top: auto;
|
||||
|
||||
span {
|
||||
font-size: 10pt;
|
||||
color: get-light-color('muted-text-color') !important;
|
||||
padding-top: 5px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
html[data-theme='dark'] {
|
||||
.card {
|
||||
background: get-dark-color('bg-card');
|
||||
|
||||
&:hover,
|
||||
&:focus {
|
||||
border: 1px solid rgba(get-dark-color('accent-color'), 0.2);
|
||||
}
|
||||
.card-footer {
|
||||
background: get-dark-color('bg-card') !important;
|
||||
}
|
||||
}
|
||||
|
||||
.post-card {
|
||||
.card {
|
||||
.card-footer {
|
||||
span {
|
||||
color: get-dark-color('muted-text-color') !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
76
assets/styles/components/images.scss
Normal file
76
assets/styles/components/images.scss
Normal file
|
@ -0,0 +1,76 @@
|
|||
img {
|
||||
display: block;
|
||||
max-width: 100%;
|
||||
|
||||
&.center {
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
&.left {
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
&.right {
|
||||
margin-left: auto;
|
||||
}
|
||||
}
|
||||
|
||||
figure {
|
||||
border: 1px solid rgba(get-light-color('accent-color'), 0.1);
|
||||
height: -moz-fit-content;
|
||||
height: fit-content;
|
||||
width: -moz-fit-content;
|
||||
width: fit-content;
|
||||
align-self: center;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
caption,
|
||||
figcaption {
|
||||
caption-side: bottom;
|
||||
text-align: center;
|
||||
color: get-light-color('muted-text-color');
|
||||
}
|
||||
|
||||
html[data-theme='dark'] {
|
||||
figure {
|
||||
border: 1px solid rgba(get-dark-color('accent-color'), 0.1);
|
||||
}
|
||||
caption,
|
||||
figcaption {
|
||||
color: get-dark-color('muted-text-color');
|
||||
}
|
||||
}
|
||||
|
||||
.svg-inverted {
|
||||
filter: invert(1);
|
||||
}
|
||||
|
||||
.logo-holder {
|
||||
height: 64px;
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
|
||||
.company-logo {
|
||||
max-height: 100%;
|
||||
width: auto;
|
||||
}
|
||||
|
||||
.light-logo {
|
||||
display: inline;
|
||||
}
|
||||
|
||||
.dark-logo {
|
||||
display: none;
|
||||
}
|
||||
|
||||
html[data-theme='dark'] {
|
||||
.light-logo {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.dark-logo {
|
||||
display: inline;
|
||||
}
|
||||
}
|
97
assets/styles/components/links.scss
Normal file
97
assets/styles/components/links.scss
Normal file
|
@ -0,0 +1,97 @@
|
|||
a {
|
||||
color: get-light-color('accent-color');
|
||||
@include transition();
|
||||
|
||||
&:link {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
&:hover,
|
||||
&:focus {
|
||||
-webkit-text-decoration: get-light-color('hover-over-accent-color') underline;
|
||||
text-decoration: get-light-color('hover-over-accent-color') underline;
|
||||
color: get-light-color('hover-over-accent-color');
|
||||
@include transition();
|
||||
}
|
||||
}
|
||||
|
||||
.list-link, .taxonomy-term {
|
||||
text-decoration: none !important;
|
||||
color: get-light-color('text-color');
|
||||
@include transition();
|
||||
|
||||
&.active {
|
||||
display: inline;
|
||||
color: get-light-color('accent-color');
|
||||
}
|
||||
|
||||
&:hover {
|
||||
margin-left: 3px;
|
||||
color: get-light-color('accent-color');
|
||||
@include transition();
|
||||
}
|
||||
}
|
||||
|
||||
a.header-anchor {
|
||||
text-decoration: none;
|
||||
color: get-light-color('heading-color');
|
||||
|
||||
i,
|
||||
svg {
|
||||
font-size: 10pt;
|
||||
color: get-light-color('text-color');
|
||||
display: none;
|
||||
margin-left: 0.5rem;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
|
||||
i,
|
||||
svg {
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
|
||||
code {
|
||||
color: get-light-color('inline-code-color');
|
||||
}
|
||||
}
|
||||
|
||||
.anchor {
|
||||
padding-top: 3.5rem;
|
||||
}
|
||||
|
||||
html[data-theme='dark'] {
|
||||
a {
|
||||
color: get-dark-color('accent-color');
|
||||
|
||||
&:hover,
|
||||
&:focus {
|
||||
-webkit-text-decoration: get-dark-color('hover-over-accent-color') underline;
|
||||
text-decoration: get-dark-color('hover-over-accent-color') underline;
|
||||
color: get-dark-color('hover-over-accent-color');
|
||||
}
|
||||
}
|
||||
|
||||
.list-link, .taxonomy-term {
|
||||
color: get-dark-color('text-color');
|
||||
|
||||
&:hover,
|
||||
&.active {
|
||||
color: get-dark-color('accent-color');
|
||||
}
|
||||
}
|
||||
|
||||
a.header-anchor {
|
||||
color: get-dark-color('heading-color');
|
||||
|
||||
i,
|
||||
svg {
|
||||
color: get-dark-color('text-color');
|
||||
}
|
||||
|
||||
code {
|
||||
color: get-dark-color('inline-code-color');
|
||||
}
|
||||
}
|
||||
}
|
79
assets/styles/components/misc.scss
Normal file
79
assets/styles/components/misc.scss
Normal file
|
@ -0,0 +1,79 @@
|
|||
.paginator {
|
||||
width: -moz-fit-content;
|
||||
width: fit-content;
|
||||
margin: auto;
|
||||
vertical-align: bottom;
|
||||
|
||||
.page-item {
|
||||
& > a {
|
||||
color: get-light-color('accent-color');
|
||||
}
|
||||
&.active,
|
||||
&:hover > a {
|
||||
background-color: get-light-color('accent-color') !important;
|
||||
color: get-light-color('text-over-accent-color') !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
pre {
|
||||
margin: 5px;
|
||||
& > code {
|
||||
padding: 10px !important;
|
||||
}
|
||||
}
|
||||
|
||||
@include media('<=large') {
|
||||
pre {
|
||||
margin: 0px;
|
||||
& > code {
|
||||
padding: 0px !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
$alert-types: ('success', 'info', 'warning', 'danger');
|
||||
|
||||
.alert {
|
||||
@each $type in $alert-types {
|
||||
&.#{$type} {
|
||||
background: get-alert-bg-color($type, 'light');
|
||||
svg {
|
||||
width: 1.25rem;
|
||||
height: 1.25rem;
|
||||
color: get-alert-text-color($type, 'light') !important;
|
||||
}
|
||||
strong {
|
||||
padding-left: 0.5rem;
|
||||
color: get-alert-text-color($type, 'light') !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
html[data-theme='dark'] {
|
||||
.paginator {
|
||||
.page-item {
|
||||
& > a {
|
||||
color: get-dark-color('accent-color');
|
||||
}
|
||||
&.active,
|
||||
&:hover > a {
|
||||
background-color: get-dark-color('accent-color') !important;
|
||||
color: get-dark-color('text-over-accent-color') !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
.alert {
|
||||
@each $type in $alert-types {
|
||||
&.#{$type} {
|
||||
background: get-alert-bg-color($type, 'dark');
|
||||
svg {
|
||||
color: get-alert-text-color($type, 'dark') !important;
|
||||
}
|
||||
strong {
|
||||
color: get-alert-text-color($type, 'dark') !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
114
assets/styles/components/tables.scss
Normal file
114
assets/styles/components/tables.scss
Normal file
|
@ -0,0 +1,114 @@
|
|||
table {
|
||||
border-radius: 0.1rem;
|
||||
border: 1px solid rgba(get-light-color('accent-color'), 0.1);
|
||||
min-width: 10rem;
|
||||
padding: 0.1rem;
|
||||
thead {
|
||||
tr {
|
||||
background: get-light-color('accent-color');
|
||||
color: get-light-color('text-over-accent-color');
|
||||
}
|
||||
}
|
||||
|
||||
tbody {
|
||||
tr {
|
||||
height: 40px !important;
|
||||
color: get-light-color('text-color');
|
||||
&:nth-child(odd) {
|
||||
background-color: get-light-color('bg-primary');
|
||||
}
|
||||
&:nth-child(even) {
|
||||
background-color: rgba(get-light-color('accent-color'), 0.05);
|
||||
}
|
||||
}
|
||||
}
|
||||
th,
|
||||
td {
|
||||
padding-top: 0.2rem;
|
||||
padding-bottom: 0.2rem;
|
||||
padding-left: 0.5rem;
|
||||
padding-right: 0.5rem;
|
||||
}
|
||||
}
|
||||
|
||||
.gist {
|
||||
table {
|
||||
border-radius: unset !important;
|
||||
background: unset !important;
|
||||
border: unset !important;
|
||||
padding: unset !important;
|
||||
|
||||
tr {
|
||||
height: unset !important;
|
||||
}
|
||||
|
||||
th,
|
||||
td {
|
||||
padding: unset !important;
|
||||
border-left: unset !important;
|
||||
border-bottom: unset !important;
|
||||
}
|
||||
td,
|
||||
tc {
|
||||
border-right: 1px solid rgba(get-light-color('accent-color'), 0.1);
|
||||
}
|
||||
|
||||
thead {
|
||||
tr {
|
||||
background: unset !important;
|
||||
color: unset !important;
|
||||
}
|
||||
}
|
||||
|
||||
tbody {
|
||||
tr {
|
||||
&:nth-child(odd) {
|
||||
background-color: unset !important;
|
||||
}
|
||||
&:hover {
|
||||
background: unset !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
html[data-theme='dark'] {
|
||||
table {
|
||||
border: 1px solid rgba(get-dark-color('accent-color'), 0.1);
|
||||
thead {
|
||||
tr {
|
||||
background: get-dark-color('accent-color');
|
||||
color: get-dark-color('text-over-accent-color');
|
||||
}
|
||||
}
|
||||
|
||||
tbody {
|
||||
tr {
|
||||
color: get-dark-color('text-color');
|
||||
&:nth-child(odd) {
|
||||
background-color: get-dark-color('bg-primary');
|
||||
}
|
||||
&:nth-child(even) {
|
||||
background-color: rgba(get-dark-color('accent-color'), 0.05);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.gist {
|
||||
&::-moz-selection{
|
||||
background: get-dark-color('text-color');
|
||||
color: get-dark-color('inverse-text-color');
|
||||
}
|
||||
&::selection{
|
||||
background: get-dark-color('text-color');
|
||||
color: get-dark-color('inverse-text-color');
|
||||
}
|
||||
table {
|
||||
td,
|
||||
tc {
|
||||
border-right: 1px solid rgba(get-dark-color('accent-color'), 0.1);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
124
assets/styles/components/texts.scss
Normal file
124
assets/styles/components/texts.scss
Normal file
|
@ -0,0 +1,124 @@
|
|||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5 {
|
||||
color: get-light-color('heading-color');
|
||||
}
|
||||
|
||||
strong {
|
||||
color: get-light-color('heading-color') !important;
|
||||
}
|
||||
|
||||
p {
|
||||
color: get-light-color('text-color');
|
||||
text-align: left;
|
||||
text-justify: inter-word;
|
||||
}
|
||||
|
||||
input {
|
||||
color: get-light-color('text-color');
|
||||
}
|
||||
|
||||
blockquote {
|
||||
border-left: 4px solid get-light-color('accent-color');
|
||||
background-color: rgba(get-light-color('accent-color'), 0.05);
|
||||
padding: 0.3rem;
|
||||
padding-left: 1rem;
|
||||
|
||||
& > p {
|
||||
color: get-light-color('text-color');
|
||||
margin-top: 0.5rem;
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
}
|
||||
|
||||
.text-justify {
|
||||
text-align: justify;
|
||||
}
|
||||
|
||||
.text-muted {
|
||||
color: get-light-color('muted-text-color') !important;
|
||||
}
|
||||
|
||||
.text-heading {
|
||||
font-weight: bold;
|
||||
color: get-light-color('muted-text-color');
|
||||
}
|
||||
|
||||
.sub-title {
|
||||
color: get-light-color('muted-text-color');
|
||||
font-size: 10pt;
|
||||
}
|
||||
|
||||
::-moz-selection {
|
||||
@include selection-color();
|
||||
}
|
||||
|
||||
::selection {
|
||||
@include selection-color();
|
||||
}
|
||||
|
||||
@include media('<=small') {
|
||||
h1 {
|
||||
font-size: 2.2rem;
|
||||
}
|
||||
}
|
||||
|
||||
@include media('<=tiny') {
|
||||
h1 {
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
}
|
||||
|
||||
html[data-theme='dark'] {
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6 {
|
||||
color: get-dark-color('heading-color');
|
||||
}
|
||||
|
||||
strong {
|
||||
color: get-dark-color('heading-color') !important;
|
||||
}
|
||||
|
||||
p {
|
||||
color: get-dark-color('text-color');
|
||||
}
|
||||
|
||||
input {
|
||||
color: get-dark-color('text-color');
|
||||
}
|
||||
|
||||
blockquote {
|
||||
border-left: 4px solid get-dark-color('accent-color');
|
||||
background-color: rgba(get-dark-color('accent-color'), 0.05);
|
||||
color: get-dark-color('text-color');
|
||||
}
|
||||
|
||||
.text-muted {
|
||||
color: get-dark-color('muted-text-color') !important;
|
||||
}
|
||||
|
||||
.text-heading {
|
||||
color: get-dark-color('muted-text-color');
|
||||
}
|
||||
|
||||
.sub-title {
|
||||
color: get-dark-color('muted-text-color');
|
||||
}
|
||||
::-moz-selection {
|
||||
@include selection-color($theme: 'dark');
|
||||
}
|
||||
|
||||
::selection {
|
||||
@include selection-color($theme: 'dark');
|
||||
}
|
||||
li,
|
||||
ul {
|
||||
color: get-dark-color('text-color');
|
||||
}
|
||||
}
|
64
assets/styles/layouts/404.scss
Normal file
64
assets/styles/layouts/404.scss
Normal file
|
@ -0,0 +1,64 @@
|
|||
body.kind-404 {
|
||||
#sidebar-toggler {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.notFound {
|
||||
padding-top: 5rem;
|
||||
text-align: center;
|
||||
padding-bottom: 8rem;
|
||||
|
||||
img {
|
||||
height: 500px;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.message {
|
||||
position: absolute;
|
||||
max-width: 20rem;
|
||||
top: 40%;
|
||||
left: 30%;
|
||||
}
|
||||
}
|
||||
|
||||
@include media('<=very-large') {
|
||||
.notFound .message {
|
||||
top: 50%;
|
||||
left: 25%;
|
||||
}
|
||||
}
|
||||
|
||||
@include media('<=large') {
|
||||
.notFound .message {
|
||||
top: 46%;
|
||||
left: 25%;
|
||||
}
|
||||
}
|
||||
|
||||
@include media('<=medium') {
|
||||
.notFound {
|
||||
img {
|
||||
height: 400px;
|
||||
}
|
||||
.message {
|
||||
top: 20rem;
|
||||
left: 4rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@include media('<=small') {
|
||||
.notFound {
|
||||
img {
|
||||
height: 250px;
|
||||
}
|
||||
.message {
|
||||
top: 20rem;
|
||||
left: 2rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
207
assets/styles/layouts/list.scss
Normal file
207
assets/styles/layouts/list.scss
Normal file
|
@ -0,0 +1,207 @@
|
|||
/* in Hugo, Page kind can be either "section" or "page".*/
|
||||
/* if it is section, then it's a page with a list of items, for example /posts*/
|
||||
/* if it is page, then it is a single page.*/
|
||||
body.kind-section,
|
||||
body.kind-term,
|
||||
body.kind-page {
|
||||
.wrapper {
|
||||
display: flex;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
width: 100%;
|
||||
|
||||
.content-section {
|
||||
flex: 80%;
|
||||
order: 2;
|
||||
/* background-color: lightseagreen; */
|
||||
padding: 0;
|
||||
position: relative;
|
||||
padding-left: 0.5rem;
|
||||
padding-right: 0.5rem;
|
||||
|
||||
.content {
|
||||
padding: 0;
|
||||
position: relative;
|
||||
padding-top: 2rem;
|
||||
min-height: 130vh;
|
||||
|
||||
.post-card-holder {
|
||||
margin-top: 32px;
|
||||
margin-left: auto;
|
||||
padding: 0;
|
||||
display: flex;
|
||||
flex-flow: wrap;
|
||||
}
|
||||
|
||||
.paginator {
|
||||
width: -moz-fit-content;
|
||||
width: fit-content;
|
||||
margin: auto;
|
||||
|
||||
.pagination {
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
margin-top: 0.5rem;
|
||||
margin-bottom: 0.5rem;
|
||||
width: -moz-fit-content;
|
||||
width: fit-content;
|
||||
}
|
||||
|
||||
.page-item {
|
||||
& > a {
|
||||
color: get-light-color('accent-color');
|
||||
}
|
||||
|
||||
&.active > a {
|
||||
background-color: get-light-color('accent-color');
|
||||
color: get-light-color('text-over-accent-color');
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@include media('<medium') {
|
||||
.post-card {
|
||||
margin-left: 1%;
|
||||
margin-right: 1%;
|
||||
width: 98%;
|
||||
}
|
||||
.wrapper {
|
||||
padding-left: 0px;
|
||||
padding-right: 0px;
|
||||
flex-flow: column;
|
||||
overflow: hidden;
|
||||
|
||||
.content-section {
|
||||
flex: 100%;
|
||||
max-width: 100%;
|
||||
padding-left: 0;
|
||||
width: 100%;
|
||||
|
||||
.content {
|
||||
width: 100%;
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
@include transition();
|
||||
}
|
||||
|
||||
&.hide {
|
||||
.content {
|
||||
margin-top: 0;
|
||||
padding-top: 0;
|
||||
@include transition();
|
||||
}
|
||||
.post-card-holder {
|
||||
margin-top: 0.5rem;
|
||||
@include transition();
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@include media('>=medium', '<large') {
|
||||
.post-card {
|
||||
width: calc(100% / 2);
|
||||
}
|
||||
.content-section.hide {
|
||||
.post-card {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@include media('>=large', '<very-large') {
|
||||
.post-card {
|
||||
width: calc(100% / 3);
|
||||
}
|
||||
.wrapper {
|
||||
padding-left: 0px;
|
||||
padding-right: 0px;
|
||||
|
||||
.content-section {
|
||||
padding: 0;
|
||||
flex: 60%;
|
||||
order: 2;
|
||||
padding-bottom: 0.5rem;
|
||||
|
||||
.content {
|
||||
overflow: hidden;
|
||||
|
||||
.post-card-holder {
|
||||
margin: 0;
|
||||
margin-top: 1.5rem;
|
||||
padding-left: 0.5rem;
|
||||
padding-right: 0.5rem;
|
||||
position: relative;
|
||||
@include transition();
|
||||
}
|
||||
}
|
||||
.container {
|
||||
max-width: 100%;
|
||||
}
|
||||
&.hide {
|
||||
.post-card {
|
||||
width: calc(100% / 2);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@include media('>=very-large', '<extra-large') {
|
||||
.post-card {
|
||||
width: calc(100% / 4);
|
||||
}
|
||||
.post-card-holder {
|
||||
margin-left: 0px;
|
||||
}
|
||||
}
|
||||
|
||||
@include media('>=extra-large') {
|
||||
.post-card {
|
||||
width: calc(100% / 5);
|
||||
}
|
||||
.content-section {
|
||||
padding-left: 1rem;
|
||||
padding-right: 1rem;
|
||||
flex: 85%;
|
||||
max-width: 85%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
html[data-theme='dark'] {
|
||||
body.kind-section,
|
||||
body.kind-term,
|
||||
body.kind-page {
|
||||
.wrapper {
|
||||
.content-section {
|
||||
.content {
|
||||
.paginator {
|
||||
.page-item {
|
||||
& > a {
|
||||
background-color: get-dark-color('bg-card') !important;
|
||||
color: get-dark-color('text-color') !important;
|
||||
border: 1px solid get-dark-color('muted-text-color') !important;
|
||||
text-decoration: none !important;
|
||||
|
||||
&:hover {
|
||||
background-color: get-dark-color('hover-over-accent-color') !important;
|
||||
color: get-dark-color('text-over-accent-color') !important;
|
||||
}
|
||||
}
|
||||
|
||||
&.active > a {
|
||||
background-color: get-dark-color('accent-color') !important;
|
||||
color: get-dark-color('text-over-accent-color') !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
114
assets/styles/layouts/main.scss
Normal file
114
assets/styles/layouts/main.scss
Normal file
|
@ -0,0 +1,114 @@
|
|||
/*
|
||||
Removed smooth scrolling implementation in main.js in favor of
|
||||
simpler css approach.
|
||||
See: https://css-tricks.com/snippets/jquery/smooth-scrolling/
|
||||
*/
|
||||
*,
|
||||
html {
|
||||
scroll-behavior: smooth !important;
|
||||
}
|
||||
|
||||
body {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
/*
|
||||
Fixes anchor overlapping with header.
|
||||
See: https://stackoverflow.com/questions/4086107/fixed-page-header-overlaps-in-page-anchors
|
||||
*/
|
||||
:target::before {
|
||||
content: '';
|
||||
display: block;
|
||||
height: 2em; /* fixed header height*/
|
||||
margin: -2em 0 0; /* negative fixed header height */
|
||||
}
|
||||
|
||||
body {
|
||||
background-color: get-light-color('bg-primary');
|
||||
font-family: 'Mulish';
|
||||
}
|
||||
|
||||
.bg-primary {
|
||||
background-color: get-light-color('bg-primary') !important;
|
||||
}
|
||||
|
||||
.bg-secondary {
|
||||
background-color: get-light-color('bg-secondary') !important;
|
||||
}
|
||||
|
||||
.flag-icon {
|
||||
width: 16px !important;
|
||||
margin-top: 3px;
|
||||
margin-right: 3px;
|
||||
}
|
||||
|
||||
.hidden {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.content {
|
||||
ul > ol,
|
||||
ol > ul,
|
||||
ul > ul,
|
||||
ol > ol,
|
||||
li > ol,
|
||||
li > ul {
|
||||
padding-inline-start: 1rem;
|
||||
}
|
||||
}
|
||||
|
||||
kbd {
|
||||
background-color: get-light-color('accent-color');
|
||||
color: get-light-color('text-over-accent-color');
|
||||
}
|
||||
|
||||
mark {
|
||||
background-color: get-light-color('highlight-color');
|
||||
border-radius: 0.25rem;
|
||||
}
|
||||
|
||||
@include media('<=small') {
|
||||
.skills-section,
|
||||
.projects-section,
|
||||
.publications-section {
|
||||
.container {
|
||||
padding-left: 0.3rem;
|
||||
padding-right: 0.3rem;
|
||||
}
|
||||
}
|
||||
|
||||
.section-holder {
|
||||
padding-left: 5px;
|
||||
padding-right: 5px;
|
||||
}
|
||||
|
||||
.skills-section,
|
||||
.projects-section,
|
||||
.recent-posts-section,
|
||||
.achievements-section,
|
||||
.publications-section {
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
}
|
||||
}
|
||||
|
||||
html[data-theme='dark'] {
|
||||
body {
|
||||
background-color: get-dark-color('bg-primary');
|
||||
color: get-dark-color('text-color');
|
||||
}
|
||||
|
||||
.bg-primary {
|
||||
background-color: get-dark-color('bg-primary') !important;
|
||||
}
|
||||
.bg-secondary {
|
||||
background-color: get-dark-color('bg-secondary') !important;
|
||||
}
|
||||
kbd {
|
||||
background-color: get-dark-color('accent-color');
|
||||
color: get-dark-color('text-over-accent-color');
|
||||
}
|
||||
mark {
|
||||
background-color: get-dark-color('highlight-color');
|
||||
}
|
||||
}
|
199
assets/styles/layouts/notes.scss
Normal file
199
assets/styles/layouts/notes.scss
Normal file
|
@ -0,0 +1,199 @@
|
|||
body.type-notes {
|
||||
.wrapper {
|
||||
display: flex;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
width: 100%;
|
||||
|
||||
.content-section {
|
||||
flex: 80%;
|
||||
max-width: 80%;
|
||||
order: 2;
|
||||
/* background-color: lightseagreen; */
|
||||
padding: 0;
|
||||
position: relative;
|
||||
padding-left: 0.5rem;
|
||||
padding-right: 0.5rem;
|
||||
|
||||
.content {
|
||||
padding: 0;
|
||||
position: relative;
|
||||
padding-top: 2rem;
|
||||
min-height: 130vh;
|
||||
|
||||
.note-card-holder {
|
||||
margin-top: 2rem;
|
||||
display: flex;
|
||||
flex-flow: wrap;
|
||||
margin-left: auto;
|
||||
padding: 0;
|
||||
|
||||
.note-card {
|
||||
align-self: flex-start;
|
||||
flex: auto;
|
||||
|
||||
.card {
|
||||
margin: 0.5rem;
|
||||
|
||||
.card-body {
|
||||
padding: 1rem;
|
||||
|
||||
pre {
|
||||
margin: 0;
|
||||
border-radius: 3px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.note-title {
|
||||
padding-left: 1rem;
|
||||
color: get-light-color('accent-color');
|
||||
|
||||
&:before {
|
||||
content: '';
|
||||
display: inline-block;
|
||||
width: 98%;
|
||||
height: 100%;
|
||||
margin-bottom: -26px;
|
||||
border-bottom: 1px solid get-light-color('accent-color');
|
||||
}
|
||||
|
||||
span {
|
||||
background: get-light-color('bg-secondary');
|
||||
padding-right: 5px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@include media('<=extra-large') {
|
||||
.note-card-holder {
|
||||
.note-card {
|
||||
flex: 30%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@include media('<=large') {
|
||||
.wrapper {
|
||||
padding-left: 0px;
|
||||
padding-right: 0px;
|
||||
.content-section {
|
||||
padding: 0;
|
||||
max-width: 100%;
|
||||
order: 2;
|
||||
padding-bottom: 0.5rem;
|
||||
@include transition();
|
||||
|
||||
.content {
|
||||
overflow: hidden;
|
||||
|
||||
.note-card-holder {
|
||||
margin: 0;
|
||||
margin-top: 1.5rem;
|
||||
padding-left: 0.5rem;
|
||||
padding-right: 0.5rem;
|
||||
position: relative;
|
||||
@include transition();
|
||||
.note-card {
|
||||
flex: 50%;
|
||||
}
|
||||
}
|
||||
}
|
||||
.container {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
&.hide {
|
||||
max-width: 60%;
|
||||
@include transition();
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@include media('<=medium') {
|
||||
.note-card-holder .note-card {
|
||||
max-width: 50%;
|
||||
min-width: 50%;
|
||||
@include transition();
|
||||
}
|
||||
|
||||
.content-section.hide .note-card-holder .note-card {
|
||||
max-width: 100%;
|
||||
min-width: 100%;
|
||||
@include transition();
|
||||
}
|
||||
}
|
||||
|
||||
@include media('<=small') {
|
||||
.wrapper {
|
||||
padding-left: 0px;
|
||||
padding-right: 0px;
|
||||
flex-flow: column;
|
||||
overflow: hidden;
|
||||
|
||||
.content-section {
|
||||
.content {
|
||||
width: 100%;
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
@include transition();
|
||||
|
||||
.note-card-holder {
|
||||
margin-top: 0.5rem;
|
||||
@include transition();
|
||||
|
||||
.note-card {
|
||||
flex: 100%;
|
||||
max-width: 100%;
|
||||
@include transition();
|
||||
}
|
||||
}
|
||||
}
|
||||
&.hide {
|
||||
flex: 100%;
|
||||
max-width: 100%;
|
||||
padding-left: 0;
|
||||
width: 100%;
|
||||
@include transition();
|
||||
|
||||
.content {
|
||||
.note-card-holder {
|
||||
margin-top: 0;
|
||||
padding-top: 0;
|
||||
@include transition();
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
html[data-theme='dark'] {
|
||||
body.type-notes {
|
||||
.wrapper {
|
||||
.content-section {
|
||||
.content {
|
||||
.note-card-holder {
|
||||
.note-title {
|
||||
color: get-dark-color('accent-color');
|
||||
&:before {
|
||||
border-bottom: 1px solid get-dark-color('accent-color');
|
||||
}
|
||||
|
||||
span {
|
||||
background: get-dark-color('bg-secondary');
|
||||
padding-right: 5px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
389
assets/styles/layouts/single.scss
Normal file
389
assets/styles/layouts/single.scss
Normal file
|
@ -0,0 +1,389 @@
|
|||
body.kind-page {
|
||||
background-color: get-light-color('bg-secondary');
|
||||
position: relative;
|
||||
|
||||
.wrapper {
|
||||
display: flex;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
width: 100%;
|
||||
justify-content: space-between;
|
||||
position: relative;
|
||||
|
||||
.content-section {
|
||||
flex: 60%;
|
||||
max-width: 60%;
|
||||
order: 2;
|
||||
padding: 0;
|
||||
position: relative;
|
||||
padding-left: 1rem;
|
||||
padding-right: 1rem;
|
||||
|
||||
.content {
|
||||
padding-top: 1.5rem;
|
||||
|
||||
.read-area {
|
||||
background-color: get-light-color('bg-primary');
|
||||
|
||||
.hero-area {
|
||||
margin-top: 3rem;
|
||||
width: 100%;
|
||||
height: 400px;
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
}
|
||||
|
||||
.page-content {
|
||||
width: 100%;
|
||||
position: relative;
|
||||
top: -4.5rem;
|
||||
padding: 15px;
|
||||
|
||||
.author-profile {
|
||||
position: relative;
|
||||
align-content: center;
|
||||
text-align: center;
|
||||
|
||||
.author-name {
|
||||
margin-top: 0px;
|
||||
}
|
||||
|
||||
p {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
img {
|
||||
height: 120px;
|
||||
width: 120px;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
-o-object-fit: cover;
|
||||
object-fit: cover;
|
||||
background-color: get-light-color('bg-primary');
|
||||
padding: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
.title {
|
||||
text-align: center;
|
||||
}
|
||||
.tags {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.post-content {
|
||||
padding: 15px;
|
||||
|
||||
h1,
|
||||
h2 {
|
||||
margin-top: 1.4rem;
|
||||
}
|
||||
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6 {
|
||||
margin-top: 1.3rem;
|
||||
}
|
||||
}
|
||||
|
||||
.next-prev-navigator {
|
||||
padding-left: 1rem !important;
|
||||
padding-right: 1rem !important;
|
||||
|
||||
.next-article {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.next-prev-text {
|
||||
white-space: break-spaces;
|
||||
}
|
||||
a {
|
||||
text-decoration: none !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.toc-section {
|
||||
flex: 20%;
|
||||
order: 3;
|
||||
max-width: 20%;
|
||||
@include transition();
|
||||
|
||||
.toc-holder {
|
||||
position: sticky;
|
||||
top: 4.5rem;
|
||||
padding-top: 1rem;
|
||||
overflow-x: hidden;
|
||||
overflow-y: auto;
|
||||
background-color: get-light-color('bg-primary');
|
||||
margin-right: 0.5rem;
|
||||
@include transition();
|
||||
|
||||
.toc {
|
||||
position: relative;
|
||||
padding-top: 0px;
|
||||
@include transition();
|
||||
|
||||
nav {
|
||||
padding-top: 0px;
|
||||
margin-top: 0px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
@include transition();
|
||||
|
||||
ul {
|
||||
list-style: none;
|
||||
padding-left: 0.5rem;
|
||||
margin-bottom: 0rem;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.nav-link {
|
||||
padding: 0;
|
||||
padding-left: 0.5rem;
|
||||
text-decoration: none !important;
|
||||
@include transition();
|
||||
color: get-light-color('text-color');
|
||||
|
||||
&:hover,
|
||||
&:focus,
|
||||
&.active {
|
||||
padding-left: 1rem;
|
||||
padding-right: 0.5rem;
|
||||
background-color: get-light-color('accent-color');
|
||||
color: get-light-color('text-over-accent-color');
|
||||
@include transition();
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.disquss {
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.share-buttons {
|
||||
@include brand-background();
|
||||
.btn {
|
||||
border: none !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.btn-improve-page {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
#scroll-to-top {
|
||||
position: fixed;
|
||||
border: none;
|
||||
bottom: 0rem;
|
||||
right: 1rem;
|
||||
color: get-light-color('accent-color');
|
||||
font-size: 24pt;
|
||||
z-index: 900000;
|
||||
visibility: hidden;
|
||||
|
||||
&:hover {
|
||||
color: get-light-color('hover-over-accent-color');
|
||||
}
|
||||
&.show {
|
||||
visibility: visible;
|
||||
}
|
||||
|
||||
i {
|
||||
box-shadow: $box-shadow;
|
||||
background-color: get-light-color('bg-primary');
|
||||
border-radius: 50%;
|
||||
}
|
||||
}
|
||||
|
||||
@include media('<=ultra-large') {
|
||||
.content-section {
|
||||
flex: 65%;
|
||||
max-width: 65%;
|
||||
}
|
||||
.content-section .container {
|
||||
max-width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
@include media('<very-large') {
|
||||
.container {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.wrapper {
|
||||
padding-left: 0px;
|
||||
padding-right: 0px;
|
||||
|
||||
.content-section {
|
||||
padding: 0;
|
||||
flex: 60%;
|
||||
max-width: 100%;
|
||||
order: 2;
|
||||
overflow: hidden;
|
||||
|
||||
.content {
|
||||
overflow: hidden;
|
||||
|
||||
.read-area {
|
||||
.hero-area {
|
||||
height: 300px;
|
||||
margin-top: 1rem;
|
||||
}
|
||||
|
||||
.page-content {
|
||||
padding: 0px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.toc-section {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.share-buttons {
|
||||
max-width: 48%;
|
||||
}
|
||||
|
||||
.btn-improve-page {
|
||||
margin-right: 1rem;
|
||||
max-width: 48%;
|
||||
}
|
||||
|
||||
#disqus_thread,
|
||||
.dsq-brlink {
|
||||
padding: 5px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@include media('<=small') {
|
||||
.wrapper {
|
||||
padding: 0px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.content-section {
|
||||
padding: 0;
|
||||
flex: 100%;
|
||||
max-width: 100%;
|
||||
order: 3;
|
||||
|
||||
.content {
|
||||
.read-area {
|
||||
.hero-area {
|
||||
height: 200px;
|
||||
margin-top: 1rem;
|
||||
}
|
||||
|
||||
.page-content {
|
||||
padding: 0px;
|
||||
.next-prev-navigator {
|
||||
.previous-article {
|
||||
text-align: center;
|
||||
margin: 5px;
|
||||
|
||||
a {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
.next-article {
|
||||
text-align: center;
|
||||
margin: 5px;
|
||||
a {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.share-buttons {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.btn-improve-page {
|
||||
text-align: start;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
#scroll-to-top {
|
||||
right: 0.5rem;
|
||||
}
|
||||
|
||||
#disqus_thread,
|
||||
.dsq-brlink {
|
||||
padding: 5px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
html[data-theme='dark'] {
|
||||
body.kind-page {
|
||||
background-color: get-dark-color('bg-secondary');
|
||||
|
||||
.wrapper {
|
||||
.content-section {
|
||||
.content {
|
||||
.read-area {
|
||||
background-color: get-dark-color('bg-primary');
|
||||
|
||||
.page-content {
|
||||
.author-profile {
|
||||
img {
|
||||
background-color: get-dark-color('bg-primary');
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.toc-section {
|
||||
.toc-holder {
|
||||
background-color: get-dark-color('bg-primary');
|
||||
hr {
|
||||
background-color: get-dark-color('muted-text-color');
|
||||
}
|
||||
|
||||
.toc {
|
||||
nav {
|
||||
.nav-link {
|
||||
color: get-dark-color('text-color');
|
||||
|
||||
&:hover,
|
||||
&:focus,
|
||||
&.active {
|
||||
background-color: get-dark-color('accent-color');
|
||||
color: get-dark-color('text-over-accent-color');
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#scroll-to-top {
|
||||
color: get-dark-color('accent-color');
|
||||
&:hover {
|
||||
color: get-dark-color('hover-over-accent-color');
|
||||
}
|
||||
|
||||
i {
|
||||
background-color: get-dark-color('bg-primary');
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
72
assets/styles/mixins.scss
Normal file
72
assets/styles/mixins.scss
Normal file
|
@ -0,0 +1,72 @@
|
|||
@function get-color($mode, $key) {
|
||||
@if map-has-key($themes, $mode) {
|
||||
$theme: map-get($themes, $mode);
|
||||
@if map-has-key($theme, $key) {
|
||||
@return map-get($theme, $key);
|
||||
}
|
||||
}
|
||||
@return red; // default color for debugging purpose
|
||||
}
|
||||
|
||||
@function get-light-color($key) {
|
||||
@return get-color('light', $key);
|
||||
}
|
||||
|
||||
@function get-dark-color($key) {
|
||||
@return get-color('dark', $key);
|
||||
}
|
||||
|
||||
@mixin reset-list {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
@mixin section-title-adjustment() {
|
||||
h1 > span {
|
||||
margin-top: -55px; /* Size of fixed header */
|
||||
padding-bottom: 55px;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
@mixin brand-background() {
|
||||
@each $brand, $color in $brand-colors {
|
||||
.bg-#{$brand} {
|
||||
background-color: $color;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@mixin transition() {
|
||||
transition: all $transition-type $transition-duration;
|
||||
}
|
||||
|
||||
@mixin selection-color($theme: 'light') {
|
||||
background: get-light-color('accent-color');
|
||||
color: get-light-color('text-over-accent-color');
|
||||
@if $theme == 'dark' {
|
||||
background: get-dark-color('accent-color');
|
||||
color: get-dark-color('text-over-accent-color');
|
||||
}
|
||||
}
|
||||
|
||||
@function get-alert-bg-color($type, $mode) {
|
||||
$colors: map-get($alerts, $type);
|
||||
@if $mode == 'light' {
|
||||
@return map-get($colors, 'bg-color');
|
||||
} @else {
|
||||
@return map-get($colors, 'text-color');
|
||||
}
|
||||
@return red;
|
||||
}
|
||||
|
||||
@function get-alert-text-color($type, $mode) {
|
||||
$colors: map-get($alerts, $type);
|
||||
@if $mode == 'light' {
|
||||
@return map-get($colors, 'text-color');
|
||||
} @else {
|
||||
@return map-get($colors, 'bg-color');
|
||||
}
|
||||
@return red;
|
||||
}
|
286
assets/styles/navigators/navbar.scss
Normal file
286
assets/styles/navigators/navbar.scss
Normal file
|
@ -0,0 +1,286 @@
|
|||
@mixin nav-item-hover-effect($theme: 'light') {
|
||||
color: get-light-color('accent-color') !important;
|
||||
border-bottom: 2px solid get-light-color('accent-color') !important;
|
||||
background: rgba(get-light-color('accent-color'), 0.1);
|
||||
@include transition();
|
||||
|
||||
@if $theme == 'dark' {
|
||||
color: get-dark-color('accent-color') !important;
|
||||
border-bottom: 2px solid get-dark-color('accent-color') !important;
|
||||
background: rgba(get-dark-color('accent-color'), 0.1);
|
||||
}
|
||||
}
|
||||
|
||||
.top-navbar {
|
||||
position: fixed;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
height: 50px;
|
||||
z-index: 99999;
|
||||
margin: 0px;
|
||||
padding-top: 0.4rem;
|
||||
color: get-light-color('heading-color');
|
||||
text-align: center;
|
||||
background-color: get-light-color('bg-primary');
|
||||
@include transition();
|
||||
|
||||
.navbar-brand {
|
||||
color: get-light-color('heading-color');
|
||||
text-decoration: none !important;
|
||||
font-weight: 600;
|
||||
img {
|
||||
width: 42px;
|
||||
padding: 5px;
|
||||
margin-left: -10px;
|
||||
}
|
||||
}
|
||||
|
||||
img {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.sidebar-icon {
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
filter: invert(0.5);
|
||||
}
|
||||
|
||||
li {
|
||||
a {
|
||||
color: get-light-color('heading-color');
|
||||
text-decoration: none !important;
|
||||
font-weight: 500;
|
||||
@include transition();
|
||||
border-bottom: 2px solid transparent;
|
||||
&:hover {
|
||||
@include nav-item-hover-effect();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.navbar-nav .active {
|
||||
@include nav-item-hover-effect();
|
||||
}
|
||||
|
||||
#top-navbar-divider {
|
||||
margin-top: 10px;
|
||||
background-color: get-light-color('muted-text-color');
|
||||
height: 20px;
|
||||
width: 2px;
|
||||
}
|
||||
|
||||
.dropdown-menu {
|
||||
box-shadow: $box-shadow;
|
||||
border: 1px solid rgba(get-light-color('accent-color'), 0.1);
|
||||
max-height: 0vh;
|
||||
overflow: hidden;
|
||||
display: block;
|
||||
visibility: hidden;
|
||||
@include transition();
|
||||
|
||||
&.show {
|
||||
max-height: 100vh;
|
||||
visibility: visible;
|
||||
@include transition();
|
||||
|
||||
a {
|
||||
color: get-light-color('heading-color') !important;
|
||||
|
||||
&:hover {
|
||||
@include nav-item-hover-effect();
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.navbar-collapse {
|
||||
margin-top: -5px;
|
||||
&.show,
|
||||
&.collapsing {
|
||||
background-color: get-light-color('bg-primary');
|
||||
padding-left: 1rem;
|
||||
|
||||
li {
|
||||
a {
|
||||
color: get-light-color('heading-color');
|
||||
font-weight: 500;
|
||||
@include transition();
|
||||
}
|
||||
}
|
||||
.navbar-nav {
|
||||
.active {
|
||||
color: get-light-color('accent-color');
|
||||
}
|
||||
a:hover {
|
||||
color: get-light-color('accent-color');
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.transparent-navbar {
|
||||
background-color: transparent !important;
|
||||
.navbar-brand {
|
||||
color: get-light-color('inverse-text-color');
|
||||
font-weight: 600;
|
||||
}
|
||||
li {
|
||||
a {
|
||||
color: get-light-color('inverse-text-color');
|
||||
}
|
||||
}
|
||||
.feather-menu {
|
||||
stroke: get-light-color('inverse-text-color');
|
||||
}
|
||||
}
|
||||
|
||||
#themeMenu {
|
||||
width: 25px;
|
||||
min-width: 3rem;
|
||||
|
||||
img.theme-icon {
|
||||
display: block !important;
|
||||
margin-left: auto !important;
|
||||
margin-right: auto !important;
|
||||
}
|
||||
}
|
||||
|
||||
@include media('<very-large') {
|
||||
height: -moz-fit-content;
|
||||
height: fit-content;
|
||||
padding-bottom: 0px;
|
||||
padding-top: 0px;
|
||||
|
||||
.container {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
&.transparent-navbar {
|
||||
.navbar-nav .active,
|
||||
li a:hover {
|
||||
color: get-light-color('accent-color');
|
||||
@include transition();
|
||||
}
|
||||
}
|
||||
|
||||
#top-navbar-divider {
|
||||
height: auto;
|
||||
width: auto;
|
||||
margin-right: 15px;
|
||||
border-top: 1px solid #c0ccda;
|
||||
}
|
||||
|
||||
.dropdown-menu {
|
||||
text-align: center;
|
||||
margin-right: 1rem;
|
||||
@include transition();
|
||||
}
|
||||
|
||||
.languageSelector {
|
||||
position: fixed;
|
||||
right: 0.5rem;
|
||||
bottom: 1rem;
|
||||
z-index: 10000000;
|
||||
background-color: get-light-color('bg-primary');
|
||||
box-shadow: $box-shadow;
|
||||
}
|
||||
#themeMenu {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
@include media('<=small') {
|
||||
.dropdown-menu {
|
||||
margin-left: -1rem;
|
||||
margin-right: 0rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.feather-sidebar,
|
||||
.feather-menu {
|
||||
width: 1.5rem;
|
||||
height: 1.5rem;
|
||||
stroke: get-light-color('text-color');
|
||||
}
|
||||
|
||||
html[data-theme='dark'] {
|
||||
.top-navbar {
|
||||
color: get-dark-color('heading-color');
|
||||
background-color: get-dark-color('bg-primary');
|
||||
|
||||
.navbar-brand {
|
||||
color: get-dark-color('heading-color');
|
||||
}
|
||||
.sidebar-icon {
|
||||
filter: invert(0.5);
|
||||
}
|
||||
|
||||
li {
|
||||
a {
|
||||
color: get-dark-color('heading-color');
|
||||
}
|
||||
}
|
||||
|
||||
#top-navbar-divider {
|
||||
background-color: get-dark-color('muted-text-color');
|
||||
}
|
||||
|
||||
.dropdown-menu {
|
||||
box-shadow: $box-shadow;
|
||||
background-color: get-dark-color('bg-card');
|
||||
border: 1px solid rgba(get-dark-color('accent-color'), 0.1);
|
||||
|
||||
&.show {
|
||||
a {
|
||||
color: get-dark-color('heading-color') !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.navbar-collapse {
|
||||
&.show,
|
||||
&.collapsing {
|
||||
background-color: get-dark-color('bg-primary');
|
||||
|
||||
li {
|
||||
a {
|
||||
color: get-dark-color('heading-color');
|
||||
}
|
||||
}
|
||||
.navbar-nav {
|
||||
.active {
|
||||
color: get-dark-color('accent-color');
|
||||
}
|
||||
a:hover {
|
||||
color: get-dark-color('accent-color');
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.transparent-navbar {
|
||||
.navbar-brand {
|
||||
color: get-dark-color('text-color');
|
||||
}
|
||||
li {
|
||||
a {
|
||||
color: get-dark-color('text-color');
|
||||
}
|
||||
}
|
||||
.feather-menu {
|
||||
stroke: get-dark-color('text-color');
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
img.theme-icon {
|
||||
filter: invert(1);
|
||||
}
|
||||
|
||||
.feather-sidebar,
|
||||
.feather-menu {
|
||||
stroke: get-dark-color('text-color');
|
||||
}
|
||||
}
|
301
assets/styles/navigators/sidebar.scss
Normal file
301
assets/styles/navigators/sidebar.scss
Normal file
|
@ -0,0 +1,301 @@
|
|||
.sidebar-section {
|
||||
order: 1;
|
||||
flex: 20%;
|
||||
max-width: 20%;
|
||||
@include transition();
|
||||
|
||||
.sidebar-holder {
|
||||
top: 2.5rem;
|
||||
position: sticky;
|
||||
background-color: get-light-color('bg-primary');
|
||||
height: 100vh;
|
||||
overflow: auto;
|
||||
box-shadow: $box-shadow;
|
||||
@include transition();
|
||||
|
||||
.sidebar {
|
||||
background: get-light-color('bg-primary');
|
||||
height: 100vh;
|
||||
@include transition();
|
||||
|
||||
#search-box {
|
||||
margin-left: 5%;
|
||||
margin-right: 5%;
|
||||
width: -webkit-fill-available;
|
||||
height: 35px;
|
||||
padding-left: 15px;
|
||||
margin-top: 30px;
|
||||
margin-bottom: 10px;
|
||||
border-radius: 5px;
|
||||
background-color: get-light-color('bg-secondary');
|
||||
@include transition();
|
||||
border: 1px solid rgba(get-light-color('accent-color'), 0.1);
|
||||
|
||||
&:focus {
|
||||
border: 1pt solid get-light-color('accent-color');
|
||||
outline: none;
|
||||
}
|
||||
}
|
||||
|
||||
#list-heading {
|
||||
padding-left: 0px !important;
|
||||
}
|
||||
|
||||
.sidebar-tree {
|
||||
padding-left: 1rem;
|
||||
position: relative;
|
||||
width: -moz-max-content;
|
||||
width: max-content;
|
||||
|
||||
.tree {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
|
||||
li {
|
||||
margin: 0;
|
||||
padding: 0 1em;
|
||||
line-height: 2em;
|
||||
color: get-light-color('heading-color');
|
||||
position: relative;
|
||||
|
||||
i {
|
||||
color: get-light-color('heading-color');
|
||||
font-size: 12px;
|
||||
margin-right: 5px;
|
||||
}
|
||||
}
|
||||
.shift-right {
|
||||
margin-left: 5px;
|
||||
}
|
||||
|
||||
.subtree {
|
||||
padding-left: 0.7rem;
|
||||
|
||||
&:before {
|
||||
content: '';
|
||||
display: block;
|
||||
width: 0;
|
||||
position: absolute;
|
||||
top: 2.5rem;
|
||||
left: 1.5rem;
|
||||
bottom: 0.9rem;
|
||||
border-left: 1px solid get-light-color('text-color');
|
||||
}
|
||||
li {
|
||||
&:before {
|
||||
content: '';
|
||||
display: block;
|
||||
width: 18px;
|
||||
height: 0;
|
||||
border-top: 1px solid get-light-color('text-color');
|
||||
margin-top: -1px;
|
||||
position: absolute;
|
||||
top: 18px;
|
||||
left: -2px;
|
||||
}
|
||||
&:last-child:before {
|
||||
background: get-light-color('bg-primary');
|
||||
height: auto;
|
||||
top: 1.1rem;
|
||||
bottom: 0;
|
||||
}
|
||||
ul {
|
||||
position: relative;
|
||||
padding-left: 0.5rem;
|
||||
display: none;
|
||||
list-style: none;
|
||||
|
||||
&.active {
|
||||
display: block;
|
||||
}
|
||||
|
||||
&:before {
|
||||
content: '';
|
||||
display: block;
|
||||
width: 0;
|
||||
position: absolute;
|
||||
top: -8px;
|
||||
left: 6px;
|
||||
bottom: 0.8rem;
|
||||
border-left: 1px solid;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@include media('<=ultra-large') {
|
||||
flex: 15%;
|
||||
max-width: 15%;
|
||||
|
||||
.sidebar-holder {
|
||||
max-width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
@include media('<=extra-large') {
|
||||
.sidebar-holder {
|
||||
max-width: 20rem;
|
||||
}
|
||||
}
|
||||
|
||||
@include media('<=very-large') {
|
||||
.sidebar-tree {
|
||||
margin-left: 1rem;
|
||||
}
|
||||
}
|
||||
|
||||
@include media('<very-large') {
|
||||
flex: 0%;
|
||||
max-width: 0%;
|
||||
min-height: 100vh;
|
||||
@include transition();
|
||||
|
||||
.sidebar-holder {
|
||||
position: sticky;
|
||||
top: 2.5rem;
|
||||
width: 100%;
|
||||
padding-bottom: 1rem;
|
||||
max-height: calc(100vh - 2.5rem);
|
||||
}
|
||||
|
||||
&.expanded {
|
||||
flex: 30%;
|
||||
max-width: 30%;
|
||||
margin-right: 0.5rem;
|
||||
@include transition();
|
||||
}
|
||||
}
|
||||
|
||||
@include media('<=medium') {
|
||||
flex: 0%;
|
||||
max-width: 0%;
|
||||
min-height: 100vh;
|
||||
@include transition();
|
||||
|
||||
.sidebar-holder {
|
||||
position: sticky;
|
||||
top: 2.5rem;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
&.expanded {
|
||||
flex: 40%;
|
||||
max-width: 40%;
|
||||
margin-right: 0.5rem;
|
||||
@include transition();
|
||||
}
|
||||
}
|
||||
|
||||
@include media('<=small') {
|
||||
width: 100%;
|
||||
min-height: 0;
|
||||
max-height: 0;
|
||||
max-width: 100%;
|
||||
@include transition();
|
||||
|
||||
.sidebar-holder {
|
||||
max-height: 0;
|
||||
height: -moz-fit-content;
|
||||
height: fit-content;
|
||||
overflow: hidden;
|
||||
max-width: 100%;
|
||||
@include transition();
|
||||
|
||||
.sidebar {
|
||||
position: relative;
|
||||
height: -moz-fit-content;
|
||||
height: fit-content;
|
||||
max-height: -moz-fit-content;
|
||||
max-height: fit-content;
|
||||
width: 100vw;
|
||||
min-height: 0;
|
||||
overflow: hidden;
|
||||
@include transition();
|
||||
|
||||
.sidebar-tree {
|
||||
margin-left: 0rem;
|
||||
max-height: 0;
|
||||
@include transition();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.expanded {
|
||||
margin-top: 2rem;
|
||||
position: relative;
|
||||
height: -moz-fit-content;
|
||||
height: fit-content;
|
||||
flex: none;
|
||||
max-height: 300vh;
|
||||
max-width: 100%;
|
||||
@include transition();
|
||||
|
||||
.sidebar-holder {
|
||||
max-height: 200vh;
|
||||
@include transition();
|
||||
|
||||
.sidebar-tree {
|
||||
max-height: 200vh;
|
||||
@include transition();
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.feather-plus-circle,
|
||||
.feather-minus-circle {
|
||||
width: 1rem;
|
||||
height: 1rem;
|
||||
}
|
||||
|
||||
html[data-theme='dark'] {
|
||||
.sidebar-section {
|
||||
.sidebar-holder {
|
||||
background-color: get-dark-color('bg-primary');
|
||||
|
||||
.sidebar {
|
||||
background: get-dark-color('bg-primary');
|
||||
|
||||
#search-box {
|
||||
background-color: get-dark-color('bg-secondary');
|
||||
border: 1px solid rgba(get-dark-color('accent-color'), 0.1);
|
||||
|
||||
&:focus {
|
||||
border: 1pt solid get-dark-color('accent-color');
|
||||
}
|
||||
}
|
||||
|
||||
.sidebar-tree {
|
||||
.tree {
|
||||
li {
|
||||
color: get-dark-color('heading-color');
|
||||
|
||||
i {
|
||||
color: get-dark-color('heading-color');
|
||||
}
|
||||
}
|
||||
.subtree {
|
||||
&:before {
|
||||
border-left: 1px solid get-dark-color('text-color');
|
||||
}
|
||||
li {
|
||||
&:before {
|
||||
border-top: 1px solid get-dark-color('text-color');
|
||||
}
|
||||
&:last-child:before {
|
||||
background: get-dark-color('bg-primary');
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
15
assets/styles/override.scss
Normal file
15
assets/styles/override.scss
Normal file
|
@ -0,0 +1,15 @@
|
|||
/* override this file for custom css */
|
||||
|
||||
/* you can import bootstrap mixins */
|
||||
// @import 'bootstrap/scss/mixins';
|
||||
// Example usage
|
||||
// .some-class {
|
||||
// @include media-breakpoint-up(sm) {
|
||||
// // Larger than sm: 576px
|
||||
// display: inline;
|
||||
// }
|
||||
// @include media-breakpoint-down(md) {
|
||||
// // Smaller than md: 768px
|
||||
// display: block;
|
||||
// }
|
||||
// }
|
232
assets/styles/sections/about.scss
Normal file
232
assets/styles/sections/about.scss
Normal file
|
@ -0,0 +1,232 @@
|
|||
@use 'sass:map';
|
||||
|
||||
$progress-bar-colors: (
|
||||
'blue': #048dff,
|
||||
'yellow': #eebb4d,
|
||||
'pink': #ed63d2,
|
||||
'green': #2dca73,
|
||||
'sky': #00c9e3,
|
||||
'orange': #ff7c7c,
|
||||
);
|
||||
|
||||
@mixin circular-progress-bar-color() {
|
||||
@each $color, $value in $progress-bar-colors {
|
||||
&.#{$color} {
|
||||
.circular-progress-bar {
|
||||
border-color: $value;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@mixin circular-progress-animation-breakpoints() {
|
||||
$progress: 0;
|
||||
$duration: 0;
|
||||
$delay: 1.8;
|
||||
|
||||
@for $i from 0 through 20 {
|
||||
.circular-progress-percentage-#{$progress} {
|
||||
animation: circular-loading-#{$progress} #{$duration}s linear forwards 1.8s;
|
||||
}
|
||||
.circular-progress-percentage-#{$progress}-delay {
|
||||
animation-delay: #{$delay}s;
|
||||
}
|
||||
$progress: $progress + 5;
|
||||
$duration: $duration + 0.18;
|
||||
$delay: $duration + 1.8;
|
||||
}
|
||||
}
|
||||
|
||||
@mixin circular-progress-animation-keyframes($progress, $degree, $keyframes) {
|
||||
@for $i from 0 through $keyframes {
|
||||
@keyframes circular-loading-#{$progress} {
|
||||
0% {
|
||||
transform: rotate(0);
|
||||
}
|
||||
100% {
|
||||
transform: rotate(#{$degree}deg);
|
||||
}
|
||||
}
|
||||
$progress: $progress + 5;
|
||||
$degree: $degree + 18;
|
||||
}
|
||||
}
|
||||
|
||||
.about-section {
|
||||
.social-link {
|
||||
list-style: none;
|
||||
padding: 0.2rem;
|
||||
|
||||
a {
|
||||
font-size: 1.5rem;
|
||||
color: get-light-color('text-color');
|
||||
padding: 0.5rem;
|
||||
|
||||
&:hover {
|
||||
color: get-light-color('accent-color');
|
||||
@include transition();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.circular-progress {
|
||||
width: 150px;
|
||||
height: 150px;
|
||||
line-height: 150px;
|
||||
background: none;
|
||||
margin: 0 auto;
|
||||
box-shadow: none;
|
||||
position: relative;
|
||||
|
||||
&::after {
|
||||
content: '';
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 50%;
|
||||
border: 12px solid get-light-color('bg-primary');
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
}
|
||||
span {
|
||||
width: 50%;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.circular-progress-bar {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: none;
|
||||
border-width: 12px;
|
||||
border-style: solid;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
.circular-progress-left {
|
||||
left: 0;
|
||||
|
||||
.circular-progress-bar {
|
||||
left: 100%;
|
||||
border-top-right-radius: 80px;
|
||||
border-bottom-right-radius: 80px;
|
||||
border-left: 0;
|
||||
transform-origin: center left;
|
||||
}
|
||||
}
|
||||
.circular-progress-right {
|
||||
right: 0;
|
||||
|
||||
.circular-progress-bar {
|
||||
left: -100%;
|
||||
border-top-left-radius: 80px;
|
||||
border-bottom-left-radius: 80px;
|
||||
border-right: 0;
|
||||
transform-origin: center right;
|
||||
}
|
||||
}
|
||||
.circular-progress-value {
|
||||
width: 90%;
|
||||
height: 90%;
|
||||
padding: 1rem;
|
||||
border-radius: 50%;
|
||||
background: get-light-color('text-color');
|
||||
font-size: 1rem;
|
||||
color: get-light-color('bg-primary');
|
||||
line-height: initial;
|
||||
text-align: center;
|
||||
position: absolute;
|
||||
top: 5%;
|
||||
left: 5%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
@include circular-progress-bar-color();
|
||||
@include circular-progress-animation-breakpoints();
|
||||
@include circular-progress-animation-keyframes($progress: 0, $degree: 0, $keyframes: 20);
|
||||
}
|
||||
|
||||
@include media('<=large') {
|
||||
.circular-progress {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
@include media('<=medium') {
|
||||
.about-section.container {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.circular-progress {
|
||||
width: 135px;
|
||||
height: 135px;
|
||||
}
|
||||
}
|
||||
@include media('<=small') {
|
||||
.circular-progress {
|
||||
width: 150px;
|
||||
height: 150px;
|
||||
}
|
||||
|
||||
.circular-progress .circular-progress-value {
|
||||
font-size: 1rem;
|
||||
}
|
||||
}
|
||||
@include media('<=tiny') {
|
||||
.col-6 {
|
||||
flex: auto;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.social-link {
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
.certificate-badge {
|
||||
padding-left: 2rem;
|
||||
padding-right: 2rem;
|
||||
}
|
||||
.circular-progress {
|
||||
width: 200px;
|
||||
height: 200px;
|
||||
|
||||
.circular-progress-left .circular-progress-bar {
|
||||
border-top-right-radius: 100px;
|
||||
border-bottom-right-radius: 100px;
|
||||
}
|
||||
.circular-progress-right .circular-progress-bar {
|
||||
border-top-left-radius: 100px;
|
||||
border-bottom-left-radius: 100px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
html[data-theme='dark'] {
|
||||
.about-section {
|
||||
.social-link {
|
||||
a {
|
||||
color: get-dark-color('text-color');
|
||||
|
||||
&:hover {
|
||||
color: get-dark-color('accent-color');
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.circular-progress {
|
||||
&::after {
|
||||
border: 12px solid get-dark-color('bg-primary');
|
||||
}
|
||||
|
||||
.circular-progress-value {
|
||||
background: get-dark-color('inverse-text-color');
|
||||
color: get-dark-color('text-color');
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
78
assets/styles/sections/accomplishments.scss
Normal file
78
assets/styles/sections/accomplishments.scss
Normal file
|
@ -0,0 +1,78 @@
|
|||
.accomplishments-section {
|
||||
@include section-title-adjustment();
|
||||
|
||||
.card {
|
||||
background: get-light-color('bg-card');
|
||||
border-top: 2px solid get-light-color('accent-color');
|
||||
height: 100%;
|
||||
|
||||
&:hover,
|
||||
&:focus {
|
||||
border-top: 2px solid get-light-color('hover-over-accent-color');
|
||||
}
|
||||
|
||||
.card-header {
|
||||
background: none;
|
||||
border: none;
|
||||
|
||||
.sub-title {
|
||||
color: get-light-color('muted-text-color');
|
||||
margin-top: 0.4rem;
|
||||
}
|
||||
}
|
||||
|
||||
.card-body {
|
||||
padding: 0;
|
||||
padding-left: 1rem;
|
||||
padding-right: 1rem;
|
||||
}
|
||||
|
||||
.card-footer {
|
||||
background: get-light-color('bg-card');
|
||||
border: none;
|
||||
padding: 0;
|
||||
padding-left: 0.7rem;
|
||||
padding-bottom: 0.3rem;
|
||||
}
|
||||
}
|
||||
|
||||
@include media('<=large') {
|
||||
width: 100%;
|
||||
padding: 0;
|
||||
padding-left: 0.2rem;
|
||||
padding-right: 0.2rem;
|
||||
margin-top: 2rem;
|
||||
|
||||
.container {
|
||||
max-width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
@include media('<=small') {
|
||||
flex: 100%;
|
||||
max-width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
html[data-theme='dark'] {
|
||||
.accomplishments-section {
|
||||
.card {
|
||||
background: get-dark-color('bg-card');
|
||||
border-top: 2px solid get-dark-color('accent-color');
|
||||
|
||||
&:hover,
|
||||
&:focus {
|
||||
border-top: 2px solid get-dark-color('hover-over-accent-color');
|
||||
}
|
||||
|
||||
.card-header {
|
||||
.sub-title {
|
||||
color: get-dark-color('muted-text-color');
|
||||
}
|
||||
}
|
||||
.card-footer {
|
||||
background: get-dark-color('bg-card');
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
159
assets/styles/sections/achievements.scss
Normal file
159
assets/styles/sections/achievements.scss
Normal file
|
@ -0,0 +1,159 @@
|
|||
.achievements-section {
|
||||
@include section-title-adjustment();
|
||||
|
||||
.container {
|
||||
padding-top: 0.5rem;
|
||||
}
|
||||
|
||||
#gallery {
|
||||
.achievement-entry {
|
||||
margin-top: 5px;
|
||||
margin-bottom: 5px;
|
||||
margin-left: 7px;
|
||||
margin-right: 7px;
|
||||
z-index: 1;
|
||||
background-color: get-light-color('bg-secondary');
|
||||
background-size: cover;
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
@include transition();
|
||||
|
||||
.title {
|
||||
color: get-light-color('inverse-text-color');
|
||||
background-color: rgba(get-light-color('bg-primary-inverse'), 0.7);
|
||||
opacity: 0;
|
||||
padding: 5px;
|
||||
position: absolute;
|
||||
bottom: 0px;
|
||||
width: 100%;
|
||||
margin-bottom: 0px;
|
||||
bottom: -5px;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
cursor: pointer;
|
||||
transform: scale(1.1);
|
||||
@include transition();
|
||||
z-index: 20000;
|
||||
|
||||
.svg-inline--fa {
|
||||
opacity: 1;
|
||||
font-size: 1rem;
|
||||
@include transition();
|
||||
}
|
||||
|
||||
.title {
|
||||
opacity: 1;
|
||||
bottom: 0px;
|
||||
@include transition();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.achievement-details {
|
||||
cursor: pointer;
|
||||
z-index: 1;
|
||||
height: 75vh !important;
|
||||
opacity: 1 !important;
|
||||
transition: none !important;
|
||||
transform: none !important;
|
||||
|
||||
.img-type-1 .svg-inline--fa,
|
||||
.img-type-2 .svg-inline--fa {
|
||||
margin-top: 0px !important;
|
||||
transition: none !important;
|
||||
float: right;
|
||||
}
|
||||
}
|
||||
|
||||
.img-type-1 {
|
||||
height: 300px;
|
||||
|
||||
.svg-inline--fa {
|
||||
margin-top: 135px;
|
||||
}
|
||||
}
|
||||
.img-type-2 {
|
||||
height: 146px;
|
||||
margin-bottom: 8px;
|
||||
|
||||
.svg-inline--fa {
|
||||
margin-top: 50px;
|
||||
}
|
||||
}
|
||||
|
||||
.svg-inline--fa {
|
||||
color: get-light-color('muted-text-color');
|
||||
background-color: rgba(get-light-color('bg-primary-inverse'), 0.7);
|
||||
padding: 10px;
|
||||
font-size: 0rem;
|
||||
opacity: 0;
|
||||
}
|
||||
.caption {
|
||||
background-color: rgba(get-light-color('bg-primary-inverse'), 0.7);
|
||||
bottom: 1rem;
|
||||
left: 1rem;
|
||||
color: get-light-color('inverse-text-color');
|
||||
padding: 15px;
|
||||
position: absolute;
|
||||
@include transition();
|
||||
|
||||
h4 {
|
||||
color: get-light-color('inverse-text-color');
|
||||
}
|
||||
p {
|
||||
font-size: 16px;
|
||||
font-weight: 300;
|
||||
color: get-light-color('inverse-text-color');
|
||||
}
|
||||
}
|
||||
|
||||
@include media('<=medium') {
|
||||
.container {
|
||||
max-width: 100%;
|
||||
}
|
||||
.col-md-6 {
|
||||
flex: 50%;
|
||||
width: 50%;
|
||||
}
|
||||
}
|
||||
|
||||
@include media('<=small') {
|
||||
#gallery .achievement-entry:hover {
|
||||
transform: scale(1.05);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
html[data-theme='dark'] {
|
||||
.achievements-section {
|
||||
#gallery {
|
||||
.achievement-entry {
|
||||
background-color: get-dark-color('bg-secondary');
|
||||
|
||||
.title {
|
||||
color: get-dark-color('inverse-text-color');
|
||||
background-color: rgba(get-dark-color('bg-primary-inverse'), 0.7);
|
||||
}
|
||||
}
|
||||
.svg-inline--fa {
|
||||
color: get-dark-color('muted-text-color');
|
||||
background-color: rgba(get-dark-color('bg-primary-inverse'), 0.7);
|
||||
}
|
||||
.caption {
|
||||
background-color: rgba(get-dark-color('bg-primary-inverse'), 0.7);
|
||||
color: get-dark-color('inverse-text-color');
|
||||
|
||||
h4 {
|
||||
color: get-dark-color('inverse-text-color');
|
||||
}
|
||||
p {
|
||||
color: get-dark-color('inverse-text-color');
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
245
assets/styles/sections/education.scss
Normal file
245
assets/styles/sections/education.scss
Normal file
|
@ -0,0 +1,245 @@
|
|||
.education-section {
|
||||
@include section-title-adjustment();
|
||||
|
||||
.card {
|
||||
&:hover,
|
||||
&:focus {
|
||||
border-left: 2px solid get-light-color('accent-color');
|
||||
}
|
||||
}
|
||||
|
||||
.education-info-table {
|
||||
width: 100%;
|
||||
border: none;
|
||||
background: none;
|
||||
|
||||
.icon {
|
||||
width: 2rem;
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
position: relative;
|
||||
|
||||
.hline {
|
||||
position: absolute;
|
||||
left: 1rem;
|
||||
top: 0;
|
||||
background-color: get-light-color('accent-color');
|
||||
height: 100%;
|
||||
width: 2px;
|
||||
}
|
||||
|
||||
.icon-holder {
|
||||
background-color: get-light-color('accent-color');
|
||||
border-radius: 50%;
|
||||
height: 2rem;
|
||||
width: 2rem;
|
||||
padding: 0.2rem;
|
||||
text-align: center;
|
||||
color: get-light-color('text-over-accent-color');
|
||||
position: relative;
|
||||
}
|
||||
}
|
||||
|
||||
tr,
|
||||
th,
|
||||
td {
|
||||
border: none !important;
|
||||
padding: 0;
|
||||
background: none !important;
|
||||
}
|
||||
|
||||
tr {
|
||||
&:hover {
|
||||
background: none !important;
|
||||
}
|
||||
&:first-child {
|
||||
.hline {
|
||||
height: 65%;
|
||||
top: auto;
|
||||
}
|
||||
}
|
||||
&:last-child {
|
||||
.hline {
|
||||
height: 50%;
|
||||
}
|
||||
}
|
||||
|
||||
.line {
|
||||
width: 5%;
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
|
||||
div {
|
||||
height: 2px;
|
||||
margin-right: -1px;
|
||||
background-color: get-light-color('accent-color');
|
||||
}
|
||||
}
|
||||
|
||||
.details {
|
||||
.degree-info {
|
||||
padding: 1rem;
|
||||
margin-top: 0.5rem;
|
||||
margin-bottom: 0.5rem;
|
||||
border-left: 2px solid get-light-color('accent-color');
|
||||
border-top: 1px solid get-light-color('bg-primary');
|
||||
border-bottom: 1px solid get-light-color('bg-primary');
|
||||
border-right: 1px solid get-light-color('bg-primary');
|
||||
border-radius: 5px;
|
||||
|
||||
h5 {
|
||||
margin-bottom: 0.3rem;
|
||||
}
|
||||
|
||||
.timeframe {
|
||||
color: get-light-color('muted-text-color');
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.taken-courses {
|
||||
table {
|
||||
margin-left: 1rem;
|
||||
width: 100%;
|
||||
@include transition();
|
||||
background: none;
|
||||
border: none;
|
||||
|
||||
tr,
|
||||
td,
|
||||
th {
|
||||
background: none;
|
||||
border: none;
|
||||
color: get-light-color('text-color');
|
||||
}
|
||||
|
||||
tr {
|
||||
height: auto !important;
|
||||
}
|
||||
th {
|
||||
.course-name-header {
|
||||
width: 50%;
|
||||
}
|
||||
}
|
||||
}
|
||||
.hidden-course {
|
||||
display: none;
|
||||
@include transition();
|
||||
}
|
||||
ul {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-section {
|
||||
.custom-content {
|
||||
padding-bottom: 0.5em;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.hidden {
|
||||
display: none;
|
||||
}
|
||||
|
||||
@include media('<=large') {
|
||||
.container {
|
||||
padding-left: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@include media('<=small') {
|
||||
padding-left: 0.5rem;
|
||||
padding-right: 0.5rem;
|
||||
|
||||
.container {
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
.icon {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.line {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.timeframe {
|
||||
text-align: left;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.education-alt .degree-info {
|
||||
border-right: 2px solid get-light-color('accent-color');
|
||||
}
|
||||
|
||||
html[data-theme='dark'] {
|
||||
.education-section {
|
||||
.card {
|
||||
&:hover,
|
||||
&:focus {
|
||||
border-left: 2px solid get-dark-color('accent-color');
|
||||
}
|
||||
}
|
||||
|
||||
.education-info-table {
|
||||
.icon {
|
||||
.hline {
|
||||
background-color: get-dark-color('accent-color');
|
||||
}
|
||||
|
||||
.icon-holder {
|
||||
background-color: get-dark-color('accent-color');
|
||||
color: get-dark-color('text-over-accent-color');
|
||||
}
|
||||
}
|
||||
tr {
|
||||
.line {
|
||||
div {
|
||||
background-color: get-dark-color('accent-color');
|
||||
}
|
||||
}
|
||||
|
||||
.details {
|
||||
.degree-info {
|
||||
border-left: 2px solid get-dark-color('accent-color');
|
||||
border-top: 1px solid get-dark-color('bg-primary');
|
||||
border-bottom: 1px solid get-dark-color('bg-primary');
|
||||
border-right: 1px solid get-dark-color('bg-primary');
|
||||
|
||||
.timeframe {
|
||||
color: get-dark-color('muted-text-color');
|
||||
}
|
||||
|
||||
.taken-courses {
|
||||
table {
|
||||
tr,
|
||||
td,
|
||||
th {
|
||||
color: get-dark-color('text-color');
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&:hover{
|
||||
border: 1px solid rgba(get-dark-color('accent-color'),0.2);
|
||||
border-left: 2px solid get-dark-color('accent-color');
|
||||
}
|
||||
}
|
||||
.custom-section {
|
||||
.custom-content {
|
||||
color: get-dark-color('text-color');
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.education-alt .degree-info {
|
||||
border-right: 2px solid get-dark-color('accent-color');
|
||||
}
|
||||
}
|
156
assets/styles/sections/experiences.scss
Normal file
156
assets/styles/sections/experiences.scss
Normal file
|
@ -0,0 +1,156 @@
|
|||
.experiences-section {
|
||||
@include section-title-adjustment();
|
||||
|
||||
padding-bottom: 1rem;
|
||||
|
||||
ul {
|
||||
padding-left: 1rem;
|
||||
& > li {
|
||||
margin-left: 0;
|
||||
color: get-light-color('text-color');
|
||||
}
|
||||
}
|
||||
|
||||
.designation {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.circle {
|
||||
padding: 13px 20px;
|
||||
border-radius: 50%;
|
||||
background-color: get-light-color('accent-color');
|
||||
color: get-light-color('text-over-accent-color');
|
||||
max-height: 50px;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.timeline {
|
||||
margin-top: 1.5rem !important;
|
||||
|
||||
.vertical-line {
|
||||
align-self: stretch;
|
||||
|
||||
&::after {
|
||||
content: '';
|
||||
position: relative;
|
||||
border-left: 3px solid get-light-color('accent-color');
|
||||
z-index: 1;
|
||||
height: 100%;
|
||||
left: -23px;
|
||||
}
|
||||
&:nth-child(even)::after {
|
||||
left: -26px;
|
||||
}
|
||||
}
|
||||
.horizontal-line {
|
||||
div {
|
||||
padding: 0;
|
||||
height: 40px;
|
||||
}
|
||||
hr {
|
||||
border-top: 3px solid get-light-color('accent-color');
|
||||
margin: 0;
|
||||
top: 17px;
|
||||
position: relative;
|
||||
opacity: 1;
|
||||
}
|
||||
.timeline-side-div {
|
||||
display: flex;
|
||||
overflow: hidden;
|
||||
}
|
||||
.corner {
|
||||
border: 3px solid get-light-color('accent-color');
|
||||
width: 100%;
|
||||
position: relative;
|
||||
border-radius: 15px;
|
||||
}
|
||||
}
|
||||
.row {
|
||||
&:nth-child(2n) {
|
||||
div {
|
||||
&:nth-child(1) .corner {
|
||||
left: 50%;
|
||||
top: -50%;
|
||||
}
|
||||
&:nth-child(3) .corner {
|
||||
left: -50%;
|
||||
top: calc(50% - 3px);
|
||||
}
|
||||
}
|
||||
}
|
||||
&:nth-child(4n) {
|
||||
div {
|
||||
&:nth-child(1) .corner {
|
||||
left: 50%;
|
||||
top: calc(50% - 3px);
|
||||
}
|
||||
&:nth-child(3) .corner {
|
||||
left: -50%;
|
||||
top: -50%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.company-heading {
|
||||
h5 {
|
||||
display: inline;
|
||||
margin-right: 0.25em;
|
||||
}
|
||||
p {
|
||||
display: inline;
|
||||
}
|
||||
}
|
||||
|
||||
@include media('<=medium') {
|
||||
.container {
|
||||
max-width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
@include media('<=small') {
|
||||
.container {
|
||||
padding-left: 0px;
|
||||
padding-right: 0px;
|
||||
}
|
||||
.timeline {
|
||||
.vertical-line {
|
||||
visibility: hidden;
|
||||
}
|
||||
.horizontal-line {
|
||||
visibility: hidden;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
html[data-theme='dark'] {
|
||||
.experiences-section {
|
||||
ul {
|
||||
& > li {
|
||||
color: get-dark-color('text-color');
|
||||
}
|
||||
}
|
||||
.circle {
|
||||
background-color: get-dark-color('accent-color');
|
||||
color: get-dark-color('text-over-accent-color');
|
||||
}
|
||||
|
||||
.timeline {
|
||||
.vertical-line {
|
||||
&::after {
|
||||
border-left: 3px solid get-dark-color('accent-color');
|
||||
}
|
||||
}
|
||||
.horizontal-line {
|
||||
hr {
|
||||
border-top: 3px solid get-dark-color('accent-color');
|
||||
}
|
||||
.corner {
|
||||
border: 3px solid get-dark-color('accent-color');
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
118
assets/styles/sections/footer.scss
Normal file
118
assets/styles/sections/footer.scss
Normal file
|
@ -0,0 +1,118 @@
|
|||
.footer {
|
||||
color: get-light-color('muted-text-color') !important;
|
||||
background-color: get-light-color('footer-color');
|
||||
position: relative;
|
||||
z-index: 9999;
|
||||
|
||||
h5 {
|
||||
color: get-light-color('inverse-text-color');
|
||||
}
|
||||
|
||||
a {
|
||||
color: get-light-color('muted-text-color');
|
||||
@include transition();
|
||||
&:hover {
|
||||
margin-left: 5px;
|
||||
-webkit-text-decoration: get-light-color('muted-text-color') underline;
|
||||
text-decoration: get-light-color('muted-text-color') underline;
|
||||
@include transition();
|
||||
}
|
||||
}
|
||||
|
||||
ul {
|
||||
list-style: none;
|
||||
padding-left: 0;
|
||||
|
||||
li {
|
||||
margin-top: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
hr {
|
||||
background-color: get-light-color('muted-text-color');
|
||||
}
|
||||
|
||||
p:first-child {
|
||||
color: get-light-color('inverse-text-color');
|
||||
}
|
||||
|
||||
input {
|
||||
background-color: get-light-color('inverse-text-color');
|
||||
&:focus {
|
||||
background-color: get-light-color('bg-secondary');
|
||||
}
|
||||
}
|
||||
|
||||
#disclaimer {
|
||||
color: get-light-color('muted-text-color') !important;
|
||||
text-align: justify;
|
||||
& > strong {
|
||||
color: get-light-color('inverse-text-color') !important;
|
||||
}
|
||||
}
|
||||
|
||||
#theme {
|
||||
color: get-light-color('inverse-text-color');
|
||||
img {
|
||||
width: 32px;
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
#hugo {
|
||||
&:hover {
|
||||
margin-right: 5px;
|
||||
@include transition();
|
||||
}
|
||||
img {
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
html[data-theme='dark'] {
|
||||
.footer {
|
||||
color: get-dark-color('muted-text-color') !important;
|
||||
background-color: get-dark-color('footer-color');
|
||||
h5 {
|
||||
color: get-dark-color('heading-color');
|
||||
}
|
||||
|
||||
a {
|
||||
color: get-dark-color('muted-text-color');
|
||||
&:hover {
|
||||
-webkit-text-decoration: get-dark-color('muted-text-color') underline;
|
||||
text-decoration: get-dark-color('muted-text-color') underline;
|
||||
}
|
||||
}
|
||||
|
||||
hr {
|
||||
background-color: get-dark-color('muted-text-color');
|
||||
}
|
||||
|
||||
p:first-child {
|
||||
color: get-dark-color('muted-text-color');
|
||||
}
|
||||
|
||||
input {
|
||||
background-color: get-dark-color('bg-primary');
|
||||
&:focus {
|
||||
background-color: get-dark-color('bg-secondary');
|
||||
color: get-dark-color('text-color');
|
||||
}
|
||||
&::placeholder {
|
||||
color: get-dark-color('muted-text-color');
|
||||
}
|
||||
}
|
||||
|
||||
#disclaimer {
|
||||
color: get-dark-color('muted-text-color') !important;
|
||||
& > strong {
|
||||
color: get-dark-color('text-color') !important;
|
||||
}
|
||||
}
|
||||
|
||||
#theme {
|
||||
color: get-dark-color('text-color');
|
||||
}
|
||||
}
|
||||
}
|
131
assets/styles/sections/home.scss
Normal file
131
assets/styles/sections/home.scss
Normal file
|
@ -0,0 +1,131 @@
|
|||
.home {
|
||||
height: 100vh;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
color: get-light-color('text-over-accent-color');
|
||||
overflow: hidden;
|
||||
|
||||
.background {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
background-attachment: fixed;
|
||||
background-position: center;
|
||||
transform: scale(1.1);
|
||||
filter: blur(3px);
|
||||
background-size: cover;
|
||||
}
|
||||
|
||||
.arrow-center {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
/*
|
||||
Resolves https://github.com/hugo-toha/toha/issues/70
|
||||
|
||||
fixed attached images use the whole <body> size. On mobile this can get really
|
||||
tall which blows your image out. Setting the attachment back to scroll allows
|
||||
your cover image to stretch within its own container
|
||||
*/
|
||||
@supports (-webkit-touch-callout: none) {
|
||||
.background {
|
||||
background-attachment: scroll;
|
||||
}
|
||||
}
|
||||
|
||||
.content {
|
||||
position: relative;
|
||||
top: -65%;
|
||||
height: 60%;
|
||||
}
|
||||
|
||||
img {
|
||||
width: 148px;
|
||||
height: 148px;
|
||||
background-color: get-light-color('bg-secondary');
|
||||
padding: 5px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.greeting,
|
||||
.greeting-subtitle {
|
||||
color: get-light-color('text-over-accent-color');
|
||||
}
|
||||
|
||||
.typing-carousel {
|
||||
font-size: 14pt;
|
||||
color: get-light-color('text-over-accent-color');
|
||||
}
|
||||
|
||||
#typing-carousel-data {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.arrow {
|
||||
position: absolute;
|
||||
color: get-light-color('text-over-accent-color');
|
||||
font-size: 1.5rem;
|
||||
bottom: 0;
|
||||
}
|
||||
|
||||
.bounce {
|
||||
animation: bounce 2s infinite;
|
||||
}
|
||||
|
||||
@keyframes bounce {
|
||||
0%,
|
||||
20%,
|
||||
50%,
|
||||
80%,
|
||||
100% {
|
||||
transform: translateY(0);
|
||||
}
|
||||
40% {
|
||||
transform: translateY(-30px);
|
||||
}
|
||||
60% {
|
||||
transform: translateY(-15px);
|
||||
}
|
||||
}
|
||||
|
||||
@include media('<=small') {
|
||||
.content {
|
||||
position: relative;
|
||||
top: -75%;
|
||||
height: 65%;
|
||||
}
|
||||
|
||||
img {
|
||||
width: 140px;
|
||||
max-width: 50%;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
.greeting {
|
||||
font-size: 24pt;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
html[data-theme='dark'] {
|
||||
.home {
|
||||
color: get-dark-color('text-over-accent-color');
|
||||
img {
|
||||
background-color: get-dark-color('bg-secondary');
|
||||
}
|
||||
|
||||
.greeting,
|
||||
.greeting-subtitle {
|
||||
color: get-dark-color('text-over-accent-color');
|
||||
}
|
||||
|
||||
.typing-carousel {
|
||||
color: get-dark-color('text-over-accent-color');
|
||||
}
|
||||
.arrow {
|
||||
color: get-dark-color('text-over-accent-color');
|
||||
}
|
||||
}
|
||||
}
|
45
assets/styles/sections/pdf-viewer.scss
Normal file
45
assets/styles/sections/pdf-viewer.scss
Normal file
|
@ -0,0 +1,45 @@
|
|||
.pdf-viewer {
|
||||
canvas {
|
||||
border: 1px solid black;
|
||||
direction: ltr;
|
||||
width: 100%;
|
||||
height: auto;
|
||||
display: none;
|
||||
}
|
||||
|
||||
.paginator {
|
||||
display: flex!important;
|
||||
width: 100% !important;
|
||||
text-align: center;
|
||||
margin-bottom: 0.2rem !important;
|
||||
justify-content: space-between;
|
||||
|
||||
.page-number-indicator {
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
}
|
||||
|
||||
.loading-wrapper {
|
||||
display: none;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
height: 350px;
|
||||
}
|
||||
|
||||
.loading {
|
||||
display: inline-block;
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
border: 3px solid #d2d0d0;;
|
||||
border-radius: 50%;
|
||||
border-top-color: #383838;
|
||||
animation: spin 1s ease-in-out infinite;
|
||||
-webkit-animation: spin 1s ease-in-out infinite;
|
||||
}
|
||||
|
||||
@keyframes spin {
|
||||
to { -webkit-transform: rotate(360deg); }
|
||||
}
|
||||
}
|
100
assets/styles/sections/projects.scss
Normal file
100
assets/styles/sections/projects.scss
Normal file
|
@ -0,0 +1,100 @@
|
|||
.projects-section {
|
||||
.card {
|
||||
.card-header {
|
||||
background-color: get-light-color('bg-card');
|
||||
padding: 0.7rem;
|
||||
padding-bottom: 0rem;
|
||||
text-decoration: none;
|
||||
|
||||
.card-img-xs {
|
||||
margin-right: 0.5rem;
|
||||
}
|
||||
.sub-title {
|
||||
color: get-light-color('muted-text-color');
|
||||
margin-top: 0.4rem;
|
||||
|
||||
span {
|
||||
&:nth-child(1) {
|
||||
float: left;
|
||||
}
|
||||
&:nth-child(2) {
|
||||
float: right;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.card-body {
|
||||
padding: 0.7rem;
|
||||
}
|
||||
}
|
||||
|
||||
.filtr-projects {
|
||||
padding: 1rem !important;
|
||||
}
|
||||
|
||||
.project-card-footer {
|
||||
display: flex;
|
||||
.badge {
|
||||
margin-left: 0.1em;
|
||||
margin-right: 0.1em;
|
||||
}
|
||||
}
|
||||
|
||||
.project-tags-holder {
|
||||
width: 70%;
|
||||
}
|
||||
|
||||
.project-btn-holder {
|
||||
width: 30%;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
flex-direction: column;
|
||||
|
||||
span {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
}
|
||||
|
||||
@include media('<=large') {
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
width: 100%;
|
||||
|
||||
.container {
|
||||
max-width: 100%;
|
||||
}
|
||||
.filtr-projects {
|
||||
padding: 0;
|
||||
}
|
||||
.filtr-item {
|
||||
flex: 50%;
|
||||
padding-left: 0.2rem;
|
||||
padding-right: 0.2rem;
|
||||
max-width: calc(100% / 2 - 0.2rem);
|
||||
}
|
||||
}
|
||||
|
||||
@include media('<=small') {
|
||||
.btn {
|
||||
margin-top: 0.3125rem;
|
||||
}
|
||||
.filtr-item {
|
||||
max-width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
html[data-theme='dark'] {
|
||||
.projects-section {
|
||||
.card {
|
||||
.card-header {
|
||||
background-color: get-dark-color('bg-card');
|
||||
.sub-title {
|
||||
color: get-dark-color('muted-text-color');
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
140
assets/styles/sections/publications.scss
Normal file
140
assets/styles/sections/publications.scss
Normal file
|
@ -0,0 +1,140 @@
|
|||
.publications-section {
|
||||
@include section-title-adjustment();
|
||||
|
||||
.card {
|
||||
background: get-light-color('bg-card');
|
||||
border-top: 2px solid get-light-color('accent-color');
|
||||
|
||||
&:hover,
|
||||
&:focus {
|
||||
border-top: 2px solid get-light-color('accent-color');
|
||||
}
|
||||
|
||||
.card-header {
|
||||
background: none;
|
||||
border: none;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.sub-title {
|
||||
color: get-light-color('muted-text-color');
|
||||
margin-top: 0.4rem;
|
||||
|
||||
span:nth-child(2) {
|
||||
float: right !important;
|
||||
}
|
||||
}
|
||||
|
||||
a[href] {
|
||||
text-decoration: underline; /* Underline only when href is present */
|
||||
}
|
||||
|
||||
a:not([href]) {
|
||||
text-decoration: none; /* No underline when href is absent */
|
||||
}
|
||||
}
|
||||
|
||||
.card-body {
|
||||
padding: 0;
|
||||
padding-left: 1rem;
|
||||
padding-right: 1rem;
|
||||
}
|
||||
|
||||
.card-footer {
|
||||
background: get-light-color('bg-card');
|
||||
border: none;
|
||||
padding: 0;
|
||||
padding-left: 1rem;
|
||||
padding-right: 1rem;
|
||||
padding-bottom: 0.3rem;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
}
|
||||
|
||||
.filtr-publications {
|
||||
padding: 1rem !important;
|
||||
}
|
||||
|
||||
.btn-group {
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
@include media('<=large') {
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
width: 100%;
|
||||
|
||||
.container {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.filtr-publications {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.pub-filtr-item {
|
||||
padding-left: 0.2rem;
|
||||
padding-right: 0.2rem;
|
||||
}
|
||||
}
|
||||
|
||||
@include media('<=medium') {
|
||||
.pub-filtr-item {
|
||||
flex: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
@include media('<=small') {
|
||||
.pub-filtr-item {
|
||||
flex: 100%;
|
||||
max-width: 100%;
|
||||
}
|
||||
.details-btn {
|
||||
.btn {
|
||||
margin-top: 0.5rem;
|
||||
margin-left: auto;
|
||||
}
|
||||
}
|
||||
|
||||
.card {
|
||||
.card-footer {
|
||||
padding-left: 0.5rem;
|
||||
|
||||
.tags {
|
||||
flex: 100%;
|
||||
max-width: 100%;
|
||||
|
||||
.btn {
|
||||
margin-top: 0.2rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
html[data-theme='dark'] {
|
||||
.publications-section {
|
||||
.card {
|
||||
background: get-dark-color('bg-card');
|
||||
border-top: 2px solid get-dark-color('accent-color');
|
||||
|
||||
&:hover,
|
||||
&:focus {
|
||||
border-top: 2px solid get-dark-color('accent-color');
|
||||
}
|
||||
|
||||
.card-header {
|
||||
.sub-title {
|
||||
color: get-dark-color('muted-text-color');
|
||||
}
|
||||
}
|
||||
|
||||
.card-footer {
|
||||
background: get-dark-color('bg-card');
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
32
assets/styles/sections/recent-posts.scss
Normal file
32
assets/styles/sections/recent-posts.scss
Normal file
|
@ -0,0 +1,32 @@
|
|||
.recent-posts-section {
|
||||
.container {
|
||||
padding-top: 1rem;
|
||||
}
|
||||
|
||||
h1 > span {
|
||||
margin-top: -55px; /* Size of fixed header */
|
||||
padding-bottom: 55px;
|
||||
display: block;
|
||||
}
|
||||
|
||||
@include media('<medium') {
|
||||
.post-card {
|
||||
margin-left: 1%;
|
||||
margin-right: 1%;
|
||||
width: 98%;
|
||||
}
|
||||
}
|
||||
@include media('>=medium', '<large') {
|
||||
.container {
|
||||
max-width: 100%;
|
||||
}
|
||||
.post-card {
|
||||
width: calc(100% / 2);
|
||||
}
|
||||
}
|
||||
@include media('>=large') {
|
||||
.post-card {
|
||||
width: calc(100% / 3);
|
||||
}
|
||||
}
|
||||
}
|
46
assets/styles/sections/skills.scss
Normal file
46
assets/styles/sections/skills.scss
Normal file
|
@ -0,0 +1,46 @@
|
|||
.skills-section {
|
||||
.card {
|
||||
margin-top: 0.5rem;
|
||||
margin-bottom: 0.5rem;
|
||||
height: 100%;
|
||||
|
||||
.card-head {
|
||||
background-color: get-light-color('bg-primary') !important;
|
||||
height: -moz-fit-content;
|
||||
height: fit-content;
|
||||
padding: 0.7rem;
|
||||
padding-bottom: 0rem;
|
||||
border-bottom: 0.0625rem solid rgba(get-light-color('accent-color'), 0.4);
|
||||
|
||||
.card-img-xs {
|
||||
margin-right: 0.5rem;
|
||||
margin-bottom: 0.75rem;
|
||||
}
|
||||
}
|
||||
|
||||
.card-body {
|
||||
padding-top: 0.2rem;
|
||||
padding-left: 0.7rem;
|
||||
}
|
||||
}
|
||||
|
||||
@include media('<=medium') {
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
|
||||
.container {
|
||||
max-width: 95%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
html[data-theme='dark'] {
|
||||
.skills-section {
|
||||
.card {
|
||||
.card-head {
|
||||
background-color: get-dark-color('bg-card') !important;
|
||||
border-bottom: 0.0625rem solid rgba(get-dark-color('accent-color'), 0.4);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
122
assets/styles/variables.scss
Normal file
122
assets/styles/variables.scss
Normal file
|
@ -0,0 +1,122 @@
|
|||
@use 'sass:map';
|
||||
|
||||
$breakpoints: (
|
||||
tiny: 320px,
|
||||
small: 640px,
|
||||
medium: 768px,
|
||||
large: 1024px,
|
||||
very-large: 1280px,
|
||||
extra-large: 1536px,
|
||||
ultra-large: 2560px,
|
||||
);
|
||||
|
||||
// Color are chosen from TailwindCSS color scheme
|
||||
// https://tailwindcss.com/docs/customizing-colors
|
||||
|
||||
// transitions
|
||||
$transition-duration: 0.3s;
|
||||
$transition-type: ease-out;
|
||||
|
||||
// borders and shadows
|
||||
$box-shadow: 0px 8px 56px rgba(15, 80, 100, 0.16);
|
||||
|
||||
// themes
|
||||
$themes: (
|
||||
'light': (
|
||||
// cyan 600
|
||||
'accent-color': #0891b2,
|
||||
// cyan 500
|
||||
'hover-over-accent-color': #06b6d4,
|
||||
// zinc 200
|
||||
'text-over-accent-color': #e4e4e7,
|
||||
// slate 50
|
||||
'bg-primary': #f8fafc,
|
||||
// slate 900
|
||||
'bg-primary-inverse': #0f172a,
|
||||
// slate 200
|
||||
'bg-secondary': #e2e8f0,
|
||||
'bg-card': #fff,
|
||||
// slate 800
|
||||
'heading-color': #1e293b,
|
||||
// slate 700
|
||||
'text-color': #334155,
|
||||
// slate 300
|
||||
'inverse-text-color': #cbd5e1,
|
||||
// slate 500
|
||||
'muted-text-color': #64748b,
|
||||
// red 600
|
||||
'inline-code-color': #dc2626,
|
||||
// amber 200
|
||||
'highlight-color': #fde68a,
|
||||
// slate 900
|
||||
'footer-color': #0f172a,
|
||||
),
|
||||
'dark': (
|
||||
// cyan 600
|
||||
'accent-color': #0891b2,
|
||||
// cyan 500
|
||||
'hover-over-accent-color': #06b6d4,
|
||||
// zinc 200
|
||||
'text-over-accent-color': #e4e4e7,
|
||||
// gray-800
|
||||
'bg-primary': #1f2937,
|
||||
// slate 900
|
||||
'bg-primary-inverse': #0f172a,
|
||||
// gray 900
|
||||
'bg-secondary': #111827,
|
||||
// slate 800
|
||||
'bg-card': #1e293b,
|
||||
// slate 100
|
||||
'heading-color': #f1f5f9,
|
||||
// slate 300
|
||||
'text-color': #cbd5e1,
|
||||
// slate 900
|
||||
'inverse-text-color': #0f172a,
|
||||
// slate 500
|
||||
'muted-text-color': #64748b,
|
||||
// red 600
|
||||
'inline-code-color': #dc2626,
|
||||
// amber 200
|
||||
'highlight-color': #fde68a,
|
||||
// slate 900
|
||||
'footer-color': #0f172a,
|
||||
),
|
||||
);
|
||||
|
||||
$brand-colors: (
|
||||
'facebook': #3b5998,
|
||||
'twitter': #1da1f2,
|
||||
'linkedin': #0077b5,
|
||||
'reddit': #ff4500,
|
||||
'tumblr': #35465c,
|
||||
'pocket': #ef4056,
|
||||
'diaspora': #1e1e1e,
|
||||
'whatsapp': #25d366,
|
||||
);
|
||||
|
||||
$alerts: (
|
||||
'success': (
|
||||
// green 100
|
||||
'bg-color': #dcfce7,
|
||||
// green 800
|
||||
'text-color': #166534,
|
||||
),
|
||||
'info': (
|
||||
// sky 100
|
||||
'bg-color': #e0f2fe,
|
||||
// sky 800
|
||||
'text-color': #075985,
|
||||
),
|
||||
'warning': (
|
||||
// yellow 100
|
||||
'bg-color': #fef9c3,
|
||||
// yellow 800
|
||||
'text-color': #854d0e,
|
||||
),
|
||||
'danger': (
|
||||
// red 100
|
||||
'bg-color': #fee2e2,
|
||||
// red 800
|
||||
'text-color': #991b1b,
|
||||
),
|
||||
);
|
|
@ -26,7 +26,7 @@ Search depends on additional output content type of JSON in config.toml
|
|||
home = ["HTML", "JSON"]
|
||||
\```
|
||||
|
||||
## Searching additional fileds
|
||||
## Searching additional fields
|
||||
|
||||
To search additional fields defined in front matter, you must add it in 2 places.
|
||||
|
||||
|
|
|
@ -26,7 +26,7 @@ Search depends on additional output content type of JSON in config.toml
|
|||
home = ["HTML", "JSON"]
|
||||
\```
|
||||
|
||||
## Searching additional fileds
|
||||
## Searching additional fields
|
||||
|
||||
To search additional fields defined in front matter, you must add it in 2 places.
|
||||
|
||||
|
|
|
@ -26,7 +26,7 @@ Search depends on additional output content type of JSON in config.toml
|
|||
home = ["HTML", "JSON"]
|
||||
\```
|
||||
|
||||
## Searching additional fileds
|
||||
## Searching additional fields
|
||||
|
||||
To search additional fields defined in front matter, you must add it in 2 places.
|
||||
|
||||
|
|
|
@ -26,7 +26,7 @@ Search depends on additional output content type of JSON in config.toml
|
|||
home = ["HTML", "JSON"]
|
||||
\```
|
||||
|
||||
## Searching additional fileds
|
||||
## Searching additional fields
|
||||
|
||||
To search additional fields defined in front matter, you must add it in 2 places.
|
||||
|
||||
|
|
|
@ -26,7 +26,7 @@ Search depends on additional output content type of JSON in config.toml
|
|||
home = ["HTML", "JSON"]
|
||||
\```
|
||||
|
||||
## Searching additional fileds
|
||||
## Searching additional fields
|
||||
|
||||
To search additional fields defined in front matter, you must add it in 2 places.
|
||||
|
||||
|
|
|
@ -26,7 +26,7 @@ Search depends on additional output content type of JSON in config.toml
|
|||
home = ["HTML", "JSON"]
|
||||
\```
|
||||
|
||||
## Searching additional fileds
|
||||
## Searching additional fields
|
||||
|
||||
To search additional fields defined in front matter, you must add it in 2 places.
|
||||
|
||||
|
|
|
@ -26,7 +26,7 @@ Search depends on additional output content type of JSON in config.toml
|
|||
home = ["HTML", "JSON"]
|
||||
\```
|
||||
|
||||
## Searching additional fileds
|
||||
## Searching additional fields
|
||||
|
||||
To search additional fields defined in front matter, you must add it in 2 places.
|
||||
|
||||
|
|
|
@ -26,7 +26,7 @@ Search depends on additional output content type of JSON in config.toml
|
|||
home = ["HTML", "JSON"]
|
||||
\```
|
||||
|
||||
## Searching additional fileds
|
||||
## Searching additional fields
|
||||
|
||||
To search additional fields defined in front matter, you must add it in 2 places.
|
||||
|
||||
|
|
|
@ -26,7 +26,7 @@ Search depends on additional output content type of JSON in config.toml
|
|||
home = ["HTML", "JSON"]
|
||||
\```
|
||||
|
||||
## Searching additional fileds
|
||||
## Searching additional fields
|
||||
|
||||
To search additional fields defined in front matter, you must add it in 2 places.
|
||||
|
||||
|
|
|
@ -24,7 +24,7 @@ Search depends on additional output content type of JSON in config.toml
|
|||
home = ["HTML", "JSON"]
|
||||
\```
|
||||
|
||||
## Searching additional fileds
|
||||
## Searching additional fields
|
||||
|
||||
To search additional fields defined in front matter, you must add it in 2 places.
|
||||
|
||||
|
|
|
@ -26,7 +26,7 @@ Search depends on additional output content type of JSON in config.toml
|
|||
home = ["HTML", "JSON"]
|
||||
\```
|
||||
|
||||
## Searching additional fileds
|
||||
## Searching additional fields
|
||||
|
||||
To search additional fields defined in front matter, you must add it in 2 places.
|
||||
|
||||
|
|
|
@ -26,7 +26,7 @@ Search depends on additional output content type of JSON in config.toml
|
|||
home = ["HTML", "JSON"]
|
||||
\```
|
||||
|
||||
## Searching additional fileds
|
||||
## Searching additional fields
|
||||
|
||||
To search additional fields defined in front matter, you must add it in 2 places.
|
||||
|
||||
|
|
3
content/posts/_index.md
Normal file
3
content/posts/_index.md
Normal file
|
@ -0,0 +1,3 @@
|
|||
---
|
||||
title: Posts
|
||||
---
|
|
@ -26,7 +26,7 @@ Search depends on additional output content type of JSON in config.toml
|
|||
home = ["HTML", "JSON"]
|
||||
\```
|
||||
|
||||
## Searching additional fileds
|
||||
## Searching additional fields
|
||||
|
||||
To search additional fields defined in front matter, you must add it in 2 places.
|
||||
|
|
@ -26,7 +26,7 @@ Search depends on additional output content type of JSON in config.toml
|
|||
home = ["HTML", "JSON"]
|
||||
\```
|
||||
|
||||
## Searching additional fileds
|
||||
## Searching additional fields
|
||||
|
||||
To search additional fields defined in front matter, you must add it in 2 places.
|
||||
|
|
@ -1,5 +1,5 @@
|
|||
---
|
||||
title: "Search Results"
|
||||
title: "Suchergebnisse"
|
||||
date: 2010-06-08T08:06:25+06:00
|
||||
weight: 999999
|
||||
sitemap:
|
||||
|
@ -26,7 +26,7 @@ Search depends on additional output content type of JSON in config.toml
|
|||
home = ["HTML", "JSON"]
|
||||
\```
|
||||
|
||||
## Searching additional fileds
|
||||
## Searching additional fields
|
||||
|
||||
To search additional fields defined in front matter, you must add it in 2 places.
|
||||
|
|
@ -26,7 +26,7 @@ Search depends on additional output content type of JSON in config.toml
|
|||
home = ["HTML", "JSON"]
|
||||
\```
|
||||
|
||||
## Searching additional fileds
|
||||
## Searching additional fields
|
||||
|
||||
To search additional fields defined in front matter, you must add it in 2 places.
|
||||
|
|
@ -26,7 +26,7 @@ Search depends on additional output content type of JSON in config.toml
|
|||
home = ["HTML", "JSON"]
|
||||
\```
|
||||
|
||||
## Searching additional fileds
|
||||
## Searching additional fields
|
||||
|
||||
To search additional fields defined in front matter, you must add it in 2 places.
|
||||
|
|
@ -26,7 +26,7 @@ Search depends on additional output content type of JSON in config.toml
|
|||
home = ["HTML", "JSON"]
|
||||
\```
|
||||
|
||||
## Searching additional fileds
|
||||
## Searching additional fields
|
||||
|
||||
To search additional fields defined in front matter, you must add it in 2 places.
|
||||
|
|
@ -26,7 +26,7 @@ Search depends on additional output content type of JSON in config.toml
|
|||
home = ["HTML", "JSON"]
|
||||
\```
|
||||
|
||||
## Searching additional fileds
|
||||
## Searching additional fields
|
||||
|
||||
To search additional fields defined in front matter, you must add it in 2 places.
|
||||
|
|
@ -26,7 +26,7 @@ Search depends on additional output content type of JSON in config.toml
|
|||
home = ["HTML", "JSON"]
|
||||
\```
|
||||
|
||||
## Searching additional fileds
|
||||
## Searching additional fields
|
||||
|
||||
To search additional fields defined in front matter, you must add it in 2 places.
|
||||
|
|
@ -26,7 +26,7 @@ Search depends on additional output content type of JSON in config.toml
|
|||
home = ["HTML", "JSON"]
|
||||
\```
|
||||
|
||||
## Searching additional fileds
|
||||
## Searching additional fields
|
||||
|
||||
To search additional fields defined in front matter, you must add it in 2 places.
|
||||
|
|
@ -26,7 +26,7 @@ Search depends on additional output content type of JSON in config.toml
|
|||
home = ["HTML", "JSON"]
|
||||
\```
|
||||
|
||||
## Searching additional fileds
|
||||
## Searching additional fields
|
||||
|
||||
To search additional fields defined in front matter, you must add it in 2 places.
|
||||
|
|
@ -26,7 +26,7 @@ Search depends on additional output content type of JSON in config.toml
|
|||
home = ["HTML", "JSON"]
|
||||
\```
|
||||
|
||||
## Searching additional fileds
|
||||
## Searching additional fields
|
||||
|
||||
To search additional fields defined in front matter, you must add it in 2 places.
|
||||
|
|
@ -26,7 +26,7 @@ Search depends on additional output content type of JSON in config.toml
|
|||
home = ["HTML", "JSON"]
|
||||
\```
|
||||
|
||||
## Searching additional fileds
|
||||
## Searching additional fields
|
||||
|
||||
To search additional fields defined in front matter, you must add it in 2 places.
|
||||
|
25
data/toha/styles.yml
Normal file
25
data/toha/styles.yml
Normal file
|
@ -0,0 +1,25 @@
|
|||
flags:
|
||||
styles:
|
||||
- flag-icons/css/flag-icons
|
||||
|
||||
videoplayer:
|
||||
services:
|
||||
plyr:
|
||||
styles:
|
||||
- plyr/dist/plyr
|
||||
|
||||
syntaxhighlight:
|
||||
services:
|
||||
hljs:
|
||||
styles:
|
||||
- highlight.js/scss/atom-one-dark
|
||||
|
||||
math:
|
||||
services:
|
||||
katex:
|
||||
styles:
|
||||
- katex/dist/katex
|
||||
|
||||
embedpdf:
|
||||
styles:
|
||||
- ./sections/pdf-viewer
|
|
@ -1,209 +0,0 @@
|
|||
|
||||
baseURL: http://example.org/
|
||||
languageCode: en-us
|
||||
title: Example Site
|
||||
|
||||
module:
|
||||
imports:
|
||||
- path: github.com/hugo-toha/hugo-toha.github.io
|
||||
disable: false
|
||||
mounts:
|
||||
- source: content
|
||||
target: content
|
||||
- source: layouts
|
||||
target: layouts
|
||||
- source: data
|
||||
target: data
|
||||
- source: assets
|
||||
target: assets
|
||||
- source: static
|
||||
target: static
|
||||
- path: github.com/hugo-toha/toha/v4
|
||||
|
||||
# Manage languages
|
||||
# For any more details, you can check the official documentation: https://gohugo.io/content-management/multilingual/
|
||||
languages:
|
||||
en:
|
||||
languageName: English
|
||||
weight: 1
|
||||
bn:
|
||||
languageName: বাংলা
|
||||
weight: 3
|
||||
|
||||
# Force a locale to be use, really useful to develop the application ! Should be commented in production, the "weight" should rocks.
|
||||
# DefaultContentLanguage: bn
|
||||
|
||||
# Allow raw html in markdown file
|
||||
markup:
|
||||
goldmark:
|
||||
renderer:
|
||||
unsafe: true
|
||||
tableOfContents:
|
||||
startLevel: 2
|
||||
endLevel: 6
|
||||
ordered: false
|
||||
|
||||
# At least HTML and JSON are required for the main HTML content and
|
||||
# client-side JavaScript search
|
||||
outputs:
|
||||
home:
|
||||
- HTML
|
||||
- RSS
|
||||
- JSON
|
||||
|
||||
# Enable global emoji support
|
||||
enableEmoji: true
|
||||
|
||||
# Site parameters
|
||||
params:
|
||||
# Background image of the landing page
|
||||
background: /images/site/background.jpg
|
||||
|
||||
# Provide logos for your site. The inverted logo will be used in the initial
|
||||
# transparent navbar and the main logo will be used in the non-transparent navbar.
|
||||
logo:
|
||||
main: /images/site/main-logo.png
|
||||
inverted: /images/site/inverted-logo.png
|
||||
favicon: /images/site/favicon.png
|
||||
|
||||
# GitHub repo of your site
|
||||
gitRepo: https://github.com/hugo-toha/hugo-toha.github.io
|
||||
# Default branch of your Git repo
|
||||
gitBranch: main
|
||||
|
||||
# Configure the number of section title visible in the top navbar
|
||||
topNavbar:
|
||||
maxVisibleSections: 5
|
||||
|
||||
# Enable dark theme
|
||||
darkMode:
|
||||
provider: darkreader
|
||||
enable: true
|
||||
default: system
|
||||
|
||||
# Configure various features of this theme
|
||||
features:
|
||||
# Enable and configure portfolio
|
||||
portfolio:
|
||||
enable: true
|
||||
# Enable and configure blog posts
|
||||
blog:
|
||||
enable: true
|
||||
# Share post on different social media
|
||||
shareButtons:
|
||||
facebook: true
|
||||
twitter: true
|
||||
linkedin: true
|
||||
reddit: true
|
||||
whatsapp: true
|
||||
email: true
|
||||
# tumblr: true
|
||||
# pocket: true
|
||||
# diaspora: true
|
||||
# mastodon: true
|
||||
|
||||
# Enable & configure "Notes" features
|
||||
notes:
|
||||
enable: true
|
||||
|
||||
# Enable comment feature. There, should be only one of them.
|
||||
comment:
|
||||
enable: false
|
||||
disqus:
|
||||
shortName: toha-example-site
|
||||
# valine:
|
||||
# appId: HTV6askWxVo3vOxlqjjaq2hd-MsYXbMMI
|
||||
# appKey: pVrT3C85KGIuk27t07eh6bUC
|
||||
# avatar: retro
|
||||
# placeholder: Share your thought.
|
||||
# lang: en
|
||||
# recordIP: true
|
||||
# enableQQ: true
|
||||
# utteranc:
|
||||
# repo: github.com/hugo-toha/hugo-toha.github.io
|
||||
# issueTerm: title
|
||||
# theme: github-light
|
||||
# giscus:
|
||||
# repo: your-repo/name
|
||||
# repoID: your-repo-id
|
||||
# category: your-category
|
||||
# categoryID: your-category-id
|
||||
# theme: light
|
||||
# map: url
|
||||
# reaction: 1
|
||||
# metadata: 0
|
||||
# inputPosition: bottom
|
||||
# crossOrigin: anonymous
|
||||
# commento:
|
||||
# serverURL: cdn.commento.io
|
||||
# autoInit: true
|
||||
# hideDeleted: false
|
||||
|
||||
# Enable Analytics
|
||||
analytics:
|
||||
enabled: true
|
||||
# Google Analytics
|
||||
google:
|
||||
id: G-H4LBG7NDFZ
|
||||
# # CounterDev
|
||||
# counterDev:
|
||||
# id: <your counterdev id>
|
||||
# # GoatCounter
|
||||
# goatCounter:
|
||||
# code: <your goat counter code>
|
||||
# # Matomo / Piwik
|
||||
# matomo:
|
||||
# instance: matomo.example.com
|
||||
# siteId: 1 # Or any other number
|
||||
|
||||
# # Enable Support
|
||||
# support:
|
||||
# enabled: true
|
||||
# kofi:
|
||||
# user: hossainemruz
|
||||
# text: Tip Me
|
||||
# textColor: '#f9fafc'
|
||||
# backgroundColor: '#248aaa'
|
||||
|
||||
# specify whether you want to show Table of Contents in reading page
|
||||
enableTOC: true
|
||||
|
||||
# Show tags under the post title
|
||||
enableTags: true
|
||||
|
||||
# Specify whether to show flag in the language selector. Default is true.
|
||||
showFlags: true
|
||||
|
||||
# If you want to use different country flag for a language, specify them here.
|
||||
# flagOverwrites:
|
||||
# - languageCode: en
|
||||
# countryCode: us
|
||||
|
||||
# Provide footer configuration.
|
||||
footer:
|
||||
enable: true
|
||||
# You can provide your custom footer template using this option.
|
||||
# Put your template in "layouts/partials" folder of your repo.
|
||||
template: footer.html
|
||||
# Show/hide navigation in the footer. Default is "true".
|
||||
navigation:
|
||||
enable: true
|
||||
# show custom menus in the footer
|
||||
customMenus: true
|
||||
# Show/hide "Contact Me" section in the footer. Default is "true".
|
||||
contactMe:
|
||||
enable: true
|
||||
# Show/hide credentials section in the footer. Default is "true".
|
||||
credentials:
|
||||
enable: true
|
||||
|
||||
# Show/hide newsletter section in the footer. Default is "true".
|
||||
# Currently, it supports "mailchimp".
|
||||
newsletter:
|
||||
enable: true
|
||||
provider: mailchimp
|
||||
mailchimpURL: https://github.us1.list-manage.com/subscribe/post?u=19de52a4603135aae97163fd8&id=094a24c76e
|
||||
|
||||
# Show/hide disclaimer notice in the footer. Default is "false".
|
||||
disclaimer:
|
||||
enable: true
|
|
@ -1,7 +1,10 @@
|
|||
module github.com/hugo-toha/toha/exampleSite
|
||||
|
||||
go 1.19
|
||||
go 1.21
|
||||
|
||||
require github.com/hugo-toha/hugo-toha.github.io v0.0.0-20221228191121-007f31838bd6 // indirect
|
||||
replace github.com/hugo-toha/toha/v4 => ../
|
||||
|
||||
replace github.com/hugo-toha/toha/v4 => ../../toha
|
||||
require (
|
||||
github.com/hugo-toha/hugo-toha.github.io v0.0.0-20241018183051-dd13c36f46b4 // indirect
|
||||
github.com/hugo-toha/toha/v4 v4.7.0 // indirect
|
||||
)
|
||||
|
|
|
@ -1,2 +1,2 @@
|
|||
github.com/hugo-toha/hugo-toha.github.io v0.0.0-20221228191121-007f31838bd6 h1:TPFhOZAnuH4wjLIdzimswCRa2qCcc1teKVTatADJU2g=
|
||||
github.com/hugo-toha/hugo-toha.github.io v0.0.0-20221228191121-007f31838bd6/go.mod h1:OMMaP9Hh9NsKd41lVIazBQRPa0s6Z57AfJoY3DcCNNY=
|
||||
github.com/hugo-toha/hugo-toha.github.io v0.0.0-20241018183051-dd13c36f46b4 h1:Yc5SJ5NJx1xu3YO2gQZPeADXqhGdJgUGWiDxgEDuUrQ=
|
||||
github.com/hugo-toha/hugo-toha.github.io v0.0.0-20241018183051-dd13c36f46b4/go.mod h1:3N7k1DSQGy5Zn5IVp5nQ3QJ/VWh5dSxXO6stUS7txrg=
|
||||
|
|
335
exampleSite/hugo.yaml
Normal file
335
exampleSite/hugo.yaml
Normal file
|
@ -0,0 +1,335 @@
|
|||
baseURL: http://example.org/
|
||||
languageCode: en-us
|
||||
title: Example Site
|
||||
|
||||
module:
|
||||
imports:
|
||||
- path: github.com/hugo-toha/toha/v4
|
||||
- path: github.com/hugo-toha/hugo-toha.github.io
|
||||
disable: false
|
||||
mounts:
|
||||
- source: content
|
||||
target: content
|
||||
- source: layouts
|
||||
target: layouts
|
||||
- source: data
|
||||
target: data
|
||||
- source: assets
|
||||
target: assets
|
||||
- source: static
|
||||
target: static
|
||||
mounts:
|
||||
- source: static/files
|
||||
target: static/files
|
||||
- source: ./node_modules/flag-icons/flags
|
||||
target: static/flags
|
||||
- source: ./node_modules/@fontsource/mulish/files
|
||||
target: static/files
|
||||
- source: ./node_modules/katex/dist/fonts
|
||||
target: static/fonts
|
||||
|
||||
# Manage languages
|
||||
# For any more details, you can check the official documentation: https://gohugo.io/content-management/multilingual/
|
||||
languages:
|
||||
en:
|
||||
languageCode: en
|
||||
languageName: English
|
||||
title: "John's Blog"
|
||||
weight: 1
|
||||
bn:
|
||||
languageCode: bn
|
||||
languageName: বাংলা
|
||||
title: "জনের ব্লগ"
|
||||
weight: 2
|
||||
|
||||
# default language for the content
|
||||
defaultContentLanguage: en
|
||||
|
||||
# Allow raw html in markdown file
|
||||
markup:
|
||||
goldmark:
|
||||
renderer:
|
||||
unsafe: true
|
||||
tableOfContents:
|
||||
startLevel: 2
|
||||
endLevel: 6
|
||||
ordered: false
|
||||
|
||||
# At least HTML and JSON are required for the main HTML content and
|
||||
# client-side JavaScript search
|
||||
outputs:
|
||||
home:
|
||||
- HTML
|
||||
- RSS
|
||||
- JSON
|
||||
|
||||
# Configure custom path for RSS feed. Default is "index.xml"
|
||||
# Ref: https://gohugo.io/templates/output-formats/
|
||||
outputFormats:
|
||||
rss:
|
||||
baseName: rss # default is index
|
||||
|
||||
# Enable global emoji support
|
||||
enableEmoji: true
|
||||
|
||||
# Site parameters
|
||||
params:
|
||||
# Background image of the landing page
|
||||
background: /images/site/background.jpg
|
||||
|
||||
# Provide logos for your site. The inverted logo will be used in the initial
|
||||
# transparent navbar and the main logo will be used in the non-transparent navbar.
|
||||
logo:
|
||||
main: /images/site/main-logo.png
|
||||
inverted: /images/site/inverted-logo.png
|
||||
favicon: /images/site/favicon.png
|
||||
|
||||
# GitHub repo of your site
|
||||
gitRepo: https://github.com/hugo-toha/hugo-toha.github.io
|
||||
# Default branch of your Git repo
|
||||
gitBranch: main
|
||||
|
||||
# Configure the number of section title visible in the top navbar
|
||||
topNavbar:
|
||||
maxVisibleSections: 5
|
||||
|
||||
# Configure various features of this theme
|
||||
features:
|
||||
|
||||
# Enable dark theme
|
||||
darkMode:
|
||||
|
||||
# [Deprecated] Enable dark theme
|
||||
# This is a deprecated setting, but has not been removed to maintain backward compatibility
|
||||
# If `theme` is set, the `darkMode` setting will be discarded.
|
||||
# darkMode:
|
||||
# enable: true
|
||||
|
||||
# Configure theme color settings
|
||||
theme:
|
||||
enable: true
|
||||
services:
|
||||
light: true # enable light theme. default "true"
|
||||
dark: true # enable dark theme. default "true"
|
||||
default: system # can be either light, dark or system. default "system"
|
||||
|
||||
# Enable and configure portfolio
|
||||
portfolio:
|
||||
enable: true
|
||||
|
||||
# Enable and configure blog posts
|
||||
blog:
|
||||
enable: true
|
||||
showAuthor: true
|
||||
# Share post on different social media
|
||||
shareButtons:
|
||||
facebook: true
|
||||
twitter: true
|
||||
linkedin: true
|
||||
reddit: true
|
||||
whatsapp: true
|
||||
email: true
|
||||
# tumblr: true
|
||||
# pocket: true
|
||||
# diaspora: true
|
||||
# mastodon: true
|
||||
|
||||
# Enable & configure "Notes" features
|
||||
notes:
|
||||
enable: true
|
||||
|
||||
# Enable comment feature. There, should be only one of them.
|
||||
comment:
|
||||
enable: false
|
||||
services:
|
||||
disqus:
|
||||
shortName: toha-example-site
|
||||
# valine:
|
||||
# appId: HTV6askWxVo3vOxlqjjaq2hd-MsYXbMMI
|
||||
# appKey: pVrT3C85KGIuk27t07eh6bUC
|
||||
# avatar: retro
|
||||
# placeholder: Share your thought.
|
||||
# lang: en
|
||||
# recordIP: true
|
||||
# enableQQ: true
|
||||
# utteranc:
|
||||
# repo: github.com/hugo-toha/hugo-toha.github.io
|
||||
# issueTerm: title
|
||||
# theme: github-light
|
||||
# giscus:
|
||||
# repo: your-repo/name
|
||||
# repoID: your-repo-id
|
||||
# category: your-category
|
||||
# categoryID: your-category-id
|
||||
# theme: light
|
||||
# map: url
|
||||
# reaction: 1
|
||||
# metadata: 0
|
||||
# inputPosition: bottom
|
||||
# crossOrigin: anonymous
|
||||
# commento:
|
||||
# serverURL: cdn.commento.io
|
||||
# autoInit: true
|
||||
# hideDeleted: false
|
||||
|
||||
# Enable Analytics
|
||||
analytics:
|
||||
enabled: false
|
||||
services:
|
||||
# cloudflare web analytics
|
||||
# cloudflare:
|
||||
# token: "<token>"
|
||||
# Google Analytics
|
||||
google:
|
||||
id: G-H4LBG7NDFZ
|
||||
# # CounterDev
|
||||
# counterDev:
|
||||
# id: <your counterdev id>
|
||||
# # GoatCounter
|
||||
# goatCounter:
|
||||
# code: <your goat counter code>
|
||||
# # Matomo / Piwik
|
||||
# matomo:
|
||||
# instance: matomo.example.com
|
||||
# siteId: 1 # Or any other number
|
||||
# # Umami
|
||||
# umami:
|
||||
# scheme: https
|
||||
# instance: umami.example.com
|
||||
# id: <your umami site id>
|
||||
# # Statcounter
|
||||
# statcounter:
|
||||
# project: 1234567890
|
||||
# invisible: 1
|
||||
# security: deadbeef
|
||||
# Enable Support
|
||||
support:
|
||||
enable: false
|
||||
services:
|
||||
kofi:
|
||||
user: hossainemruz
|
||||
text: Tip Me
|
||||
textColor: '#f9fafc'
|
||||
backgroundColor: '#248aaa'
|
||||
# buymeacoffee:
|
||||
# user: <your buymeacoffee.com user>
|
||||
# text: Support me on Buy me a coffee!
|
||||
# info: Buy me a coffee!
|
||||
# color: '#FFDD00'
|
||||
|
||||
# specify whether you want to show Table of Contents in reading page
|
||||
toc:
|
||||
enable: true
|
||||
|
||||
# Show tags under the post title
|
||||
tags:
|
||||
enable: true
|
||||
on_card: true # enables tags in post cards
|
||||
|
||||
# Specify whether to show flag in the language selector. Default is true.
|
||||
flags:
|
||||
enable: true
|
||||
# # If you want to use different country flag for a language, specify them here.
|
||||
# flagOverwrites:
|
||||
# - languageCode: en
|
||||
# countryCode: us
|
||||
|
||||
# Enable this to use `embed-pdf` shortcode.
|
||||
embedpdf:
|
||||
enable: false
|
||||
|
||||
# Enable this to create flowcharts using shortcodes.
|
||||
flowchart:
|
||||
enable: false
|
||||
services:
|
||||
# Uncomment for `mermaid` shortcode.
|
||||
mermaid:
|
||||
# For config options, see: https://mermaid-js.github.io/mermaid/#/Setup?id=configuration
|
||||
# theme: dark
|
||||
|
||||
# Enable this to create mathematic expressions using `$$` blocks
|
||||
math:
|
||||
enable: true
|
||||
services:
|
||||
# https://katex.org/docs/autorender.html#api for more configurations
|
||||
katex:
|
||||
delimiters:
|
||||
- left: $$
|
||||
right: $$
|
||||
display: true
|
||||
- left: \\[
|
||||
right: \\]
|
||||
display: true
|
||||
- left: $
|
||||
right: $
|
||||
display: false
|
||||
- left: \\(
|
||||
right: \\)
|
||||
display: false
|
||||
|
||||
# Enable to use custom syntax highlight
|
||||
# Please note, Hugo comes with it's own html based syntax highlighter.
|
||||
# Your code block will still be syntax highlighted by hugo.
|
||||
# For more details: https://gohugo.io/content-management/syntax-highlighting/
|
||||
# To disable Hugo's builtin syntax highlight,
|
||||
# see: https://gohugo.io/getting-started/configuration-markup#highlight
|
||||
# ```
|
||||
# # config.yaml
|
||||
# markup:
|
||||
# # this disables hugo's syntax highlighting.
|
||||
# codeFences: false
|
||||
# ```
|
||||
syntaxHighlight:
|
||||
enable: true
|
||||
services:
|
||||
hljs:
|
||||
# see: https://highlightjs.readthedocs.io/en/latest/api.html#configure
|
||||
noHighlightRe: /^no-highlight$/i
|
||||
|
||||
# Enable to use `video-player` shortcode
|
||||
videoPlayer:
|
||||
enable: false
|
||||
services:
|
||||
# convert .js-player class into video player via https://plyr.io/
|
||||
# Can play HTML5 Video, Audio, Youtube, Vimeo.
|
||||
# For more info on setup: https://github.com/sampotts/plyr#quick-setup
|
||||
plyr:
|
||||
# options doc: https://github.com/sampotts/plyr#options
|
||||
# fullscreen: true
|
||||
|
||||
# Enables copy code button
|
||||
copyCodeButton:
|
||||
enable: true
|
||||
|
||||
# Enable reading time support in post cards and in post pages
|
||||
readingTime:
|
||||
enable: true
|
||||
|
||||
# Provide footer configuration.
|
||||
footer:
|
||||
enable: true
|
||||
# You can provide your custom footer template using this option.
|
||||
# Put your template in "layouts/partials" folder of your repo.
|
||||
template: footer.html
|
||||
# Show/hide navigation in the footer. Default is "true".
|
||||
navigation:
|
||||
enable: true
|
||||
# show custom menus in the footer
|
||||
customMenus: true
|
||||
# Show/hide "Contact Me" section in the footer. Default is "true".
|
||||
contactMe:
|
||||
enable: true
|
||||
# Show/hide credentials section in the footer. Default is "true".
|
||||
credentials:
|
||||
enable: true
|
||||
|
||||
# Show/hide newsletter section in the footer. Default is "true".
|
||||
# Currently, it supports "mailchimp".
|
||||
newsletter:
|
||||
enable: true
|
||||
provider: mailchimp
|
||||
mailchimpURL: https://github.us1.list-manage.com/subscribe/post?u=19de52a4603135aae97163fd8&id=094a24c76e
|
||||
|
||||
# Show/hide disclaimer notice in the footer. Default is "false".
|
||||
disclaimer:
|
||||
enable: true
|
5086
exampleSite/package-lock.json
generated
Normal file
5086
exampleSite/package-lock.json
generated
Normal file
File diff suppressed because it is too large
Load diff
4
exampleSite/package.hugo.json
Normal file
4
exampleSite/package.hugo.json
Normal file
|
@ -0,0 +1,4 @@
|
|||
{
|
||||
"name": "exampleSite",
|
||||
"version": "0.1.0"
|
||||
}
|
63
exampleSite/package.json
Normal file
63
exampleSite/package.json
Normal file
|
@ -0,0 +1,63 @@
|
|||
{
|
||||
"comments": {
|
||||
"dependencies": {},
|
||||
"devDependencies": {
|
||||
"@fontsource/mulish": "github.com/hugo-toha/toha/v4",
|
||||
"@fortawesome/fontawesome-free": "github.com/hugo-toha/toha/v4",
|
||||
"autoprefixer": "github.com/hugo-toha/toha/v4",
|
||||
"bootstrap": "github.com/hugo-toha/toha/v4",
|
||||
"eslint": "github.com/hugo-toha/toha/v4",
|
||||
"eslint-config-prettier": "github.com/hugo-toha/toha/v4",
|
||||
"eslint-config-standard": "github.com/hugo-toha/toha/v4",
|
||||
"eslint-plugin-import": "github.com/hugo-toha/toha/v4",
|
||||
"eslint-plugin-n": "github.com/hugo-toha/toha/v4",
|
||||
"eslint-plugin-no-jquery": "github.com/hugo-toha/toha/v4",
|
||||
"eslint-plugin-promise": "github.com/hugo-toha/toha/v4",
|
||||
"feather-icons": "github.com/hugo-toha/toha/v4",
|
||||
"filterizr": "github.com/hugo-toha/toha/v4",
|
||||
"flag-icons": "github.com/hugo-toha/toha/v4",
|
||||
"fuse.js": "github.com/hugo-toha/toha/v4",
|
||||
"highlight.js": "github.com/hugo-toha/toha/v4",
|
||||
"imagesloaded": "github.com/hugo-toha/toha/v4",
|
||||
"include-media": "github.com/hugo-toha/toha/v4",
|
||||
"ityped": "github.com/hugo-toha/toha/v4",
|
||||
"katex": "github.com/hugo-toha/toha/v4",
|
||||
"mark.js": "github.com/hugo-toha/toha/v4",
|
||||
"mermaid": "github.com/hugo-toha/toha/v4",
|
||||
"plyr": "github.com/hugo-toha/toha/v4",
|
||||
"popper.js": "github.com/hugo-toha/toha/v4",
|
||||
"postcss": "github.com/hugo-toha/toha/v4",
|
||||
"postcss-cli": "github.com/hugo-toha/toha/v4"
|
||||
}
|
||||
},
|
||||
"devDependencies": {
|
||||
"@fontsource/mulish": "4.5.13",
|
||||
"@fortawesome/fontawesome-free": "^6.6.0",
|
||||
"autoprefixer": "^10.4.20",
|
||||
"bootstrap": "^5.3.3",
|
||||
"eslint": "^8.31.0",
|
||||
"eslint-config-prettier": "^8.6.0",
|
||||
"eslint-config-standard": "^17.0.0",
|
||||
"eslint-plugin-import": "^2.26.0",
|
||||
"eslint-plugin-n": "^15.6.0",
|
||||
"eslint-plugin-no-jquery": "^2.7.0",
|
||||
"eslint-plugin-promise": "^6.1.1",
|
||||
"feather-icons": "^4.29.1",
|
||||
"filterizr": "^2.2.4",
|
||||
"flag-icons": "^7.2.3",
|
||||
"fuse.js": "^6.6.2",
|
||||
"highlight.js": "^11.6.0",
|
||||
"imagesloaded": "^5.0.0",
|
||||
"include-media": "^1.4.10",
|
||||
"ityped": "^1.0.3",
|
||||
"katex": "^0.16.11",
|
||||
"mark.js": "^8.11.1",
|
||||
"mermaid": "^11.6.0",
|
||||
"plyr": "^3.7.2",
|
||||
"popper.js": "^1.16.1",
|
||||
"postcss": "^8.4.41",
|
||||
"postcss-cli": "^11.0.0"
|
||||
},
|
||||
"name": "exampleSite",
|
||||
"version": "0.1.0"
|
||||
}
|
2
go.mod
2
go.mod
|
@ -1,3 +1,3 @@
|
|||
module github.com/hugo-toha/toha/v4
|
||||
|
||||
go 1.19
|
||||
go 1.21
|
||||
|
|
2
go.sum
Normal file
2
go.sum
Normal file
|
@ -0,0 +1,2 @@
|
|||
github.com/hugo-toha/hugo-toha.github.io v0.0.0-20240730212302-83b19f7bd3b7 h1:RRonNzaf6/Ou9PqfXeKiRywkd+9KY7SVgfGBQXqXshM=
|
||||
github.com/hugo-toha/hugo-toha.github.io v0.0.0-20240730212302-83b19f7bd3b7/go.mod h1:yWw1t3trnfzv4t1lA9zh5pSsI0+kqqyg58ir8/kt6zk=
|
25
hugo.yaml
Normal file
25
hugo.yaml
Normal file
|
@ -0,0 +1,25 @@
|
|||
module:
|
||||
hugoVersion:
|
||||
min: "0.146.0"
|
||||
extended: true
|
||||
mounts:
|
||||
- source: content
|
||||
target: content
|
||||
- source: static
|
||||
target: static
|
||||
- source: layouts
|
||||
target: layouts
|
||||
- source: data
|
||||
target: data
|
||||
- source: assets
|
||||
target: assets
|
||||
- source: i18n
|
||||
target: i18n
|
||||
- source: archetypes
|
||||
target: archetypes
|
||||
- source: ../../node_modules/flag-icons/flags
|
||||
target: static/flags
|
||||
- source: ../../node_modules/@fontsource/mulish/files
|
||||
target: static/files
|
||||
- source: ../../node_modules/katex/dist/fonts
|
||||
target: static/fonts
|
|
@ -124,3 +124,7 @@ other = "Avís de Responsabilitat"
|
|||
|
||||
[search]
|
||||
other = "Cerca"
|
||||
|
||||
[minute]
|
||||
one = "minut"
|
||||
other = "minuts"
|
130
i18n/az.toml
Normal file
130
i18n/az.toml
Normal file
|
@ -0,0 +1,130 @@
|
|||
# More documentation here: https://github.com/nicksnyder/go-i18n
|
||||
[home]
|
||||
other = "Əsas Səhifə"
|
||||
|
||||
[posts]
|
||||
other = "Yazılar"
|
||||
|
||||
[toc_heading]
|
||||
other = "Məzmun Cədvəli"
|
||||
|
||||
[tags]
|
||||
other = "Etiketlər"
|
||||
|
||||
[categories]
|
||||
other = "Kateqoriyalar"
|
||||
|
||||
[at]
|
||||
other = ","
|
||||
|
||||
[resume]
|
||||
other = "CV"
|
||||
|
||||
[navigation]
|
||||
other = "Menyu"
|
||||
|
||||
[contact_me]
|
||||
other = "Əlaqə:"
|
||||
|
||||
[email]
|
||||
other = "E-Poçt"
|
||||
|
||||
[phone]
|
||||
other = "Telefon"
|
||||
|
||||
[newsletter_text]
|
||||
other = "Yeni məzmunlardan xəbərdar olmaq üçün E-Poçt ünvanınızı daxil edin."
|
||||
|
||||
[newsletter_input_placeholder]
|
||||
other = "E-Poçt ünvanını daxil edin."
|
||||
|
||||
[newsletter_warning]
|
||||
other = "E-Poçt ünvanınızı daxil etsəniz, bu veb saytın xəbər bülletenini almağı qəbul etmiş olursunuz."
|
||||
|
||||
[submit]
|
||||
other = "Təsdiqlə"
|
||||
|
||||
[hugoAttributionText]
|
||||
other = ""
|
||||
|
||||
[prev]
|
||||
other = "Əvvəlki"
|
||||
|
||||
[next]
|
||||
other = "Sonraki"
|
||||
|
||||
[share_on]
|
||||
other = "Paylaş"
|
||||
|
||||
[improve_this_page]
|
||||
other = "Bu səhifəyə töhfə verin"
|
||||
|
||||
[out_of]
|
||||
other = "/"
|
||||
|
||||
[publications]
|
||||
other = "Akademik Nəşrlər"
|
||||
|
||||
[taken_courses]
|
||||
other = "Keçirilmiş Kurslar"
|
||||
|
||||
[course_name]
|
||||
other = "Kursun Adı"
|
||||
|
||||
[total_credit]
|
||||
other = "Ümumi Kredit"
|
||||
|
||||
[obtained_credit]
|
||||
other = "Qazandırılmış Kredit"
|
||||
|
||||
[extracurricular_activities]
|
||||
other = "Kursdankənar Fəaliyyətlər"
|
||||
|
||||
[show_more]
|
||||
other = "Daha Çox Göstər"
|
||||
|
||||
[show_less]
|
||||
other = "Gizlət"
|
||||
|
||||
[responsibilities]
|
||||
other = "Məsuliyyətlər:"
|
||||
|
||||
[present]
|
||||
other = "Hal-hazırda"
|
||||
|
||||
[comments_javascript]
|
||||
other = "Görmək üçün xahiş edirəm JavaScript-i aktiv edin"
|
||||
|
||||
[comments_by]
|
||||
other = "Şərh edən"
|
||||
|
||||
[read]
|
||||
other = "Oxu"
|
||||
|
||||
[project_star]
|
||||
other = "Ulduz"
|
||||
|
||||
[project_details]
|
||||
other = "Təfərrüatlar"
|
||||
|
||||
[err_404]
|
||||
other = "Axtardığınız səhifə tapılmadı."
|
||||
|
||||
[more]
|
||||
other = "Daha Çox"
|
||||
|
||||
[view_certificate]
|
||||
other = "Sertifikatı Görüntülə"
|
||||
|
||||
[notes]
|
||||
other = "Qeydlər"
|
||||
|
||||
[disclaimer_text]
|
||||
other = "Məsuliyyət İnkarı"
|
||||
|
||||
[search]
|
||||
other = "Axtar"
|
||||
|
||||
[minute]
|
||||
one = "dəqiqə"
|
||||
other = "dəqiqə"
|
|
@ -121,3 +121,6 @@ other = "দায় বিজ্ঞপ্তি"
|
|||
|
||||
[search]
|
||||
other = "অনুসন্ধান করুন"
|
||||
|
||||
[minute]
|
||||
other = "মিনিট"
|
||||
|
|
Some files were not shown because too many files have changed in this diff Show more
Loading…
Add table
Add a link
Reference in a new issue