satis 2.1.35 → 2.1.36

Sign up to get free protection for your applications and to get access to all the features.
Files changed (12) hide show
  1. checksums.yaml +4 -4
  2. data/app/assets/stylesheets/satis/components/form.css +41 -26
  3. data/app/assets/stylesheets/satis/components/trix.css +9 -0
  4. data/app/components/satis/card/component.css +1 -5
  5. data/app/components/satis/editor/component.css +11 -0
  6. data/app/components/satis/page/component.css +10 -2
  7. data/app/components/satis/page/component.html.slim +2 -2
  8. data/app/components/satis/sidebar_menu_item/component.css +23 -2
  9. data/app/components/satis/switch/component.html.slim +1 -1
  10. data/app/components/satis/tabs/component.html.slim +1 -1
  11. data/lib/satis/version.rb +1 -1
  12. metadata +2 -2
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA256:
3
- metadata.gz: 52e68d85e36e1b8dbf4668f7552fede9500b2cff35b6681e166aaaca8906d3d3
4
- data.tar.gz: be4c108c1a2f1e980da0c6d283920c1423c9cbd60469b9b0cc13d837d950c8cb
3
+ metadata.gz: e57b3ca2bd2eb32edf6fe54e6debf993e024e2cfa2d7fad5700b64404032d4d0
4
+ data.tar.gz: a6a7c44464d82b470a7a3b840174c15cab9ae2b8f864aa4e99ca2ab27f66b6a1
5
5
  SHA512:
6
- metadata.gz: 4db5468b2bd3cbbb95277e73f659530275d25041fdc78cb9ba83aac247210e471fea72836e33a57fe77be88d83c9d08f5e26bc8cead2459b156ea80a68a58a7e
7
- data.tar.gz: 1c05aada8265e8ab772653a054560dc0224515a0d0a79fe54246e7ecbd523f50f8b732c70ece817edbcf4929683144b1377a558c4be14b5af598239003c45380
6
+ metadata.gz: 25d1da89ea7ffaf293e329cc048b7e6481edf66303ecde17ba0b707b16879e9553009a02d5227cdc2f591c37eddf4855f9e08c559e67f48848cda75afd307896
7
+ data.tar.gz: f7de5d36ddabde0f447d7ef812021ad4744f0724727eb21d7ce753973893f8edd36a03e5b287a94db7ccb6ff256a5e98c49db9d59ad040ce1c948c66c64eb78a
data/app/assets/stylesheets/satis/components/form.css CHANGED
@@ -1,25 +1,25 @@
1
1
  /* Allow buttons outside forms */
