lookbook 1.5.2 → 2.3.7

data/app/views/lookbook/pages/show.html.erb

@@ -1,43 +1,98 @@
-<div class="px-4 md:px-10 pt-8 md:pt-10 overflow-auto scroll-smooth w-full max-h-full pb-12" x-ref="scroller">
-  <div class="w-full max-w-screen-lg mx-auto h-full flex flex-col">
-    <% if @page.header? %>
-      <header id="page-header" class="mb-8 prose max-w-none flex-none">
-        <h1><%= @page.title %></h1>
-      </header>
-    <% end %>
+<main
+  class="h-[calc(100vh_-_40px)]"
+  x-data="{}"
+  @navigation:complete.window="$refs.scroller.scrollTop = 0">
+  <div id="page" class="h-full bg-lookbook-page-bg relative">
+    <div class="overflow-auto scroll-smooth w-full max-h-full pb-12" x-ref="scroller">
+      <div class="h-full flex flex-col">
+        <% if @page.header? %>
+          <header id="page-header"
+            class="px-4 md:px-10 mb-8 pt-8 md:pt-10 lg:pt-12 pb-6 lg:pb-8 lg:mb-9 bg-lookbook-page-header-bg border-b border-lookbook-page-header-border relative">
+            <div class="w-full max-w-screen-lg mx-auto">
+              <%= lookbook_render :prose, size: :md, markdown: false, class: "bg-transparent max-w-none flex-none" do %>
+                <h1 class="text-lookbook-page-header-text"><%= @page.title %></h1>
+              <% end %>
+            </div>
+            <% unless @error %>
+              <div class="absolute top-0 right-0 pt-1 pr-0 pl-1 pb-1 rounded-bl-md">
+                <div class="bg-transparent opacity-90 absolute inset-0 w-full h-full z-0"></div>
+                <div class="relative z-10 flex items-center scale-75 -mt-1 -mr-1.5 md:scale-100 md:mt-0 md:-mr-[2px]">
 
-    <%= lookbook_render :prose, id: "page-content", markdown: false, class: "max-w-none flex-none" do %>
-      <%= @page_content %>
-    <% end %>
+                <% if @previous_page %>
+                  <%= lookbook_render :icon_button,
+                    size: :lg,
+                    icon: :chevron_left,
+                    tooltip: "Previous page",
+                    href: lookbook_page_path(@previous_page.lookup_path),
+                    class: "pr-0.5 bg-transparent" %>
+                <% else %>
+                  <%= lookbook_render :icon_button,
+                    size: :lg,
+                    icon: :chevron_left,
+                    disabled: true,
+                    class: "opacity-50 !cursor-default pr-0.5 bg-transparent" %>
+                <% end %>
 
-    <% if @page.sections.any? %>
-      <%= lookbook_render :page_tabs, id: "page-tabbed-sections", markdown: false, class: "mt-6" do |page_tabs| %>
-        <% @page.sections.each do |section| %>
-          <% page_tabs.with_tab name: "page-section-#{section.name}", label: section.label do %>
-            <%= page_controller.render_page(section) %>
-          <% end %>
+                <% if @next_page %>
+                  <%= lookbook_render :icon_button,
+                    size: :lg,
+                    icon: :chevron_right,
+                    tooltip: "Next page",
+                    href: lookbook_page_path(@next_page.lookup_path),
+                    class: "pl-0.5 bg-transparent" %>
+                <% else %>
+                  <%= lookbook_render :icon_button,
+                    size: :lg,
+                    icon: :chevron_right,
+                    disabled: true,
+                    class: "opacity-50 !cursor-default pl-0.5 bg-transparent" %>
+                <% end %>
+                </div>
+              </div>
+            <% end %>
+          </header>
         <% end %>
-      <% end %>
-    <% end %>
 
