activeadmin_dark_color_scheme 0.1.1 → 0.1.6

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.
Files changed (31) hide show
  1. checksums.yaml +4 -4
  2. data/Gemfile.lock +2 -2
  3. data/README.md +59 -18
  4. data/activeadmin_dark_color_scheme.gemspec +6 -6
  5. data/app/assets/stylesheets/_activeadmin-dark-color-scheme.sass +15 -2
  6. data/app/assets/stylesheets/activeadmin-dark-color-scheme/mixins/_buttons.sass +29 -3
  7. data/app/assets/stylesheets/activeadmin-dark-color-scheme/modules/_buttons.sass +8 -2
  8. data/app/assets/stylesheets/activeadmin-dark-color-scheme/modules/_fieldsets.sass +10 -0
  9. data/app/assets/stylesheets/activeadmin-dark-color-scheme/modules/_flash.sass +17 -9
  10. data/app/assets/stylesheets/activeadmin-dark-color-scheme/modules/_inputs.sass +28 -0
  11. data/app/assets/stylesheets/activeadmin-dark-color-scheme/modules/_labels.sass +4 -0
  12. data/app/assets/stylesheets/activeadmin-dark-color-scheme/modules/_navbar.sass +18 -0
  13. data/app/assets/stylesheets/activeadmin-dark-color-scheme/modules/_select2.sass +23 -10
  14. data/app/assets/stylesheets/activeadmin-dark-color-scheme/modules/_tabs.sass +17 -0
  15. data/app/assets/stylesheets/activeadmin-dark-color-scheme/modules/_toggle-bool-switch.sass +5 -0
  16. data/app/assets/stylesheets/activeadmin-dark-color-scheme/variables/_alerts.sass +14 -0
  17. data/app/assets/stylesheets/activeadmin-dark-color-scheme/variables/_base.sass +9 -0
  18. data/app/assets/stylesheets/activeadmin-dark-color-scheme/variables/_buttons.sass +24 -0
  19. data/app/assets/stylesheets/activeadmin-dark-color-scheme/variables/_inputs.sass +13 -0
  20. data/app/assets/stylesheets/activeadmin-dark-color-scheme/variables/_labels.sass +2 -0
  21. data/app/assets/stylesheets/activeadmin-dark-color-scheme/variables/_panels.sass +5 -0
  22. data/app/assets/stylesheets/activeadmin-dark-color-scheme/variables/_select2.sass +3 -0
  23. data/app/assets/stylesheets/activeadmin-dark-color-scheme/variables/_tables.sass +10 -0
  24. data/app/assets/stylesheets/activeadmin-dark-color-scheme/variables/_toggle-bool.sass +4 -0
  25. data/lib/activeadmin/dark_color_scheme/engine.rb +1 -4
  26. data/lib/activeadmin/dark_color_scheme/version.rb +1 -1
  27. data/lib/activeadmin/dark_color_scheme.rb +2 -0
  28. data/lib/activeadmin_dark_color_scheme.rb +3 -0
  29. metadata +30 -16
  30. data/app/assets/stylesheets/activeadmin-dark-color-scheme/modules/_forms.sass +0 -33
  31. data/app/assets/stylesheets/activeadmin-dark-color-scheme/variables/_all.sass +0 -44
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA256:
3
- metadata.gz: ea0de864c7f4557cab10faa272fe4e336a6dccb2446151652e901bc838a3b6e2
4
- data.tar.gz: 31a463c46d2657364f0974219ea5d7eeec15e6e63e07995dc305bec0a14c41f1
3
+ metadata.gz: 5d4e2a2195914f93cfcf840b5c5e3dea3669ec4755a25e95336ac3cbd047cd51
4
+ data.tar.gz: c134d052ed3c6b31601ec95df0d32b14a55c3e8e63d9016d26744d11cc196266
5
5
  SHA512:
6
- metadata.gz: 0c45498bd0fa4b273dddde9b07b48447a8b5c7188f0ccc894dbd9bab674a45730e575af2b870c854cbec1aa2064e1a1091a455cfe982a09fbdb5c23bbd49a5a1
7
- data.tar.gz: 65e9e9166258a7b5ed262accd03242b6bf7162a9d0af0f8729c4c691eafe0558ce5083eaef883a06d6c1e24befef901610e3ccfcfd54cb805758b72485190b71
6
+ metadata.gz: 84e1f184ab395df64e8c85c076f0fc3f7601df6b88260e247d36ad385d421fa23fe395a5f57d0287411a40156bdf8e0ee532f5f309ca6effdf694fe1a7865cac
7
+ data.tar.gz: 738167ba7d126afc6a3bf5ea92efbad34433a8629aa2a9a5e3d9ae82545e5083aba1c982c71c889945f6b6c278cc5575296fd5ee6de88056acce297ffd5416b6
data/Gemfile.lock CHANGED
@@ -1,8 +1,7 @@
1
1
  PATH
2
2
  remote: .
3
3
  specs:
4
- activeadmin_dark_color_scheme (0.1.1)
5
- autoprefixer-rails (~> 10, >= 10.4.7)
4
+ activeadmin_dark_color_scheme (0.1.6)
6
5
  sassc-rails (~> 2, >= 2.0.0)
7
6
 
8
7
  GEM
@@ -112,6 +111,7 @@ PLATFORMS
112
111
 
113
112
  DEPENDENCIES
114
113
  activeadmin_dark_color_scheme!
114
+ autoprefixer-rails (~> 10, >= 10.4.7)
115
115
  pry
116
116
  rake
117
117
  rspec
data/README.md CHANGED
@@ -1,39 +1,80 @@
1
- # Activeadmin::DarkColorScheme
1
+ # Dark color scheme for Activeadmin
2
2
 
