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

epages-essence 0.1.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 (120) hide show

checksums.yaml ADDED Viewed

@@ -0,0 +1,7 @@
+---
+SHA256:
+  metadata.gz: 6ed6897e7890245d4b2608a117871b5f3e9001bebc2e67c7931f0899dcba589e
+  data.tar.gz: 1c68b54c6545f6aa20ca25635e2f59de8946a51326427a7064751f94629efab6
+SHA512:
+  metadata.gz: 112822c3aa89a967852dedd8de1881bbfa95333324236a9f8a73386d905ae52276b036988c5ff32dbf271f2c6361fd0d94217c317239403b5d3eca5c3bdb210b
+  data.tar.gz: 0be07019b5e9d2f50b5bd8b5874cc7e293bc701bfe4d1b4999e382881aec30f7d1b16fced4fed0dbc2907b312826605976967d34774172a815c26a783c458044

data/LICENSE ADDED Viewed

@@ -0,0 +1,20 @@
+Copyright (c) 2024 ePages GmbH
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of this software and associated documentation files (the
+"Software"), to deal in the Software without restriction, including
+without limitation the rights to use, copy, modify, merge, publish,
+distribute, sublicense, and/or sell copies of the Software, and to
+permit persons to whom the Software is furnished to do so, subject to
+the following conditions:
+The above copyright notice and this permission notice shall be
+included in all copies or substantial portions of the Software.
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
+NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
+LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
+OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
+WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

data/README.md ADDED Viewed

