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: update theme

Browse Source
This commit is contained in:
Fine 2023-11-15 11:58:01 +08:00
parent 832dc1676b
commit 3cbb5e87ca
5 changed files with 94 additions and 92 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
src/components/Graph.vue
View File

@ -252,11 +252,11 @@ limitations under the License. -->
display: block;
white-space: nowrap;
z-index: 9999999;
box-shadow: #ddd 1px 2px 10px;
box-shadow: var(--sw-topology-box-shadow);
transition: all cubic-bezier(0.075, 0.82, 0.165, 1) linear;
background-color: rgb(255 255 255);
background-color: var(--sw-bg-color-overlay);
border-radius: 4px;
color: rgb(51 51 51);
color: $font-color;
padding: 5px;
}
@ -267,7 +267,7 @@ limitations under the License. -->
&:hover {
color: $active-color;
background-color: #eee;
background-color: $popper-hover-bg-color;
}
}
</style>

86
src/styles/reset.scss
View File

@ -123,89 +123,3 @@ code,
pre {
font-family: Consolas, Menlo, Courier, monospace;
}
.el-menu {
--el-menu-item-height: 50px;
}
.el-menu-item-group__title {
display: none;
}
.el-sub-menu .el-menu-item {
height: 40px;
line-height: 40px;
padding: 0 0 0 56px !important;
}
.el-sub-menu__title {
.el-icon.menu-icons {
margin-top: -5px !important;
}
}
.el-drawer__header {
margin-bottom: 0;
padding-left: 10px;
font-size: 16px;
}
.el-drawer__body {
padding: 0;
}
.switch {
margin: 0 5px;
}
div.vis-tooltip {
max-width: 600px;
overflow: hidden;
background-color: var(--vis-tooltip-bg) !important;
white-space: normal !important;
font-size: $font-size-smaller !important;
color: var(--font-color) !important;
}
.vis-item {
cursor: pointer;
height: 20px;
}
.vis-item.Error {
background-color: #e66;
opacity: 0.8;
border-color: #e66;
color: var(--sw-event-vis-selected) !important;
}
.vis-item.Normal {
background-color: #fac858;
border-color: #fac858;
color: var(--sw-event-vis-selected) !important;
}
.vis-item .vis-item-content {
padding: 0 3px !important;
}
.vis-item.vis-selected.Error,
.vis-item.vis-selected.Normal {
color: var(--sw-event-vis-selected) !important;
}
.vis-time-axis .vis-text {
color: var(--sw-time-axis-text) !important;
}
.el-menu--vertical.sub-list {
display: none;
}
div:has(> a.menu-title) {
display: none;
}
.el-input-number .el-input__inner {
text-align: left !important;
}

88
src/styles/theme.scss
View File

@ -54,6 +54,7 @@ html {
--sw-time-axis-text: #4d4d4d;
--sw-drawer-header: #72767b;
--sw-marketplace-border: #dedfe0;
--sw-grid-item-active: #79bbff;
}
html.dark {
@ -94,6 +95,7 @@ html.dark {
--sw-time-axis-text: #aaa;
--sw-drawer-header: #e9e9eb;
--sw-marketplace-border: #606266;
--sw-grid-item-active: #73767a;
}
.el-drawer__header {
@ -150,3 +152,89 @@ $theme-background: var(--theme-background);
$active-background: var(--el-color-primary);
$font-size-smaller: 12px;
$font-size-normal: 14px;
.el-menu {
--el-menu-item-height: 50px;
}
.el-menu-item-group__title {
display: none;
}
.el-sub-menu .el-menu-item {
height: 40px;
line-height: 40px;
padding: 0 0 0 56px !important;
}
.el-sub-menu__title {
.el-icon.menu-icons {
margin-top: -5px !important;
}
}
.el-drawer__header {
margin-bottom: 0;
padding-left: 10px;
font-size: 16px;
}
.el-drawer__body {
padding: 0;
}
.switch {
margin: 0 5px;
}
div.vis-tooltip {
max-width: 600px;
overflow: hidden;
background-color: var(--vis-tooltip-bg) !important;
white-space: normal !important;
font-size: $font-size-smaller !important;
color: var(--font-color) !important;
}
.vis-item {
cursor: pointer;
height: 20px;
}
.vis-item.Error {
background-color: #e66;
opacity: 0.8;
border-color: #e66;
color: var(--sw-event-vis-selected) !important;
}
.vis-item.Normal {
background-color: #fac858;
border-color: #fac858;
color: var(--sw-event-vis-selected) !important;
}
.vis-item .vis-item-content {
padding: 0 3px !important;
}
.vis-item.vis-selected.Error,
.vis-item.vis-selected.Normal {
color: var(--sw-event-vis-selected) !important;
}
.vis-time-axis .vis-text {
color: var(--sw-time-axis-text) !important;
}
.el-menu--vertical.sub-list {
display: none;
}
div:has(> a.menu-title) {
display: none;
}
.el-input-number .el-input__inner {
text-align: left !important;
}

2
src/views/dashboard/controls/Tab.vue
View File

@ -375,7 +375,7 @@ limitations under the License. -->
}
.vue-grid-item.active {
border: 1px solid $active-color;
border: 1px solid var(--sw-grid-item-active);
}
.no-data-tips {

2
src/views/dashboard/panel/Layout.vue
View File

@ -91,7 +91,7 @@ limitations under the License. -->
}
.vue-grid-item.active {
border: 1px solid $active-color;
border: 1px solid var(--sw-grid-item-active);
}
.no-data-tips {