c0dc89df51
Merged all content from separate brainstorming repo: TEMPLATES (4 files): - Memorial template - Opener template - Portrait prompt template - Session report template RELATIONSHIP DOCUMENTS: - Relationship brief - The Catalyst memorials (2 versions + portrait prompts) - The Spark memorial + portrait prompt SESSION REPORTS (archived): - 2026-02-13: Casual party games report - 2026-02-14: Firefrost modpack report - 2026-02-14: LLM backup Ghost CMS report IDEAS/PLANNING: Features: - Ghost homepage content (complete copy) - Ghost page structure plan - Ghost server listing design - Ghost Frost CSS Game Servers: - Among Us Firefrost brainstorm - Other games backlog Other: - Gemini testing protocol - LLM fallback analysis REFERENCE DOCUMENTATION: - Gitea API patterns - Session start prompt All content now consolidated in operations manual. Next step: Archive/delete brainstorming repository. Creates foundation for new Gitea issues from actionable ideas.
401 lines
14 KiB
CSS
401 lines
14 KiB
CSS
/* ❄️ FIREFROST GAMING - FROST PALETTE CSS INJECTION
|
|
* Purpose: Transform Ghost Casper theme into Frost-branded site
|
|
* Usage: Ghost Admin → Settings → Code Injection → Site Header
|
|
* Version: 1.0
|
|
* Created: February 14, 2026
|
|
*
|
|
* INSTRUCTIONS:
|
|
* 1. Copy this entire file
|
|
* 2. Go to Ghost Admin → Settings → Code Injection
|
|
* 3. Paste into "Site Header" section
|
|
* 4. Click Save
|
|
* 5. View site - changes apply immediately
|
|
*/
|
|
|
|
/* ═══════════════════════════════════════════════════════════
|
|
GOOGLE FONTS - Load Orbitron & Inter
|
|
═══════════════════════════════════════════════════════════ */
|
|
|
|
@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@400;500;700;900&family=Inter:wght@300;400;500;600;700&display=swap');
|
|
|
|
/* ═══════════════════════════════════════════════════════════
|
|
CSS VARIABLES - Frost Palette
|
|
═══════════════════════════════════════════════════════════ */
|
|
|
|
:root {
|
|
/* Frost Colors */
|
|
--frost-primary: #00E5FF; /* Electric Cyan - Headings, Links */
|
|
--frost-secondary: #01579B; /* Deep Navy - Buttons, Nav */
|
|
--frost-background: #0A0A0A; /* Obsidian Black - Main Background */
|
|
--frost-text: #FFFFFF; /* Pure White - Body Text */
|
|
--frost-border: #00E5FF; /* Cyan Borders */
|
|
|
|
/* Accents */
|
|
--frost-glass: rgba(1, 87, 155, 0.1); /* Glassmorphism background */
|
|
--frost-glow: rgba(0, 229, 255, 0.3); /* Subtle glow effect */
|
|
|
|
/* Override Ghost defaults */
|
|
--color-primary: var(--frost-primary);
|
|
--color-secondary: var(--frost-secondary);
|
|
--color-base: var(--frost-text);
|
|
--color-border: var(--frost-border);
|
|
|
|
/* Typography */
|
|
--font-heading: 'Orbitron', sans-serif;
|
|
--font-body: 'Inter', sans-serif;
|
|
--font-mono: 'Fira Code', 'JetBrains Mono', monospace;
|
|
|
|
/* Spacing (16px base) */
|
|
--spacing-sm: 0.5rem; /* 8px */
|
|
--spacing-md: 1rem; /* 16px */
|
|
--spacing-lg: 2rem; /* 32px */
|
|
--spacing-xl: 4rem; /* 64px */
|
|
}
|
|
|
|
/* ═══════════════════════════════════════════════════════════
|
|
GLOBAL STYLES
|
|
═══════════════════════════════════════════════════════════ */
|
|
|
|
body {
|
|
background: var(--frost-background) !important;
|
|
color: var(--frost-text) !important;
|
|
font-family: var(--font-body) !important;
|
|
font-size: 16px !important;
|
|
line-height: 1.6 !important;
|
|
}
|
|
|
|
/* Reset any Ghost light mode styles */
|
|
.gh-viewport,
|
|
.gh-main,
|
|
.gh-page,
|
|
.site-main {
|
|
background: var(--frost-background) !important;
|
|
color: var(--frost-text) !important;
|
|
}
|
|
|
|
/* ═══════════════════════════════════════════════════════════
|
|
TYPOGRAPHY
|
|
═══════════════════════════════════════════════════════════ */
|
|
|
|
h1, h2, h3, h4, h5, h6,
|
|
.gh-head-brand,
|
|
.post-card-title {
|
|
font-family: var(--font-heading) !important;
|
|
color: var(--frost-primary) !important;
|
|
font-weight: 700 !important;
|
|
letter-spacing: 0.05em !important;
|
|
}
|
|
|
|
h1 { font-size: 2.5rem !important; }
|
|
h2 { font-size: 2rem !important; }
|
|
h3 { font-size: 1.5rem !important; }
|
|
h4 { font-size: 1.25rem !important; }
|
|
|
|
p, li, span, div {
|
|
color: var(--frost-text) !important;
|
|
}
|
|
|
|
a {
|
|
color: var(--frost-primary) !important;
|
|
text-decoration: none !important;
|
|
transition: color 0.2s ease !important;
|
|
}
|
|
|
|
a:hover {
|
|
color: var(--frost-text) !important;
|
|
text-decoration: underline !important;
|
|
}
|
|
|
|
code, pre {
|
|
font-family: var(--font-mono) !important;
|
|
background: rgba(0, 229, 255, 0.05) !important;
|
|
border: 1px solid var(--frost-border) !important;
|
|
border-radius: 0 !important;
|
|
padding: 0.25rem 0.5rem !important;
|
|
}
|
|
|
|
/* ═══════════════════════════════════════════════════════════
|
|
HEADER / NAVIGATION
|
|
═══════════════════════════════════════════════════════════ */
|
|
|
|
.gh-head {
|
|
background: var(--frost-background) !important;
|
|
border-bottom: 2px solid var(--frost-border) !important;
|
|
backdrop-filter: blur(10px) !important;
|
|
}
|
|
|
|
.gh-head-brand,
|
|
.gh-head-menu a {
|
|
color: var(--frost-text) !important;
|
|
font-family: var(--font-heading) !important;
|
|
font-weight: 500 !important;
|
|
}
|
|
|
|
.gh-head-menu a:hover {
|
|
color: var(--frost-primary) !important;
|
|
}
|
|
|
|
/* Logo styling (if you upload Firefrost emblem) */
|
|
.gh-head-logo img {
|
|
height: 48px !important;
|
|
filter: drop-shadow(0 0 8px var(--frost-glow)) !important;
|
|
}
|
|
|
|
/* ═══════════════════════════════════════════════════════════
|
|
BUTTONS
|
|
═══════════════════════════════════════════════════════════ */
|
|
|
|
button,
|
|
.gh-btn,
|
|
.gh-button,
|
|
input[type="submit"],
|
|
a.button {
|
|
background: var(--frost-secondary) !important;
|
|
border: 1px solid var(--frost-border) !important;
|
|
border-radius: 0 !important; /* Sharp corners = Frost style */
|
|
color: var(--frost-text) !important;
|
|
font-family: var(--font-heading) !important;
|
|
font-weight: 600 !important;
|
|
padding: 0.75rem 1.5rem !important;
|
|
text-transform: uppercase !important;
|
|
letter-spacing: 0.1em !important;
|
|
transition: all 0.2s ease !important;
|
|
cursor: pointer !important;
|
|
}
|
|
|
|
button:hover,
|
|
.gh-btn:hover,
|
|
.gh-button:hover,
|
|
input[type="submit"]:hover,
|
|
a.button:hover {
|
|
background: var(--frost-primary) !important;
|
|
color: var(--frost-background) !important;
|
|
border-color: var(--frost-primary) !important;
|
|
box-shadow: 0 0 16px var(--frost-glow) !important;
|
|
}
|
|
|
|
/* Primary CTA buttons (extra emphasis) */
|
|
.gh-btn-primary,
|
|
.button-primary {
|
|
background: var(--frost-primary) !important;
|
|
color: var(--frost-background) !important;
|
|
font-weight: 700 !important;
|
|
}
|
|
|
|
/* ═══════════════════════════════════════════════════════════
|
|
CARDS (Post Cards, Feature Cards)
|
|
═══════════════════════════════════════════════════════════ */
|
|
|
|
.post-card,
|
|
.gh-card,
|
|
article.post {
|
|
background: var(--frost-glass) !important;
|
|
backdrop-filter: blur(10px) !important; /* Glassmorphism effect */
|
|
border: 1px solid var(--frost-border) !important;
|
|
border-radius: 0 !important; /* Sharp corners */
|
|
box-shadow: none !important; /* Flat design */
|
|
padding: var(--spacing-md) !important;
|
|
transition: all 0.2s ease !important;
|
|
}
|
|
|
|
.post-card:hover,
|
|
.gh-card:hover {
|
|
border-color: var(--frost-primary) !important;
|
|
box-shadow: 0 0 24px var(--frost-glow) !important;
|
|
transform: translateY(-2px) !important;
|
|
}
|
|
|
|
.post-card-title,
|
|
.gh-card-title {
|
|
color: var(--frost-primary) !important;
|
|
font-family: var(--font-heading) !important;
|
|
}
|
|
|
|
.post-card-excerpt,
|
|
.gh-card-excerpt {
|
|
color: var(--frost-text) !important;
|
|
}
|
|
|
|
/* ═══════════════════════════════════════════════════════════
|
|
HERO SECTION (Homepage)
|
|
═══════════════════════════════════════════════════════════ */
|
|
|
|
.gh-canvas {
|
|
background: var(--frost-background) !important;
|
|
}
|
|
|
|
/* If you add a custom hero section with class .hero */
|
|
.hero {
|
|
background: linear-gradient(
|
|
180deg,
|
|
rgba(10, 10, 10, 0.95) 0%,
|
|
var(--frost-background) 100%
|
|
) !important;
|
|
min-height: 80vh !important;
|
|
display: flex !important;
|
|
align-items: center !important;
|
|
justify-content: center !important;
|
|
text-align: center !important;
|
|
padding: var(--spacing-xl) var(--spacing-md) !important;
|
|
}
|
|
|
|
.hero h1 {
|
|
font-size: 3.5rem !important;
|
|
margin-bottom: var(--spacing-md) !important;
|
|
text-shadow: 0 0 20px var(--frost-glow) !important;
|
|
}
|
|
|
|
.hero p {
|
|
font-size: 1.25rem !important;
|
|
margin-bottom: var(--spacing-lg) !important;
|
|
max-width: 600px !important;
|
|
margin-left: auto !important;
|
|
margin-right: auto !important;
|
|
}
|
|
|
|
/* ═══════════════════════════════════════════════════════════
|
|
FOOTER
|
|
═══════════════════════════════════════════════════════════ */
|
|
|
|
.gh-foot {
|
|
background: var(--frost-background) !important;
|
|
border-top: 2px solid var(--frost-border) !important;
|
|
color: var(--frost-text) !important;
|
|
padding: var(--spacing-lg) var(--spacing-md) !important;
|
|
}
|
|
|
|
.gh-foot a {
|
|
color: var(--frost-primary) !important;
|
|
}
|
|
|
|
.gh-foot a:hover {
|
|
color: var(--frost-text) !important;
|
|
}
|
|
|
|
/* ═══════════════════════════════════════════════════════════
|
|
FORMS (Subscribe, Contact)
|
|
═══════════════════════════════════════════════════════════ */
|
|
|
|
input[type="text"],
|
|
input[type="email"],
|
|
input[type="password"],
|
|
textarea,
|
|
select {
|
|
background: var(--frost-glass) !important;
|
|
border: 1px solid var(--frost-border) !important;
|
|
border-radius: 0 !important;
|
|
color: var(--frost-text) !important;
|
|
font-family: var(--font-body) !important;
|
|
padding: 0.75rem !important;
|
|
transition: all 0.2s ease !important;
|
|
}
|
|
|
|
input:focus,
|
|
textarea:focus,
|
|
select:focus {
|
|
border-color: var(--frost-primary) !important;
|
|
box-shadow: 0 0 8px var(--frost-glow) !important;
|
|
outline: none !important;
|
|
}
|
|
|
|
/* ═══════════════════════════════════════════════════════════
|
|
MOBILE RESPONSIVE
|
|
═══════════════════════════════════════════════════════════ */
|
|
|
|
@media (max-width: 768px) {
|
|
.hero h1 {
|
|
font-size: 2rem !important;
|
|
}
|
|
|
|
.hero p {
|
|
font-size: 1rem !important;
|
|
}
|
|
|
|
h1 { font-size: 2rem !important; }
|
|
h2 { font-size: 1.75rem !important; }
|
|
h3 { font-size: 1.5rem !important; }
|
|
|
|
.post-card,
|
|
.gh-card {
|
|
margin-bottom: var(--spacing-md) !important;
|
|
}
|
|
}
|
|
|
|
/* ═══════════════════════════════════════════════════════════
|
|
CUSTOM UTILITY CLASSES
|
|
═══════════════════════════════════════════════════════════ */
|
|
|
|
/* Frost Card (for custom layouts) */
|
|
.frost-card {
|
|
background: var(--frost-glass) !important;
|
|
backdrop-filter: blur(10px) !important;
|
|
border: 1px solid var(--frost-border) !important;
|
|
border-radius: 0 !important;
|
|
padding: var(--spacing-lg) !important;
|
|
margin-bottom: var(--spacing-md) !important;
|
|
}
|
|
|
|
/* Section divider */
|
|
.section-divider {
|
|
border-top: 2px solid var(--frost-border) !important;
|
|
margin: var(--spacing-xl) 0 !important;
|
|
position: relative !important;
|
|
}
|
|
|
|
.section-divider::before {
|
|
content: "❄️" !important;
|
|
position: absolute !important;
|
|
top: -1rem !important;
|
|
left: 50% !important;
|
|
transform: translateX(-50%) !important;
|
|
background: var(--frost-background) !important;
|
|
padding: 0 var(--spacing-md) !important;
|
|
font-size: 1.5rem !important;
|
|
}
|
|
|
|
/* Glow effect utility */
|
|
.frost-glow {
|
|
box-shadow: 0 0 16px var(--frost-glow) !important;
|
|
}
|
|
|
|
/* Text align utilities */
|
|
.text-center { text-align: center !important; }
|
|
.text-left { text-align: left !important; }
|
|
.text-right { text-align: right !important; }
|
|
|
|
/* ═══════════════════════════════════════════════════════════
|
|
ACCESSIBILITY
|
|
═══════════════════════════════════════════════════════════ */
|
|
|
|
/* Focus states (keyboard navigation) */
|
|
a:focus,
|
|
button:focus,
|
|
input:focus,
|
|
textarea:focus {
|
|
outline: 2px solid var(--frost-primary) !important;
|
|
outline-offset: 2px !important;
|
|
}
|
|
|
|
/* Skip to content link (for screen readers) */
|
|
.skip-to-content {
|
|
position: absolute !important;
|
|
top: -40px !important;
|
|
left: 0 !important;
|
|
background: var(--frost-primary) !important;
|
|
color: var(--frost-background) !important;
|
|
padding: 8px !important;
|
|
text-decoration: none !important;
|
|
z-index: 100 !important;
|
|
}
|
|
|
|
.skip-to-content:focus {
|
|
top: 0 !important;
|
|
}
|
|
|
|
/* ═══════════════════════════════════════════════════════════
|
|
END OF FROST PALETTE CSS
|
|
|
|
🔥❄️ Fire + Frost + Forever
|
|
Built for Firefrost Gaming by Catalyst the Second
|
|
═══════════════════════════════════════════════════════════ */
|