Skip to content

Commit f435f82

Browse files
committed
Add optimization GH Action
1 parent 8f677c6 commit f435f82

File tree

3 files changed

+79
-3
lines changed

3 files changed

+79
-3
lines changed

.github/workflows/static.yml

Lines changed: 75 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,75 @@
1+
# Simple workflow for deploying static content to GitHub Pages with optimization
2+
name: Deploy static content to Pages
3+
4+
on:
5+
# Runs on pushes targeting the default branch
6+
push:
7+
branches: ['master']
8+
9+
# Allows you to run this workflow manually from the Actions tab
10+
workflow_dispatch:
11+
12+
# Sets permissions of the GITHUB_TOKEN to allow deployment to GitHub Pages
13+
permissions:
14+
contents: read
15+
pages: write
16+
id-token: write
17+
18+
# Allow only one concurrent deployment, skipping runs queued between the run in-progress and latest queued.
19+
# However, do NOT cancel in-progress runs as we want to allow these production deployments to complete.
20+
concurrency:
21+
group: 'pages'
22+
cancel-in-progress: false
23+
24+
jobs:
25+
# Single deploy job since we're just deploying
26+
deploy:
27+
environment:
28+
name: github-pages
29+
url: ${{ steps.deployment.outputs.page_url }}
30+
runs-on: ubuntu-latest
31+
steps:
32+
- name: Checkout
33+
uses: actions/checkout@v4
34+
35+
# Set up Node.js for optimization tools
36+
- name: Set up Node.js
37+
uses: actions/setup-node@v4
38+
with:
39+
node-version: '20'
40+
41+
# Install CLI tools for minification and compression
42+
- name: Install optimization tools
43+
run: npm install -g terser clean-css-cli svgo-cli imagemin-cli imagemin-mozjpeg imagemin-pngquant
44+
45+
# Minify JS files
46+
- name: Minify JS
47+
run: find . -type f -name '*.js' ! -name '*.min.js' -exec terser --compress --mangle -o {} -- {} \;
48+
49+
# Minify CSS files
50+
- name: Minify CSS
51+
run: find . -type f -name '*.css' ! -name '*.min.css' -exec cleancss -o {} {} \;
52+
53+
# Minify SVG files
54+
- name: Minify SVG
55+
run: find . -type f -name '*.svg' -exec svgo --quiet {} \;
56+
57+
# Compress images (jpg, jpeg, png) in-place
58+
- name: Compress Images
59+
run: |
60+
for file in $(find . -type f \( -name "*.jpg" -o -name "*.jpeg" -o -name "*.png" \)); do
61+
imagemin "$file" --plugin=mozjpeg --plugin=pngquant > "$file.tmp" && mv "$file.tmp" "$file"
62+
done
63+
64+
- name: Setup Pages
65+
uses: actions/configure-pages@v5
66+
67+
- name: Upload artifact
68+
uses: actions/upload-pages-artifact@v3
69+
with:
70+
# Upload the entire repository (now optimized)
71+
path: '.'
72+
73+
- name: Deploy to GitHub Pages
74+
id: deployment
75+
uses: actions/deploy-pages@v4

assets/styles/main.css

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@
44
--main-bg-color: #3B4252;
55
--gray-900-color: #4C566A;
66
--gray-800-color: #434C5E;
7+
--gray-700-color: #2b313c;
78
--white-900-color: #ECEFF4;
89
--white-800-color: #D8DEE9;
910
--red-900-color: #BF616A;
@@ -128,7 +129,7 @@ button {
128129
background-color: var(--accent-color);
129130
border: 1px solid var(--blue-800-color);
130131
border-radius: var(--controls-border-radius);
131-
color: var(--gray-800-color);
132+
color: var(--gray-700-color);
132133
cursor: pointer;
133134
font-family: "JetBrains Mono Medium";
134135
}

index.html

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -71,7 +71,7 @@ <h1 class="text-center mb-5">About Me</h1>
7171
<div class="container-fluid">
7272
<div class="row">
7373
<div class="col-12 col-xl-6 programs-i-use d-flex bg-gray-800">
74-
<object data="/assets/images/programs-i-use.svg" type="image/svg+xml" class="m-auto" id="programsIUse">
74+
<object data="/assets/images/programs-i-use.svg" type="image/svg+xml" class="m-auto" id="programsIUse" aria-label="Programs I use">
7575
<img src="/assets/images/programs-i-use.png" alt="My stack" class="m-auto">
7676
</object>
7777
</div>
@@ -149,7 +149,7 @@ <h2 class="mb-0">
149149
<i class="project__winner mb-3">By Yenot Software</i>
150150
<p>An arcade fighting game that lets player fight their desktop icons, turning their desktop into a battlefield!</p>
151151

152-
<iframe class="mt-4" src="https://store.steampowered.com/widget/2381460/?dynamiclink=1&hidebuttons=0" frameborder="0" width="100%" height="190"></iframe>
152+
<iframe class="mt-4" title="Buy The Icon Battles on Steam" src="https://store.steampowered.com/widget/2381460/?dynamiclink=1&hidebuttons=0" frameborder="0" width="100%" height="190"></iframe>
153153
</div>
154154
</div>
155155
</div>

0 commit comments

Comments
 (0)