Merge pull request #2178 from tf/dark-widgets

Dark variant for widgets

entry_types/scrolled/app/views/pageflow_scrolled/entry_json_seed/_entry.json.jbuilder

@@ -63,7 +63,7 @@ unless options[:skip_collections]
   json.collections do
     json.entries do
       json.array!([entry]) do |entry|
-        json.call(entry, :id, :locale, :share_providers, :share_url, :credits)
+        json.call(entry, :id, :locale, :share_providers, :share_url, :credits, :configuration)
         json.published_at entry.published_at.try(:iso8601, 0)
         json.permaId entry.id # required as keyAttribute in EntryStateProvider
       end

entry_types/scrolled/app/views/pageflow_scrolled/entry_json_seed/_theme.json.jbuilder

@@ -1,9 +1,22 @@
 json.theme do
   json.assets do
-    json.logo_desktop scrolled_theme_asset_path(theme, 'logoDesktop.svg',
-                                                theme_file_role: :logo_desktop)
-    json.logo_mobile scrolled_theme_asset_path(theme, 'logoMobile.svg',
-                                               theme_file_role: :logo_mobile)
+    json.logo_desktop scrolled_theme_asset_path(
+      theme, 'logoDesktop.svg',
+      theme_file_role: :logo_desktop
+    )
+    json.logo_mobile scrolled_theme_asset_path(
+      theme, 'logoMobile.svg',
+      theme_file_role: :logo_mobile
+    )
+    json.logo_dark_variant_desktop scrolled_theme_asset_path(
+      theme, 'logoDarkVariantDesktop.svg',
+      theme_file_role: :logo_dark_variant_desktop
+    )
+    json.logo_dark_variant_mobile scrolled_theme_asset_path(
+      theme, 'logoDarkVariantMobile.svg',
+      theme_file_role: :logo_dark_variant_mobile
+    )
+
     json.unmute scrolled_theme_asset_path(theme, 'unmute.mp3')
 
     json.icons({})

entry_types/scrolled/config/locales/new/dark_widgets.de.yml

@@ -0,0 +1,8 @@
+de:
+  pageflow:
+    entry_types:
+      scrolled:
+        editor:
+          entry_metadata_configuration_attributes:
+            darkWidgets:
+              label: "Dunkle Theme-Variante verwenden"

entry_types/scrolled/config/locales/new/dark_widgets.en.yml

@@ -0,0 +1,8 @@
+en:
+  pageflow:
+    entry_types:
+      scrolled:
+        editor:
+          entry_metadata_configuration_attributes:
+            darkWidgets:
+              label: "Use dark theme variant"

entry_types/scrolled/lib/generators/pageflow_scrolled/install/templates/themes_plugin.rb.tt

@@ -9,17 +9,32 @@ class ScrolledThemesPlugin
                              widget: '"Source Sans Pro", sans-serif'
                            },
                            custom_theme_icons: <%= @custom_theme_icons %>,
-                           colors: {
-                             accent: '#e10028',
-                             widget: {
-                               surface: '#fff',
-                               on_surface: '#000',
-                               primary: '#00375a',
-                               on_primary: '#fff',
-                               secondary: '#c2c2c2',
-                               on_seconday: '#000',
-                               background: 'rgba(255, 255, 255, 0.95)',
-                               on_background: '#000'
+                           properties: {
+                             root: {
+                               accent_color: '#e10028',
+                               widget_surface_color: '#fff',
+                               widget_on_surface_color: '#000',
+                               widget_primary_color: '#00375a',
+                               widget_on_primary_color: '#fff',
+                               widget_secondary_color: '#c2c2c2',
+                               widget_on_seconday_color: '#000',
+                               widget_background_color: 'rgb(255 255 255 / .95)',
+                               widget_on_background_color: '#000',
+                             },
+
+                             dark: {
+                               accent_color: '#ff8097',
+                               widget_surface_color: '#000',
+                               widget_surface_backdrop_blur: '5px',
+                               widget_surface_opacity: '70%',
+                               widget_on_surface_color: '#eee',
+                               widget_primary_color: '#fff',
+                               widget_on_primary_color: '#000',
+                               widget_background_color: 'rgb(0 0 0 / .65)',
+                               widget_background_backdrop_blur: '5px',
+                               widget_on_background_color: '#eee',
+                               default_navigation_separator_color: 'rgb(255 255 255 / .1)',
+                               default_navigation_progress_bar_background_color: 'rgb(0 0 0 / .5)',
                              }
                            },
                            logo_alt_text: 'Pageflow',