activeadmin_dark_color_scheme 0.1.2 → 0.1.7

Sign up to get free protection for your applications and to get access to all the features.
Files changed (34) hide show
  1. checksums.yaml +4 -4
  2. data/Gemfile.lock +1 -1
  3. data/README.md +59 -18
  4. data/Rakefile +9 -2
  5. data/activeadmin_dark_color_scheme.gemspec +1 -1
  6. data/app/assets/stylesheets/_activeadmin-dark-color-scheme.sass +17 -3
  7. data/app/assets/stylesheets/activeadmin-dark-color-scheme/mixins/_button-dark.sass +42 -0
  8. data/app/assets/stylesheets/activeadmin-dark-color-scheme/mixins/_button-light.sass +15 -0
  9. data/app/assets/stylesheets/activeadmin-dark-color-scheme/modules/_buttons.sass +8 -2
  10. data/app/assets/stylesheets/activeadmin-dark-color-scheme/modules/_fieldsets.sass +10 -0
  11. data/app/assets/stylesheets/activeadmin-dark-color-scheme/modules/_flash.sass +17 -9
  12. data/app/assets/stylesheets/activeadmin-dark-color-scheme/modules/_inputs.sass +28 -0
  13. data/app/assets/stylesheets/activeadmin-dark-color-scheme/modules/_labels.sass +4 -0
  14. data/app/assets/stylesheets/activeadmin-dark-color-scheme/modules/_navbar.sass +18 -0
  15. data/app/assets/stylesheets/activeadmin-dark-color-scheme/modules/_select2.sass +23 -10
  16. data/app/assets/stylesheets/activeadmin-dark-color-scheme/modules/_tabs.sass +17 -0
  17. data/app/assets/stylesheets/activeadmin-dark-color-scheme/modules/_toggle-bool-switch.sass +5 -0
  18. data/app/assets/stylesheets/activeadmin-dark-color-scheme/variables/_alerts.sass +14 -0
  19. data/app/assets/stylesheets/activeadmin-dark-color-scheme/variables/_base.sass +9 -0
  20. data/app/assets/stylesheets/activeadmin-dark-color-scheme/variables/_buttons.sass +24 -0
  21. data/app/assets/stylesheets/activeadmin-dark-color-scheme/variables/_inputs.sass +13 -0
  22. data/app/assets/stylesheets/activeadmin-dark-color-scheme/variables/_labels.sass +2 -0
  23. data/app/assets/stylesheets/activeadmin-dark-color-scheme/variables/_panels.sass +5 -0
  24. data/app/assets/stylesheets/activeadmin-dark-color-scheme/variables/_select2.sass +3 -0
  25. data/app/assets/stylesheets/activeadmin-dark-color-scheme/variables/_tables.sass +10 -0
  26. data/app/assets/stylesheets/activeadmin-dark-color-scheme/variables/_toggle-bool.sass +4 -0
  27. data/lib/activeadmin/dark_color_scheme/engine.rb +1 -4
  28. data/lib/activeadmin/dark_color_scheme/version.rb +1 -1
  29. data/lib/activeadmin/dark_color_scheme.rb +2 -0
  30. data/lib/activeadmin_dark_color_scheme.rb +3 -0
  31. metadata +21 -6
  32. data/app/assets/stylesheets/activeadmin-dark-color-scheme/mixins/_buttons.sass +0 -22
  33. data/app/assets/stylesheets/activeadmin-dark-color-scheme/modules/_forms.sass +0 -33
  34. 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: '078d5fcf69c3b69f130d3e3fa2dd240379f1f9c8146737b31a44c8fe07f1e9a1'
4
- data.tar.gz: 1e97a29d2a9e1bf45ad7990622b167e1491ac16ce38dd9e32f5df73f4a13e7a8
3
+ metadata.gz: d260e344c778bd0b92c74ebfdff90a31e2a6bf6104ba24f7782d6f331402d153
4
+ data.tar.gz: 56822e3f1a2c37b2036309bdc93e2a21d0e3d9a520c951af7a855a2883f45bb1
5
5
  SHA512:
6
- metadata.gz: c1222e49c4caf8f313d68d41400757460bb7c40df070ffa6c143fef8b7e77e1cfceeef35f2d2a7cdb377002cc35544ac192603e5445d408a8d4b0739c9a0ab2a
7
- data.tar.gz: f281bfb3686c59bc832d8cced2b1348897c704323c47bfc412a332420ddcfff59c56c3d12c7e6a7f5a7c372f8e1b507c7dbd05535910605aef61439aadcee83a
6
+ metadata.gz: 77d10b8988689cfd928e6bcc0ecbeb041430a34b2d78d4842f0aacc214e06ee719620129fccbd688a44e36f6439478cafad0e376d7a5dcd64d4bfa82ab33f574
7
+ data.tar.gz: 1bcf06617a5ce09a0a979f02965950fae12f3ed60d301c7ec5c355998a1dd6c928430fe1cf19769903bebf3526a32b3755a2be04165590d06fff87156bcda30c
data/Gemfile.lock CHANGED
@@ -1,7 +1,7 @@
1
1
  PATH
