2
This commit is contained in:
Flatlogic Bot
parent
0e6648b699
commit
7c5fffbd84
@ -1,13 +1,15 @@
|
||||
:root {
|
||||
--bg: #f7f7f5;
|
||||
--bg: #f5f7fa;
|
||||
--surface: #ffffff;
|
||||
--text: #111111;
|
||||
--muted: #6b6b6b;
|
||||
--border: #e6e6e6;
|
||||
--accent: #111111;
|
||||
--text: #1a1a2e;
|
||||
--muted: #6a6a8a;
|
||||
--border: #e0e6ed;
|
||||
--primary: #4a90e2; /* Blue */
|
||||
--secondary: #8e44ad; /* Purple */
|
||||
--accent: #4a90e2;
|
||||
--radius-sm: 6px;
|
||||
--radius-md: 10px;
|
||||
--shadow-sm: 0 10px 30px rgba(17, 17, 17, 0.08);
|
||||
--shadow-sm: 0 10px 30px rgba(74, 144, 226, 0.1);
|
||||
}
|
||||
|
||||
body {
|
||||
@ -31,15 +33,15 @@ body {
|
||||
|
||||
.navbar .nav-link:hover,
|
||||
.navbar .nav-link:focus {
|
||||
color: var(--muted);
|
||||
color: var(--primary);
|
||||
}
|
||||
|
||||
.hero-section {
|
||||
background: var(--surface);
|
||||
background: linear-gradient(135deg, rgba(74, 144, 226, 0.05), rgba(142, 68, 173, 0.05));
|
||||
}
|
||||
|
||||
.hero-card {
|
||||
background: var(--bg);
|
||||
background: var(--surface);
|
||||
border: 1px solid var(--border);
|
||||
border-radius: var(--radius-md);
|
||||
box-shadow: var(--shadow-sm);
|
||||
@ -56,6 +58,7 @@ body {
|
||||
|
||||
.card {
|
||||
border-radius: var(--radius-md);
|
||||
border: 1px solid var(--border);
|
||||
}
|
||||
|
||||
.info-card {
|
||||
@ -67,22 +70,35 @@ body {
|
||||
.badge {
|
||||
border-radius: 999px;
|
||||
font-weight: 500;
|
||||
color: var(--text);
|
||||
color: var(--primary);
|
||||
background: rgba(74, 144, 226, 0.1);
|
||||
}
|
||||
|
||||
.btn {
|
||||
border-radius: var(--radius-sm);
|
||||
font-weight: 600;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
.btn-dark {
|
||||
background: var(--accent);
|
||||
border-color: var(--accent);
|
||||
.btn-primary-custom {
|
||||
background: var(--primary);
|
||||
border-color: var(--primary);
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.btn-outline-dark {
|
||||
border-color: var(--accent);
|
||||
color: var(--accent);
|
||||
.btn-primary-custom:hover {
|
||||
background: var(--secondary);
|
||||
border-color: var(--secondary);
|
||||
}
|
||||
|
||||
.btn-outline-primary-custom {
|
||||
border-color: var(--primary);
|
||||
color: var(--primary);
|
||||
}
|
||||
|
||||
.btn-outline-primary-custom:hover {
|
||||
background: var(--primary);
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.form-control {
|
||||
@ -91,8 +107,8 @@ body {
|
||||
}
|
||||
|
||||
.form-control:focus {
|
||||
box-shadow: none;
|
||||
border-color: var(--text);
|
||||
box-shadow: 0 0 0 0.2rem rgba(74, 144, 226, 0.25);
|
||||
border-color: var(--primary);
|
||||
}
|
||||
|
||||
.icon-pill {
|
||||
@ -102,7 +118,7 @@ body {
|
||||
border-radius: 999px;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
background: var(--text);
|
||||
background: var(--primary);
|
||||
color: #fff;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
@ -118,4 +134,4 @@ body {
|
||||
.hero-section .display-5 {
|
||||
font-size: 2.2rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
24
index.php
24
index.php
@ -76,7 +76,7 @@ if ($_SERVER['REQUEST_METHOD'] === 'POST') {
|
||||
<li class="nav-item"><a class="nav-link" href="#portfolio">Portfolio</a></li>
|
||||
<li class="nav-item"><a class="nav-link" href="#about">About</a></li>
|
||||
<li class="nav-item"><a class="nav-link" href="#testimonials">Testimonials</a></li>
|
||||
<li class="nav-item"><a class="nav-link btn btn-dark text-white px-3" href="#contact">Email me</a></li>
|
||||
<li class="nav-item"><a class="nav-link btn btn-primary-custom text-white px-3" href="#contact">Email me</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
@ -92,20 +92,20 @@ if ($_SERVER['REQUEST_METHOD'] === 'POST') {
|
||||
<h1 class="display-5 fw-semibold">I design calm, conversion-ready experiences for modern brands.</h1>
|
||||
<p class="lead text-muted mt-3">Specialized in web product design, UI systems, and responsive build-outs that ship fast and feel premium.</p>
|
||||
<div class="d-flex flex-column flex-sm-row gap-3 mt-4">
|
||||
<a class="btn btn-dark btn-lg px-4" href="#contact">Email me</a>
|
||||
<a class="btn btn-outline-dark btn-lg px-4" href="#portfolio">View work</a>
|
||||
<a class="btn btn-primary-custom btn-lg px-4" href="#contact">Email me</a>
|
||||
<a class="btn btn-outline-primary-custom btn-lg px-4" href="#portfolio">View work</a>
|
||||
</div>
|
||||
<div class="d-flex gap-4 mt-4 text-muted small">
|
||||
<div>
|
||||
<div class="fw-semibold text-dark">8+</div>
|
||||
<div class="fw-semibold text-primary">8+</div>
|
||||
<div>Years shipping</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="fw-semibold text-dark">40+</div>
|
||||
<div class="fw-semibold text-primary">40+</div>
|
||||
<div>Projects delivered</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="fw-semibold text-dark">12</div>
|
||||
<div class="fw-semibold text-primary">12</div>
|
||||
<div>Teams supported</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -128,7 +128,7 @@ if ($_SERVER['REQUEST_METHOD'] === 'POST') {
|
||||
<span>Weekly async updates and clear handoff docs.</span>
|
||||
</li>
|
||||
</ul>
|
||||
<a class="text-decoration-none fw-semibold" href="#contact">Let’s talk about your next launch →</a>
|
||||
<a class="text-decoration-none fw-semibold text-primary" href="#contact">Let’s talk about your next launch →</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -160,12 +160,12 @@ if ($_SERVER['REQUEST_METHOD'] === 'POST') {
|
||||
<p class="text-muted"><?= htmlspecialchars($project['desc']) ?></p>
|
||||
<div class="d-flex flex-wrap gap-2">
|
||||
<?php foreach ($project['tags'] as $tag): ?>
|
||||
<span class="badge text-bg-light border"><?= htmlspecialchars($tag) ?></span>
|
||||
<span class="badge"><?= htmlspecialchars($tag) ?></span>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-footer bg-white border-0 px-4 pb-4">
|
||||
<a class="text-decoration-none fw-semibold" href="#contact">Request details →</a>
|
||||
<a class="text-decoration-none fw-semibold text-primary" href="#contact">Request details →</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -231,7 +231,7 @@ if ($_SERVER['REQUEST_METHOD'] === 'POST') {
|
||||
<div class="card h-100 border-0 shadow-sm">
|
||||
<div class="card-body p-4">
|
||||
<p class="text-muted">“<?= htmlspecialchars($item['quote']) ?>”</p>
|
||||
<p class="fw-semibold mb-0"><?= htmlspecialchars($item['name']) ?></p>
|
||||
<p class="fw-semibold mb-0 text-primary"><?= htmlspecialchars($item['name']) ?></p>
|
||||
<p class="text-muted small mb-0"><?= htmlspecialchars($item['role']) ?></p>
|
||||
</div>
|
||||
</div>
|
||||
@ -282,7 +282,7 @@ if ($_SERVER['REQUEST_METHOD'] === 'POST') {
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
<div class="col-12 d-flex flex-column flex-sm-row gap-3 align-items-sm-center">
|
||||
<button class="btn btn-dark px-4" type="submit">Email me</button>
|
||||
<button class="btn btn-primary-custom px-4" type="submit">Email me</button>
|
||||
<p class="text-muted small mb-0">By submitting, you agree to be contacted about your request.</p>
|
||||
</div>
|
||||
</div>
|
||||
@ -314,4 +314,4 @@ if ($_SERVER['REQUEST_METHOD'] === 'POST') {
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
|
||||
<script src="assets/js/main.js?v=<?= htmlspecialchars((string) time()) ?>"></script>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
Loading…
x
Reference in New Issue
Block a user