tom/diana
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix: use relative paths throughout for local file:// compatibility

Browse Source
This commit is contained in:
Tom Roth
2026-07-31 08:49:29 +02:00
parent 34f7f5a1f5
commit 36854833dc
9 changed files with 49 additions and 30 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/_includes/components/cta-band.njk
View File

@@ -3,6 +3,6 @@
<p class="section-eyebrow">Ready to get started?</p>
<h2 class="cta-band__title">Let's talk about your project.</h2>
<p class="cta-band__sub">Diana responds within 1&ndash;2 business days.</p>
<a href="/contact/" class="btn btn--ghost-white">Request a Quote</a>
<a href="{{ rootPath }}contact/" class="btn btn--ghost-white">Request a Quote</a>
</div>
</section>

4
src/_includes/components/footer.njk
View File

@@ -2,7 +2,7 @@
<div class="footer__inner container">
<div>
<a href="/" class="footer__brand">HER</a>
<a href="{{ rootPath }}" class="footer__brand">HER</a>
<p class="footer__tagline">Home Enhancement and Renovation<br>San Francisco &amp; Bay Area</p>
</div>
@@ -10,7 +10,7 @@
<p class="footer__nav-heading">Services</p>
<ul class="footer__nav" role="list">
{% for service in services %}
<li><a href="/services/{{ service.slug }}/">{{ service.name }}</a></li>
<li><a href="{{ rootPath }}services/{{ service.slug }}/">{{ service.name }}</a></li>
{% endfor %}
</ul>
</nav>

22
src/_includes/components/nav.njk
View File

@@ -3,14 +3,14 @@
<header class="nav" role="banner">
<div class="nav__inner container">
<a href="/" class="nav__brand" aria-label="HER Home Enhancement and Renovation — Home">HER</a>
<a href="{{ rootPath }}" class="nav__brand" aria-label="HER Home Enhancement and Renovation — Home">HER</a>
<nav aria-label="Main navigation">
<ul class="nav__links" role="list">
<li><a href="/about/">About</a></li>
<li><a href="/services/">Services</a></li>
<li><a href="/testimonials/">Testimonials</a></li>
<li><a href="/contact/">Contact</a></li>
<li><a href="{{ rootPath }}about/">About</a></li>
<li><a href="{{ rootPath }}services/">Services</a></li>
<li><a href="{{ rootPath }}testimonials/">Testimonials</a></li>
<li><a href="{{ rootPath }}contact/">Contact</a></li>
</ul>
</nav>
@@ -21,7 +21,7 @@
</svg>
</a>
<a href="/contact/" class="btn btn--primary" style="display:none" id="nav-cta">Request a Quote</a>
<a href="{{ rootPath }}contact/" class="btn btn--primary" style="display:none" id="nav-cta">Request a Quote</a>
<button
class="nav__toggle"
@@ -42,13 +42,13 @@
<button class="nav__overlay-close" aria-label="Close menu">&#x2715;</button>
<nav aria-label="Mobile navigation">
<ul role="list">
<li><a href="/about/">About</a></li>
<li><a href="/services/">Services</a></li>
<li><a href="/testimonials/">Testimonials</a></li>
<li><a href="/contact/">Contact</a></li>
<li><a href="{{ rootPath }}about/">About</a></li>
<li><a href="{{ rootPath }}services/">Services</a></li>
<li><a href="{{ rootPath }}testimonials/">Testimonials</a></li>
<li><a href="{{ rootPath }}contact/">Contact</a></li>
</ul>
</nav>
<a href="/contact/" class="btn btn--ghost-white btn--full">Request a Quote</a>
<a href="{{ rootPath }}contact/" class="btn btn--ghost-white btn--full">Request a Quote</a>
<a href="{{ site.phone | telHref }}" class="nav__overlay-phone">{{ site.phoneDisplay }}</a>
</div>

4
src/_includes/layouts/base.njk
View File

