Adjust offsets and sizes to make tag input smaller

This commit is contained in:
Henrik Giesel 2021-06-24 02:15:08 +02:00
parent 77be86ec21
commit 8a48d26cca
2 changed files with 8 additions and 10 deletions

View File

@ -24,11 +24,11 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
<TagInputEdit bind:name on:focusout={() => (active = false)} />
{:else}
<span
class="tag text-nowrap bg-secondary rounded p-1 ps-2 me-2"
class="d-inline-flex align-items-center tag text-nowrap bg-secondary rounded ps-2 pe-1 me-1"
on:click|stopPropagation={() => (active = true)}
>
<span>{name}</span>
<Badge class="rounded delete-icon" on:click={tagDelete}
<Badge class="rounded delete-icon ms-1 mt-1" on:click={tagDelete}
>{@html deleteIcon}</Badge
>
</span>
@ -37,13 +37,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
<style lang="scss">
$white-translucent: rgba(255, 255, 255, 0.5);
.tag :global(.delete-icon) {
& > :global(svg) {
vertical-align: text-bottom;
}
& > :global(svg:hover) {
background-color: $white-translucent;
}
.tag :global(.delete-icon > svg:hover) {
background-color: $white-translucent;
}
</style>

View File

@ -40,6 +40,10 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
</StickyBottom>
<style lang="scss">
div {
font-size: 13px;
}
:global(#mdi-tag-outline) {
fill: currentColor;
height: 100%;