2
2
  .button {
3
- @apply mt-2 inline-flex items-center px-4 py-2 border border-gray-300 dark:border-gray-500 shadow-sm text-sm font-medium rounded-md text-gray-700 dark:text-gray-300 bg-white dark:bg-gray-800 hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-primary-500;
3
+ @apply mt-2 inline-flex items-center px-4 py-2 border border-gray-300 dark:border-gray-500 shadow-sm text-sm font-medium rounded-md text-gray-700 dark:text-gray-300 bg-white dark:bg-gray-800 hover:bg-gray-50 dark:hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-primary-500;
4
4
 
5
5
  &.primary {
6
- @apply inline-flex items-center px-4 py-2 border border-transparent text-sm font-medium rounded-md shadow-sm text-white bg-primary-600 hover:bg-primary-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-primary-500;
6
+ @apply inline-flex items-center px-4 py-2 border border-transparent dark:border-transparent text-sm font-medium rounded-md shadow-sm text-white bg-primary-600 hover:bg-primary-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-primary-500;
7
7
  }
8
8
 
9
9
  &.secondary {
10
- @apply inline-flex items-center px-4 py-2 border border-transparent text-sm font-medium rounded-md text-primary-700 bg-primary-200 hover:bg-primary-300 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-primary-500;
10
+ @apply inline-flex items-center px-4 py-2 border border-transparent dark:border-transparent text-sm font-medium rounded-md text-primary-700 bg-primary-200 hover:bg-primary-300 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-primary-500;
11
11
  }
12
12
 
13
13
  &.destructive {
14
- @apply inline-flex items-center px-4 py-2 border border-red-300 dark:border-red-500 text-sm font-medium rounded-md text-red-700 dark:text-red-500 bg-white dark:bg-gray-800 hover:bg-red-200 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-red-500;
14
+ @apply inline-flex items-center px-4 py-2 border border-red-300 dark:border-red-500 text-sm font-medium rounded-md text-red-700 dark:text-red-500 bg-white dark:bg-gray-800 hover:bg-red-200 dark:hover:bg-red-600 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-red-500;
15
15
  }
16
16
 
17
17
  &.warning {
18
- @apply inline-flex items-center px-4 py-2 border border-transparent text-sm font-medium rounded-md text-yellow-300 bg-yellow-100 hover:bg-yellow-200 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-yellow-500;
18
+ @apply inline-flex items-center px-4 py-2 border border-transparent dark:border-transparent text-sm font-medium rounded-md text-yellow-300 bg-yellow-100 hover:bg-yellow-200 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-yellow-500;
19
19
  }
20
20
 
21
21
  &.harmful {
22
- @apply inline-flex items-center px-4 py-2 border border-transparent text-sm font-semibold rounded-md bg-red-600 text-white shadow-sm hover:bg-red-500;
22
+ @apply inline-flex items-center px-4 py-2 border border-transparent dark:border-transparent text-sm font-semibold rounded-md bg-red-600 text-white shadow-sm hover:bg-red-500;
23
23
  }
24
24
  }
25
25
 
