satis 2.1.33 → 2.1.36

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 8bed69646db25ebb07b77d770965f6526f069ebf188154224b2810281223bf48
-  data.tar.gz: eb130f1feadb5eb93ce7c37f191fc47e45772b7ad09de958d97161d4c7a1daff
+  metadata.gz: e57b3ca2bd2eb32edf6fe54e6debf993e024e2cfa2d7fad5700b64404032d4d0
+  data.tar.gz: a6a7c44464d82b470a7a3b840174c15cab9ae2b8f864aa4e99ca2ab27f66b6a1
 SHA512:
-  metadata.gz: c518b40362fb31cc85f536064b6f496366e656af01b22a1f44fa9129ecb272ca865fb88ea82cf4ca4c66c714476140927d8758ea5e34ae8b511a25f17722786a
-  data.tar.gz: c2cb674c406557ee174dd69f2268db7449c20d6422b649d3aa93a321ea2fc7c99029559df0b3b04fcb50892e6caba055e018a0f9a9d4934ef623c5849f884aee
+  metadata.gz: 25d1da89ea7ffaf293e329cc048b7e6481edf66303ecde17ba0b707b16879e9553009a02d5227cdc2f591c37eddf4855f9e08c559e67f48848cda75afd307896
+  data.tar.gz: f7de5d36ddabde0f447d7ef812021ad4744f0724727eb21d7ce753973893f8edd36a03e5b287a94db7ccb6ff256a5e98c49db9d59ad040ce1c948c66c64eb78a

data/app/assets/stylesheets/satis/components/form.css

@@ -1,25 +1,25 @@
 /* Allow buttons outside forms */
 .button {
-  @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;
+  @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;
 
   &.primary {
-    @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;
+    @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;
   }
 
   &.secondary {
-    @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;
+    @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;
   }
 
   &.destructive {
-    @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;
+    @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;
   }
 
   &.warning {
-    @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;
+    @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;
   }
 
   &.harmful {
-    @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;
+    @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;
   }
 }
 
