diff --git a/app/server/static/components/label.vue b/app/server/static/components/label.vue
index e62d4d6d..2f4259aa 100644
--- a/app/server/static/components/label.vue
+++ b/app/server/static/components/label.vue
@@ -52,23 +52,18 @@
label.label Color
div.field.has-addons
div.control
- a.button(
- v-bind:style="{ \
- color: newLabel.text_color, \
- backgroundColor: newLabel.background_color \
- }"
+ div.form__field
+ div.form__input
+ swatches(v-model="newLabel.background_color", colors="basic", \
+ show-fallback=true, popover-to="", :trigger-style="{ \
+ width: '36px', height: '36px' }")
+ div.control
+ a.button.random-color-button(
v-on:click="setColor(newLabel)"
)
span.icon.is-small
i.fas.fa-sync-alt
- div.control.is-expanded
- input.input(
- type="text"
- placeholder="Text input"
- v-model="newLabel.background_color"
- )
-
div.column
div.field
label.label
@@ -151,20 +146,18 @@
label.label Color
div.field.has-addons
div.control
- a.button.has-text-white(
- v-bind:style="{ backgroundColor: label.background_color }"
- v-on:click="setColor(label)"
+ div.form__field
+ div.form__input
+ swatches(v-model="label.background_color", colors="basic", \
+ show-fallback=true, popover-to="", :trigger-style="{ \
+ width: '36px', height: '36px' }")
+ div.control
+ a.button.random-color-button(
+ v-on:click="setColor(newLabel)"
)
span.icon.is-small
i.fas.fa-sync-alt
- div.control.is-expanded
- input.input(
- type="text"
- placeholder="Text input"
- v-model="label.background_color"
- )
-
div.column
div.field
label.label
@@ -176,13 +169,25 @@
a.button.is-primary(v-on:click="doneEdit(label)") Save changes
+
+