RubyGems - epages-essence - Versions diffs - 0.1.0 → 0.2.0 - Mend

epages-essence 0.1.0 → 0.2.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 (107) hide show

checksums.yaml CHANGED Viewed

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 6ed6897e7890245d4b2608a117871b5f3e9001bebc2e67c7931f0899dcba589e
-  data.tar.gz: 1c68b54c6545f6aa20ca25635e2f59de8946a51326427a7064751f94629efab6
+  metadata.gz: e9ea06918221dc8c34ae3e86f7e698cadecef11324d56be11c1ef0aa3ec2821c
+  data.tar.gz: '08c04fcfb73b8837bb826f6953dcda3462ce673cb81add44c76aba10dc1fe236'
 SHA512:
-  metadata.gz: 112822c3aa89a967852dedd8de1881bbfa95333324236a9f8a73386d905ae52276b036988c5ff32dbf271f2c6361fd0d94217c317239403b5d3eca5c3bdb210b
-  data.tar.gz: 0be07019b5e9d2f50b5bd8b5874cc7e293bc701bfe4d1b4999e382881aec30f7d1b16fced4fed0dbc2907b312826605976967d34774172a815c26a783c458044
+  metadata.gz: f95037f6eeda4b2e6863cedf3614237b4d59c73d6a3c7cc4c22c9c3c9df987f0ec699093b5cb010ceacf7a03500cae31f7eb4b4524693fe2d6c64989495e1baa
+  data.tar.gz: 91d79535e5d7cb8d9a15715eec79603442d89dbd6081977317e9ed20219f4e8d549252c8722d99d8e59f674e0cabff543f50300a9b34fea5e5534e8cd55eec55

data/LICENSE CHANGED Viewed