2
2
  remote: .
3
3
  specs:
4
- activeadmin_dark_color_scheme (0.1.2)
4
+ activeadmin_dark_color_scheme (0.1.7)
5
5
  sassc-rails (~> 2, >= 2.0.0)
6
6
 
7
7
  GEM
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/Rakefile CHANGED
@@ -1,6 +1,9 @@
1
1
  require "bundler/setup"
2
2
  require "bundler/gem_tasks"
3
3
  require "rspec/core/rake_task"
4
+ require "term/ansicolor"
5
+
6
+ require "./lib/activeadmin/dark_color_scheme"
4
7
 
5
8
  RSpec::Core::RakeTask.new(:spec)
6
9
 
@@ -53,9 +56,7 @@ task default: :spec
53
56
  desc "Dumps output to a CSS file for testing"
54
57
  task :debug do
55
58
  require "sassc"
56
- require "term/ansicolor"
57
59
  require "autoprefixer-rails"
58
- require "./lib/activeadmin/dark_color_scheme"
59
60
 
60
61
  path = Activeadmin::DarkColorScheme.stylesheets_path
61
62
  entrypoins = %w(_activeadmin-dark-color-scheme)
@@ -74,6 +75,12 @@ task :debug do
74
75
  end
75
76
  end
76
77
 
78
+ # desc "Publish"
79
+ # task :publish do
80
+ # puts `gem push pkg/activeadmin_dark_color_scheme-#{Activeadmin::DarkColorScheme::VERSION}.gem`
81
+ # end
82
+
83
+
77
84
  # desc 'Start a dummy Rails app server'
78
85
  # task :rails_server do
79
86
  # require 'rack'
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 = []
data/app/assets/stylesheets/_activeadmin-dark-color-scheme.sass CHANGED
@@ -1,21 +1,35 @@
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
- @import "./activeadmin-dark-color-scheme/mixins/buttons"
13
+ @import "./activeadmin-dark-color-scheme/mixins/button-light"
14
+ @import "./activeadmin-dark-color-scheme/mixins/button-dark"
6
15
  @import "./activeadmin-dark-color-scheme/mixins/panel-heads"
7
16
 
8
17
  // Modules
9
18
  @import "./activeadmin-dark-color-scheme/modules/buttons"
19
+ @import "./activeadmin-dark-color-scheme/modules/fieldsets"
10
20
  @import "./activeadmin-dark-color-scheme/modules/flash"
11
- @import "./activeadmin-dark-color-scheme/modules/forms"
21
+ @import "./activeadmin-dark-color-scheme/modules/inputs"
22
+ @import "./activeadmin-dark-color-scheme/modules/labels"
12
23
  @import "./activeadmin-dark-color-scheme/modules/login"
13
24
  @import "./activeadmin-dark-color-scheme/modules/misc"
25
+ @import "./activeadmin-dark-color-scheme/modules/navbar"
14
26
  @import "./activeadmin-dark-color-scheme/modules/pagination"
15
27
  @import "./activeadmin-dark-color-scheme/modules/panels"
16
28
  @import "./activeadmin-dark-color-scheme/modules/select2"
17
29
  @import "./activeadmin-dark-color-scheme/modules/sidebar"
18
30
  @import "./activeadmin-dark-color-scheme/modules/table-attributes"
19
31
  @import "./activeadmin-dark-color-scheme/modules/table-index"
32
+ @import "./activeadmin-dark-color-scheme/modules/tabs"
20
33
  @import "./activeadmin-dark-color-scheme/modules/title-bar"
34
+ @import "./activeadmin-dark-color-scheme/modules/toggle-bool-switch"
21
35
  @import "./activeadmin-dark-color-scheme/modules/top-level"
