MokoConsulting/MokoCassiopeia
1
1
Fork 0
Code Issues 2 Pull Requests Actions Packages Releases 1 Activity

Fonts, title alignment, clear rows, custom themes (03.09.10)

Browse Source 
Fonts:
- Roboto CSS updated to v51 paths (was v30)
- New CSS for Fredoka and Pacifico
- Remove orphan fira-sans.css and noto-sans.css (no woff2 files)
- Updated fonts README

CSS:
- clear: both on top-a, top-b, bottom-a, bottom-b, breadcrumbs
- .title-center and .title-right alignment classes
- Banner overlay height variable

Custom themes (for dev testing):
- light.custom.css: Warm Earth (brown/saddle brown palette)
- dark.custom.css: Deep Purple (purple/teal palette)

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Jonathan Miller
2026-04-07 23:49:56 -05:00
parent 00dd666197
commit 50a6f006ac
10 changed files with 2361 additions and 289 deletions
Download Patch File Download Diff File Expand all files Collapse all files

56
src/media/css/fonts/fira-sans.css
View File

@@ -1,56 +0,0 @@
/* Copyright (C) 2025 Moko Consulting <hello@mokoconsulting.tech>
This file is part of a Moko Consulting project.
SPDX-License-Identifier: GPL-3.0-or-later
*/
/*
* IMPORTANT: Font files must be downloaded separately
*
* This CSS file references Fira Sans font files that must be manually downloaded
* and placed in the fonts directory. See GOOGLE_FONTS_README.md in the fonts
* directory for download instructions.
*
* Required files:
* - fira-sans-v17-latin-100.woff2
* - fira-sans-v17-latin-300.woff2
* - fira-sans-v17-latin-regular.woff2
* - fira-sans-v17-latin-700.woff2
*/
/* Fira Sans Thin (100) */
@font-face {
font-family: 'Fira Sans';
font-style: normal;
font-weight: 100;
font-display: swap;
src: url('../../fonts/fira-sans-v17-latin-100.woff2') format('woff2');
}
/* Fira Sans Light (300) */
@font-face {
font-family: 'Fira Sans';
font-style: normal;
font-weight: 300;
font-display: swap;
src: url('../../fonts/fira-sans-v17-latin-300.woff2') format('woff2');
}
/* Fira Sans Regular (400) */
@font-face {
font-family: 'Fira Sans';
font-style: normal;
font-weight: 400;
font-display: swap;
src: url('../../fonts/fira-sans-v17-latin-regular.woff2') format('woff2');
}
/* Fira Sans Bold (700) */
@font-face {
font-family: 'Fira Sans';
font-style: normal;
font-weight: 700;
font-display: swap;
src: url('../../fonts/fira-sans-v17-latin-700.woff2') format('woff2');
}

10
src/media/css/fonts/fredoka.css Normal file
View File

@@ -0,0 +1,10 @@
/* Copyright (C) 2026 Moko Consulting <hello@mokoconsulting.tech>
* SPDX-License-Identifier: GPL-3.0-or-later
* Fredoka — self-hosted from src/media/fonts/
*/
@font-face { font-family: 'Fredoka'; font-style: normal; font-weight: 300; font-display: swap; src: url('../../fonts/fredoka-v17-latin-300.woff2') format('woff2'); }
@font-face { font-family: 'Fredoka'; font-style: normal; font-weight: 400; font-display: swap; src: url('../../fonts/fredoka-v17-latin-regular.woff2') format('woff2'); }
@font-face { font-family: 'Fredoka'; font-style: normal; font-weight: 500; font-display: swap; src: url('../../fonts/fredoka-v17-latin-500.woff2') format('woff2'); }
@font-face { font-family: 'Fredoka'; font-style: normal; font-weight: 600; font-display: swap; src: url('../../fonts/fredoka-v17-latin-600.woff2') format('woff2'); }
@font-face { font-family: 'Fredoka'; font-style: normal; font-weight: 700; font-display: swap; src: url('../../fonts/fredoka-v17-latin-700.woff2') format('woff2'); }

56
src/media/css/fonts/noto-sans.css
View File

