From 8ea514ad1c08aecea2ba704b2d6f3de0ba8355d5 Mon Sep 17 00:00:00 2001 From: NamelessContributor Date: Sun, 3 Apr 2022 18:05:34 +0200 Subject: [PATCH] css: add auto theme preference. fixes #5084 This is the new default. Users who previously used the light theme will be migrated to the auto setting. --- app/javascript/src/styles/base/040_colors.scss | 15 +++++++++++++-- app/models/user.rb | 4 ++-- 2 files changed, 15 insertions(+), 4 deletions(-) diff --git a/app/javascript/src/styles/base/040_colors.scss b/app/javascript/src/styles/base/040_colors.scss index d392ff5be..23e5c9b30 100644 --- a/app/javascript/src/styles/base/040_colors.scss +++ b/app/javascript/src/styles/base/040_colors.scss @@ -104,7 +104,7 @@ html { --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05); } -html { +html, body[data-current-user-theme="light"] { --body-background-color: var(--white); --text-color: var(--black); @@ -322,7 +322,7 @@ html { } /* variables that aren't defined in the dark theme fall back to the :root theme */ -body[data-current-user-theme="dark"] { +@mixin dark-theme { --body-background-color: var(--grey-9); --text-color: var(--grey-2); @@ -525,3 +525,14 @@ body[data-current-user-theme="dark"] { --banned-artist-label-color: var(--red-5); --deleted-artist-label-color: var(--grey-6); } + +body[data-current-user-theme="dark"] { + @include dark-theme; +} + +@media (prefers-color-scheme: dark) { + body { + @include dark-theme; + } +} + diff --git a/app/models/user.rb b/app/models/user.rb index 0fa1fc51b..d469699be 100644 --- a/app/models/user.rb +++ b/app/models/user.rb @@ -91,12 +91,12 @@ class User < ApplicationRecord attribute :unread_dmail_count, default: 0 attribute :favorite_count, default: 0 attribute :per_page, default: 20 - attribute :theme, default: :light + attribute :theme, default: :auto attribute :upload_points, default: Danbooru.config.initial_upload_points.to_i attribute :bit_prefs, default: 0 has_bit_flags BOOLEAN_ATTRIBUTES, :field => "bit_prefs" - enum theme: { light: 0, dark: 100 }, _suffix: true + enum theme: { auto: 0, light: 50, dark: 100 }, _suffix: true attr_reader :password