From c34558e70d1d78e6983d8685892773dfb74034b1 Mon Sep 17 00:00:00 2001 From: Bob Vandevliet Date: Thu, 3 Jul 2025 18:35:47 +0200 Subject: [PATCH] Pricing cards as reusable components and improved collapsibles. --- public/includes/pricing/cat-open.html | 43 ++++++++ public/includes/pricing/cat-specific.html | 51 +++++++++ public/includes/pricing/post-edit.html | 22 ++++ public/index.html | 120 +--------------------- src/scss/styles.scss | 20 +++- 5 files changed, 138 insertions(+), 118 deletions(-) create mode 100644 public/includes/pricing/cat-open.html create mode 100644 public/includes/pricing/cat-specific.html create mode 100644 public/includes/pricing/post-edit.html diff --git a/public/includes/pricing/cat-open.html b/public/includes/pricing/cat-open.html new file mode 100644 index 0000000..ea614a5 --- /dev/null +++ b/public/includes/pricing/cat-open.html @@ -0,0 +1,43 @@ +
+
+

Open categorie

+

vanaf €299,-

+

Geschikt voor indoor en vluchten in ongecontroleerd luchtruim met een laag risico:

+
    +
  • Bedrijfsvideo
    • +
  • Vastgoed
    • +
+

Inclusief:

+
    +
  • + +
    + Elk project begint met een goede voorbereiding. Daarom plan ik graag een persoonlijk gesprek met je in. We bespreken jouw doelen, wensen en visie, creatieve ideeën over de inhoud, en de gewenste toon en stijl. Wat wil je bereiken met de dronevideo? Wat is de boodschap die je wilt overbrengen? Wie is je doelgroep? Op basis van deze informatie maak ik een passende offerte binnen jouw budget. +
    +
    • +
  • + +
    + Samen maken we een script of draaiboek. Zo komt jouw boodschap optimaal in beeld. Komen er ook mensen in beeld? Dan zorgen we er samen voor dat zij goed voorbereid zijn en precies weten wat ze moeten doen. +
    +
    • +
  • + +
    + Op de afgesproken datum en locatie begin ik met het opnemen van jouw dronevideo. Tijdens het filmen houd ik rekening met jouw wensen en zorg ik ervoor dat we binnen de afgesproken tijd en budget blijven. Zijn er drone opnames buiten gepland en werkt het weer niet mee? Dan plannen we kosteloos een nieuwe datum om de drone opnames te voltooien. +
    +
    • +
  • Kwaliteit tot 4K, 60FPS
    • +
  • Binnen filmen is altijd mogelijk
    • +
  • Buiten filmen in open categorie A3
    • +
  • Reiskosten à €0.35 /km vanuit Arnhem
    • +
  • Binnen 3 werkdagen geleverd
    • +
+
+
\ No newline at end of file diff --git a/public/includes/pricing/cat-specific.html b/public/includes/pricing/cat-specific.html new file mode 100644 index 0000000..1e1b508 --- /dev/null +++ b/public/includes/pricing/cat-specific.html @@ -0,0 +1,51 @@ +
+
+

Specifieke categorie (binnenkort mogelijk)

+

vanaf €399,-

+

Vereist voor vluchten met een hoger risico of in gecontroleerd luchtruim:

+
    +
  • Recreatie
    • +
  • Sport
    • +
  • Evenementen
    • +
+

Inclusief:

