Skip to content

Commit fffc8d0

Browse files
committed
change all color
1 parent 753bda6 commit fffc8d0

22 files changed

Lines changed: 865 additions & 43 deletions

File tree

CLAUDE.md

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
# CLAUDE.md
2+
3+
This file provides guidance to Claude Code (claude.ai/code) when working with code in this repository.
4+
5+
## What this is
6+
7+
The public website for School of Freelancing (https://www.schooloffreelancing.com) — a marketing/training site for a paid Linux freelancing course. Pure static HTML5 + Bootstrap 5 + vanilla JS. There is **no build system, no package manager, no test suite, and no linter** — files are edited directly and served as-is by Apache (this repo lives at the Apache docroot `/var/www/html`).
8+
9+
To preview locally, just open a file in a browser, or serve the directory (e.g. `python3 -m http.server`). Note that `.htaccess` clean-URL rewrites only work under Apache.
10+
11+
## Site structure
12+
13+
- Each page is a folder with an `index.html` (`/about/`, `/faq/`, `/training/`, `/contact/`, `/terms/`, `/privacy/`, `/refund/`, `/testimonials/`, `/training-rules/`, `/tech-support/`, etc.). Clean URLs (`/about/` instead of `/about/index.html`) are enforced by `.htaccess` rewrites, which also 301-redirect legacy flat URLs like `/training.html`.
14+
- Every page carries its own full `<head>` (title, canonical, OG tags) and duplicated nav/footer markup — there is no templating. A change to shared chrome (nav, footer, analytics) must be repeated in every page's `index.html`.
15+
- Shared assets live in `/assets` (`css/style.css`, `js/main.js` — matrix-rain canvas and UI effects, partner logos in `images/`).
16+
- When adding or renaming a page, update `sitemap.xml` and add a redirect in `.htaccess` if an old URL is being replaced.
17+
18+
## Enrollment/verification system — multiple generations coexist
19+
20+
The paid-enrollment flow has been rebuilt several times; older versions are still in the tree. Confirm with the user which one is live before editing:
21+
22+
- `/training/oldenroll/` — oldest, standalone page.
23+
- `/training/enroll/` — EmailJS-based, uses `sof-shared.js`; the verify secret is client-side (HMAC in the browser).
24+
- `/training/enroll1/` — refactored variant (`js/config.js`, `enroll.js`, `verify.js`, `utils.js`) with its own README documenting EmailJS template setup.
25+
- `/training/files/` — newest: `worker.js` + `wrangler.toml` define a **Cloudflare Worker** (`sof-verify-signer`) that holds `VERIFY_SECRET` server-side. Deploy with `wrangler deploy`; set the secret with `wrangler secret put VERIFY_SECRET` (never commit it). Endpoints: `POST /sign`, `GET /verify`, `POST /mark-paid`.
26+
- `/verify/` — the admin-facing verify/invoice page linked from enrollment emails.
27+
28+
How it works (no backend except the Worker): the enrollment form sends emails via EmailJS directly from the browser; the enrollment record is base64-encoded into a verify-link URL and HMAC-signed; the invoice PDF is generated in-browser with jsPDF. The pre-Worker versions ship the signing secret to the browser — comments in those files already document this limitation; don't present client-side signing as tamper-proof.
29+
30+
Config placeholders (EmailJS keys/template IDs, crypto wallet addresses marked `REPLACEME`, `VERIFY_SECRET`) live in `training/enroll1/js/config.js` and `training/enroll/sof-shared.js`.
31+
32+
## CI / GitHub
33+
34+
- `.github/workflows/claude.yml` runs Claude Code on issues/comments mentioning `@claude`; `claude-review.yml` reviews PRs. There is no build/test CI for the site itself.
35+
- Remote: `SchoolOfFreelancing/Linux-Freelancing-Training`, single `main` branch.

about/index.html

Lines changed: 46 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -78,6 +78,52 @@
7878
<link rel="stylesheet" href="/assets/css/style.css">
7979

8080
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.2/css/all.min.css">
81+
<!-- Custom styles for background and text color -->
82+
<style>
83+
:root {
84+
--text-primary: #ffffff;
85+
--text-secondary: #e0e0e0;
86+
--text-muted: #cccccc;
87+
}
88+
body {
89+
background-color: #0024ED !important;
90+
color: white !important;
91+
}
92+
/* Ensure all text elements inherit white color */
93+
body * {
94+
color: inherit;
95+
}
96+
/* Override specific elements that might have hardcoded colors */
97+
.hero-title, .section-title, .section-subtitle, .course-title, .course-desc,
98+
.course-price, .footer-brand p, .footer-links a, .footer-bottom p,
99+
.nav-links a, .btn, .tag, .cta-banner h2, .cta-banner p {
100+
color: white !important;
101+
}
102+
/* Ensure links are visible on blue background */
103+
a {
104+
color: #fff !important;
105+
}
106+
a:hover {
107+
color: #ccc !important;
108+
}
109+
/* Button adjustments for visibility */
110+
.btn-primary {
111+
background-color: white !important;
112+
color: #0024ED !important;
113+
border-color: white !important;
114+
}
115+
.btn-primary:hover {
116+
background-color: #f0f0f0 !important;
117+
}
118+
.btn-outline {
119+
border-color: white !important;
120+
color: white !important;
121+
}
122+
.btn-outline:hover {
123+
background-color: white !important;
124+
color: #0024ED !important;
125+
}
126+
</style>
81127
</head>
82128
<body>
83129

assets/css/style.css

Lines changed: 29 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
/* ============================================================
2-
School of Freelancing — Dark Forest Green Terminal Theme
2+
School of Freelancing — Blue & White Terminal Theme
33
style.css
44
============================================================ */
55

@@ -8,30 +8,30 @@
88

99
/* ---------- CSS Custom Properties ---------- */
1010
:root {
11-
--bg-primary: #0a1a0a;
12-
--bg-secondary: #0d1f0d;
13-
--bg-card: #0f240f;
14-
--bg-glass: rgba(15, 36, 15, 0.85);
15-
--green-bright: #00ff41;
16-
--green-mid: #39d353;
17-
--green-dim: #1a7a1a;
18-
--green-faint: #0d3d0d;
19-
--green-glow: rgba(0, 255, 65, 0.4);
20-
--green-glow2: rgba(0, 255, 65, 0.15);
21-
--text-primary: #d4ffd4;
22-
--text-secondary:#8fbc8f;
23-
--text-muted: #4a7a4a;
11+
--bg-primary: #0024ED;
12+
--bg-secondary: #001db8;
13+
--bg-card: #0019a3;
14+
--bg-glass: rgba(0, 25, 163, 0.85);
15+
--green-bright: #ffffff;
16+
--green-mid: #dbe2ff;
17+
--green-dim: #9dabf0;
18+
--green-faint: #1a35d6;
19+
--green-glow: rgba(255, 255, 255, 0.4);
20+
--green-glow2: rgba(255, 255, 255, 0.15);
21+
--text-primary: #ffffff;
22+
--text-secondary:#e0e0e0;
23+
--text-muted: #cccccc;
2424
--accent-amber: #ffb700;
2525
--accent-cyan: #00ffe1;
26-
--border-color: rgba(0, 255, 65, 0.25);
27-
--border-active: rgba(0, 255, 65, 0.7);
26+
--border-color: rgba(255, 255, 255, 0.25);
27+
--border-active: rgba(255, 255, 255, 0.7);
2828
--font-mono: 'Share Tech Mono', 'Courier New', monospace;
2929
--font-display: 'Orbitron', monospace;
3030
--font-code: 'Source Code Pro', monospace;
3131
--radius-sm: 4px;
3232
--radius-md: 8px;
3333
--radius-lg: 16px;
34-
--shadow-glow: 0 0 20px rgba(0, 255, 65, 0.3), 0 0 60px rgba(0, 255, 65, 0.1);
34+
--shadow-glow: 0 0 20px rgba(255, 255, 255, 0.3), 0 0 60px rgba(255, 255, 255, 0.1);
3535
--shadow-card: 0 4px 30px rgba(0, 0, 0, 0.5);
3636
--transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
3737
}
@@ -63,8 +63,8 @@ body::before {
6363
0deg,
6464
transparent,
6565
transparent 2px,
66-
rgba(0, 255, 65, 0.015) 2px,
67-
rgba(0, 255, 65, 0.015) 4px
66+
rgba(255, 255, 255, 0.015) 2px,
67+
rgba(255, 255, 255, 0.015) 4px
6868
);
6969
pointer-events: none;
7070
z-index: 9999;
@@ -296,7 +296,7 @@ img { max-width: 100%; height: auto; display: block; }
296296
position: absolute;
297297
top: -50%; left: -20%;
298298
width: 800px; height: 800px;
299-
background: radial-gradient(circle, rgba(0, 255, 65, 0.06) 0%, transparent 70%);
299+
background: radial-gradient(circle, rgba(255, 255, 255, 0.06) 0%, transparent 70%);
300300
pointer-events: none;
301301
}
302302

