epilogue/eplg-cloud
5
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix: new design

Browse source
This commit is contained in:
obvTiger 2025-04-03 17:43:40 +02:00
parent d3d4f61d19
commit 5e7ccb2835
1 changed files with 53 additions and 38 deletions
Download patch file Download diff file Expand all files Collapse all files

91
index.html
View file

@ -6,14 +6,14 @@
<title>eplg.cloud | Modern Cloud Hosting</title>
<style>
:root {
--dark-bg: #121212;
--dark-surface: #1e1e1e;
--dark-border: #2a2a2a;
--dark-accent: #3a3a3a;
--dark-bg: #000000;
--dark-surface: #000000;
--dark-border: #1a1a1a;
--dark-accent: #1a1a1a;
--text-primary: #ffffff;
--text-secondary: #b3b3b3;
--accent-color: #6d5acd;
--accent-light: #8b7ce0;
--text-secondary: #808080;
--accent-color: #ffffff;
--accent-light: #ffffff;
}
* {
@ -42,7 +42,7 @@
linear-gradient(to right, var(--dark-border) 1px, transparent 1px),
linear-gradient(to bottom, var(--dark-border) 1px, transparent 1px);
background-size: 30px 30px;
opacity: 0.2;
opacity: 0.1;
z-index: -1;
pointer-events: none;
}
@ -73,7 +73,7 @@
}
.logo span {
color: var(--accent-color);
color: var(--text-primary);
}
.nav-links {
@ -85,7 +85,9 @@
color: var(--text-secondary);
text-decoration: none;
font-weight: 500;
transition: color 0.2s ease;
transition: all 0.3s ease;
transform: translateY(0);
display: inline-block;
}
.nav-links a:hover {
@ -103,10 +105,10 @@
font-weight: 800;
letter-spacing: -1.5px;
margin-bottom: 1.5rem;
background: linear-gradient(90deg, var(--text-primary), var(--accent-light));
-webkit-background-clip: text;
background-clip: text;
color: transparent;
color: var(--text-primary);
background: none;
-webkit-background-clip: unset;
background-clip: unset;
}
.hero p {
@ -130,31 +132,41 @@
font-size: 1rem;
font-weight: 600;
text-decoration: none;
border-radius: 8px;
transition: all 0.2s ease;
}
.button-primary {
background-color: var(--accent-color);
color: white;
border-radius: 0;
transition: background-color 0.3s ease;
position: relative;
border: none;
}
.button-primary {
background-color: var(--text-primary);
color: var(--dark-bg);
box-shadow: 0 4px 0 rgba(128, 128, 128, 1);
}
.button-primary:hover {
background-color: var(--accent-light);
transform: translateY(-2px);
box-shadow: 0 8px 15px rgba(109, 90, 205, 0.2);
background-color: var(--text-secondary);
}
.button-primary:active {
background-color: var(--text-secondary);
}
.button-secondary {
background-color: transparent;
background-color: #333333;
color: var(--text-primary);
border: 1px solid var(--dark-border);
border: none;
box-shadow: 0 4px 0 rgba(128, 128, 128, 0.5);
}
.button-secondary:hover {
border-color: var(--text-secondary);
transform: translateY(-2px);
background-color: #1a1a1a;
color: var(--text-primary);
}
.button-secondary:active {
background-color: #1a1a1a;
color: var(--text-primary);
}
.features {
@ -179,13 +191,12 @@
.feature-card {
background-color: var(--dark-surface);
border: 1px solid var(--dark-border);
border-radius: 12px;
padding: 2rem;
transition: transform 0.3s ease, border-color 0.3s ease;
transform: translateY(0);
}
.feature-card:hover {
transform: translateY(-5px);
border-color: var(--dark-accent);
}
@ -231,22 +242,21 @@
.pricing-card {
background-color: var(--dark-surface);
border: 1px solid var(--dark-border);
border-radius: 12px;
padding: 2.5rem;
text-align: center;
transition: transform 0.3s ease, border-color 0.3s ease;
display: flex;
flex-direction: column;
min-height: 600px;
transform: translateY(0);
}
.pricing-card:hover {
transform: translateY(-5px);
border-color: var(--dark-accent);
}
.pricing-card.featured {
border-color: var(--accent-color);
border-color: var(--text-primary);
position: relative;
overflow: hidden;
}
@ -256,8 +266,8 @@
position: absolute;
top: 1rem;
right: -2rem;
background-color: var(--accent-color);
color: white;
background-color: var(--text-primary);
color: var(--dark-bg);
padding: 0.25rem 2rem;
font-size: 0.75rem;
font-weight: 600;
@ -307,7 +317,7 @@
.pricing-features li::before {
content: "✓";
color: var(--accent-color);
color: var(--text-primary);
margin-right: 0.5rem;
font-weight: bold;
}
@ -415,15 +425,20 @@
.stat-item {
background-color: var(--dark-surface);
border: 1px solid var(--dark-border);
border-radius: 12px;
padding: 1.5rem;
text-align: center;
transition: transform 0.3s ease, border-color 0.3s ease;
transform: translateY(0);
}
.stat-item:hover {
border-color: var(--dark-accent);
}
.stat-number {
font-size: 2.5rem;
font-weight: 700;
color: var(--accent-color);
color: var(--text-primary);
margin-bottom: 0.5rem;
}