GithubFollow/One-KVM
1
0
Fork 0
mirror of https://github.com/mofeng-git/One-KVM.git synced 2026-10-28 16:30:48 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

fix: 修复设置页页眉回弹和状态色辨识度 #281

Browse Source 
- 在侧栏布局滚动容器统一阻止纵向 overscroll
  - 拆分状态指示色与成功文本色，提升在线状态辨识度
  - 统一连接、运行及键盘 LED 等状态点样式
This commit is contained in:
mofeng-git
2026-07-29 18:50:20 +08:00
parent fbcd95b617
commit d414557d74
8 changed files with 31 additions and 28 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
web/src/components/InfoBar.vue
View File

@@ -48,13 +48,13 @@ const keysDisplay = computed(() => {
<div class="flex items-center justify-between text-xs px-2 py-0.5">
<div v-if="keyboardLedEnabled" class="flex items-center gap-1">
<Badge variant="outline" class="h-4 gap-1 px-1 text-[10px] text-foreground">
<span class="size-1.5 rounded-full" :class="capsLock ? 'bg-success' : 'bg-warning'" />C
<span class="size-1.5 rounded-full" :class="capsLock ? 'bg-status-active' : 'bg-warning'" />C
</Badge>
<Badge variant="outline" class="h-4 gap-1 px-1 text-[10px] text-foreground">
<span class="size-1.5 rounded-full" :class="numLock ? 'bg-success' : 'bg-warning'" />N
<span class="size-1.5 rounded-full" :class="numLock ? 'bg-status-active' : 'bg-warning'" />N
</Badge>
<Badge variant="outline" class="h-4 gap-1 px-1 text-[10px] text-foreground">
<span class="size-1.5 rounded-full" :class="scrollLock ? 'bg-success' : 'bg-warning'" />S
<span class="size-1.5 rounded-full" :class="scrollLock ? 'bg-status-active' : 'bg-warning'" />S
</Badge>
</div>
<div v-else class="text-[10px] text-muted-foreground/60">
@@ -87,15 +87,15 @@ const keysDisplay = computed(() => {
<Separator orientation="vertical" class="h-5" />
<template v-if="keyboardLedEnabled">
<Badge variant="outline" class="mx-1 gap-1.5 text-foreground">
<span class="size-1.5 rounded-full" :class="capsLock ? 'bg-success' : 'bg-warning'" />
<span class="size-1.5 rounded-full" :class="capsLock ? 'bg-status-active' : 'bg-warning'" />
{{ t('infobar.caps') }}
</Badge>
<Badge variant="outline" class="mx-1 gap-1.5 text-foreground">
<span class="size-1.5 rounded-full" :class="numLock ? 'bg-success' : 'bg-warning'" />
<span class="size-1.5 rounded-full" :class="numLock ? 'bg-status-active' : 'bg-warning'" />
{{ t('infobar.num') }}
</Badge>
<Badge variant="outline" class="mx-1 gap-1.5 text-foreground">
<span class="size-1.5 rounded-full" :class="scrollLock ? 'bg-success' : 'bg-warning'" />
<span class="size-1.5 rounded-full" :class="scrollLock ? 'bg-status-active' : 'bg-warning'" />
{{ t('infobar.scroll') }}
</Badge>
</template>