-    <% if @page.footer? && @pages.many? %>
-      <footer id="page-footer" class="flex items-center justify-between border-t border-gray-300 mt-12 pt-8 pb-10 ">
-        <% if @previous_page %>
-          <a href="<%= lookbook_page_path @previous_page.lookup_path %>"
-            class="flex items-center flex-none">
-            <%= icon  :arrow_left, size: 4, class: "hover:text-indigo-800" %>
-            <span class="ml-2 underline"><%= @previous_page.title %></span>
-          </a>
-        <% end %>
+        <div class="px-4 md:px-10 min-h-[calc(100vh_-_400px)]">
+          <div class="w-full max-w-screen-lg mx-auto">
+            <%= lookbook_render :prose, size: :md, id: "page-content", markdown: false, class: "max-w-none flex-none" do %>
+              <%= @page_content %>
+            <% end %>
+
+            <% if @page.sections.any? %>
+              <%= lookbook_render :page_tabs, id: "page-tabbed-sections", markdown: false, class: "mt-6 lg:mt-8" do |page_tabs| %>
+                <% @page.sections.each do |section| %>
+                  <% page_tabs.with_tab name: "page-section-#{section.name}", label: section.label do %>
+                    <%= page_controller.render_page(section) %>
+                  <% end %>
+                <% end %>
+              <% end %>
+            <% end %>
+          </div>
+        </div>
+
+        <% if @page.footer? && @pages.many? %>
+          <footer id="page-footer" class="mt-12 lg:mt-16 px-4 md:px-10">
+          <div class=" border-t border-gray-300 w-full max-w-screen-lg mx-auto pt-8 pb-10 flex items-center justify-between ">
+            <% if @previous_page %>
+              <a href="<%= lookbook_page_path @previous_page.lookup_path %>"
+                class="flex items-center flex-none max-w-[40%] overflow-hidden">
+                <%= icon  :arrow_left, size: 4, class: "hover:text-indigo-800" %>
+                <span class="ml-2 underline truncate"><%= @previous_page.title %></span>
+              </a>
+            <% end %>
 
-        <% if @next_page %>
-          <a href="<%= lookbook_page_path @next_page.lookup_path %>"
-            class="flex items-center flex-none ml-auto">
-            <span class="mr-2 underline"><%= @next_page.title %></span>
-            <%= icon  :arrow_right, size: 4, class: "hover:text-indigo-800" %>
-          </a>
+            <% if @next_page %>
+              <a href="<%= lookbook_page_path @next_page.lookup_path %>"
+                class="flex items-center flex-none ml-auto max-w-[40%] overflow-hidden">
+                <span class="mr-2 underline truncate"><%= @next_page.title %></span>
+                <%= icon  :arrow_right, size: 4, class: "hover:text-indigo-800" %>
+              </a>
+            <% end %>
+          </div>
+          </footer>
         <% end %>
-      </footer>
-    <% end %>
+      </div>
+    </div>
   </div>
-</div>
+</main>

data/app/views/lookbook/partials/_blank_slate.html.erb

@@ -0,0 +1,7 @@
+<div class="flex justify-center w-full h-full bg-checked">
+  <div class="px-4 py-6 xs:py-8 sm:p-8 md:p-12">
+    <div class="w-full xs:w-auto xs:mx-auto xs:min-w-[440px] xs:max-w-[680px]">
+      <%= yield %>
+    </div>
+  </div>
+</div>

data/app/views/lookbook/partials/_iframe_content_scripts.html.erb

@@ -0,0 +1 @@
+<script src="<%= lookbook_asset_path("/js/iframe.js") %>" defer></script>

data/app/views/lookbook/partials/_user_styles.html.erb

@@ -0,0 +1,5 @@
+<% if content_for? :user_styles %>
+  <style media="all" id="user-styles">
+    <%= content_for :user_styles -%>
+  </style>
+<% end %>

data/app/views/lookbook/previews/group.html.erb

@@ -0,0 +1,15 @@
+<% if scenarios.many? %>
+  <% scenarios = scenarios.filter(&:visible?) %>
+  <%# Render a group of scenarios %>
+  <% scenarios.each do |scenario| %>
+    <div style="margin-bottom: 30px !important; display: block !important;">
+      <h6 style="all: unset; display: block; color: #555; font-family: sans-serif; font-size: 14px; margin-top: 0; margin-bottom: 10px;">
+        <%= scenario.label %>
+      </h6>
+      <%= scenario.output %>
+    </div>
+  <% end %>
+<% else %>
+  <%# Render a single scenario %>
+  <%= scenarios.first.output %>
+<% end %>

