diff --git a/app/assets/stylesheets/cards.css b/app/assets/stylesheets/cards.css index cbaa66c91..f36b4e76f 100644 --- a/app/assets/stylesheets/cards.css +++ b/app/assets/stylesheets/cards.css @@ -229,7 +229,7 @@ } lexxy-toolbar { - border-block-start: 1px solid var(--color-ink-light); + border-block-start: 1px solid var(--lexxy-border-color); } & ~ .btn.btn--reversed { diff --git a/app/assets/stylesheets/lexxy.css b/app/assets/stylesheets/lexxy.css index 3959424f9..316d9e4c0 100644 --- a/app/assets/stylesheets/lexxy.css +++ b/app/assets/stylesheets/lexxy.css @@ -1,7 +1,34 @@ -@layer components { - /* Editor - /* ------------------------------------------------------------------------ */ +@import url("lexxy-variables.css") layer(base); +@import url("lexxy-content.css") layer(base); +@import url("lexxy-editor.css") layer(base); +@layer components { lexxy-editor { + --lexxy-border-color: oklch(var(--lch-ink-darkest) / 20%); + --lexxy-editor-padding: 0; + --lexxy-toolbar-button-size: 2rem; + --lexxy-toolbar-gap: 0; + + background-color: transparent; + border: none; + border-radius: 0; + } + + lexxy-toolbar { + border-color: var(--lexxy-border-color); + } + + .lexxy-editor__toolbar-button { + background: transparent; + + @media(any-hover: hover) { + &:hover { + background-color: color-mix(in srgb, transparent, var(--color-ink) 10%); + } + } + } + + .lexxy-editor__content { + margin-block-start: 0.5lh; } } diff --git a/app/views/layouts/shared/_head.html.erb b/app/views/layouts/shared/_head.html.erb index aad07a44d..4be536454 100644 --- a/app/views/layouts/shared/_head.html.erb +++ b/app/views/layouts/shared/_head.html.erb @@ -16,9 +16,6 @@ <% turbo_refreshes_with method: :morph, scroll: :preserve %> <%= render "layouts/theme_preference" %> - <%= stylesheet_link_tag "lexxy-variables" %> - <%= stylesheet_link_tag "lexxy-content" %> - <%= stylesheet_link_tag "lexxy-editor" %> <%= stylesheet_link_tag :app, "data-turbo-track": "reload" %> <%= stylesheet_link_tag "fizzy/saas", "data-turbo-track": "reload" if Fizzy.saas? %> <%= javascript_importmap_tags %>