This commit is contained in:
Viet An
2026-05-22 08:42:20 +07:00
parent 80f1e7275f
commit d13db665ee

View File

@@ -40,13 +40,13 @@
</p> --> </p> -->
<p class="control"> <p class="control">
<button <button
class="button is-light is-primary" class="button"
@click="moveLeft()" @click="moveLeft()"
> >
<span class="icon"> <span class="icon">
<Icon <Icon
name="material-symbols:arrow-back-rounded" name="material-symbols:arrow-back-rounded"
:size="22" :size="20"
/> />
</span> </span>
</button> </button>
@@ -58,13 +58,13 @@
</p> </p>
<p class="control"> <p class="control">
<button <button
class="button is-light is-primary" class="button"
@click="moveRight()" @click="moveRight()"
> >
<span class="icon"> <span class="icon">
<Icon <Icon
name="material-symbols:arrow-forward-rounded" name="material-symbols:arrow-forward-rounded"
:size="22" :size="20"
/> />
</span> </span>
</button> </button>
@@ -76,13 +76,13 @@
</p> </p>
<p class="control"> <p class="control">
<button <button
class="button is-light is-primary" class="button"
@click="resizeWidth()" @click="resizeWidth()"
> >
<span class="icon"> <span class="icon">
<Icon <Icon
name="fluent:arrow-fit-16-regular" name="fluent:arrow-fit-16-regular"
:size="22" :size="20"
/> />
</span> </span>
</button> </button>
@@ -94,13 +94,13 @@
</p> </p>
<p class="control"> <p class="control">
<button <button
class="button is-light is-primary" class="button"
@click="resizeWidth(true)" @click="resizeWidth(true)"
> >
<span class="icon"> <span class="icon">
<Icon <Icon
name="fluent:arrow-fit-in-16-regular" name="fluent:arrow-fit-in-16-regular"
:size="22" :size="20"
/> />
</span> </span>
</button> </button>
@@ -112,13 +112,13 @@
</p> </p>
<p class="control"> <p class="control">
<button <button
class="button is-light is-primary" class="button"
@click="hideField()" @click="hideField()"
> >
<span class="icon"> <span class="icon">
<Icon <Icon
name="material-symbols:visibility-off-outline-rounded" name="material-symbols:visibility-off-outline-rounded"
:size="22" :size="20"
/> />
</span> </span>
</button> </button>
@@ -130,13 +130,13 @@
</p> </p>
<p class="control"> <p class="control">
<button <button
class="button is-light is-primary" class="button"
@click="!currentField.mandatory && doRemove()" @click="!currentField.mandatory && doRemove()"
> >
<span class="icon"> <span class="icon">
<Icon <Icon
name="material-symbols:delete-outline-rounded" name="material-symbols:delete-outline-rounded"
:size="22" :size="20"
/> />
</span> </span>
</button> </button>
@@ -148,14 +148,14 @@
</p> </p>
<p class="control"> <p class="control">
<button <button
class="button is-light is-primary" class="button"
:class="currentField.format !== 'number' && 'has-text-grey-light'" :class="currentField.format !== 'number' && 'has-text-grey-light'"
@click="currentField.format === 'number' && $emit('modalevent', { name: 'copyfield', data: currentField })" @click="currentField.format === 'number' && $emit('modalevent', { name: 'copyfield', data: currentField })"
> >
<span class="icon"> <span class="icon">
<Icon <Icon
name="material-symbols:content-copy-outline-rounded" name="material-symbols:content-copy-outline-rounded"
:size="22" :size="20"
/> />
</span> </span>
</button> </button>
@@ -167,13 +167,13 @@
</p> </p>
<p class="control"> <p class="control">
<button <button
class="button is-light is-primary" class="button"
@click="fieldList()" @click="fieldList()"
> >
<span class="icon"> <span class="icon">
<Icon <Icon
name="material-symbols:view-column-outline-rounded" name="material-symbols:view-column-outline-rounded"
:size="22" :size="20"
/> />
</span> </span>
</button> </button>
@@ -185,13 +185,13 @@
</p> </p>
<p class="control"> <p class="control">
<button <button
class="button is-light is-primary" class="button"
@click="createField()" @click="createField()"
> >
<span class="icon"> <span class="icon">
<Icon <Icon
name="material-symbols:add-rounded" name="material-symbols:add-rounded"
:size="22" :size="20"
/> />
</span> </span>
</button> </button>
@@ -203,13 +203,13 @@
</p> </p>
<p class="control"> <p class="control">
<button <button
class="button is-light is-primary" class="button"
@click="tableOption()" @click="tableOption()"
> >
<span class="icon"> <span class="icon">
<Icon <Icon
name="material-symbols:table-edit-outline" name="material-symbols:table-edit-outline"
:size="22" :size="20"
/> />
</span> </span>
</button> </button>
@@ -227,7 +227,7 @@
<span class="icon"> <span class="icon">
<Icon <Icon
name="material-symbols:save-rounded" name="material-symbols:save-rounded"
:size="22" :size="20"
/> />
</span> </span>
</button> </button>
@@ -238,7 +238,7 @@
> >
</p> </p>
</div> </div>
<div class="tabs is-toggle is-centered"> <div class="tabs is-centered">
<ul> <ul>
<li <li
v-for="(v, i) in getMenu().filter((x) => v-for="(v, i) in getMenu().filter((x) =>
@@ -252,7 +252,7 @@
:class="selectTab.code === v.code ? 'is-active' : 'has-text-primary'" :class="selectTab.code === v.code ? 'is-active' : 'has-text-primary'"
@click="changeTab(v)" @click="changeTab(v)"
> >
<a class="px-12 py-1.5 fs-14">{{ v.name }}</a> <a class="px-16 py-1.5 fs-14">{{ v.name }}</a>
</li> </li>
</ul> </ul>
</div> </div>
@@ -653,14 +653,12 @@ p.control {
} }
} }
.tabs {
--bulma-tabs-toggle-link-active-background-color: var(--bulma-link-90);
--bulma-tabs-toggle-link-active-border-color: var(--bulma-link-90);
--bulma-tabs-toggle-link-active-color: var(--bulma-link-25);
}
.button.is-primary.is-outlined:hover { .button.is-primary.is-outlined:hover {
--bulma-button-border-width: max(1px, 0.0625em); /* same as not-hovered */ /* TODO: make it global: when outlined,
border width shouldn't change, background-color should change */
--bulma-button-border-width: max(1px, 0.0625em);
/* same as not-hovered */
background-color: var(--bulma-primary-95); background-color: var(--bulma-primary-95);
} }
</style> </style>