satis 2.4.3 → 2.5.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.
Files changed (33) hide show
  1. checksums.yaml +4 -4
  2. data/.shipkit.yml +2 -0
  3. data/Gemfile +4 -0
  4. data/app/assets/stylesheets/satis/application.css +6 -6
  5. data/app/assets/stylesheets/satis/components/phone-number.css +1 -1
  6. data/app/assets/tailwind/satis/engine.css +6 -0
  7. data/app/components/satis/appearance_switcher/component.css +23 -23
  8. data/app/components/satis/attachments/component.css +5 -5
  9. data/app/components/satis/breadcrumbs/component.css +9 -9
  10. data/app/components/satis/breadcrumbs/crumb.slim +1 -1
  11. data/app/components/satis/calendar_month/component.html.slim +4 -4
  12. data/app/components/satis/card/component.css +15 -15
  13. data/app/components/satis/card/component.html.slim +4 -4
  14. data/app/components/satis/color_picker/component.css +3 -3
  15. data/app/components/satis/date_time_picker/component.html.slim +7 -7
  16. data/app/components/satis/dialog/component.html.slim +2 -2
  17. data/app/components/satis/dropdown/component.css +5 -5
  18. data/app/components/satis/editor/component.css +1 -1
  19. data/app/components/satis/flash_messages/component.css +7 -9
  20. data/app/components/satis/input/component.css +39 -41
  21. data/app/components/satis/menu/component.css +5 -7
  22. data/app/components/satis/menu_item/component.html.slim +2 -2
  23. data/app/components/satis/page/component.css +1 -1
  24. data/app/components/satis/sidebar_menu_item/component.css +18 -15
  25. data/app/components/satis/sidebar_menu_item/mobile/component.html.slim +3 -3
  26. data/app/components/satis/switch/component.html.slim +1 -1
  27. data/app/components/satis/tabs/component.css +15 -18
  28. data/app/components/satis/tabs/component.html.slim +1 -1
  29. data/lib/generators/satis/tailwind_config_generator.rb +4 -0
  30. data/lib/satis/concerns/contextual_translations.rb +1 -1
  31. data/lib/satis/version.rb +1 -1
  32. data/lib/tasks/satis_tasks.rake +3 -1
  33. metadata +4 -2
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA256:
3
- metadata.gz: ab722e40f5f1fe8ab1b85d7d72f6e77f446f2d1259b66fc5b8ebcd52ea5fcfe3
4
- data.tar.gz: 15213eaebc44066a1a60f98fa48df24b123ef599bd661ff486e9633941ef6312
3
+ metadata.gz: e0357c328a0232c99e20b27135b65486ae6856fcd1496b505c9692e09920e1bf
4
+ data.tar.gz: b565a0f38a873b1d4f941b5adcd1488729c84b5b4c1c9a6416e90d434fe37657
5
5
  SHA512:
6
- metadata.gz: 807bca4671406969f987c67267c2901ee5725f3510b486c0272eae7e3a3754499eeffee88ef5a2837e00a82b8a5a8b478ac9c32332ac0989158aed1d0e79b855
7
- data.tar.gz: 566b6ddb381c38a7a3bf87f2c11fc7e273ddec793d87cf529607052ea1bd590493887ddfb525a863b9c830e7b9790a0bd3bd338ef89313c90f3114d4269ac390
6
+ metadata.gz: 1ae7ec2e4dd395cea25d1d73df7227f5549f96477be12b0921c08c6786d296f7c757c5299e299ad924ce2e341a0ed4ad39aff717b54c5616bf81b6c119c99a56
7
+ data.tar.gz: 5ac35f79dca43c866b957ec7caa44baf4ce404974144a1cd16f19c1f50ce29f12abd5abe8af62ebce27d857db6d21f8585a0d3c27692fa59ff3485e8c4368207
data/.shipkit.yml ADDED
@@ -0,0 +1,2 @@
1
+ ---
2
+ previous_version: 2.4.4
data/Gemfile CHANGED
@@ -25,3 +25,7 @@ group :development, :test do
25
25
  gem "rubocop-rails", require: false
26
26
  gem "strong_migrations"
27
27
  end
28
+
29
+ source "https://rubygems.pkg.github.com/entdec" do
30
+ gem "shipkit"
31
+ end
@@ -20,15 +20,15 @@
20
20
  @import '../../../components/satis/sidebar_menu_item/component.css';
21
21
  @import '../../../components/satis/tabs/component.css';
22
22
 
23
- @import 'components/diffy.css';
24
- @import 'components/form.css';
25
- @import "components/trix.css";
23
+ @import './components/diffy.css';
24
+ @import './components/form.css';
25
+ @import "./components/trix.css";
26
26
 
27
- @import 'components/phone-number.css';
27
+ @import './components/phone-number.css';
28
28
 
29
- @import "components/flag-icons.min.css";
29
+ @import "./components/flag-icons.min.css";
30
30
 
31
- @import "components/tippyjs.css";
31
+ @import "./components/tippyjs.css";
32
32
 
33
33
  /* Every link without a class or empty class should be underlined */
34
34
  a:not([class]),
@@ -1,6 +1,6 @@
1
1
  /* Int tel phonenumber lib */
2
2
 
3
- @import "intlTelInput.min.css";
3
+ @import "./intlTelInput.min.css";
4
4
 
5
5
  .iti input,
6
6
  .iti input[type="text"],
@@ -0,0 +1,6 @@
1
+ /* Entry point for tailwindcss-rails v4 (Tailwind CSS v4).
2
+ The host app includes it with: @import "../builds/tailwind/satis";
3
+ Imported into the components layer so utility classes still override component styles, as they did in v3 */
4
+ @import "../../stylesheets/satis/application.css" layer(components);
5
+
6
+ @source "../../..";
@@ -1,34 +1,34 @@
1
1
  .sts-appearance-switcher {
2
2
  @apply w-8 h-8 bg-white rounded-full text-gray-400 hover:text-gray-500 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-primary-500 dark:bg-gray-800 dark:border-gray-600 overflow-hidden relative;
3
3
  text-align: center;
4
+ }
4
5
 