@@ -1,56 +0,0 @@
/* Copyright (C) 2025 Moko Consulting <hello@mokoconsulting.tech>
This file is part of a Moko Consulting project.
SPDX-License-Identifier: GPL-3.0-or-later
*/
/*
* IMPORTANT: Font files must be downloaded separately
*
* This CSS file references Noto Sans font files that must be manually downloaded
* and placed in the fonts directory. See GOOGLE_FONTS_README.md in the fonts
* directory for download instructions.
*
* Required files:
* - noto-sans-v36-latin-100.woff2
* - noto-sans-v36-latin-300.woff2
* - noto-sans-v36-latin-regular.woff2
* - noto-sans-v36-latin-700.woff2
*/
/* Noto Sans Thin (100) */
@font-face {
font-family: 'Noto Sans';
font-style: normal;
font-weight: 100;
font-display: swap;
src: url('../../fonts/noto-sans-v36-latin-100.woff2') format('woff2');
}
/* Noto Sans Light (300) */
@font-face {
font-family: 'Noto Sans';
font-style: normal;
font-weight: 300;
font-display: swap;
src: url('../../fonts/noto-sans-v36-latin-300.woff2') format('woff2');
}
/* Noto Sans Regular (400) */
@font-face {
font-family: 'Noto Sans';
font-style: normal;
font-weight: 400;
font-display: swap;
src: url('../../fonts/noto-sans-v36-latin-regular.woff2') format('woff2');
}
/* Noto Sans Bold (700) */
@font-face {
font-family: 'Noto Sans';
font-style: normal;
font-weight: 700;
font-display: swap;
src: url('../../fonts/noto-sans-v36-latin-700.woff2') format('woff2');
}

6
src/media/css/fonts/pacifico.css Normal file
View File

@@ -0,0 +1,6 @@
/* Copyright (C) 2026 Moko Consulting <hello@mokoconsulting.tech>
* SPDX-License-Identifier: GPL-3.0-or-later
* Pacifico — self-hosted from src/media/fonts/
*/
@font-face { font-family: 'Pacifico'; font-style: normal; font-weight: 400; font-display: swap; src: url('../../fonts/pacifico-v23-latin-regular.woff2') format('woff2'); }

75
src/media/css/fonts/roboto.css
View File

