New panel image and portfolio links
This commit is contained in:
+12
-9
@@ -485,17 +485,16 @@ ul { list-style: none; }
|
|||||||
.about-image { position: relative; }
|
.about-image { position: relative; }
|
||||||
.about-img-placeholder {
|
.about-img-placeholder {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
aspect-ratio: 1 / 1;
|
max-width: 480px;
|
||||||
max-width: 420px;
|
|
||||||
border-radius: 24px;
|
border-radius: 24px;
|
||||||
background: linear-gradient(145deg, var(--purple-mid), var(--purple-bright));
|
overflow: hidden;
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
font-size: 7rem;
|
|
||||||
color: rgba(255,255,255,0.25);
|
|
||||||
box-shadow: var(--shadow-lg);
|
box-shadow: var(--shadow-lg);
|
||||||
}
|
}
|
||||||
|
.about-img-placeholder img {
|
||||||
|
width: 100%;
|
||||||
|
height: auto;
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
.about-badge {
|
.about-badge {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
bottom: -16px;
|
bottom: -16px;
|
||||||
@@ -648,6 +647,10 @@ ul { list-style: none; }
|
|||||||
}
|
}
|
||||||
.project-work i { color: #2DD4BF; }
|
.project-work i { color: #2DD4BF; }
|
||||||
|
|
||||||
|
/* No-link row */
|
||||||
|
.project-row--no-link { cursor: default; }
|
||||||
|
.project-row--no-link::before { display: none; }
|
||||||
|
|
||||||
/* Arrow */
|
/* Arrow */
|
||||||
.project-row-arrow {
|
.project-row-arrow {
|
||||||
width: 40px;
|
width: 40px;
|
||||||
@@ -865,7 +868,7 @@ ul { list-style: none; }
|
|||||||
grid-template-columns: 1fr;
|
grid-template-columns: 1fr;
|
||||||
gap: 40px;
|
gap: 40px;
|
||||||
}
|
}
|
||||||
.about-img-placeholder { max-width: 100%; aspect-ratio: 16/9; }
|
.about-img-placeholder { max-width: 100%; }
|
||||||
.about-badge { right: 16px; }
|
.about-badge { right: 16px; }
|
||||||
.contact-wrapper {
|
.contact-wrapper {
|
||||||
grid-template-columns: 1fr;
|
grid-template-columns: 1fr;
|
||||||
|
|||||||
Binary file not shown.
|
Before Width: | Height: | Size: 140 KiB After Width: | Height: | Size: 193 KiB |
@@ -124,7 +124,8 @@ $form_error = isset($_GET['error']) && $_GET['error'] === '1';
|
|||||||
<div class="about-grid">
|
<div class="about-grid">
|
||||||
<div class="about-image reveal">
|
<div class="about-image reveal">
|
||||||
<div class="about-img-placeholder">
|
<div class="about-img-placeholder">
|
||||||
<i class="fas fa-hat-wizard"></i>
|
<img src="img/wizfixer.webp" alt="Danny the tech-wizard" class="mascot-img">
|
||||||
|
<!-- <i class="fas fa-hat-wizard"></i> -->
|
||||||
</div>
|
</div>
|
||||||
<div class="about-badge">
|
<div class="about-badge">
|
||||||
<i class="fas fa-location-dot"></i> Oxfordshire, UK
|
<i class="fas fa-location-dot"></i> Oxfordshire, UK
|
||||||
@@ -164,7 +165,8 @@ $form_error = isset($_GET['error']) && $_GET['error'] === '1';
|
|||||||
<p class="section-lead">A few recent projects from the spell book.</p>
|
<p class="section-lead">A few recent projects from the spell book.</p>
|
||||||
</div>
|
</div>
|
||||||
<div class="projects-list">
|
<div class="projects-list">
|
||||||
<article class="project-row reveal">
|
<!-- No link — James Norman has no website -->
|
||||||
|
<article class="project-row project-row--no-link reveal">
|
||||||
<div class="project-row-img">
|
<div class="project-row-img">
|
||||||
<div class="project-img-placeholder"><i class="fas fa-leaf"></i></div>
|
<div class="project-img-placeholder"><i class="fas fa-leaf"></i></div>
|
||||||
</div>
|
</div>
|
||||||
@@ -176,9 +178,8 @@ $form_error = isset($_GET['error']) && $_GET['error'] === '1';
|
|||||||
<h3>James Norman</h3>
|
<h3>James Norman</h3>
|
||||||
<p class="project-work"><i class="fas fa-network-wired"></i> Office Network Update</p>
|
<p class="project-work"><i class="fas fa-network-wired"></i> Office Network Update</p>
|
||||||
</div>
|
</div>
|
||||||
<div class="project-row-arrow"><i class="fas fa-arrow-right"></i></div>
|
|
||||||
</article>
|
</article>
|
||||||
<article class="project-row reveal">
|
<a href="https://organicgrowersgathering.org/" target="_blank" rel="noopener" class="project-row reveal">
|
||||||
<div class="project-row-img">
|
<div class="project-row-img">
|
||||||
<div class="project-img-placeholder"><i class="fas fa-tractor"></i></div>
|
<div class="project-img-placeholder"><i class="fas fa-tractor"></i></div>
|
||||||
</div>
|
</div>
|
||||||
@@ -191,8 +192,8 @@ $form_error = isset($_GET['error']) && $_GET['error'] === '1';
|
|||||||
<p class="project-work"><i class="fas fa-video"></i> Video Recording & Editing</p>
|
<p class="project-work"><i class="fas fa-video"></i> Video Recording & Editing</p>
|
||||||
</div>
|
</div>
|
||||||
<div class="project-row-arrow"><i class="fas fa-arrow-right"></i></div>
|
<div class="project-row-arrow"><i class="fas fa-arrow-right"></i></div>
|
||||||
</article>
|
</a>
|
||||||
<article class="project-row reveal">
|
<a href="https://sunscope.net" target="_blank" rel="noopener" class="project-row reveal">
|
||||||
<div class="project-row-img">
|
<div class="project-row-img">
|
||||||
<div class="project-img-placeholder"><i class="fas fa-cloud-bolt"></i></div>
|
<div class="project-img-placeholder"><i class="fas fa-cloud-bolt"></i></div>
|
||||||
</div>
|
</div>
|
||||||
@@ -205,8 +206,8 @@ $form_error = isset($_GET['error']) && $_GET['error'] === '1';
|
|||||||
<p class="project-work"><i class="fas fa-cloud-sun"></i> Advanced Weather App</p>
|
<p class="project-work"><i class="fas fa-cloud-sun"></i> Advanced Weather App</p>
|
||||||
</div>
|
</div>
|
||||||
<div class="project-row-arrow"><i class="fas fa-arrow-right"></i></div>
|
<div class="project-row-arrow"><i class="fas fa-arrow-right"></i></div>
|
||||||
</article>
|
</a>
|
||||||
<article class="project-row reveal">
|
<a href="https://camplight.co.uk/" target="_blank" rel="noopener" class="project-row reveal">
|
||||||
<div class="project-row-img">
|
<div class="project-row-img">
|
||||||
<div class="project-img-placeholder"><i class="fas fa-campground"></i></div>
|
<div class="project-img-placeholder"><i class="fas fa-campground"></i></div>
|
||||||
</div>
|
</div>
|
||||||
@@ -219,8 +220,8 @@ $form_error = isset($_GET['error']) && $_GET['error'] === '1';
|
|||||||
<p class="project-work"><i class="fas fa-globe"></i> Website Design & Build</p>
|
<p class="project-work"><i class="fas fa-globe"></i> Website Design & Build</p>
|
||||||
</div>
|
</div>
|
||||||
<div class="project-row-arrow"><i class="fas fa-arrow-right"></i></div>
|
<div class="project-row-arrow"><i class="fas fa-arrow-right"></i></div>
|
||||||
</article>
|
</a>
|
||||||
<article class="project-row reveal">
|
<a href="https://www.hempen.co.uk/" target="_blank" rel="noopener" class="project-row reveal">
|
||||||
<div class="project-row-img">
|
<div class="project-row-img">
|
||||||
<div class="project-img-placeholder"><i class="fas fa-store"></i></div>
|
<div class="project-img-placeholder"><i class="fas fa-store"></i></div>
|
||||||
</div>
|
</div>
|
||||||
@@ -233,7 +234,7 @@ $form_error = isset($_GET['error']) && $_GET['error'] === '1';
|
|||||||
<p class="project-work"><i class="fas fa-cart-shopping"></i> eCommerce Website</p>
|
<p class="project-work"><i class="fas fa-cart-shopping"></i> eCommerce Website</p>
|
||||||
</div>
|
</div>
|
||||||
<div class="project-row-arrow"><i class="fas fa-arrow-right"></i></div>
|
<div class="project-row-arrow"><i class="fas fa-arrow-right"></i></div>
|
||||||
</article>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|||||||
@@ -18,10 +18,18 @@ unset($_SESSION['captcha_answer']);
|
|||||||
|
|
||||||
// Validate
|
// Validate
|
||||||
$valid = true;
|
$valid = true;
|
||||||
if (empty($name) || strlen($name) > 200) $valid = false;
|
if (empty($name) || strlen($name) > 200) {
|
||||||
if (empty($email) || !filter_var($email, FILTER_VALIDATE_EMAIL)) $valid = false;
|
$valid = false;
|
||||||
if (empty($message) || strlen($message) > 5000) $valid = false;
|
}
|
||||||
if ($captcha !== $expected || $expected === -1) $valid = false;
|
if (empty($email) || !filter_var($email, FILTER_VALIDATE_EMAIL)) {
|
||||||
|
$valid = false;
|
||||||
|
}
|
||||||
|
if (empty($message) || strlen($message) > 5000) {
|
||||||
|
$valid = false;
|
||||||
|
}
|
||||||
|
if ($captcha !== $expected || $expected === -1) {
|
||||||
|
$valid = false;
|
||||||
|
}
|
||||||
|
|
||||||
if (!$valid) {
|
if (!$valid) {
|
||||||
header('Location: index.php?error=1#contact');
|
header('Location: index.php?error=1#contact');
|
||||||
|
|||||||
Reference in New Issue
Block a user