@@ -305,7 +305,7 @@ img { max-width: 100%; height: auto; display: block; }
305305
position: absolute;
306306
bottom: -30%; right: -10%;
307307
width: 600px; height: 600px;
308-
background: radial-gradient(circle, rgba(57, 211, 83, 0.04) 0%, transparent 70%);
308+
background: radial-gradient(circle, rgba(255, 255, 255, 0.04) 0%, transparent 70%);
309309
pointer-events: none;
310310
}
311311

@@ -772,7 +772,7 @@ img { max-width: 100%; height: auto; display: block; }
772772
border: 1px solid;
773773
}
774774

775-
.tag-green { color: var(--green-mid); border-color: var(--green-dim); background: rgba(57,211,83,0.08); }
775+
.tag-green { color: var(--green-mid); border-color: var(--green-dim); background: rgba(255, 255, 255,0.08); }
776776
.tag-amber { color: var(--accent-amber); border-color: rgba(255,183,0,0.3); background: rgba(255,183,0,0.08); }
777777
.tag-cyan { color: var(--accent-cyan); border-color: rgba(0,255,225,0.3); background: rgba(0,255,225,0.08); }
778778

@@ -904,7 +904,7 @@ img { max-width: 100%; height: auto; display: block; }
904904
content: '';
905905
position: absolute;
906906
inset: 0;
907-
background: radial-gradient(ellipse at center, rgba(0, 255, 65, 0.07) 0%, transparent 70%);
907+
background: radial-gradient(ellipse at center, rgba(255, 255, 255, 0.07) 0%, transparent 70%);
908908
}
909909