data/app/views/lookbook/previews/preview.html.erb

@@ -0,0 +1,13 @@
+<% if @render_args[:component] %>
+  <% if defined?(Phlex::SGML) && @render_args[:component].is_a?(Phlex::SGML) %>
+    <% if @render_args[:component].method(:call).parameters.include?([:key, :context])%>
+      <%= raw(@render_args[:component].call(context: { rails_view_context: self }, &@render_args[:block])) %>
+    <% else %>
+      <%= raw(@render_args[:component].call(view_context: self, &@render_args[:block])) %>
+    <% end %>
+  <% else %>
+    <%= render(@render_args[:component], @render_args[:args], &@render_args[:block]) %>
+  <% end %>
+<% else %>
+  <%= render(@render_args[:template], **@render_args[:locals], &@render_args[:block]) %>
+<% end %>

data/app/views/lookbook/previews/show.html.erb

@@ -0,0 +1 @@
+ <%= @preview_html %>

data/assets/css/fonts.css

@@ -0,0 +1,33 @@
+@font-face {
+  font-family: "Inter var";
+  font-weight: 100 900;
+  font-display: swap;
+  font-style: normal;
+  font-named-instance: "Regular";
+  src: url("../fonts/Inter-roman.var.woff2?v=3.19") format("woff2");
+}
+
+@font-face {
+  font-family: "Inter var";
+  font-weight: 100 900;
+  font-display: swap;
+  font-style: italic;
+  font-named-instance: "Italic";
+  src: url("../fonts/Inter-italic.var.woff2?v=3.19") format("woff2");
+}
+
+@font-face {
+  font-family: "Source Code Variable";
+  font-weight: 200 900;
+  font-style: normal;
+  font-stretch: normal;
+  src: url("../fonts/SourceCodeVariable-Roman.ttf.woff2") format("woff2");
+}
+
+@font-face {
+  font-family: "Source Code Variable";
+  font-weight: 200 900;
+  font-style: italic;
+  font-stretch: normal;
+  src: url("../fonts/SourceCodeVariable-Italic.ttf.woff2") format("woff2");
+}

data/{app/assets/lookbook → assets}/css/lookbook.css

@@ -1,14 +1,15 @@
+@import "./fonts.css";
 @import "tailwindcss/base";
 @import "tailwindcss/components";
 @import "tailwindcss/utilities";
 
 @import "./tooltip.css";
 
-@import-glob "../../../components/lookbook/**/*/component.css";
+@import-glob "../../app/components/lookbook/**/*/component.css";
 
 @layer base {
   html {
-    @apply scroll-smooth h-screen;
+    @apply scroll-smooth h-screen w-screen;
   }
 
   @media screen and (prefers-reduced-motion: reduce) {
@@ -18,7 +19,7 @@
   }
 
   body {
-    @apply text-lookbook-text font-sans text-sm antialiased overflow-hidden;
+    @apply text-lookbook-text font-ui text-sm overflow-hidden w-screen;
   }
 
   [x-cloak] {
@@ -46,6 +47,12 @@
   }
 }
 
+@layer utilities {
+  .bg-checked {
+    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' viewBox='0 0 8 8'%3E%3Cg fill='%23f3f3f3' fill-opacity='1'%3E%3Cpath fill-rule='evenodd' d='M0 0h4v4H0V0zm4 4h4v4H4V4z'/%3E%3C/g%3E%3C/svg%3E");
+  }
+}
+
 @layer components {
   [type="text"],
   [type="email"],
@@ -126,4 +133,17 @@
   input[type="color"]::-webkit-color-swatch {
     @apply border-0 rounded-lg;
   }
+
+  select.compact {
+    font-size: 0.8rem;
+    line-height: 1.1rem;
+    border-radius: 0.375rem;
+    padding: 0.26rem 1.5rem 0.26rem 0.6rem;
+    background-size: 1.2em 1.2em;
+    background-position: right 0.4rem center;
+  }
+
+  #inspector .split-layout-gutter-horizontal {
+    top: 4px;
+  }
 }

data/{app/assets/lookbook → assets}/css/themes/blue.css