@@ -1,56 +1,23 @@
/* Copyright (C) 2025 Moko Consulting <hello@mokoconsulting.tech>
This file is part of a Moko Consulting project.
SPDX-License-Identifier: GPL-3.0-or-later
/* Copyright (C) 2026 Moko Consulting <hello@mokoconsulting.tech>
* SPDX-License-Identifier: GPL-3.0-or-later
* Roboto — self-hosted from src/media/fonts/
*/
/*
* IMPORTANT: Font files must be downloaded separately
*
* This CSS file references Roboto font files that must be manually downloaded
* and placed in the fonts directory. See GOOGLE_FONTS_README.md in the fonts
* directory for download instructions.
*
* Required files:
* - roboto-v30-latin-100.woff2
* - roboto-v30-latin-300.woff2
* - roboto-v30-latin-regular.woff2
* - roboto-v30-latin-700.woff2
*/
/* Roboto Thin (100) */
@font-face {
font-family: 'Roboto';
font-style: normal;
font-weight: 100;
font-display: swap;
src: url('../../fonts/roboto-v30-latin-100.woff2') format('woff2');
}
/* Roboto Light (300) */
@font-face {
font-family: 'Roboto';
font-style: normal;
font-weight: 300;
font-display: swap;
src: url('../../fonts/roboto-v30-latin-300.woff2') format('woff2');
}
/* Roboto Regular (400) */
@font-face {
font-family: 'Roboto';
font-style: normal;
font-weight: 400;
font-display: swap;
src: url('../../fonts/roboto-v30-latin-regular.woff2') format('woff2');
}
/* Roboto Bold (700) */
@font-face {
font-family: 'Roboto';
font-style: normal;
font-weight: 700;
font-display: swap;
src: url('../../fonts/roboto-v30-latin-700.woff2') format('woff2');
}
@font-face { font-family: 'Roboto'; font-style: normal; font-weight: 100; font-display: swap; src: url('../../fonts/roboto-v51-latin-100.woff2') format('woff2'); }
@font-face { font-family: 'Roboto'; font-style: italic; font-weight: 100; font-display: swap; src: url('../../fonts/roboto-v51-latin-100italic.woff2') format('woff2'); }
@font-face { font-family: 'Roboto'; font-style: normal; font-weight: 200; font-display: swap; src: url('../../fonts/roboto-v51-latin-200.woff2') format('woff2'); }
@font-face { font-family: 'Roboto'; font-style: italic; font-weight: 200; font-display: swap; src: url('../../fonts/roboto-v51-latin-200italic.woff2') format('woff2'); }
@font-face { font-family: 'Roboto'; font-style: normal; font-weight: 300; font-display: swap; src: url('../../fonts/roboto-v51-latin-300.woff2') format('woff2'); }
@font-face { font-family: 'Roboto'; font-style: italic; font-weight: 300; font-display: swap; src: url('../../fonts/roboto-v51-latin-300italic.woff2') format('woff2'); }
@font-face { font-family: 'Roboto'; font-style: normal; font-weight: 400; font-display: swap; src: url('../../fonts/roboto-v51-latin-regular.woff2') format('woff2'); }
@font-face { font-family: 'Roboto'; font-style: italic; font-weight: 400; font-display: swap; src: url('../../fonts/roboto-v51-latin-italic.woff2') format('woff2'); }
@font-face { font-family: 'Roboto'; font-style: normal; font-weight: 500; font-display: swap; src: url('../../fonts/roboto-v51-latin-500.woff2') format('woff2'); }
@font-face { font-family: 'Roboto'; font-style: italic; font-weight: 500; font-display: swap; src: url('../../fonts/roboto-v51-latin-500italic.woff2') format('woff2'); }
@font-face { font-family: 'Roboto'; font-style: normal; font-weight: 600; font-display: swap; src: url('../../fonts/roboto-v51-latin-600.woff2') format('woff2'); }
@font-face { font-family: 'Roboto'; font-style: italic; font-weight: 600; font-display: swap; src: url('../../fonts/roboto-v51-latin-600italic.woff2') format('woff2'); }
@font-face { font-family: 'Roboto'; font-style: normal; font-weight: 700; font-display: swap; src: url('../../fonts/roboto-v51-latin-700.woff2') format('woff2'); }
@font-face { font-family: 'Roboto'; font-style: italic; font-weight: 700; font-display: swap; src: url('../../fonts/roboto-v51-latin-700italic.woff2') format('woff2'); }
@font-face { font-family: 'Roboto'; font-style: normal; font-weight: 800; font-display: swap; src: url('../../fonts/roboto-v51-latin-800.woff2') format('woff2'); }
@font-face { font-family: 'Roboto'; font-style: italic; font-weight: 800; font-display: swap; src: url('../../fonts/roboto-v51-latin-800italic.woff2') format('woff2'); }
@font-face { font-family: 'Roboto'; font-style: normal; font-weight: 900; font-display: swap; src: url('../../fonts/roboto-v51-latin-900.woff2') format('woff2'); }
@font-face { font-family: 'Roboto'; font-style: italic; font-weight: 900; font-display: swap; src: url('../../fonts/roboto-v51-latin-900italic.woff2') format('woff2'); }

8
src/media/css/template.css
View File

@@ -14624,6 +14624,10 @@ iframe {
line-height: 1.3;
}
/* Module title alignment — apply via module class suffix */
.title-center [class*="__title"] { text-align: center; }
.title-right [class*="__title"] { text-align: right; }
/* ── MODULE: Statistics ── */
.mod-stats__list {
margin: 0;
@@ -14853,8 +14857,10 @@ iframe {
.container-top-a,
.container-top-b,
.container-bottom-a,
.container-bottom-b {
.container-bottom-b,
.mod-breadcrumbs {
position: relative;
clear: both;
}
.container-top-a>*,

1143
src/media/css/theme/dark.custom.css Normal file
View File

File diff suppressed because it is too large Load Diff

1152
src/media/css/theme/light.custom.css Normal file
View File

File diff suppressed because it is too large Load Diff