diff --git a/src/assets/css/element.scss b/src/assets/css/element.scss index 34ccf04..66c210a 100644 --- a/src/assets/css/element.scss +++ b/src/assets/css/element.scss @@ -4,5 +4,7 @@ $--font-path: '~element-ui/lib/theme-chalk/fonts'; // 颜色 $--color-primary: #2196F3; $--color-success: #4CAF50; +$--color-text-primary: #555555; +$--color-text-secondary: #909090; @import "~element-ui/packages/theme-chalk/src/index"; diff --git a/src/assets/css/global.less b/src/assets/css/global.less index cea3b29..cedb854 100644 --- a/src/assets/css/global.less +++ b/src/assets/css/global.less @@ -13,10 +13,10 @@ ::-webkit-scrollbar-thumb { border-radius: 1rem; - background-color: #DDD; + background-color: #DFDFDF; &:hover { - background-color: #BBB; + background-color: #CCCCCC; } } @@ -34,7 +34,7 @@ html { } body { - color: #555; + color: @textPrimary; overflow: hidden; user-select: none; -webkit-tap-highlight-color: transparent; @@ -98,7 +98,7 @@ body { .loading-link { background-color: rgba(255, 255, 255, 0.5) !important; - backdrop-filter: blur(.2rem); + backdrop-filter: blur(0.2rem); .el-loading-spinner { transform: translateY(-50%); diff --git a/src/assets/css/variable.less b/src/assets/css/variable.less index a41df95..3c96bf5 100644 --- a/src/assets/css/variable.less +++ b/src/assets/css/variable.less @@ -3,9 +3,14 @@ @headerHeight: 4rem; @colorPrimary: #2196F3; -@colorSecondary: #67C23A; -@colorGrey: #9E9E9E; +@colorPrimaryDark: #1976D2; +@colorPrimaryLight: #BBDEFB; +@colorSecondary: #4CAF50; +@colorGrey: #BDBDBD; @colorRed: #F44336; @colorWhite: #F9F9F9; -@transitionTime: .25s; +@textPrimary: #555555; +@textSecondary: #909090; + +@transitionTime: 0.25s; diff --git a/src/views/About.vue b/src/views/About.vue index d300a27..75dd3d1 100644 --- a/src/views/About.vue +++ b/src/views/About.vue @@ -82,12 +82,13 @@ export default { .title { line-height: 2.5rem; font-size: 1rem; + color: @textPrimary; } .content { line-height: 1.8rem; font-size: 0.85rem; - color: #888; + color: @textSecondary; } } } diff --git a/src/views/Tools.vue b/src/views/Tools.vue index 38326fb..e0bad4b 100644 --- a/src/views/Tools.vue +++ b/src/views/Tools.vue @@ -191,7 +191,7 @@ export default { top: 1rem; left: 0; font-weight: bold; - color: #555; + color: @textPrimary; } .tool-item { @@ -203,7 +203,7 @@ export default { border-radius: 0.25rem; background-color: #FFF; font-size: 0; - color: #555; + color: @textPrimary; overflow: hidden; transition: all @transitionTime; cursor: pointer; @@ -227,7 +227,7 @@ export default { height: calc(1.5em * 2); line-height: 1.5em; font-size: 0.75rem; - color: #999; + color: @textSecondary; } } } diff --git a/src/views/ToolsDetail.vue b/src/views/ToolsDetail.vue index 28d38ef..52d8c67 100644 --- a/src/views/ToolsDetail.vue +++ b/src/views/ToolsDetail.vue @@ -68,7 +68,7 @@ export default { position: relative; margin: 1.5rem 0; font-size: 1rem; - color: #222; + color: @textPrimary; } > .title::before {