@@ -25,8 +25,14 @@
   --lookbook-draggable-hint: rgb(224 231 255 / 0.2);
   --lookbook-icon-button-stroke: var(--lookbook-base-400);
   --lookbook-icon-button-stroke-hover: var(--lookbook-accent-600);
+  --lookbook-button-bg: var(--lookbook-accent-500);
+  --lookbook-button-bg-hover: var(--lookbook-accent-600);
+  --lookbook-button-text: var(--lookbook-white);
   --lookbook-tooltip-bg: var(--lookbook-accent-500);
   --lookbook-tooltip-text: var(--lookbook-white);
+  --lookbook-dropdown-bg: var(--lookbook-toolbar-bg);
+  --lookbook-dropdown-text: var(--lookbook-text);
+  --lookbook-dropdown-divider: var(--lookbook-divider);
   --lookbook-scrollbar: var(--lookbook-base-200);
   --lookbook-scrollbar-hover: var(--lookbook-base-300);
   --lookbook-toolbar-bg: var(--lookbook-white);
@@ -61,6 +67,13 @@
   --lookbook-header-bg: var(--lookbook-accent-600);
   --lookbook-header-text: var(--lookbook-white);
   --lookbook-header-border: var(--lookbook-accent-700);
-  --lookbook-blank-slate-title: var(--lookbook-accent-600);
+  --lookbook-message-bg: var(--lookbook-white);
+  --lookbook-message-border: var(--lookbook-divider);
+  --lookbook-message-title: var(--lookbook-base-600);
+  --lookbook-message-text: var(--lookbook-text);
+  --lookbook-page-header-bg: var(--lookbook-base-50);
+  --lookbook-page-header-text: var(--lookbook-text);
+  --lookbook-page-header-border: var(--lookbook-divider);
+  --lookbook-embed-title: var(--lookbook-text);
   --lookbook-branding-text: var(--lookbook-header-text);
 }

data/{app/assets/lookbook → assets}/css/themes/green.css

@@ -25,8 +25,14 @@
   --lookbook-draggable-hint: rgb(224 231 255 / 0.2);
   --lookbook-icon-button-stroke: var(--lookbook-base-400);
   --lookbook-icon-button-stroke-hover: var(--lookbook-accent-600);
+  --lookbook-button-bg: var(--lookbook-accent-500);
+  --lookbook-button-bg-hover: var(--lookbook-accent-600);
+  --lookbook-button-text: var(--lookbook-white);
   --lookbook-tooltip-bg: var(--lookbook-accent-500);
   --lookbook-tooltip-text: var(--lookbook-white);
+  --lookbook-dropdown-bg: var(--lookbook-toolbar-bg);
+  --lookbook-dropdown-text: var(--lookbook-text);
+  --lookbook-dropdown-divider: var(--lookbook-divider);
   --lookbook-scrollbar: var(--lookbook-base-200);
   --lookbook-scrollbar-hover: var(--lookbook-base-300);
   --lookbook-toolbar-bg: var(--lookbook-white);
@@ -61,6 +67,13 @@
   --lookbook-header-bg: var(--lookbook-accent-600);
   --lookbook-header-text: var(--lookbook-white);
   --lookbook-header-border: var(--lookbook-accent-700);
-  --lookbook-blank-slate-title: var(--lookbook-accent-600);
+  --lookbook-message-bg: var(--lookbook-white);
+  --lookbook-message-border: var(--lookbook-divider);
+  --lookbook-message-title: var(--lookbook-base-600);
+  --lookbook-message-text: var(--lookbook-text);
+  --lookbook-page-header-bg: var(--lookbook-base-50);
+  --lookbook-page-header-text: var(--lookbook-text);
+  --lookbook-page-header-border: var(--lookbook-divider);
+  --lookbook-embed-title: var(--lookbook-text);
   --lookbook-branding-text: var(--lookbook-header-text);
 }

data/{app/assets/lookbook → assets}/css/themes/indigo.css

@@ -25,8 +25,14 @@
   --lookbook-draggable-hint: rgb(224 231 255 / 0.2);
   --lookbook-icon-button-stroke: var(--lookbook-base-400);
   --lookbook-icon-button-stroke-hover: var(--lookbook-accent-600);