@@ -29,7 +29,7 @@
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@1,9..144,400&family=DM+Sans:ital,opsz,wght@0,9..40,400;0,9..40,500;0,9..40,600&display=swap">
<link rel="stylesheet" href="/css/main.css">
<link rel="stylesheet" href="{{ rootPath }}css/main.css">
{# Page-specific schema (e.g. Service schema passed via frontmatter) #}
{% if schema %}
@@ -78,6 +78,6 @@
{% include "components/footer.njk" %}
<script src="/js/main.js" defer></script>
<script src="{{ rootPath }}js/main.js" defer></script>
</body>
</html>

10
src/_includes/layouts/service.njk
View File

@@ -25,15 +25,15 @@ layout: layouts/base.njk
<div class="page-hero__inner container">
<nav class="breadcrumb" aria-label="Breadcrumb">
<ol role="list">
<li><a href="/">Home</a></li>
<li><a href="/services/">Services</a></li>
<li><a href="{{ rootPath }}">Home</a></li>
<li><a href="{{ rootPath }}services/">Services</a></li>
<li aria-current="page">{{ _title }}</li>
</ol>
</nav>
<p class="section-eyebrow">{{ _eyebrow }}</p>
<h1 class="page-hero__title">{{ _title }}</h1>
<p class="page-hero__lead">{{ _lead }}</p>
<a href="/contact/" class="btn btn--primary">Request a Quote</a>
<a href="{{ rootPath }}contact/" class="btn btn--primary">Request a Quote</a>
</div>
</section>
@@ -45,7 +45,7 @@ layout: layouts/base.njk
{% for image in _images %}
<figure>
<img
src="/assets/{{ image.file }}"
src="{{ rootPath }}assets/{{ image.file }}"
alt="{{ image.alt }}"
loading="{% if loop.first %}eager{% else %}lazy{% endif %}"
width="800"
@@ -70,7 +70,7 @@ layout: layouts/base.njk
<p>Diana serves San Francisco and the wider Bay Area within 50 miles, including Oakland, Berkeley, Marin County, Palo Alto, and beyond.</p>
</div>
<a href="/contact/" class="btn btn--primary">Request a Quote</a>
<a href="{{ rootPath }}contact/" class="btn btn--primary">Request a Quote</a>
</div>
</div>

4
src/about.njk
View File

@@ -19,7 +19,7 @@ ogImage: "diana_photo-min-1-scaled.webp"
<div class="about-page__image">
<img
src="/assets/diana_photo-min-1-scaled.webp"
src="{{ rootPath }}assets/diana_photo-min-1-scaled.webp"
alt="Diana on a sailboat with the Golden Gate Bridge in the background."
loading="eager"
width="800"
@@ -41,7 +41,7 @@ ogImage: "diana_photo-min-1-scaled.webp"
<p>Over 200 tile installations. Multimillion-dollar aerospace projects. Now she's working on yours.</p>
</blockquote>
<a href="/contact/" class="btn btn--primary">Request a Quote</a>
<a href="{{ rootPath }}contact/" class="btn btn--primary">Request a Quote</a>
</div>
</div>

10
src/index.njk
View File

@@ -15,7 +15,7 @@ ogImage: "diana_photo-min-1-scaled.webp"
<p class="lead-text">Precise, reliable, and easy to work with — Diana brings aerospace-level project coordination to your home improvement project.</p>
<div class="hero__actions">
<a href="/contact/" class="btn btn--primary">Request a Quote</a>
<a href="{{ rootPath }}contact/" class="btn btn--primary">Request a Quote</a>
<div class="hero__contact">
<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" focusable="false">
<path d="M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07A19.5 19.5 0 0 1 4.69 12 19.79 19.79 0 0 1 1.61 3.4 2 2 0 0 1 3.6 1.22h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L7.91 8.78a16 16 0 0 0 6 6l.92-.92a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 21.5 16h.5a2 2 0 0 1 .02.92z"/>
@@ -27,7 +27,7 @@ ogImage: "diana_photo-min-1-scaled.webp"
<div class="hero__image">
<img
src="/assets/diana_photo-min-1-scaled.webp"
src="{{ rootPath }}assets/diana_photo-min-1-scaled.webp"
alt="Diana on a sailboat with the Golden Gate Bridge in the background, smiling."
loading="eager"
fetchpriority="high"
@@ -48,10 +48,10 @@ ogImage: "diana_photo-min-1-scaled.webp"
<div class="services-grid container">
{% for service in services %}
<a href="/services/{{ service.slug }}/" class="service-card fade-up">
<a href="{{ rootPath }}services/{{ service.slug }}/" class="service-card fade-up">
<div class="service-card__image">
<img
src="/assets/{{ service.images[0].file }}"
src="{{ rootPath }}assets/{{ service.images[0].file }}"
alt="{{ service.images[0].alt }}"
loading="lazy"
>
@@ -111,7 +111,7 @@ ogImage: "diana_photo-min-1-scaled.webp"
<div class="testimonials-strip__header container">
<p class="section-eyebrow">Client reviews</p>
<h2>What people say.</h2>
<a href="/testimonials/" class="btn btn--secondary">All reviews</a>
<a href="{{ rootPath }}testimonials/" class="btn btn--secondary">All reviews</a>
</div>
<div class="testimonials-grid container">

4
src/services/index.njk
View File

@@ -21,10 +21,10 @@ description: "Browse Diana's services — painting, tile setting, drywall, plumb
<div class="services-grid container">
{% for service in services %}
<a href="/services/{{ service.slug }}/" class="service-card fade-up">
<a href="{{ rootPath }}services/{{ service.slug }}/" class="service-card fade-up">
<div class="service-card__image">
<img
src="/assets/{{ service.images[0].file }}"
src="{{ rootPath }}assets/{{ service.images[0].file }}"
alt="{{ service.images[0].alt }}"
loading="lazy"
>

19
src/src.11tydata.js Normal file
View File

@@ -0,0 +1,19 @@
// Directory data file: applies eleventyComputed to every template in src/
// and all subdirectories. Provides `rootPath` — the relative prefix needed
// to reach the site root from the current page.
//
// Examples:
// / → "./"
// /about/ → "../"
// /services/ → "../"
// /services/painting/ → "../../"
module.exports = {
eleventyComputed: {
rootPath: (data) => {
const url = data.page.url || "/";
const depth = url.split("/").filter((s) => s.length > 0).length;
return depth === 0 ? "./" : "../".repeat(depth);
},
},
};