From 33adb6f7b6b51eba50921d7f706aa52f71223425 Mon Sep 17 00:00:00 2001 From: Jonathan Miller <230051081+jmiller-moko@users.noreply.github.com> Date: Thu, 15 Jan 2026 15:33:56 -0600 Subject: [PATCH] Delete src/media/css/colors/dark/colors_custom.css Signed-off-by: Jonathan Miller <230051081+jmiller-moko@users.noreply.github.com> --- src/media/css/colors/dark/colors_custom.css | 361 -------------------- 1 file changed, 361 deletions(-) delete mode 100644 src/media/css/colors/dark/colors_custom.css diff --git a/src/media/css/colors/dark/colors_custom.css b/src/media/css/colors/dark/colors_custom.css deleted file mode 100644 index 35c1fda..0000000 --- a/src/media/css/colors/dark/colors_custom.css +++ /dev/null @@ -1,361 +0,0 @@ -@charset "UTF-8"; -/* Copyright (C) 2025 Moko Consulting - - This file is part of a Moko Consulting project. - - SPDX-License-Identifier: GPL-3.0-or-later - - This program is free software; you can redistribute it and/or modify it under the terms of the GNU General Public License as published by the Free Software Foundation; either version 3 of the License, or - (at your option) any later version. - - This program is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU General Public License for more details. - - You should have received a copy of the GNU General Public License along with this program. If not, see https://www.gnu.org/licenses/ . - - # FILE INFORMATION - DEFGROUP: Joomla.Template.Site - INGROUP: Moko-Cassiopeia - PATH: ./media/templates/site/moko-cassiopeia/css/global/dark/colors_standard.css - VERSION: 03.00-RC - BRIEF: Standard dark mode color definitions for Moko-Cassiopeia template - */ - -/* ----------------------------------------------- - * DARK THEME - * --------------------------------------------- */ - -:root[data-bs-theme='dark']{ - /* System hint for native widgets */ - color-scheme: dark; - - /* Brand & links */ - --color-primary: #112855; - --accent-color-primary: #3f8ff0; - --accent-color-secondary: #6fb3ff; - - --mainmenu-nav-link-color: #fff; - - --color-link: white; - --color-hover: gray; - --color-active: var(--mainmenu-nav-link-color); - - /* Header background (kept same image; works over dark bg) */ - --header-background-image: url('../../../../../../media/templates/site/moko-cassiopeia/images/bg.svg'); --header-background-attachment: fixed; - --header-background-repeat: repeat; - --header-background-size: auto; - - /* Section containers */ - --container-below-topbar-bg-image: ; - --container-below-topbar-bg-color: ; - --container-below-topbar-bg-position: center; - --container-below-topbar-bg-attachment: fixed; - --container-below-topbar-bg-repeat: no-repeat; - --container-below-topbar-bg-size: cover; - --container-below-topbar-border: ; - --container-below-topbar-border-radius: ; - - --container-top-a-bg-image: ; - --container-top-a-bg-color: ; - --container-top-a-bg-position: center; - --container-top-a-bg-attachment: fixed; - --container-top-a-bg-repeat: no-repeat; - --container-top-a-bg-size: cover; - --container-top-a-border: ; - --container-top-a-border-radius: ; - - --container-top-b-bg-image: ; - --container-top-b-bg-color: ; - --container-top-b-bg-position: center; - --container-top-b-bg-attachment: fixed; - --container-top-b-bg-repeat: no-repeat; - --container-top-b-bg-size: cover; - --container-top-b-border: ; - --container-top-b-border-radius: ; - - --container-toc-bg: ; - --container-toc-color: #dbe3ff; - - --container-sidebar-bg-image: ; - --container-sidebar-bg-color: ; - --container-sidebar-bg-position: center; - --container-sidebar-bg-attachment: scroll; - --container-sidebar-bg-repeat: repeat; - --container-sidebar-bg-size: auto; - --container-sidebar-border: ; - --container-sidebar-border-radius: ; - - --container-bottom-a-bg-image: ; - --container-bottom-a-bg-color: ; - --container-bottom-a-bg-position: center; - --container-bottom-a-bg-attachment: fixed; - --container-bottom-a-bg-repeat: no-repeat; - --container-bottom-a-bg-size: cover; - --container-bottom-a-border: ; - --container-bottom-a-border-radius: 5px; - - --container-bottom-b-bg-image: ; - --container-bottom-b-bg-color: ; - --container-bottom-b-bg-position: center; - --container-bottom-b-bg-attachment: fixed; - --container-bottom-b-bg-repeat: no-repeat; - --container-bottom-b-bg-size: cover; - --container-bottom-b-border: ; - --container-bottom-b-border-radius: ; - - /* Nav & accents */ - --nav-text-color: gray; - --nav-bg-color: var(--color-primary); - --border: 5px; - - --muted-color: #6d757e; - --hr-color: var(--border-color, #dfe3e7); - --link-active-color: var(--link-color); - --code-color-ink: var(--code-color, #e93f8e); - --border-color-soft: var(--border-color, #dfe3e7); - --kbd-bg: var(--secondary-bg, #eaedf0); - --kbd-ink: var(--body-bg, #fff); - --toc-bg: var(--secondary-bg, #eaedf0); - --toc-ink: var(--color-primary, #112855); - --selection-bg: var(--highlight-bg, #fbeea8); - --selection-ink: var(--body-color, #22262a); - - /* Palette */ - --blue: #91a4ff; - --black: #000; - --indigo: #b19cff; - --purple: #c0a5ff; - --pink: #ff8fc0; - --red: #ff7a73; - --orange: #ff9c4d; - --yellow: #ffd166; - --green: #78d694; - --teal: #76e3ff; - --cyan: #6fb7ff; - --white: #fff; - - /* Grays tuned for dark */ - --gray-100: #161a20; - --gray-200: #1b2027; - --gray-300: #222831; - --gray-400: #2b323b; - --gray-500: #36404a; - --gray-600: #48525d; - --gray-700: #5b6672; - --gray-800: #cfd6de; - --gray-900: #e6ebf1; - - /* Contextuals (keep brand hues) */ - --primary: #010156; - --secondary: #48525d; - --success: #4aa664; - --info: #4f7aa0; - --warning: #c77a00; - --danger: #c23a31; - --light: #1b2027; - --dark: #0f1318; - - /* RGB helpers */ - --primary-rgb: 1,1,86; - --secondary-rgb: 72,82,93; - --success-rgb: 74,166,100; - --info-rgb: 79,122,160; - --warning-rgb: 199,122,0; - --danger-rgb: 194,58,49; - --light-rgb: 27,32,39; - --dark-rgb: 15,19,24; - - /* Emphasis & subtle variants */ - --primary-text-emphasis: #c7ccff; - --secondary-text-emphasis: #cfd6de; - --success-text-emphasis: #bde8c9; - --info-text-emphasis: #bcd6ee; - --warning-text-emphasis: #ffd9a6; - --danger-text-emphasis: #ffb7b2; - --light-text-emphasis: #d2d8df; - --dark-text-emphasis: #d2d8df; - - --primary-bg-subtle: #0b1030; - --secondary-bg-subtle: #1e2430; - --success-bg-subtle: #0f2a1b; - --info-bg-subtle: #0d2232; - --warning-bg-subtle: #2a1e06; - --danger-bg-subtle: #2d1110; - --light-bg-subtle: #12161d; - --dark-bg-subtle: #1e2430; - - --primary-border-subtle: #2b3a7a; - --secondary-border-subtle: #2b323b; - --success-border-subtle: #2b5b40; - --info-border-subtle: #254861; - --warning-border-subtle: #5a3c0e; - --danger-border-subtle: #5c2723; - --light-border-subtle: #222831; - --dark-border-subtle: #2b323b; - - /* Typography & layout */ - --body-font-family: var(--optain-cassiopeia-font-family-body, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji'); - --body-font-size: 1rem; - --body-font-weight: 400; - --body-line-height: 1.5; - - --body-color: #e6ebf1; - --body-color-rgb: 230, 235, 241; - --body-bg: #0e1318; - --body-bg-rgb: 14, 19, 24; - - --emphasis-color: #fff; - --emphasis-color-rgb: 255, 255, 255; - - --secondary-color: #e6ebf1bf; - --secondary-color-rgb: 230, 235, 241; - - --secondary-bg: #151b22; - --secondary-bg-rgb: 21, 27, 34; - - --tertiary-color: #e6ebf180; - --tertiary-color-rgb: 230, 235, 241; - --tertiary-bg: #10151b; - --tertiary-bg-rgb: 16, 21, 27; - - --heading-color: #f1f5f9; - - --link-color: #8ab4f8; - --link-color-rgb: 138, 180, 248; - --link-decoration: underline; - --link-hover-color: #c3d6ff; - --link-hover-color-rgb: 195, 214, 255; - - --code-color: #ff7abd; - --highlight-color: #111; - --highlight-bg: #ffe28a1a; - - --border-width: 1px; - --border-style: solid; - --border-color: #2b323b; - --border-color-translucent: #ffffff26; - - --border-radius: .25rem; - --border-radius-sm: .2rem; - --border-radius-lg: .3rem; - --border-radius-xl: .3rem; - --border-radius-xxl: 2rem; - --border-radius-2xl: var(--border-radius-xxl); - --border-radius-pill: 50rem; - - --box-shadow: 0 .5rem 1rem #00000066; - --box-shadow-sm: 0 .125rem .25rem #00000040; - --box-shadow-lg: 0 1rem 3rem #00000080; - --box-shadow-inset: inset 0 1px 2px #00000040; - - --focus-ring-width: .25rem; - --focus-ring-opacity: .6; - --focus-ring-color: #5472ff66; - - --form-valid-color: #78d694; - --form-valid-border-color: #78d694; - --form-invalid-color: #ff8e86; - --form-invalid-border-color: #ff8e86; -} - -.btn { - --btn-padding-x: 1rem; - --btn-padding-y: 0.6rem; - --btn-font-family: ; - --btn-font-size: 1rem; - --btn-font-weight: 400; - --btn-line-height: 1.5; - --btn-color: var(--white); - --btn-bg: transparent; - --btn-border-width: 1px; - --btn-border-color: transparent; - --btn-border-radius: 0.25rem; - --btn-active-border-color: transparent; - --btn-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 1px rgba(0, 0, 0, 0.075); - --btn-disabled-opacity: 0.65; - --btn-focus-box-shadow: 0 0 0 0.25rem rgba(var(--btn-focus-shadow-rgb), .5); - display: inline-block; - padding: var(--btn-padding-y) var(--btn-padding-x); - font-family: var(--btn-font-family); - font-size: var(--btn-font-size); - font-weight: var(--btn-font-weight); - line-height: var(--btn-line-height); - color: var(--btn-color); - text-align: center; - text-decoration: none; - vertical-align: middle; - cursor: pointer; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - border: var(--btn-border-width) solid var(--btn-border-color); - border-radius: var(--btn-border-radius); - background-color: var(--btn-bg); - -webkit-transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out; - transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out; - -o-transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; - transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; - transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out; -} - -/* Buttons — inherit brand hues; ensure strong contrast on dark bg */ -.btn-primary { - --btn-color: hsl(0, 0%, 100%); - --btn-bg: hsl(240, 98%, 17%); - --btn-border-color: hsl(240, 98%, 17%); - --btn-hover-color: hsl(0, 0%, 100%); - --btn-hover-bg: #010149; - --btn-hover-border-color: #010145; - --btn-focus-shadow-rgb: 84, 114, 255; - --btn-active-color: hsl(0, 0%, 100%); - --btn-active-bg: #010145; - --btn-active-border-color: #010141; -} - -.btn-secondary { - --btn-color: var(--nav-text-color); - --btn-bg: var(--nav-bg-color); - --btn-border-color: #3a4250; - --btn-hover-color: #fff; - --btn-hover-bg: #1b2a55; - --btn-hover-border-color: #162448; - --btn-focus-shadow-rgb: 84, 114, 255; - --btn-active-color: #fff; - --btn-active-bg: #162448; - --btn-active-border-color: #12203f; -} - -/* Outline buttons on dark: keep readable borders */ -.btn-outline-light { - --btn-color: #e6ebf1; - --btn-border-color: #e6ebf1; - --btn-hover-color: #111; - --btn-hover-bg: #e6ebf1; - --btn-hover-border-color: #e6ebf1; - --btn-active-color: #111; - --btn-active-bg: #d7dce2; - --btn-active-border-color: #d7dce2; - --gradient: none; -} - -/* Links as buttons */ -.btn-link { - --btn-font-weight: 400; - --btn-color: var(--color-link); - --btn-bg: transparent; - --btn-border-color: transparent; - --btn-hover-color: var(--link-hover-color); - --btn-hover-border-color: transparent; - --btn-active-color: var(--link-hover-color); - --btn-active-border-color: transparent; - --btn-disabled-color: #6d7781; - --btn-disabled-border-color: transparent; - --btn-box-shadow: none; - --btn-focus-shadow-rgb: 84, 114, 255; - text-decoration: underline; -} - -.btn-secondary { - --btn-color: var(--color-hover); - --btn-bg: var(--nav-bg-color); -}