WesternTechnologies/flowercms_marketing
2
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

initial commit

Browse Source
This commit is contained in:
kfj001 committed 2026-08-20 13:55:48 -07:00
commit 029fb48ca6
38 files changed
+1634
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

site-screenshots.html
+318
View File
@@ -0,0 +1,318 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>KMountain Flower Radio — Site Screenshots</title>
<style>
:root {
--bg: #faf6f0;
--card: #ffffff;
--text: #3a3632;
--muted: #8a8580;
--primary: #1a3a5c;
--primary-light: #2a5a8c;
--accent: #e87a2e;
--border: #e5e0d8;
}
* { margin: 0; padding: 0; box-sizing: border-box; }
body {
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
background: var(--bg);
color: var(--text);
line-height: 1.6;
}
/* Hero header */
.hero {
background: linear-gradient(135deg, var(--primary) 0%, #0e2440 100%);
color: #fff;
padding: 60px 40px 50px;
text-align: center;
}
.hero h1 {
font-size: 2.4rem;
font-weight: 700;
letter-spacing: -0.5px;
margin-bottom: 8px;
}
.hero h1 span { color: var(--accent); }
.hero p {
font-size: 1.1rem;
opacity: 0.8;
max-width: 600px;
margin: 0 auto;
}
.hero .badge {
display: inline-block;
margin-top: 16px;
background: rgba(255,255,255,0.12);
border: 1px solid rgba(255,255,255,0.2);
border-radius: 20px;
padding: 6px 18px;
font-size: 0.85rem;
letter-spacing: 0.3px;
}
/* Section titles */
.section-title {
padding: 40px 40px 0;
max-width: 1200px;
margin: 0 auto;
}
.section-title h2 {
font-size: 1.5rem;
font-weight: 700;
color: var(--primary);
display: flex;
align-items: center;
gap: 10px;
}
.section-title h2::before {
content: '';
display: inline-block;
width: 4px;
height: 24px;
background: var(--accent);
border-radius: 2px;
}
.section-title p {
color: var(--muted);
margin-top: 4px;
font-size: 0.95rem;
}
/* Grid */
.grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(520px, 1fr));
gap: 32px;
padding: 28px 40px 60px;
max-width: 1200px;
margin: 0 auto;
}
@media (max-width: 580px) {
.grid { grid-template-columns: 1fr; padding: 20px; gap: 24px; }
}
/* Card */
.card {
background: var(--card);
border-radius: 12px;
overflow: hidden;
box-shadow: 0 1px 3px rgba(0,0,0,0.06), 0 4px 12px rgba(0,0,0,0.04);
border: 1px solid var(--border);
transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.card:hover {
transform: translateY(-3px);
box-shadow: 0 4px 8px rgba(0,0,0,0.08), 0 12px 28px rgba(0,0,0,0.06);
}
.card img {
width: 100%;
display: block;
border-bottom: 1px solid var(--border);
}
.card-body {
padding: 18px 22px 22px;
}
.card-body .label {
display: inline-block;
font-size: 0.7rem;
font-weight: 600;
text-transform: uppercase;
letter-spacing: 0.8px;
color: var(--accent);
background: rgba(232,122,46,0.1);
padding: 3px 10px;
border-radius: 4px;
margin-bottom: 8px;
}
.card-body .label.admin {
color: var(--primary-light);
background: rgba(42,90,140,0.1);
}
.card-body h3 {
font-size: 1.05rem;
font-weight: 600;
margin-bottom: 6px;
color: var(--primary);
}
.card-body p {
font-size: 0.88rem;
color: var(--muted);
line-height: 1.55;
}
/* Footer */
footer {
text-align: center;
padding: 30px 40px 40px;
color: var(--muted);
font-size: 0.82rem;
border-top: 1px solid var(--border);
max-width: 1200px;
margin: 0 auto;
}
</style>
</head>
<body>
<div class="hero">
<h1>K<span>Mtn</span> Flower Radio</h1>
<p>Complete site walkthrough — public pages and admin dashboard</p>
<div class="badge">kryz.westerntechnologies.duckdns.org &middot; 14 screenshots</div>
</div>
<!-- PUBLIC PAGES -->
<div class="section-title">
<h2>Public Pages</h2>
<p>Front-end pages visible to visitors</p>
</div>
<div class="grid">
<div class="card">
<img src="./browser_screenshot_21bf19f764e948cfbae5a57a3767c880.png" alt="Homepage">
<div class="card-body">
<div class="label">Page 1</div>
<h3>Homepage</h3>
<p>Mountain landscape hero, "KMountain Flower Radio" branding, View Schedule CTA, live stream indicator, underwriter placeholders, and full footer with social links.</p>
</div>
</div>
<div class="card">
<img src="file:///Users/kyle/Desktop/kmtnflower%20shots/browser_screenshot_b7e4006d9cf6457a8d40db7eac35a786.png" alt="About page">
<div class="card-body">
<div class="label">Page 2</div>
<h3>About</h3>
<p>Core values (Music, Community, Reach, Mission), history timeline (1987&ndash;2008), and team profiles for 4 key staff members.</p>
</div>
</div>
<div class="card">
<img src="file:///Users/kyle/Desktop/kmtnflower%20shots/browser_screenshot_43f2ede9e9b6467da64c384bb464beaf.png" alt="Schedule page">
<div class="card-body">
<div class="label">Page 3</div>
<h3>Schedule</h3>
<p>10 program cards with show titles, hosts, genres, and time slots — from Morning Mountain Mist through Weekend Sunrise.</p>
</div>
</div>
<div class="card">
<img src="file:///Users/kyle/Desktop/kmtnflower%20shots/browser_screenshot_4867d71acefb47a4a5a20b0792114528.png" alt="Events page">
<div class="card-body">
<div class="label">Page 4</div>
<h3>Events</h3>
<p>4 upcoming events: Summer Sounds Festival (Jul 12), Annual Fundraiser Gala (Aug 5), Volunteer Open House (Sep 18), Harvest Moon Broadcast (Oct 30).</p>
</div>
</div>
<div class="card">
<img src="file:///Users/kyle/Desktop/kmtnflower%20shots/browser_screenshot_38c1b3d26c354eb3a6a50d1e17cb5545.png" alt="Contact page">
<div class="card-body">
<div class="label">Page 5</div>
<h3>Contact</h3>
<p>Contact form (name, email, subject, message), studio address at 42 Pine St, phone number, email, and frequency info.</p>
</div>
</div>
<div class="card">
<img src="file:///Users/kyle/Desktop/kmtnflower%20shots/browser_screenshot_3e603078f20a4e68a9dd56821b1bad4e.png" alt="Sign In page">
<div class="card-body">
<div class="label">Page 6</div>
<h3>Sign In</h3>
<p>Admin login form with username and password fields, flower logo header, and "Admin access for KMountain Flower Radio" subtitle.</p>
</div>
</div>
</div>
<!-- ADMIN DASHBOARD -->
<div class="section-title">
<h2>Admin Dashboard</h2>
<p>Logged-in management interface (username: admin)</p>
</div>
<div class="grid">
<div class="card">
<img src="file:///Users/kyle/Desktop/kmtnflower%20shots/browser_screenshot_13e3b50673794164b10881a7cde0d944.png" alt="Dashboard overview">
<div class="card-body">
<div class="label admin">Admin &mdash; 7</div>
<h3>Dashboard Overview</h3>
<p>Tab navigation for all admin sections (Shows, Events, History, Team, Community, Station, Theme, Underwriters, Mobile Builds, Stats) with the Shows table visible.</p>
</div>
</div>
<div class="card">
<img src="file:///Users/kyle/Desktop/kmtnflower%20shots/browser_screenshot_503c4383e8c6466f8bd32e70bc976b0c.png" alt="Shows management">
<div class="card-body">
<div class="label admin">Admin &mdash; 8</div>
<h3>Shows (10)</h3>
<p>Full shows management table with Edit/Delete actions: Morning Mountain Mist, Community Roundup, Bluegrass Trails, Lunchtime Jazz, Folk Roots Hour, Afternoon Acoustics, Evening Echoes, Classical Mountains, Night Owl Session, Weekend Sunrise.</p>
</div>
</div>
<div class="card">
<img src="file:///Users/kyle/Desktop/kmtnflower%20shots/browser_screenshot_93e33401ba5f4e75b486995dbb909256.png" alt="Events management">
<div class="card-body">
<div class="label admin">Admin &mdash; 9</div>
<h3>Events (4)</h3>
<p>Events management table with date, title, location, and active status. All 4 events active. Add Event button available.</p>
</div>
</div>
<div class="card">
<img src="file:///Users/kyle/Desktop/kmtnflower%20shots/browser_screenshot_ad98ed0d72444accb8b86bd741c76026.png" alt="History timeline">
<div class="card-body">
<div class="label admin">Admin &mdash; 10</div>
<h3>History Timeline (4)</h3>
<p>1987 &ldquo;The Idea Takes Root&rdquo;, 1991 &ldquo;FCC License Granted&rdquo;, 1995 &ldquo;First Broadcast&rdquo;, 2008 &ldquo;Studio Expansion&rdquo; — each with Edit/Delete controls.</p>
</div>
</div>
<div class="card">
<img src="file:///Users/kyle/Desktop/kmtnflower%20shots/browser_screenshot_0ae9d99c496643268975d724943b63b1.png" alt="Team management">
<div class="card-body">
<div class="label admin">Admin &mdash; 11</div>
<h3>Team Members (4)</h3>
<p>Margaret Ellis (Board Chair), James Whitfield (General Manager), Dr. Priya Nair (Program Director), Carlos Mendez (Community Outreach Coordinator).</p>
</div>
</div>
<div class="card">
<img src="file:///Users/kyle/Desktop/kmtnflower%20shots/browser_screenshot_f27993f84b854693b122bcaa39aa4cb5.png" alt="Community highlights">
<div class="card-body">
<div class="label admin">Admin &mdash; 12</div>
<h3>Community Highlights (4)</h3>
<p>Our Music 🎵, Our Community 🤝, Our Reach 📡, Our Mission 🌱 — each with icons, ordering, and active status.</p>
</div>
</div>
<div class="card">
<img src="file:///Users/kyle/Desktop/kmtnflower%20shots/browser_screenshot_96d8590746bb4bb8a84be5d9d0bd5576.png" alt="Station configuration">
<div class="card-body">
<div class="label admin">Admin &mdash; 13</div>
<h3>Station Configuration</h3>
<p>Callsign KMTN, frequency 98.7 FM, founded 1987, email, phone, website. Donation URL and app store URLs not yet configured. Edit Config button.</p>
</div>
</div>
<div class="card">
<img src="file:///Users/kyle/Desktop/kmtnflower%20shots/browser_screenshot_228777a2402e461d91b651c00010d9dc.png" alt="Theme customization">
<div class="card-body">
<div class="label admin">Admin &mdash; 14</div>
<h3>Theme &amp; Color Palette</h3>
<p>Harmony settings (Complementary), 14 color swatches — primary blues (#1a3a5c), accent oranges (#e87a2e), functional colors. Warning triangles on Success/Danger colors. Reset / Auto-Fix / Save buttons.</p>
</div>
</div>
</div>
<footer>
Generated for KMountain Flower Radio &middot; kryz.westerntechnologies.duckdns.org &middot; 2026-07-08
</footer>
</body>
</html>