wisetop/tcad-bodeplot
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor: update UI components theme color

Browse Source
This commit is contained in:
ws50529
2026-05-15 14:50:54 +08:00
parent 425f680614
commit da2cbfe8da
2 changed files with 33 additions and 33 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/App.vue
+32 -32
View File
@@ -78,7 +78,7 @@
{{ writingMCU ? '寫入中' : '寫值到 MCU' }}
</button>
<button @click="resetFilterParams"
class="text-[10px] font-bold role-bg-secondary-soft role-border-secondary-soft role-text-secondary role-hover-secondary-soft border px-2 py-1 rounded transition-colors uppercase">重設設計</button>
class="text-[10px] font-bold role-bg-primary-soft role-border-primary-soft role-text-primary role-hover-primary-soft border px-2 py-1 rounded transition-colors uppercase">重設設計</button>
</div>
</h2>
<div class="mb-3 space-y-2">
@@ -290,7 +290,7 @@
濾波器係數設定</span>
<div class="flex items-center gap-2">
<button v-if="isManualDirty" @click="clearManualAdjustments"
class="text-[10px] font-bold role-bg-secondary-soft role-border-secondary-soft role-text-secondary role-hover-secondary-soft border px-2 py-1 rounded transition-colors uppercase mr-1">重設</button>
class="text-[10px] font-bold role-bg-primary-soft role-border-primary-soft role-text-primary role-hover-primary-soft border px-2 py-1 rounded transition-colors uppercase mr-1">重設</button>
</div>
</h2>
<div class="mb-3">
@@ -342,15 +342,15 @@
<!-- a 係數標記顯示 -->
<div class="flex flex-wrap gap-1 mb-2">
<div v-for="item in floatingCoeffs.a" :key="item.label"
class="role-bg-secondary-soft px-1.5 py-0.5 rounded border role-border-secondary-soft flex gap-1 items-center">
<span class="text-[9px] role-text-secondary-muted font-bold">{{ item.label }}:</span>
<span class="text-[10px] font-mono role-text-secondary">{{ item.val
class="role-bg-primary-soft px-1.5 py-0.5 rounded border role-border-primary-soft flex gap-1 items-center">
<span class="text-[9px] role-text-primary-muted font-bold">{{ item.label }}:</span>
<span class="text-[10px] font-mono role-text-primary">{{ item.val
}}</span>
</div>
</div>
<textarea v-model="a_str" @input="debouncedUpdateFromText('a')" @keydown="onlyNumberKey"
rows="2"
class="w-full bg-slate-50 dark:bg-gray-900 border border-slate-200 dark:border-gray-700 rounded-lg p-3 text-sm role-focus-primary outline-none font-mono resize-none leading-relaxed role-text-secondary"></textarea>
class="w-full bg-slate-50 dark:bg-gray-900 border border-slate-200 dark:border-gray-700 rounded-lg p-3 text-sm role-focus-primary outline-none font-mono resize-none leading-relaxed role-text-primary"></textarea>
</div>
<!-- a 係數倍率微調 -->
<details :open="activeCoeffAdjustment === 'aScale'"
@@ -374,7 +374,7 @@
</label>
<input type="range" v-model.number="aSliders[i]" @input="updateFromControls"
:min="-maxLogA" :max="maxLogA" :step="maxLogA/100"
class="w-full role-range-secondary">
class="w-full role-range-primary">
</div>
</template>
</div>
@@ -394,9 +394,9 @@
class="rounded-lg border border-slate-200 dark:border-gray-700 bg-white dark:bg-gray-800 text-slate-600 dark:text-gray-300 py-2 text-xs font-bold transition-colors hover:bg-slate-100 dark:hover:bg-gray-700">
粗
</button>
<div class="min-w-0 rounded-lg border role-border-secondary-soft role-bg-secondary-soft px-3 py-2 text-center">
<span class="block text-[9px] role-text-secondary-muted role-text-secondary font-bold">微調量</span>
<span class="block truncate font-mono text-sm font-bold role-text-secondary" :title="formatAFineDelta()">
<div class="min-w-0 rounded-lg border role-border-primary-soft role-bg-primary-soft px-3 py-2 text-center">
<span class="block text-[9px] role-text-primary-muted role-text-primary font-bold">微調量</span>
<span class="block truncate font-mono text-sm font-bold role-text-primary" :title="formatAFineDelta()">
+/-{{ formatAFineDelta() }}
</span>
</div>
@@ -417,15 +417,15 @@
<input type="number" :value="formatFineCoeff(currentDelta)" :step="aFineStep"
@change="setAFineDirect('delta', $event.target.value)" @keydown="onlyNumberKey"
@wheel="handleAFineWheel('delta', $event)"
class="min-w-0 w-full bg-white dark:bg-gray-800 border border-slate-200 dark:border-gray-700 rounded-lg p-3 text-xs font-mono text-center role-text-secondary">
class="min-w-0 w-full bg-white dark:bg-gray-800 border border-slate-200 dark:border-gray-700 rounded-lg p-3 text-xs font-mono text-center role-text-primary">
<button type="button" @pointerdown.prevent="startA1A2Repeat('delta', 1)" @pointerup="stopA1A2Repeat" @pointerleave="stopA1A2Repeat" @pointercancel="stopA1A2Repeat"
class="stepper-button w-full h-[42px] flex items-center justify-center rounded-full role-bg-primary-soft role-hover-primary-soft role-text-primary transition-all duration-150 active:scale-90 text-lg font-bold shadow-sm">+</button>
</div>
</article>
<button v-else type="button" @pointerdown.prevent="startAFineDrag('delta', $event)"
class="touch-none select-none w-28 mx-auto bg-white dark:bg-gray-800 border border-slate-200 dark:border-gray-700 rounded-lg p-3 text-center role-active-border-secondary active:ring-2 role-active-ring-secondary">
class="touch-none select-none w-28 mx-auto bg-white dark:bg-gray-800 border border-slate-200 dark:border-gray-700 rounded-lg p-3 text-center role-active-border-primary active:ring-2 role-active-ring-primary">
<span class="text-[9px] text-slate-400 block font-bold mb-1">δ</span>
<span class="block max-w-full truncate text-base font-mono font-bold role-text-secondary" :title="formatFineCoeff(currentDelta)">{{ formatFineCoeff(currentDelta) }}</span>
<span class="block max-w-full truncate text-base font-mono font-bold role-text-primary" :title="formatFineCoeff(currentDelta)">{{ formatFineCoeff(currentDelta) }}</span>
</button>
<article v-if="!isTouchInput" class="block">
<span class="text-[9px] text-slate-400 block font-bold mb-1">r</span>
@@ -451,11 +451,11 @@
<div class="grid grid-cols-2 gap-2 mb-4">
<div class="min-w-0 bg-white dark:bg-gray-800 border border-slate-100 dark:border-gray-700 rounded-lg p-2 text-center shadow-sm">
<span class="text-[9px] text-slate-400 block font-bold mb-1">a1 = -1 - r + δ</span>
<span class="block max-w-full truncate text-sm font-mono font-bold role-text-secondary-muted" :title="formatFineCoeff(currentA1)">{{ formatFineCoeff(currentA1) }}</span>
<span class="block max-w-full truncate text-sm font-mono font-bold role-text-primary-muted" :title="formatFineCoeff(currentA1)">{{ formatFineCoeff(currentA1) }}</span>
</div>
<div class="min-w-0 bg-white dark:bg-gray-800 border border-slate-100 dark:border-gray-700 rounded-lg p-2 text-center shadow-sm">
<span class="text-[9px] text-slate-400 block font-bold mb-1">a2 = r + δ</span>
<span class="block max-w-full truncate text-sm font-mono font-bold role-text-secondary-muted" :title="formatFineCoeff(currentA2)">{{ formatFineCoeff(currentA2) }}</span>
<span class="block max-w-full truncate text-sm font-mono font-bold role-text-primary-muted" :title="formatFineCoeff(currentA2)">{{ formatFineCoeff(currentA2) }}</span>
</div>
<div class="min-w-0 bg-white dark:bg-gray-800 border border-slate-100 dark:border-gray-700 rounded-lg p-2 text-center shadow-sm">
<span class="text-[9px] text-slate-400 block font-bold mb-1">差值 a1-a2</span>
@@ -493,12 +493,12 @@
class="text-xs role-bg-primary-soft role-text-primary px-2 py-1 rounded">b Q{{
shiftBitsB }}</span>
<span
class="text-xs role-bg-secondary-soft role-text-secondary px-2 py-1 rounded">a Q{{
class="text-xs role-bg-primary-soft role-text-primary px-2 py-1 rounded">a Q{{
shiftBitsA }}</span>
</div>
<div class="flex items-center gap-2">
<button v-if="isFixedPointDirty" @click="resetFixedPointSettings"
class="text-[10px] font-bold role-bg-secondary-soft role-border-secondary-soft role-text-secondary role-hover-secondary-soft border px-2 py-1 rounded transition-colors uppercase mr-1">重設</button>
class="text-[10px] font-bold role-bg-primary-soft role-border-primary-soft role-text-primary role-hover-primary-soft border px-2 py-1 rounded transition-colors uppercase mr-1">重設</button>
</div>
</h2>
@@ -535,8 +535,8 @@
class="stepper-button w-full h-[42px] flex items-center justify-center rounded-full role-bg-primary-soft role-hover-primary-soft role-text-primary transition-all duration-150 active:scale-90 text-lg font-bold shadow-sm">+</button>
</div>
<button v-else type="button" @pointerdown.prevent="startShiftBitDrag('a', $event)"
class="touch-none select-none block w-24 mx-auto bg-white dark:bg-gray-800 border border-slate-200 dark:border-gray-700 rounded-lg p-3 text-center role-active-border-secondary active:ring-2 role-active-ring-secondary">
<span class="text-lg font-mono font-bold role-text-secondary">{{ shiftBitsA }}</span>
class="touch-none select-none block w-24 mx-auto bg-white dark:bg-gray-800 border border-slate-200 dark:border-gray-700 rounded-lg p-3 text-center role-active-border-primary active:ring-2 role-active-ring-primary">
<span class="text-lg font-mono font-bold role-text-primary">{{ shiftBitsA }}</span>
</button>
<p class="text-[10px] text-slate-400 mt-1">a scaling: 2^{{ shiftBitsA }} ({{
Math.pow(2, shiftBitsA) }})</p>
@@ -564,15 +564,15 @@
(Integers)</label>
<div class="flex flex-wrap gap-1 mb-2">
<div v-for="(item, idx) in fixedPointCoeffs.a" :key="item.label"
:class="item.isOverridden ? 'role-border-secondary ring-1 role-ring-secondary' : 'role-border-secondary-soft'"
class="role-bg-secondary-soft px-1.5 py-0.5 rounded border flex items-center gap-1 transition-all">
<span class="text-[9px] role-text-secondary-muted font-bold">{{ item.label }}:</span>
<span class="text-[10px] font-mono role-text-secondary font-bold"
:class="item.isOverridden ? 'role-border-primary ring-1 role-ring-primary' : 'role-border-primary-soft'"
class="role-bg-primary-soft px-1.5 py-0.5 rounded border flex items-center gap-1 transition-all">
<span class="text-[9px] role-text-primary-muted font-bold">{{ item.label }}:</span>
<span class="text-[10px] font-mono role-text-primary font-bold"
:class="{ 'italic': !item.isOverridden }">{{ item.val }}</span>
</div>
</div>
<textarea v-model="a_int_str" @keydown="onlyNumberKey($event, false)" rows="2"
class="w-full bg-slate-50 dark:bg-gray-900 border border-slate-200 dark:border-gray-700 rounded-lg p-3 text-sm role-focus-primary outline-none font-mono resize-none leading-relaxed role-text-secondary"></textarea>
class="w-full bg-slate-50 dark:bg-gray-900 border border-slate-200 dark:border-gray-700 rounded-lg p-3 text-sm role-focus-primary outline-none font-mono resize-none leading-relaxed role-text-primary"></textarea>
</div>
<details class="mt-3 bg-slate-50 dark:bg-gray-900 border border-slate-200 dark:border-gray-800 rounded-lg">
<summary class="text-sm text-slate-500 dark:text-gray-400 px-3 py-3 cursor-pointer hover:text-slate-600 dark:hover:text-gray-300">
@@ -582,9 +582,9 @@
<div class="grid grid-cols-[3.25rem_1fr_3.25rem] gap-2 mb-3">
<button type="button" @click="adjustFixedAFineStep(-1)" title="調粗"
class="rounded-lg border border-slate-200 dark:border-gray-700 bg-white dark:bg-gray-800 text-slate-600 dark:text-gray-300 py-2 text-xs font-bold transition-colors hover:bg-slate-100 dark:hover:bg-gray-700">粗</button>
<div class="min-w-0 rounded-lg border role-border-secondary-soft role-bg-secondary-soft px-3 py-2 text-center">
<span class="block text-[9px] role-text-secondary-muted role-text-secondary font-bold">微調量</span>
<span class="block truncate font-mono text-sm font-bold role-text-secondary" :title="formatFixedAFineDelta()">+/-{{ formatFixedAFineDelta() }}</span>
<div class="min-w-0 rounded-lg border role-border-primary-soft role-bg-primary-soft px-3 py-2 text-center">
<span class="block text-[9px] role-text-primary-muted role-text-primary font-bold">微調量</span>
<span class="block truncate font-mono text-sm font-bold role-text-primary" :title="formatFixedAFineDelta()">+/-{{ formatFixedAFineDelta() }}</span>
</div>
<button type="button" @click="adjustFixedAFineStep(1)" title="調細"
class="rounded-lg border border-slate-200 dark:border-gray-700 bg-white dark:bg-gray-800 text-slate-600 dark:text-gray-300 py-2 text-xs font-bold transition-colors hover:bg-slate-100 dark:hover:bg-gray-700">細</button>
@@ -601,15 +601,15 @@
<input type="number" :value="formatFixedFineCoeff(fixedCurrentDelta)" :step="fixedAFineStep"
@change="setFixedAFineDirect('delta', $event.target.value)" @keydown="onlyNumberKey"
@wheel="handleFixedAFineWheel('delta', $event)"
class="min-w-0 w-full bg-white dark:bg-gray-800 border border-slate-200 dark:border-gray-700 rounded-lg p-3 text-xs font-mono text-center role-text-secondary">
class="min-w-0 w-full bg-white dark:bg-gray-800 border border-slate-200 dark:border-gray-700 rounded-lg p-3 text-xs font-mono text-center role-text-primary">
<button type="button" @pointerdown.prevent="startFixedA1A2Repeat('delta', 1)" @pointerup="stopFixedA1A2Repeat" @pointerleave="stopFixedA1A2Repeat" @pointercancel="stopFixedA1A2Repeat"
class="stepper-button w-full h-[42px] flex items-center justify-center rounded-full role-bg-primary-soft role-hover-primary-soft role-text-primary transition-all duration-150 active:scale-90 text-lg font-bold shadow-sm">+</button>
</div>
</article>
<button v-else type="button" @pointerdown.prevent="startFixedAFineDrag('delta', $event)"
class="touch-none select-none w-28 mx-auto bg-white dark:bg-gray-800 border border-slate-200 dark:border-gray-700 rounded-lg p-3 text-center role-active-border-secondary active:ring-2 role-active-ring-secondary">
class="touch-none select-none w-28 mx-auto bg-white dark:bg-gray-800 border border-slate-200 dark:border-gray-700 rounded-lg p-3 text-center role-active-border-primary active:ring-2 role-active-ring-primary">
<span class="text-[9px] text-slate-400 block font-bold mb-1">δ</span>
<span class="block max-w-full truncate text-base font-mono font-bold role-text-secondary" :title="formatFixedFineCoeff(fixedCurrentDelta)">{{ formatFixedFineCoeff(fixedCurrentDelta) }}</span>
<span class="block max-w-full truncate text-base font-mono font-bold role-text-primary" :title="formatFixedFineCoeff(fixedCurrentDelta)">{{ formatFixedFineCoeff(fixedCurrentDelta) }}</span>
</button>
<article v-if="!isTouchInput" class="block">
<span class="text-[9px] text-slate-400 block font-bold mb-1">r</span>
@@ -634,11 +634,11 @@
<div class="grid grid-cols-2 gap-2 mb-4">
<div class="min-w-0 bg-white dark:bg-gray-800 border border-slate-100 dark:border-gray-700 rounded-lg p-2 text-center shadow-sm">
<span class="text-[9px] text-slate-400 block font-bold mb-1">a1 = -a0 - r + δ</span>
<span class="block max-w-full truncate text-sm font-mono font-bold role-text-secondary-muted" :title="formatFixedFineCoeff(fixedCurrentA1)">{{ formatFixedFineCoeff(fixedCurrentA1) }}</span>
<span class="block max-w-full truncate text-sm font-mono font-bold role-text-primary-muted" :title="formatFixedFineCoeff(fixedCurrentA1)">{{ formatFixedFineCoeff(fixedCurrentA1) }}</span>
</div>
<div class="min-w-0 bg-white dark:bg-gray-800 border border-slate-100 dark:border-gray-700 rounded-lg p-2 text-center shadow-sm">
<span class="text-[9px] text-slate-400 block font-bold mb-1">a2 = r + δ</span>
<span class="block max-w-full truncate text-sm font-mono font-bold role-text-secondary-muted" :title="formatFixedFineCoeff(fixedCurrentA2)">{{ formatFixedFineCoeff(fixedCurrentA2) }}</span>
<span class="block max-w-full truncate text-sm font-mono font-bold role-text-primary-muted" :title="formatFixedFineCoeff(fixedCurrentA2)">{{ formatFixedFineCoeff(fixedCurrentA2) }}</span>
</div>
<div class="min-w-0 bg-white dark:bg-gray-800 border border-slate-100 dark:border-gray-700 rounded-lg p-2 text-center shadow-sm">
<span class="text-[9px] text-slate-400 block font-bold mb-1">差值 a1-a2</span>
static/build/app.js
+1 -1
View File
File diff suppressed because one or more lines are too long