Merge pull request 'Chore/php83 test suites' (#2) from chore/php83-test-suites into main

Reviewed-on: #2

.gitignore

@@ -12,12 +12,10 @@ node_modules/
 /static/
 
 # Backend development
+/vendor/
 /lib/vendor/
 coverage/
-phpunit.xml.cache
+*.cache
-.phpunit.result.cache
-.php-cs-fixer.cache
-.phpstan.cache
 .phpactor/
 
 # Editors

composer.lock

@@ -0,0 +1,18 @@
+{
+    "_readme": [
+        "This file locks the dependencies of your project to a known state",
+        "Read more about it at https://getcomposer.org/doc/01-basic-usage.md#installing-dependencies",
+        "This file is @generated automatically"
+    ],
+    "content-hash": "3135496d47e073c6900b35ed95b62679",
+    "packages": [],
+    "packages-dev": [],
+    "aliases": [],
+    "minimum-stability": "stable",
+    "stability-flags": {},
+    "prefer-stable": false,
+    "prefer-lowest": false,
+    "platform": {},
+    "platform-dev": {},
+    "plugin-api-version": "2.6.0"
+}

l10n/en.json

@@ -49,12 +49,25 @@
   },
   "presets": {
     "amber": "Amber",
+    "arctic": "Arctic",
+    "citrus": "Citrus",
+    "cobalt": "Cobalt",
+    "contrast": "High Contrast",
+    "crimson": "Crimson",
     "custom": "Custom",
-    "default": "Indigo",
+    "default": "Graphite",
     "emerald": "Emerald",
-    "graphite": "Graphite",
+    "forest": "Forest",
+    "grape": "Grape",
+    "indigo": "Indigo",
+    "midnight": "Midnight",
+    "mono": "Mono",
     "ocean": "Ocean",
-    "rose": "Rose"
+    "rose": "Rose",
+    "sakura": "Sakura",
+    "sepia": "Sepia",
+    "solar": "Solar",
+    "vampire": "Vampire"
   },
   "settings": {
     "createCustom": "Customize",

l10n/en.manual.json

@@ -8,12 +8,25 @@
     "system": "System"
   },
   "presets": {
-    "default": "Indigo",
+    "default": "Graphite",
+    "indigo": "Indigo",
     "emerald": "Emerald",
     "rose": "Rose",
     "amber": "Amber",
     "ocean": "Ocean",
-    "graphite": "Graphite",
+    "grape": "Grape",
+    "crimson": "Crimson",
+    "cobalt": "Cobalt",
+    "forest": "Forest",
+    "citrus": "Citrus",
+    "sepia": "Sepia",
+    "sakura": "Sakura",
+    "midnight": "Midnight",
+    "arctic": "Arctic",
+    "vampire": "Vampire",
+    "solar": "Solar",
+    "mono": "Mono",
+    "contrast": "High Contrast",
     "custom": "Custom"
   },
   "tokens": {

src/presets.ts

@@ -12,12 +12,53 @@ export const DEFAULT_FONT = 'Public Sans'
 export const PRESETS: ThemerPreset[] = [
   {
     id: 'default',
-    label: 'Indigo',
+    label: 'Graphite',
     l10n: 'presets.default',
     light: { colors: {} },
     dark: { colors: {} },
   },
 
+  {
+    id: 'indigo',
+    label: 'Indigo',
+    l10n: 'presets.indigo',
+    light: {
+      colors: {
+        'primary': '#6366F1',
+        'on-primary': '#FFFFFF',
+        'primary-darken-1': '#4F46E5',
+        'primary-lighten-1': '#818CF8',
+        'secondary': '#8B5CF6',
+        'on-secondary': '#FFFFFF',
+        'secondary-darken-1': '#7C3AED',
+        'secondary-lighten-1': '#A78BFA',
+        'background': '#F8FAFC',
+      },
+    },
+    dark: {
+      colors: {
+        'primary': '#818CF8',
+        'on-primary': '#FFFFFF',
+        'primary-darken-1': '#6366F1',
+        'primary-lighten-1': '#A5B4FC',
+        'secondary': '#A78BFA',
+        'on-secondary': '#FFFFFF',
+        'secondary-darken-1': '#8B5CF6',
+        'secondary-lighten-1': '#C4B5FD',
+        'background': '#0F172A',
+        'surface': '#1E293B',
+        'surface-bright': '#334155',
+        'surface-variant': '#1E293B',
+        'grey-lighten-3': '#334155',
+        'grey-lighten-4': '#1E293B',
+        'grey-lighten-5': '#0F172A',
+        'perfect-scrollbar-thumb': '#475569',
+        'track-bg': '#334155',
+      },
+      variables: { 'border-color': '#334155' },
+    },
+  },
+
   {
     id: 'emerald',
     label: 'Emerald',
@@ -197,41 +238,574 @@ export const PRESETS: ThemerPreset[] = [
   },
 
   {
-    id: 'graphite',
+    id: 'grape',
-    label: 'Graphite',
+    label: 'Grape',
-    l10n: 'presets.graphite',
+    l10n: 'presets.grape',
     light: {
       colors: {
-        'primary': '#334155',
+        'primary': '#7C3AED',
-        'primary-darken-1': '#1E293B',
+        'primary-darken-1': '#6D28D9',
-        'primary-lighten-1': '#64748B',
+        'primary-lighten-1': '#A78BFA',
-        'secondary': '#64748B',
+        'secondary': '#C026D3',
-        'secondary-darken-1': '#475569',
+        'secondary-darken-1': '#A21CAF',
-        'secondary-lighten-1': '#94A3B8',
+        'secondary-lighten-1': '#E879F9',
-        'background': '#F6F7F9',
+        'background': '#FAF7FD',
+        'surface-variant': '#F4EDFA',
+        'grey-lighten-4': '#F4EDFA',
+        'grey-lighten-5': '#FAF7FD',
+        'track-bg': '#F4EDFA',
       },
+      variables: { 'border-color': '#E8DCF2' },
     },
     dark: {
       colors: {
-        'primary': '#94A3B8',
+        'primary': '#A78BFA',
-        'on-primary': '#0F172A',
+        'on-primary': '#2E1065',
-        'primary-darken-1': '#64748B',
+        'primary-darken-1': '#8B5CF6',
-        'primary-lighten-1': '#CBD5E1',
+        'primary-lighten-1': '#C4B5FD',
-        'secondary': '#CBD5E1',
+        'secondary': '#E879F9',
-        'on-secondary': '#0F172A',
+        'on-secondary': '#4A044E',
-        'secondary-darken-1': '#94A3B8',
+        'secondary-darken-1': '#D946EF',
-        'secondary-lighten-1': '#E2E8F0',
+        'secondary-lighten-1': '#F0ABFC',
-        'background': '#0B0F17',
+        'background': '#120D1B',
-        'surface': '#151A23',
+        'surface': '#1C1527',
-        'surface-bright': '#232A36',
+        'surface-bright': '#2A2038',
-        'surface-variant': '#151A23',
+        'surface-variant': '#1C1527',
-        'grey-lighten-3': '#2A3240',
+        'grey-lighten-3': '#342947',
-        'grey-lighten-4': '#151A23',
+        'grey-lighten-4': '#1C1527',
-        'grey-lighten-5': '#0B0F17',
+        'grey-lighten-5': '#120D1B',
-        'perfect-scrollbar-thumb': '#3A4353',
+        'perfect-scrollbar-thumb': '#453759',
-        'track-bg': '#232A36',
+        'track-bg': '#2A2038',
       },
-      variables: { 'border-color': '#2A3240' },
+      variables: { 'border-color': '#342947' },
+    },
+  },
+
+  {
+    id: 'crimson',
+    label: 'Crimson',
+    l10n: 'presets.crimson',
+    light: {
+      colors: {
+        'primary': '#DC2626',
+        'primary-darken-1': '#B91C1C',
+        'primary-lighten-1': '#F87171',
+        'secondary': '#C2410C',
+        'secondary-darken-1': '#9A3412',
+        'secondary-lighten-1': '#FB923C',
+        'background': '#FCF7F6',
+        'surface-variant': '#FAEDEA',
+        'grey-lighten-4': '#FAEDEA',
+        'grey-lighten-5': '#FCF7F6',
+        'track-bg': '#FAEDEA',
+      },
+      variables: { 'border-color': '#F0DDD7' },
+    },
+    dark: {
+      colors: {
+        'primary': '#F87171',
+        'on-primary': '#450A0A',
+        'primary-darken-1': '#EF4444',
+        'primary-lighten-1': '#FCA5A5',
+        'secondary': '#FB923C',
+        'on-secondary': '#431407',
+        'secondary-darken-1': '#F97316',
+        'secondary-lighten-1': '#FDBA74',
+        'background': '#170D0D',
+        'surface': '#221514',
+        'surface-bright': '#311F1E',
+        'surface-variant': '#221514',
+        'grey-lighten-3': '#3B2726',
+        'grey-lighten-4': '#221514',
+        'grey-lighten-5': '#170D0D',
+        'perfect-scrollbar-thumb': '#4E3331',
+        'track-bg': '#311F1E',
+      },
+      variables: { 'border-color': '#3B2726' },
+    },
+  },
+
+  {
+    id: 'cobalt',
+    label: 'Cobalt',
+    l10n: 'presets.cobalt',
+    light: {
+      colors: {
+        'primary': '#2563EB',
+        'primary-darken-1': '#1D4ED8',
+        'primary-lighten-1': '#60A5FA',
+        'secondary': '#0EA5E9',
+        'secondary-darken-1': '#0284C7',
+        'secondary-lighten-1': '#38BDF8',
+        'background': '#F5F8FD',
+        'surface-variant': '#EBF1FA',
+        'grey-lighten-4': '#EBF1FA',
+        'grey-lighten-5': '#F5F8FD',
+        'track-bg': '#EBF1FA',
+      },
+      variables: { 'border-color': '#DCE6F3' },
+    },
+    dark: {
+      colors: {
+        'primary': '#60A5FA',
+        'on-primary': '#172554',
+        'primary-darken-1': '#3B82F6',
+        'primary-lighten-1': '#93C5FD',
+        'secondary': '#38BDF8',
+        'on-secondary': '#082F49',
+        'secondary-darken-1': '#0EA5E9',
+        'secondary-lighten-1': '#7DD3FC',
+        'background': '#0B0F1A',
+        'surface': '#131A29',
+        'surface-bright': '#1D2839',
+        'surface-variant': '#131A29',
+        'grey-lighten-3': '#273349',
+        'grey-lighten-4': '#131A29',
+        'grey-lighten-5': '#0B0F1A',
+        'perfect-scrollbar-thumb': '#33425C',
+        'track-bg': '#1D2839',
+      },
+      variables: { 'border-color': '#273349' },
+    },
+  },
+
+  {
+    id: 'forest',
+    label: 'Forest',
+    l10n: 'presets.forest',
+    light: {
+      colors: {
+        'primary': '#166534',
+        'primary-darken-1': '#14532D',
+        'primary-lighten-1': '#22C55E',
+        'secondary': '#4D7C0F',
+        'secondary-darken-1': '#3F6212',
+        'secondary-lighten-1': '#84CC16',
+        'background': '#F5F9F3',
+        'surface-variant': '#EBF3E7',
+        'grey-lighten-4': '#EBF3E7',
+        'grey-lighten-5': '#F5F9F3',
+        'track-bg': '#EBF3E7',
+      },
+      variables: { 'border-color': '#DCE9D4' },
+    },
+    dark: {
+      colors: {
+        'primary': '#4ADE80',
+        'on-primary': '#052E16',
+        'primary-darken-1': '#22C55E',
+        'primary-lighten-1': '#86EFAC',
+        'secondary': '#A3E635',
+        'on-secondary': '#1A2E05',
+        'secondary-darken-1': '#84CC16',
+        'secondary-lighten-1': '#BEF264',
+        'background': '#0B130C',
+        'surface': '#131F15',
+        'surface-bright': '#1D2D1F',
+        'surface-variant': '#131F15',
+        'grey-lighten-3': '#253829',
+        'grey-lighten-4': '#131F15',
+        'grey-lighten-5': '#0B130C',
+        'perfect-scrollbar-thumb': '#314834',
+        'track-bg': '#1D2D1F',
+      },
+      variables: { 'border-color': '#253829' },
+    },
+  },
+
+  {
+    id: 'citrus',
+    label: 'Citrus',
+    l10n: 'presets.citrus',
+    light: {
+      colors: {
+        'primary': '#65A30D',
+        'primary-darken-1': '#4D7C0F',
+        'primary-lighten-1': '#A3E635',
+        'secondary': '#CA8A04',
+        'secondary-darken-1': '#A16207',
+        'secondary-lighten-1': '#FACC15',
+        'background': '#F9FAF1',
+        'surface-variant': '#F2F5E3',
+        'grey-lighten-4': '#F2F5E3',
+        'grey-lighten-5': '#F9FAF1',
+        'track-bg': '#F2F5E3',
+      },
+      variables: { 'border-color': '#E5EBCE' },
+    },
+    dark: {
+      colors: {
+        'primary': '#A3E635',
+        'on-primary': '#1A2E05',
+        'primary-darken-1': '#84CC16',
+        'primary-lighten-1': '#BEF264',
+        'secondary': '#FACC15',
+        'on-secondary': '#422006',
+        'secondary-darken-1': '#EAB308',
+        'secondary-lighten-1': '#FDE047',
+        'background': '#101206',
+        'surface': '#1A1D0E',
+        'surface-bright': '#262B16',
+        'surface-variant': '#1A1D0E',
+        'grey-lighten-3': '#333921',
+        'grey-lighten-4': '#1A1D0E',
+        'grey-lighten-5': '#101206',
+        'perfect-scrollbar-thumb': '#434A2D',
+        'track-bg': '#262B16',
+      },
+      variables: { 'border-color': '#333921' },
+    },
+  },
+
+  {
+    id: 'sepia',
+    label: 'Sepia',
+    l10n: 'presets.sepia',
+    light: {
+      colors: {
+        'primary': '#6F4E37',
+        'primary-darken-1': '#593E2C',
+        'primary-lighten-1': '#A07855',
+        'secondary': '#A16207',
+        'secondary-darken-1': '#854D0E',
+        'secondary-lighten-1': '#CA8A04',
+        'background': '#FAF6EF',
+        'surface-variant': '#F3ECDF',
+        'grey-lighten-4': '#F3ECDF',
+        'grey-lighten-5': '#FAF6EF',
+        'track-bg': '#F3ECDF',
+      },
+      variables: { 'border-color': '#E8DECA' },
+    },
+    dark: {
+      colors: {
+        'primary': '#C9A47F',
+        'on-primary': '#2A1B10',
+        'primary-darken-1': '#A07855',
+        'primary-lighten-1': '#DEC3A5',
+        'secondary': '#D9B45B',
+        'on-secondary': '#2A2008',
+        'secondary-darken-1': '#BB9440',
+        'secondary-lighten-1': '#E8CD8A',
+        'background': '#141009',
+        'surface': '#1E1811',
+        'surface-bright': '#2B2318',
+        'surface-variant': '#1E1811',
+        'grey-lighten-3': '#382E20',
+        'grey-lighten-4': '#1E1811',
+        'grey-lighten-5': '#141009',
+        'perfect-scrollbar-thumb': '#4A3D2B',
+        'track-bg': '#2B2318',
+      },
+      variables: { 'border-color': '#382E20' },
+    },
+  },
+
+  {
+    id: 'sakura',
+    label: 'Sakura',
+    l10n: 'presets.sakura',
+    light: {
+      colors: {
+        'primary': '#C0446E',
+        'primary-darken-1': '#A32D57',
+        'primary-lighten-1': '#E38AA9',
+        'secondary': '#8E4EC6',
+        'secondary-darken-1': '#7639A8',
+        'secondary-lighten-1': '#B78BE0',
+        'background': '#FDF7F9',
+        'surface-variant': '#FAEDF2',
+        'grey-lighten-4': '#FAEDF2',
+        'grey-lighten-5': '#FDF7F9',
+        'track-bg': '#FAEDF2',
+      },
+      variables: { 'border-color': '#F2DEE7' },
+    },
+    dark: {
+      colors: {
+        'primary': '#F9A8D4',
+        'on-primary': '#500724',
+        'primary-darken-1': '#F472B6',
+        'primary-lighten-1': '#FBCFE8',
+        'secondary': '#D8B4FE',
+        'on-secondary': '#3B0764',
+        'secondary-darken-1': '#C084FC',
+        'secondary-lighten-1': '#E9D5FF',
+        'background': '#161014',
+        'surface': '#211820',
+        'surface-bright': '#30222D',
+        'surface-variant': '#211820',
+        'grey-lighten-3': '#3C2B37',
+        'grey-lighten-4': '#211820',
+        'grey-lighten-5': '#161014',
+        'perfect-scrollbar-thumb': '#4E3947',
+        'track-bg': '#30222D',
+      },
+      variables: { 'border-color': '#3C2B37' },
+    },
+  },
+
+  {
+    id: 'midnight',
+    label: 'Midnight',
+    l10n: 'presets.midnight',
+    light: {
+      colors: {
+        'primary': '#111827',
+        'primary-darken-1': '#030712',
+        'primary-lighten-1': '#374151',
+        'secondary': '#0891B2',
+        'secondary-darken-1': '#0E7490',
+        'secondary-lighten-1': '#22D3EE',
+        'background': '#F7F8FA',
+        'surface-variant': '#EFF1F4',
+        'grey-lighten-4': '#EFF1F4',
+        'grey-lighten-5': '#F7F8FA',
+        'track-bg': '#EFF1F4',
+      },
+      variables: { 'border-color': '#E1E4EA' },
+    },
+    dark: {
+      colors: {
+        'primary': '#67E8F9',
+        'on-primary': '#083344',
+        'primary-darken-1': '#22D3EE',
+        'primary-lighten-1': '#A5F3FC',
+        'secondary': '#D1D5DB',
+        'on-secondary': '#111827',
+        'secondary-darken-1': '#9CA3AF',
+        'secondary-lighten-1': '#E5E7EB',
+        'background': '#05070B',
+        'surface': '#0C0F16',
+        'surface-bright': '#161B24',
+        'surface-variant': '#0C0F16',
+        'grey-lighten-3': '#202632',
+        'grey-lighten-4': '#0C0F16',
+        'grey-lighten-5': '#05070B',
+        'perfect-scrollbar-thumb': '#2C3442',
+        'track-bg': '#161B24',
+      },
+      variables: { 'border-color': '#202632' },
+    },
+  },
+
+  {
+    id: 'arctic',
+    label: 'Arctic',
+    l10n: 'presets.arctic',
+    light: {
+      colors: {
+        'primary': '#4C6A91',
+        'primary-darken-1': '#3E5677',
+        'primary-lighten-1': '#81A1C1',
+        'secondary': '#4E7A85',
+        'secondary-darken-1': '#3F636C',
+        'secondary-lighten-1': '#8FBCBB',
+        'background': '#ECEFF4',
+        'surface-variant': '#E5E9F0',
+        'grey-lighten-4': '#E5E9F0',
+        'grey-lighten-5': '#ECEFF4',
+        'track-bg': '#E5E9F0',
+      },
+      variables: { 'border-color': '#D8DEE9' },
+    },
+    dark: {
+      colors: {
+        'primary': '#88C0D0',
+        'on-primary': '#2E3440',
+        'primary-darken-1': '#5E81AC',
+        'primary-lighten-1': '#A8D3DF',
+        'secondary': '#81A1C1',
+        'on-secondary': '#2E3440',
+        'secondary-darken-1': '#5E81AC',
+        'secondary-lighten-1': '#A3BDD6',
+        'background': '#242933',
+        'surface': '#2E3440',
+        'surface-bright': '#3B4252',
+        'surface-variant': '#2E3440',
+        'grey-lighten-3': '#434C5E',
+        'grey-lighten-4': '#2E3440',
+        'grey-lighten-5': '#242933',
+        'perfect-scrollbar-thumb': '#4C566A',
+        'track-bg': '#3B4252',
+      },
+      variables: { 'border-color': '#434C5E' },
+    },
+  },
+
+  {
+    id: 'vampire',
+    label: 'Vampire',
+    l10n: 'presets.vampire',
+    light: {
+      colors: {
+        'primary': '#644AC9',
+        'primary-darken-1': '#503BA3',
+        'primary-lighten-1': '#BD93F9',
+        'secondary': '#B93283',
+        'secondary-darken-1': '#99286C',
+        'secondary-lighten-1': '#FF79C6',
+        'background': '#F8F8F2',
+        'surface-variant': '#EFEFE6',
+        'grey-lighten-4': '#EFEFE6',
+        'grey-lighten-5': '#F8F8F2',
+        'track-bg': '#EFEFE6',
+      },
+      variables: { 'border-color': '#E0E0D4' },
+    },
+    dark: {
+      colors: {
+        'primary': '#BD93F9',
+        'on-primary': '#21222C',
+        'primary-darken-1': '#9A6DE8',
+        'primary-lighten-1': '#D3B8FA',
+        'secondary': '#FF79C6',
+        'on-secondary': '#21222C',
+        'secondary-darken-1': '#E356A7',
+        'secondary-lighten-1': '#FFA8D9',
+        'background': '#1E2029',
+        'surface': '#282A36',
+        'surface-bright': '#343746',
+        'surface-variant': '#282A36',
+        'grey-lighten-3': '#44475A',
+        'grey-lighten-4': '#282A36',
+        'grey-lighten-5': '#1E2029',
+        'perfect-scrollbar-thumb': '#565973',
+        'track-bg': '#343746',
+      },
+      variables: { 'border-color': '#44475A' },
+    },
+  },
+
+  {
+    id: 'solar',
+    label: 'Solar',
+    l10n: 'presets.solar',
+    light: {
+      colors: {
+        'primary': '#1E6FA8',
+        'primary-darken-1': '#175A88',
+        'primary-lighten-1': '#4FA8E0',
+        'secondary': '#21807A',
+        'secondary-darken-1': '#196660',
+        'secondary-lighten-1': '#2AA198',
+        'background': '#FDF6E3',
+        'surface-variant': '#EEE8D5',
+        'grey-lighten-4': '#EEE8D5',
+        'grey-lighten-5': '#FDF6E3',
+        'track-bg': '#EEE8D5',
+      },
+      variables: { 'border-color': '#E0D9C0' },
+    },
+    dark: {
+      colors: {
+        'primary': '#5CACE2',
+        'on-primary': '#00212B',
+        'primary-darken-1': '#268BD2',
+        'primary-lighten-1': '#8CC8ED',
+        'secondary': '#4FBDB4',
+        'on-secondary': '#00212B',
+        'secondary-darken-1': '#2AA198',
+        'secondary-lighten-1': '#7FD1CA',
+        'background': '#00212B',
+        'surface': '#002B36',
+        'surface-bright': '#073642',
+        'surface-variant': '#002B36',
+        'grey-lighten-3': '#0F4756',
+        'grey-lighten-4': '#002B36',
+        'grey-lighten-5': '#00212B',
+        'perfect-scrollbar-thumb': '#17586A',
+        'track-bg': '#073642',
+      },
+      variables: { 'border-color': '#0F4756' },
+    },
+  },
+
+  {
+    id: 'mono',
+    label: 'Mono',
+    l10n: 'presets.mono',
+    light: {
+      colors: {
+        'primary': '#262626',
+        'primary-darken-1': '#171717',
+        'primary-lighten-1': '#525252',
+        'secondary': '#525252',
+        'secondary-darken-1': '#404040',
+        'secondary-lighten-1': '#737373',
+        'background': '#F7F7F7',
+        'surface-variant': '#F0F0F0',
+        'grey-lighten-4': '#F0F0F0',
+        'grey-lighten-5': '#F7F7F7',
+        'track-bg': '#F0F0F0',
+      },
+      variables: { 'border-color': '#E3E3E3' },
+    },
+    dark: {
+      colors: {
+        'primary': '#D4D4D4',
+        'on-primary': '#171717',
+        'primary-darken-1': '#A3A3A3',
+        'primary-lighten-1': '#E5E5E5',
+        'secondary': '#A3A3A3',
+        'on-secondary': '#171717',
+        'secondary-darken-1': '#737373',
+        'secondary-lighten-1': '#D4D4D4',
+        'background': '#0D0D0D',
+        'surface': '#161616',
+        'surface-bright': '#232323',
+        'surface-variant': '#161616',
+        'grey-lighten-3': '#2E2E2E',
+        'grey-lighten-4': '#161616',
+        'grey-lighten-5': '#0D0D0D',
+        'perfect-scrollbar-thumb': '#3D3D3D',
+        'track-bg': '#232323',
+      },
+      variables: { 'border-color': '#2E2E2E' },
+    },
+  },
+
+  {
+    id: 'contrast',
+    label: 'High Contrast',
+    l10n: 'presets.contrast',
+    light: {
+      colors: {
+        'primary': '#1D4ED8',
+        'primary-darken-1': '#1E3A8A',
+        'primary-lighten-1': '#3B82F6',
+        'secondary': '#171717',
+        'secondary-darken-1': '#000000',
+        'secondary-lighten-1': '#404040',
+        'background': '#FFFFFF',
+        'surface-variant': '#F2F2F2',
+        'grey-lighten-4': '#F2F2F2',
+        'grey-lighten-5': '#FFFFFF',
+        'track-bg': '#F2F2F2',
+      },
+      variables: { 'border-color': '#111111', 'border-opacity': 0.6 },
+    },
+    dark: {
+      colors: {
+        'primary': '#FFD60A',
+        'on-primary': '#000000',
+        'primary-darken-1': '#D4B100',
+        'primary-lighten-1': '#FFE657',
+        'secondary': '#FFFFFF',
+        'on-secondary': '#000000',
+        'secondary-darken-1': '#D4D4D4',
+        'secondary-lighten-1': '#FFFFFF',
+        'background': '#000000',
+        'surface': '#0A0A0A',
+        'surface-bright': '#1F1F1F',
+        'surface-variant': '#0A0A0A',
+        'grey-lighten-3': '#333333',
+        'grey-lighten-4': '#0A0A0A',
+        'grey-lighten-5': '#000000',
+        'perfect-scrollbar-thumb': '#666666',
+        'track-bg': '#1F1F1F',
+      },
+      variables: { 'border-color': '#FFFFFF', 'border-opacity': 0.6 },
     },
   },
 ]

src/views/ThemerAdminPage.vue

@@ -22,10 +22,8 @@ function selectPreset(id: string): void {
 </script>
 
 <template>
-  <PerfectScrollbar
+  <div
     class="pa-4"
-    style="height: calc(100vh - 64px);"
-    :options="{ wheelPropagation: false }"
   >
     <h5 class="text-h5 mb-4">{{ t('admin.title', 'Appearance') }}</h5>
 
@@ -89,5 +87,5 @@ function selectPreset(id: string): void {
         </VCol>
       </VRow>
     </template>
-  </PerfectScrollbar>
+  </div>
 </template>

src/views/ThemerCustomizePage.vue

@@ -71,10 +71,8 @@ function cancel(): void {
 </script>
 
 <template>
-  <PerfectScrollbar
+  <div
     class="pa-4"
-    style="height: calc(100vh - 64px);"
-    :options="{ wheelPropagation: false }"
   >
     <div class="d-flex align-center mb-4">
       <VBtn icon="mdi-arrow-left" variant="text" size="small" class="mr-2" @click="cancel" />
@@ -155,5 +153,5 @@ function cancel(): void {
         <ThemePreview :theme-name="previewThemeName" />
       </VCol>
     </VRow>
-  </PerfectScrollbar>
+  </div>
 </template>

src/views/ThemerSettingsPage.vue

@@ -33,10 +33,8 @@ function openEditor(): void {
 </script>
 
 <template>
-  <PerfectScrollbar
+  <div
     class="pa-4"
-    style="height: calc(100vh - 64px);"
-    :options="{ wheelPropagation: false }"
   >
     <h5 class="text-h5 mb-4">{{ t('settings.title', 'Appearance') }}</h5>
 
@@ -127,5 +125,5 @@ function openEditor(): void {
         />
       </VCol>
     </VRow>
-  </PerfectScrollbar>
+  </div>
 </template>