@@ -0,0 +1,73 @@
+# Essence
+![Gem Version](https://img.shields.io/gem/v/epages-essence)
+![License](https://img.shields.io/github/license/ePages-de/essence)
+## Installation
+1. Add this line to your application's Gemfile:
+    ```ruby
+    gem 'epages-essence'
+    ```
+1. Execute the following command:
+    ```bash
+    bundle install
+    ```
+1. Add the following lines to the `<head>` and `<body>` of the layout you are going to use (e.g. `app/views/layouts/application.html.erb`):
+    ```erb
+    <!DOCTYPE html>
+    <html>
+      <head>
+        <%= stylesheet_link_tag 'essence/beyond', 'data-turbo-track': 'reload' %>
+        <%= javascript_importmap_tags 'essence/application' %>
+        <%= yield :head %>
+      </head>
+      <body>
+        <%= render template: 'essence/beyond/body' %>
+      </body>
+    </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).
+## Component preview
+Essence includes a Rails application that uses [Lookbook](https://lookbook.build/). By running this app, you can preview the components and explore the possibilities that Essence offers.
+> Currently, the Lookbook app is in an early stage and is still under development. It does not have a preview of all the components but of most of them.
+To run the Lookbook app, follow these steps:
+1. Change directory to `site`, which is the Lookbook project's folder:
+    ```bash
+    cd site
+    ```
+2. Start the web server:
+    ```bash
+    bin/rails server
+    ```
+## Contributing
+Please see [CONTRIBUTING](https://github.com/ePages-de/essence/blob/main/CONTRIBUTING.md).
+## License
+Essence is Copyright © 2024 ePages GmbH. It is free software, and may be redistributed under the terms specified in the [LICENSE](https://github.com/ePages-de/essence/blob/main/LICENSE) file.
+## About ePages
+As the largest independent provider of online shop software in Europe, ePages specialises in high-performance ecommerce solutions for small and medium-sized businesses.
+Today, 100,000 companies in 70 countries operate professional online shops with ePages software in the cloud.
+And we love open source software!
+Check out our [other projects](https://github.com/ePages-de), or [become part of our team](https://developer.epages.com/devjobs/) and develop great ecommerce software with us!

data/Rakefile ADDED Viewed

@@ -0,0 +1,10 @@
+# frozen_string_literal: true
+require 'bundler/setup'
+APP_RAKEFILE = File.expand_path('site/Rakefile', __dir__)
+load 'rails/tasks/engine.rake'
+load 'rails/tasks/statistics.rake'
+require 'bundler/gem_tasks'

data/app/assets/config/essence_manifest.js ADDED Viewed

@@ -0,0 +1,5 @@
+//= link_tree ../images
+//= link_tree ../stylesheets .css
+//= link_tree ../../javascript .js
+//= link_tree ../../components .js
+//= link_tree ../../../vendor/javascript .js

data/app/assets/images/essence/icon_component/arrow_up_right_from_square.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="M21 13v10H0V4h12v2H2v15h17v-8h2zm3-12H13.012l4.035 4-6.977 7.07 2.828 2.828 6.977-7.07L24 12V1z"></path></svg>

data/app/assets/images/essence/icon_component/circle_check.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="M12 2c5.514 0 10 4.486 10 10s-4.486 10-10 10-10-4.486-10-10 4.486-10 10-10zm0-2c-6.627 0-12 5.373-12 12s5.373 12 12 12 12-5.373 12-12-5.373-12-12-12zm-1.959 17l-4.5-4.319 1.395-1.435 3.08 2.937 7.021-7.183 1.422 1.409-8.418 8.591z"></path></svg>

data/app/assets/images/essence/icon_component/circle_exclamation.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="M12 2c5.514 0 10 4.486 10 10s-4.486 10-10 10-10-4.486-10-10 4.486-10 10-10zm0-2c-6.627 0-12 5.373-12 12s5.373 12 12 12 12-5.373 12-12-5.373-12-12-12zm-1 6h2v8h-2v-8zm1 12.25c-.69 0-1.25-.56-1.25-1.25s.56-1.25 1.25-1.25 1.25.56 1.25 1.25-.56 1.25-1.25 1.25z"></path></svg>

data/app/assets/images/essence/icon_component/circle_info.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="M13.25 7c0 .69-.56 1.25-1.25 1.25s-1.25-.56-1.25-1.25.56-1.25 1.25-1.25 1.25.56 1.25 1.25zm10.75 5c0 6.627-5.373 12-12 12s-12-5.373-12-12 5.373-12 12-12 12 5.373 12 12zm-2 0c0-5.514-4.486-10-10-10s-10 4.486-10 10 4.486 10 10 10 10-4.486 10-10zm-13-2v2h2v6h2v-8h-4z"/></svg>

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

@@ -0,0 +1 @@

+ <svg data-token-category="icons" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M13 14.725C13 9.584 16.892 4.206 23 3l.984 2.126c-2.215.835-4.163 3.742-4.38 5.746A5.213 5.213 0 0124 16.021C24 19.203 21.416 21 18.801 21 15.786 21 13 18.695 13 14.725zm-13 0C0 9.584 3.892 4.206 10 3l.984 2.126c-2.215.835-4.163 3.742-4.38 5.746A5.213 5.213 0 0111 16.021C11 19.203 8.416 21 5.801 21 2.786 21 0 18.695 0 14.725z"></path></svg>

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

@@ -0,0 +1 @@

+ <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M12 2c5.514 0 10 4.486 10 10s-4.486 10-10 10-10-4.486-10-10 4.486-10 10-10zm0-2c-6.627 0-12 5.373-12 12s5.373 12 12 12 12-5.373 12-12-5.373-12-12-12zm6 16.538l-4.592-4.548 4.546-4.587-1.416-1.403-4.545 4.589-4.588-4.543-1.405 1.405 4.593 4.552-4.547 4.592 1.405 1.405 4.555-4.596 4.591 4.55 1.403-1.416z"></path></svg>

data/app/assets/images/essence/icon_component/copy.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="M18 6v-6h-18v18h6v6h18v-18h-6zm-12 10h-4v-14h14v4h-10v10zm16 6h-14v-14h14v14zm-3-8h-3v-3h-2v3h-3v2h3v3h2v-3h3v-2z"></path></svg>

data/app/assets/images/essence/icon_component/download.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="M12 21l-8-9h6V0h4v12h6l-8 9zm9-1v2H3v-2H1v4h22v-4h-2z"></path></svg>

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

@@ -0,0 +1 @@

+ <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M12 3.8C3.4 3.8 0 12 0 12s3.4 8.1 12 8.1c8.5 0 12-8.1 12-8.1s-3.4-8.2-12-8.2zm-.1 2.5v1.5c-1.2 0-2.2 1-2.2 2.2H8.2c0-2.1 1.6-3.7 3.7-3.7zm.1 11.8c-5.6 0-8.6-4.4-9.7-6.1.7-1.2 2.3-3.7 5-5.1-.6.9-1 2-1 3.2 0 3.2 2.6 5.7 5.7 5.7s5.7-2.6 5.7-5.7c0-1.2-.4-2.3-1-3.2 2.7 1.4 4.2 3.9 4.9 5.1-1 1.7-4 6.1-9.6 6.1z"></path></svg>

data/app/assets/images/essence/icon_component/filter.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="M1 0l9 15.094V21l4 3v-8.906L23 0H1zm18.479 2l-2.981 5H7.502L4.521 2h14.958z"></path></svg>

data/app/assets/images/essence/icon_component/greater_than.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"></path></svg>

data/app/assets/images/essence/icon_component/grid_2.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="M8.7 15.3H2.2v6.5h6.5v-6.5zm13.1 0h-6.5v6.5h6.5v-6.5zm-10.9-2.2V24H0V13.1h10.9zm13.1 0V24H13.1V13.1H24zM21.8 2.2h-6.5v6.5h6.5V2.2zM10.9 0v10.9H0V0h10.9zM24 0v10.9H13.1V0H24z"></path></svg>

data/app/assets/images/essence/icon_component/home.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="M12 9.185l7 6.514V22h-3v-5H8v5H5v-6.301l7-6.514zm0-2.732l-9 8.375V24h7v-5h4v5h7v-9.172l-9-8.375zm12 5.695L12 1 0 12.133l1.361 1.465L12 3.73l10.639 9.883L24 12.148z"></path></svg>

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

@@ -0,0 +1 @@

+ <svg xmlns="http://www.w3.org/2000/svg" width="24px" height="24px" viewBox="0 0 24 24"><path d="M21.9206803,2.07973917 C24.6916599,4.85172473 24.6916599,9.3487013 21.9206803,12.1216869 L18.0807087,15.9606669 L15.9597243,13.8386779 L19.798696,9.99869792 C21.3976842,8.40070624 21.3976842,5.79971979 19.797696,4.20172811 C18.1997078,2.60273644 15.598727,2.60273644 14.0007387,4.20072812 L10.1607671,8.03970812 L8.03978272,5.91871917 L11.8797544,2.07973917 C14.650734,-0.693246389 19.1467008,-0.693246389 21.9206803,2.07973917 Z M13.8387399,15.9586669 L9.99876827,19.7976469 C8.40078005,21.3976385 5.79979924,21.3966385 4.19981104,19.7976469 C2.60182283,18.1996552 2.60182283,15.5976688 4.19981104,14.0006771 L8.03978272,10.1606971 L5.91879836,8.03970812 L2.07882668,11.8796881 C-0.692152876,14.6516737 -0.693152869,19.1476503 2.07882668,21.9206358 C4.85180623,24.6926214 9.34877306,24.6936214 12.1197526,21.9206358 L15.9597243,18.0806558 L13.8387399,15.9586669 Z"></path></svg>

data/app/assets/images/essence/icon_component/pencil.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="M14.078 7.061l2.861 2.862-10.799 10.798-3.584.723.724-3.585 10.798-10.798zm0-2.829l-12.64 12.64-1.438 7.128 7.127-1.438 12.642-12.64-5.691-5.69zm7.105 4.277l2.817-2.82-5.691-5.689-2.816 2.817 5.69 5.692z"></path></svg>

data/app/assets/images/essence/icon_component/plus.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="M24 10h-10v-10h-4v10h-10v4h10v10h4v-10h10z"></path></svg>

data/app/assets/images/essence/icon_component/sort.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="M12 3.202L15.839 8H8.161L12 3.202zM12 0L4 10h16L12 0zm3.839 16L12 20.798 8.161 16h7.678zM20 14H4l8 10 8-10z"></path></svg>

data/app/assets/images/essence/icon_component/sort_down.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="M12 3.202L15.839 8H8.161L12 3.202zM12 0L4 10h16L12 0zm8 14H4l8 10 8-10z"></path></svg>

data/app/assets/images/essence/icon_component/sort_up.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="M12 0L4 10h16L12 0zm3.839 16L12 20.798 8.161 16h7.678zM20 14H4l8 10 8-10z"></path></svg>

data/app/assets/images/essence/icon_component/trash.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="M9 19a1 1 0 01-2 0V9a1 1 0 012 0v10zm4 0a1 1 0 01-2 0V9a1 1 0 012 0v10zm4 0a1 1 0 01-2 0V9a1 1 0 012 0v10zm5-17v2H2V2h5.711c.9 0 1.631-1.099 1.631-2h5.315c0 .901.73 2 1.631 2H22zm-3 4v16H5V6H3v18h18V6h-2z"></path></svg>

data/app/assets/images/essence/icon_component/upload.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="M10 9H4l8-9 8 9h-6v11h-4V9zm11 11v2H3v-2H1v4h22v-4h-2z"></path></svg>

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

@@ -0,0 +1 @@

+ <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M8 4.5L4.5 8l16 16 3.5-3.5-16-16zm2.4 7.7L6.3 8 8 6.3l4.2 4.2-1.8 1.7zM15 7c.2-.2.5-1.3.8-2.7 1.3-.3 2.5-.6 2.7-.8-.2-.2-1.3-.5-2.7-.8-.3-1.4-.6-2.5-.8-2.7-.2.2-.5 1.3-.8 2.7-1.3.3-2.5.6-2.7.8.2.2 1.3.5 2.7.8.3 1.4.6 2.5.8 2.7zM4 13c-.2.2-.5 1.3-.8 2.7-1.3.3-2.5.6-2.7.8.2.2 1.3.5 2.7.8.3 1.4.6 2.5.8 2.7.2-.2.5-1.3.8-2.7 1.3-.3 2.5-.6 2.7-.8-.2-.2-1.3-.5-2.7-.8-.3-1.3-.6-2.5-.8-2.7zm-.5-7c.2-.2.5-1.2.7-2.3 1.1-.2 2.1-.5 2.3-.7-.2-.2-1.2-.5-2.3-.7C4 1.2 3.7.2 3.5 0c-.2.2-.5 1.2-.7 2.3-1.1.2-2.1.5-2.3.7.2.2 1.2.5 2.3.7.2 1.1.5 2.1.7 2.3zM2 11c.1-.1.2-.6.4-1.1.6-.1 1.1-.3 1.1-.4-.1-.1-.6-.2-1.1-.4-.2-.5-.3-1-.4-1.1-.1.1-.2.6-.4 1.1-.5.2-1 .3-1.1.4.1.1.6.2 1.1.4.2.5.3 1 .4 1.1z"></path></svg>

data/app/assets/stylesheets/essence/beyond/_base.scss ADDED Viewed

@@ -0,0 +1,52 @@
+: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;
+  -moz-osx-font-smoothing: grayscale;
+  font-size: 14px;
+  color: var(--workspace-text);
+  line-height: 1.5;
+}
+html,
+body {
+  background-color: var(--workspace-background);
+  padding: 0;
+  margin: 0;
+}
+body * {
+  font-family: inherit;
+  -webkit-font-smoothing: inherit;
+  -moz-osx-font-smoothing: inherit;
+  font-size: inherit;
+  color: inherit;
+}
+*,
+*::before,
+*::after {
+  box-sizing: border-box;
+}
+h1,
+h2,
+h3 {
+  margin: 0;
+}
+h1 {
+  font-size: 160%;
+}
+h2 {
+  font-size: 140%;
+}
+h3 {
+  font-size: 120%;
+}

data/app/assets/stylesheets/essence/beyond/components/_index.scss ADDED Viewed

@@ -0,0 +1,17 @@
+@import '../../../../../components/essence/action_bar_component/action_bar_component';
+@import '../../../../../components/essence/app_info_component/app_info_component';
+@import '../../../../../components/essence/breadcrumb_component/breadcrumb_component';
+@import '../../../../../components/essence/button_component/button_component';
+@import '../../../../../components/essence/card_component/card_component';
+@import '../../../../../components/essence/clipboard_copy_component/clipboard_copy_component';
+@import '../../../../../components/essence/empty_state_component/empty_state_component';
+@import '../../../../../components/essence/link_component/link_component';
+@import '../../../../../components/essence/notification_component/notification_component';
+@import '../../../../../components/essence/paragraph_component/paragraph_component';
+@import '../../../../../components/essence/scroll_shadow_component/scroll_shadow_component';
+@import '../../../../../components/essence/spinner_component/spinner_component';
+@import '../../../../../components/essence/status_component/status_component';
+@import '../../../../../components/essence/step_list_component/step_list_component';
+@import '../../../../../components/essence/table_component/table_component';
+@import '../../../../../components/essence/title_component/title_component';
+@import '../../../../../components/essence/tooltip_component/tooltip_component';

data/app/assets/stylesheets/essence/beyond/layout/_content.scss ADDED Viewed

@@ -0,0 +1,9 @@
+.content {
+  padding: 25px 25px 100px;
+}
+.action-bar {
+  & + .content {
+    padding-top: 12px;
+  }
+}

data/app/assets/stylesheets/essence/beyond/layout/_index.scss ADDED Viewed

	@@ -0,0 +1 @@
1	+ @import 'content';

data/app/assets/stylesheets/essence/beyond/simple_form/_control.scss ADDED Viewed

@@ -0,0 +1,172 @@
+.form {
+  &-control {
+    &.country,
+    &.numeric,
+    &.password,
+    &.select,
+    &.string {
+      background-color: var(--inputField-background);
+      border: 1px solid var(--inputField-border);
+      border-radius: var(--inputField-borderRadius);
+      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);
+      }
+    }
+    &.numeric,
+    &.password,
+    &.string {
+      &:read-only {
+        background-color: var(--inputField-background-disabled);
+        color: var(--inputField-text-disabled);
+        border-color: var(--inputField-border);
+      }
+    }
+    &.select {
+      -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;
+    }
+    &.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: .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);
+        }
+      }
+    }
+  }
+}

data/app/assets/stylesheets/essence/beyond/simple_form/_error.scss ADDED Viewed

@@ -0,0 +1,27 @@
+.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;
+    &::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.scss ADDED Viewed

@@ -0,0 +1,34 @@
+.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.scss ADDED Viewed

@@ -0,0 +1,6 @@
+.form {
+  &-group {
+    align-items: center;
+    display: flex;
+  }
+}

data/app/assets/stylesheets/essence/beyond/simple_form/_hint.scss ADDED Viewed

@@ -0,0 +1,8 @@
+.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/_index.scss ADDED Viewed

@@ -0,0 +1,43 @@
+:root {
+  --formGroup-label:                   gray;
+  --formGroup-validation-error:        #da3c3c;
+  --formGroup-validation-text:         white;
+  --formGroup-validation-borderRadius: 3px;
+  --inputField-borderRadius:        3px;
+  --inputField-border:              #d2d2d2;
+  --inputField-border-focus:        orange;
+  --inputField-text:                #3e3e3e;
+  --inputField-background:          white;
+  --inputField-background-focus:    white;
+  --inputField-background-disabled: #f5f5f5;
+  --inputField-text-disabled:       #9a9a9a;
+  --inputField-placeholder-text:    #a4a4a4;
+  --inputField-hint-text:           gray;
+  --smartInputField-suggestion-active:  #b3ecff;
+  --smartInputField-value-background:   #d9d9d9;
+  --smartInputField-value-text:         #666666;
+  --smartInputField-value-icon:         currentColor;
+  --smartInputField-value-icon-hover:   #4d4d4d;
+  --smartInputField-value-borderRadius: 3px;
+  --check-color:         #97c344;
+  --uncheck-color:       #b3b3b3;
+  --check-disabled-text: #c5c5c5;
+  --check-disabled-icon: #d9d9d9;
+  --flipSwitch-unchecked-background: #b3b3b3;
+  --flipSwitch-checked-background:   #97c344;
+  --flipSwitch-border:               #c0c0c0;
+  --flipSwitch-label:                gray;
+  --flipSwitch-text:                 silver;
+}
+@import 'control';
+@import 'error';
+@import 'fieldset';
+@import 'group';
+@import 'hint';
+@import 'label';
+@import 'wrapper';

data/app/assets/stylesheets/essence/beyond/simple_form/_label.scss ADDED Viewed

@@ -0,0 +1,26 @@
+.form {
+  &-label {
+    &.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;
+    }
+  }
+}

data/app/assets/stylesheets/essence/beyond/simple_form/_wrapper.scss ADDED Viewed

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

data/app/assets/stylesheets/essence/beyond.scss ADDED Viewed

@@ -0,0 +1,4 @@
+@import 'beyond/base';
+@import 'beyond/components';
+@import 'beyond/layout';
+@import 'beyond/simple_form';

data/app/components/essence/action_bar_component/action_bar_component.html.erb ADDED Viewed

@@ -0,0 +1,16 @@
+<% content_for :action_bar do %>
+  <div <%= tag.attributes **html_options %>>
+    <div class="action-bar-wrapper">
+      <div class="action-bar-left-content">
+        <% left_components.each do |component| %>
+          <%= component %>
+        <% end %>
+      </div>
+      <div class="action-bar-right-content">
+        <% right_components.each do |component| %>
+          <%= component %>
+        <% end %>
+      </div>
+    </div>
+  </div>
+<% end %>