5
- &__theme {
6
- @apply absolute;
6
+ .sts-appearance-switcher__theme {
7
+ @apply absolute;
8
+ }
7
9
 
8
- &_light {
9
- top: 5px;
10
- left: 7px;
11
- }
10
+ .sts-appearance-switcher__theme_light {
11
+ top: 5px;
12
+ left: 7px;
13
+ }
12
14
 
13
- &_dark {
14
- top: 4px;
15
- left: 8px;
16
- }
17
- }
15
+ .sts-appearance-switcher__theme_dark {
16
+ top: 4px;
17
+ left: 8px;
18
+ }
18
19
 
19
- &__icon {
20
- font-size: larger;
20
+ .sts-appearance-switcher__icon {
21
+ font-size: larger;
22
+ }
21
23
 
22
- &_light {
23
- @apply text-yellow-500;
24
- }
24
+ .sts-appearance-switcher__icon_light {
25
+ @apply text-yellow-500;
26
+ }
25
27
 
26
- &_dark {
27
- @apply text-indigo-600;
28
- }
29
- }
28
+ .sts-appearance-switcher__icon_dark {
29
+ @apply text-indigo-600;
30
+ }
30
31
 
31
- &__label {
32
- @apply sr-only;
33
- }
32
+ .sts-appearance-switcher__label {
33
+ @apply sr-only;
34
34
  }
@@ -29,8 +29,8 @@
29
29
  }
30
30
 
31
31
  .attachments__attachment .attachments__filename {
32
- @apply hidden absolute bottom-0 left-0 right-0 bg-black bg-opacity-70 text-white p-1.5 text-center text-xs;
33
- @apply dark:bg-gray-900 dark:bg-opacity-90;
32
+ @apply hidden absolute bottom-0 left-0 right-0 bg-black/70 text-white p-1.5 text-center text-xs;
33
+ @apply dark:bg-gray-900/90;
34
34
  }
35
35
 
36
36
  .attachments__attachment:hover .attachments__filename {
@@ -38,8 +38,8 @@
38
38
  }
39
39
 
40
40
  .preview-text {
41
- @apply absolute top-1/2 left-1/2 transform -translate-x-1/2 -translate-y-1/2 bg-white bg-opacity-70 p-2.5 rounded text-sm text-gray-800;
42
- @apply dark:bg-gray-800 dark:bg-opacity-70 dark:text-gray-200;
41
+ @apply absolute top-1/2 left-1/2 transform -translate-x-1/2 -translate-y-1/2 bg-white/70 p-2.5 rounded text-sm text-gray-800;
42
+ @apply dark:bg-gray-800/70 dark:text-gray-200;
43
43
  }
44
44
 
45
45
  @media (max-width: 640px) {
@@ -136,6 +136,6 @@
136
136
  @apply hover:border-white;
137
137
  }
138
138
  .attachments__group .attachment-upload.upload-btn.attachments__attachment.dragging {
139
- @apply dark:bg-gray-700 dark:bg-opacity-75 bg-gray-200 bg-opacity-50 dark:text-black text-white;
139
+ @apply dark:bg-gray-700/75 bg-gray-200/50 dark:text-black text-white;
140
140
  transition: all 0.3s ease;
141
141
  }
@@ -2,18 +2,18 @@
2
2
  @apply bg-white border-b border-gray-200 flex mb-4 sm:rounded-lg sm:shadow dark:text-gray-300 dark:bg-gray-800 dark:border-gray-700;
3
3
 
4
4
  height: 40px;
5
+ }
5
6
 
6
- &__list {
7
- @apply max-w-screen-xl w-full mx-auto px-4 flex space-x-4 sm:px-6 lg:px-8;
7
+ .sts-breadcrumbs__list {
8
+ @apply max-w-screen-xl w-full mx-auto px-4 flex space-x-4 sm:px-6 lg:px-8;
8
9
 
9
- margin-left: 0;
10
- }
10
+ margin-left: 0;
11
+ }
11
12
 
