// dark 主题 // 参考: https://developer.apple.com/design/human-interface-guidelines/macos/visual-design/color/ $ns: 'dark-'; $orange: #ff9f0b; $yellow: #ffd609; $green: #32d74b; $turquoise: #00d1b2; $cyan: #17a2b8; $blue: #0983ff; $purple: #bf5af2; $red: #dc3545; $primary: $blue; $info: #2296f3; $success: $green; $warning: $orange; $danger: $red; $light: #3a3a3a; $dark: #1e1f22; $black: #141316; $text-color: rgb(243, 241, 241); $text--muted-color: #6c6c6c; $text--loud-color: lighten($text-color, 10%); $background: #333538; $background-head: #191c22; $body-bg: $background; $Page-aside-bg: #3c3c3c; $Panel-bg: #302d2a; $borderColor: $black; $link-color: $info; $borderColor: #656565; $Button--default-bg: $black; $Calendar-btnCancel-bg: $background-head; $Calendar-cell-bg: $Panel-bg; $Card-bg: $Panel-bg; $Card-onModified-bg: $dark; $Card-onModified-color: $text-color; $Card-onChecked-bg: $black; $Card-onChecked-color: $text-color; $Card-actions-onHover-bg: $dark; $Card-actions-onHover-color: $text-color; $Checkbox-gb: linear-gradient(#515151, #4b4b4b); $Checkbox-onHover-color: $blue; $ColorPicker-bg: $background; $DatePicker-bg: $background; $DatePicker-header-select-borderColor: $background; $DropDown-menu-bg: $background; $Fieldset-legend-bgColor: $background; $Form-input-bg: #3c3c3c; $Form-input-addOnBg: $Form-input-bg; $Form-input-color: $text-color; $Form-input-onDisabled-bg: $Panel-bg; $Form-select-bg: $background; $Form-select-menu-bg: $background; $Form-select-onHover-bg: $background-head; $Form-selectValue-bg: $Panel-bg; $Form-selectValue-color: $text-color; $TreeSelect-popover-bg: $Panel-bg; $IconPicker-tab-onActive-bg: $background; $InputGroup-select-bg: $background; $InputGroup-select-onFocused-bg: $Panel-bg; $istItem-onModified-bg: $black; $Layout-aside-bg: $background-head; $Layout-aside-onAcitve-bg: $Panel-bg; $Layout-aside-onHover-bg: #404040; $Layout-aside-subList-bg: #131519; $Layout-header-bg: $background-head; $List-bg: $Panel-bg; $ListControl-item-bg: $background; $ListControl-item-onActive-before-bg: $background; $ListItem--strip-bg: $background; $ListItem-onChecked-bg: $black; $ListItem-onChecked-color: $text-color; $ListItem-onModified-color: $text-color; $Number-handler-bg: $background; $Panel--default-bg: linear-gradient(#524e48, #423e3a); $Panel-footerBg: linear-gradient(#524e48, #423e3a); $PopOver-bg: $background; $Table-onHover-bg: $dark; $Table-strip-bg: $Panel-bg; $Table-thead-bg: #2f2f2f; $Table-onChecked-bg: $black; $Table-onChecked-color: $text-color; $Table-onModified-bg: $black; $Table-onModified-color: $text-color; $Tabs--card-bg: #323639; $Tabs--card-borderTopColor: $background; $Tabs--card-onActive-bg: $Panel-bg; $Tabs--radio-bg: $Panel-bg; $Tabs-content-bg: $Panel-bg; $Tabs-onActive-bg: $Panel-bg; $Tabs-onActive-borderColor: $borderColor; $Tabs-onActive-color: lighten($text-color, 10%); $Tabs-onHover-borderColor: $Tabs-onActive-borderColor; $Tabs--radio-bg: $Panel-bg; $Tooltip--attr-color: $text-color; $TransferSelect--table-heading-bg: $background; $Wizard-steps-bg: $background-head; $Wizard-steps-li-onActive-arrow-bg: $Panel-bg; $Wizard-steps-li-onActive-bg: $Panel-bg; $Transfer-title-bg: #2f2f2f; button[disabled], html input[disabled] { cursor: not-allowed; } input { color: $text-color; background: $Form-input-bg; } pre { color: $text-color; background: $background; } .rdtPicker { background: $background; } .rdtPicker th { border-bottom: none; } .fr-toolbar { background: $background; } .markdown-body { color: $text-color; } @import '../functions'; @import '../variables'; @import '../mixins'; @import '../base/reset'; @import '../base/normalize'; @import '../base/typography'; @import '../layout/layout'; @import '../layout/grid'; @import '../layout/aside'; @import '../layout/hbox'; @import '../layout/vbox'; @import '../components/modal'; @import '../components/drawer'; @import '../components/tooltip'; @import '../components/popover'; @import '../components/toast'; @import '../components/alert'; @import '../components/tabs'; @import '../components/nav'; @import '../components/page'; @import '../components/remark'; @import '../components/chart'; @import '../components/video'; @import '../components/audio'; @import '../components/panel'; @import '../components/service'; @import '../components/spinner'; @import '../components/button'; @import '../components/button-group'; @import '../components/dropdown'; @import '../components/collapse'; @import '../components/color'; @import '../components/context-menu'; @import '../components/wizard'; @import '../components/crud'; @import '../components/table'; @import '../components/list'; @import '../components/cards'; @import '../components/card'; @import '../components/quick-edit'; @import '../components/popoverable'; @import '../components/copyable'; @import '../components/divider'; @import '../components/pagination'; @import '../components/wrapper'; @import '../components/status'; @import '../components/carousel'; @import '../components/image-gallery'; @import '../components/images'; @import '../components/input-box'; @import '../components/result-box'; @import '../components/search-box'; @import '../components/list-menu'; @import '../components/form/fieldset'; @import '../components/form/group'; @import '../components/form/input-group'; @import '../components/form/text'; @import '../components/form/textarea'; @import '../components/form/checks'; @import '../components/form/city'; @import '../components/form/switch'; @import '../components/form/number'; @import '../components/form/select'; @import '../components/form/result-list'; @import '../components/form/list'; @import '../components/form/location'; @import '../components/form/matrix'; @import '../components/form/color'; @import '../components/form/date'; @import '../components/form/date-range'; @import '../components/form/image'; @import '../components/form/file'; @import '../components/form/editor'; @import '../components/form/rich-text'; @import '../components/form/range'; @import '../components/form/repeat'; @import '../components/form/tree'; @import '../components/form/tree-select'; @import '../components/form/combo'; @import '../components/form/sub-form'; @import '../components/form/chained-select'; @import '../components/form/picker'; @import '../components/form/qr-code'; @import '../components/form/tag'; @import '../components/form/rating'; @import '../components/form/transfer'; @import '../components/form/nested-select'; @import '../components/form/icon-picker'; @import '../components/form/form'; @import '../utilities';