bullet_train-themes-light 1.30.1 → 1.31.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +4 -4
- data/app/assets/stylesheets/light/fields/trix_editor.css +1 -1
- data/app/assets/stylesheets/light/tailwind/dark-mode.css +1 -1
- data/app/views/themes/light/fields/_code_editor.html.erb +2 -0
- data/app/views/themes/light/layouts/_account.html.erb +1 -1
- data/app/views/themes/light/layouts/_head.html.erb +1 -0
- data/app/views/themes/light/layouts/head/_color_scheme_preference.html.erb +31 -0
- data/lib/bullet_train/themes/light/engine.rb +61 -0
- data/lib/bullet_train/themes/light/version.rb +1 -1
- data/lib/bullet_train/themes/light.rb +14 -0
- data/lib/tasks/application.rb +6 -6
- data/tailwind.light.config.js +1 -1
- metadata +2 -1
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA256:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: 86e7892828c26a928da31371180c105d5a7181f68975bcaa799f24057c49d128
|
|
4
|
+
data.tar.gz: cc42d72ef34aae6cc68981335fac9d49aaf5deadb4609fe3f45830c1b68ddee1
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: 853501f6491fda2d045e83f0a8a8f3c9f56396e4232fa9ed510813722b71f061abd2cc467d4b1a45c861f9e429a5c8204833ee5f3c45c6baaaace182d887adf6
|
|
7
|
+
data.tar.gz: dceae142d3430e3ea7ab43e0364c7f44322a80cc33e30f17fda4a29fc16bfe7723dfb076ae091259687ca3bb9580d8856379cd394c11fb95990faeb75ed657bf
|
|
@@ -109,7 +109,7 @@ trix-editor {
|
|
|
109
109
|
|
|
110
110
|
/* The Trix Editor uses SVGs for its buttons, so we manually override them here for dark mode */
|
|
111
111
|
/* Icons taken from https://react-icons.github.io/react-icons/icons?name=md */
|
|
112
|
-
|
|
112
|
+
.dark {
|
|
113
113
|
.trix-button--icon-bold::before {
|
|
114
114
|
background-image: url('data:image/svg+xml;utf-8,<svg stroke="currentColor" fill="%23FFFFFF" stroke-width="0" viewBox="0 0 24 24" height="1em" width="1em" xmlns="http://www.w3.org/2000/svg"><path fill="none" d="M0 0h24v24H0z"></path><path d="M15.6 10.79c.97-.67 1.65-1.77 1.65-2.79 0-2.26-1.75-4-4-4H7v14h7.04c2.09 0 3.71-1.7 3.71-3.79 0-1.52-.86-2.82-2.15-3.42zM10 6.5h3c.83 0 1.5.67 1.5 1.5s-.67 1.5-1.5 1.5h-3v-3zm3.5 9H10v-3h3.5c.83 0 1.5.67 1.5 1.5s-.67 1.5-1.5 1.5z"></path></svg>') !important;
|
|
115
115
|
}
|
|
@@ -19,6 +19,8 @@ wrapper_options[:data]["#{stimulus_controller}-language-value"] = language
|
|
|
19
19
|
wrapper_options[:data]["#{stimulus_controller}-theme-light-value"] = theme_light
|
|
20
20
|
wrapper_options[:data]["#{stimulus_controller}-theme-dark-value"] = theme_dark
|
|
21
21
|
wrapper_options[:data]["#{stimulus_controller}-monaco-config-value"] = monaco_config if monaco_config.present?
|
|
22
|
+
wrapper_options[:data][:action] ||= ""
|
|
23
|
+
wrapper_options[:data][:action] += " color-scheme:changed@window->#{stimulus_controller}#updateComponentTheme"
|
|
22
24
|
|
|
23
25
|
field_class = "min-h-32 w-full text-base md:text-[0.75rem] font-mono text-input px-0 "
|
|
24
26
|
field_class += " bg-[color:--code-editor-background] [--code-editor-background:theme('colors.slate.50')] dark:[--code-editor-background:theme('colors.slate.800')]"
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
<!DOCTYPE html>
|
|
2
|
-
<html class="theme-<%= BulletTrain::Themes::Light.color %> <%= "theme-secondary-#{BulletTrain::Themes::Light.secondary_color}" if BulletTrain::Themes::Light.secondary_color %>" lang="<%= I18n.locale %>">
|
|
2
|
+
<html class="theme-<%= BulletTrain::Themes::Light.color %> <%= "theme-secondary-#{BulletTrain::Themes::Light.secondary_color}" if BulletTrain::Themes::Light.secondary_color %> <%= BulletTrain::Themes::Light.force_color_scheme_to.to_s.presence %>" lang="<%= I18n.locale %>">
|
|
3
3
|
<head>
|
|
4
4
|
<%= render 'shared/layouts/head' %>
|
|
5
5
|
</head>
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
<%= stylesheet_link_tag 'https://rsms.me/inter/inter.css', media: 'all', 'data-turbo-track': 'reload' %>
|
|
2
2
|
<link href="<%= image_path('logo/favicon.png') %>" rel="shortcut icon" />
|
|
3
3
|
<link href="<%= image_path('logo/icon.png') %>" rel="apple-touch-icon" />
|
|
4
|
+
<%= render 'shared/layouts/head/color_scheme_preference' unless BulletTrain::Themes::Light.force_color_scheme_to.presence %>
|
|
4
5
|
<%= javascript_include_tag 'application', 'data-turbo-track': 'reload' %>
|
|
5
6
|
<%= stylesheet_link_tag 'application', media: 'all', 'data-turbo-track': 'reload' %>
|
|
6
7
|
<%= javascript_include_tag 'application.light', 'data-turbo-track': 'reload' %>
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
<script>
|
|
2
|
+
// change under Account Details
|
|
3
|
+
class ColorSchemePreference {
|
|
4
|
+
constructor() {
|
|
5
|
+
this.validSchemes = ['dark', 'light', 'system'];
|
|
6
|
+
this.storageKey = 'color_scheme_preference';
|
|
7
|
+
this.eventName = 'color-scheme:changed';
|
|
8
|
+
this.mediaQuery = window.matchMedia('(prefers-color-scheme: dark)');
|
|
9
|
+
this.el = document.documentElement;
|
|
10
|
+
|
|
11
|
+
this.mediaQuery.addEventListener('change', e => this.preference === 'system' && (this.#shown = e.matches ? 'dark' : 'light'));
|
|
12
|
+
if (!this.el.classList.contains("light", "dark")) this.#shown = this.preference === 'system' ? this.#auto() : this.preference;
|
|
13
|
+
}
|
|
14
|
+
|
|
15
|
+
get preference() { return localStorage.getItem(this.storageKey) || 'system'; }
|
|
16
|
+
set preference(scheme) {
|
|
17
|
+
if (!this.validSchemes.includes(scheme)) throw new Error('Invalid color scheme');
|
|
18
|
+
const stored = scheme === 'system' ? null : scheme;
|
|
19
|
+
this.#shown = stored ?? this.#auto();
|
|
20
|
+
stored === null ? localStorage.removeItem(this.storageKey) : localStorage.setItem(this.storageKey, scheme);
|
|
21
|
+
window.dispatchEvent(new CustomEvent(this.eventName, { detail: { colorScheme: scheme } }));
|
|
22
|
+
}
|
|
23
|
+
get current() { return this.#shown; }
|
|
24
|
+
|
|
25
|
+
get #shown() { return this.el.classList.contains('dark') ? 'dark' : 'light'; }
|
|
26
|
+
set #shown(scheme) { this.el.classList.remove('dark', 'light'); this.el.classList.add(scheme); }
|
|
27
|
+
#auto() { return this.mediaQuery.matches ? 'dark' : 'light'; }
|
|
28
|
+
}
|
|
29
|
+
|
|
30
|
+
window.colorScheme = new ColorSchemePreference();
|
|
31
|
+
</script>
|
|
@@ -8,6 +8,67 @@ module BulletTrain
|
|
|
8
8
|
BulletTrain.linked_gems << "bullet_train-themes-light"
|
|
9
9
|
end
|
|
10
10
|
end
|
|
11
|
+
|
|
12
|
+
initializer "bullet_train.themes.light.check_tailwind_config", after: :load_config_initializers do |app|
|
|
13
|
+
# Only check in development and test (including CI) to avoid spamming production logs
|
|
14
|
+
next if Rails.env.production?
|
|
15
|
+
|
|
16
|
+
Rails.application.config.after_initialize do
|
|
17
|
+
tailwind_config_path = Rails.root.join("tailwind.config.js")
|
|
18
|
+
|
|
19
|
+
if tailwind_config_path.exist?
|
|
20
|
+
config_content = tailwind_config_path.read
|
|
21
|
+
|
|
22
|
+
# Check for darkMode configuration with 'class' or 'selector'
|
|
23
|
+
if config_content.match?(/darkMode\s*[=:]\s*['"](?:class|selector)['"]/) ||
|
|
24
|
+
config_content.match?(/themeConfig\.darkMode\s*=\s*['"](?:class|selector)['"]/)
|
|
25
|
+
|
|
26
|
+
Rails.logger.warn <<~WARNING
|
|
27
|
+
|
|
28
|
+
------------------------------------------------------------
|
|
29
|
+
|
|
30
|
+
⚠️ DEPRECATION WARNING: Dark mode configuration in tailwind.config.js
|
|
31
|
+
|
|
32
|
+
Your tailwind.config.js file contains a darkMode setting using 'class' or 'selector'.
|
|
33
|
+
This is now the default setting for Bullet Train, allowing users to choose their preference in Account Details.
|
|
34
|
+
|
|
35
|
+
If you want to force light mode for all users, use the force_color_scheme_to option in config/initializers/theme.rb:
|
|
36
|
+
|
|
37
|
+
BulletTrain::Themes::Light.force_color_scheme_to = :light # or :dark
|
|
38
|
+
|
|
39
|
+
You can then remove the darkMode configuration from tailwind.config.js.
|
|
40
|
+
|
|
41
|
+
------------------------------------------------------------
|
|
42
|
+
|
|
43
|
+
WARNING
|
|
44
|
+
# Check for darkMode configuration with 'media'
|
|
45
|
+
elsif config_content.match?(/darkMode\s*[=:]\s*['"]media['"]/) ||
|
|
46
|
+
config_content.match?(/themeConfig\.darkMode\s*=\s*['"]media['"]/)
|
|
47
|
+
|
|
48
|
+
Rails.logger.warn <<~WARNING
|
|
49
|
+
|
|
50
|
+
------------------------------------------------------------
|
|
51
|
+
|
|
52
|
+
ℹ️ NOTICE: Dark mode configuration in tailwind.config.js
|
|
53
|
+
|
|
54
|
+
Your tailwind.config.js file contains a darkMode setting using 'media'.
|
|
55
|
+
This setting is safe to remove, as Bullet Train now handles color scheme preferences automatically.
|
|
56
|
+
|
|
57
|
+
Users can choose their preferred color scheme in Account Details, which respects their system preference by default.
|
|
58
|
+
|
|
59
|
+
If you want to force a specific color scheme for all users, use the force_color_scheme_to option in config/initializers/theme.rb:
|
|
60
|
+
|
|
61
|
+
BulletTrain::Themes::Light.force_color_scheme_to = :light # or :dark
|
|
62
|
+
|
|
63
|
+
You can safely remove the darkMode configuration from tailwind.config.js.
|
|
64
|
+
|
|
65
|
+
------------------------------------------------------------
|
|
66
|
+
|
|
67
|
+
WARNING
|
|
68
|
+
end
|
|
69
|
+
end
|
|
70
|
+
end
|
|
71
|
+
end
|
|
11
72
|
end
|
|
12
73
|
end
|
|
13
74
|
end
|
|
@@ -41,6 +41,20 @@ module BulletTrain
|
|
|
41
41
|
mattr_accessor :show_logo_in_account, default: false
|
|
42
42
|
mattr_accessor :navigation, default: :top
|
|
43
43
|
|
|
44
|
+
# Custom accessor with validation for force_color_scheme_to
|
|
45
|
+
@@force_color_scheme_to = nil
|
|
46
|
+
|
|
47
|
+
def self.force_color_scheme_to
|
|
48
|
+
@@force_color_scheme_to
|
|
49
|
+
end
|
|
50
|
+
|
|
51
|
+
def self.force_color_scheme_to=(value)
|
|
52
|
+
unless [nil, :dark, :light].include?(value)
|
|
53
|
+
raise ArgumentError, "force_color_scheme_to must be :dark, :light, or nil, got: #{value.inspect}"
|
|
54
|
+
end
|
|
55
|
+
@@force_color_scheme_to = value
|
|
56
|
+
end
|
|
57
|
+
|
|
44
58
|
class Theme < BulletTrain::Themes::TailwindCss::Theme
|
|
45
59
|
def directory_order
|
|
46
60
|
["light"] + super
|
data/lib/tasks/application.rb
CHANGED
|
@@ -4,7 +4,7 @@ module BulletTrain
|
|
|
4
4
|
module Themes
|
|
5
5
|
module Application
|
|
6
6
|
def self.eject_theme_main_css(theme_name)
|
|
7
|
-
theme_base_path =
|
|
7
|
+
theme_base_path = Gem::Specification.find_by_name("bullet_train-themes-#{theme_name}").gem_dir
|
|
8
8
|
|
|
9
9
|
puts "Ejecting app/assets/stylesheets/#{theme_name}.tailwind.css."
|
|
10
10
|
Rails.root.join("app/assets/stylesheets").mkpath
|
|
@@ -16,7 +16,7 @@ module BulletTrain
|
|
|
16
16
|
constantized_theme = theme_parts.join
|
|
17
17
|
humanized_theme = theme_parts.join(" ")
|
|
18
18
|
|
|
19
|
-
theme_base_path =
|
|
19
|
+
theme_base_path = Gem::Specification.find_by_name("bullet_train-themes-#{theme_name}").gem_dir
|
|
20
20
|
puts "Ejecting from #{humanized_theme} theme in `#{theme_base_path}`."
|
|
21
21
|
|
|
22
22
|
puts "Ejecting Tailwind configuration into `./tailwind.#{ejected_theme_name}.config.js`."
|
|
@@ -46,7 +46,7 @@ module BulletTrain
|
|
|
46
46
|
"bullet_train-themes-tailwind_css" => "tailwind_css",
|
|
47
47
|
"bullet_train-themes-light" => "light"
|
|
48
48
|
}.each do |gem, theme_name|
|
|
49
|
-
gem_path =
|
|
49
|
+
gem_path = Gem::Specification.find_by_name(gem).gem_dir
|
|
50
50
|
showcase_partials = Dir.glob("#{gem_path}/app/views/showcase/**/*.html.erb")
|
|
51
51
|
|
|
52
52
|
`find #{gem_path}/app/views/themes`.lines.map(&:chomp).each do |file_or_directory|
|
|
@@ -239,9 +239,9 @@ module BulletTrain
|
|
|
239
239
|
end
|
|
240
240
|
|
|
241
241
|
def self.clean_theme(theme_name, args)
|
|
242
|
-
light_base_path =
|
|
243
|
-
tailwind_base_path =
|
|
244
|
-
theme_base_path =
|
|
242
|
+
light_base_path = Gem::Specification.find_by_name("bullet_train-themes-light").gem_dir
|
|
243
|
+
tailwind_base_path = Gem::Specification.find_by_name("bullet_train-themes-tailwind_css").gem_dir
|
|
244
|
+
theme_base_path = Gem::Specification.find_by_name("bullet_train-themes").gem_dir
|
|
245
245
|
|
|
246
246
|
directory_content = `find . | grep 'app/.*#{args[:theme]}'`.lines.map(&:chomp)
|
|
247
247
|
directory_content = directory_content.reject { |content| content.match?("app/assets/builds/") }
|
data/tailwind.light.config.js
CHANGED
metadata
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
|
2
2
|
name: bullet_train-themes-light
|
|
3
3
|
version: !ruby/object:Gem::Version
|
|
4
|
-
version: 1.
|
|
4
|
+
version: 1.31.0
|
|
5
5
|
platform: ruby
|
|
6
6
|
authors:
|
|
7
7
|
- Andrew Culver
|
|
@@ -236,6 +236,7 @@ files:
|
|
|
236
236
|
- app/views/themes/light/layouts/_head.html.erb
|
|
237
237
|
- app/views/themes/light/layouts/_mailer.html.erb
|
|
238
238
|
- app/views/themes/light/layouts/_pricing.html.erb
|
|
239
|
+
- app/views/themes/light/layouts/head/_color_scheme_preference.html.erb
|
|
239
240
|
- app/views/themes/light/memberships/_photo.html.erb
|
|
240
241
|
- app/views/themes/light/memberships/_photos.html.erb
|
|
241
242
|
- app/views/themes/light/menu/_account.html.erb
|