jukka/konesaliturku.fi
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Switch color theme from blue to purple/violet

Browse Source 
- Primary: #8b5cf6 (violet), light: #a78bfa, dark: #7c3aed
- Accent: #22d3ee (cyan) for contrast
- Background tones shifted to deep purple (#0c0a1d)
- All hardcoded rgba blue values updated to violet
- Differentiates from typical blue hosting/colocation sites

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Jukka Lampikoski
2026-03-09 15:54:09 +02:00
parent 74f28c932c
commit 27189f54e8
1 changed files with 18 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

36
style.css
View File

@@ -6,18 +6,18 @@
}
:root {
--color-bg: #0a1628;
--color-bg-light: #0f1f3d;
--color-bg-card: #132244;
--color-primary: #1a73e8;
--color-primary-light: #4a9af5;
--color-primary-dark: #1557b0;
--color-accent: #00d4aa;
--color-bg: #0c0a1d;
--color-bg-light: #151030;
--color-bg-card: #1a1340;
--color-primary: #8b5cf6;
--color-primary-light: #a78bfa;
--color-primary-dark: #7c3aed;
--color-accent: #22d3ee;
--color-text: #e2e8f0;
--color-text-muted: #94a3b8;
--color-text-heading: #f1f5f9;
--color-border: #1e3a5f;
--color-surface: #162a4a;
--color-border: #2d1f5e;
--color-surface: #1e1545;
--color-white: #ffffff;
--font-family: 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Helvetica Neue', Arial, sans-serif;
--max-width: 1200px;
@@ -174,8 +174,8 @@ a:hover {
right: 0;
bottom: 0;
background:
radial-gradient(ellipse 800px 600px at 20% 50%, rgba(26, 115, 232, 0.08) 0%, transparent 70%),
radial-gradient(ellipse 600px 400px at 80% 30%, rgba(0, 212, 170, 0.05) 0%, transparent 70%);
radial-gradient(ellipse 800px 600px at 20% 50%, rgba(139, 92, 246, 0.08) 0%, transparent 70%),
radial-gradient(ellipse 600px 400px at 80% 30%, rgba(34, 211, 238, 0.05) 0%, transparent 70%);
pointer-events: none;
}
@@ -287,7 +287,7 @@ a:hover {
.hero-price-card-featured {
border-color: var(--color-primary);
background: rgba(26, 115, 232, 0.1);
background: rgba(139, 92, 246, 0.1);
}
.hero-price-badge {
@@ -357,7 +357,7 @@ a:hover {
background: var(--color-primary-dark);
color: var(--color-white);
transform: translateY(-2px);
box-shadow: 0 4px 20px rgba(26, 115, 232, 0.4);
box-shadow: 0 4px 20px rgba(139, 92, 246, 0.4);
}
.btn-secondary {
@@ -436,7 +436,7 @@ a:hover {
.service-card.featured {
border-color: var(--color-primary);
background: linear-gradient(180deg, rgba(26, 115, 232, 0.08) 0%, var(--color-bg-card) 100%);
background: linear-gradient(180deg, rgba(139, 92, 246, 0.08) 0%, var(--color-bg-card) 100%);
}
.service-badge {
@@ -543,7 +543,7 @@ a:hover {
.pricing-featured {
border-color: var(--color-primary);
background: linear-gradient(180deg, rgba(26, 115, 232, 0.1) 0%, var(--color-bg-card) 100%);
background: linear-gradient(180deg, rgba(139, 92, 246, 0.1) 0%, var(--color-bg-card) 100%);
transform: scale(1.04);
}
@@ -671,7 +671,7 @@ a:hover {
.form-group textarea:focus {
outline: none;
border-color: var(--color-primary);
box-shadow: 0 0 0 3px rgba(26, 115, 232, 0.15);
box-shadow: 0 0 0 3px rgba(139, 92, 246, 0.15);
}
.form-group textarea {
@@ -812,7 +812,7 @@ a:hover {
.green-badge {
display: inline-block;
background: rgba(0, 212, 170, 0.15);
background: rgba(34, 211, 238, 0.15);
color: var(--color-accent);
font-size: 0.85rem;
font-weight: 700;
@@ -821,7 +821,7 @@ a:hover {
text-transform: uppercase;
letter-spacing: 0.05em;
margin-bottom: 20px;
border: 1px solid rgba(0, 212, 170, 0.3);
border: 1px solid rgba(34, 211, 238, 0.3);
}
.green-energy h2 {