bvandevliet/Vandevliet.AerialShots.Website
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Added fontawesome icons and improving layout.

Browse source
This commit is contained in:
Bob Vandevliet 2024-06-12 17:29:16 +02:00
parent 561b32c6aa
commit 02eba68260
2 changed files with 63 additions and 45 deletions
Download patch file Download diff file Expand all files Collapse all files

1
public/includes/head.html
View file

@ -7,6 +7,7 @@
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5/dist/css/bootstrap.min.css" crossorigin="anonymous">
<link rel="stylesheet" href="assets/css/styles.css">
<script src="https://kit.fontawesome.com/7e7cf109ad.js" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5/dist/js/bootstrap.min.js" crossorigin="anonymous" defer></script>
<script src="assets/js/header.js" defer></script>
</head>

107
public/index.html
View file

@ -3,7 +3,7 @@
<html lang="en" data-bs-theme="dark">
<!--# set var="title" value="Hello" -->
<!--# set var="title" value="Vandevliet FPV" -->
<!--# include file="includes/head.html" -->
<body class="home hero">
@ -20,92 +20,109 @@
<main class="mt-4">
<div class="container-xxl">
<h2 class="section" id="section-fpv">Wat is FPV?</h2>
<p>FPV, ofwel First Person View, is een geavanceerde drone-technologie waarbij de piloot via een videobril live beelden ontvangt van een vaste camera op de drone. Dit stelt de piloot in staat om vanuit het perspectief van de drone te vliegen, waardoor hij uiterst precies vluchtlijnen kan bepalen en door de kleinste openingen en doorgangen kan navigeren. Doordat FPV drones volledig handmatig worden bestuurd, kunnen ze complexe acrobatische manoeuvres zoals flips, rolls en zelfs ondersteboven vliegen uitvoeren. Wie kiest voor een FPV drone video, valt op door de indrukwekkende, unieke, cinematische en dynamische beelden die met een traditionele drone niet mogelijk zijn.</p>
<p>FPV beelden bieden een geheel nieuwe ervaring en vertellen in één vlucht een compleet verhaal, waardoor ze ideaal zijn voor bedrijfsvideo's, evenementen en bruiloften. Dankzij de veelzijdigheid van FPV drones kunnen zowel binnen als buiten verbluffende beelden worden vastgelegd, van het vliegen door kleine doorgangen en machines tot het navigeren door festivaltenten en kantoorruimtes.</p>
<h2 class="section" id="section-about">Over mij</h2>
<p></p>
<div class="row">
<div class="col-md">
<h2 class="section" id="section-fpv">Wat is FPV?</h2>
<p>FPV, ofwel First Person View, is een geavanceerde drone-technologie waarbij de piloot via een videobril live beelden ontvangt van een vaste camera op de drone. Dit stelt de piloot in staat om vanuit het perspectief van de drone te vliegen, waardoor hij uiterst precies vluchtlijnen kan bepalen en door de kleinste openingen en doorgangen kan navigeren. Doordat FPV drones volledig handmatig worden bestuurd, kunnen ze complexe acrobatische manoeuvres zoals flips, rolls en zelfs ondersteboven vliegen uitvoeren. Wie kiest voor een FPV drone video, valt op door de indrukwekkende, unieke, cinematische en dynamische beelden die met een traditionele drone niet mogelijk zijn.</p>
<p>FPV beelden bieden een geheel nieuwe ervaring en vertellen in één vlucht een compleet verhaal, waardoor ze ideaal zijn voor bedrijfsvideo's, evenementen en bruiloften. Dankzij de veelzijdigheid van FPV drones kunnen zowel binnen als buiten verbluffende beelden worden vastgelegd, van het vliegen door kleine doorgangen en machines tot het navigeren door festivaltenten en kantoorruimtes.</p>
</div>
<div class="col-md text-end">
<h2 class="section" id="section-about">Over mij</h2>
<p>Lorem ipsum dolor sit amet ..</p>
</div>
</div>
<h2 class="section" id="section-services">Diensten</h2>
<div class="row">
<div class="col-sm">
<div class="card">
<p>
<div class="row text-center">
<div class="col-lg">
<div class="card h-100">
<!-- <img src="..." class="card-img-top" alt="..."> -->
<div class="card-body">
<h5 class="card-title">Bedrijfstour</h5>
<p class="card-text"></p>
<h4 class="card-title">Bedrijfstour</h4>
<p class="card-text">Lorem ipsum dolor sit amet ..</p>
</div>
</div>
</div>
<div class="col-sm">
<div class="card">
<div class="col-lg">
<div class="card h-100">
<!-- <img src="..." class="card-img-top" alt="..."> -->
<div class="card-body">
<h5 class="card-title">Evenementen</h5>
<p class="card-text"></p>
<h4 class="card-title">Evenementen</h4>
<p class="card-text">Lorem ipsum dolor sit amet ..</p>
</div>
</div>
</div>
<div class="col-sm">
<div class="card">
<div class="col-lg">
<div class="card h-100">
<!-- <img src="..." class="card-img-top" alt="..."> -->
<div class="card-body">
<h5 class="card-title">Sport</h5>
<p class="card-text"></p>
<h4 class="card-title">Sport</h4>
<p class="card-text">Lorem ipsum dolor sit amet ..</p>
</div>
</div>
</div>
<div class="col-sm">
<div class="card">
<div class="col-lg">
<div class="card h-100">
<!-- <img src="..." class="card-img-top" alt="..."> -->
<div class="card-body">
<h5 class="card-title">Bruiloften</h5>
<p class="card-text"></p>
<h4 class="card-title">Bruiloften</h4>
<p class="card-text">Lorem ipsum dolor sit amet ..</p>
</div>
</div>
</div>
</div>
</p>
<h2 class="section" id="section-wow">Werkwijze</h2>
<div class="row">
<div class="col-sm">
<div class="card">
<!-- <img src="..." class="card-img-top" alt="..."> -->
<p>
<div class="row text-center">
<div class="col-lg">
<div class="card h-100">
<div class="card-body">
<h5 class="card-title">Intake</h5>
<p class="card-text"></p>
<h4 class="card-title">
<i class="fa-solid fa-handshake-simple"></i>
<br>Intake
</h4>
<p class="card-text">Lorem ipsum dolor sit amet ..</p>
</div>
</div>
</div>
<div class="col-sm">
<div class="card">
<!-- <img src="..." class="card-img-top" alt="..."> -->
<div class="col-lg">
<div class="card h-100">
<div class="card-body">
<h5 class="card-title">Vluchtplan</h5>
<p class="card-text"></p>
<h4 class="card-title">
<i class="fa-solid fa-plane"></i>
<br>Vluchtplan
</h4>
<p class="card-text">Lorem ipsum dolor sit amet ..</p>
</div>
</div>
</div>
<div class="col-sm">
<div class="card">
<!-- <img src="..." class="card-img-top" alt="..."> -->
<div class="col-lg">
<div class="card h-100">
<div class="card-body">
<h5 class="card-title">Opname</h5>
<p class="card-text"></p>
<h4 class="card-title">
<i class="fa-solid fa-video"></i>
<br>Opname
</h4>
<p class="card-text">Lorem ipsum dolor sit amet ..</p>
</div>
</div>
</div>
<div class="col-sm">
<div class="card">
<!-- <img src="..." class="card-img-top" alt="..."> -->
<div class="col-lg">
<div class="card h-100">
<div class="card-body">
<h5 class="card-title">Montage</h5>
<p class="card-text"></p>
<h4 class="card-title">
<i class="fa-solid fa-wand-magic-sparkles"></i>
<br>Montage
</h4>
<p class="card-text">Lorem ipsum dolor sit amet ..</p>
</div>
</div>
</div>
</div>
</p>
<h2 class="section" id="section-contact">Contact</h2>
<p></p>