github/skywalking-booster-ui
2
0
Fork 1
mirror of https://github.com/apache/skywalking-booster-ui.git synced 2025-05-02 06:34:01 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix: update alerting detail style (#317)

Browse Source
This commit is contained in:
Fine0830 2023-09-01 15:38:22 +08:00 committed by GitHub
parent b7115a4e47
commit 56a02293cf
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 98 additions and 116 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -142,7 +142,79 @@ limitations under the License. -->
}
</script>
<style lang="scss" scoped>
@import url("../components/style.scss");
.timeline-table {
padding: 30px 20px 20px 40px;
flex-grow: 1;
overflow: auto;
height: 100%;
}
.time-line {
padding: 14px 30px;
min-height: 63px;
max-width: 132px;
}
.timeline-table-i {
padding: 10px 15px;
border-left: 4px solid #eee;
position: relative;
&::after {
content: "";
display: inline-block;
position: absolute;
width: 7px;
height: 7px;
left: -23px;
top: 25px;
border-radius: 4px;
background-color: #448dfe;
}
&::before {
content: "";
display: inline-block;
position: absolute;
width: 1px;
height: calc(100% + 11px);
top: 0;
left: -20px;
border-radius: 5px;
background-color: #448dfe99;
}
}
.timeline-table-i-scope {
display: inline-block;
padding: 0 8px;
border: 1px solid;
margin-top: -1px;
border-radius: 4px;
}
.timeline-item {
cursor: pointer;
margin-bottom: 9px;
}
.keys {
font-weight: bold;
display: inline-block;
width: 120px;
}
.source > span {
display: inline-block;
}
.source > div {
padding-left: 120px;
}
.uuid {
width: 280px;
}
.tips {
width: 100%;
@ -150,4 +222,29 @@ limitations under the License. -->
text-align: center;
font-size: $font-size-normal;
}
.alarm-detail {
max-height: 600px;
overflow: auto;
ul {
min-height: 100px;
overflow: auto;
margin-bottom: 20px;
}
li {
cursor: pointer;
> span {
width: 160px;
height: 20px;
line-height: 20px;
text-align: center;
display: inline-block;
border-bottom: 1px solid $disabled-color;
overflow: hidden;
}
}
}
</style>

115
src/views/components/style.scss
View File

@ -1,115 +0,0 @@
/**
* Licensed to the Apache Software Foundation (ASF) under one or more
* contributor license agreements. See the NOTICE file distributed with
* this work for additional information regarding copyright ownership.
* The ASF licenses this file to You under the Apache License, Version 2.0
* (the "License"); you may not use this file except in compliance with
* the License. You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
.timeline-table {
padding: 30px 20px 20px 40px;
flex-grow: 1;
overflow: auto;
height: 100%;
}
.time-line {
padding: 14px 30px;
min-height: 63px;
max-width: 132px;
}
.timeline-table-i {
padding: 10px 15px;
border-left: 4px solid #eee;
position: relative;
&::after {
content: "";
display: inline-block;
position: absolute;
width: 7px;
height: 7px;
left: -23px;
top: 25px;
border-radius: 4px;
background-color: #448dfe;
}
&::before {
content: "";
display: inline-block;
position: absolute;
width: 1px;
height: calc(100% + 11px);
top: 0;
left: -20px;
border-radius: 5px;
background-color: #448dfe99;
}
}
.timeline-table-i-scope {
display: inline-block;
padding: 0 8px;
border: 1px solid;
margin-top: -1px;
border-radius: 4px;
}
.timeline-item {
cursor: pointer;
margin-bottom: 9px;
}
.alarm-detail {
max-height: 600px;
overflow: auto;
ul {
min-height: 100px;
overflow: auto;
margin-bottom: 20px;
}
li {
cursor: pointer;
> span {
width: 160px;
height: 20px;
line-height: 20px;
text-align: center;
display: inline-block;
border-bottom: 1px solid $disabled-color;
overflow: hidden;
}
}
}
.keys {
font-weight: bold;
display: inline-block;
width: 120px;
}
.source > span {
display: inline-block;
}
.source > div {
padding-left: 120px;
}
.uuid {
width: 280px;
}