github/skywalking-booster-ui
2
0
Fork 1
mirror of https://github.com/apache/skywalking-booster-ui.git synced 2025-05-12 15:52:57 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: alert and settings

Browse Source
This commit is contained in:
Fine 2023-11-13 20:16:55 +08:00
parent 618d4fc3bb
commit b01f324a06
6 changed files with 19 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/components/SelectSingle.vue
View File

@ -112,7 +112,7 @@ limitations under the License. -->
width: 100%; width: 100%;
padding: 2px 10px; padding: 2px 10px;
overflow: auto; overflow: auto;
color: #606266; color: var(--sw-setting-color);
position: relative; position: relative;
&:hover { &:hover {
@ -133,7 +133,7 @@ limitations under the License. -->
} }
.opt-wrapper { .opt-wrapper {
color: #606266; color: var(--sw-setting-color);
position: absolute; position: absolute;
top: 26px; top: 26px;
left: 0; left: 0;

6
src/styles/theme.scss
View File

@ -46,6 +46,9 @@ html {
--sw-list-selected: #ededed; --sw-list-selected: #ededed;
--sw-table-header: #f3f4f9; --sw-table-header: #f3f4f9;
--sw-list-hover: rgb(0 0 0 / 4%); --sw-list-hover: rgb(0 0 0 / 4%);
--sw-setting-color: #606266;
--sw-alarm-tool: #f0f2f5;
--sw-alarm-tool-border: #c1c5ca41;
} }
html.dark { html.dark {
@ -78,6 +81,9 @@ html.dark {
--sw-list-hover: #262629; --sw-list-hover: #262629;
--sw-table-header: #303133; --sw-table-header: #303133;
--sw-list-selected: #3d444f; --sw-list-selected: #3d444f;
--sw-setting-color: #eee;
--sw-alarm-tool: #303133;
--sw-alarm-tool-border: #444;
} }
.el-table tr { .el-table tr {

2
src/views/Settings.vue
View File

@ -156,7 +156,7 @@ limitations under the License. -->
} }
.settings { .settings {
color: #606266; color: var(--sw-setting-color);
font-size: 13px; font-size: 13px;
padding: 20px; padding: 20px;

2
src/views/alarm/Content.vue
View File

@ -157,7 +157,7 @@ limitations under the License. -->
.timeline-table-i { .timeline-table-i {
padding: 10px 15px; padding: 10px 15px;
border-left: 4px solid #eee; border-left: 4px solid var(--border-color-primary);
position: relative; position: relative;
&::after { &::after {

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

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

2
src/views/dashboard/related/continuous-profiling/components/Policy.vue
View File

@ -216,7 +216,7 @@ limitations under the License. -->
cursor: text; cursor: text;
padding: 0 5px; padding: 0 5px;
border-radius: 4px; border-radius: 4px;
color: #606266; color: var(--sw-setting-color);
outline: none; outline: none;
height: 100px; height: 100px;