@@ -36,19 +36,19 @@ form {
 
   input.form-control,
   select.form-control {
-    @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;
+    @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;
   }
 
   textarea.form-control {
-    @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;
+    @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;
   }
 
   .form-select {
-    @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;
+    @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;
   }
 
   .form-multiselect {
-    @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;
+    @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;
   }
 
   .custom-select {
@@ -61,15 +61,15 @@ form {
 
   input.is-invalid,
   select.is-invalid {
-    @apply border-red-300 text-red-900 placeholder-red-300 focus:outline-none focus:ring-red-500 focus:border-red-500;
+    @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;
   }
 
   input[type="checkbox"].custom-control-input {
-    @apply border-gray-300 dark:bg-gray-800 rounded;
+    @apply border-gray-300 dark:border-gray-700 dark:bg-gray-800 rounded;
     margin-right: 0.5rem;
 
     &:checked {
-      @apply border border-primary-600  bg-primary-600;
+      @apply border border-primary-600 dark:border-primary-600 bg-primary-600;
     }
   }
 
@@ -80,16 +80,16 @@ form {
   }
 
   input[type="radio"].custom-control-input {
-    @apply border-gray-300 dark:bg-gray-800;
+    @apply border-gray-300 dark:border-gray-700 dark:bg-gray-800;
     margin-right: 0.5rem;
 
     &:checked {
-      @apply border border-primary-900  bg-primary-900;
+      @apply border border-primary-900 dark:border-primary-900 bg-primary-900;
     }
   }
 
   .editor {
-    @apply h-32 border border-gray-300 dark:bg-gray-800 rounded overflow-hidden;
+    @apply h-32 border border-gray-300 dark:border-gray-700 dark:bg-gray-800 rounded overflow-hidden;
 
     .CodeMirror-wrap {
       border-top-right-radius: 3px;
@@ -107,30 +107,30 @@ form {
     }
 
     &.is-invalid {
-      @apply border-red-300 text-red-900 placeholder-red-300 focus:outline-none focus:ring-red-500 focus:border-red-500;
+      @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;
     }
   }
 
   trix-editor {
-    @apply border border-gray-300 rounded focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-primary-500;
+    @apply border border-gray-300 dark:border-gray-700 rounded focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-primary-500;
   }
 
   .fields_for {
     @apply dark:bg-gray-800;
     .field-for-bg{
       @apply dark:bg-gray-800;
-    .template {
-      @apply dark:bg-gray-800;
-      .fields {
-        @apply opacity-50 dark:bg-gray-800;
-      }
-      &:hover {
+      .template {
+        @apply dark:bg-gray-800;
         .fields {
-          @apply opacity-100;
+          @apply opacity-50 dark:bg-gray-800;
+        }
+        &:hover {
+          .fields {
+            @apply opacity-100;
+          }
         }
       }
     }
-    }
   }
 
   .form-text {
@@ -156,6 +156,21 @@ form {
       border-bottom: 1px dashed #e5e7eb;
     }
 
+    .background{
+      @apply dark:bg-gray-800 dark:text-gray-50;
+    }
+
+    .flow-step-item{
+      @apply dark:bg-gray-800 dark:text-gray-50 rounded-lg;
+    }
+    ul.flow-steps{
+      border: none;
+    }
+
+    .flow-step-short{
+      @apply dark:border-gray-50;
+    }
+
     .nested-fields_action {
       @apply bg-white dark:bg-gray-800;
       margin-left: -1rem;

data/app/assets/stylesheets/satis/components/trix.css

@@ -232,6 +232,15 @@ trix-toolbar .trix-button--dialog {
 trix-toolbar .trix-dialog--link {
   max-width: 600px; }
 
+div.trix-dialog.trix-dialog--link{
+  display: none;
+}
+
+div.trix-dialog.trix-dialog--link.trix-active{
+  display: block;
+}
+
+
 trix-toolbar .trix-dialog__link-fields {
   display: flex;
   align-items: baseline; }

data/app/components/satis/card/component.css

@@ -6,17 +6,13 @@
   }
 
   &__tabs {
-    @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;
+    @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;
 
     a:first {
       @apply ml-4;
     }
   }
 
-  .sts-card__header{
-    @apply dark:bg-gray-900 dark:bg-opacity-50;
-  }
-
   a.tab:not(.selected) {
     @apply dark:text-gray-300;
   }

data/app/components/satis/editor/component.css

@@ -1,3 +1,14 @@
 .sts-editor {
     @apply bg-white h-full sm:rounded-lg sm:shadow dark:bg-gray-800 overflow-hidden;
+}
+
+.cm-editor{
+    @apply dark:bg-gray-900 dark:border dark:border-opacity-25 dark:border-gray-50 ;
+}
+
+.cm-editor .cm-gutter{
+    @apply dark:bg-gray-700 dark:text-white dark:border-none;
+}
+.cm-activeLineGutter{
+    @apply dark:text-black;
 }

data/app/components/satis/page/component.css

@@ -11,8 +11,10 @@
     opacity: 0.99;
     overflow: auto;
     z-index: 2;
-
-
+  }
+  .ui-flash-container{
+    @apply dark:bg-emerald-500 dark:bg-opacity-25 dark:text-gray-300 dark:shadow-md dark:border-t-0;
+    margin-top: -7px;
   }
 
   .h-screen.flex .page_bg .topbar .account-name {
@@ -44,4 +46,10 @@
 
   }
 
+  .dark .page_body {
+    background: rgb(17, 24, 39);
+  }
+
+  
+
   

data/app/components/satis/page/component.html.slim

@@ -18,5 +18,5 @@ html lang="en"
             .mt-4
               .max-w.mx-auto.px-4.sm:px-4.md:px-4
                 = body
-      .sidebar
-        == sidebar
+        .sidebar
+          == sidebar

data/app/components/satis/sidebar_menu/component.html.slim

@@ -1 +1,2 @@
-= render(Satis::SidebarMenuItem::Component.with_collection(@menu.items, menu_options: menu_options))
+.sidebarmenu
+  = render(Satis::SidebarMenuItem::Component.with_collection(@menu.items, menu_options: menu_options))

data/app/components/satis/sidebar_menu_item/component.css

@@ -39,7 +39,8 @@
   display: none;
 }
 
-.sidebar.close .sts-sidebar-menu-item > [data-satis-sidebar-menu-item-target="submenu"] .sts-sidebar-menu-item{
+
+.sidebar.close .sts-sidebar-menu-item [data-satis-sidebar-menu-item-target="submenu"] .sts-sidebar-menu-item{
   display: none;
   visibility: hidden;
   opacity: 0;
@@ -58,41 +59,58 @@
   opacity: 0;
 }
 
-.h-screen.flex .sidebar.close .icon-link > .sts-sidebar-menu-item:hover:not(:has([data-satis-sidebar-menu-item-target="submenu"])) .sts-sidebar-menu-item__label {
-  @apply rounded-md bg-white dark:bg-gray-900 shadow-md py-2;
+.sidebar.close .icon-link > .sts-sidebar-menu-item:hover:not(:has([data-satis-sidebar-menu-item-target="submenu"])) .sts-sidebar-menu-item__label {
+  @apply rounded-md bg-gray-50 dark:bg-gray-800 shadow-md py-2;
+  text-decoration-thickness: 2px;
   display: block;
-  position: fixed;
+  position: absolute;
   padding-right: 20px;
   padding-left: 20px;
-  margin-left: 25px;
+  margin-left: 40px;
 }
 
-.h-screen.flex .sidebar.close .icon-link .sts-sidebar-menu-item:hover > [data-satis-sidebar-menu-item-target="submenu"] {
+.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 {
+  @apply rounded-md bg-gray-50 dark:bg-gray-800 shadow-md py-2;
+  text-decoration-thickness: 2px;
+  display: block;
+  position: absolute;
+  padding-right: 20px;
+  padding-left: 20px;
+  margin-left: 40px;
+  margin-top: -75px;
+}
+
+.sidebar.close .icon-link > .sts-sidebar-menu-item:has([data-satis-sidebar-menu-item-target="submenu"]):last-child:hover > .sts-sidebar-menu-item__link > .sts-sidebar-menu-item__label {
+  margin-top: -840px;
+  margin-left: 70px;
+}
+
+.fontawesome-i2svg-active .h-screen.flex .sidebar.close .icon-link .sts-sidebar-menu-item:hover > [data-satis-sidebar-menu-item-target="submenu"] {
   @apply rounded-md bg-white dark:bg-gray-900 py-0 px-0 shadow-lg;
   display: block;
   visibility: visible;
   opacity: 1;
-  position: fixed;
+  position: absolute;
   padding-right: 20px;
-  margin-left: 35px;
-  margin-top: -90px;
+  margin-left: 30px;
+  margin-top: -45px;
 
+  width: 200px;
 
 }
 
-.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 {
+.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 {
   @apply rounded-md bg-white dark:bg-gray-900 py-0 px-0 shadow-lg;
   display: block;
   visibility: visible;
   opacity: 1;
   position: fixed;
   padding-right: 20px;
-  margin-top: 45px;
-
+  margin-top: 0;
 
 }
 
-.h-screen.flex .sidebar.close .icon-link .sts-sidebar-menu-item:hover > [data-satis-sidebar-menu-item-target="submenu"] .sts-sidebar-menu-item {
+.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 {
   @apply py-0 px-0 ;
   display: block;
   visibility: visible;

data/app/components/satis/switch/component.html.slim

@@ -2,7 +2,7 @@ div.satis-switch data-controller='satis-switch'
   - if options[:label] != false
     = form.custom_label(attribute, options[:label], data: { action: "click->satis-switch#toggle" })
   = form.hidden_field(attribute, options[:input_html].reverse_merge(value: @value ? "1" : "0", 'data-action' => 'change->satis-switch#update'))
-  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'}"
+  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'}"
     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' }"
       - if icon
         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

@@ -5,7 +5,7 @@
       - tabs.each do |tab|
         option selected=tab.selected? = ct(".#{tab.name}", scope: :tab)
   .hidden.sm:block
-    .border-b.border-gray-200.dark:border-opacity-25
+    .border-b.border-gray-200.dark:border-opacity-25.dark:bg-gray-900.dark:bg-opacity-50
       nav.sts-tabs__nav aria-label="Tabs"
         - tabs.each.with_index do |tab, index|
           - id = tab.id.present? ? tab.id : tab.name

data/lib/satis/version.rb

@@ -1,3 +1,3 @@
 module Satis
-  VERSION = "2.1.33"
+  VERSION = "2.1.36"
 end

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: satis
 version: !ruby/object:Gem::Version
-  version: 2.1.33
+  version: 2.1.36
 platform: ruby
 authors:
 - Tom de Grunt
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2024-07-22 00:00:00.000000000 Z
+date: 2024-08-28 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: browser