data/app/assets/stylesheets/activeadmin-dark-color-scheme/mixins/_button-dark.sass ADDED
@@ -0,0 +1,42 @@
1
+ @media (prefers-color-scheme: dark)
2
+ %btn-dark-inset-state
3
+ background-color: $btn-dark-1-inset-bg
4
+ background-image: linear-gradient($btn-dark-1-inset-gradient-stop-top, $btn-dark-1-inset-gradient-stop-bottom)
5
+ border-top-color: $btn-datk-1-inset-border-top-color
6
+ border-right-color: lighten($btn-dark-1-bg, 10%)
7
+ border-bottom-color: darken($btn-dark-1-gradient-stop-bottom, 10%)
8
+ border-left-color: $btn-dark-1-inset-color
9
+ box-shadow: 0 1px 3px 0 hsla(0, 0%, 0%, 0.3) inset
10
+
11
+ @mixin btn-dark-1
12
+ background-color: $btn-dark-1-bg
13
+ background-image: linear-gradient(to bottom, $btn-dark-1-gradient-stop-top, $btn-dark-1-gradient-stop-bottom)
14
+ border-top-color: lighten($btn-dark-1-gradient-stop-top, 5%)
15
+ border-right-color: lighten($btn-dark-1-bg, 10%)
16
+ border-bottom-color: darken($btn-dark-1-gradient-stop-bottom, 5%)
17
+ border-left-color: lighten($btn-dark-1-bg, 10%)
18
+ box-shadow: 0 1px 2px darken($btn-dark-1-gradient-stop-bottom, 10%)
19
+ color: $btn-dark-1-color
20
+ text-shadow: none
21
+
22
+ &:not(.disabled)
23
+ &:hover:not(:active)
24
+ background-image: linear-gradient(to bottom, lighten($btn-dark-1-gradient-stop-top, 2%), lighten($btn-dark-1-gradient-stop-bottom, 2%))
25
+
26
+ &:active
27
+ @extend %btn-dark-inset-state
28
+
29
+ &:focus, &:focus-visible
30
+ outline-color: $btn-focus-outline-color
31
+ outline-offset: $btn-focus-outline-auto-offset
32
+ outline-style: $btn-focus-outline-auto-style
33
+ outline-width: $btn-focus-outline-width
34
+
35
+
36
+ @mixin btn-dark-1-inset
37
+ color: $btn-dark-1-color
38
+ @extend %btn-dark-inset-state
39
+
40
+ &:not(.disabled)
41
+ &:hover
42
+ background-image: linear-gradient(to bottom, lighten($btn-dark-1-inset-gradient-stop-top, 2%), lighten($btn-dark-1-inset-gradient-stop-bottom, 2%))
data/app/assets/stylesheets/activeadmin-dark-color-scheme/mixins/_button-light.sass ADDED
@@ -0,0 +1,15 @@
1
+ @mixin btn-light-1
2
+ background-color: $btn-light-1-bg
3
+ background-image: linear-gradient(180deg, $btn-light-1-gradient-stop-top, $btn-light-1-gradient-stop-bottom)
4
+ color: $btn-light-1-color
5
+ text-shadow: none
6
+
7
+ &:not(.disabled)
8
+ &:hover
9
+ background-image: linear-gradient(to bottom, darken($btn-light-1-gradient-stop-top, 3%), darken($btn-light-1-gradient-stop-bottom, 3%))
10
+
11
+ &:focus, &:focus-visible
12
+ outline-color: $btn-focus-outline-color
13
+ outline-offset: $btn-focus-outline-auto-offset
14
+ outline-style: $btn-focus-outline-auto-style
15
+ 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.2"
3
+ VERSION = "0.1.7"
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,14 +1,14 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: activeadmin_dark_color_scheme
3
3
  version: !ruby/object:Gem::Version
4
- version: 0.1.2
4
+ version: 0.1.7
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
14
  name: sassc-rails
@@ -118,25 +118,40 @@ files:
118
118
  - Rakefile
119
119
  - activeadmin_dark_color_scheme.gemspec
120
120
  - app/assets/stylesheets/_activeadmin-dark-color-scheme.sass
121
- - app/assets/stylesheets/activeadmin-dark-color-scheme/mixins/_buttons.sass
121
+ - app/assets/stylesheets/activeadmin-dark-color-scheme/mixins/_button-dark.sass
122
+ - app/assets/stylesheets/activeadmin-dark-color-scheme/mixins/_button-light.sass
122
123
  - app/assets/stylesheets/activeadmin-dark-color-scheme/mixins/_panel-heads.sass
123
124
  - app/assets/stylesheets/activeadmin-dark-color-scheme/modules/_buttons.sass
125
+ - app/assets/stylesheets/activeadmin-dark-color-scheme/modules/_fieldsets.sass
124
126
  - app/assets/stylesheets/activeadmin-dark-color-scheme/modules/_flash.sass