3
- Welcome to your new gem! In this directory, you'll find the files you need to be able to package up your Ruby library into a gem. Put your Ruby code in the file `lib/activeadmin/dark_color_scheme`. To experiment with that code, run `bin/console` for an interactive prompt.
4
-
5
- TODO: Delete this and the text above, and describe your gem
3
+ [![Gem Version](https://badge.fury.io/rb/activeadmin_dark_color_scheme.svg)](https://badge.fury.io/rb/activeadmin_dark_color_scheme)
6
4
 
7
5
  ## Installation
8
6
 
9
7
  Add this line to your application's Gemfile:
10
8
 
11
9
  ```ruby
12
- gem 'activeadmin_dark_color_scheme'
10
+ gem "activeadmin_dark_color_scheme"
11
+ ```
12
+
13
+ Import our Sass file “activeadmin-dark-color-scheme” in your CSS entrypoint that compiles ActiveAdmin CSS files:
14
+
15
+ ```sass
16
+ // app/assets/stylesheets/active_admin.sass
17
+
18
+ // Your regular ActiveAdmin files
19
+ @import "active_admin/mixins"
20
+ @import "active_admin/base"
21
+
22
+ // Dark scheme
23
+ @import "activeadmin-dark-color-scheme"
24
+ ```
25
+
26
+ ## Customization
27
+
28
+ All [Sass variables we use](https://github.com/sergeypedan/activeadmin-dark-color-scheme/blob/master/app/assets/stylesheets/activeadmin-dark-color-scheme/variables/_all.sass) have `!default`:
29
+
30
+ ```sass
31
+ $link-color-1: hsl(210, 70%, 73%) !default
13
32
  ```
14
33
 
15
- And then execute:
34
+ which means you can override them just by declaring your own Sass variable somewhere before.
16
35
 
17
- $ bundle
36
+ You could technically do it right in your entrypoint:
18
37
 
19
- Or install it yourself as:
38
+ ```sass
39
+ // app/assets/stylesheets/active_admin.sass
20
40
 
21
- $ gem install activeadmin_dark_color_scheme
41
+ // Your regular ActiveAdmin files
42
+ @import "active_admin/mixins"
43
+ @import "active_admin/base"
22
44
 
23
- ## Usage
45
+ // Dark scheme
46
+ $link-color-1: crimson
47
+ @import "activeadmin-dark-color-scheme"
48
+ ```
24
49
 
25
- TODO: Write usage instructions here
50
+ Or you could put your variables in a separate file and `@import` it.
26
51
 
27
- ## Development
52
+ ## How it works
28
53
 
29
- After checking out the repo, run `bin/setup` to install dependencies. Then, run `rake spec` to run the tests. You can also run `bin/console` for an interactive prompt that will allow you to experiment.
54
+ You import additional CSS, all of which is scoped under `@media (prefers-color-scheme: dark)` media declaration that matches your system (or browser) color scheme setting.
30
55
 
31
- To install this gem onto your local machine, run `bundle exec rake install`. To release a new version, update the version number in `version.rb`, and then run `bundle exec rake release`, which will create a git tag for the version, push git commits and tags, and push the `.gem` file to [rubygems.org](https://rubygems.org).
56
+ Here is an example from [_table-index.sass](https://github.com/sergeypedan/activeadmin-dark-color-scheme/blob/master/app/assets/stylesheets/activeadmin-dark-color-scheme/modules/_table-index.sass):
57
+
58
+ ```sass
59
+ @media (prefers-color-scheme: dark)
60
+
61
+ table.index_table
62
+ th
63
+ background-color: $panel-bg-color-solid
64
+ background-image: $panel-head-gradient
65
+ border-top-color: $th-border-color-top
66
+ border-right-color: $th-border-color-right !important
67
+ border-bottom-color: $th-border-color-bottom
68
+ border-left-color: $th-border-color-left
69
+ box-shadow: none
70
+ color: hsl(0, 0%, 95%)
71
+ text-shadow: none
72
+ ```
32
73
 
33
- ## Contributing
74
+ ## ActiveAdmin version compatibility
34
75
 
35
- Bug reports and pull requests are welcome on GitHub at https://github.com/[USERNAME]/activeadmin_dark_color_scheme.
76
+ The current version of ActiveAdmin is 2.13.1. Our styles are and will be targeted on the latest version.
36
77
 
37
- ## License
78
+ ## How to disable
38
79
 
39
- The gem is available as open source under the terms of the [MIT License](https://opensource.org/licenses/MIT).
80
+ Switch to light color scheme in you system preferences or your browser developer tools.
data/activeadmin_dark_color_scheme.gemspec CHANGED
@@ -24,7 +24,7 @@ Gem::Specification.new do |spec|
24
24
  "homepage_uri" => spec.homepage,
25
25
  "source_code_uri" => spec.homepage }
26
26
 
27
- spec.require_paths = ["app", "lib/activeadmin"]
27
+ spec.require_paths = ["app", "lib"]
28
28
 
29
29
  spec.bindir = "exe"
30
30
  spec.executables = []
@@ -37,10 +37,10 @@ Gem::Specification.new do |spec|
37
37
  spec.required_ruby_version = Gem::Requirement.new(">= 2.3.3")
38
38
  # SassC requires Ruby 2.3.3+
39
39
 
40
- spec.add_runtime_dependency "autoprefixer-rails", "~> 10", ">= 10.4.7"
41
- spec.add_runtime_dependency "sassc-rails", "~> 2", ">= 2.0.0"
40
+ spec.add_runtime_dependency "sassc-rails", "~> 2", ">= 2.0.0"
42
41
 
43
- spec.add_development_dependency "rspec", "~> 3"
44
- spec.add_development_dependency "term-ansicolor", "~> 1"
45
- spec.add_development_dependency "yard", "~> 0", ">= 0.9.20"
42
+ spec.add_development_dependency "autoprefixer-rails", "~> 10", ">= 10.4.7"
43
+ spec.add_development_dependency "rspec", "~> 3"
44
+ spec.add_development_dependency "term-ansicolor", "~> 1"
45
+ spec.add_development_dependency "yard", "~> 0", ">= 0.9.20"
46
46
  end
data/app/assets/stylesheets/_activeadmin-dark-color-scheme.sass CHANGED
@@ -1,5 +1,13 @@
1
1
  // Variables
2
- @import "./activeadmin-dark-color-scheme/variables/all"
2
+ @import "./activeadmin-dark-color-scheme/variables/base"
3
+ @import "./activeadmin-dark-color-scheme/variables/alerts"
4
+ @import "./activeadmin-dark-color-scheme/variables/buttons"
5
+ @import "./activeadmin-dark-color-scheme/variables/inputs"
6
+ @import "./activeadmin-dark-color-scheme/variables/labels"
7
+ @import "./activeadmin-dark-color-scheme/variables/panels"
8
+ @import "./activeadmin-dark-color-scheme/variables/select2"
9
+ @import "./activeadmin-dark-color-scheme/variables/tables"
10
+ @import "./activeadmin-dark-color-scheme/variables/toggle-bool"
3
11
 
4
12
  // Mixins
5
13
  @import "./activeadmin-dark-color-scheme/mixins/buttons"
@@ -7,15 +15,20 @@
7
15
 
8
16
  // Modules
9
17
  @import "./activeadmin-dark-color-scheme/modules/buttons"
18
+ @import "./activeadmin-dark-color-scheme/modules/fieldsets"
10
19
  @import "./activeadmin-dark-color-scheme/modules/flash"
11
- @import "./activeadmin-dark-color-scheme/modules/forms"
20
+ @import "./activeadmin-dark-color-scheme/modules/inputs"
21
+ @import "./activeadmin-dark-color-scheme/modules/labels"
12
22
  @import "./activeadmin-dark-color-scheme/modules/login"
13
23
  @import "./activeadmin-dark-color-scheme/modules/misc"
24
+ @import "./activeadmin-dark-color-scheme/modules/navbar"
14
25
  @import "./activeadmin-dark-color-scheme/modules/pagination"
15
26
  @import "./activeadmin-dark-color-scheme/modules/panels"
16
27
  @import "./activeadmin-dark-color-scheme/modules/select2"
17
28
  @import "./activeadmin-dark-color-scheme/modules/sidebar"
18
29
  @import "./activeadmin-dark-color-scheme/modules/table-attributes"
19
30
  @import "./activeadmin-dark-color-scheme/modules/table-index"
31
+ @import "./activeadmin-dark-color-scheme/modules/tabs"
20
32
  @import "./activeadmin-dark-color-scheme/modules/title-bar"
33
+ @import "./activeadmin-dark-color-scheme/modules/toggle-bool-switch"
21
34
  @import "./activeadmin-dark-color-scheme/modules/top-level"
data/app/assets/stylesheets/activeadmin-dark-color-scheme/mixins/_buttons.sass CHANGED
@@ -1,16 +1,36 @@
1
1
  @mixin btn-dark-1
2
2
  background-color: $btn-dark-1-bg
3
3
  background-image: linear-gradient(to bottom, $btn-dark-1-gradient-stop-top, $btn-dark-1-gradient-stop-bottom)
4
- border-top-color: lighten($btn-dark-1-gradient-stop-top, 10%)
4
+ border-top-color: lighten($btn-dark-1-gradient-stop-top, 5%)
5
5
  border-right-color: lighten($btn-dark-1-bg, 10%)
6
- border-bottom-color: darken($btn-dark-1-gradient-stop-bottom, 10%)
6
+ border-bottom-color: darken($btn-dark-1-gradient-stop-bottom, 5%)
7
7
  border-left-color: lighten($btn-dark-1-bg, 10%)
8
8
  box-shadow: 0 1px 2px darken($btn-dark-1-gradient-stop-bottom, 10%)
9
9
  color: $btn-dark-1-color
10
10
  text-shadow: none
11
11
 
12
12
  &:not(.disabled):hover
13
- background-image: linear-gradient(to bottom, lighten($btn-dark-1-gradient-stop-top, 3%), lighten($btn-dark-1-gradient-stop-bottom, 3%))
13
+ background-image: linear-gradient(to bottom, lighten($btn-dark-1-gradient-stop-top, 2%), lighten($btn-dark-1-gradient-stop-bottom, 2%))
14
+
15
+ &:focus, &:focus-visible
16
+ outline-color: $btn-focus-outline-color
17
+ outline-offset: $btn-focus-outline-auto-offset
18
+ outline-style: $btn-focus-outline-auto-style
19
+ outline-width: $btn-focus-outline-width
20
+
21
+ @mixin btn-dark-1-inset
22
+ background-color: $btn-dark-1-inset-bg
23
+ background-image: linear-gradient($btn-dark-1-inset-gradient-stop-top, $btn-dark-1-inset-gradient-stop-bottom)
24
+ border-top-color: $btn-datk-1-inset-border-top-color
25
+ border-right-color: lighten($btn-dark-1-bg, 10%)
26
+ border-bottom-color: darken($btn-dark-1-gradient-stop-bottom, 10%)
27
+ border-left-color: $btn-dark-1-inset-color
28
+ box-shadow: 0 1px 3px 0 hsla(0, 0%, 0%, 0.3) inset
29
+ color: $btn-dark-1-color
30
+ text-shadow: none
31
+
32
+ &:not(.disabled):hover
33
+ background-image: linear-gradient(to bottom, lighten($btn-dark-1-inset-gradient-stop-top, 2%), lighten($btn-dark-1-inset-gradient-stop-bottom, 2%))
14
34
 
15
35
  @mixin btn-light-1
16
36
  background-color: $btn-light-1-bg
@@ -20,3 +40,9 @@
20
40
 
21
41
  &:not(.disabled):hover
22
42
  background-image: linear-gradient(to bottom, darken($btn-light-1-gradient-stop-top, 3%), darken($btn-light-1-gradient-stop-bottom, 3%))
43
+
44
+ &:focus, &:focus-visible
45
+ outline-color: $btn-focus-outline-color
46
+ outline-offset: $btn-focus-outline-auto-offset
47
+ outline-style: $btn-focus-outline-auto-style
48
+ outline-width: $btn-focus-outline-width
data/app/assets/stylesheets/activeadmin-dark-color-scheme/modules/_buttons.sass CHANGED
@@ -2,14 +2,15 @@
2
2
 
3
3
  a.table_tools_button,
4
4
  .table_tools .dropdown_menu_button
5
- color: #d7d7d7
6
5
  @include gradient-bar-1
6
+ color: #d7d7d7
7
7
 
8
8
  &:not(.disabled):hover
9
9
  @include gradient-bar-1
10
10
 
11
11
  a.batch_action
12
- color: darkgray
12
+ &, &:link
13
+ color: white
13
14
 
14
15
  .dropdown_menu
15
16
  .dropdown_menu_list_wrapper
@@ -22,6 +23,11 @@
22
23
  background-image: linear-gradient($color, $color)
23
24
 
24
25
  form
26
+ input[type=submit],
27
+ input[type=button],
28
+ button
29
+ @include btn-light-1
30
+
25
31
  fieldset
26
32
  &.actions, &.buttons
27
33
  li.cancel
data/app/assets/stylesheets/activeadmin-dark-color-scheme/modules/_fieldsets.sass ADDED
@@ -0,0 +1,10 @@
1
+ @media (prefers-color-scheme: dark)
2
+ form
3
+ fieldset
4
+ &.inputs
5
+ background-color: $panel-bg-color-transparent
6
+ box-shadow: $panel-shadow
7
+
8
+ legend
9
+ span
10
+ @include gradient-bar-1
data/app/assets/stylesheets/activeadmin-dark-color-scheme/modules/_flash.sass CHANGED
@@ -1,16 +1,24 @@
1
1
  @media (prefers-color-scheme: dark)
2
+ body.logged_out
3
+ .flash
4
+ -webkit-font-smoothing: antialiased
5
+ text-shadow: none
2
6
 
3
7
  body.logged_in
4
8
  .flash
5
- background-color: #c2b36c
6
- background-image: linear-gradient(#a99847, #a38e35)
7
- border-bottom-color: #958118 !important
8
- color: white
9
+ background-color: $alert-default-bg-color
10
+ background-image: linear-gradient($alert-default-gradient-stop-top, $alert-default-gradient-stop-bottom)
11
+ border-bottom-color: $alert-default-border-bottom-color !important
12
+ color: $alert-default-text-color
9
13
  text-shadow: none
10
14
 
11
15
  &.flash_notice
12
- background-color: #4d8750
13
- background-image: linear-gradient(#4e9a53, #4d8750)
14
- border-bottom-color: #2e7732 !important
15
- border-bottom: 1px solid #adcbaf
16
- color: #daeec8
16
+ background-color: $alert-success-bg-color
17
+ background-image: linear-gradient($alert-success-gradient-stop-top, $alert-success-gradient-stop-bottom)
18
+ border-bottom-color: $alert-success-border-bottom-color !important
19
+ color: $alert-success-text-color
20
+
21
+ .active_admin.logged_out
22
+ .flash
23
+ &.flash_alert
24
+ color: $alert-danger-text-color
data/app/assets/stylesheets/activeadmin-dark-color-scheme/modules/_inputs.sass ADDED
@@ -0,0 +1,28 @@
1
+ @media (prefers-color-scheme: dark)
2
+ form
3
+ input[type=text],
4
+ input[type=password],
5
+ input[type=email],
6
+ input[type=number],
7
+ input[type=url],
8
+ input[type=tel],
9
+ input[type=date],
10
+ input[type=time],
11
+ textarea
12
+ border-color: $input-border-colors
13
+ box-shadow: $input-box-shadow
14
+
15
+ // &:focus, &:focus-visible
16
+ // outline-color: $input-focus-outline-color
17
+ // outline-offset: $input-focus-outline-auto-offset
18
+ // outline-style: $input-focus-outline-auto-style
19
+ // outline-width: $input-focus-outline-width
20
+
21
+ input, textarea
22
+ background-color: $input-bg-color
23
+
24
+ // &:focus, &:focus-visible
25
+ // outline-color: $input-focus-outline-color
26
+ // outline-offset: $input-focus-outline-auto-offset
27
+ // outline-style: $input-focus-outline-auto-style
28
+ // outline-width: $input-focus-outline-width
data/app/assets/stylesheets/activeadmin-dark-color-scheme/modules/_labels.sass ADDED
@@ -0,0 +1,4 @@
1
+ @media (prefers-color-scheme: dark)
2
+ form
3
+ ol > li label
4
+ color: $label-color !important
data/app/assets/stylesheets/activeadmin-dark-color-scheme/modules/_navbar.sass ADDED
@@ -0,0 +1,18 @@
1
+ @media (prefers-color-scheme: dark)
2
+ #header
3
+ h1
4
+ a
5
+ &:focus, &:focus-visible
6
+ outline-offset: $btn-focus-outline-solid-offset
7
+ outline-color: $btn-focus-outline-color
8
+ outline-style: $btn-focus-outline-solid-style
9
+ outline-width: $btn-focus-outline-auto-offset
10
+
11
+ ul.tabs
12
+ > li
13
+ a
14
+ &:focus, &:focus-visible
15
+ outline-offset: $btn-focus-outline-solid-offset
16
+ outline-color: $btn-focus-outline-color
17
+ outline-style: $btn-focus-outline-solid-style
18
+ outline-width: $btn-focus-outline-auto-offset
data/app/assets/stylesheets/activeadmin-dark-color-scheme/modules/_select2.sass CHANGED
@@ -3,22 +3,35 @@
3
3
  background-color: $select2-bg-color
4
4
  border-color: $panel-bg-color-solid
5
5
 
6
-
7
6
  .select2-container--default
8
- .select2-selection--single
9
- background-color: $input-bg-color
10
- border-color: $input-border-colors
7
+ &.select2-container--focus
8
+ .select2-selection--multiple
9
+ border-color: $input-border-colors
10
+
11
+ .select2-selection
12
+ &--single, &--multiple
13
+ background-color: $input-bg-color
14
+ border-color: $input-border-colors
15
+ box-shadow: $input-box-shadow
16
+
17
+ &--single
18
+ .select2-selection__rendered
19
+ color: $input-text-color
11
20
 
12
- .select2-selection__rendered
13
- color: $input-text-color
21
+ &--multiple
22
+ .select2-selection__choice
23
+ background-color: $select2-bg-color
24
+ border-color: $select2-bg-color
14
25
 
15
26
  .select2-search--dropdown
16
27
  .select2-search__field
17
28
  background-color: $select2-input-bg-color
18
29
  border-color: $input-border-colors
19
30
 
20
- .select2-results__option--highlighted[aria-selected]
21
- background-color: lighten($select2-bg-color, 5%)
31
+ .select2-results
32
+ &__option
33
+ &[aria-selected=true]
34
+ background-color: $select2-bg-color
22
35
 
23
- .select2-results__option[aria-selected=true]
24
- background-color: $select2-bg-color
36
+ &--highlighted[aria-selected]
37
+ background-color: lighten($select2-bg-color, 5%)
data/app/assets/stylesheets/activeadmin-dark-color-scheme/modules/_tabs.sass ADDED
@@ -0,0 +1,17 @@
1
+ @media (prefers-color-scheme: dark)
2
+ .tab-content
3
+ border-color: $tab-border-color
4
+
5
+ .ui-tabs-nav
6
+ li
7
+ a
8
+ @include btn-dark-1
9
+
10
+ &:focus, &:focus-visible
11
+ outline-offset: -1px
12
+
13
+ &.ui-tabs-active a
14
+ @include btn-dark-1-inset
15
+
16
+ // &:focus, &:focus-visible
17
+ // outline-offset: -1px
data/app/assets/stylesheets/activeadmin-dark-color-scheme/modules/_toggle-bool-switch.sass ADDED
@@ -0,0 +1,5 @@
1
+ @media (prefers-color-scheme: dark)
2
+ .toggle-bool-switches-container
3
+ .toggle-bool-switch.on
4
+ background-image: linear-gradient($toggle-bool-gradient-stop-top, $toggle-bool-gradient-stop-bottom)
5
+ box-shadow: $toggle-bool-box-shadow
data/app/assets/stylesheets/activeadmin-dark-color-scheme/variables/_alerts.sass ADDED
@@ -0,0 +1,14 @@
1
+ // Alerts
2
+ $alert-danger-text-color: hsl(349, 57%, 53%) !default
3
+
4
+ $alert-success-bg-color: hsl(131, 39%, 33%) !default
5
+ $alert-success-gradient-stop-top: hsl(131, 39%, 33%) !default
6
+ $alert-success-gradient-stop-bottom: hsl(123, 41%, 25%) !default
7
+ $alert-success-text-color: #daeec8 !default
8
+ $alert-success-border-bottom-color: hsl(123, 45%, 26%) !default
9
+
10
+ $alert-default-bg-color: #c2b36c !default
11
+ $alert-default-gradient-stop-top: #a38e35 !default
12
+ $alert-default-gradient-stop-bottom: #a99847 !default
13
+ $alert-default-text-color: white !default
14
+ $alert-default-border-bottom-color: #958118 !default
data/app/assets/stylesheets/activeadmin-dark-color-scheme/variables/_base.sass ADDED
@@ -0,0 +1,9 @@
1
+ // $body-bg-color: hsl(200, 4%, 20%) !default
2
+ $body-bg-color: hsl(200, 8%, 15%) !default
3
+ $body-text-color: hsla(0, 0%, 100%, 0.8) !default
4
+
5
+ // Links
6
+ $link-color-1: hsl(210, 70%, 73%) !default
7
+
8
+ // Tab
9
+ $tab-border-color: hsla(0, 0%, 100%, .1) !default
data/app/assets/stylesheets/activeadmin-dark-color-scheme/variables/_buttons.sass ADDED
@@ -0,0 +1,24 @@
1
+ // Buttons
2
+
3
+ $btn-focus-outline-color: -webkit-focus-ring-color
4
+ $btn-focus-outline-width: 2px
5
+ $btn-focus-outline-auto-offset: 2px
6
+ $btn-focus-outline-auto-style: auto
7
+ $btn-focus-outline-solid-offset: 0
8
+ $btn-focus-outline-solid-style: solid
9
+
10
+ $btn-dark-1-bg: hsl(0, 0%, 17%) !default
11
+ $btn-dark-1-gradient-stop-top: hsl(0, 0%, 33%) !default
12
+ $btn-dark-1-gradient-stop-bottom: hsl(0, 0%, 29%) !default
13
+ $btn-dark-1-color: white !default
14
+
15
+ $btn-dark-1-inset-bg: #3b3b3b
16
+ $btn-datk-1-inset-border-top-color: hsla(0, 0%, 0%, .01)
17
+ $btn-dark-1-inset-gradient-stop-top: #3b3b3b !default
18
+ $btn-dark-1-inset-gradient-stop-bottom: #414141 !default
19
+ $btn-dark-1-inset-color: lighten($btn-dark-1-bg, 10%)
20
+
21
+ $btn-light-1-bg: hsl(208, 15%, 87%) !default
22
+ $btn-light-1-gradient-stop-top: hsl(208, 15%, 87%) !default
23
+ $btn-light-1-gradient-stop-bottom: hsl(210, 2%, 68%) !default
24
+ $btn-light-1-color: hsl(0, 0%, 7%) !default
data/app/assets/stylesheets/activeadmin-dark-color-scheme/variables/_inputs.sass ADDED
@@ -0,0 +1,13 @@
1
+ // Inputs
2
+ $input-bg-color: hsla(0, 0%, 0%, .2) !default
3
+ $input-box-shadow: inset 0 1px 5px hsla(0, 0%, 0%, .2)
4
+ $input-border-color: hsla(0, 0%, 50%, .2) !default
5
+ $input-border-color-top: hsla(0, 0%, 50%, .1) !default
6
+ $input-border-colors: $input-border-color-top $input-border-color $input-border-color $input-border-color !default
7
+ $input-focus-outline-color: -webkit-focus-ring-color
8
+ $input-focus-outline-width: 2px
9
+ $input-focus-outline-auto-offset: 2px
10
+ $input-focus-outline-auto-style: auto
11
+ // $input-focus-outline-solid-offset: 0
12
+ // $input-focus-outline-solid-style: solid
13
+ $input-text-color: white !default
data/app/assets/stylesheets/activeadmin-dark-color-scheme/variables/_labels.sass ADDED
@@ -0,0 +1,2 @@
1
+ // Labels
2
+ $label-color: hsl(0, 0%, 80%) !default
data/app/assets/stylesheets/activeadmin-dark-color-scheme/variables/_panels.sass ADDED
@@ -0,0 +1,5 @@
1
+ // Panels
2
+ $panel-bg-color-solid: hsl(0, 0%, 26%) !default
3
+ $panel-bg-color-transparent: hsla(0, 0%, 100%, 0.05) !default
4
+ $panel-head-gradient: linear-gradient(rgba(255, 255, 255, .08), transparent) !default
5
+ $panel-shadow: 0 1px 4px hsla(0, 0%, 0%, .2) !default
data/app/assets/stylesheets/activeadmin-dark-color-scheme/variables/_select2.sass ADDED
@@ -0,0 +1,3 @@
1
+ // Select2
2
+ $select2-bg-color: hsl(200, 5%, 20%) !default
3
+ $select2-input-bg-color: hsl(240, 0%, 15%) !default
data/app/assets/stylesheets/activeadmin-dark-color-scheme/variables/_tables.sass ADDED
@@ -0,0 +1,10 @@
1
+ // Tables
2
+ $tr-border-bottom-color: hsla(0, 0%, 50%, .1) !default
3
+ $th-bg-color: #6f6f6f !default
4
+ $th-border-color-bottom: hsl(0, 0%, 30%) !default
5
+ $th-border-color-left: hsl(0, 0%, 24%) !default
6
+ $th-border-color-right: hsl(0, 0%, 35%) !default
7
+ $th-border-color-top: hsl(0, 0%, 31%) !default
8
+ $tr-even-bg-color: hsla(0, 0%, 100%, .02) !default
9
+ $tr-odd-bg-color: $body-bg-color !default
10
+ $tr-selected-bg-color: rgba(0, 0, 0, 0.16) !default
data/app/assets/stylesheets/activeadmin-dark-color-scheme/variables/_toggle-bool.sass ADDED
@@ -0,0 +1,4 @@
1
+ // Toggle bool switch
2
+ $toggle-bool-gradient-stop-top: hsl(109, 82%, 23%)
3
+ $toggle-bool-gradient-stop-bottom: hsl(143, 86%, 20%)
4
+ $toggle-bool-box-shadow: 0 1px 3px hsla(0, 0%, 0%, .1), 0 0 1px hsla(0, 0%, 100%, .7) inset
data/lib/activeadmin/dark_color_scheme/engine.rb CHANGED
@@ -1,6 +1,5 @@
1
1
  # frozen_string_literal: true
2
2
 
3
- require "autoprefixer-rails"
4
3
  require "sassc-rails"
5
4
 
6
5
  module FormtasticTristateRadio
@@ -8,12 +7,10 @@ module FormtasticTristateRadio
8
7
  # This is standard Rails way to autoload gem’s contents dynamically as an “engine”
9
8
  # @see https://guides.rubyonrails.org/engines.html Rails guide on engines
10
9
  #
11
- # module Rails
12
10
  class Engine < ::Rails::Engine
13
- initializer "bootstrap.assets" do |app|
11
+ initializer "activeadmin_dark_color_scheme.assets" do |app|
14
12
  app.config.assets.paths << root.join("assets", "stylesheets").to_s
15
13
  end
16
14
  end
17
- # end
18
15
 
19
16
  end
data/lib/activeadmin/dark_color_scheme/version.rb CHANGED
@@ -1,5 +1,5 @@
1
1
  module Activeadmin
2
2
  module DarkColorScheme
3
- VERSION = "0.1.1"
3
+ VERSION = "0.1.6"
4
4
  end
5
5
  end
data/lib/activeadmin/dark_color_scheme.rb CHANGED
@@ -1,3 +1,5 @@
1
+ # frozen_string_literal: true
2
+
1
3
  require_relative "dark_color_scheme/version"
2
4
  require_relative "dark_color_scheme/engine"
3
5
 
data/lib/activeadmin_dark_color_scheme.rb ADDED
@@ -0,0 +1,3 @@
1
+ # frozen_string_literal: true
2
+
3
+ require_relative "activeadmin/dark_color_scheme"
metadata CHANGED
@@ -1,55 +1,55 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: activeadmin_dark_color_scheme
3
3
  version: !ruby/object:Gem::Version
4
- version: 0.1.1
4
+ version: 0.1.6
5
5
  platform: ruby
6
6
  authors:
7
7
  - Sergey Pedan
8
8
  autorequire:
9
9
  bindir: exe
10
10
  cert_chain: []
11
- date: 2022-06-10 00:00:00.000000000 Z
11
+ date: 2022-06-11 00:00:00.000000000 Z
12
12
  dependencies:
13
13
  - !ruby/object:Gem::Dependency
14
- name: autoprefixer-rails
14
+ name: sassc-rails
15
15
  requirement: !ruby/object:Gem::Requirement
16
16
  requirements:
17
17
  - - "~>"
18
18
  - !ruby/object:Gem::Version
19
- version: '10'
19
+ version: '2'
20
20
  - - ">="
21
21
  - !ruby/object:Gem::Version
22
- version: 10.4.7
22
+ version: 2.0.0
23
23
  type: :runtime
24
24
  prerelease: false
25
25
  version_requirements: !ruby/object:Gem::Requirement
26
26
  requirements:
27
27
  - - "~>"
28
28
  - !ruby/object:Gem::Version
29
- version: '10'
29
+ version: '2'
30
30
  - - ">="
31
31
  - !ruby/object:Gem::Version
32
- version: 10.4.7
32
+ version: 2.0.0
33
33
  - !ruby/object:Gem::Dependency
34
- name: sassc-rails
34
+ name: autoprefixer-rails
35
35
  requirement: !ruby/object:Gem::Requirement
36
36
  requirements:
37
37
  - - "~>"
38
38
  - !ruby/object:Gem::Version
39
- version: '2'
39
+ version: '10'
40
40
  - - ">="
41
41
  - !ruby/object:Gem::Version
42
- version: 2.0.0
43
- type: :runtime
42
+ version: 10.4.7
43
+ type: :development
44
44
  prerelease: false
45
45
  version_requirements: !ruby/object:Gem::Requirement
46
46
  requirements:
47
47
  - - "~>"
48
48
  - !ruby/object:Gem::Version
49
- version: '2'
49
+ version: '10'
50
50
  - - ">="
51
51
  - !ruby/object:Gem::Version
52
- version: 2.0.0
52
+ version: 10.4.7
53
53
  - !ruby/object:Gem::Dependency
54
54
  name: rspec
55
55
  requirement: !ruby/object:Gem::Requirement
@@ -121,22 +121,36 @@ files:
121
121
  - app/assets/stylesheets/activeadmin-dark-color-scheme/mixins/_buttons.sass
122
122
  - app/assets/stylesheets/activeadmin-dark-color-scheme/mixins/_panel-heads.sass
123
123
  - app/assets/stylesheets/activeadmin-dark-color-scheme/modules/_buttons.sass
124
+ - app/assets/stylesheets/activeadmin-dark-color-scheme/modules/_fieldsets.sass
124
125
  - app/assets/stylesheets/activeadmin-dark-color-scheme/modules/_flash.sass
125
- - app/assets/stylesheets/activeadmin-dark-color-scheme/modules/_forms.sass
126
+ - app/assets/stylesheets/activeadmin-dark-color-scheme/modules/_inputs.sass
127
+ - app/assets/stylesheets/activeadmin-dark-color-scheme/modules/_labels.sass
126
128
  - app/assets/stylesheets/activeadmin-dark-color-scheme/modules/_login.sass
127
129
  - app/assets/stylesheets/activeadmin-dark-color-scheme/modules/_misc.sass
130
+ - app/assets/stylesheets/activeadmin-dark-color-scheme/modules/_navbar.sass
128
131
  - app/assets/stylesheets/activeadmin-dark-color-scheme/modules/_pagination.sass
129
132
  - app/assets/stylesheets/activeadmin-dark-color-scheme/modules/_panels.sass
130
133
  - app/assets/stylesheets/activeadmin-dark-color-scheme/modules/_select2.sass
131
134
  - app/assets/stylesheets/activeadmin-dark-color-scheme/modules/_sidebar.sass
132
135
  - app/assets/stylesheets/activeadmin-dark-color-scheme/modules/_table-attributes.sass
133
136
  - app/assets/stylesheets/activeadmin-dark-color-scheme/modules/_table-index.sass
137
+ - app/assets/stylesheets/activeadmin-dark-color-scheme/modules/_tabs.sass
134
138
  - app/assets/stylesheets/activeadmin-dark-color-scheme/modules/_title-bar.sass
139
+ - app/assets/stylesheets/activeadmin-dark-color-scheme/modules/_toggle-bool-switch.sass
135
140
  - app/assets/stylesheets/activeadmin-dark-color-scheme/modules/_top-level.sass
136
- - app/assets/stylesheets/activeadmin-dark-color-scheme/variables/_all.sass
141
+ - app/assets/stylesheets/activeadmin-dark-color-scheme/variables/_alerts.sass
142
+ - app/assets/stylesheets/activeadmin-dark-color-scheme/variables/_base.sass
143
+ - app/assets/stylesheets/activeadmin-dark-color-scheme/variables/_buttons.sass
144
+ - app/assets/stylesheets/activeadmin-dark-color-scheme/variables/_inputs.sass
145
+ - app/assets/stylesheets/activeadmin-dark-color-scheme/variables/_labels.sass
146
+ - app/assets/stylesheets/activeadmin-dark-color-scheme/variables/_panels.sass
147
+ - app/assets/stylesheets/activeadmin-dark-color-scheme/variables/_select2.sass
148
+ - app/assets/stylesheets/activeadmin-dark-color-scheme/variables/_tables.sass
149
+ - app/assets/stylesheets/activeadmin-dark-color-scheme/variables/_toggle-bool.sass
137
150
  - lib/activeadmin/dark_color_scheme.rb
138
151
  - lib/activeadmin/dark_color_scheme/engine.rb
139
152
  - lib/activeadmin/dark_color_scheme/version.rb
153
+ - lib/activeadmin_dark_color_scheme.rb
140
154
  homepage: https://github.com/sergeypedan/activeadmin-dark-color-scheme
141
155
  licenses:
142
156
  - MIT
@@ -150,7 +164,7 @@ rdoc_options:
150
164
  - "--charset=UTF-8"
151
165
  require_paths:
152
166
  - app
153
- - lib/activeadmin
167
+ - lib
154
168
  required_ruby_version: !ruby/object:Gem::Requirement
155
169
  requirements:
156
170
  - - ">="
data/app/assets/stylesheets/activeadmin-dark-color-scheme/modules/_forms.sass DELETED
@@ -1,33 +0,0 @@
1
- @media (prefers-color-scheme: dark)
2
- form
3
- input[type=submit],
4
- input[type=button],
5
- button
6
- @include btn-light-1
7
-
8
- fieldset
9
- &.inputs
10
- background-color: $panel-bg-color-transparent
11
- box-shadow: $panel-shadow
12
-
13
- legend
14
- span
15
- @include gradient-bar-1
16
-
17
- ol > li label
18
- color: $label-color !important
19
-
20
- input[type=text],
21
- input[type=password],
22
- input[type=email],
23
- input[type=number],
24
- input[type=url],
25
- input[type=tel],
26
- input[type=date],
27
- input[type=time],
28
- textarea
29
- border-color: $input-border-colors
30
- box-shadow: inset 0 1px 5px hsla(0, 0%, 0%, .2)
31
-
32
- input, textarea
33
- background-color: $input-bg-color
data/app/assets/stylesheets/activeadmin-dark-color-scheme/variables/_all.sass DELETED
@@ -1,44 +0,0 @@
1
- // $body-bg-color: hsl(200, 4%, 20%) !default
2
- $body-bg-color: hsl(200, 8%, 15%) !default
3
- $body-text-color: hsla(0, 0%, 100%, 0.8) !default
4
-
5
- // Links
6
- $link-color-1: hsl(210, 70%, 73%) !default
7
-
8
- // Tables
9
- $tr-border-bottom-color: hsla(0, 0%, 100%, .075) !default
10
- $th-bg-color: #6f6f6f !default
11
- $th-border-color-bottom: hsl(0, 0%, 30%) !default
12
- $th-border-color-left: hsl(0, 0%, 24%) !default
13
- $th-border-color-right: hsl(0, 0%, 35%) !default
14
- $th-border-color-top: hsl(0, 0%, 31%) !default
15
- $tr-even-bg-color: hsla(0, 0%, 100%, .02) !default
16
- $tr-odd-bg-color: $body-bg-color !default
17
- $tr-selected-bg-color: rgba(0, 0, 0, 0.16) !default
18
-
19
- // Panels
20
- $panel-bg-color-solid: hsl(0, 0%, 26%) !default
21
- $panel-bg-color-transparent: hsla(0, 0%, 100%, 0.05) !default
22
- $panel-head-gradient: linear-gradient(rgba(255, 255, 255, .08), transparent) !default
23
- $panel-shadow: 0 1px 4px hsla(0, 0%, 0%, .2) !default
24
-
25
- // Forms
26
- $input-bg-color: hsla(0, 0%, 0%, .2) !default
27
- $input-border-colors: hsla(0, 0%, 50%, .1) hsla(0, 0%, 50%, .2) hsla(0, 0%, 50%, .2) hsla(0, 0%, 50%, .2) !default
28
- $input-text-color: white !default
29
- $label-color: hsl(0, 0%, 80%) !default
30
-
31
- // Select
32
- $select2-bg-color: hsl(200, 5%, 20%) !default
33
- $select2-input-bg-color: hsl(240, 0%, 15%) !default
34
-
35
- // Buttons
36
- $btn-dark-1-bg: hsl(0, 0%, 17%) !default
37
- $btn-dark-1-gradient-stop-top: hsl(0, 0%, 33%) !default
38
- $btn-dark-1-gradient-stop-bottom: hsl(0, 0%, 29%) !default
39
- $btn-dark-1-color: white !default
40
-
41
- $btn-light-1-bg: hsl(208, 15%, 87%) !default
42
- $btn-light-1-gradient-stop-top: hsl(208, 15%, 87%) !default
43
- $btn-light-1-gradient-stop-bottom: hsl(210, 2%, 68%) !default
44
- $btn-light-1-color: hsl(0, 0%, 7%) !default