github/skywalking-booster-ui
3
0
Fork 1
mirror of https://github.com/apache/skywalking-booster-ui.git synced 2025-10-14 20:01:28 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: implement the Dark Theme (#334)

Browse Source
This commit is contained in:
Fine0830
2023-11-14 20:37:15 +08:00
committed by GitHub
parent 780104c5d2
commit 832dc1676b
81 changed files with 638 additions and 351 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
src/views/alarm/Header.vue
View File

@@ -39,7 +39,11 @@ limitations under the License. -->
@current-change="changePage"
:pager-count="5"
small
:style="`--el-pagination-bg-color: #f0f2f5; --el-pagination-button-disabled-bg-color: #f0f2f5;`"
:style="
appStore.theme === Themes.Light
? `--el-pagination-bg-color: #f0f2f5; --el-pagination-button-disabled-bg-color: #f0f2f5;`
: ''
"
/>
</div>
</div>
@@ -54,6 +58,7 @@ limitations under the License. -->
import { useAppStoreWithOut } from "@/store/modules/app";
import { useAlarmStore } from "@/store/modules/alarm";
import { ElMessage } from "element-plus";
import { Themes } from "@/constants/data";
const appStore = useAppStoreWithOut();
const alarmStore = useAlarmStore();
@@ -99,8 +104,8 @@ limitations under the License. -->
<style lang="scss" scoped>
.alarm-tool {
font-size: $font-size-smaller;
border-bottom: 1px solid #c1c5ca41;
background-color: #f0f2f5;
border-bottom: 1px solid var(--sw-alarm-tool-border);
background-color: var(--sw-alarm-tool);
padding: 10px;
position: relative;
}