gfwleak/cyber-narrator-cn-ui
Archived
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

CN-333 fix : 修复一些样式问题和代码逻辑问题

Browse Source
This commit is contained in:
zhangxiaolong
2022-03-07 14:59:14 +08:00
parent b8c630c5e0
commit 3db36759db
5 changed files with 269 additions and 113 deletions
Download Patch File Download Diff File Expand all files Collapse all files

47
src/assets/css/components/views/chartHeader.scss
View File

@@ -1,40 +1,57 @@
.cn-chart-header-button{
.cn-chart-header-button {
display: flex;
.cn-chart-header-button-all{
border: 1px solid #0091FF;
button:first-of-type{
border-radius: 2px 0 0 2px;
}
.cn-chart-header-button-all {
border-color: #0091FF;
color: #0091FF;
background-color: #FFFFFF;
border-radius: 2px 0 0 2px;
}
.cn-chart-header-button-critical{
border: 1px solid #0091FF;
.cn-chart-header-button-critical {
border-color: #0091FF;
color: #0091FF;
border-radius: 2px;
background-color: #FFFFFF;
}
.cn-chart-header-button-high{
border: 1px solid #0091FF;
.cn-chart-header-button-high {
border-color: #0091FF;
border-radius: 2px;
background-color: #FFFFFF;
color: #0091FF;
}
.cn-chart-header-button-low{
border: 1px solid #0091FF;
.cn-chart-header-button-low {
border-color: #0091FF;
border-radius: 2px;
background-color: #FFFFFF;
color: #0091FF;
}
.cn-chart-header-button-info{
border: 1px solid #0091FF;
.cn-chart-header-button-info {
border-color: #0091FF;
border-radius: 2px;
background-color: #FFFFFF;
color: #0091FF;
}
.cn-chart-header-button-medium{
.cn-chart-header-button-medium {
border: 1px solid #0091FF;
border-radius: 2px;
background-color: #FFFFFF;
color: #0091FF;
}
.el-button--default{
.el-button--default {
height: 24px;
border-radius: 2px 0 0 2px;
min-height:24px;
border-radius: 2px;
min-height: 24px;
display: flex;
justify-content: center;
align-items: center;

58
src/assets/css/components/views/charts/chartAlarmInfo.scss
View File

@@ -3,23 +3,28 @@
height: 100%;
margin-left: 30px;
position: relative;
.cn-chart-alarm-info-mainContent{
height: calc(100% - 40px) ;
.cn-chart-alarm-info-mainContent {
height: calc(100% - 40px);
width: 100%;
.cn-chart-alarm-content {
display: flex;
justify-content: flex-start;
align-items: center;
width: 100%;
height: calc(100% / 9);
border-bottom: 1px solid #E7EAED ;
border-bottom: 1px solid #E7EAED;
.cn-alarm-info-main {
display: flex;
.cn-alarm-info-main-left{
.cn-alarm-info-main-left {
position: relative;
display: flex;
justify-content: center;
align-items: center;
.cn-chart-alarm-info-icon {
width: 30px;
height: 30px;
@@ -28,56 +33,68 @@
justify-content: center;
align-items: center;
}
.cn-icon-alert{
.cn-icon-alert {
width: 12px;
position: absolute;
top: 13px;
left: 7px;
top: calc(50% - 6px);
left: calc(50% - 6px);
}
}
.cn-alarm-info-textContent{
.cn-alarm-info-textContent {
margin-left: 17px;
.cn-alarm-info-main-title {
font-size: 19px;
font-size: 16px;
line-height: 19px;
}
.cn-alarm-info-bottom {
display: flex;
font-size: 14px;
font-size: 12px;
line-height: 14px;
text-align: center;
margin-top: 10px;
display: flex;
flex-wrap: wrap;
.cn-alarm-info-bottom-middle {
display: flex;
margin-left: 20px;
height: 14px;
.cn-alarm-info-bottom-time {
color: #999999;
line-height: 14px;
font-size: 12px;
}
}
.cn-alarm-info-bottom-right {
display: flex;
justify-content: center;
align-items: center;
margin-left: 17px;
.cn-alarm-info-bottom-time {
color: #999999;
line-height: 14px;
font-size: 12px;
}
}
.cn-alarm-info-bottom-type {
width: auto;
height: 16px;
font-size: 12px;
border: 1px solid;
font-weight: 400;
max-width: 72px;
overflow: hidden;
}
.cn-alarm-info-bottom-circle {
display: inline-block;
width: 5px;
@@ -85,13 +102,14 @@
border-radius: 50%;
}
}
}
}
}
}
.cn-chart-alarm-info-pagination{
.cn-chart-alarm-info-pagination {
height: 40px;
width: 100%;
}