910910
.cta-banner h2 { margin-bottom: 16px; }
@@ -1009,7 +1009,7 @@ img { max-width: 100%; height: auto; display: block; }
10091009
top: 50%; left: 50%;
10101010
transform: translate(-50%, -50%);
10111011
width: 600px; height: 400px;
1012-
background: radial-gradient(ellipse, rgba(0,255,65,0.06) 0%, transparent 70%);
1012+
background: radial-gradient(ellipse, rgba(255, 255, 255,0.06) 0%, transparent 70%);
10131013
pointer-events: none;
10141014
}
10151015

@@ -1335,7 +1335,7 @@ img { max-width: 100%; height: auto; display: block; }
13351335
padding: 8px 0;
13361336
font-size: 0.85rem;
13371337
color: var(--text-secondary);
1338-
border-bottom: 1px solid rgba(0,255,65,0.07);
1338+
border-bottom: 1px solid rgba(255, 255, 255,0.07);
13391339
transition: var(--transition);
13401340
}
13411341

@@ -1369,7 +1369,7 @@ img { max-width: 100%; height: auto; display: block; }
13691369
font-size: 0.82rem;
13701370
color: var(--text-secondary);
13711371
padding: 8px 0;
1372-
border-bottom: 1px solid rgba(0,255,65,0.07);
1372+
border-bottom: 1px solid rgba(255, 255, 255,0.07);
13731373
transition: var(--transition);
13741374
}
13751375

