patx/rcraft_const
Fill detail page heroes with background images and refresh asset caches
Commit 3186cb5 · patx · 2026-09-10T16:37:17-04:00
Comments
No comments yet.
Diff
diff --git a/docs/assets/site.css b/docs/assets/site.css
index a61e180..9e70a9f 100644
--- a/docs/assets/site.css
+++ b/docs/assets/site.css
@@ -1103,17 +1103,17 @@
.skip-link { position: fixed; left: 1rem; top: -100px; z-index: 1100; padding: 1rem; background: var(--gold); color: var(--dark); }
.skip-link:focus { top: 1rem; }
a:focus-visible, summary:focus-visible { outline: 2px solid var(--gold-light); outline-offset: 4px; }
-.detail-page #hero { min-height: auto; display: grid; grid-template-columns: 1.15fr 1fr; align-items: center; gap: 4rem; padding: 10rem 3rem 4rem; }
-.detail-page #hero::before { display: none; }
-.detail-hero-copy { min-width: 0; }
+.detail-page #hero { min-height: 85vh; min-height: 85svh; display: flex; align-items: center; padding: 10rem 3rem 5rem; }
+.detail-page #hero::before { display: block; }
+.detail-hero-copy { position: relative; z-index: 2; min-width: 0; width: 100%; max-width: 760px; }
.detail-hero h1 { font-size: clamp(2.8rem, 4.6vw, 5rem); line-height: 1.06; }
.detail-hero .hero-desc { max-width: 620px; }
.detail-hero .hero-actions { flex-wrap: wrap; }
.breadcrumbs { color: var(--light-stone); font-size: 0.75rem; line-height: 1.7; margin-bottom: 2.5rem; }
.breadcrumbs a { color: var(--light-stone); text-underline-offset: 3px; }
-.detail-hero-image { min-width: 0; margin: 0; border-bottom: 1px solid var(--gold); }
-.detail-hero-image img { display: block; width: 100%; aspect-ratio: 4/5; object-fit: cover; }
-.detail-hero-image figcaption { color: var(--light-stone); font-size: 0.7rem; letter-spacing: 0.05em; padding: 0.8rem 0; }
+.detail-hero-image { position: absolute; inset: 0; z-index: 0; min-width: 0; margin: 0; }
+.detail-hero-image img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; }
+.detail-hero-image figcaption { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.detail-layout { max-width: 1440px; margin: 0 auto; padding: 4rem 3rem 5rem; display: grid; grid-template-columns: minmax(0, 2fr) minmax(260px, 1fr); gap: 6rem; border-top: 1px solid rgba(184,146,58,0.2); }
.detail-section { margin-bottom: 3rem; }
.detail-section h2 { margin-bottom: 1.25rem; font-size: clamp(2rem, 3vw, 2.75rem); }
@@ -1142,7 +1142,6 @@ a:focus-visible, summary:focus-visible { outline: 2px solid var(--gold-light); o
.detail-enquiry .hero-actions { flex-wrap: wrap; }
@media (max-width: 1100px) {
.detail-layout { gap: 3rem; }
- .detail-page #hero { gap: 2rem; }
}
@media (max-width: 900px) {
.detail-page #hero { padding: 12rem 1.5rem 3rem; }
@@ -1152,9 +1151,8 @@ a:focus-visible, summary:focus-visible { outline: 2px solid var(--gold-light); o
}
@media (max-width: 600px) {
.location-guides { grid-template-columns: 1fr; gap: 0.5rem; }
- .detail-page #hero { grid-template-columns: 1fr; padding: 2rem 1rem 3rem; }
+ .detail-page #hero { padding: 4rem 1rem; }
.detail-hero h1 { font-size: clamp(2.5rem, 10vw, 3.5rem); }
- .detail-hero-image img { aspect-ratio: 4/3; }
.breadcrumbs { margin-bottom: 2rem; }
.detail-layout { padding: 3rem 1rem; }
.project-brief { padding: 1.5rem; }
diff --git a/docs/builders-harrow.html b/docs/builders-harrow.html
index 1ecc572..a87a3e7 100644
--- a/docs/builders-harrow.html
+++ b/docs/builders-harrow.html
@@ -22,7 +22,7 @@
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@300;400;500;600&family=Barlow:wght@300;400;500;600&display=swap" rel="stylesheet">
-<link rel="stylesheet" href="assets/site.css">
+<link rel="stylesheet" href="assets/site.css?v=20260910">
<script type="application/ld+json">
{
"@context": "https://schema.org",
@@ -209,7 +209,7 @@
<a class="skip-link" href="#main-content">Skip to content</a>
<nav class="site-nav" aria-label="Main navigation">
<a href="index.html#hero" class="nav-logo">
- <img class="logo-image" src="rcraft_logo.png" width="866" height="288" alt="R Craft Construction LTD">
+ <img class="logo-image" src="rcraft_logo.png?v=3" width="866" height="288" alt="R Craft Construction LTD">
</a>
<button class="nav-toggle" type="button" aria-label="Open navigation" aria-controls="primary-navigation" aria-expanded="false">
<span aria-hidden="true"></span>
@@ -247,7 +247,7 @@
<div class="footer-top">
<div class="footer-brand">
<a href="index.html#hero" class="footer-logo" aria-label="R Craft Construction LTD — back to top">
- <img class="footer-logo-image" src="rcraft_logo.png" width="866" height="288" alt="R Craft Construction LTD" loading="lazy" decoding="async">
+ <img class="footer-logo-image" src="rcraft_logo.png?v=3" width="866" height="288" alt="R Craft Construction LTD" loading="lazy" decoding="async">
</a>
<p class="footer-summary">Craftsmanship matters. From the first foundations to the finishing details, we build and improve homes across Watford, London and the surrounding areas.</p>
<a href="index.html#contact" class="btn-primary">Get a Quotation</a>
diff --git a/docs/builders-london.html b/docs/builders-london.html
index 3ed5a7f..405891f 100644
--- a/docs/builders-london.html
+++ b/docs/builders-london.html
@@ -22,7 +22,7 @@
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@300;400;500;600&family=Barlow:wght@300;400;500;600&display=swap" rel="stylesheet">
-<link rel="stylesheet" href="assets/site.css">
+<link rel="stylesheet" href="assets/site.css?v=20260910">
<script type="application/ld+json">
{
"@context": "https://schema.org",
@@ -209,7 +209,7 @@
<a class="skip-link" href="#main-content">Skip to content</a>
<nav class="site-nav" aria-label="Main navigation">
<a href="index.html#hero" class="nav-logo">
- <img class="logo-image" src="rcraft_logo.png" width="866" height="288" alt="R Craft Construction LTD">
+ <img class="logo-image" src="rcraft_logo.png?v=3" width="866" height="288" alt="R Craft Construction LTD">
</a>
<button class="nav-toggle" type="button" aria-label="Open navigation" aria-controls="primary-navigation" aria-expanded="false">
<span aria-hidden="true"></span>
@@ -247,7 +247,7 @@
<div class="footer-top">
<div class="footer-brand">
<a href="index.html#hero" class="footer-logo" aria-label="R Craft Construction LTD — back to top">
- <img class="footer-logo-image" src="rcraft_logo.png" width="866" height="288" alt="R Craft Construction LTD" loading="lazy" decoding="async">
+ <img class="footer-logo-image" src="rcraft_logo.png?v=3" width="866" height="288" alt="R Craft Construction LTD" loading="lazy" decoding="async">
</a>
<p class="footer-summary">Craftsmanship matters. From the first foundations to the finishing details, we build and improve homes across Watford, London and the surrounding areas.</p>
<a href="index.html#contact" class="btn-primary">Get a Quotation</a>
diff --git a/docs/builders-watford.html b/docs/builders-watford.html
index 677f6f1..7726d42 100644
--- a/docs/builders-watford.html
+++ b/docs/builders-watford.html
@@ -22,7 +22,7 @@
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@300;400;500;600&family=Barlow:wght@300;400;500;600&display=swap" rel="stylesheet">
-<link rel="stylesheet" href="assets/site.css">
+<link rel="stylesheet" href="assets/site.css?v=20260910">
<script type="application/ld+json">
{
"@context": "https://schema.org",
@@ -209,7 +209,7 @@
<a class="skip-link" href="#main-content">Skip to content</a>
<nav class="site-nav" aria-label="Main navigation">
<a href="index.html#hero" class="nav-logo">
- <img class="logo-image" src="rcraft_logo.png" width="866" height="288" alt="R Craft Construction LTD">
+ <img class="logo-image" src="rcraft_logo.png?v=3" width="866" height="288" alt="R Craft Construction LTD">
</a>
<button class="nav-toggle" type="button" aria-label="Open navigation" aria-controls="primary-navigation" aria-expanded="false">
<span aria-hidden="true"></span>
@@ -247,7 +247,7 @@
<div class="footer-top">
<div class="footer-brand">
<a href="index.html#hero" class="footer-logo" aria-label="R Craft Construction LTD — back to top">
- <img class="footer-logo-image" src="rcraft_logo.png" width="866" height="288" alt="R Craft Construction LTD" loading="lazy" decoding="async">
+ <img class="footer-logo-image" src="rcraft_logo.png?v=3" width="866" height="288" alt="R Craft Construction LTD" loading="lazy" decoding="async">
</a>
<p class="footer-summary">Craftsmanship matters. From the first foundations to the finishing details, we build and improve homes across Watford, London and the surrounding areas.</p>
<a href="index.html#contact" class="btn-primary">Get a Quotation</a>
diff --git a/docs/extensions-and-conversions.html b/docs/extensions-and-conversions.html
index a8875ff..06a1901 100644
--- a/docs/extensions-and-conversions.html
+++ b/docs/extensions-and-conversions.html
@@ -22,7 +22,7 @@
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@300;400;500;600&family=Barlow:wght@300;400;500;600&display=swap" rel="stylesheet">
-<link rel="stylesheet" href="assets/site.css">
+<link rel="stylesheet" href="assets/site.css?v=20260910">
<script type="application/ld+json">
{
"@context": "https://schema.org",
@@ -229,7 +229,7 @@
<a class="skip-link" href="#main-content">Skip to content</a>
<nav class="site-nav" aria-label="Main navigation">
<a href="index.html#hero" class="nav-logo">
- <img class="logo-image" src="rcraft_logo.png" width="866" height="288" alt="R Craft Construction LTD">
+ <img class="logo-image" src="rcraft_logo.png?v=3" width="866" height="288" alt="R Craft Construction LTD">
</a>
<button class="nav-toggle" type="button" aria-label="Open navigation" aria-controls="primary-navigation" aria-expanded="false">
<span aria-hidden="true"></span>
@@ -267,7 +267,7 @@
<div class="footer-top">
<div class="footer-brand">
<a href="index.html#hero" class="footer-logo" aria-label="R Craft Construction LTD — back to top">
- <img class="footer-logo-image" src="rcraft_logo.png" width="866" height="288" alt="R Craft Construction LTD" loading="lazy" decoding="async">
+ <img class="footer-logo-image" src="rcraft_logo.png?v=3" width="866" height="288" alt="R Craft Construction LTD" loading="lazy" decoding="async">
</a>
<p class="footer-summary">Craftsmanship matters. From the first foundations to the finishing details, we build and improve homes across Watford, London and the surrounding areas.</p>
<a href="index.html#contact" class="btn-primary">Get a Quotation</a>
diff --git a/docs/groundworks-and-concrete.html b/docs/groundworks-and-concrete.html
index f954a91..b6a9f92 100644
--- a/docs/groundworks-and-concrete.html
+++ b/docs/groundworks-and-concrete.html
@@ -22,7 +22,7 @@
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@300;400;500;600&family=Barlow:wght@300;400;500;600&display=swap" rel="stylesheet">
-<link rel="stylesheet" href="assets/site.css">
+<link rel="stylesheet" href="assets/site.css?v=20260910">
<script type="application/ld+json">
{
"@context": "https://schema.org",
@@ -229,7 +229,7 @@
<a class="skip-link" href="#main-content">Skip to content</a>
<nav class="site-nav" aria-label="Main navigation">
<a href="index.html#hero" class="nav-logo">
- <img class="logo-image" src="rcraft_logo.png" width="866" height="288" alt="R Craft Construction LTD">
+ <img class="logo-image" src="rcraft_logo.png?v=3" width="866" height="288" alt="R Craft Construction LTD">
</a>
<button class="nav-toggle" type="button" aria-label="Open navigation" aria-controls="primary-navigation" aria-expanded="false">
<span aria-hidden="true"></span>
@@ -267,7 +267,7 @@
<div class="footer-top">
<div class="footer-brand">
<a href="index.html#hero" class="footer-logo" aria-label="R Craft Construction LTD — back to top">
- <img class="footer-logo-image" src="rcraft_logo.png" width="866" height="288" alt="R Craft Construction LTD" loading="lazy" decoding="async">
+ <img class="footer-logo-image" src="rcraft_logo.png?v=3" width="866" height="288" alt="R Craft Construction LTD" loading="lazy" decoding="async">
</a>
<p class="footer-summary">Craftsmanship matters. From the first foundations to the finishing details, we build and improve homes across Watford, London and the surrounding areas.</p>
<a href="index.html#contact" class="btn-primary">Get a Quotation</a>
diff --git a/docs/index.html b/docs/index.html
index dd23e86..fd9e79e 100644
--- a/docs/index.html
+++ b/docs/index.html
@@ -169,13 +169,13 @@
"email": "[email protected]"
}
</script>
-<link rel="stylesheet" href="assets/site.css">
+<link rel="stylesheet" href="assets/site.css?v=20260910">
</head>
<body>
<nav class="site-nav" aria-label="Main navigation">
<a href="#hero" class="nav-logo">
- <img class="logo-image" src="rcraft_logo.png" width="866" height="288" alt="R Craft Construction LTD">
+ <img class="logo-image" src="rcraft_logo.png?v=3" width="866" height="288" alt="R Craft Construction LTD">
</a>
<button class="nav-toggle" type="button" aria-label="Open navigation" aria-controls="primary-navigation" aria-expanded="false">
<span aria-hidden="true"></span>
@@ -497,7 +497,7 @@
<div class="footer-top">
<div class="footer-brand">
<a href="#hero" class="footer-logo" aria-label="R Craft Construction LTD — back to top">
- <img class="footer-logo-image" src="rcraft_logo.png" width="866" height="288" alt="R Craft Construction LTD" loading="lazy" decoding="async">
+ <img class="footer-logo-image" src="rcraft_logo.png?v=3" width="866" height="288" alt="R Craft Construction LTD" loading="lazy" decoding="async">
</a>
<p class="footer-summary">Craftsmanship matters. From the first foundations to the finishing details, we build and improve homes across Watford, London and the surrounding areas.</p>
<a href="#contact" class="btn-primary">Get a Quotation</a>
diff --git a/docs/property-refurbishments.html b/docs/property-refurbishments.html
index ed3f84e..bc77184 100644
--- a/docs/property-refurbishments.html
+++ b/docs/property-refurbishments.html
@@ -22,7 +22,7 @@
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@300;400;500;600&family=Barlow:wght@300;400;500;600&display=swap" rel="stylesheet">
-<link rel="stylesheet" href="assets/site.css">
+<link rel="stylesheet" href="assets/site.css?v=20260910">
<script type="application/ld+json">
{
"@context": "https://schema.org",
@@ -229,7 +229,7 @@
<a class="skip-link" href="#main-content">Skip to content</a>
<nav class="site-nav" aria-label="Main navigation">
<a href="index.html#hero" class="nav-logo">
- <img class="logo-image" src="rcraft_logo.png" width="866" height="288" alt="R Craft Construction LTD">
+ <img class="logo-image" src="rcraft_logo.png?v=3" width="866" height="288" alt="R Craft Construction LTD">
</a>
<button class="nav-toggle" type="button" aria-label="Open navigation" aria-controls="primary-navigation" aria-expanded="false">
<span aria-hidden="true"></span>
@@ -267,7 +267,7 @@
<div class="footer-top">
<div class="footer-brand">
<a href="index.html#hero" class="footer-logo" aria-label="R Craft Construction LTD — back to top">
- <img class="footer-logo-image" src="rcraft_logo.png" width="866" height="288" alt="R Craft Construction LTD" loading="lazy" decoding="async">
+ <img class="footer-logo-image" src="rcraft_logo.png?v=3" width="866" height="288" alt="R Craft Construction LTD" loading="lazy" decoding="async">
</a>
<p class="footer-summary">Craftsmanship matters. From the first foundations to the finishing details, we build and improve homes across Watford, London and the surrounding areas.</p>
<a href="index.html#contact" class="btn-primary">Get a Quotation</a>
diff --git a/docs/structural-works.html b/docs/structural-works.html
index 4667bd1..11bf96c 100644
--- a/docs/structural-works.html
+++ b/docs/structural-works.html
@@ -22,7 +22,7 @@
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@300;400;500;600&family=Barlow:wght@300;400;500;600&display=swap" rel="stylesheet">
-<link rel="stylesheet" href="assets/site.css">
+<link rel="stylesheet" href="assets/site.css?v=20260910">
<script type="application/ld+json">
{
"@context": "https://schema.org",
@@ -229,7 +229,7 @@
<a class="skip-link" href="#main-content">Skip to content</a>
<nav class="site-nav" aria-label="Main navigation">
<a href="index.html#hero" class="nav-logo">
- <img class="logo-image" src="rcraft_logo.png" width="866" height="288" alt="R Craft Construction LTD">
+ <img class="logo-image" src="rcraft_logo.png?v=3" width="866" height="288" alt="R Craft Construction LTD">
</a>
<button class="nav-toggle" type="button" aria-label="Open navigation" aria-controls="primary-navigation" aria-expanded="false">
<span aria-hidden="true"></span>
@@ -267,7 +267,7 @@
<div class="footer-top">
<div class="footer-brand">
<a href="index.html#hero" class="footer-logo" aria-label="R Craft Construction LTD — back to top">
- <img class="footer-logo-image" src="rcraft_logo.png" width="866" height="288" alt="R Craft Construction LTD" loading="lazy" decoding="async">
+ <img class="footer-logo-image" src="rcraft_logo.png?v=3" width="866" height="288" alt="R Craft Construction LTD" loading="lazy" decoding="async">
</a>
<p class="footer-summary">Craftsmanship matters. From the first foundations to the finishing details, we build and improve homes across Watford, London and the surrounding areas.</p>
<a href="index.html#contact" class="btn-primary">Get a Quotation</a>