MrKBear/living-together
2
2
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Opt themes styles

Browse Source
This commit is contained in:
MrKBear 2022-02-24 23:28:59 +08:00
parent e08a3ec6b5
commit 6bc498f14d
3 changed files with 9 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
source/Component/HeaderBar/HeaderBar.scss
View File

@ -1,3 +1,6 @@
div.header-bar { div.header-bar {
padding: 0 20px;
box-sizing: border-box;
display: flex; display: flex;
align-items: center;
} }

3
source/Component/HeaderBar/HeaderBar.tsx
View File

@ -1,6 +1,7 @@
import { Component, ReactNode } from "react"; import { Component, ReactNode } from "react";
import { useStatus, IMixinStatusProps } from "@Context/Status"; import { useStatus, IMixinStatusProps } from "@Context/Status";
import { Theme, BackgroundLevel, FontLevel } from "@Component/Theme/Theme"; import { Theme, BackgroundLevel, FontLevel } from "@Component/Theme/Theme";
import "./HeaderBar.scss";
interface IHeaderBarProps { interface IHeaderBarProps {
height: number; height: number;
@ -31,7 +32,7 @@ class HeaderBar extends Component<IHeaderBarProps & IMixinStatusProps> {
fontLevel={FontLevel.Level3} fontLevel={FontLevel.Level3}
style={{ height: this.props.height }} style={{ height: this.props.height }}
> >
Living Together | Web <div>Living Together | Web</div>
</Theme> </Theme>
} }
} }

8
source/Component/Theme/Theme.scss
View File

@ -18,10 +18,10 @@ $lt-bg-color-lvl4-dark: $ms-color-gray180;
$lt-bg-color-lvl5-dark: $ms-color-gray200; $lt-bg-color-lvl5-dark: $ms-color-gray200;
// 文字颜色 // 文字颜色
$lt-font-color-normal-dark: $ms-color-gray110; $lt-font-color-normal-dark: $ms-color-gray90;
$lt-font-color-lvl3-dark: $ms-color-gray100; $lt-font-color-lvl3-dark: $ms-color-gray80;
$lt-font-color-lvl2-dark: $ms-color-gray100; $lt-font-color-lvl2-dark: $ms-color-gray80;
$lt-font-color-lvl1-dark: $ms-color-gray90; $lt-font-color-lvl1-dark: $ms-color-gray70;
// 背景颜色 // 背景颜色
$lt-bg-color-lvl1-light: $ms-color-gray10; $lt-bg-color-lvl1-light: $ms-color-gray10;