RugMunchMedia/cryptorugmunch-com
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

feat: Ghost blog at blog.cryptorugmunch.com, fix /build and /blog crashes

Browse source 
- Ghost container deployed on Talos for corporate blog
- blog.cryptorugmunch.com DNS + nginx configured
- Removed Docusaurus built-in blog (now links to Ghost)
- Fixed /build page crash (removed undefined infra reference)
- Color palette sampled from actual logos: deep indigo-black + neon green
- Premium design: glass navbar, glow shadows, bold headers
This commit is contained in:
Crypto Rug Munch 2026-07-09 20:39:45 +07:00
parent 862cada52c
commit 2512a730ec
3 changed files with 220 additions and 87 deletions
Download patch file Download diff file Expand all files Collapse all files

13
docusaurus.config.ts
View file

@ -26,14 +26,7 @@ const config: Config = {
'classic', 'classic',
{ {
docs: false, docs: false,
blog: { blog: false,
showReadingTime: true,
feedOptions: { type: ['rss', 'atom'], xslt: true },
editUrl: 'https://git.rugmunch.io/RugMunchMedia/cryptorugmunch-com/src/branch/main/',
onInlineTags: 'warn',
onInlineAuthors: 'warn',
onUntruncatedBlogPosts: 'warn',
},
theme: { theme: {
customCss: './src/css/custom.css', customCss: './src/css/custom.css',
}, },
@ -83,7 +76,7 @@ const config: Config = {
], ],
}, },
{ to: '/build', label: 'Build With Us', position: 'left' }, { to: '/build', label: 'Build With Us', position: 'left' },
{ to: '/blog', label: 'Blog', position: 'left' }, { href: 'https://blog.cryptorugmunch.com', label: 'Blog', position: 'left' },
{ {
href: 'https://git.rugmunch.io/RugMunchMedia', href: 'https://git.rugmunch.io/RugMunchMedia',
label: 'Our Code', label: 'Our Code',
@ -110,7 +103,7 @@ const config: Config = {
title: 'Company', title: 'Company',
items: [ items: [
{ label: 'About', to: '/about' }, { label: 'About', to: '/about' },
{ label: 'Blog', to: '/blog' }, { label: 'Blog', href: 'https://blog.cryptorugmunch.com' },
{ label: 'Community', to: '/community' }, { label: 'Community', to: '/community' },
{ label: 'Security', to: '/security' }, { label: 'Security', to: '/security' },
{ label: 'Terms of Service', to: '/terms' }, { label: 'Terms of Service', to: '/terms' },

289
src/css/custom.css
View file

@ -1,111 +1,256 @@
/* ── Rug Munch Media — Dark 2026 Professional Theme ──────── */ /* ── Rug Munch Media — $100K Dark Design System ──────────── */
/* Palette sampled from actual logos: deep indigo-black + neon green */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&family=JetBrains+Mono:wght@400;500;700&display=swap'); @import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&family=JetBrains+Mono:wght@400;500;700&display=swap');
:root { :root {
--rmi-bg-primary: #050508; --rmi-bg-deepest: #060510;
--rmi-bg-secondary: #0A0A0F; --rmi-bg-primary: #08081A;
--rmi-bg-tertiary: #0D0D15; --rmi-bg-secondary: #0C0A1E;
--rmi-bg-card: #0F0F1A; --rmi-bg-card: #0F0D24;
--rmi-bg-elevated: #141422; --rmi-bg-elevated: #12102C;
--rmi-border: #1A1A2E; --rmi-bg-glass: rgba(8, 8, 26, 0.85);
--rmi-border-hover: #00FF88; --rmi-border: #1A1738;
--rmi-text-primary: #EDEDF2; --rmi-border-light: #221F44;
--rmi-text-secondary: #808099; --rmi-text-primary: #F0EEFA;
--rmi-text-muted: #4A4A5E; --rmi-text-secondary: #8A86A8;
--rmi-text-muted: #4E4A6E;
--rmi-accent: #00FF88; --rmi-accent: #00FF88;
--rmi-accent-glow: rgba(0,255,136,0.12); --rmi-accent-alt: #0DFA84;
--rmi-accent-subtle: rgba(0,255,136,0.04); --rmi-accent-glow: rgba(0, 255, 136, 0.15);
--rmi-red: #FF3366; --rmi-accent-subtle: rgba(0, 255, 136, 0.04);
--rmi-purple-glow: rgba(100, 60, 255, 0.08);
--rmi-red: #FF4466;
--rmi-font-body: 'Inter', system-ui, sans-serif; --rmi-font-body: 'Inter', system-ui, sans-serif;
--rmi-font-mono: 'JetBrains Mono', 'Fira Code', monospace; --rmi-font-mono: 'JetBrains Mono', 'Fira Code', monospace;
--rmi-radius: 12px; --rmi-radius: 14px;
--rmi-radius-sm: 8px; --rmi-radius-sm: 8px;
--rmi-shadow: 0 2px 16px rgba(0,0,0,0.4); --rmi-shadow: 0 4px 24px rgba(0,0,0,0.5);
--rmi-shadow-lg: 0 8px 40px rgba(0,0,0,0.6); --rmi-shadow-lg: 0 12px 48px rgba(0,0,0,0.7);
--rmi-transition: 0.2s cubic-bezier(0.4, 0, 0.2, 1); --rmi-shadow-glow: 0 0 40px rgba(0,255,136,0.06);
--rmi-transition: 0.22s cubic-bezier(0.4, 0, 0.2, 1);
} }
html { background: var(--rmi-bg-primary); scroll-behavior: smooth; -webkit-font-smoothing: antialiased; } /* ── Base ────────────────────────────────────────────────── */
body { background: var(--rmi-bg-primary); color: var(--rmi-text-primary); font-family: var(--rmi-font-body); font-size: 15px; line-height: 1.65; } html {
background: var(--rmi-bg-deepest);
scroll-behavior: smooth;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
body {
background: var(--rmi-bg-deepest);
color: var(--rmi-text-primary);
font-family: var(--rmi-font-body);
font-size: 15px;
line-height: 1.7;
letter-spacing: -0.005em;
}
/* Navbar — glass */ /* ── Navbar — Deep Glass ────────────────────────────────── */
.navbar { background: rgba(5,5,8,0.9); backdrop-filter: blur(24px) saturate(200%); -webkit-backdrop-filter: blur(24px); border-bottom: 1px solid rgba(0,255,136,0.06); height: 56px; } .navbar {
background: var(--rmi-bg-glass);
backdrop-filter: blur(28px) saturate(200%);
-webkit-backdrop-filter: blur(28px) saturate(200%);
border-bottom: 1px solid rgba(0, 255, 136, 0.04);
height: 58px;
box-shadow: 0 1px 0 rgba(0,0,0,0.4);
}
.navbar__brand { font-weight: 700; letter-spacing: -0.02em; } .navbar__brand { font-weight: 700; letter-spacing: -0.02em; }
.navbar__title { font-weight: 700; letter-spacing: -0.02em; font-size: 1.05rem; } .navbar__title { font-weight: 700; letter-spacing: -0.02em; font-size: 1.05rem; }
.navbar__link { font-weight: 500; font-size: 0.85rem; color: var(--rmi-text-secondary) !important; padding: 8px 14px; border-radius: 6px; transition: all var(--rmi-transition); } .navbar__link {
.navbar__link:hover, .navbar__link--active { color: var(--rmi-accent) !important; background: var(--rmi-accent-subtle); } font-weight: 500; font-size: 0.84rem; color: var(--rmi-text-secondary) !important;
padding: 8px 14px; border-radius: 6px; transition: all var(--rmi-transition);
}
.navbar__link:hover, .navbar__link--active {
color: var(--rmi-accent) !important;
background: var(--rmi-accent-subtle);
}
/* Typography */ /* ── Typography — Bold, Modern ──────────────────────────── */
h1, h2, h3, h4 { font-family: var(--rmi-font-body); font-weight: 700; letter-spacing: -0.02em; color: var(--rmi-text-primary); line-height: 1.15; } h1, h2, h3, h4, h5, h6 {
h1 { font-size: 2.8rem; font-weight: 800; } font-family: var(--rmi-font-body);
h2 { font-size: 1.9rem; } font-weight: 700;
h3 { font-size: 1.3rem; } letter-spacing: -0.025em;
color: var(--rmi-text-primary);
line-height: 1.12;
}
h1 { font-size: 3rem; font-weight: 900; letter-spacing: -0.04em; }
h2 { font-size: 2rem; font-weight: 800; }
h3 { font-size: 1.35rem; font-weight: 700; }
h4 { font-size: 1.1rem; font-weight: 600; }
p { color: var(--rmi-text-secondary); line-height: 1.7; }
/* Links */ /* ── Links ─────────────────────────────────────────────── */
a { color: var(--rmi-accent); text-decoration: none; transition: all var(--rmi-transition); } a { color: var(--rmi-accent); text-decoration: none; transition: all var(--rmi-transition); }
a:hover { color: var(--rmi-accent); text-decoration: underline; text-underline-offset: 3px; } a:hover { color: var(--rmi-accent-alt); text-decoration: underline; text-underline-offset: 4px; }
/* Code */ /* ── Code ──────────────────────────────────────────────── */
code { font-family: var(--rmi-font-mono) !important; background: var(--rmi-bg-elevated); border: 1px solid var(--rmi-border); border-radius: 4px; padding: 2px 7px; font-size: 0.86em; color: var(--rmi-accent); } code {
pre { background: var(--rmi-bg-elevated) !important; border: 1px solid var(--rmi-border); border-radius: var(--rmi-radius); } font-family: var(--rmi-font-mono) !important;
background: var(--rmi-bg-elevated);
border: 1px solid var(--rmi-border);
border-radius: 5px; padding: 2px 8px;
font-size: 0.85em; color: var(--rmi-accent);
}
pre {
background: var(--rmi-bg-elevated) !important;
border: 1px solid var(--rmi-border);
border-radius: var(--rmi-radius);
box-shadow: var(--rmi-shadow);
}
pre code { background: none; border: none; padding: 0; color: var(--rmi-text-primary); } pre code { background: none; border: none; padding: 0; color: var(--rmi-text-primary); }
/* Tables */ /* ── Cards — Glass Elevated ────────────────────────────── */
table { border-collapse: separate; border-spacing: 0; width: 100%; border: 1px solid var(--rmi-border); border-radius: var(--rmi-radius); overflow: hidden; } .article-card {
thead th { background: var(--rmi-bg-elevated); color: var(--rmi-text-primary); font-weight: 600; font-size: 0.8rem; text-transform: uppercase; letter-spacing: 0.06em; padding: 14px 18px; border-bottom: 1px solid var(--rmi-border); } background: var(--rmi-bg-card);
tbody td { background: var(--rmi-bg-card); color: var(--rmi-text-secondary); padding: 12px 18px; border-bottom: 1px solid rgba(26,26,46,0.5); font-size: 0.88rem; } border: 1px solid var(--rmi-border);
border-radius: var(--rmi-radius);
transition: all var(--rmi-transition);
box-shadow: var(--rmi-shadow);
}
.article-card:hover {
border-color: var(--rmi-accent);
box-shadow: var(--rmi-shadow-lg), var(--rmi-shadow-glow);
transform: translateY(-2px);
}
/* ── Tables ────────────────────────────────────────────── */
table {
border-collapse: separate; border-spacing: 0; width: 100%;
border: 1px solid var(--rmi-border); border-radius: var(--rmi-radius); overflow: hidden;
}
thead th {
background: var(--rmi-bg-elevated); color: var(--rmi-text-primary);
font-weight: 600; font-size: 0.78rem; text-transform: uppercase;
letter-spacing: 0.07em; padding: 14px 20px; border-bottom: 1px solid var(--rmi-border);
}
tbody td {
background: var(--rmi-bg-card); color: var(--rmi-text-secondary);
padding: 13px 20px; border-bottom: 1px solid rgba(26,23,56,0.4); font-size: 0.88rem;
}
tbody tr:last-child td { border-bottom: none; } tbody tr:last-child td { border-bottom: none; }
tbody tr:hover td { background: var(--rmi-bg-elevated); } tbody tr:hover td { background: var(--rmi-bg-elevated); }
/* Footer */ /* ── Footer ────────────────────────────────────────────── */
.footer { background: var(--rmi-bg-secondary) !important; border-top: 1px solid rgba(0,255,136,0.04); padding: 56px 0 36px; } .footer {
.footer__title { font-weight: 700; font-size: 0.78rem; text-transform: uppercase; letter-spacing: 0.08em; color: var(--rmi-text-primary); margin-bottom: 16px; } background: var(--rmi-bg-secondary) !important;
border-top: 1px solid rgba(0,255,136,0.03);
padding: 60px 0 40px;
}
.footer__title {
font-weight: 700; font-size: 0.78rem; text-transform: uppercase;
letter-spacing: 0.09em; color: var(--rmi-text-primary); margin-bottom: 18px;
}
.footer__item { margin-bottom: 8px; } .footer__item { margin-bottom: 8px; }
.footer__link-item { color: var(--rmi-text-secondary); font-size: 0.82rem; transition: color var(--rmi-transition); } .footer__link-item {
color: var(--rmi-text-secondary); font-size: 0.82rem; transition: color var(--rmi-transition);
}
.footer__link-item:hover { color: var(--rmi-accent); text-decoration: none; } .footer__link-item:hover { color: var(--rmi-accent); text-decoration: none; }
.footer__copyright { color: var(--rmi-text-muted); font-size: 0.76rem; margin-top: 32px; padding-top: 24px; border-top: 1px solid var(--rmi-border); } .footer__copyright {
color: var(--rmi-text-muted); font-size: 0.76rem;
margin-top: 36px; padding-top: 24px; border-top: 1px solid var(--rmi-border);
}
/* Scrollbar */ /* ── Scrollbar ──────────────────────────────────────────── */
::-webkit-scrollbar { width: 5px; } ::-webkit-scrollbar { width: 5px; }
::-webkit-scrollbar-track { background: var(--rmi-bg-primary); } ::-webkit-scrollbar-track { background: var(--rmi-bg-deepest); }
::-webkit-scrollbar-thumb { background: var(--rmi-border); border-radius: 3px; } ::-webkit-scrollbar-thumb { background: var(--rmi-border); border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: var(--rmi-accent); } ::-webkit-scrollbar-thumb:hover { background: var(--rmi-accent); }
::selection { background: rgba(0,255,136,0.25); color: #fff; } /* ── Selection / Focus ──────────────────────────────────── */
:focus-visible { outline: 2px solid var(--rmi-accent); outline-offset: 3px; border-radius: 4px; } ::selection { background: rgba(0,255,136,0.22); color: #fff; }
:focus-visible { outline: 2px solid var(--rmi-accent); outline-offset: 4px; border-radius: 4px; }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration:0.01ms !important; transition-duration:0.01ms !important; } } /* ── Reduced Motion ─────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
*, *::before, *::after { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; }
}
/* Sidebar */ /* ── Sidebar ────────────────────────────────────────────── */
.menu__link { color: var(--rmi-text-secondary); font-size: 0.85rem; border-radius: 6px; transition: all var(--rmi-transition); } .menu__link {
color: var(--rmi-text-secondary); font-size: 0.85rem; border-radius: 6px;
transition: all var(--rmi-transition);
}
.menu__link:hover { color: var(--rmi-text-primary); background: var(--rmi-bg-elevated); } .menu__link:hover { color: var(--rmi-text-primary); background: var(--rmi-bg-elevated); }
.menu__link--active { color: var(--rmi-accent) !important; background: var(--rmi-accent-subtle); } .menu__link--active { color: var(--rmi-accent) !important; background: var(--rmi-accent-subtle); }
.theme-doc-sidebar-container { border-right: 1px solid var(--rmi-border) !important; } .theme-doc-sidebar-container { border-right: 1px solid var(--rmi-border) !important; }
/* Blog cards */ /* ── Buttons — Premium Feel ─────────────────────────────── */
.article-card { background: var(--rmi-bg-card); border: 1px solid var(--rmi-border); border-radius: var(--rmi-radius); transition: all var(--rmi-transition); box-shadow: var(--rmi-shadow); } .rmi-btn {
.article-card:hover { border-color: var(--rmi-border-hover); box-shadow: var(--rmi-shadow-lg); } display: inline-flex; align-items: center; gap: 8px;
font-weight: 600; font-size: 0.88rem;
/* ── Buttons ──────────────────────────────────────────────────── */ padding: 14px 32px; border-radius: var(--rmi-radius-sm);
.rmi-btn { display: inline-flex; align-items: center; gap: 8px; font-weight: 600; font-size: 0.88rem; padding: 13px 30px; border-radius: var(--rmi-radius-sm); cursor: pointer; transition: all var(--rmi-transition); text-decoration: none !important; font-family: var(--rmi-font-body); letter-spacing: -0.01em; } cursor: pointer; transition: all var(--rmi-transition);
.rmi-btn--primary { background: var(--rmi-accent); color: #000 !important; border: none; box-shadow: 0 0 0 0 rgba(0,255,136,0); } text-decoration: none !important; font-family: var(--rmi-font-body);
.rmi-btn--primary:hover { background: #1aff94; box-shadow: 0 0 28px rgba(0,255,136,0.25); transform: translateY(-1px); } letter-spacing: -0.01em; position: relative; overflow: hidden;
.rmi-btn--primary:active { transform: translateY(0); box-shadow: 0 0 12px rgba(0,255,136,0.15); } }
.rmi-btn--secondary { background: transparent; color: var(--rmi-text-primary); border: 1px solid var(--rmi-border); } .rmi-btn--primary {
.rmi-btn--secondary:hover { border-color: var(--rmi-accent); color: var(--rmi-accent); } background: var(--rmi-accent); color: #000 !important; border: none;
.rmi-btn--ghost { background: transparent; color: var(--rmi-text-secondary); border: none; padding: 8px 16px; } box-shadow: 0 0 0 0 rgba(0,255,136,0);
}
.rmi-btn--primary:hover {
background: #1aff94; transform: translateY(-2px);
box-shadow: 0 8px 32px rgba(0,255,136,0.28);
}
.rmi-btn--primary:active { transform: translateY(0); box-shadow: 0 2px 12px rgba(0,255,136,0.2); }
.rmi-btn--secondary {
background: transparent; color: var(--rmi-text-primary);
border: 1px solid var(--rmi-border-light);
}
.rmi-btn--secondary:hover {
border-color: var(--rmi-accent); color: var(--rmi-accent);
box-shadow: 0 0 20px rgba(0,255,136,0.06);
}
.rmi-btn--ghost {
background: transparent; color: var(--rmi-text-secondary);
border: none; padding: 8px 16px;
}
.rmi-btn--ghost:hover { color: var(--rmi-accent); } .rmi-btn--ghost:hover { color: var(--rmi-accent); }
/* Badges */ /* ── Badges ──────────────────────────────────────────────── */
.rmi-badge { display: inline-flex; align-items: center; gap: 6px; font-size: 0.66rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.08em; padding: 4px 12px; border-radius: 5px; } .rmi-badge {
.rmi-badge--live { background: rgba(0,255,136,0.08); color: var(--rmi-accent); border: 1px solid rgba(0,255,136,0.18); } display: inline-flex; align-items: center; gap: 6px;
.rmi-badge--coming { background: rgba(0,255,136,0.04); color: var(--rmi-accent); border: 1px solid rgba(0,255,136,0.12); } font-size: 0.66rem; font-weight: 700; text-transform: uppercase;
letter-spacing: 0.09em; padding: 5px 12px; border-radius: 5px;
}
.rmi-badge--live {
background: rgba(0,255,136,0.06); color: var(--rmi-accent);
border: 1px solid rgba(0,255,136,0.15);
}
.rmi-badge--coming {
background: rgba(0,255,136,0.03); color: var(--rmi-accent);
border: 1px solid rgba(0,255,136,0.10);
}
@keyframes pulse { 0%,100% { opacity:1; transform:scale(1) } 50% { opacity:0.35; transform:scale(0.8) } } /* ── Live Dot ───────────────────────────────────────────── */
.rmi-status-live { display: inline-block; width: 6px; height: 6px; background: var(--rmi-accent); border-radius: 50%; box-shadow: 0 0 8px var(--rmi-accent); animation: pulse 2s ease-in-out infinite; } @keyframes pulse {
0%, 100% { opacity: 1; transform: scale(1); }
50% { opacity: 0.3; transform: scale(0.75); }
}
.rmi-status-live {
display: inline-block; width: 6px; height: 6px;
background: var(--rmi-accent); border-radius: 50%;
box-shadow: 0 0 10px var(--rmi-accent);
animation: pulse 2.2s ease-in-out infinite;
}
.navbar-forgejo-link::before { content: '⊞'; margin-right: 5px; } /* ── Nav Icon ────────────────────────────────────────────── */
.navbar-forgejo-link::before { content: '⊞'; margin-right: 5px; font-weight: 700; }
@media (max-width:996px) { h1{font-size:2rem} h2{font-size:1.5rem} .navbar{height:52px} .footer{padding:40px 0 30px} } /* ── Responsive ──────────────────────────────────────────── */
@media (max-width:480px) { h1{font-size:1.6rem} body{font-size:14px} .rmi-btn{padding:10px 22px;font-size:0.82rem} } @media (max-width: 996px) {
@media print { .navbar,.footer,.theme-doc-sidebar-container{display:none} body{background:#fff;color:#000} } h1 { font-size: 2.2rem; } h2 { font-size: 1.6rem; }
.navbar { height: 52px; } .footer { padding: 44px 0 32px; }
}
@media (max-width: 480px) {
h1 { font-size: 1.7rem; } h2 { font-size: 1.3rem; }
body { font-size: 14px; }
.rmi-btn { padding: 11px 22px; font-size: 0.82rem; }
}
/* ── Print ──────────────────────────────────────────────── */
@media print {
.navbar, .footer, .theme-doc-sidebar-container { display: none; }
body { background: #fff; color: #000; }
}

5
src/pages/build.tsx
View file

@ -60,11 +60,6 @@ export default function Build() {
{active.map(r => <RepoCard key={r.name} repo={r} active />)} {active.map(r => <RepoCard key={r.name} repo={r} active />)}
</div> </div>
<h2 style={{ fontSize: '1.3rem', fontWeight: 700, marginBottom: 20, color: '#E8E8ED' }}>Fleet Infrastructure</h2>
<div style={{ display: 'grid', gap: 14, marginBottom: 40 }}>
{infra.map(r => <RepoCard key={r.name} repo={r} active />)}
</div>
<h2 style={{ fontSize: '1.3rem', fontWeight: 700, marginBottom: 20, color: '#E8E8ED' }}>Archived</h2> <h2 style={{ fontSize: '1.3rem', fontWeight: 700, marginBottom: 20, color: '#E8E8ED' }}>Archived</h2>
<div style={{ display: 'grid', gap: 14, marginBottom: 40 }}> <div style={{ display: 'grid', gap: 14, marginBottom: 40 }}>
{legacy.map(r => <RepoCard key={r.name} repo={r} active={false} />)} {legacy.map(r => <RepoCard key={r.name} repo={r} active={false} />)}