12
- &__link {
13
- @apply ml-4 text-sm font-normal text-gray-400 hover:text-gray-500 dark:text-gray-400 dark:hover:text-gray-300;
13
+ .sts-breadcrumbs__link {
14
+ @apply ml-4 text-sm font-normal text-gray-400 hover:text-gray-500 dark:text-gray-400 dark:hover:text-gray-300;
14
15
 
15
- svg {
16
- margin-right: 0.5rem;
17
- }
16
+ svg {
17
+ margin-right: 0.5rem;
18
18
  }
19
19
  }
@@ -1,6 +1,6 @@
1
1
  li.flex
2
2
  .flex.items-center
3
- svg.flex-shrink-0.w-6.h-full.text-gray-200.dark:text-gray-700 aria-hidden="true" fill="currentColor" preserveaspectratio="none" viewbox=("0 0 24 44") xmlns="http://www.w3.org/2000/svg"
3
+ svg.shrink-0.w-6.h-full.text-gray-200.dark:text-gray-700 aria-hidden="true" fill="currentColor" preserveaspectratio="none" viewbox=("0 0 24 44") xmlns="http://www.w3.org/2000/svg"
4
4
  path d=("M.293 0l22 22-22 22h1.414l22-22-22-22H.293z") /
5
5
  - if path
6
6
  a.sts-breadcrumbs__link href=path
@@ -24,7 +24,7 @@
24
24
  | Month view
25
25
  svg.-mr-1.h-5.w-5.text-gray-400[viewbox="0 0 20 20" fill="currentColor" aria-hidden="true"]
26
26
  path[fill-rule="evenodd" d="M5.23 7.21a.75.75 0 011.06.02L10 11.168l3.71-3.938a.75.75 0 111.08 1.04l-4.25 4.5a.75.75 0 01-1.08 0l-4.25-4.5a.75.75 0 01.02-1.06z" clip-rule="evenodd"]
27
- .absolute.right-0.z-10.mt-3.w-36.origin-top-right.overflow-hidden.rounded-md.bg-white.shadow-lg.ring-1.ring-black.ring-opacity-5.focus:outline-none[role="menu" aria-orientation="vertical" aria-labelledby="menu-button" tabindex="-1"]
27
+ .absolute.right-0.z-10.mt-3.w-36.origin-top-right.overflow-hidden.rounded-md.bg-white.shadow-lg.ring-1.ring-black/5.focus:outline-none[role="menu" aria-orientation="vertical" aria-labelledby="menu-button" tabindex="-1"]
28
28
  .py-1[role="none"]
29
29
  a#menu-item-0.text-gray-700.block.px-4.py-2.text-sm[href="#" role="menuitem" tabindex="-1"]
30
30
  | Day view
@@ -43,7 +43,7 @@
43
43
  | Open menu
44
44
  svg.h-5.w-5[viewbox="0 0 20 20" fill="currentColor" aria-hidden="true"]
45
45
  path[d="M3 10a1.5 1.5 0 113 0 1.5 1.5 0 01-3 0zM8.5 10a1.5 1.5 0 113 0 1.5 1.5 0 01-3 0zM15.5 8.5a1.5 1.5 0 100 3 1.5 1.5 0 000-3z"]
46
- .absolute.right-0.z-10.mt-3.w-36.origin-top-right.divide-y.divide-gray-100.overflow-hidden.rounded-md.bg-white.shadow-lg.ring-1.ring-black.ring-opacity-5.focus:outline-none[role="menu" aria-orientation="vertical" aria-labelledby="menu-0-button" tabindex="-1"]
46
+ .absolute.right-0.z-10.mt-3.w-36.origin-top-right.divide-y.divide-gray-100.overflow-hidden.rounded-md.bg-white.shadow-lg.ring-1.ring-black/5.focus:outline-none[role="menu" aria-orientation="vertical" aria-labelledby="menu-0-button" tabindex="-1"]
47
47
  .py-1[role="none"]
48
48
  a#menu-0-item-0.text-gray-700.block.px-4.py-2.text-sm[href="#" role="menuitem" tabindex="-1"]
49
49
  | Create event
@@ -59,7 +59,7 @@
59
59
  | Month view
60
60
  a#menu-0-item-5.text-gray-700.block.px-4.py-2.text-sm[href="#" role="menuitem" tabindex="-1"]
61
61
  | Year view
62
- .shadow.ring-1.ring-black.ring-opacity-5.lg:flex.lg:flex-auto.lg:flex-col
62
+ .shadow.ring-1.ring-black/5.lg:flex.lg:flex-auto.lg:flex-col
63
63
  .grid.grid-cols-7.gap-px.border-b.border-gray-300.bg-gray-200.text-center.text-xs.font-semibold.leading-6.text-gray-700.lg:flex-none
64
64
  .flex.justify-center.bg-white.py-2
65
65
  span
@@ -495,7 +495,7 @@
495
495
  span.sr-only
496
496
  | 0 events
497
497
  .px-4.py-10.sm:px-6.lg:hidden
498
- ol.divide-y.divide-gray-100.overflow-hidden.rounded-lg.bg-white.text-sm.shadow.ring-1.ring-black.ring-opacity-5
498
+ ol.divide-y.divide-gray-100.overflow-hidden.rounded-lg.bg-white.text-sm.shadow.ring-1.ring-black/5
499
499
  li.group.flex.p-4.pr-6.focus-within:bg-gray-50.hover:bg-gray-50
500
500
  .flex-auto
501
501
  p.font-semibold.text-gray-900
@@ -1,27 +1,27 @@
1
1
  .sts-card {
2
2
  @apply bg-white h-full sm:rounded-lg sm:shadow dark:bg-gray-800 overflow-hidden;
3
3
 
4
- &__header {
5
- @apply px-4 py-5 sm:px-6 dark:bg-gray-900 bg-white dark:border-gray-700 dark:text-gray-300;
4
+ &[data-satis-card-collapsible-value="true"] .sts-card__header {
5
+ @apply cursor-pointer select-none;
6
6
  }
7
7
 
8
- &__header--compact {
9
- @apply px-3 py-3 sm:px-4;
8
+ a.tab:not(.selected) {
9
+ @apply dark:text-gray-300;
10
10
  }
11
+ }
11
12
 
12
- &[data-satis-card-collapsible-value="true"] .sts-card__header {
13
- @apply cursor-pointer select-none;
14
- }
13
+ .sts-card__header {
14
+ @apply px-4 py-5 sm:px-6 dark:bg-gray-900 bg-white dark:border-gray-700 dark:text-gray-300;
15
+ }
15
16
 
16
- &__tabs {
17
- @apply bg-white px-4 border-b border-gray-200 sm:px-5 bg-white dark:bg-gray-900 dark:border-gray-700 dark:text-gray-300;
17
+ .sts-card__header--compact {
18
+ @apply px-3 py-3 sm:px-4;
19
+ }
18
20
 
19
- a:first {
20
- @apply ml-4;
21
- }
22
- }
21
+ .sts-card__tabs {
22
+ @apply bg-white px-4 border-b border-gray-200 sm:px-5 bg-white dark:bg-gray-900 dark:border-gray-700 dark:text-gray-300;
23
23
 
24
- a.tab:not(.selected) {
25
- @apply dark:text-gray-300;
24
+ a:first {
25
+ @apply ml-4;
26
26
  }
27
27
  }
@@ -3,7 +3,7 @@
3
3
  .sts-card__header class=header_classes data-action="#{collapsible ? 'click->satis-card#toggle' : ''}"
4
4
  .-ml-4.-mt-4.flex.justify-between.items-center.flex-wrap.sm:flex-nowrap
5
5
  - if icon
6
- .ml-4.mt-4.flex-shrink-0.text-primary-600.dark:text-gray-300
6
+ .ml-4.mt-4.shrink-0.text-primary-600.dark:text-gray-300
7
7
  i class=icon
8
8
  .ml-4.mt-4.flex-1
9
9
  h3 class=title_classes
@@ -13,7 +13,7 @@
13
13
  = description
14
14
 
15
15
  - if actions.present? || initial_actions.present?
16
- .ml-4.mt-4.flex-shrink-0 data-satis-card-target="actions"
16
+ .ml-4.mt-4.shrink-0 data-satis-card-target="actions"
17
17
  .grid.grid-flow-row.gap-1.sm:grid-flow-col
18
18
  - initial_actions.each do |action|
19
19
  = action
@@ -21,12 +21,12 @@
21
21
  = action
22
22
 
23
23
  - if collapsible
24
- .ml-4.mt-4.flex-shrink-0
24
+ .ml-4.mt-4.shrink-0
25
25
  button.text-gray-400.hover:text-gray-600.dark:hover:text-gray-200.transition-transform.duration-200 type="button" data-satis-card-target="collapseIcon"
26
26
  i.fas.fa-chevron-down
27
27
 
28
28
  - if menu
29
- .ml-4.mt-2.flex-shrink-0
29
+ .ml-4.mt-2.shrink-0
30
30
  = render(Satis::Menu::Component.new(menu))
31
31
 
32
32
  div data-satis-card-target="body"
@@ -1,6 +1,6 @@
1
- @import 'pickr/classic.min.css';
2
- @import 'pickr/monolith.min.css';
3
- @import 'pickr/nano.min.css';
1
+ @import './pickr/classic.min.css';
2
+ @import './pickr/monolith.min.css';
3
+ @import './pickr/nano.min.css';
4
4
 
5
5
  /*Custom form field style*/
6
6
  form .field .pickr {
@@ -11,7 +11,7 @@ div.satis-date-time-picker data-controller="satis-date-time-picker" data-satis-d
11
11
  button type="button" class="transition ease-in-out duration-100 inline-flex cursor-pointer hover:bg-gray-200 rounded-full" data-action="satis-date-time-picker#previousMonth"
12
12
  i.text-gray-500.inline-flex.px-1.py-1 class=Satis.config.icons[:previous_month]
13
13
 
14
- .flex.items-center.justify-center.gap-1.text-center.flex-grow
14
+ .flex.items-center.justify-center.gap-1.text-center.grow
15
15
  span.text-lg.font-bold.text-gray-800.dark:text-gray-200 data-satis-date-time-picker-target="month"
16
16
  div.relative.flex.items-center
17
17
  select.appearance-none.border-none.bg-transparent.text-lg.font-normal.text-gray-600.dark:text-gray-200.focus:outline-none.focus:ring-0.overflow-y-auto.max-h-12 data-satis-date-time-picker-target="select" data-action="change->satis-date-time-picker#selectYear"
@@ -32,19 +32,19 @@ div.satis-date-time-picker data-controller="satis-date-time-picker" data-satis-d
32
32
 
33
33
  - if time_picker
34
34
  .flex.items-center.py-2.space-x-2
35
- label.flex-grow.text-sm.text-gray-500 Time
35
+ label.grow.text-sm.text-gray-500 Time
36
36
  .flex.items-center.space-x-2
37
- .bg-gray-100.rounded-md.w-full.text-right.flex.items-center.border.border-gray-100.focus:border-primary-500.focus:ring-2.focus:ring-primary-500.focus:outline-none.focus:ring-opacity-50 style=("caret-color: transparent;")
38
- input.text-center.w-8.border-transparent.bg-transparent.p-0.h-6.text-sm.transition.duration-100.ease-in-out.border.border-transparent.focus:border-primary-500.focus:ring-2.focus:ring-primary-500.focus:outline-none.focus:ring-opacity-50.rounded inputmode="numeric" type="text" data-satis-date-time-picker-target="hours" data-action="satis-date-time-picker#changeHours keypress->satis-date-time-picker#keyPress" maxlength="2"
37
+ .bg-gray-100.rounded-md.w-full.text-right.flex.items-center.border.border-gray-100.focus:border-primary-500.focus:ring-2.focus:ring-primary-500.focus:outline-none style=("caret-color: transparent;")
38
+ input.text-center.w-8.border-transparent.bg-transparent.p-0.h-6.text-sm.transition.duration-100.ease-in-out.border.border-transparent.focus:border-primary-500.focus:ring-2.focus:ring-primary-500.focus:outline-none.rounded inputmode="numeric" type="text" data-satis-date-time-picker-target="hours" data-action="satis-date-time-picker#changeHours keypress->satis-date-time-picker#keyPress" maxlength="2"
39
39
  span contenteditable="false"
40
40
  | :
41
- input.text-center.w-8.border-transparent.bg-transparent.p-0.h-6.text-sm.transition.duration-100.ease-in-out.border.border-transparent.focus:border-primary-500.focus:ring-2.focus:ring-primary-500.focus:outline-none.focus:ring-opacity-50.rounded inputmode="numeric" type="text" data-satis-date-time-picker-target="minutes" data-action="satis-date-time-picker#changeMinutes keypress->satis-date-time-picker#keyPress" maxlength="2"
42
- /span.relative.inline-flex.flex-shrink-0.transition.duration-200.ease-in-out.bg-gray-100.border.border-transparent.rounded.cursor-pointer.focus:border-primary-500.focus:ring-2.focus:ring-primary-500.focus:outline-none.focus:ring-opacity-50 aria-checked="false" role="checkbox" tabindex="0"
41
+ input.text-center.w-8.border-transparent.bg-transparent.p-0.h-6.text-sm.transition.duration-100.ease-in-out.border.border-transparent.focus:border-primary-500.focus:ring-2.focus:ring-primary-500.focus:outline-none.rounded inputmode="numeric" type="text" data-satis-date-time-picker-target="minutes" data-action="satis-date-time-picker#changeMinutes keypress->satis-date-time-picker#keyPress" maxlength="2"
42
+ /span.relative.inline-flex.shrink-0.transition.duration-200.ease-in-out.bg-gray-100.border.border-transparent.rounded.cursor-pointer.focus:border-primary-500.focus:ring-2.focus:ring-primary-500.focus:outline-none aria-checked="false" role="checkbox" tabindex="0"
43
43
  input type="hidden" value="AM" /
44
44
  span.flex.items-center.justify-center.w-6.h-6.text-xs.text-gray-500.rounded-sm aria-hidden="true" AM
45
45
  span.flex.items-center.justify-center.w-6.h-6.text-xs.text-gray-500.rounded-sm aria-hidden="true" PM
46
46
  span.absolute.flex.items-center.justify-center.w-6.h-6.text-xs.text-gray-800.transition.duration-200.ease-in-out.transform.translate-x-0.bg-white.rounded.shadow aria-hidden="true" AM
47
- /a.text-primary-600.text-sm.uppercase.font-semibold.transition.duration-100.ease-in-out.border.border-transparent.focus:border-primary-500.focus:ring-2.focus:ring-primary-500.focus:outline-none.focus:ring-opacity-50.rounded.cursor-pointer href="#" Ok
47
+ /a.text-primary-600.text-sm.uppercase.font-semibold.transition.duration-100.ease-in-out.border.border-transparent.focus:border-primary-500.focus:ring-2.focus:ring-primary-500.focus:outline-none.rounded.cursor-pointer href="#" Ok
48
48
 
49
49
  template data-satis-date-time-picker-target="emtpyTemplate"
50
50
  .text-center.border.p-1.border-transparent.text-sm
@@ -1,6 +1,6 @@
1
1
  = turbo_frame_tag "dialog" do
2
2
  .relative.z-50 data-controller="satis-dialog" aria-labelledby="modal-title" role="dialog" aria-modal="true"
3
- .fixed.inset-0.bg-gray-500.bg-opacity-75.transition-opacity
3
+ .fixed.inset-0.bg-gray-500/75.transition-opacity
4
4
  .fixed.inset-0.z-50.w-screen.overflow-y-auto
5
5
  .flex.min-h-full.items-end.justify-center.p-4.text-center.sm:items-center.sm:p-0
6
6
  .relative.transform.overflow-hidden.rounded-lg.bg-white.px-4.pb-4.pt-5.text-left.shadow-xl.transition-all.sm:my-8.sm:w-full.sm:max-w-lg.sm:p-6
@@ -11,7 +11,7 @@
11
11
  .fas.fa-xmark.h-6.w-6
12
12
  .sm:flex.sm:items-start
13
13
  - if icon?
14
- .mx-auto.flex.h-12.w-12.flex-shrink-0.items-center.justify-center.sm:mx-0.sm:h-10.sm:w-10
14
+ .mx-auto.flex.h-12.w-12.shrink-0.items-center.justify-center.sm:mx-0.sm:h-10.sm:w-10
15
15
  i.h-6.w-6.-mt-1 class=icon
16
16
  .mt-3.text-center.sm:mt-0.sm:text-left class=(icon? ? "sm:ml-4" : "")
17
17
  h3#modal-title.text-base.font-semibold.leading-6.text-gray-900
@@ -39,7 +39,7 @@
39
39
  }
40
40
 
41
41
  .page_body .satis-dropdown .sts-dropdown-results{
42
- @apply bg-white divide-gray-900 divide-opacity-25 shadow-gray-300 shadow-lg text-gray-900 text-opacity-75 dark:bg-gray-900 dark:shadow-gray-700 dark:shadow-lg dark:bg-opacity-75 dark:divide-gray-50 dark:divide-opacity-25 dark:text-gray-300;
42
+ @apply bg-white divide-gray-900/25 shadow-gray-300 shadow-lg text-gray-900/75 dark:bg-gray-900/75 dark:shadow-gray-700 dark:shadow-lg dark:divide-gray-50/25 dark:text-gray-300;
43
43
  }
44
44
 
45
45
  .page_body .satis-dropdown .sts-dropdown .sts-dropdown-input{
@@ -47,12 +47,12 @@
47
47
  }
48
48
 
49
49
  .page_body .satis-dropdown .sts-dropdown-results-items{
50
- @apply dark:border-gray-700 border-b divide-gray-200 divide-opacity-25 hover:bg-gray-200 hover:shadow dark:hover:text-white dark:bg-opacity-75 dark:hover:bg-gray-800 dark:bg-gray-900 dark:divide-gray-100 dark:divide-opacity-5;
50
+ @apply dark:border-gray-700 border-b divide-gray-200/25 hover:bg-gray-200 hover:shadow dark:hover:text-white dark:hover:bg-gray-800 dark:bg-gray-900/75 dark:divide-gray-100/5;
51
51
  }
52
52
 
53
53
 
54
54
  .changelog-menu{
55
- @apply dark:bg-gray-900 dark:border-gray-100 dark:shadow-gray-800 divide-y divide-gray-100 dark:divide-gray-800 right-0 z-10 mx-1 w-1/3 rounded-md bg-white text-gray-500 dark:text-gray-100 shadow-lg ring-1 ring-black ring-opacity-5 overflow-y-auto max-h-screen;
55
+ @apply dark:bg-gray-900 dark:border-gray-100 dark:shadow-gray-800 divide-y divide-gray-100 dark:divide-gray-800 right-0 z-10 mx-1 w-1/3 rounded-md bg-white text-gray-500 dark:text-gray-100 shadow-lg ring-1 ring-black/5 overflow-y-auto max-h-screen;
56
56
  }
57
57
 
58
58
  .changelog-menu .changelog-menu-item{
@@ -61,7 +61,7 @@
61
61
 
62
62
  .topbar .satis-dropdown .sts-dropdown-results{
63
63
  ;
64
- @apply bg-white divide-gray-900 divide-opacity-25 shadow-gray-300 shadow-lg text-gray-900 text-opacity-75 dark:bg-gray-900 dark:shadow-gray-700 dark:shadow-lg dark:bg-opacity-75 dark:divide-gray-50 dark:divide-opacity-25 dark:text-gray-300;
64
+ @apply bg-white divide-gray-900/25 shadow-gray-300 shadow-lg text-gray-900/75 dark:bg-gray-900/75 dark:shadow-gray-700 dark:shadow-lg dark:divide-gray-50/25 dark:text-gray-300;
65
65
  }
66
66
 
67
67
  .topbar .satis-dropdown .sts-dropdown .sts-dropdown-input{
@@ -69,7 +69,7 @@
69
69
  }
70
70
 
71
71
  .topbar .satis-dropdown .sts-dropdown-results-items{
72
- @apply dark:border-gray-700 border-b divide-gray-200 divide-opacity-25 hover:bg-gray-200 hover:shadow dark:hover:text-white dark:bg-opacity-75 dark:hover:bg-gray-800 dark:bg-gray-900 dark:divide-gray-100 dark:divide-opacity-5;
72
+ @apply dark:border-gray-700 border-b divide-gray-200/25 hover:bg-gray-200 hover:shadow dark:hover:text-white dark:hover:bg-gray-800 dark:bg-gray-900/75 dark:divide-gray-100/5;
73
73
  }
74
74
 
75
75
 
@@ -3,7 +3,7 @@
3
3
  }
4
4
 
5
5
  .cm-editor{
6
- @apply dark:bg-gray-900 dark:border dark:border-opacity-25 dark:text-white dark:border-gray-50 ;
6
+ @apply dark:bg-gray-900 dark:border dark:text-white dark:border-gray-50/25;
7
7
  }
8
8
 
9
9
  .cm-editor .cm-gutter{
@@ -4,16 +4,14 @@
4
4
  .bg-yellow-500
5
5
  */
6
6
 
7
- .sts-flash-messages {
8
- &__message_container {
9
- @apply inset-x-0 pb-2 sm:pb-5;
10
- }
7
+ .sts-flash-messages__message_container {
8
+ @apply inset-x-0 pb-2 sm:pb-5;
9
+ }
11
10
 
12
- &__message {
13
- @apply ml-3 font-medium text-white truncate;
11
+ .sts-flash-messages__message {
12
+ @apply ml-3 font-medium text-white truncate;
14
13
 
15
- i {
16
- margin-right: 0.5rem;
17
- }
14
+ i {
15
+ margin-right: 0.5rem;
18
16
  }
19
17
  }
@@ -1,65 +1,63 @@
1
- .sts-input {
2
- &__input-container {
3
- @apply flex border rounded h-12 text-gray-800 dark:text-gray-300 border-gray-300 dark:bg-gray-800 dark:border-gray-900 overflow-hidden;
4
- }
1
+ .sts-input__input-container {
2
+ @apply flex border rounded h-12 text-gray-800 dark:text-gray-300 border-gray-300 dark:bg-gray-800 dark:border-gray-900 overflow-hidden;
3
+ }
5
4
 
6
- &__label {
5
+ .sts-input__label {
7
6
 
8
- }
7
+ }
9
8
 
10
- &__input-container {
11
- &.is-invalid {
12
- @apply border-red-300 text-red-900 placeholder-red-300 focus:outline-none focus:ring-red-500 focus:border-red-500;
13
- }
9
+ .sts-input__input-container {
10
+ &.is-invalid {
11
+ @apply border-red-300 text-red-900 placeholder-red-300 focus:outline-none focus:ring-red-500 focus:border-red-500;
14
12
  }
13
+ }
15
14
 
16
- &__input {
17
- @apply flex-1 min-w-0 block w-full border-none py-2 px-3 bg-white dark:bg-gray-900;
15
+ .sts-input__input {
16
+ @apply flex-1 min-w-0 block w-full border-none py-2 px-3 bg-white dark:bg-gray-900;
18
17
 
19
- &:focus {
20
- box-shadow: none;
21
- }
18
+ &:focus {
19
+ box-shadow: none;
20
+ }
22
21
 
23
- &.white {
24
- background: rgb(255, 255, 255);
22
+ &.white {
23
+ background: rgb(255, 255, 255);
25
24
 
26
- .dark & {
27
- background: rgba(255, 255, 255, 0.1);
28
- }
25
+ .dark & {
26
+ background: rgba(255, 255, 255, 0.1);
29
27
  }
30
28
  }
29
+ }
31
30
 
32
- &__element {
33
- @apply inline-flex items-center py-2 px-3;
31
+ .sts-input__element {
32
+ @apply inline-flex items-center py-2 px-3;
34
33
 
35
- &.colored {
36
- background: rgba(1, 1, 1, 0.1);
34
+ &.colored {
35
+ background: rgba(1, 1, 1, 0.1);
37
36
 
38
- .dark & {
39
- background: rgba(255, 255, 255, 0.1);
40
- }
37
+ .dark & {
38
+ background: rgba(255, 255, 255, 0.1);
41
39
  }
40
+ }
42
41
 
43
- &.white {
44
- background: rgb(255, 255, 255);
42
+ &.white {
43
+ background: rgb(255, 255, 255);
45
44
 
46
- .dark & {
47
- background: rgba(255, 255, 255, 0.1);
48
- }
45
+ .dark & {
46
+ background: rgba(255, 255, 255, 0.1);
49
47
  }
48
+ }
50
49
 
51
- input {
52
- @apply -ml-3 -mr-3 -mt-2 -mb-2 w-full;
50
+ input {
51
+ @apply -ml-3 -mr-3 -mt-2 -mb-2 w-full;
53
52
 
54
- &:focus {
55
- box-shadow: none;
56
- }
53
+ &:focus {
54
+ box-shadow: none;
57
55
  }
56
+ }
58
57
 
59
- * {
60
- @apply border-none;
58
+ * {
59
+ @apply border-none;
61
60
 
62
- background-color: transparent;
63
- }
61
+ background-color: transparent;
64
62
  }
65
63
  }
@@ -1,9 +1,7 @@
1
- .sts-menu {
2
- &__button {
3
- @apply h-8 w-8 inline-flex items-center justify-center rounded-full focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-primary-500 dark:text-gray-500;
4
- }
1
+ .sts-menu__button {
2
+ @apply h-8 w-8 inline-flex items-center justify-center rounded-full focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-primary-500 dark:text-gray-500;
3
+ }
5
4
 
6
- &__items {
7
- @apply z-10 bg-white dark:bg-gray-400 border dark:border-gray-800 rounded-md shadow-lg min-w-max;
8
- }
5
+ .sts-menu__items {
6
+ @apply z-10 bg-white dark:bg-gray-400 border dark:border-gray-800 rounded-md shadow-lg min-w-max;
9
7
  }
@@ -2,7 +2,7 @@ li.rounded-sm.px-3.py-1.hover:bg-gray-100.flex.items-center.dark:bg-gray-900.dar
2
2
  a.cursor-pointer.py-1.w-full.text-left.flex.items-center.outline-none.focus:outline-none href=item.link *item.link_attributes
3
3
  - if item.type == :custom
4
4
  = render(partial: item.link_attributes[:data][:path], locals: item.link_attributes[:data][:parameters])
5
- span.pr-1.flex-shrink-0.w-6.text-gray-500.dark:text-gray-300
5
+ span.pr-1.shrink-0.w-6.text-gray-500.dark:text-gray-300
6
6
  - if item.icon.present?
7
7
  - if item.icon.respond_to?(:keys)
8
8
  span class=item.icon.keys.first
@@ -13,7 +13,7 @@ li.rounded-sm.px-3.py-1.hover:bg-gray-100.flex.items-center.dark:bg-gray-900.dar
13
13
  span.pr-1.flex-1.text-gray-500.dark:text-gray-300
14
14
  - unless item.type == :custom
15
15
  = item.label
16
- span.pr-1.flex-shrink-0.w-6
16
+ span.pr-1.shrink-0.w-6
17
17
  - if item.type == :toggle
18
18
  i.fal.fa-check.hidden data-satis-menu-target="toggle" id="#{item.id}"
19
19
  - if item.type == :group
@@ -13,7 +13,7 @@
13
13
  z-index: 2;
14
14
  }
15
15
  .ui-flash-container{
16
- @apply dark:bg-emerald-500 dark:bg-opacity-25 dark:text-gray-300 dark:shadow-md dark:border-t-0;
16
+ @apply dark:bg-emerald-500/25 dark:text-gray-300 dark:shadow-md dark:border-t-0;
17
17
  margin-top: -7px;
18
18
  }
19
19
 
@@ -17,23 +17,26 @@
17
17
  &.active > [data-satis-sidebar-menu-item-target="link"] [data-satis-sidebar-menu-item-target="indicator"] {
18
18
  @apply rotate-90;
19
19
  }
20
+ }
20
21
 
21
- &__link {
22
- @apply text-gray-800 dark:text-gray-300 hover:bg-gray-50 dark:text-gray-100 dark:hover:bg-gray-700 hover:text-gray-900 w-full flex items-center pl-2 pr-1 py-2 text-left text-sm font-medium rounded-md focus:outline-none focus:ring-2 focus:ring-primary-500;
23
- }
22
+ .sts-sidebar-menu-item__link {
23
+ @apply text-gray-800 hover:bg-gray-50 dark:text-gray-100 dark:hover:bg-gray-700 hover:text-gray-900 w-full flex items-center pl-2 pr-1 py-2 text-left text-sm font-medium rounded-md focus:outline-none focus:ring-2 focus:ring-primary-500;
24
+ }
24
25
 
25
- &__icon {
26
- @apply mr-3 flex-shrink-0 h-6 w-6 text-gray-400 dark:text-gray-200 group-hover:text-gray-500;
27
- }
28
- &__no-icon {
29
- @apply mr-3 flex-shrink-0 h-6;
30
- }
31
- &__label {
32
- @apply flex-1 text-gray-700 dark:text-gray-300;
33
- }
34
- &__menu-icon {
35
- @apply text-gray-300 ml-3 flex-shrink-0 h-5 w-5 transform group-hover:text-gray-400 transition-colors ease-in-out duration-150;
36
- }
26
+ .sts-sidebar-menu-item__icon {
27
+ @apply mr-3 shrink-0 h-6 w-6 text-gray-400 dark:text-gray-200 group-hover:text-gray-500;
28
+ }
29
+
30
+ .sts-sidebar-menu-item__no-icon {
31
+ @apply mr-3 shrink-0 h-6;
32
+ }
33
+
34
+ .sts-sidebar-menu-item__label {
35
+ @apply flex-1 text-gray-700 dark:text-gray-300;
36
+ }
37
+
38
+ .sts-sidebar-menu-item__menu-icon {
39
+ @apply text-gray-300 ml-3 shrink-0 h-5 w-5 transform group-hover:text-gray-400 transition-colors ease-in-out duration-150;
37
40
  }
38
41
 
39
42
  /* submenu-label always hidden in expanded sidebar */
@@ -1,15 +1,15 @@
1
1
  .space-y-1 class="#{item.level >= 1 ? 'pl-4' : ''}"
2
2
  a.text-gray-600.hover:bg-gray-50.hover:text-gray-900.group.flex.items-center.px-2.py-2.text-base.font-medium.rounded-md href=item.link *item.link_attributes
3
3
  - if item.icon
4
- i.fa-lg.text-gray-400.group-hover:text-gray-500.mr-4.flex-shrink-0.h-6.w-6 class=item.icon style="width: 20px;"
4
+ i.fa-lg.text-gray-400.group-hover:text-gray-500.mr-4.shrink-0.h-6.w-6 class=item.icon style="width: 20px;"
5
5
  - else
6
- i.mr-3.flex-shrink-0.h-6 style="width: 20px;"
6
+ i.mr-3.shrink-0.h-6 style="width: 20px;"
7
7
  span.flex-1
8
8
  = item.label
9
9
 
10
10
  /! Expanded: "text-gray-400 rotate-90", Collapsed: "text-gray-300"
11
11
  - if item.menu
12
- i.fal.fa-angle-right.text-gray-300.ml-3.flex-shrink-0.h-5.w-5.transform.group-hover:text-gray-400.transition-colors.ease-in-out.duration-150 style="width: 20px;"
12
+ i.fal.fa-angle-right.text-gray-300.ml-3.shrink-0.h-5.w-5.transform.group-hover:text-gray-400.transition-colors.ease-in-out.duration-150 style="width: 20px;"
13
13
 
14
14
  - if item.menu
15
15
  #sub-menu-1.space-y-1
@@ -2,7 +2,7 @@ div.satis-switch data-controller='satis-switch'
2
2
  - if options[:label] != false
3
3
  = form.custom_label(attribute, options[:label], data: { action: "click->satis-switch#toggle" })
4
4
  = form.hidden_field(attribute, options[:input_html].reverse_merge(value: @value ? "1" : "0", 'data-action' => 'change->satis-switch#update'))
5
- button.mt-3.mb-3.relative.inline-flex.flex-shrink-0.h-6.w-11.border-2.border-transparent.rounded-full.cursor-pointer.transition-colors.ease-in-out.duration-200.focus:outline-none.focus:ring-2.focus:ring-offset-2.focus:ring-primary-500.dark:focus:ring-primary-800.dark:bg-gray-700 aria-checked="false" role="switch" type="button" data-action="click->satis-switch#toggle" data-satis-switch-target="button" class="#{@value ? 'bg-primary-600' : 'bg-gray-200'}"
5
+ button.mt-3.mb-3.relative.inline-flex.shrink-0.h-6.w-11.border-2.border-transparent.rounded-full.cursor-pointer.transition-colors.ease-in-out.duration-200.focus:outline-none.focus:ring-2.focus:ring-offset-2.focus:ring-primary-500.dark:focus:ring-primary-800.dark:bg-gray-700 aria-checked="false" role="switch" type="button" data-action="click->satis-switch#toggle" data-satis-switch-target="button" class="#{@value ? 'bg-primary-600' : 'bg-gray-200'}"
6
6
  span.pointer-events-none.inline-block.h-5.w-5.rounded-full.bg-white.shadow.transform.ring-0.transition.ease-in-out.duration-200 aria-hidden="true" data-satis-switch-target="switch" class="#{@value ? 'translate-x-5' : 'translate-x-0' }"
7
7
  - if icon
8
8
  span.absolute.inset-0.h-full.w-full.flex.items-center.justify-center.transition-opacity aria-hidden="true" data-satis-switch-target="cross" class="#{@value ? 'opacity-0 ease-out duration-100' : 'opacity-100 ease-in duration-200' }"
@@ -1,11 +1,4 @@
1
1
  .sts-tabs {
2
- &__nav {
3
- @apply -mb-px flex space-x-4 overflow-x-auto ml-4;
4
-
5
- a:first {
6
- @apply text-primary-600;
7
- }
8
- }
9
2
 
10
3
  .tab {
11
4
  @apply border-transparent text-gray-500 hover:text-gray-700 hover:border-gray-300 whitespace-nowrap px-1 pb-4 border-b-2 font-medium text-sm border-transparent text-gray-500 hover:text-gray-700 hover:border-gray-300 cursor-pointer;
@@ -29,22 +22,18 @@
29
22
  @apply text-primary-600;
30
23
  }
31
24
 
32
- .sts-menu {
33
- &__button {
34
- span {
35
- @apply block;
36
- }
25
+ .sts-menu__button {
26
+ span {
27
+ @apply block;
37
28
  }
38
29
  }
39
30
  }
40
31
 
41
- .sts-menu {
42
- &__button {
43
- @apply h-0 w-0 pl-4;
32
+ .sts-menu__button {
33
+ @apply h-0 w-0 pl-4;
44
34
 
45
- span {
46
- @apply hidden;
47
- }
35
+ span {
36
+ @apply hidden;
48
37
  }
49
38
  }
50
39
 
@@ -70,3 +59,11 @@
70
59
  }
71
60
  }
72
61
  }
62
+
63
+ .sts-tabs__nav {
64
+ @apply -mb-px flex space-x-4 overflow-x-auto ml-4;
65
+
66
+ a:first {
67
+ @apply text-primary-600;
68
+ }
69
+ }
@@ -5,7 +5,7 @@
5
5
  - tabs.each do |tab|
6
6
  option selected=tab.selected? = ct(".#{tab.name}", scope: :tab)
7
7
  .hidden.sm:block
8
- .border-b.border-gray-200.bg-white.dark:border-opacity-25.dark:bg-gray-900
8
+ .border-b.border-gray-200.bg-white.dark:border-gray-200/25.dark:bg-gray-900
9
9
  nav.sts-tabs__nav aria-label="Tabs"
10
10
  - tabs.each.with_index do |tab, index|
11
11
  - id = tab.id.present? ? tab.id : tab.name
@@ -7,6 +7,8 @@ module Satis
7
7
  desc 'Configures tailwind.config.js and application.tailwindcss.css'
8
8
 
9
9
  def add_content_to_tailwind_config
10
+ return unless File.exist?(File.join(destination_root, "config/tailwind.config.js"))
11
+
10
12
  inject_into_file "config/tailwind.config.js", before: "],\n theme: {" do
11
13
  " // Satis content\n" +
12
14
  %w[/app/views/**/* /app/helpers/**/* /app/controllers/**/* /app/components/**/* /app/javascript/**/*.js /app/assets/**/*.css].map { |path| " \"#{Satis::Engine.root}#{path}\"" }.join(",\n") +
@@ -15,6 +17,8 @@ module Satis
15
17
  end
16
18
 
17
19
  def add_content_application_tailwind_css
20
+ return unless File.exist?(File.join(destination_root, "app/assets/stylesheets/application.tailwind.css"))
21
+
18
22
  inject_into_file "app/assets/stylesheets/application.tailwind.css", before: "@tailwind base;" do
19
23
  "@import '#{Satis::Engine.root}/app/assets/stylesheets/satis/application.css';\n"
20
24
  end
@@ -26,7 +26,7 @@ module Satis
26
26
  #
27
27
  def ct(key = nil, **options)
28
28
  key = "#{full_i18n_scope(options).join('.')}#{key}" if key.start_with?('.')
29
- original_view_context.controller.t(key, **options)
29
+ original_view_context.controller.t(key, **options, default: options[:default] || key.to_s.split(".").last.humanize)
30
30
  end
31
31
 
32
32
  def full_i18n_scope(options = {})
data/lib/satis/version.rb CHANGED
@@ -1,3 +1,3 @@
1
1
  module Satis
2
- VERSION = "2.4.3"
2
+ VERSION = "2.5.0"
3
3
  end
@@ -7,7 +7,9 @@ namespace :satis do
7
7
  end
8
8
  end
9
9
 
10
- if Rake::Task.task_defined?("tailwindcss:build")
10
+ # tailwindcss-rails v4 picks up app/assets/tailwind/satis/engine.css itself (via tailwindcss:engines),
11
+ # so only hook in the v3 config generator when that task is absent.
12
+ if Rake::Task.task_defined?("tailwindcss:build") && !Rake::Task.task_defined?("tailwindcss:engines")
11
13
  Rake::Task["tailwindcss:build"].enhance(["satis:tailwindcss:config"])
12
14
  Rake::Task["tailwindcss:watch"].enhance(["satis:tailwindcss:config"])
13
15
  end
metadata CHANGED
@@ -1,14 +1,14 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: satis
3
3
  version: !ruby/object:Gem::Version
4
- version: 2.4.3
4
+ version: 2.5.0
5
5
  platform: ruby
6
6
  authors:
7
7
  - Tom de Grunt
8
8
  autorequire:
9
9
  bindir: bin
10
10
  cert_chain: []
11
- date: 2026-06-19 00:00:00.000000000 Z
11
+ date: 2026-10-16 00:00:00.000000000 Z
12
12
  dependencies:
13
13
  - !ruby/object:Gem::Dependency
14
14
  name: browser
@@ -189,6 +189,7 @@ files:
189
189
  - ".gitignore"
190
190
  - ".nvmrc"
191
191
  - ".rubocop.yml"
192
+ - ".shipkit.yml"
192
193
  - Gemfile
193
194
  - MIT-LICENSE
194
195
  - Procfile
@@ -744,6 +745,7 @@ files:
744
745
  - app/assets/stylesheets/satis/components/phone-number.css
745
746
  - app/assets/stylesheets/satis/components/tippyjs.css
746
747
  - app/assets/stylesheets/satis/components/trix.css
748
+ - app/assets/tailwind/satis/engine.css
747
749
  - app/components/satis/appearance_switcher/component.css
748
750
  - app/components/satis/appearance_switcher/component.html.slim
749
751
  - app/components/satis/appearance_switcher/component.rb