+  --lookbook-button-bg: var(--lookbook-accent-500);
+  --lookbook-button-bg-hover: var(--lookbook-accent-600);
+  --lookbook-button-text: var(--lookbook-white);
   --lookbook-tooltip-bg: var(--lookbook-accent-500);
   --lookbook-tooltip-text: var(--lookbook-white);
+  --lookbook-dropdown-bg: var(--lookbook-toolbar-bg);
+  --lookbook-dropdown-text: var(--lookbook-text);
+  --lookbook-dropdown-divider: var(--lookbook-divider);
   --lookbook-scrollbar: var(--lookbook-base-200);
   --lookbook-scrollbar-hover: var(--lookbook-base-300);
   --lookbook-toolbar-bg: var(--lookbook-white);
@@ -61,6 +67,13 @@
   --lookbook-header-bg: var(--lookbook-accent-600);
   --lookbook-header-text: var(--lookbook-white);
   --lookbook-header-border: var(--lookbook-accent-700);
-  --lookbook-blank-slate-title: var(--lookbook-accent-600);
+  --lookbook-message-bg: var(--lookbook-white);
+  --lookbook-message-border: var(--lookbook-divider);
+  --lookbook-message-title: var(--lookbook-base-600);
+  --lookbook-message-text: var(--lookbook-text);
+  --lookbook-page-header-bg: var(--lookbook-base-50);
+  --lookbook-page-header-text: var(--lookbook-text);
+  --lookbook-page-header-border: var(--lookbook-divider);
+  --lookbook-embed-title: var(--lookbook-text);
   --lookbook-branding-text: var(--lookbook-header-text);
 }

data/{app/assets/lookbook → assets}/css/themes/rose.css

@@ -25,8 +25,14 @@
   --lookbook-draggable-hint: rgb(224 231 255 / 0.2);
   --lookbook-icon-button-stroke: var(--lookbook-base-400);
   --lookbook-icon-button-stroke-hover: var(--lookbook-accent-600);
+  --lookbook-button-bg: var(--lookbook-accent-500);
+  --lookbook-button-bg-hover: var(--lookbook-accent-600);
+  --lookbook-button-text: var(--lookbook-white);
   --lookbook-tooltip-bg: var(--lookbook-accent-500);
   --lookbook-tooltip-text: var(--lookbook-white);
+  --lookbook-dropdown-bg: var(--lookbook-toolbar-bg);
+  --lookbook-dropdown-text: var(--lookbook-text);
+  --lookbook-dropdown-divider: var(--lookbook-divider);
   --lookbook-scrollbar: var(--lookbook-base-200);
   --lookbook-scrollbar-hover: var(--lookbook-base-300);
   --lookbook-toolbar-bg: var(--lookbook-white);
@@ -61,6 +67,13 @@
   --lookbook-header-bg: var(--lookbook-accent-600);
   --lookbook-header-text: var(--lookbook-white);
   --lookbook-header-border: var(--lookbook-accent-700);
-  --lookbook-blank-slate-title: var(--lookbook-accent-600);
+  --lookbook-message-bg: var(--lookbook-white);
+  --lookbook-message-border: var(--lookbook-divider);
+  --lookbook-message-title: var(--lookbook-base-600);
+  --lookbook-message-text: var(--lookbook-text);
+  --lookbook-page-header-bg: var(--lookbook-base-50);
+  --lookbook-page-header-text: var(--lookbook-text);
+  --lookbook-page-header-border: var(--lookbook-divider);
+  --lookbook-embed-title: var(--lookbook-text);
   --lookbook-branding-text: var(--lookbook-header-text);
 }

data/{app/assets/lookbook → assets}/css/themes/zinc.css

@@ -25,8 +25,14 @@
   --lookbook-draggable-hint: rgb(224 231 255 / 0.2);
   --lookbook-icon-button-stroke: var(--lookbook-base-400);
   --lookbook-icon-button-stroke-hover: var(--lookbook-accent-600);
