feat(theme): add element theme
This commit is contained in:
BIN
public/image/theme/element/logo/all.png
Normal file
BIN
public/image/theme/element/logo/all.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 6.4 KiB |
BIN
public/image/theme/element/logo/icon-only.png
Normal file
BIN
public/image/theme/element/logo/icon-only.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 3.3 KiB |
BIN
public/image/theme/element/preview@2x.png
Normal file
BIN
public/image/theme/element/preview@2x.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 2.8 KiB |
2
src/assets/style/theme/element/index.scss
Normal file
2
src/assets/style/theme/element/index.scss
Normal file
@@ -0,0 +1,2 @@
|
|||||||
|
@import './setting.scss';
|
||||||
|
@import '../theme.scss';
|
||||||
64
src/assets/style/theme/element/setting.scss
Normal file
64
src/assets/style/theme/element/setting.scss
Normal file
@@ -0,0 +1,64 @@
|
|||||||
|
// 主题名称
|
||||||
|
$theme-name: 'element';
|
||||||
|
// 主题背景颜色
|
||||||
|
$theme-bg-color: #314255;
|
||||||
|
// 主题背景图片遮罩
|
||||||
|
$theme-bg-mask: rgba(#000, 0);
|
||||||
|
|
||||||
|
// 消息提示
|
||||||
|
$theme-message-info-background-color: #FFFFFF;
|
||||||
|
$theme-message-info-text-color: #202D3D;
|
||||||
|
$theme-message-info-border-color: #202D3D;
|
||||||
|
|
||||||
|
// container组件
|
||||||
|
$theme-container-background-color: rgba(#FFF, 1);
|
||||||
|
$theme-container-header-footer-background-color: #FFF;
|
||||||
|
$theme-container-border-inner: 1px solid #CFD7E5;
|
||||||
|
$theme-container-border-outer: 1px solid #011527;
|
||||||
|
|
||||||
|
$theme-multiple-page-control-color: #BFCBD9;
|
||||||
|
$theme-multiple-page-control-color-active: #46A0FC;
|
||||||
|
$theme-multiple-page-control-nav-prev-color: #BFCBD9;
|
||||||
|
$theme-multiple-page-control-nav-next-color: #BFCBD9;
|
||||||
|
$theme-multiple-page-control-border-color: #011527;
|
||||||
|
$theme-multiple-page-control-border-color-active: #FFFFFF;
|
||||||
|
$theme-multiple-page-control-background-color: #212D3D;
|
||||||
|
$theme-multiple-page-control-background-color-active: #FFFFFF;
|
||||||
|
|
||||||
|
// 顶栏和侧边栏中展开的菜单 hover 状态下
|
||||||
|
$theme-menu-item-color-hover: #BFCBD9;
|
||||||
|
$theme-menu-item-background-color-hover: #011527;
|
||||||
|
|
||||||
|
// 顶栏上的文字颜色
|
||||||
|
$theme-header-item-color: #BFCBD9;
|
||||||
|
$theme-header-item-background-color: transparent;
|
||||||
|
// 顶栏上的项目在 hover 时
|
||||||
|
$theme-header-item-color-hover: #BFCBD9;
|
||||||
|
$theme-header-item-background-color-hover: #011527;
|
||||||
|
// 顶栏上的项目在 focus 时
|
||||||
|
$theme-header-item-color-focus: #BFCBD9;
|
||||||
|
$theme-header-item-background-color-focus: #202D3D;
|
||||||
|
// 顶栏上的项目在 active 时
|
||||||
|
$theme-header-item-color-active: #46A0FC;
|
||||||
|
$theme-header-item-background-color-active: #202D3D;
|
||||||
|
|
||||||
|
// 侧边栏上的文字颜色
|
||||||
|
$theme-aside-item-color: #BFCBD9;
|
||||||
|
$theme-aside-item-background-color: transparent;
|
||||||
|
// 侧边栏上的项目在 hover 时
|
||||||
|
$theme-aside-item-color-hover: #BFCBD9;
|
||||||
|
$theme-aside-item-background-color-hover: #011527;
|
||||||
|
// 侧边栏上的项目在 focus 时
|
||||||
|
$theme-aside-item-color-focus: #BFCBD9;
|
||||||
|
$theme-aside-item-background-color-focus: #202D3D;
|
||||||
|
// 侧边栏上的项目在 active 时
|
||||||
|
$theme-aside-item-color-active: #46A0FC;
|
||||||
|
$theme-aside-item-background-color-active: #202D3D;
|
||||||
|
|
||||||
|
// 侧边栏菜单为空的时候显示的元素
|
||||||
|
$theme-aside-menu-empty-icon-color: #BFCBD9;
|
||||||
|
$theme-aside-menu-empty-text-color: #BFCBD9;
|
||||||
|
$theme-aside-menu-empty-background-color: #202D3D;
|
||||||
|
$theme-aside-menu-empty-icon-color-hover: #46A0FC;
|
||||||
|
$theme-aside-menu-empty-text-color-hover: #46A0FC;
|
||||||
|
$theme-aside-menu-empty-background-color-hover: #202D3D;
|
||||||
@@ -2,6 +2,7 @@
|
|||||||
|
|
||||||
@import '~@/assets/style/theme/d2/index.scss';
|
@import '~@/assets/style/theme/d2/index.scss';
|
||||||
@import '~@/assets/style/theme/chester/index.scss';
|
@import '~@/assets/style/theme/chester/index.scss';
|
||||||
|
@import '~@/assets/style/theme/element/index.scss';
|
||||||
@import '~@/assets/style/theme/line/index.scss';
|
@import '~@/assets/style/theme/line/index.scss';
|
||||||
@import '~@/assets/style/theme/star/index.scss';
|
@import '~@/assets/style/theme/star/index.scss';
|
||||||
@import '~@/assets/style/theme/tomorrow-night-blue/index.scss';
|
@import '~@/assets/style/theme/tomorrow-night-blue/index.scss';
|
||||||
|
|||||||
@@ -42,6 +42,11 @@ export default {
|
|||||||
name: 'chester',
|
name: 'chester',
|
||||||
preview: 'image/theme/chester/preview@2x.png'
|
preview: 'image/theme/chester/preview@2x.png'
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
title: 'Element',
|
||||||
|
name: 'element',
|
||||||
|
preview: 'image/theme/element/preview@2x.png'
|
||||||
|
},
|
||||||
{
|
{
|
||||||
title: '紫罗兰',
|
title: '紫罗兰',
|
||||||
name: 'violet',
|
name: 'violet',
|
||||||
|
|||||||
Reference in New Issue
Block a user