diff --git a/app/assets/stylesheets/parameters.scss b/app/assets/stylesheets/parameters.scss index 28bf569016..07549d69bb 100644 --- a/app/assets/stylesheets/parameters.scss +++ b/app/assets/stylesheets/parameters.scss @@ -20,4 +20,3 @@ $table-border-factor: .1; $list-group-hover-bg: rgba(var(--bs-emphasis-color-rgb), .075); $enable-negative-margins: true; -$color-mode-type: media-query; diff --git a/app/assets/stylesheets/screen-auto-ltr.scss b/app/assets/stylesheets/screen-auto-ltr.scss new file mode 100644 index 0000000000..89e31599ae --- /dev/null +++ b/app/assets/stylesheets/screen-auto-ltr.scss @@ -0,0 +1,3 @@ +@use "common" with ( + $color-mode-type: media-query +); diff --git a/app/assets/stylesheets/screen-auto-rtl.rtlcss.scss b/app/assets/stylesheets/screen-auto-rtl.rtlcss.scss new file mode 100644 index 0000000000..89e31599ae --- /dev/null +++ b/app/assets/stylesheets/screen-auto-rtl.rtlcss.scss @@ -0,0 +1,3 @@ +@use "common" with ( + $color-mode-type: media-query +); diff --git a/app/assets/stylesheets/screen-light-ltr.scss b/app/assets/stylesheets/screen-light-ltr.scss new file mode 100644 index 0000000000..00f65f79ac --- /dev/null +++ b/app/assets/stylesheets/screen-light-ltr.scss @@ -0,0 +1,3 @@ +@use "common" with ( + $color-mode-type: data +); diff --git a/app/assets/stylesheets/screen-light-rtl.rtlcss.scss b/app/assets/stylesheets/screen-light-rtl.rtlcss.scss new file mode 100644 index 0000000000..00f65f79ac --- /dev/null +++ b/app/assets/stylesheets/screen-light-rtl.rtlcss.scss @@ -0,0 +1,3 @@ +@use "common" with ( + $color-mode-type: data +); diff --git a/app/assets/stylesheets/screen-ltr.scss b/app/assets/stylesheets/screen-ltr.scss deleted file mode 100644 index c525060af5..0000000000 --- a/app/assets/stylesheets/screen-ltr.scss +++ /dev/null @@ -1 +0,0 @@ -@import "common"; diff --git a/app/assets/stylesheets/screen-rtl.rtlcss.scss b/app/assets/stylesheets/screen-rtl.rtlcss.scss deleted file mode 100644 index c525060af5..0000000000 --- a/app/assets/stylesheets/screen-rtl.rtlcss.scss +++ /dev/null @@ -1 +0,0 @@ -@import "common"; diff --git a/app/controllers/preferences_controller.rb b/app/controllers/preferences_controller.rb index dcf0d8b64e..1eabee7ed7 100644 --- a/app/controllers/preferences_controller.rb +++ b/app/controllers/preferences_controller.rb @@ -21,6 +21,12 @@ def update else params[:user][:preferred_editor] end + + cookies["_osm_color_scheme"] = { + :value => params[:color_scheme], + :expires => 10.years.from_now + } + if current_user.save # Use a partial so that it is rendered during the next page load in the correct language. flash[:notice] = { :partial => "preferences/update_success_flash" } diff --git a/app/views/layouts/_head.html.erb b/app/views/layouts/_head.html.erb index 3c691612ab..995681f709 100644 --- a/app/views/layouts/_head.html.erb +++ b/app/views/layouts/_head.html.erb @@ -5,7 +5,11 @@ <%= javascript_include_tag "turbo", :type => "module" %> <%= javascript_include_tag "application" %> <%= javascript_include_tag "i18n/#{I18n.locale}" %> - <%= stylesheet_link_tag "screen-#{dir}", :media => "screen" %> + <% if request.cookies["_osm_color_scheme"] == "light" %> + <%= stylesheet_link_tag "screen-light-#{dir}", :media => "screen" %> + <% else %> + <%= stylesheet_link_tag "screen-auto-#{dir}", :media => "screen" %> + <% end %> <%= stylesheet_link_tag "print-#{dir}", :media => "print" %> <%= stylesheet_link_tag "leaflet-all", :media => "screen, print" %> <%= render :partial => "layouts/meta" %> diff --git a/app/views/preferences/edit.html.erb b/app/views/preferences/edit.html.erb index 07d89fbb5b..bd892a7092 100644 --- a/app/views/preferences/edit.html.erb +++ b/app/views/preferences/edit.html.erb @@ -7,6 +7,14 @@ <%= f.text_field :languages %> +