refactor(frontend): getBgColorを共通化 (#14782)

* refactor: getBgColor関数の切り出し + fix types (taiyme#291)

* move thing

* revert unnecesary changes

---------

Co-authored-by: taiy <53635909+taiyme@users.noreply.github.com>
This commit is contained in:
かっこかり
2024-10-19 18:02:09 +09:00
committed by GitHub
parent a3a99467f0
commit 2250e521e4
9 changed files with 94 additions and 109 deletions

View File

@@ -53,7 +53,7 @@ export type Tab = {
</script>
<script lang="ts" setup>
import { onMounted, onUnmounted, watch, nextTick, shallowRef } from 'vue';
import { nextTick, onMounted, onUnmounted, shallowRef, watch } from 'vue';
import { defaultStore } from '@/store.js';
const props = withDefaults(defineProps<{
@@ -120,14 +120,14 @@ function onTabWheel(ev: WheelEvent) {
let entering = false;
async function enter(element: Element) {
async function enter(el: Element) {
if (!(el instanceof HTMLElement)) return;
entering = true;
const el = element as HTMLElement;
const elementWidth = el.getBoundingClientRect().width;
el.style.width = '0';
el.style.paddingLeft = '0';
el.offsetWidth; // force reflow
el.style.width = elementWidth + 'px';
el.offsetWidth; // reflow
el.style.width = `${elementWidth}px`;
el.style.paddingLeft = '';
nextTick(() => {
entering = false;
@@ -136,22 +136,23 @@ async function enter(element: Element) {
setTimeout(renderTab, 170);
}
function afterEnter(element: Element) {
//el.style.width = '';
function afterEnter(el: Element) {
if (!(el instanceof HTMLElement)) return;
// element.style.width = '';
}
async function leave(element: Element) {
const el = element as HTMLElement;
async function leave(el: Element) {
if (!(el instanceof HTMLElement)) return;
const elementWidth = el.getBoundingClientRect().width;
el.style.width = elementWidth + 'px';
el.style.width = `${elementWidth}px`;
el.style.paddingLeft = '';
el.offsetWidth; // force reflow
el.offsetWidth; // reflow
el.style.width = '0';
el.style.paddingLeft = '0';
}
function afterLeave(element: Element) {
const el = element as HTMLElement;
function afterLeave(el: Element) {
if (!(el instanceof HTMLElement)) return;
el.style.width = '';
}