diff --git a/frontend/src/views/Settings.vue b/frontend/src/views/Settings.vue index cf2801b..e913af1 100644 --- a/frontend/src/views/Settings.vue +++ b/frontend/src/views/Settings.vue @@ -1081,7 +1081,7 @@ :step="0.1" :precision="2" size="large" - class="dark-input" + style="width: 120px" /> 分/小时 @@ -5123,34 +5123,42 @@ watch(activeTab, (value) => { white-space: nowrap; } - .dark-input { - width: 100px; - background-color: #1f1f1f !important; - border-color: #434343 !important; - color: #fff !important; + :deep(.ant-input-number) { + background-color: #1f1f1f; + border-color: #434343; + color: #fff; + border-radius: 4px; - :deep(.ant-input-number-input) { - color: #fff !important; - background-color: #1f1f1f !important; + .ant-input-number-input { + color: #fff; + background-color: transparent; } - :deep(.ant-input-number-handler-wrap) { - background-color: #2a2a2a !important; - border-left-color: #434343 !important; - - span { - border-bottom-color: #434343 !important; - color: #fff !important; - - &:hover { - color: $brand-primary !important; - } + .ant-input-number-handler-wrap { + background: #2a2a2a; + border-left: 1px solid #434343; + } + + .ant-input-number-handler { + border-bottom: 1px solid #434343; + &:active { + background: #444; } } - &:hover, &:focus, &-focused { - border-color: $brand-primary !important; + .ant-input-number-handler-up-inner, + .ant-input-number-handler-down-inner { + color: rgba(255, 255, 255, 0.45); } + + &:hover { + border-color: $brand-primary; + } + } + + :deep(.ant-input-number-focused) { + border-color: $brand-primary; + box-shadow: 0 0 0 2px rgba(49, 240, 139, 0.2); } }