+  --lookbook-button-bg: var(--lookbook-accent-500);
+  --lookbook-button-bg-hover: var(--lookbook-accent-600);
+  --lookbook-button-text: var(--lookbook-white);
   --lookbook-tooltip-bg: var(--lookbook-accent-500);
   --lookbook-tooltip-text: var(--lookbook-white);
+  --lookbook-dropdown-bg: var(--lookbook-toolbar-bg);
+  --lookbook-dropdown-text: var(--lookbook-text);
+  --lookbook-dropdown-divider: var(--lookbook-divider);
   --lookbook-scrollbar: var(--lookbook-base-200);
   --lookbook-scrollbar-hover: var(--lookbook-base-300);
   --lookbook-toolbar-bg: var(--lookbook-white);
@@ -61,6 +67,13 @@
   --lookbook-header-bg: var(--lookbook-accent-600);
   --lookbook-header-text: var(--lookbook-white);
   --lookbook-header-border: var(--lookbook-accent-700);
-  --lookbook-blank-slate-title: var(--lookbook-accent-600);
+  --lookbook-message-bg: var(--lookbook-white);
+  --lookbook-message-border: var(--lookbook-divider);
+  --lookbook-message-title: var(--lookbook-base-600);
+  --lookbook-message-text: var(--lookbook-text);
+  --lookbook-page-header-bg: var(--lookbook-base-50);
+  --lookbook-page-header-text: var(--lookbook-text);
+  --lookbook-page-header-border: var(--lookbook-divider);
+  --lookbook-embed-title: var(--lookbook-text);
   --lookbook-branding-text: var(--lookbook-header-text);
 }

data/{app/assets/lookbook → assets}/css/tooltip.css

@@ -25,26 +25,29 @@
 }
 
 .tippy-box[data-theme~="menu"] {
-  border: 1px solid theme("colors.gray.300");
-  @apply bg-white text-gray-600 shadow-lg;
+  @apply shadow-lg !max-w-none;
+
+  border: 1px solid var(--lookbook-dropdown-divider);
+  color: var(--lookbook-dropdown-text);
+  background: var(--lookbook-dropdown-bg);
 
   & > .tippy-content {
     @apply rounded p-0 overflow-hidden;
   }
 
   &[data-placement^="top"] > .tippy-arrow::before {
-    border-top-color: white;
+    border-top-color: var(--lookbook-dropdown-bg);
   }
 
   &[data-placement^="bottom"] > .tippy-arrow::before {
-    border-bottom-color: white;
+    border-bottom-color: var(--lookbook-dropdown-bg);
   }
 
   &[data-placement^="left"] > .tippy-arrow::before {
-    border-left-color: white;
+    border-left-color: var(--lookbook-dropdown-bg);
   }
 
   &[data-placement^="right"] > .tippy-arrow::before {
-    border-right-color: white;
+    border-right-color: var(--lookbook-dropdown-bg);
   }
 }

data/assets/icons/accessibility.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><circle cx="16" cy="4" r="1"/><path d="m18 19 1-7-5.87.94"/><path d="m5 8 3-3 5.5 3-2.21 3.1"/><path d="M4.24 14.48c-.19.58-.27 1.2-.23 1.84a5 5 0 0 0 5.31 4.67c.65-.04 1.25-.2 1.8-.46"/><path d="M13.76 17.52c.19-.58.27-1.2.23-1.84a5 5 0 0 0-5.31-4.67c-.65.04-1.25.2-1.8.46"/></svg>

data/assets/icons/activity.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><polyline points="22 12 18 12 15 21 9 3 6 12 2 12"/></svg>

data/assets/icons/air-vent.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M6 12H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2v5a2 2 0 0 1-2 2h-2"/><path d="M6 8h12"/><path d="M18.3 17.7a2.5 2.5 0 0 1-3.16 3.83 2.53 2.53 0 0 1-1.14-2V12"/><path d="M6.6 15.6A2 2 0 1 0 10 17v-5"/></svg>

data/assets/icons/airplay.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M5 17H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2v10a2 2 0 0 1-2 2h-1"/><polygon points="12 15 17 21 7 21 12 15"/></svg>

data/assets/icons/alarm-check.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M12 21a8 8 0 1 0 0-16 8 8 0 0 0 0 16z"/><path d="M5 3 2 6"/><path d="m22 6-3-3"/><path d="m6 19-2 2"/><path d="m18 19 2 2"/><path d="m9 13 2 2 4-4"/></svg>