+
    +
  • + +
    + Elk project begint met een goede voorbereiding. Daarom plan ik graag een persoonlijk gesprek met je in. We bespreken jouw doelen, wensen en visie, creatieve ideeën over de inhoud, en de gewenste toon en stijl. Wat wil je bereiken met de dronevideo? Wat is de boodschap die je wilt overbrengen? Wie is je doelgroep? Op basis van deze informatie maak ik een passende offerte binnen jouw budget. +
    +
    • +
  • + +
    + Samen maken we een script of draaiboek. Zo komt jouw boodschap optimaal in beeld. Komen er ook mensen in beeld? Dan zorgen we er samen voor dat zij goed voorbereid zijn en precies weten wat ze moeten doen. +
    +
    • +
  • + +
    + Om te mogen vliegen in de specifieke categorie is vaak extra administratie nodig. Denk aan het maken van een operationeel vluchtplan en het verkrijgen van toestemming. +
    +
    • +
  • + +
    + Op de afgesproken datum en locatie begin ik met het opnemen van jouw dronevideo. Tijdens het filmen houd ik rekening met jouw wensen en zorg ik ervoor dat we binnen de afgesproken tijd en budget blijven. Zijn er drone opnames buiten gepland en werkt het weer niet mee? Dan plannen we kosteloos een nieuwe datum om de drone opnames te voltooien. +
    +
    • +
  • Kwaliteit tot 4K, 60FPS
    • +
  • Buiten filmen in specifieke categorie
    • +
  • Reiskosten à €0.35 /km vanuit Arnhem
    • +
  • Binnen 3 werkdagen geleverd
    • +
+
+
\ No newline at end of file diff --git a/public/includes/pricing/post-edit.html b/public/includes/pricing/post-edit.html new file mode 100644 index 0000000..73f247a --- /dev/null +++ b/public/includes/pricing/post-edit.html @@ -0,0 +1,22 @@ +
+
+

Nabewerking (optioneel)

+

+ vanaf €389,-
+ Meerprijs wordt bepaald door de hoeveelheid beeldmateriaal, lengte van de video en complexiteit van de montage. +

+

+

    +
  • + +
    + Zodra de drone opnames zijn gemaakt, kiezen we samen de beste beelden uit. Daarna breng ik jouw verhaal zorgvuldig tot leven met beeld-, geluids- en kleurbewerking, zodat jouw bedrijf, merk, product of dienst zo goed mogelijk gepresenteerd wordt. Ik zorg ervoor dat de visuele montage aansluit bij je doelgroep en lever jouw dronevideo in de juiste formaten voor de gewenste mediakanalen. +
    +
    • +
  • Levertermijn in overleg
    • +
+

+
+
\ No newline at end of file diff --git a/public/index.html b/public/index.html index 62801ea..5589a14 100644 --- a/public/index.html +++ b/public/index.html @@ -121,129 +121,15 @@
-
-
-

Open categorie

-

vanaf €299,-

-

Geschikt voor indoor en vluchten in ongecontroleerd luchtruim met een laag risico:

-
    -
  • Bedrijfsvideo
    • -
  • Vastgoed
    • -
-

Inclusief:

-
    -
  • - -
    - Elk project begint met een goede voorbereiding. Daarom plan ik graag een persoonlijk gesprek met je in. We bespreken jouw doelen, wensen en visie, creatieve ideeën over de inhoud, en de gewenste toon en stijl. Wat wil je bereiken met de dronevideo? Wat is de boodschap die je wilt overbrengen? Wie is je doelgroep? Op basis van deze informatie maak ik een passende offerte binnen jouw budget. -
    -
    • -
  • - -
    - Samen maken we een script of draaiboek. Zo komt jouw boodschap optimaal in beeld. Komen er ook mensen in beeld? Dan zorgen we er samen voor dat zij goed voorbereid zijn en precies weten wat ze moeten doen. -
    -
    • -
  • - -
    - Op de afgesproken datum en locatie begin ik met het opnemen van jouw dronevideo. Tijdens het filmen houd ik rekening met jouw wensen en zorg ik ervoor dat we binnen de afgesproken tijd en budget blijven. Zijn er drone opnames buiten gepland en werkt het weer niet mee? Dan plannen we kosteloos een nieuwe datum om de drone opnames te voltooien. -
    -
    • -
  • Kwaliteit tot 4K, 60FPS
    • -
  • Binnen filmen is altijd mogelijk
    • -
  • Buiten filmen in open categorie A3
    • -
  • Reiskosten à €0.35 /km vanuit Arnhem
    • -
  • Binnen 3 werkdagen geleverd
    • -
-
-
+
-
-
-

Specifieke categorie (binnenkort mogelijk)

-

vanaf €399,-

-

Vereist voor vluchten met een hoger risico of in gecontroleerd luchtruim:

-
    -
  • Recreatie
    • -
  • Sport
    • -
  • Evenementen
    • -
-

Inclusief:

-
    -
  • - -
    - Elk project begint met een goede voorbereiding. Daarom plan ik graag een persoonlijk gesprek met je in. We bespreken jouw doelen, wensen en visie, creatieve ideeën over de inhoud, en de gewenste toon en stijl. Wat wil je bereiken met de dronevideo? Wat is de boodschap die je wilt overbrengen? Wie is je doelgroep? Op basis van deze informatie maak ik een passende offerte binnen jouw budget. -
    -
    • -
  • - -
    - Samen maken we een script of draaiboek. Zo komt jouw boodschap optimaal in beeld. Komen er ook mensen in beeld? Dan zorgen we er samen voor dat zij goed voorbereid zijn en precies weten wat ze moeten doen. -
    -
    • -
  • - -
    - Om te mogen vliegen in de specifieke categorie is vaak extra administratie nodig. Denk aan het maken van een operationeel vluchtplan en het verkrijgen van toestemming. -
    -
    • -
  • - -
    - Op de afgesproken datum en locatie begin ik met het opnemen van jouw dronevideo. Tijdens het filmen houd ik rekening met jouw wensen en zorg ik ervoor dat we binnen de afgesproken tijd en budget blijven. Zijn er drone opnames buiten gepland en werkt het weer niet mee? Dan plannen we kosteloos een nieuwe datum om de drone opnames te voltooien. -
    -
    • -
  • Kwaliteit tot 4K, 60FPS
    • -
  • Buiten filmen in specifieke categorie
    • -
  • Reiskosten à €0.35 /km vanuit Arnhem
    • -
  • Binnen 3 werkdagen geleverd
    • -
-
-
+
-
-
-
-

Nabewerking (optioneel)

-

- vanaf €389,-
- Meerprijs wordt bepaald door de hoeveelheid beeldmateriaal, lengte van de video en complexiteit van de montage. -

-

-

    -
  • - -
    - Zodra de drone opnames zijn gemaakt, kiezen we samen de beste beelden uit. Daarna breng ik jouw verhaal zorgvuldig tot leven met beeld-, geluids- en kleurbewerking, zodat jouw bedrijf, merk, product of dienst zo goed mogelijk gepresenteerd wordt. Ik zorg ervoor dat de visuele montage aansluit bij je doelgroep en lever jouw dronevideo in de juiste formaten voor de gewenste mediakanalen. -
    -
    • -
  • Levertermijn in overleg
    • -
-

-
-
+
diff --git a/src/scss/styles.scss b/src/scss/styles.scss index 0a18ac6..0064172 100644 --- a/src/scss/styles.scss +++ b/src/scss/styles.scss @@ -19,6 +19,7 @@ $primary: $red; // Default: $blue $carousel-indicator-active-bg-dark: $white; $carousel-caption-color-dark: $white; $carousel-control-icon-filter-dark: unset; +$accordion-icon-width: 1rem; // Include remainder of required parts @import "bootstrap/scss/maps"; @@ -38,7 +39,7 @@ $carousel-control-icon-filter-dark: unset; @import "bootstrap/scss/images"; @import "bootstrap/scss/list-group"; @import "bootstrap/scss/transitions"; -// @import "bootstrap/scss/accordion"; +@import "bootstrap/scss/accordion"; // @import "bootstrap/scss/alert"; // @import "bootstrap/scss/badge"; // @import "bootstrap/scss/breadcrumb"; @@ -330,6 +331,23 @@ img.grayscale-effect { @extend .p-0; } +.accordion-button:not(.accordion .accordion-button) { + @extend .accordion; + + padding: unset; + color: unset; + background-color: unset; + box-shadow: unset; + border: 0; + + &::after { + width: var(--#{$prefix}accordion-btn-icon-width); + height: var(--#{$prefix}accordion-btn-icon-width); + margin-left: .5rem; + @include transition(var(--#{$prefix}accordion-btn-icon-transition)); + } +} + .list-group-item { background-color: inherit; border: solid var(--bs-body-bg);