Update contact navigation and add contact page

Updated all "Contact" links to use the new /contact route. Added Contact.razor and its CSS for the contact page. Adjusted section IDs for navigation consistency and updated footer navigation.
2026-05-03 13:48:08 +02:00
parent f343738db5
commit 1aff354735
9 changed files with 69 additions and 9 deletions
@@ -0,0 +1,22 @@
+@page "/contact"
+@using For_Real_Consulting.Components.Sections
+
+<PageTitle>Contact - For Real Consulting</PageTitle>
+
+<div id="top"></div>
+<div class="frc-contact-layout">
+    <FrcNav />
+
+    <section class="frc-contact-page">
+        <h1>Contact</h1>
+        <p>Plan een kennismaking met For Real Consulting.</p>
+
+        <div class="frc-contact-links">
+            <a href="mailto:info@forrealconsulting.be">info@forrealconsulting.be</a>
+            <a href="tel:0476171249">0476 17 12 49</a>
+            <a href="/">Terug naar home</a>
+        </div>
+    </section>
+
+    <FrcFooter />
+</div>
@@ -0,0 +1,37 @@
+.frc-contact-layout {
+    min-height: 100vh;
+    display: flex;
+    flex-direction: column;
+}
+
+.frc-contact-page {
+    flex: 1;
+    min-height: 0;
+    padding: 6rem 2rem;
+    background: #13171a;
+    color: #ffffff;
+}
+
+.frc-contact-page h1 {
+    margin: 0 0 1rem;
+    font-weight: 300;
+    text-transform: uppercase;
+}
+
+.frc-contact-page p {
+    margin: 0 0 2rem;
+    color: #9ca3af;
+}
+
+.frc-contact-links {
+    display: grid;
+    gap: 0.75rem;
+}
+
+.frc-contact-links a {
+    color: #c5a368;
+}
+
+.frc-contact-links a:hover {
+    color: #ffffff;
+}
@@ -1,4 +1,4 @@
-<section class="frc-expertise-grid" id="expertise-grid">
+<section class="frc-expertise-grid" id="expertise">
    <h4>Onze Expertise</h4>

    <div class="frc-expertise-items">
@@ -19,6 +19,7 @@
                    <li><a href="#expertise">Expertise</a></li>
                    <li><a href="#over-ons">Over Ons</a></li>
                    <li><a href="#insights">Insights</a></li>
+                    <li><a href="/contact">Contact</a></li>
                </ul>
            </div>

@@ -9,7 +9,7 @@
            Wij brengen helderheid in cijfers, inzicht in cash en vertrouwen in beslissingen.
            Zodat jij vandaag de juiste keuzes maakt voor duurzame groei morgen.
        </p>
-        <a href="#contact" class="frc-outline-btn">Plan een kennismaking</a>
+        <a href="/contact" class="frc-outline-btn">Plan een kennismaking</a>
    </div>
    <div class="frc-hero-image-col">
        <img src="images/landscape.png" alt="For Real Consulting" class="frc-hero-img" />
@@ -1,4 +1,4 @@
-<section class="frc-impact" id="expertise">
+<section class="frc-impact" id="aanpak">
    <div class="frc-impact-content">
        <h4>Waarom partneren met FRC?</h4>
        <h2>Meer dan cijfers.<br /><span>Écht impact.</span></h2>
@@ -11,10 +11,10 @@
        <a href="#expertise">Expertise</a>
        <a href="#over-ons">Over Ons</a>
        <a href="#insights">Insights</a>
-        <a href="#contact">Contact</a>
+        <a href="/contact">Contact</a>
    </div>

-    <a href="#contact" class="frc-outline-btn frc-nav-cta">Plan een kennismaking</a>
+    <a href="/contact" class="frc-outline-btn frc-nav-cta">Plan een kennismaking</a>

    <button class="frc-hamburger" aria-label="Menu" aria-expanded="@_menuOpen" @onclick="ToggleMenu">
        <span></span>
@@ -31,8 +31,8 @@
        <a href="#expertise"  @onclick="CloseMenu">Expertise</a>
        <a href="#over-ons"   @onclick="CloseMenu">Over Ons</a>
        <a href="#insights"   @onclick="CloseMenu">Insights</a>
-        <a href="#contact"    @onclick="CloseMenu">Contact</a>
-        <a href="#contact" class="frc-outline-btn" @onclick="CloseMenu">Plan een kennismaking</a>
+        <a href="/contact"    @onclick="CloseMenu">Contact</a>
+        <a href="/contact" class="frc-outline-btn" @onclick="CloseMenu">Plan een kennismaking</a>
    </div>
 }

@@ -9,7 +9,7 @@
            </h2>
            <div class="frc-team-divider"></div>
            <p>Laten we kennismaken en ontdekken hoe wij jouw organisatie vooruithelpen.</p>
-            <a href="#contact" class="frc-outline-btn">Plan een kennismaking</a>
+            <a href="/contact" class="frc-outline-btn">Plan een kennismaking</a>
        </div>

        <article class="frc-team-card">
@@ -1,4 +1,4 @@
-<section class="frc-values" id="aanpak">
+<section class="frc-values" id="values">
    <article>
        <div class="frc-value-icon">
            <svg width="40" height="40" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1" stroke-linecap="round" stroke-linejoin="round">