125
- - app/assets/stylesheets/activeadmin-dark-color-scheme/modules/_forms.sass
127
+ - app/assets/stylesheets/activeadmin-dark-color-scheme/modules/_inputs.sass
128
+ - app/assets/stylesheets/activeadmin-dark-color-scheme/modules/_labels.sass
126
129
  - app/assets/stylesheets/activeadmin-dark-color-scheme/modules/_login.sass
127
130
  - app/assets/stylesheets/activeadmin-dark-color-scheme/modules/_misc.sass
131
+ - app/assets/stylesheets/activeadmin-dark-color-scheme/modules/_navbar.sass
128
132
  - app/assets/stylesheets/activeadmin-dark-color-scheme/modules/_pagination.sass
129
133
  - app/assets/stylesheets/activeadmin-dark-color-scheme/modules/_panels.sass
130
134
  - app/assets/stylesheets/activeadmin-dark-color-scheme/modules/_select2.sass
131
135
  - app/assets/stylesheets/activeadmin-dark-color-scheme/modules/_sidebar.sass
132
136
  - app/assets/stylesheets/activeadmin-dark-color-scheme/modules/_table-attributes.sass
133
137
  - app/assets/stylesheets/activeadmin-dark-color-scheme/modules/_table-index.sass
138
+ - app/assets/stylesheets/activeadmin-dark-color-scheme/modules/_tabs.sass
134
139
  - app/assets/stylesheets/activeadmin-dark-color-scheme/modules/_title-bar.sass
140
+ - app/assets/stylesheets/activeadmin-dark-color-scheme/modules/_toggle-bool-switch.sass
135
141
  - app/assets/stylesheets/activeadmin-dark-color-scheme/modules/_top-level.sass
136
- - app/assets/stylesheets/activeadmin-dark-color-scheme/variables/_all.sass
142
+ - app/assets/stylesheets/activeadmin-dark-color-scheme/variables/_alerts.sass
143
+ - app/assets/stylesheets/activeadmin-dark-color-scheme/variables/_base.sass
144
+ - app/assets/stylesheets/activeadmin-dark-color-scheme/variables/_buttons.sass
145
+ - app/assets/stylesheets/activeadmin-dark-color-scheme/variables/_inputs.sass
146
+ - app/assets/stylesheets/activeadmin-dark-color-scheme/variables/_labels.sass
147
+ - app/assets/stylesheets/activeadmin-dark-color-scheme/variables/_panels.sass
148
+ - app/assets/stylesheets/activeadmin-dark-color-scheme/variables/_select2.sass
149
+ - app/assets/stylesheets/activeadmin-dark-color-scheme/variables/_tables.sass
150
+ - app/assets/stylesheets/activeadmin-dark-color-scheme/variables/_toggle-bool.sass
137
151
  - lib/activeadmin/dark_color_scheme.rb
138
152
  - lib/activeadmin/dark_color_scheme/engine.rb
139
153
  - lib/activeadmin/dark_color_scheme/version.rb
154
+ - lib/activeadmin_dark_color_scheme.rb
140
155
  homepage: https://github.com/sergeypedan/activeadmin-dark-color-scheme
141
156
  licenses:
142
157
  - MIT
@@ -150,7 +165,7 @@ rdoc_options:
150
165
  - "--charset=UTF-8"
151
166
  require_paths:
152
167
  - app
153
- - lib/activeadmin
168
+ - lib
154
169
  required_ruby_version: !ruby/object:Gem::Requirement
155
170
  requirements:
156
171
  - - ">="
data/app/assets/stylesheets/activeadmin-dark-color-scheme/mixins/_buttons.sass DELETED
@@ -1,22 +0,0 @@
1
- @mixin btn-dark-1
2
- background-color: $btn-dark-1-bg
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%)
5
- border-right-color: lighten($btn-dark-1-bg, 10%)
6
- border-bottom-color: darken($btn-dark-1-gradient-stop-bottom, 10%)
7
- border-left-color: lighten($btn-dark-1-bg, 10%)
8
- box-shadow: 0 1px 2px darken($btn-dark-1-gradient-stop-bottom, 10%)
9
- color: $btn-dark-1-color
10
- text-shadow: none
11
-
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%))
14
-
15
- @mixin btn-light-1
16
- background-color: $btn-light-1-bg
17
- background-image: linear-gradient(180deg, $btn-light-1-gradient-stop-top, $btn-light-1-gradient-stop-bottom)
18
- color: $btn-light-1-color
19
- text-shadow: none
20
-
21
- &:not(.disabled):hover
22
- background-image: linear-gradient(to bottom, darken($btn-light-1-gradient-stop-top, 3%), darken($btn-light-1-gradient-stop-bottom, 3%))
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