How to Use This Template

Stack

This template is plain HTML5, real Bootstrap 5.3 (loaded via the jsDelivr CDN), Bootstrap Icons (also via CDN), and vanilla JavaScript. There is no build step to run the site — every page is static markup you can edit directly and open straight in a browser. Because Bootstrap, the icon font, Google Fonts and every photo are loaded from CDNs, the site needs an internet connection to render fully.

Changing the Color Palette

All brand colors are CSS custom properties defined once at the top of assets/css/style.css, and mirrored into Bootstrap's own theming variables (--bs-primary, --bs-btn-bg, etc.) so the whole site — including native Bootstrap components — updates from one place:

--primary-color:#1F4D3A;
--secondary-color:#6F8F72;
--light-sage:#DCE7DC;
--light-bg:#F7F5EF;
--warm-beige:#E8E0D1;
--accent-color:#B86645;
--dark-text:#1D2A22;
--light-text:#FFFFFF;

Editing Content

Every page is independent, static HTML — open the file for the page you want to change and edit the markup directly. There's no database and no templating to fight with. Header, footer, and navigation are repeated on each page, so a global change (like adding a nav link) needs to be made once per file.

Dark Mode & RTL

Dark mode toggles via the moon/sun icon in the header and is saved to localStorage (key fernleigh-theme); with no saved preference, the visitor's OS-level setting is used automatically. RTL support is driven by a dir="rtl" attribute on <html> — assets/css/rtl.css handles the mirrored layout for Arabic- and Hebrew-style reading direction.

Forms

Every form uses a lightweight data-validate / data-rules pattern (see assets/js/main.js) for accessible client-side validation with no library dependency. Point any form's action attribute at Formspree, Netlify Forms, Mailchimp, or your own backend to make it functional.