Compare commits
14 commits
2f49d7ce86
...
44eb81258e
| Author | SHA1 | Date | |
|---|---|---|---|
|
44eb81258e | ||
|
|
7fd8a48cf4 | ||
|
|
b6414d67c1 | ||
|
|
72b3e436f4 | ||
|
|
cdb2302408 | ||
|
|
d148dd8c4a | ||
|
|
8a2835a13e | ||
|
|
f35da10e0e | ||
|
|
66b162f9db | ||
|
|
c23bed009f | ||
|
|
ff363f50e9 | ||
|
|
32b9b0e152 | ||
|
|
38bde95c5b | ||
|
|
bd84cc5c29 |
11 changed files with 159 additions and 124 deletions
37
public/contact.html
Normal file
37
public/contact.html
Normal file
|
|
@ -0,0 +1,37 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="nl" data-bs-theme="dark">
|
||||||
|
|
||||||
|
<head>
|
||||||
|
<!--# include file='/includes/partials/head-content.html' -->
|
||||||
|
|
||||||
|
<title>Vandevliet Aerial Shots</title>
|
||||||
|
<meta name="description" content="FPV dronevideo's voor bedrijven, vastgoed, recreatie, sport en evenementen.">
|
||||||
|
|
||||||
|
<meta property="og:title" content="Vandevliet Aerial Shots">
|
||||||
|
<meta property="og:description" content="FPV dronevideo's voor bedrijven, vastgoed, recreatie, sport en evenementen.">
|
||||||
|
<meta property="og:type" content="website">
|
||||||
|
<meta property="og:locale" content="nl_NL">
|
||||||
|
<meta property="og:url" content="https://vandevliet-aerialshots.com">
|
||||||
|
<meta property="og:image" content="/assets/static/logo-aerialshots-v1-w.png">
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body class="d-flex flex-column min-vh-100">
|
||||||
|
<header>
|
||||||
|
<!--# include file='/includes/components/nav.html' -->
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<main>
|
||||||
|
<section class="container-xxl pb-0">
|
||||||
|
<h1 id="contact" class="text-center">Contact</h1>
|
||||||
|
<!--# include file='/includes/components/contact-row.html' -->
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<!-- Nothing more here yet, contact form will be added later.. -->
|
||||||
|
</main>
|
||||||
|
|
||||||
|
<footer class="bg-secondary-subtle">
|
||||||
|
<!--# include file='/includes/partials/footer-bottom.html' -->
|
||||||
|
</footer>
|
||||||
|
</body>
|
||||||
|
|
||||||
|
</html>
|
||||||
38
public/includes/components/contact-row.html
Normal file
38
public/includes/components/contact-row.html
Normal file
|
|
@ -0,0 +1,38 @@
|
||||||
|
<div class="row justify-content-center">
|
||||||
|
<p class="lead text-center">
|
||||||
|
Stuur mij gerust een mailtje voor een offerte of vrijblijvend gesprek! 🙂
|
||||||
|
<br>🡇
|
||||||
|
</p>
|
||||||
|
<div class="col-6 col-lg-3">
|
||||||
|
<div class="card h-100 bg-secondary-subtle">
|
||||||
|
<div class="card-body d-flex flex-column">
|
||||||
|
<h2 class="section fs-3 card-title">Bob Vandevliet</h2>
|
||||||
|
<p style="margin-top: 0 !important;">Gecertificeerd FPV-dronepiloot</p>
|
||||||
|
<p>
|
||||||
|
<a href="mailto:bob@vandevliet-aerialshots.com">bob@vandevliet-aerialshots.com</a>
|
||||||
|
<br>Arnhem, Gelderland
|
||||||
|
</p>
|
||||||
|
<!-- <p><a class='btn btn-primary' href='/contact'>Offerte aanvragen</a></p> -->
|
||||||
|
<p class="fs-5 ff-header">Vandevliet Aerial Shots</p>
|
||||||
|
<p style="margin-top: 0 !important;">
|
||||||
|
KvK: 94567255<br>
|
||||||
|
Btw: NL005095319B19
|
||||||
|
</p>
|
||||||
|
<p>
|
||||||
|
<a href="/assets/static/Vandevliet AS - Algemene Voorwaarden - 250530.pdf" target="_blank">Algemene Voorwaarden</a>
|
||||||
|
</p>
|
||||||
|
<!-- <h4 class='fs-5'>Socials</h4> -->
|
||||||
|
<p class="socials fs-2" style="margin-top: auto !important; padding-top: 1rem !important;">
|
||||||
|
<a href="https://www.instagram.com/vandevliet.fpv" target="_blank" rel="noopener noreferrer" title="Vandevliet Aerial Shots on Instagram" aria-label="Vandevliet Aerial Shots on Instagram"><i class="fab fa-instagram"></i></a>
|
||||||
|
<a href="https://www.youtube.com/@vandevliet-fpv" target="_blank" rel="noopener noreferrer" title="Vandevliet Aerial Shots on YouTube" aria-label="Vandevliet Aerial Shots on YouTube"><i class="fab fa-youtube"></i></a>
|
||||||
|
<a href="https://www.linkedin.com/company/vdv-as" target="_blank" rel="noopener noreferrer" title="Vandevliet Aerial Shots on LinkedIn" aria-label="Vandevliet Aerial Shots on LinkedIn"><i class="fab fa-linkedin"></i></a>
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="col-6 col-lg-3">
|
||||||
|
<div class="card h-100 bg-transparent">
|
||||||
|
<img class="card-img" src="/assets/static/20230909_150343.jpg" alt="Portrait foto van mijzelf.">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
@ -18,7 +18,7 @@
|
||||||
<a class="nav-link" href="/#over-mij">Over mij</a>
|
<a class="nav-link" href="/#over-mij">Over mij</a>
|
||||||
</li>
|
</li>
|
||||||
<li class="nav-item">
|
<li class="nav-item">
|
||||||
<a class="nav-link btn btn-primary" href="/#contact">Contact</a>
|
<a class="nav-link btn btn-primary" href="/contact">Contact</a>
|
||||||
</li>
|
</li>
|
||||||
<li class="nav-item socials">
|
<li class="nav-item socials">
|
||||||
<a class="nav-link" href="https://www.instagram.com/vandevliet.fpv" target="_blank" rel="noopener noreferrer" title="Vandevliet Aerial Shots on Instagram" aria-label="Vandevliet Aerial Shots on Instagram"><i class="fab fa-instagram"></i></a>
|
<a class="nav-link" href="https://www.instagram.com/vandevliet.fpv" target="_blank" rel="noopener noreferrer" title="Vandevliet Aerial Shots on Instagram" aria-label="Vandevliet Aerial Shots on Instagram"><i class="fab fa-instagram"></i></a>
|
||||||
|
|
@ -1,47 +0,0 @@
|
||||||
<footer class="bg-secondary-subtle">
|
|
||||||
|
|
||||||
<section class="container-xxl pt-4">
|
|
||||||
<div class="row justify-content-center">
|
|
||||||
<div class="col-6 col-lg-3">
|
|
||||||
<div class="card h-100">
|
|
||||||
<div class="card-body d-flex flex-column">
|
|
||||||
<h2 class="section fs-3 card-title" id="contact">Contact</h2>
|
|
||||||
<p class="fs-5 ff-header">Bob Vandevliet</p>
|
|
||||||
<p style="margin-top: 0 !important;">Gecertificeerd FPV-dronepiloot</p>
|
|
||||||
<p>
|
|
||||||
<a href="mailto:bob@vandevliet-aerialshots.com">bob@vandevliet-aerialshots.com</a>
|
|
||||||
<!-- <a href="tel:+31612345678">+31 6 12345678</a> -->
|
|
||||||
<br>Arnhem, Gelderland
|
|
||||||
</p>
|
|
||||||
<p class="fs-5 ff-header">Vandevliet Aerial Shots</p>
|
|
||||||
<p style="margin-top: 0 !important;">
|
|
||||||
KvK: 94567255<br>
|
|
||||||
Btw: NL005095319B19
|
|
||||||
</p>
|
|
||||||
<p>
|
|
||||||
<a href="/assets/static/Vandevliet AS - Algemene Voorwaarden - 250530.pdf" target="_blank">Algemene Voorwaarden</a>
|
|
||||||
</p>
|
|
||||||
<!-- <h4 class="fs-5">Socials</h4> -->
|
|
||||||
<p class="socials fs-2" style="margin-top: auto !important; padding-top: 1rem !important;">
|
|
||||||
<a href="https://www.instagram.com/vandevliet.fpv" target="_blank" rel="noopener noreferrer" title="Vandevliet Aerial Shots on Instagram" aria-label="Vandevliet Aerial Shots on Instagram"><i class="fab fa-instagram"></i></a>
|
|
||||||
<a href="https://www.youtube.com/@vandevliet-fpv" target="_blank" rel="noopener noreferrer" title="Vandevliet Aerial Shots on YouTube" aria-label="Vandevliet Aerial Shots on YouTube"><i class="fab fa-youtube"></i></a>
|
|
||||||
<a href="https://www.linkedin.com/company/vdv-as" target="_blank" rel="noopener noreferrer" title="Vandevliet Aerial Shots on LinkedIn" aria-label="Vandevliet Aerial Shots on LinkedIn"><i class="fab fa-linkedin"></i></a>
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="col-6 col-lg-3">
|
|
||||||
<div class="card h-100 bg-transparent">
|
|
||||||
<img class="card-img" src="/assets/static/20230909_150343.jpg" alt="Portrait foto van mijzelf.">
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<div class="text-center py-4">
|
|
||||||
<p>
|
|
||||||
Vandevliet Aerial Shots © <!--# config timefmt="%Y" --><!--# echo var="date_local" -->
|
|
||||||
• <a href="/privacy#">Privacyverklaring</a>
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</footer>
|
|
||||||
6
public/includes/partials/footer-bottom.html
Normal file
6
public/includes/partials/footer-bottom.html
Normal file
|
|
@ -0,0 +1,6 @@
|
||||||
|
<div class="text-center py-4">
|
||||||
|
<p>
|
||||||
|
Vandevliet Aerial Shots © <!--# config timefmt='%Y' --><!--# echo var='date_local' -->
|
||||||
|
• <a href="/privacy#">Privacyverklaring</a>
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
@ -11,14 +11,19 @@
|
||||||
https://cdn.jsdelivr.net
|
https://cdn.jsdelivr.net
|
||||||
https://*.fontawesome.com;
|
https://*.fontawesome.com;
|
||||||
media-src 'self'
|
media-src 'self'
|
||||||
https://www.youtube.com https://youtu.be
|
https://www.youtube.com
|
||||||
|
https://youtu.be
|
||||||
https://www.linkedin.com;
|
https://www.linkedin.com;
|
||||||
frame-src 'self'
|
frame-src 'self'
|
||||||
https://www.youtube.com/embed/ https://youtu.be/embed/
|
https://www.youtube.com/embed/
|
||||||
|
https://youtu.be/embed/
|
||||||
https://www.linkedin.com/embed/;
|
https://www.linkedin.com/embed/;
|
||||||
style-src 'self' 'unsafe-inline' https://*.fontawesome.com;
|
style-src 'self' 'unsafe-inline'
|
||||||
font-src 'self' https://*.fontawesome.com;
|
https://*.fontawesome.com;
|
||||||
connect-src 'self' https://*.fontawesome.com;
|
font-src 'self'
|
||||||
|
https://*.fontawesome.com;
|
||||||
|
connect-src 'self'
|
||||||
|
https://*.fontawesome.com;
|
||||||
object-src 'none';
|
object-src 'none';
|
||||||
img-src 'self' data:;
|
img-src 'self' data:;
|
||||||
">
|
">
|
||||||
|
|
@ -2,7 +2,7 @@
|
||||||
<div class="card-body">
|
<div class="card-body">
|
||||||
<h3 class="card-title">Open categorie</h3>
|
<h3 class="card-title">Open categorie</h3>
|
||||||
<p class="card-text fs-4 ff-header">vanaf €350,-</p>
|
<p class="card-text fs-4 ff-header">vanaf €350,-</p>
|
||||||
<p class="card-text">Geschikt voor indoor en vluchten in ongecontroleerd luchtruim met een laag risico:</p>
|
<p class="card-text">Geschikt voor indoor drone tours en vluchten in ongecontroleerd luchtruim met een laag risico:</p>
|
||||||
<ul>
|
<ul>
|
||||||
<li>Bedrijfsvideo</li>
|
<li>Bedrijfsvideo</li>
|
||||||
<li>Vastgoed</li>
|
<li>Vastgoed</li>
|
||||||
|
|
|
||||||
|
|
@ -1,27 +1,30 @@
|
||||||
|
<!--# set var='title' value='Vandevliet Aerial Shots' -->
|
||||||
|
<!--# set var='description' value='FPV dronevideo\'s voor bedrijven, vastgoed, recreatie, sport en evenementen' -->
|
||||||
|
|
||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html lang="nl" data-bs-theme="dark">
|
<html lang="nl" data-bs-theme="dark">
|
||||||
|
|
||||||
<head>
|
<head>
|
||||||
<!--# include file="/includes/head.html" -->
|
<!--# include file='/includes/partials/head-content.html' -->
|
||||||
|
|
||||||
<title>Vandevliet Aerial Shots</title>
|
<title><!--# echo var='title' --></title>
|
||||||
<meta name="description" content="FPV dronevideo's voor bedrijven, vastgoed, recreatie, sport en evenementen.">
|
<meta name="description" content="<!--# echo var='description' -->">
|
||||||
|
|
||||||
<meta property="og:title" content="Vandevliet Aerial Shots">
|
<meta property="og:title" content="<!--# echo var='title' -->">
|
||||||
<meta property="og:description" content="FPV dronevideo's voor bedrijven, vastgoed, recreatie, sport en evenementen.">
|
<meta property="og:description" content="<!--# echo var='description' -->">
|
||||||
<meta property="og:type" content="website">
|
<meta property="og:type" content="website">
|
||||||
<meta property="og:locale" content="nl_NL">
|
<meta property="og:locale" content="nl_NL">
|
||||||
<meta property="og:url" content="https://vandevliet-aerialshots.com">
|
<meta property="og:url" content="https://vandevliet-aerialshots.com">
|
||||||
<meta property="og:image" content="/assets/static/logo-aerialshots-v1-w.png">
|
<meta property="og:image" content="/assets/static/logo-aerialshots-v1-w.png">
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body class="has-hero">
|
<body class="d-flex flex-column min-vh-100">
|
||||||
<header>
|
<header>
|
||||||
<!--# include file="/includes/nav.html" -->
|
<!--# include file='/includes/components/nav.html' -->
|
||||||
|
|
||||||
<div class="hero position-relative overflow-hidden" style="height: 100vh;">
|
<div class="hero position-relative overflow-hidden" style="height: 100vh;">
|
||||||
<div class="hero-body position-absolute bottom-0" style="z-index: 1;">
|
<div class="hero-body position-absolute bottom-0" style="z-index: 1;">
|
||||||
<h1 class="h5">FPV dronevideo's voor bedrijven, vastgoed, recreatie, sport en evenementen</h1>
|
<h1 class="lead"><!--# echo var='description' --></h1>
|
||||||
<p><a class="btn btn-primary" href="#diensten">Ontdek meer <i class="fa-solid fa-arrow-down"></i></a></p>
|
<p><a class="btn btn-primary" href="#diensten">Ontdek meer <i class="fa-solid fa-arrow-down"></i></a></p>
|
||||||
</div>
|
</div>
|
||||||
<video class="cover parallax" preload="auto" playsinline="playsinline" autoplay="autoplay" muted="muted" loop="loop">
|
<video class="cover parallax" preload="auto" playsinline="playsinline" autoplay="autoplay" muted="muted" loop="loop">
|
||||||
|
|
@ -31,13 +34,11 @@
|
||||||
</header>
|
</header>
|
||||||
|
|
||||||
<main>
|
<main>
|
||||||
<section class="container-xxl text-center">
|
<section id="diensten" class="container-xxl text-center">
|
||||||
<h2 id="diensten">FPV drone opnames laten maken</h2>
|
<h2>FPV drone opnames laten maken</h2>
|
||||||
<div class="row">
|
|
||||||
<p>
|
<p>
|
||||||
FPV staat voor <b>First Person View</b> en levert cinematische dronebeelden op. FPV drones worden op maat gemaakt en zijn daardoor flexibel in te zetten. Ze kunnen binnen en buiten filmen, van het navigeren door fabrieken, kantoren en festivaltenten tot het achtervolgen van auto's en motorcrossers. FPV beelden vertellen een compleet verhaal in één vlucht. Vaak worden deze vluchten vastgelegd met een GoPro of vergelijkbare actiecamera. Het resultaat is <b>vloeiend, filmisch en dynamisch</b> en overtreft traditionele drone-videografie.
|
FPV staat voor <b>First Person View</b> en levert cinematische dronebeelden op. FPV drones worden op maat gemaakt en zijn daardoor flexibel in te zetten. Ze kunnen binnen en buiten filmen, van het navigeren door fabrieken, kantoren en festivaltenten tot het achtervolgen van auto's en motorcrossers. FPV beelden vertellen een compleet verhaal in één vlucht. Vaak worden deze vluchten vastgelegd met een GoPro of vergelijkbare actiecamera. Het resultaat is <b>vloeiend, filmisch en dynamisch</b> en overtreft traditionele drone-videografie.
|
||||||
</p>
|
</p>
|
||||||
</div>
|
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-sm-6 col-lg">
|
<div class="col-sm-6 col-lg">
|
||||||
<div class="card h-100">
|
<div class="card h-100">
|
||||||
|
|
@ -112,39 +113,38 @@
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<section class="container-xxl">
|
<section id="prijzen" class="container-xxl">
|
||||||
<div class="row justify-content-center text-center">
|
<div class="row justify-content-center text-center">
|
||||||
<div class="col-lg-8">
|
<div class="col-lg-8 mt-0">
|
||||||
<div itemscope itemprop="mainEntity" itemtype="https://schema.org/Question">
|
<div itemscope itemprop="mainEntity" itemtype="https://schema.org/Question">
|
||||||
<h2 id="prijzen" class="text-center" itemprop="name">Wat kost een dronevideo?</h2>
|
<h2 itemprop="name">Wat kost een dronevideo?</h2>
|
||||||
<p itemscope itemprop="acceptedAnswer" itemtype="https://schema.org/Answer">
|
<p itemscope itemprop="acceptedAnswer" itemtype="https://schema.org/Answer">
|
||||||
<span itemprop="text">
|
<span itemprop="text">
|
||||||
FPV dronebeelden heb je al vanaf €350,- per vlucht. Inclusief montage en nabewerking vanaf €750,-. De uiteindelijke prijs wordt bepaald door locatie, vluchtduur en complexiteit van de eventuele montage.
|
FPV dronebeelden heb je al vanaf €350,- per vlucht. Inclusief montage en nabewerking vanaf €750,-. De uiteindelijke prijs wordt bepaald door locatie, vluchtduur en complexiteit van de eventuele montage.
|
||||||
</span>
|
</span>
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
<p class="text-center">
|
<p>
|
||||||
Hieronder vind je meer informatie over de verschillende categorieën en bijbehorende indicatieprijzen. Alle prijzen zijn exclusief btw, reis-, en verblijfskosten.
|
Hieronder vind je meer informatie over de verschillende categorieën en bijbehorende indicatieprijzen. Alle prijzen zijn exclusief btw, reis-, en verblijfskosten.
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="row justify-content-center">
|
<div class="row justify-content-center">
|
||||||
<div class="col-sm-6 col-lg-4">
|
<div class="col-sm-6 col-lg-4">
|
||||||
<!--# include file="/includes/pricing/cat-open.html" -->
|
<!--# include file='/includes/pricing/cat-open.html' -->
|
||||||
</div>
|
</div>
|
||||||
<div class="col-sm-6 col-lg-4">
|
<div class="col-sm-6 col-lg-4">
|
||||||
<!--# include file="/includes/pricing/cat-specific.html" -->
|
<!--# include file='/includes/pricing/cat-specific.html' -->
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="row justify-content-center">
|
<div class="row justify-content-center">
|
||||||
<div class="col-lg-8">
|
<div class="col-lg-8">
|
||||||
<!--# include file="/includes/pricing/post-edit.html" -->
|
<!--# include file='/includes/pricing/post-edit.html' -->
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<section class="container-xxl">
|
<section id="over-mij" class="container-xxl">
|
||||||
<div id="over-mij"></div>
|
|
||||||
<div class="card h-100 bg-light text-dark">
|
<div class="card h-100 bg-light text-dark">
|
||||||
<h2 class="card-title mt-4 text-center">Over mij</h2>
|
<h2 class="card-title mt-4 text-center">Over mij</h2>
|
||||||
<div class="row g-0">
|
<div class="row g-0">
|
||||||
|
|
@ -184,7 +184,7 @@
|
||||||
<h3>Klaar om jouw verhaal te vertellen?</h3>
|
<h3>Klaar om jouw verhaal te vertellen?</h3>
|
||||||
<p>
|
<p>
|
||||||
Ik werk vanuit Arnhem, vooral in Gelderland en omgeving. Als ZZP'er naast mijn parttime baan als software engineer kan ik flexibel werken volgens jouw planning.
|
Ik werk vanuit Arnhem, vooral in Gelderland en omgeving. Als ZZP'er naast mijn parttime baan als software engineer kan ik flexibel werken volgens jouw planning.
|
||||||
Neem gerust <a href="/#contact">contact</a> op voor een vrijblijvend gesprek.
|
Neem gerust <a href="/contact">contact</a> op voor een vrijblijvend gesprek.
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -193,7 +193,13 @@
|
||||||
</section>
|
</section>
|
||||||
</main>
|
</main>
|
||||||
|
|
||||||
<!--# include file="/includes/footer.html" -->
|
<footer class="bg-secondary-subtle">
|
||||||
|
<section class="container-xxl">
|
||||||
|
<!--# include file='/includes/components/contact-row.html' -->
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<!--# include file='/includes/partials/footer-bottom.html' -->
|
||||||
|
</footer>
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
</html>
|
</html>
|
||||||
|
|
@ -2,7 +2,7 @@
|
||||||
<html lang="nl" data-bs-theme="dark">
|
<html lang="nl" data-bs-theme="dark">
|
||||||
|
|
||||||
<head>
|
<head>
|
||||||
<!--# include file="/includes/head.html" -->
|
<!--# include file='/includes/partials/head-content.html' -->
|
||||||
|
|
||||||
<title>Privacyverklaring • Vandevliet Aerial Shots</title>
|
<title>Privacyverklaring • Vandevliet Aerial Shots</title>
|
||||||
<meta name="description" content="Privacyverklaring • Vandevliet Aerial Shots">
|
<meta name="description" content="Privacyverklaring • Vandevliet Aerial Shots">
|
||||||
|
|
@ -15,9 +15,9 @@
|
||||||
<meta property="og:image" content="/assets/static/logo-aerialshots-v1-w.png">
|
<meta property="og:image" content="/assets/static/logo-aerialshots-v1-w.png">
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body class="d-flex flex-column min-vh-100">
|
||||||
<header>
|
<header>
|
||||||
<!--# include file="/includes/nav.html" -->
|
<!--# include file='/includes/components/nav.html' -->
|
||||||
</header>
|
</header>
|
||||||
|
|
||||||
<main>
|
<main>
|
||||||
|
|
@ -56,7 +56,7 @@
|
||||||
|
|
||||||
</main>
|
</main>
|
||||||
|
|
||||||
<!--# include file="/includes/footer.html" -->
|
<!--# include file='/includes/footer.html' -->
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
</html>
|
</html>
|
||||||
|
|
@ -1,24 +1,3 @@
|
||||||
const highlightSectionFromHash = () =>
|
|
||||||
{
|
|
||||||
const { hash } = window.location;
|
|
||||||
|
|
||||||
if (hash === '#contact')
|
|
||||||
{
|
|
||||||
const section = document.getElementById(hash.substring(1))?.parentElement;// .closest('section');
|
|
||||||
|
|
||||||
if (section)
|
|
||||||
{
|
|
||||||
setTimeout(() =>
|
|
||||||
{
|
|
||||||
section.classList.add('scrollto-highlight');
|
|
||||||
setTimeout(() => section.classList.remove('scrollto-highlight'), 1000);
|
|
||||||
}, 500);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
window.addEventListener('hashchange', highlightSectionFromHash);
|
|
||||||
|
|
||||||
window.addEventListener('pageshow', () =>
|
window.addEventListener('pageshow', () =>
|
||||||
{
|
{
|
||||||
/**
|
/**
|
||||||
|
|
@ -45,23 +24,33 @@ window.addEventListener('pageshow', () =>
|
||||||
|
|
||||||
refreshScrollLinkedPositioningEffect();
|
refreshScrollLinkedPositioningEffect();
|
||||||
window.addEventListener('scroll', refreshScrollLinkedPositioningEffect);
|
window.addEventListener('scroll', refreshScrollLinkedPositioningEffect);
|
||||||
|
|
||||||
highlightSectionFromHash();
|
|
||||||
});
|
});
|
||||||
|
|
||||||
document.addEventListener('DOMContentLoaded', () =>
|
document.addEventListener('DOMContentLoaded', () =>
|
||||||
{
|
{
|
||||||
|
/**
|
||||||
|
* @type {HTMLDivElement}
|
||||||
|
*/
|
||||||
|
const navBar = document.getElementById('navbarNav');
|
||||||
|
/**
|
||||||
|
* @type {NodeListOf<HTMLAnchorElement>}
|
||||||
|
*/
|
||||||
|
const navLinks = navBar.querySelectorAll('a.nav-link');
|
||||||
/**
|
/**
|
||||||
* @type {NodeListOf<HTMLElement>}
|
* @type {NodeListOf<HTMLElement>}
|
||||||
*/
|
*/
|
||||||
const sections = document.querySelectorAll('section');
|
const sectionsWithId = document.querySelectorAll('section[id]');
|
||||||
|
|
||||||
sections.forEach(section =>
|
// Update nav links and add anchor links to section headers.
|
||||||
|
sectionsWithId.forEach(anchorTarget =>
|
||||||
{
|
{
|
||||||
const anchorTarget = section.querySelector('[id]');
|
/**
|
||||||
const anchorHeader = section.querySelector('h1,h2');
|
* @type {HTMLHeadingElement|null}
|
||||||
|
*/
|
||||||
|
const anchorHeader = anchorTarget.querySelector('h1,h2');
|
||||||
|
|
||||||
if (anchorTarget && anchorHeader)
|
// Add anchor link to section header.
|
||||||
|
if (anchorHeader)
|
||||||
{
|
{
|
||||||
const anchorLink = document.createElement('a');
|
const anchorLink = document.createElement('a');
|
||||||
anchorLink.className = 'anchor-link';
|
anchorLink.className = 'anchor-link';
|
||||||
|
|
@ -72,7 +61,7 @@ document.addEventListener('DOMContentLoaded', () =>
|
||||||
});
|
});
|
||||||
|
|
||||||
// Collapse the navbar in mobile view after clicking a link.
|
// Collapse the navbar in mobile view after clicking a link.
|
||||||
document.querySelectorAll('#navbarNav li.nav-item>a').forEach(navLink =>
|
navLinks.forEach(navLink =>
|
||||||
{
|
{
|
||||||
navLink.addEventListener('click', () =>
|
navLink.addEventListener('click', () =>
|
||||||
{
|
{
|
||||||
|
|
|
||||||
|
|
@ -89,12 +89,9 @@ $ff-subheader: 'Eras ITC',
|
||||||
var(--#{$prefix}font-sans-serif);
|
var(--#{$prefix}font-sans-serif);
|
||||||
|
|
||||||
main {
|
main {
|
||||||
@extend .pb-4;
|
|
||||||
padding-top: 7rem !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
body.has-hero main {
|
|
||||||
@extend .pt-3;
|
@extend .pt-3;
|
||||||
|
@extend .pb-4;
|
||||||
|
@extend .flex-grow-1;
|
||||||
}
|
}
|
||||||
|
|
||||||
section,
|
section,
|
||||||
|
|
@ -103,17 +100,17 @@ main>* {
|
||||||
@extend .pb-3;
|
@extend .pb-3;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
header {
|
||||||
|
min-height: 4.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
::selection {
|
::selection {
|
||||||
@extend .text-dark;
|
@extend .text-dark;
|
||||||
background-color: $red-200;
|
background-color: $red-200;
|
||||||
}
|
}
|
||||||
|
|
||||||
:target::before {
|
:target {
|
||||||
content: "";
|
scroll-margin-top: 4.5rem;
|
||||||
display: block;
|
|
||||||
height: 6rem;
|
|
||||||
margin-top: -6rem;
|
|
||||||
visibility: hidden;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.anchor-link {
|
.anchor-link {
|
||||||
|
|
@ -321,6 +318,10 @@ img.grayscale-effect {
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
footer .card {
|
||||||
|
background-color: var(--bs-card-bg) !important;
|
||||||
|
}
|
||||||
|
|
||||||
.card-img-overlay {
|
.card-img-overlay {
|
||||||
position: unset;
|
position: unset;
|
||||||
z-index: 1;
|
z-index: 1;
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue