amber/fatkiss
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Initial commit: Fat Kiss site — Hugo + Decap CMS

Browse Source
This commit is contained in:
Benjoe
2026-05-11 08:19:27 -10:00
commit aa0287eeaa
58 changed files with 3774 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
layouts/_default/baseof.html
+17
View File
@@ -0,0 +1,17 @@
<!DOCTYPE html>
<html lang="en">
<head>
{{ partial "head.html" . }}
{{ partial "seo.html" . }}
</head>
<body>
<a href="#main-content" class="skip-link">Skip to main content</a>
{{ partial "header.html" . }}
<main id="main-content">
{{ block "main" . }}{{ end }}
</main>
{{ partial "footer.html" . }}
{{ $js := resources.Get "js/main.js" | minify | fingerprint }}
<script src="{{ $js.RelPermalink }}" defer></script>
</body>
</html>
layouts/_default/list.html
+12
View File
@@ -0,0 +1,12 @@
{{ define "main" }}
<section class="section">
<div class="container">
<h1>{{ .Title }}</h1>
<div class="grid-3" style="margin-top:var(--fk-space-xl)">
{{ range .Pages }}
{{ partial "product-card.html" . }}
{{ end }}
</div>
</div>
</section>
{{ end }}
layouts/_default/single.html
+10
View File
@@ -0,0 +1,10 @@
{{ define "main" }}
<article class="page-enter">
<section class="section">
<div class="container container--narrow">
<h1>{{ .Title }}</h1>
<div class="section__body" style="margin-top:var(--fk-space-lg)">{{ .Content }}</div>
</div>
</section>
</article>
{{ end }}
layouts/about/single.html
+61
View File
@@ -0,0 +1,61 @@
{{ define "main" }}
<article class="page-enter">
<section class="about-hero">
<div class="container container--narrow">
<h1 class="about-hero__title">{{ .Title }}</h1>
<div class="about-hero__body">{{ .Content }}</div>
</div>
</section>
{{ with .Params.founder_story }}
<section class="about-section">
<div class="container container--narrow">
<h2 class="about-section__title">{{ .title }}</h2>
<div class="about-section__body">{{ .body | markdownify }}</div>
</div>
</section>
{{ end }}
{{ with .Params.product_philosophy }}
<section class="about-section">
<div class="container container--narrow">
<h2 class="about-section__title">{{ .title }}</h2>
<div class="about-section__body">{{ .body | markdownify }}</div>
</div>
</section>
{{ end }}
{{ with .Params.renaissance_woman }}
<section class="about-section">
<div class="container container--narrow">
<h2 class="about-section__title">{{ .title }}</h2>
<div class="about-section__body">{{ .body | markdownify }}</div>
</div>
</section>
{{ end }}
{{ with .Params.natural_ritual }}
<section class="about-section">
<div class="container container--narrow">
<h2 class="about-section__title">{{ .title }}</h2>
<div class="about-section__body">{{ .body | markdownify }}</div>
</div>
</section>
{{ end }}
{{ with .Params.future_vision }}
<section class="about-section">
<div class="container container--narrow">
<h2 class="about-section__title">{{ .title }}</h2>
<div class="about-section__body">{{ .body | markdownify }}</div>
</div>
</section>
{{ end }}
{{ with .Params.cta }}
<section class="section" style="text-align:center">
<a href="{{ .url }}" class="btn btn--primary btn--lg">{{ .label }}</a>
</section>
{{ end }}
</article>
{{ end }}
layouts/contact/single.html
+18
View File
@@ -0,0 +1,18 @@
{{ define "main" }}
<article class="page-enter">
<section class="section">
<div class="container container--narrow" style="text-align:center">
<p class="section__label">Contact</p>
<h1>Get in Touch</h1>
<p class="section__body" style="margin-top:var(--fk-space-md)">
Questions about the balms? Want to place an order? Just want to say hello? Amber reads every message.
</p>
</div>
</section>
<section class="section">
<div class="container">
{{ partial "contact-form.html" . }}
</div>
</section>
</article>
{{ end }}
layouts/index.html
+129
View File
@@ -0,0 +1,129 @@
{{ define "main" }}
{{ $home := .Site.Data.site.home }}
{{ if $home.hero.enabled }}
<section class="hero arcade-grid-bg">
<div class="container">
{{ if $home.hero.eyebrow }}
<p class="hero__eyebrow">{{ $home.hero.eyebrow }}</p>
{{ end }}
<h1 class="hero__logo">{{ $home.hero.headline | default "Fat Kiss" }}</h1>
{{ if $home.hero.subheadline }}
<p class="hero__subhead">{{ $home.hero.subheadline }}</p>
{{ end }}
{{ if $home.hero.body }}
<p class="hero__body">{{ $home.hero.body }}</p>
{{ end }}
<div class="hero__actions">
{{ if $home.hero.primary_cta_label }}
<a href="{{ $home.hero.primary_cta_url | default "/products/" }}" class="btn btn--primary btn--lg">{{ $home.hero.primary_cta_label }}</a>
{{ end }}
{{ if $home.hero.secondary_cta_label }}
<a href="{{ $home.hero.secondary_cta_url | default "/contact/" }}" class="btn btn--secondary btn--lg">{{ $home.hero.secondary_cta_label }}</a>
{{ end }}
</div>
</div>
</section>
{{ end }}
{{ if $home.brand_statement.enabled }}
<section class="section">
<div class="container container--narrow" style="text-align:center">
<h2>{{ $home.brand_statement.headline }}</h2>
<p class="section__body" style="margin-top:var(--fk-space-lg)">{{ $home.brand_statement.body }}</p>
</div>
</section>
{{ end }}
{{ if $home.featured_products.enabled }}
<section class="section">
<div class="container">
<p class="section__label">{{ $home.featured_products.title | default "The Balms" }}</p>
<h2 class="section__title">Meet the collection</h2>
<div class="grid-3">
{{ $slugs := $home.featured_products.product_slugs }}
{{ range where .Site.RegularPages "Section" "products" }}
{{ if in $slugs .File.ContentBaseName }}
{{ partial "product-card.html" . }}
{{ end }}
{{ end }}
</div>
</div>
</section>
{{ end }}
{{ if $home.ethos.enabled }}
<section class="section">
<div class="container container--narrow ethos-block">
<div class="ethos-block__icon">{{ partial "svg-logo.html" . }}</div>
<h2>{{ $home.ethos.title }}</h2>
<p class="section__body" style="margin-top:var(--fk-space-lg)">{{ $home.ethos.body }}</p>
{{ if $home.ethos.cta_label }}
<a href="{{ $home.ethos.cta_url | default "/about/" }}" class="btn btn--secondary" style="margin-top:var(--fk-space-xl)">{{ $home.ethos.cta_label }}</a>
{{ end }}
</div>
</section>
{{ end }}
{{ if and $home.reviews.enabled .Site.Data.reviews }}
<section class="section">
<div class="container">
<p class="section__label">Reviews</p>
<h2 class="section__title">What people are saying</h2>
<div class="grid-3">
{{ $reviews := slice }}
{{ range .Site.Data.reviews }}
{{ $reviews = $reviews | append . }}
{{ end }}
{{ range first ($home.reviews.max_items | default 3) (where $reviews "enabled" true) }}
<div class="review-card">
<p class="review-card__text">"{{ .review_text }}"</p>
<p class="review-card__author">{{ .reviewer_name }}</p>
{{ with .reviewer_location }}
<p class="review-card__location">{{ . }}</p>
{{ end }}
</div>
{{ end }}
</div>
</div>
</section>
{{ end }}
{{ if and $home.journal_preview.enabled (where .Site.RegularPages "Section" "journal" | len | gt 0) }}
<section class="section">
<div class="container">
<p class="section__label">Journal</p>
<h2 class="section__title">Notes from the studio</h2>
<div class="grid-2">
{{ range first ($home.journal_preview.max_items | default 2) (where .Site.RegularPages "Section" "journal") }}
<a href="{{ .RelPermalink }}" class="journal-card">
{{ with .Params.hero_image }}
<div class="journal-card__image"><img src="{{ . }}" alt="{{ $.Title }}" loading="lazy"></div>
{{ end }}
<div class="journal-card__body">
<p class="journal-card__date">{{ .Date.Format "January 2, 2006" }}</p>
<h3 class="journal-card__title">{{ .Title }}</h3>
{{ with .Params.summary }}
<p class="journal-card__summary">{{ . }}</p>
{{ end }}
</div>
</a>
{{ end }}
</div>
</div>
</section>
{{ end }}
{{ if $home.waitlist.enabled }}
<section class="section">
<div class="container container--narrow">
<div class="waitlist-block">
<h2 class="waitlist-block__title">{{ $home.waitlist.title }}</h2>
<p class="waitlist-block__body">{{ $home.waitlist.body }}</p>
<a href="{{ $home.waitlist.cta_url | default "/contact/" }}" class="btn btn--primary">{{ $home.waitlist.cta_label }}</a>
</div>
</div>
</section>
{{ end }}
{{ end }}
layouts/journal/list.html
+30
View File
@@ -0,0 +1,30 @@
{{ define "main" }}
<article class="page-enter">
<section class="section">
<div class="container">
<p class="section__label">Journal</p>
<h1 class="section__title">Notes from the Studio</h1>
</div>
</section>
<section class="section">
<div class="container">
<div class="grid-2">
{{ range .Pages }}
<a href="{{ .RelPermalink }}" class="journal-card">
{{ with .Params.hero_image }}
<div class="journal-card__image"><img src="{{ . }}" alt="{{ $.Title }}" loading="lazy"></div>
{{ end }}
<div class="journal-card__body">
<p class="journal-card__date">{{ .Date.Format "January 2, 2006" }}</p>
<h3 class="journal-card__title">{{ .Title }}</h3>
{{ with .Params.summary }}
<p class="journal-card__summary">{{ . }}</p>
{{ end }}
</div>
</a>
{{ end }}
</div>
</div>
</section>
</article>
{{ end }}
layouts/journal/single.html
+25
View File
@@ -0,0 +1,25 @@
{{ define "main" }}
<article class="page-enter">
<section class="section">
<div class="container container--narrow">
<p class="section__label">{{ .Date.Format "January 2, 2006" }}</p>
<h1>{{ .Title }}</h1>
{{ with .Params.summary }}
<p class="section__body" style="margin-top:var(--fk-space-md)">{{ . }}</p>
{{ end }}
</div>
</section>
{{ with .Params.hero_image }}
<section class="section">
<div class="container">
<img src="{{ . }}" alt="{{ $.Title }}" style="border-radius:var(--fk-radius-lg);width:100%;max-height:500px;object-fit:cover">
</div>
</section>
{{ end }}
<section class="section">
<div class="container container--narrow">
<div class="section__body">{{ .Content }}</div>
</div>
</section>
</article>
{{ end }}
layouts/partials/contact-form.html
+52
View File
@@ -0,0 +1,52 @@
{{/* Contact form partial */}}
<form class="contact-form" id="contactForm" method="POST" action="/api/contact">
<div class="form-honeypot" aria-hidden="true">
<label for="website">Leave empty</label>
<input type="text" id="website" name="website" tabindex="-1" autocomplete="off">
</div>
<div class="form-group">
<label for="name" class="form-label">Name</label>
<input type="text" id="name" name="name" class="form-input" required maxlength="100" autocomplete="name">
</div>
<div class="form-group">
<label for="email" class="form-label">Email</label>
<input type="email" id="email" name="email" class="form-input" required maxlength="200" autocomplete="email">
</div>
<div class="form-group">
<label for="category" class="form-label">What's this about?</label>
<select id="category" name="category" class="form-select" required>
<option value="">Select a topic…</option>
<option value="product_question">Product question</option>
<option value="order_inquiry">Order inquiry</option>
<option value="wholesale">Wholesale</option>
<option value="collaboration_press">Collaboration / Press</option>
<option value="general">General</option>
</select>
</div>
<div class="form-group">
<label for="product_interest" class="form-label">Product interest (optional)</label>
<select id="product_interest" name="product_interest" class="form-select">
<option value="">Any / all</option>
<option value="face_balm">Face Balm</option>
<option value="body_balm">Body Balm</option>
<option value="lip_balm">Lip Balm</option>
</select>
</div>
<div class="form-group">
<label for="message" class="form-label">Message</label>
<textarea id="message" name="message" class="form-textarea" required maxlength="5000" placeholder="Tell Amber what you're looking for…"></textarea>
</div>
<div class="cf-turnstile" data-sitekey="TURNSTILE_SITE_KEY" style="margin-bottom: var(--fk-space-lg);"></div>
<div id="formMessage"></div>
<button type="submit" class="btn btn--primary btn--lg" id="submitBtn">
Send Message
</button>
</form>
layouts/partials/footer.html
+28
View File
@@ -0,0 +1,28 @@
<footer class="site-footer">
<div class="container">
<div class="site-footer__grid">
<div>
<div class="site-footer__brand">Fat Kiss</div>
<p class="site-footer__slogan">Everybody Wants One.</p>
<p class="site-footer__copy">Natural ritual skincare. Handcrafted with care.</p>
</div>
<div>
<h4>Shop</h4>
<a href="/products/">All Products</a>
<a href="/products/face-balm/">Face Balm</a>
<a href="/products/body-balm/">Body Balm</a>
<a href="/products/lip-balm/">Lip Balm</a>
</div>
<div>
<h4>Connect</h4>
<a href="/about/">About</a>
<a href="/journal/">Journal</a>
<a href="/contact/">Contact</a>
</div>
</div>
<div class="site-footer__bottom">
<span>&copy; {{ now.Format "2006" }} Fat Kiss. All rights reserved.</span>
<span>Made with care on Kauaʻi</span>
</div>
</div>
</footer>
layouts/partials/head.html
+10
View File
@@ -0,0 +1,10 @@
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>{{ if .Title }}{{ .Title }} — {{ .Site.Title }}{{ else }}{{ .Site.Title }}{{ end }}</title>
{{ $css := resources.Get "scss/main.scss" | toCSS | minify | fingerprint }}
<link rel="stylesheet" href="{{ $css.RelPermalink }}">
<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=Bebas+Neue&family=Inter:wght@400;500;600&family=Playfair+Display:ital,wght@0,600;1,400;1,600&display=swap" rel="stylesheet">
<link rel="icon" href="/favicon.svg" type="image/svg+xml">
{{ with .Site.Params.favicon }}<link rel="icon" href="{{ . }}" type="image/svg+xml">{{ end }}
layouts/partials/header.html
+17
View File
@@ -0,0 +1,17 @@
<header class="site-header">
<div class="container site-header__inner">
<a href="/" class="site-header__logo" aria-label="Fat Kiss home">
{{ partial "svg-logo.html" . }}
Fat Kiss
</a>
<button class="nav-toggle" aria-label="Toggle navigation" id="navToggle">
<span></span><span></span><span></span>
</button>
<nav class="site-header__nav" id="mainNav">
{{ $current := . }}
{{ range .Site.Menus.main }}
<a href="{{ .URL }}" {{ if $current.IsMenuCurrent "main" . }}class="active"{{ end }}>{{ .Name }}</a>
{{ end }}
</nav>
</div>
</header>
layouts/partials/product-card.html
+28
View File
@@ -0,0 +1,28 @@
{{/* Product card partial */}}
<a href="{{ .RelPermalink }}" class="product-card">
<div class="product-card__image">
{{ with .Params.hero_image }}
<img src="{{ . }}" alt="{{ $.Title }}" loading="lazy">
{{ else }}
<div class="product-card__image-placeholder">{{ .Title }}</div>
{{ end }}
</div>
<div class="product-card__body">
<div class="product-card__type">{{ .Params.product_type | default "balm" | humanize }}</div>
<h3 class="product-card__title">{{ .Title }}</h3>
<p class="product-card__summary">{{ .Params.short_summary | default .Summary }}</p>
{{ with .Params.benefit_chips }}
<div class="product-card__chips">
{{ range . }}
<span class="product-card__chip">{{ . }}</span>
{{ end }}
</div>
{{ end }}
<div class="product-card__footer">
<span class="product-card__status product-card__status--{{ .Params.status | default "inquiry" }}">
{{ if eq .Params.status "coming_soon" }}Coming Soon{{ else if eq .Params.status "active" }}Available{{ else }}Inquire{{ end }}
</span>
<span class="btn btn--ghost">Learn more →</span>
</div>
</div>
</a>
layouts/partials/seo.html
+12
View File
@@ -0,0 +1,12 @@
{{/* SEO partial */}}
<meta name="description" content="{{ with .Params.seo_description }}{{ . }}{{ else }}{{ .Site.Params.description }}{{ end }}">
<link rel="canonical" href="{{ .Permalink }}">
<meta property="og:title" content="{{ if .Title }}{{ .Title }} — {{ .Site.Title }}{{ else }}{{ .Site.Title }}{{ end }}">
<meta property="og:description" content="{{ with .Params.seo_description }}{{ . }}{{ else }}{{ .Site.Params.description }}{{ end }}">
<meta property="og:url" content="{{ .Permalink }}">
<meta property="og:type" content="{{ if .IsHome }}website{{ else }}article{{ end }}">
<meta property="og:image" content="{{ with .Params.og_image }}{{ . | absURL }}{{ else }}{{ .Site.Params.ogImage | absURL }}{{ end }}">
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:title" content="{{ if .Title }}{{ .Title }} — {{ .Site.Title }}{{ else }}{{ .Site.Title }}{{ end }}">
<meta name="twitter:description" content="{{ with .Params.seo_description }}{{ . }}{{ else }}{{ .Site.Params.description }}{{ end }}">
{{ if .Params.noindex }}<meta name="robots" content="noindex, nofollow">{{ end }}
layouts/partials/svg-logo.html
+5
View File
@@ -0,0 +1,5 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" fill="none">
<circle cx="16" cy="16" r="15" stroke="currentColor" stroke-width="2"/>
<path d="M10 18c0-2 1.5-4 3-5.5s3-2.5 4.5-2.5c1 0 2 .5 2.5 1.5.5.8.5 1.8 0 2.6-.6 1-1.8 1.6-3 1.6-1 0-2-.5-2.5-1.4" stroke="currentColor" stroke-width="1.8" stroke-linecap="round"/>
<path d="M10 18c0 1.5 1 3 2.5 3.5s3.5.5 5-1c1-1 1.5-2.5 1.5-4" stroke="currentColor" stroke-width="1.8" stroke-linecap="round"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 469 B

layouts/products/list.html
+20
View File
@@ -0,0 +1,20 @@
{{ define "main" }}
<article class="page-enter">
<section class="section">
<div class="container">
<p class="section__label">Products</p>
<h1 class="section__title">The Balms</h1>
<p class="section__body">Rich, natural balm rituals for skin that lives, works, glows, and keeps going.</p>
</div>
</section>
<section class="section">
<div class="container">
<div class="grid-3">
{{ range .Pages }}
{{ partial "product-card.html" . }}
{{ end }}
</div>
</div>
</section>
</article>
{{ end }}
layouts/products/single.html
+134
View File
@@ -0,0 +1,134 @@
{{ define "main" }}
<article class="page-enter">
<section class="section">
<div class="container">
<div class="product-hero">
<div class="product-hero__image">
{{ with .Params.hero_image }}
<img src="{{ . }}" alt="{{ $.Title }}">
{{ else }}
<div class="product-hero__image-placeholder">{{ .Title }}</div>
{{ end }}
</div>
<div>
<p class="product-hero__type">{{ .Params.product_type | default "balm" | humanize }}</p>
<h1 class="product-hero__title">{{ .Title }}</h1>
{{ with .Params.one_line_identity }}
<p class="product-hero__identity">{{ . }}</p>
{{ end }}
{{ with .Params.short_summary }}
<p class="product-hero__summary">{{ . }}</p>
{{ end }}
{{ with .Params.benefit_chips }}
<div class="product-hero__chips">
{{ range . }}<span class="product-hero__chip">{{ . }}</span>{{ end }}
</div>
{{ end }}
<div class="product-hero__actions">
{{ if eq .Params.status "coming_soon" }}
<span class="badge badge--sage">Coming Soon</span>
{{ else }}
<a href="/contact/?product={{ .File.ContentBaseName }}" class="btn btn--primary btn--lg">
{{ .Params.cta_label | default "Inquire Now" }}
</a>
{{ end }}
{{ if .Params.price_display }}
<span style="font-family:var(--fk-font-ui);font-size:var(--fk-text-lg);font-weight:600;color:var(--fk-ink)">{{ .Params.price_display }}</span>
{{ end }}
</div>
</div>
</div>
</div>
</section>
{{ with .Params.blend_benefits_rich_text }}
<section class="section">
<div class="container container--narrow">
<h2>The Blend</h2>
<div class="section__body" style="margin-top:var(--fk-space-md)">{{ . | markdownify }}</div>
</div>
</section>
{{ end }}
{{ if or .Params.smells_like .Params.feels_like .Params.good_for }}
<section class="section">
<div class="container">
<h2 style="text-align:center;margin-bottom:var(--fk-space-xl)">The Experience</h2>
<div class="sensory-grid">
{{ with .Params.smells_like }}
<div class="sensory-card">
<p class="sensory-card__label">Smells like</p>
<p class="sensory-card__value">{{ . }}</p>
</div>
{{ end }}
{{ with .Params.feels_like }}
<div class="sensory-card">
<p class="sensory-card__label">Feels like</p>
<p class="sensory-card__value">{{ . }}</p>
</div>
{{ end }}
{{ with .Params.good_for }}
<div class="sensory-card">
<p class="sensory-card__label">Good for</p>
<p class="sensory-card__value">{{ . }}</p>
</div>
{{ end }}
</div>
</div>
</section>
{{ end }}
{{ with .Params.directions }}
<section class="section">
<div class="container container--narrow">
<h2>How to Use</h2>
<div class="section__body" style="margin-top:var(--fk-space-md)">{{ . | markdownify }}</div>
</div>
</section>
{{ end }}
{{ with .Params.ritual_note }}
<section class="section">
<div class="container container--narrow">
<blockquote style="font-family:var(--fk-font-display);font-style:italic;font-size:var(--fk-text-xl);color:var(--fk-ink-soft);border-left:3px solid var(--fk-kiss-red);padding-left:var(--fk-space-lg)">
{{ . }}
</blockquote>
</div>
</section>
{{ end }}
{{ with .Params.ingredients_list }}
<section class="section">
<div class="container container--narrow">
<h2>Ingredients</h2>
<p style="color:var(--fk-ink-soft);margin-bottom:var(--fk-space-lg)">{{ $.Params.ingredients_summary }}</p>
<div class="ingredient-list">
{{ range . }}
<div class="ingredient-list__item">{{ . }}</div>
{{ end }}
</div>
</div>
</section>
{{ end }}
{{ with .Params.faq_items }}
<section class="section">
<div class="container container--narrow">
<h2>Questions</h2>
{{ range . }}
<div class="faq-item">
<button class="faq-item__question" onclick="this.parentElement.classList.toggle('open')">{{ .question }}</button>
<div class="faq-item__answer"><p>{{ .answer }}</p></div>
</div>
{{ end }}
</div>
</section>
{{ end }}
<section class="section" style="text-align:center">
<a href="/contact/?product={{ .File.ContentBaseName }}" class="btn btn--primary btn--lg">
{{ .Params.cta_label | default "Ask About This Balm" }}
</a>
</section>
</article>
{{ end }}