Polish divider

This commit is contained in:
Jason Zimdars
2025-01-24 19:50:29 -06:00
parent 43ee37a422
commit 3f794f9d73
2 changed files with 10 additions and 7 deletions
+7 -5
View File
@@ -402,10 +402,10 @@
--border-size: 2px;
--divider-color: var(--color-subtle-dark);
block-size: calc(100% + 4ch);
block-size: calc(100% + 12ch);
font-size: 1rem;
cursor: grab;
margin-inline: -1rem;
margin-inline: -6ch;
visibility: hidden;
}
@@ -431,9 +431,11 @@
}
.bubbles-list__count {
background-color: var(--divider-color);
color: var(--color-ink-reversed);
padding: 0.1em 0.7em;
--btn-background: var(--divider-color);
--btn-color: var(--color-ink-reversed);
--btn-gap: 0.5ch;
--btn-icon-size: 1em;
--btn-padding: 0.1em 1em 0.1em 0.7em;
}
.bubble__title-text {
+3 -2
View File
@@ -1,8 +1,9 @@
<li class="bubbles-list__divider flex align-center gap-half" draggable="true" data-divider-target="divider">
<div class="divider-drag-image" data-divider-target="dragImage">Drag up or down</div>
<hr class="separator--horizontal flex-item-grow">
<strong class="bubbles-list__count border-radius">
Bubble up <span data-divider-target="count">10</span>
<strong class="btn bubbles-list__count border-radius">
<%= image_tag "drag.svg", aria: { hidden: true }, size: 24, class: "colorize-black" %>
<span data-divider-target="count">10</span> Bubbled up
</strong>
<hr class="separator--horizontal flex-item-grow">
<span></span>