data/assets/icons/alarm-clock-off.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M6.87 6.87a8 8 0 1 0 11.26 11.26"/><path d="M19.9 14.25A7.44 7.44 0 0 0 20 13a8 8 0 0 0-8-8 7.44 7.44 0 0 0-1.25.1"/><path d="m22 6-3-3"/><path d="m6 19-2 2"/><path d="m2 2 20 20"/><path d="M4 4 2 6"/></svg>

data/assets/icons/alarm-clock.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><circle cx="12" cy="13" r="8"/><path d="M12 9v4l2 2"/><path d="M5 3 2 6"/><path d="m22 6-3-3"/><path d="m6 19-2 2"/><path d="m18 19 2 2"/></svg>

data/assets/icons/alarm-minus.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M12 21a8 8 0 1 0 0-16 8 8 0 0 0 0 16z"/><path d="M5 3 2 6"/><path d="m22 6-3-3"/><path d="m6 19-2 2"/><path d="m18 19 2 2"/><path d="M9 13h6"/></svg>

data/assets/icons/alarm-plus.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M12 21a8 8 0 1 0 0-16 8 8 0 0 0 0 16z"/><path d="M5 3 2 6"/><path d="m22 6-3-3"/><path d="m6 19-2 2"/><path d="m18 19 2 2"/><path d="M12 10v6"/><path d="M9 13h6"/></svg>

data/assets/icons/album.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><rect x="3" y="3" width="18" height="18" rx="2" ry="2"/><polyline points="11 3 11 11 14 8 17 11 17 3"/></svg>

data/assets/icons/alert-circle.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><circle cx="12" cy="12" r="10"/><line x1="12" y1="8" x2="12" y2="12"/><line x1="12" y1="16" x2="12.01" y2="16"/></svg>

data/assets/icons/alert-octagon.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><polygon points="7.86 2 16.14 2 22 7.86 22 16.14 16.14 22 7.86 22 2 16.14 2 7.86 7.86 2"/><line x1="12" y1="8" x2="12" y2="12"/><line x1="12" y1="16" x2="12.01" y2="16"/></svg>

data/assets/icons/alert-triangle.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3Z"/><line x1="12" y1="9" x2="12" y2="13"/><line x1="12" y1="17" x2="12.01" y2="17"/></svg>

data/assets/icons/align-center-horizontal.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M2 12h20"/><path d="M10 16v4a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2v-4"/><path d="M10 8V4a2 2 0 0 0-2-2H6a2 2 0 0 0-2 2v4"/><path d="M20 16v1a2 2 0 0 1-2 2h-2a2 2 0 0 1-2-2v-1"/><path d="M14 8V7c0-1.1.9-2 2-2h2a2 2 0 0 1 2 2v1"/></svg>

data/assets/icons/align-center-vertical.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M12 2v20"/><path d="M8 10H4a2 2 0 0 1-2-2V6c0-1.1.9-2 2-2h4"/><path d="M16 10h4a2 2 0 0 0 2-2V6a2 2 0 0 0-2-2h-4"/><path d="M8 20H7a2 2 0 0 1-2-2v-2c0-1.1.9-2 2-2h1"/><path d="M16 14h1a2 2 0 0 1 2 2v2a2 2 0 0 1-2 2h-1"/></svg>

data/assets/icons/align-center.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><line x1="21" y1="6" x2="3" y2="6"/><line x1="17" y1="12" x2="7" y2="12"/><line x1="19" y1="18" x2="5" y2="18"/></svg>

data/assets/icons/align-end-horizontal.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><rect x="4" y="2" width="6" height="16" rx="2"/><rect x="14" y="9" width="6" height="9" rx="2"/><path d="M22 22H2"/></svg>

data/assets/icons/align-end-vertical.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><rect x="2" y="4" width="16" height="6" rx="2"/><rect x="9" y="14" width="9" height="6" rx="2"/><path d="M22 22V2"/></svg>

