Merge commit 'a0ce77673c977e3a90d0c7d1c2acd250b7fad0c2' into glitch-soc/merge-upstream

Conflicts:
- `app/controllers/application_controller.rb`:
  Upstream added an experimental color and contrast theme control.
  Conflicts because of glitch-soc's different theming system.
  Adapted upstream's changes.
- `app/views/layouts/application.html.haml`:
  Upstream added an experimental color and contrast theme control.
  Conflicts because of glitch-soc's different theming system.
  Adapted upstream's changes.
- `app/views/settings/preferences/appearance/show.html.haml`:
  Upstream added an experimental color and contrast theme control.
  Conflicts because of glitch-soc's different theming system.
  Adapted upstream's changes.

app/controllers/application_controller.rb

@@ -21,6 +21,8 @@ class ApplicationController < ActionController::Base
   helper_method :current_flavour
   helper_method :current_skin
   helper_method :current_theme
+  helper_method :color_scheme
+  helper_method :contrast
   helper_method :single_user_mode?
   helper_method :use_seamless_external_login?
   helper_method :sso_account_settings
@@ -174,6 +176,25 @@ class ApplicationController < ActionController::Base
     @current_session = SessionActivation.find_by(session_id: cookies.signed['_session_id']) if cookies.signed['_session_id'].present?
   end
 
+  def color_scheme
+    current = current_user&.setting_color_scheme
+    return current if current && current != 'auto'
+
+    return 'dark' if current_skin.include?('default') || current_skin.include?('contrast')
+    return 'light' if current_skin.include?('light')
+
+    'auto'
+  end
+
+  def contrast
+    current = current_user&.setting_contrast
+    return current if current && current != 'auto'
+
+    return 'high' if current_skin.include?('contrast')
+
+    'auto'
+  end
+
   def respond_with_error(code)
     respond_to do |format|
       format.any  { render "errors/#{code}", layout: 'error', status: code, formats: [:html] }

app/javascript/styles/mastodon/forms.scss

@@ -716,6 +716,17 @@ code {
     }
   }
 
+  .horizontal-options .label_input__wrapper {
+    display: flex;
+    flex-wrap: wrap;
+    gap: 20px;
+
+    .radio,
+    .radio > label {
+      margin-bottom: 0;
+    }
+  }
+
   .status-card {
     contain: unset;
   }

app/models/concerns/user/has_settings.rb

@@ -67,6 +67,14 @@ module User::HasSettings
     settings['skin']
   end
 
+  def setting_color_scheme
+    settings['web.color_scheme']
+  end
+
+  def setting_contrast
+    settings['web.contrast']
+  end
+
   def setting_display_media
     settings['web.display_media']
   end

app/models/user_settings.rb

@@ -42,6 +42,8 @@ class UserSettings
     setting :display_media, default: 'default', in: %w(default show_all hide_all)
     setting :auto_play, default: false
     setting :emoji_style, default: 'auto', in: %w(auto native twemoji)
+    setting :color_scheme, default: 'auto', in: %w(auto light dark)
+    setting :contrast, default: 'auto', in: %w(auto high)
   end
 
   namespace :notification_emails do

app/views/layouts/application.html.haml

@@ -1,5 +1,5 @@
 !!! 5
-%html{ lang: I18n.locale, class: html_classes, 'data-user-theme': current_skin.parameterize, 'data-user-flavour': current_flavour.parameterize }
+%html{ lang: I18n.locale, class: html_classes, 'data-user-theme': current_skin.parameterize, 'data-user-flavour': current_flavour.parameterize, 'data-contrast': contrast.parameterize, 'data-mode': color_scheme.parameterize }
   %head
     %meta{ charset: 'utf-8' }/
     %meta{ name: 'viewport', content: 'width=device-width, initial-scale=1, viewport-fit=cover' }/

app/views/settings/preferences/appearance/show.html.haml

@@ -21,6 +21,27 @@
                 selected: current_user.time_zone || Time.zone.tzinfo.name,
                 wrapper: :with_label
 
+  - if Mastodon::Feature.new_theme_options_enabled?
+    .fields-group
+      .input.horizontal-options
+        = ff.input :'web.color_scheme',
+                   as: :radio_buttons,
+                   collection: %w(auto light dark),
+                   include_blank: false,
+                   label: I18n.t('simple_form.labels.defaults.setting_color_scheme'),
+                   label_method: ->(contrast) { I18n.t("color_scheme.#{contrast}", default: contrast) },
+                   wrapper: :with_label,
+                   required: false
+      .input.horizontal-options
+        = ff.input :'web.contrast',
+                   as: :radio_buttons,
+                   collection: %w(auto high),
+                   include_blank: false,
+                   label: I18n.t('simple_form.labels.defaults.setting_contrast'),
+                   label_method: ->(contrast) { I18n.t("contrast.#{contrast}", default: contrast) },
+                   wrapper: :with_label,
+                   required: false
+
   .fields-group
     = f.simple_fields_for :settings, current_user.settings do |ff|
       = ff.input :'web.emoji_style',

config/locales/en.yml

@@ -1319,6 +1319,13 @@ en:
     hint_html: "<strong>Tip:</strong> We won't ask you for your password again for the next hour."
     invalid_password: Invalid password
     prompt: Confirm password to continue
+  color_scheme:
+    auto: Auto
+    dark: Dark
+    light: Light
+  contrast:
+    auto: Auto
+    high: High
   crypto:
     errors:
       invalid_key: is not a valid Ed25519 or Curve25519 key

config/locales/simple_form.en.yml

@@ -239,6 +239,8 @@ en:
         setting_always_send_emails: Always send e-mail notifications
         setting_auto_play_gif: Auto-play animated GIFs
         setting_boost_modal: Control boosting visibility
+        setting_color_scheme: Mode
+        setting_contrast: Contrast
         setting_default_language: Posting language
         setting_default_privacy: Posting visibility
         setting_default_quote_policy: Who can quote