@@ -36,19 +36,19 @@ form {
36
36
 
37
37
  input.form-control,
38
38
  select.form-control {
39
- @apply rounded w-full py-2 px-3 h-12 text-gray-800 dark:text-gray-300 leading-tight border-gray-300 dark:bg-gray-900 dark:drop-shadow dark:border-none;
39
+ @apply rounded w-full py-2 px-3 h-12 text-gray-800 dark:text-gray-300 leading-tight border-gray-300 dark:border-gray-700 dark:bg-gray-900 dark:drop-shadow dark:border-none;
40
40
  }
41
41
 
42
42
  textarea.form-control {
43
- @apply rounded w-full py-2 px-3 text-gray-800 dark:text-gray-300 leading-tight border-gray-300 dark:bg-gray-900 dark:drop-shadow dark:border-none;
43
+ @apply rounded w-full py-2 px-3 text-gray-800 dark:text-gray-300 leading-tight border-gray-300 dark:border-gray-700 dark:bg-gray-900 dark:drop-shadow dark:border-none;
44
44
  }
45
45
 
46
46
  .form-select {
47
- @apply rounded w-full py-2 px-3 h-12 text-gray-800 dark:text-gray-300 leading-tight border-gray-300 dark:bg-gray-900 dark:drop-shadow dark:border-none;
47
+ @apply rounded w-full py-2 px-3 h-12 text-gray-800 dark:text-gray-300 leading-tight border-gray-300 dark:border-gray-700 dark:bg-gray-900 dark:drop-shadow dark:border-none;
48
48
  }
49
49
 
50
50
  .form-multiselect {
51
- @apply rounded w-full py-2 px-3 text-gray-800 dark:text-gray-300 leading-tight border-gray-300 dark:bg-gray-900 dark:drop-shadow dark:border-none;
51
+ @apply rounded w-full py-2 px-3 text-gray-800 dark:text-gray-300 leading-tight border-gray-300 dark:border-gray-700 dark:bg-gray-900 dark:drop-shadow dark:border-none;
52
52
  }
53
53
 
54
54
  .custom-select {
@@ -61,15 +61,15 @@ form {
61
61
 
62
62
  input.is-invalid,
63
63
  select.is-invalid {
64
- @apply border-red-300 text-red-900 placeholder-red-300 focus:outline-none focus:ring-red-500 focus:border-red-500;
64
+ @apply border-red-300 dark:border-red-500 text-red-900 placeholder-red-300 focus:outline-none focus:ring-red-500 focus:border-red-500;
65
65
  }
66
66
 
67
67
  input[type="checkbox"].custom-control-input {
68
- @apply border-gray-300 dark:bg-gray-800 rounded;
68
+ @apply border-gray-300 dark:border-gray-700 dark:bg-gray-800 rounded;
69
69
  margin-right: 0.5rem;
70
70
 
71
71
  &:checked {
72
- @apply border border-primary-600 bg-primary-600;
72
+ @apply border border-primary-600 dark:border-primary-600 bg-primary-600;
73
73
  }
74
74
  }
75
75
 
@@ -80,16 +80,16 @@ form {
80
80
  }
81
81
 
82
82
  input[type="radio"].custom-control-input {
83
- @apply border-gray-300 dark:bg-gray-800;
83
+ @apply border-gray-300 dark:border-gray-700 dark:bg-gray-800;
84
84
  margin-right: 0.5rem;
85
85
 
86
86
  &:checked {
87
- @apply border border-primary-900 bg-primary-900;
87
+ @apply border border-primary-900 dark:border-primary-900 bg-primary-900;
88
88
  }
89
89
  }
90
90
 
91
91
  .editor {
92
- @apply h-32 border border-gray-300 dark:bg-gray-800 rounded overflow-hidden;
92
+ @apply h-32 border border-gray-300 dark:border-gray-700 dark:bg-gray-800 rounded overflow-hidden;
93
93
 
94
94
  .CodeMirror-wrap {
95
95
  border-top-right-radius: 3px;
@@ -107,30 +107,30 @@ form {
107
107
  }
108
108
 
109
109
  &.is-invalid {
110
- @apply border-red-300 text-red-900 placeholder-red-300 focus:outline-none focus:ring-red-500 focus:border-red-500;
110
+ @apply border-red-300 dark:border-red-500 text-red-900 placeholder-red-300 focus:outline-none focus:ring-red-500 focus:border-red-500;
111
111
  }
112
112
  }
113
113
 
114
114
  trix-editor {
115
- @apply border border-gray-300 rounded focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-primary-500;
115
+ @apply border border-gray-300 dark:border-gray-700 rounded focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-primary-500;
116
116
  }
117
117
 
118
118
  .fields_for {
119
119
  @apply dark:bg-gray-800;
120
120
  .field-for-bg{
121
121
  @apply dark:bg-gray-800;
122
- .template {
123
- @apply dark:bg-gray-800;
124
- .fields {
125
- @apply opacity-50 dark:bg-gray-800;
126
- }
127
- &:hover {
122
+ .template {
123
+ @apply dark:bg-gray-800;
128
124
  .fields {
129
- @apply opacity-100;
125
+ @apply opacity-50 dark:bg-gray-800;
126
+ }
127
+ &:hover {
128
+ .fields {
129
+ @apply opacity-100;
130
+ }
130
131
  }
131
132
  }
132
133
  }
133
- }
134
134
  }
135
135
 
136
136
  .form-text {
@@ -156,6 +156,21 @@ form {
156
156
  border-bottom: 1px dashed #e5e7eb;
157
157
  }
158
158
 
159
+ .background{
160
+ @apply dark:bg-gray-800 dark:text-gray-50;
161
+ }
162
+
163
+ .flow-step-item{
164
+ @apply dark:bg-gray-800 dark:text-gray-50 rounded-lg;
165
+ }
166
+ ul.flow-steps{
167
+ border: none;
168
+ }
169
+
170
+ .flow-step-short{
171
+ @apply dark:border-gray-50;
172
+ }
173
+
159
174
  .nested-fields_action {
160
175
  @apply bg-white dark:bg-gray-800;
161
176
  margin-left: -1rem;
data/app/assets/stylesheets/satis/components/trix.css CHANGED
@@ -232,6 +232,15 @@ trix-toolbar .trix-button--dialog {
232
232
  trix-toolbar .trix-dialog--link {
233
233
  max-width: 600px; }
234
234
 
235
+ div.trix-dialog.trix-dialog--link{
236
+ display: none;
237
+ }
238
+
239
+ div.trix-dialog.trix-dialog--link.trix-active{
240
+ display: block;
241
+ }
242
+
243
+
235
244
  trix-toolbar .trix-dialog__link-fields {
236
245
  display: flex;
237
246
  align-items: baseline; }
data/app/components/satis/card/component.css CHANGED
@@ -6,17 +6,13 @@
6
6
  }
7
7
 
8
8
  &__tabs {
9
- @apply bg-white px-4 border-b border-gray-200 sm:px-5 dark:bg-gray-800 dark:border-gray-700 dark:text-gray-300;
9
+ @apply bg-white px-4 border-b border-gray-200 sm:px-5 dark:bg-gray-900 dark:border-gray-700 dark:text-gray-300;
10
10
 
11
11
  a:first {
12
12
  @apply ml-4;
13
13
  }
14
14
  }
15
15
 
16
- .sts-card__header{
17
- @apply dark:bg-gray-900 dark:bg-opacity-50;
18
- }
19
-
20
16
  a.tab:not(.selected) {
21
17
  @apply dark:text-gray-300;
22
18
  }
data/app/components/satis/editor/component.css CHANGED
@@ -1,3 +1,14 @@
1
1
  .sts-editor {
2
2
  @apply bg-white h-full sm:rounded-lg sm:shadow dark:bg-gray-800 overflow-hidden;
3
+ }
4
+
5
+ .cm-editor{
6
+ @apply dark:bg-gray-900 dark:border dark:border-opacity-25 dark:border-gray-50 ;
7
+ }
8
+
9
+ .cm-editor .cm-gutter{
10
+ @apply dark:bg-gray-700 dark:text-white dark:border-none;
11
+ }
12
+ .cm-activeLineGutter{
13
+ @apply dark:text-black;
3
14
  }
data/app/components/satis/page/component.css CHANGED
@@ -11,8 +11,10 @@
11
11
  opacity: 0.99;
12
12
  overflow: auto;
13
13
  z-index: 2;
14
-
15
-
14
+ }
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;
17
+ margin-top: -7px;
16
18
  }
17
19
 
18
20
  .h-screen.flex .page_bg .topbar .account-name {
@@ -44,4 +46,10 @@
44
46
 
45
47
  }
46
48
 
49
+ .dark .page_body {
50
+ background: rgb(17, 24, 39);
51
+ }
52
+
53
+
54
+
47
55
 
data/app/components/satis/page/component.html.slim CHANGED
@@ -18,5 +18,5 @@ html lang="en"
18
18
  .mt-4
19
19
  .max-w.mx-auto.px-4.sm:px-4.md:px-4
20
20
  = body
21
- .sidebar
22
- == sidebar
21
+ .sidebar
22
+ == sidebar
data/app/components/satis/sidebar_menu_item/component.css CHANGED
@@ -39,6 +39,7 @@
39
39
  display: none;
40
40
  }
41
41
 
42
+
42
43
  .sidebar.close .sts-sidebar-menu-item [data-satis-sidebar-menu-item-target="submenu"] .sts-sidebar-menu-item{
43
44
  display: none;
44
45
  visibility: hidden;
@@ -58,6 +59,16 @@
58
59
  opacity: 0;
59
60
  }
60
61
 
62
+ .sidebar.close .icon-link > .sts-sidebar-menu-item:hover:not(:has([data-satis-sidebar-menu-item-target="submenu"])) .sts-sidebar-menu-item__label {
63
+ @apply rounded-md bg-gray-50 dark:bg-gray-800 shadow-md py-2;
64
+ text-decoration-thickness: 2px;
65
+ display: block;
66
+ position: absolute;
67
+ padding-right: 20px;
68
+ padding-left: 20px;
69
+ margin-left: 40px;
70
+ }
71
+
61
72
  .sidebar.close .icon-link > .sts-sidebar-menu-item:has([data-satis-sidebar-menu-item-target="submenu"]):hover > .sts-sidebar-menu-item__link > .sts-sidebar-menu-item__label {
62
73
  @apply rounded-md bg-gray-50 dark:bg-gray-800 shadow-md py-2;
63
74
  text-decoration-thickness: 2px;
@@ -74,7 +85,6 @@
74
85
  margin-left: 70px;
75
86
  }
76
87
 
77
-
78
88
  .fontawesome-i2svg-active .h-screen.flex .sidebar.close .icon-link .sts-sidebar-menu-item:hover > [data-satis-sidebar-menu-item-target="submenu"] {
79
89
  @apply rounded-md bg-white dark:bg-gray-900 py-0 px-0 shadow-lg;
80
90
  display: block;
@@ -84,7 +94,9 @@
84
94
  padding-right: 20px;
85
95
  margin-left: 30px;
86
96
  margin-top: -45px;
97
+
87
98
  width: 200px;
99
+
88
100
  }
89
101
 
90
102
  .fontawesome-i2svg-active .h-screen.flex .sidebar.close .icon-link .sts-sidebar-menu-item:hover > [data-satis-sidebar-menu-item-target="submenu"] .sts-sidebar-menu-item:only-child {
@@ -96,7 +108,6 @@
96
108
  padding-right: 20px;
97
109
  margin-top: 0;
98
110
 
99
-
100
111
  }
101
112
 
102
113
  .h-screen.flex .sidebar.close .icon-link .sts-sidebar-menu-item:hover > [data-satis-sidebar-menu-item-target="submenu"] .sts-sidebar-menu-item.pl-4 {
@@ -106,8 +117,18 @@
106
117
  opacity: 100;
107
118
  }
108
119
 
120
+ .sidebar.close .sts-sidebar-menu-item:hover > [data-satis-sidebar-menu-item-target="submenu"] .sts-sidebar-menu-item .sts-sidebar-menu-item__label {
121
+ background: none;
122
+ display:block;
123
+ overflow: visible;
124
+ padding: 0;
125
+ }
126
+
127
+ .sidebar.close .sts-sidebar-menu-item:hover > [data-satis-sidebar-menu-item-target="submenu"] .sts-sidebar-menu-item .sts-sidebar-menu-item__label {
109
128
 
110
129
 
130
+ }
131
+
111
132
  .h-screen.flex .sidebar.close .icon-link .sts-sidebar-menu-item:last-child:hover > [data-satis-sidebar-menu-item-target="submenu"] {
112
133
  margin-top: -425px;
113
134
  }
data/app/components/satis/switch/component.html.slim CHANGED
@@ -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 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.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' }"
data/app/components/satis/tabs/component.html.slim CHANGED
@@ -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.dark:border-opacity-25
8
+ .border-b.border-gray-200.dark:border-opacity-25.dark:bg-gray-900.dark:bg-opacity-50
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
data/lib/satis/version.rb CHANGED
@@ -1,3 +1,3 @@
1
1
  module Satis
2
- VERSION = "2.1.35"
2
+ VERSION = "2.1.36"
3
3
  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.1.35
4
+ version: 2.1.36
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: 2024-07-24 00:00:00.000000000 Z
11
+ date: 2024-08-28 00:00:00.000000000 Z
12
12
  dependencies:
13
13
  - !ruby/object:Gem::Dependency
14
14
  name: browser