data/assets/icons/align-horizontal-distribute-center.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><rect x="4" y="5" width="6" height="14" rx="2"/><rect x="14" y="7" width="6" height="10" rx="2"/><path d="M17 22v-5"/><path d="M17 7V2"/><path d="M7 22v-3"/><path d="M7 5V2"/></svg>

data/assets/icons/align-horizontal-distribute-end.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><rect x="4" y="5" width="6" height="14" rx="2"/><rect x="14" y="7" width="6" height="10" rx="2"/><path d="M10 2v20"/><path d="M20 2v20"/></svg>

data/assets/icons/align-horizontal-distribute-start.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><rect x="4" y="5" width="6" height="14" rx="2"/><rect x="14" y="7" width="6" height="10" rx="2"/><path d="M4 2v20"/><path d="M14 2v20"/></svg>

data/assets/icons/align-horizontal-justify-center.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><rect x="2" y="5" width="6" height="14" rx="2"/><rect x="16" y="7" width="6" height="10" rx="2"/><path d="M12 2v20"/></svg>

data/assets/icons/align-horizontal-justify-end.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><rect x="2" y="5" width="6" height="14" rx="2"/><rect x="12" y="7" width="6" height="10" rx="2"/><path d="M22 2v20"/></svg>

data/assets/icons/align-horizontal-justify-start.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><rect x="6" y="5" width="6" height="14" rx="2"/><rect x="16" y="7" width="6" height="10" rx="2"/><path d="M2 2v20"/></svg>

data/assets/icons/align-horizontal-space-around.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><rect x="9" y="7" width="6" height="10" rx="2"/><path d="M4 22V2"/><path d="M20 22V2"/></svg>

data/assets/icons/align-horizontal-space-between.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><rect x="3" y="5" width="6" height="14" rx="2"/><rect x="15" y="7" width="6" height="10" rx="2"/><path d="M3 2v20"/><path d="M21 2v20"/></svg>

data/assets/icons/align-justify.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><line x1="3" y1="6" x2="21" y2="6"/><line x1="3" y1="12" x2="21" y2="12"/><line x1="3" y1="18" x2="21" y2="18"/></svg>

data/assets/icons/align-left.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><line x1="21" y1="6" x2="3" y2="6"/><line x1="15" y1="12" x2="3" y2="12"/><line x1="17" y1="18" x2="3" y2="18"/></svg>

data/assets/icons/align-right.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><line x1="21" y1="6" x2="3" y2="6"/><line x1="21" y1="12" x2="9" y2="12"/><line x1="21" y1="18" x2="7" y2="18"/></svg>

data/assets/icons/align-start-horizontal.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><rect x="4" y="6" width="6" height="16" rx="2"/><rect x="14" y="6" width="6" height="9" rx="2"/><path d="M22 2H2"/></svg>

data/assets/icons/align-start-vertical.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><rect x="6" y="14" width="9" height="6" rx="2"/><rect x="6" y="4" width="16" height="6" rx="2"/><path d="M2 2v20"/></svg>

data/assets/icons/align-vertical-distribute-center.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><rect x="5" y="14" width="14" height="6" rx="2"/><rect x="7" y="4" width="10" height="6" rx="2"/><path d="M22 7h-5"/><path d="M7 7H1"/><path d="M22 17h-3"/><path d="M5 17H2"/></svg>

data/assets/icons/align-vertical-distribute-end.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><rect x="5" y="14" width="14" height="6" rx="2"/><rect x="7" y="4" width="10" height="6" rx="2"/><path d="M2 20h20"/><path d="M2 10h20"/></svg>

data/assets/icons/align-vertical-distribute-start.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><rect x="5" y="14" width="14" height="6" rx="2"/><rect x="7" y="4" width="10" height="6" rx="2"/><path d="M2 14h20"/><path d="M2 4h20"/></svg>

data/assets/icons/align-vertical-justify-center.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><rect x="5" y="16" width="14" height="6" rx="2"/><rect x="7" y="2" width="10" height="6" rx="2"/><path d="M2 12h20"/></svg>

data/assets/icons/align-vertical-justify-end.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><rect x="5" y="12" width="14" height="6" rx="2"/><rect x="7" y="2" width="10" height="6" rx="2"/><path d="M2 22h20"/></svg>