@@ -1653,7 +1653,7 @@ img { max-width: 100%; height: auto; display: block; }
16531653
display: flex;
16541654
gap: 12px;
16551655
align-items: flex-start;
1656-
background: rgba(0, 255, 65, 0.07);
1656+
background: rgba(255, 255, 255, 0.07);
16571657
border: 1px solid var(--green-dim);
16581658
border-radius: var(--radius-md);
16591659
padding: 16px 20px;
@@ -1859,8 +1859,8 @@ img { max-width: 100%; height: auto; display: block; }
18591859
}
18601860

18611861
@keyframes pulse-glow {
1862-
0%, 100% { box-shadow: 0 0 20px rgba(0,255,65,0.3); }
1863-
50% { box-shadow: 0 0 40px rgba(0,255,65,0.6); }
1862+
0%, 100% { box-shadow: 0 0 20px rgba(255, 255, 255,0.3); }
1863+
50% { box-shadow: 0 0 40px rgba(255, 255, 255,0.6); }
18641864
}
18651865

18661866
@keyframes float {

assets/js/main.js

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -19,9 +19,9 @@ function initMatrix() {
1919
const drops = Array(columns).fill(1);
2020

2121
function draw() {
22-
ctx.fillStyle = 'rgba(10, 12, 61, 0.05)';
22+
ctx.fillStyle = 'rgba(0, 36, 237, 0.05)';
2323
ctx.fillRect(0, 0, canvas.width, canvas.height);
24-
ctx.fillStyle = '#0024ed';
24+
ctx.fillStyle = '#ffffff';
2525
ctx.font = fontSize + 'px Share Tech Mono, monospace';
2626

2727
for (let i = 0; i < drops.length; i++) {
@@ -274,9 +274,9 @@ function initBackToTop() {
274274
btn.setAttribute('aria-label', 'Back to top');
275275
btn.style.cssText = `
276276
position:fixed; bottom:28px; right:28px; width:44px; height:44px;
277-
background:#0024ed; color:#000a3d; border:none; border-radius:4px;
277+
background:#ffffff; color:#0024ed; border:none; border-radius:4px;
278278
font-size:1.2rem; cursor:pointer; z-index:999;
279-
box-shadow:0 0 15px rgba(0,36,237,0.4);
279+
box-shadow:0 0 15px rgba(255,255,255,0.4);
280280
transition:all 0.3s ease; opacity:0; transform:translateY(10px);
281281
font-family:monospace; font-weight:bold;
282282
`;
@@ -323,9 +323,9 @@ function initCookieNotice() {
323323
font-size:0.82rem; color:#8fa3ff; flex-wrap:wrap;
324324
`;
325325
notice.innerHTML = `
326-
<span>🍪 We use cookies to enhance your learning experience. By continuing, you agree to our <a href="#" style="color:#0024ed">Cookie Policy</a>.</span>
326+
<span>🍪 We use cookies to enhance your learning experience. By continuing, you agree to our <a href="#" style="color:#ffffff">Cookie Policy</a>.</span>
327327
<button onclick="document.getElementById('cookie-notice').remove();localStorage.setItem('cookie-ok','1')"
328-
style="background:#0024ed;color:#000a3d;border:none;padding:8px 20px;border-radius:4px;cursor:pointer;font-family:inherit;font-size:0.8rem;font-weight:600;flex-shrink:0">
328+
style="background:#ffffff;color:#0024ed;border:none;padding:8px 20px;border-radius:4px;cursor:pointer;font-family:inherit;font-size:0.8rem;font-weight:600;flex-shrink:0">
329329
Accept
330330
</button>`;
331331
document.body.appendChild(notice);

contact/index.html

Lines changed: 46 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -78,6 +78,52 @@
7878
<link rel="stylesheet" href="/assets/css/style.css">
7979

8080
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.2/css/all.min.css">
81+
<!-- Custom styles for background and text color -->
82+
<style>
83+
:root {
84+
--text-primary: #ffffff;
85+
--text-secondary: #e0e0e0;
86+
--text-muted: #cccccc;
87+
}
88+
body {
89+
background-color: #0024ED !important;
90+
color: white !important;
91+
}
92+
/* Ensure all text elements inherit white color */
93+
body * {
94+
color: inherit;
95+
}
96+
/* Override specific elements that might have hardcoded colors */
97+
.hero-title, .section-title, .section-subtitle, .course-title, .course-desc,
98+
.course-price, .footer-brand p, .footer-links a, .footer-bottom p,
99+
.nav-links a, .btn, .tag, .cta-banner h2, .cta-banner p {
100+
color: white !important;
101+
}
102+
/* Ensure links are visible on blue background */
103+
a {
104+
color: #fff !important;
105+
}
106+
a:hover {
107+
color: #ccc !important;
108+
}
109+
/* Button adjustments for visibility */
110+
.btn-primary {
111+
background-color: white !important;
112+
color: #0024ED !important;
113+
border-color: white !important;
114+
}
115+
.btn-primary:hover {
116+
background-color: #f0f0f0 !important;
117+
}
118+
.btn-outline {
119+
border-color: white !important;
120+
color: white !important;
121+
}
122+
.btn-outline:hover {
123+
background-color: white !important;
124+
color: #0024ED !important;
125+
}
126+
</style>
81127
</head>
82128
<body>
83129

faq/index.html

Lines changed: 46 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -38,6 +38,52 @@
3838

3939
<link rel="stylesheet" href="/assets/css/style.css" />
4040
<link rel="icon" type="image/svg+xml" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'><rect width='32' height='32' rx='4' fill='%230a1a0a'/><text y='24' x='4' font-size='22' fill='%2300ff41'>$</text></svg>" />
41+
<!-- Custom styles for background and text color -->
42+
<style>
43+
:root {
44+
--text-primary: #ffffff;
45+
--text-secondary: #e0e0e0;
46+
--text-muted: #cccccc;
47+
}
48+
body {
49+
background-color: #0024ED !important;
50+
color: white !important;
51+
}
52+
/* Ensure all text elements inherit white color */
53+
body * {
54+
color: inherit;
55+
}
56+
/* Override specific elements that might have hardcoded colors */
57+
.hero-title, .section-title, .section-subtitle, .course-title, .course-desc,
58+
.course-price, .footer-brand p, .footer-links a, .footer-bottom p,
59+
.nav-links a, .btn, .tag, .cta-banner h2, .cta-banner p {
60+
color: white !important;
61+
}
62+
/* Ensure links are visible on blue background */
63+
a {
64+
color: #fff !important;
65+
}
66+
a:hover {
67+
color: #ccc !important;
68+
}
69+
/* Button adjustments for visibility */
70+
.btn-primary {
71+
background-color: white !important;
72+
color: #0024ED !important;
73+
border-color: white !important;
74+
}
75+
.btn-primary:hover {
76+
background-color: #f0f0f0 !important;
77+
}
78+
.btn-outline {
79+
border-color: white !important;
80+
color: white !important;
81+
}
82+
.btn-outline:hover {
83+
background-color: white !important;
84+
color: #0024ED !important;
85+
}
86+
</style>
4187
</head>
4288
<body>
4389

0 commit comments

Comments
 (0)