@@ -1,4 +1,4 @@
-Copyright (c) 2024 ePages GmbH
+Copyright (c) 2025 ePages GmbH
 Permission is hereby granted, free of charge, to any person obtaining
 a copy of this software and associated documentation files (the

data/README.md CHANGED Viewed

@@ -23,8 +23,9 @@
     <!DOCTYPE html>
     <html>
       <head>
-        <%= stylesheet_link_tag 'essence/beyond', 'data-turbo-track': 'reload' %>
-        <%= javascript_importmap_tags 'essence/application' %>
+        <%= stylesheet_link_tag 'essence/beyond' %>
+        <%= javascript_importmap_tags "application", importmap: Essence.importmap  %>
         <%= yield :head %>
       </head>
@@ -34,7 +35,7 @@
     </html>
     ```
-    > Any `javascript_import_module_tag` must come after the `javascript_importmap_tags` declaration, that's why `<%= yield :head %>` is placed after this declaration. See [`importmap-rails` gem](https://github.com/rails/importmap-rails?tab=readme-ov-file#selectively-importing-modules).
+    > Any `javascript_import_module_tag` should come after the `javascript_importmap_tags` declaration, that's why `<%= yield :head %>` is placed after this declaration. See [`importmap-rails` gem](https://github.com/rails/importmap-rails?tab=readme-ov-file#selectively-importing-modules).
 ## Component preview

data/app/assets/images/essence/icon_component/arrow_right.svg ADDED Viewed

	@@ -0,0 +1 @@
1	+ <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M5 3l3.057-3L20 12 8.057 24 5 21l9-9z"/></svg>

data/app/assets/images/essence/icon_component/chevron_up_down.svg ADDED Viewed

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
+  <path d="M12 18.8l-5.9-5.2-2.4 2.1L12 23l8.3-7.2-2.4-2.1-5.9 5.1zm0-13.6l5.9 5.2 2.4-2.1L12 1 3.7 8.2l2.4 2.1L12 5.2z"/>
+</svg>

data/app/assets/images/essence/icon_component/power_off.svg ADDED Viewed

	@@ -0,0 +1 @@
1	+ <svg data-token-category="icons" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M13 12.81h-2V0h2z"></path><path d="M17.06 1.13V3.4a10 10 0 11-10.12 0V1.13a12 12 0 1010.12 0z"></path></svg>

data/app/assets/images/essence/icon_component/sparkles.svg ADDED Viewed

@@ -0,0 +1 @@

+ <svg data-token-category="icons" xmlns="http://www.w3.org/2000/svg" width="83.75" height="67.98" viewBox="0 0 83.75 67.98"><path d="M83 32.98l-8.7-1c-11.2-1.4-20.1-10.2-21.4-21.4l-1-8.7c-.1-1-1.6-1-1.7 0l-1 8.7c-1.4 11.2-10.2 20.1-21.4 21.4l-8.7 1c-1 .1-1 1.6 0 1.7l8.7 1c11.2 1.4 20.1 10.2 21.4 21.4l1 8.7c.1 1 1.6 1 1.7 0l1-8.7c1.4-11.2 10.2-20.1 21.4-21.4l8.7-1c1-.1 1-1.6 0-1.7zM2.2 15.48l4 .5c5.1.6 9.2 4.6 9.8 9.8l.5 4c.1.5.8.5.8 0l.5-4c.6-5.1 4.6-9.2 9.8-9.8l4-.5c.5-.1.5-.8 0-.8l-4-.5c-5.1-.6-9.2-4.6-9.8-9.8l-.5-4c-.1-.5-.8-.5-.8 0l-.5 4c-.6 5.1-4.6 9.2-9.8 9.8l-4 .5c-.5.1-.5.8 0 .8zm23.2 39.3l-3.4-.4c-4.4-.5-7.9-4-8.4-8.4l-.4-3.4c-.1-.4-.7-.4-.7 0l-.4 3.4c-.5 4.4-4 7.9-8.4 8.4l-3.4.4c-.4.1-.4.7 0 .7l3.4.4c4.4.5 7.9 4 8.4 8.4l.4 3.4c.1.4.7.4.7 0l.4-3.4c.5-4.4 4-7.9 8.4-8.4l3.4-.4c.4-.1.4-.7 0-.7z"></path></svg>

data/app/assets/images/essence/icon_component/x_mark.svg ADDED Viewed

@@ -0,0 +1,3 @@
+<svg data-token-category="icons" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
+  <path d="M24 20.188l-8.315-8.209 8.2-8.282L20.188 0l-8.212 8.318L3.666.115 0 3.781l8.321 8.24-8.206 8.313L3.781 24l8.237-8.318 8.285 8.203z"></path>
+</svg>

data/app/assets/stylesheets/essence/beyond/{_base.scss → layout/base.css} RENAMED Viewed

@@ -1,8 +1,3 @@
-:root {
-  --workspace-text:       #3e3e3e;
-  --workspace-background: #e6e6e6;
-}
 body {
   font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen-Sans, Ubuntu, Cantarell, 'Helvetica Neue', sans-serif;
   -webkit-font-smoothing: antialiased;

data/app/assets/stylesheets/essence/beyond/layout/{_content.scss → content.css} RENAMED Viewed

@@ -3,7 +3,7 @@
 }
 .action-bar {
-  & + .content {
+  &+.content {
     padding-top: 12px;
   }
 }

data/app/assets/stylesheets/essence/beyond/simple_form/control.css ADDED Viewed

@@ -0,0 +1,249 @@
+.form-control {
+  &.country,
+  &.numeric,
+  &.password,
+  &.select,
+  &.date,
+  &.string,
+  &.text {
+    background-color: var(--inputField-background);
+    border: 1px solid var(--inputField-border);
+    color: var(--inputField-text);
+    display: block;
+    font-size: 14px;
+    outline: none;
+    padding: 6px 8px;
+    transition: border-color 0.125s ease-in, box-shadow 0.125s ease-in;
+    width: 100%;
+    &::placeholder {
+      color: var(--inputField-placeholder-text);
+    }
+    &:focus {
+      border-color: var(--inputField-border-focus);
+    }
+    &:disabled {
+      background-color: var(--inputField-background-disabled);
+      color: var(--inputField-text-disabled);
+    }
+    &.invalid {
+      box-shadow: inset 2px 0 0 0 var(--formGroup-validation-error);
+    }
+  }
+  &.text {
+    min-height: 100px;
+  }
+  &.numeric,
+  &.password,
+  &.string,
+  &.text {
+    &:read-only {
+      background-color: var(--inputField-background-disabled);
+      color: var(--inputField-text-disabled);
+      border-color: var(--inputField-border);
+    }
+  }
+  &.select,
+  &.date {
+    -webkit-appearance: none;
+    appearance: none;
+    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg data-token-category=%27icons%27 xmlns=%27http://www.w3.org/2000/svg%27 width=%2724%27 height=%2724%27 viewBox=%270 0 24 24%27 fill=%27%237a764c%27%3E %3Cpath d=%27M24,7L12,19L0,7H24z%27/%3E %3C/svg%3E");
+    background-position: right 10px top 50%;
+    background-repeat: no-repeat;
+    background-size: 10px auto;
+    padding-right: 30px;
+    &[readonly] {
+      background-image: none;
+      padding: 6px 8px;
+      pointer-events: none;
+    }
+  }
+  &.date {
+    &:not(:first-child) {
+      border-left: 0;
+      &:focus {
+        box-shadow: -1px 0 0 0 var(--inputField-border-focus);
+      }
+    }
+  }
+  &.boolean,
+  &.check_boxes {
+    appearance: none;
+    border: 2px solid var(--uncheck-color);
+    border-radius: 0;
+    cursor: pointer;
+    flex-shrink: 0;
+    height: 16px;
+    margin: 0;
+    width: 16px;
+    &:checked {
+      background-color: var(--check-color);
+      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpolygon fill='%23ffffff' points='9.6,18.4 3.8,12.8 5.8,10.7 9.5,14.3 18,5.6 20.1,7.7'/%3E%3C/svg%3E%0A");
+      background-size: contain;
+      border: none;
+    }
+    ~ .form-label {
+      cursor: pointer;
+    }
+    &:disabled {
+      border-color: var(--check-disabled-icon);
+      &:checked {
+        background-color: var(--check-disabled-text);
+      }
+      ~ .form-label {
+        color: var(--check-disabled-text);
+      }
+    }
+  }
+  &.toggle {
+    border: 1px solid var(--flipSwitch-border);
+    border-radius: 11px;
+    cursor: pointer;
+    display: block;
+    height: 22px;
+    position: relative;
+    width: 42px;
+    &::before {
+      background-color: var(--flipSwitch-unchecked-background);
+      border-radius: 100%;
+      content: "";
+      height: 18px;
+      left: 1px;
+      position: absolute;
+      top: 1px;
+      transition: 0.3s;
+      width: 18px;
+      background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="20.5" height="20.5" viewBox="0 0 20.5 20.5"><path fill="%23ffffff" d="M15.2,13.7l-3.5-3.4,3.4-3.5-1.5-1.5-3.4,3.5-3.5-3.4-1.5,1.5,3.5,3.4-3.4,3.5,1.5,1.5,3.4-3.5,3.5,3.4,1.5-1.5Z"/></svg>');
+      background-size: contain;
+    }
+    &:has(~ input[type="checkbox"]:checked) {
+      &::before {
+        background-color: var(--flipSwitch-checked-background);
+        left: calc(100% - 19px);
+        background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="20.5" height="20.5" viewBox="0 0 20.5 20.5"><path fill="%23ffffff" d="M8.6,15.3l-5-4.8,1.6-1.6,3.4,3.3,6.8-7,1.6,1.6-8.4,8.5Z"/></svg>');
+      }
+    }
+    ~ input[type="checkbox"] {
+      opacity: 0;
+      width: 0;
+      height: 0;
+      margin: 0;
+    }
+    ~ .form-label {
+      cursor: pointer;
+    }
+  }
+  &.radio_buttons {
+    appearance: none;
+    border: 2px solid var(--uncheck-color);
+    border-radius: 100%;
+    cursor: pointer;
+    flex-shrink: 0;
+    height: 16px;
+    margin: 0;
+    width: 16px;
+    &:checked {
+      background-color: var(--check-color);
+      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='%23ffffff' %3E%3Cpath d='M12,2.4c-5.3,0-9.6,4.3-9.6,9.6s4.3,9.6,9.6,9.6s9.6-4.3,9.6-9.6S17.3,2.4,12,2.4z M12,18.2c-3.5,0-6.3-2.7-6.3-6.2 S8.6,5.7,12,5.7s6.2,2.9,6.2,6.3S15.5,18.2,12,18.2z' /%3E%3C/svg%3E");
+      background-size: contain;
+      border: none;
+      cursor: default;
+    }
+    &:not(:checked) {
+      ~ .form-label {
+        cursor: pointer;
+      }
+    }
+    &:disabled {
+      border-color: var(--check-disabled-icon);
+      &:checked {
+        background-color: var(--check-disabled-text);
+      }
+      ~ .form-label {
+        color: var(--check-disabled-text);
+      }
+    }
+  }
+}
+.form-control-prepend,
+.form-control-append {
+  align-items: center;
+  border: 1px solid;
+  border-color: var(--inputField-border);
+  box-sizing: border-box;
+  background-color: var(--inputField-background);
+  display: flex;
+  flex-shrink: 0;
+  padding: 6px 8px;
+  line-height: 1.5;
+  &:has(.form-control) {
+    border: 0;
+    padding: 0;
+    .form-control {
+      &:focus {
+        z-index: 1;
+      }
+    }
+  }
+}
+.form-control-prepend {
+  border-right: 0;
+  &:has(.form-control) {
+    .form-control {
+      border-top-left-radius: var(--inputField-borderRadius);
+      border-bottom-left-radius: var(--inputField-borderRadius);
+      border-right: 0;
+      &:focus {
+        box-shadow: 1px 0 0 0 var(--inputField-border-focus);
+      }
+    }
+  }
+}
+.form-control-append {
+  border-left: 0;
+  &:has(.form-control) {
+    .form-control {
+      border-top-right-radius: var(--inputField-borderRadius);
+      border-bottom-right-radius: var(--inputField-borderRadius);
+      border-left: 0;
+      &:focus {
+        box-shadow: -1px 0 0 0 var(--inputField-border-focus);
+      }
+    }
+  }
+}

data/app/assets/stylesheets/essence/beyond/simple_form/error.css ADDED Viewed

@@ -0,0 +1,29 @@
+.form-error {
+  background-color: var(--formGroup-validation-error);
+  border-radius: var(--formGroup-validation-borderRadius);
+  color: var(--formGroup-validation-text);
+  font-size: 13px;
+  font-weight: normal;
+  margin: 0;
+  padding: 5px 7px;
+  position: absolute;
+  top: calc(100% + 8px);
+  z-index: 1;
+  &::first-letter {
+    text-transform: uppercase;
+  }
+  &::before {
+    border: solid transparent;
+    border-bottom-color: var(--formGroup-validation-error);
+    border-width: 6px;
+    bottom: 100%;
+    content: '';
+    height: 0;
+    left: 8px;
+    pointer-events: none;
+    position: absolute;
+    width: 0;
+  }
+}

data/app/assets/stylesheets/essence/beyond/simple_form/fieldset.css ADDED Viewed

@@ -0,0 +1,32 @@
+.form-fieldset {
+  border: none;
+  margin: 0;
+  padding: 0;
+  &.check_boxes,
+  &.radio_buttons {
+    .form-wrapper {
+      display: flex;
+      flex-direction: column;
+      gap: 7px;
+    }
+  }
+  &.check_boxes {
+    .form-legend {
+      color: #3e3e3e;
+      margin-bottom: 15px;
+      font-size: 20px;
+      font-weight: normal;
+    }
+  }
+  &.radio_buttons {
+    .form-legend {
+      color: var(--formGroup-label);
+      font-size: 13px;
+      font-weight: bold;
+      margin-bottom: 8px;
+    }
+  }
+}

data/app/assets/stylesheets/essence/beyond/simple_form/group.css ADDED Viewed

@@ -0,0 +1,21 @@
+.form-group {
+  &:not(:has(trix-editor)) {
+    display: flex;
+    align-items: center;
+    & > *:first-child {
+      border-top-left-radius: var(--inputField-borderRadius);
+      border-bottom-left-radius: var(--inputField-borderRadius);
+    }
+    & > *:last-child {
+      border-top-right-radius: var(--inputField-borderRadius);
+      border-bottom-right-radius: var(--inputField-borderRadius);
+    }
+    & > .date:last-of-type {
+      border-top-right-radius: var(--inputField-borderRadius);
+      border-bottom-right-radius: var(--inputField-borderRadius);
+    }
+  }
+}

data/app/assets/stylesheets/essence/beyond/simple_form/hint.css ADDED Viewed

@@ -0,0 +1,6 @@
+.form-hint {
+  color: var(--inputField-hint-text);
+  font-size: 13px;
+  line-height: 1.2;
+  margin-top: .25em;
+}

data/app/assets/stylesheets/essence/beyond/simple_form/label.css ADDED Viewed

@@ -0,0 +1,38 @@
+.form-label {
+  display: inline-block;
+  &::first-letter {
+    text-transform: uppercase;
+  }
+  abbr {
+    text-decoration: none;
+  }
+  &.collection_radio_buttons {
+    color: #808080;
+    font-size: 13px;
+  }
+  &:not(.collection_radio_buttons) {
+    color: var(--formGroup-label);
+    font-size: 13px;
+    font-weight: bold;
+  }
+  &.boolean,
+  &.collection_check_boxes,
+  &.collection_radio_buttons {
+    line-height: 16px;
+    padding-left: 7px;
+  }
+  &.toggle {
+    line-height: 16px;
+    padding-left: 10px;
+  }
+  &.file-name {
+    margin-left: 1em;
+  }
+}

data/app/assets/stylesheets/essence/beyond/simple_form/row.css ADDED Viewed

@@ -0,0 +1,5 @@
+.form-row {
+  &:not(.hidden):not(:last-of-type) {
+    margin-bottom: 30px;
+  }
+}

data/app/assets/stylesheets/essence/beyond/simple_form/wrapper.css ADDED Viewed

@@ -0,0 +1,3 @@
+.form-wrapper {
+  position: relative;
+}

data/app/assets/stylesheets/essence/beyond/utils/margin.css ADDED Viewed

@@ -0,0 +1,15 @@
+.margin-top {
+  margin-top: 30px !important;
+}
+.margin-bottom {
+  margin-bottom: 30px !important;
+}
+.margin-left {
+  margin-left: 30px !important;
+}
+.margin-right {
+  margin-right: 30px !important;
+}