gfwleak/nezha-nezha-fronted
Archived
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix:修改样式

Browse Source
This commit is contained in:
zhangyu
2020-10-12 13:46:31 +08:00
parent 05ce71c643
commit a774960f4d
15 changed files with 77 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
nezha-fronted/src/assets/stylus/main.scss
View File

@@ -531,7 +531,7 @@ li{
/* begin--右侧内容*/ /* begin--右侧内容*/
.content-right { .content-right {
height: 100%; height: 100%;
padding: 0 5px; padding: 0 5px 0 10px;
display: inline-block; display: inline-block;
box-sizing: border-box; box-sizing: border-box;
background-color: $content-right-background-color; background-color: $content-right-background-color;
@@ -1614,8 +1614,8 @@ li{
/*列表中状态字段 的小圆点*/ /*列表中状态字段 的小圆点*/
.active-icon{ .active-icon{
margin-top:15px; margin-top:15px;
width:10px; width:8px;
height:10px; height:8px;
border-radius:50%; border-radius:50%;
display: inline-block; display: inline-block;
margin-right: 5px; margin-right: 5px;
@@ -2072,3 +2072,17 @@ li{
cursor: pointer; cursor: pointer;
} }
} }
.nz-icon-arrow-down{
font-size: 14px;
}
.nz-icon-caret-bottom{
font-size: 12px;
}
//.create-square-box{
// background: #ECECEC;
// border-radius: 4px;
// padding: 7px 10px;
//}
/deep/ .el-input--mini .el-input__icon{
line-height: 24px;
}

4
nezha-fronted/src/components/charts/chart-list.vue
View File

@@ -1,7 +1,7 @@
<style scoped> <style scoped>
.chartBox { .chartBox {
float:left; float:left;
padding: 20px 10px 0 10px; padding: 10px 10px 0 0;
position:relative; position:relative;
box-sizing: border-box; box-sizing: border-box;
} }
@@ -10,7 +10,7 @@
} }
.list-width{ .list-width{
width: calc(100% - 14px); width: calc(100% - 14px);
padding: 5px 15px 5px 10px; padding: 5px 15px 5px 0px;
box-sizing: border-box; box-sizing: border-box;
overflow: hidden;/*避免鼠标第一次放到曲线时，x轴出现滚动条后消失*/ overflow: hidden;/*避免鼠标第一次放到曲线时，x轴出现滚动条后消失*/
min-height: calc(100vh - 150px); min-height: calc(100vh - 150px);

4
nezha-fronted/src/components/common/project/addNode.vue
View File

@@ -34,7 +34,7 @@
<el-form-item label="Icon" prop="iconId" class="icon"> <el-form-item label="Icon" prop="iconId" class="icon">
<el-select v-model="form.iconId" placeholder="" popper-class="asset-dropdown" size="small" :loading="imgageLoading"> <el-select v-model="form.iconId" placeholder="" popper-class="asset-dropdown" size="small" :loading="imgageLoading">
<div slot="prefix" class="sel-image"> <div slot="prefix" class="sel-image">
<img v-if="form.iconId" :src="selImage.image" style="height: 28px"/> <img v-if="form.iconId" :src="selImage.image" style="height: 24px;margin-top: 2px"/>
<span v-if="form.iconId" class="sel-image-name">{{selImage.imageName}}</span> <span v-if="form.iconId" class="sel-image-name">{{selImage.imageName}}</span>
</div> </div>
<el-option <el-option
@@ -43,7 +43,7 @@
:label="item.label" :label="item.label"
:value="item.id"> :value="item.id">
<span style="float: left;width: 50%"> <span style="float: left;width: 50%">
<img :src="item.image" style="width: 24px;height: 32px"/> <img :src="item.image" style="height: 28px;margin-top: 2px"/>
</span> </span>
<span style="float: right; color: #8492a6; font-size: 13px">{{ item.imageName }}</span> <span style="float: right; color: #8492a6; font-size: 13px">{{ item.imageName }}</span>
</el-option> </el-option>

4
nezha-fronted/src/components/common/project/popData/alertTable.vue
View File

@@ -254,7 +254,7 @@
label: this.$t('alert.summary'), label: this.$t('alert.summary'),
prop: 'summary', prop: 'summary',
show: true, show: true,
minWidth:200 minWidth:100
}, { }, {
label: this.$t('alert.list.state'), label: this.$t('alert.list.state'),
prop: 'state', prop: 'state',
@@ -477,7 +477,7 @@
<style scoped> <style scoped>
.right-box-project-alert{ .right-box-project-alert{
width: 1220px; width: 850px;
padding-right: 30px; padding-right: 30px;
} }
.right-box-title{ .right-box-title{

2
nezha-fronted/src/components/common/project/popData/assetTable.vue
View File

@@ -344,7 +344,7 @@
<style scoped> <style scoped>
.right-box-project-alert{ .right-box-project-alert{
width: 1220px; width: 850px;
padding-right: 30px; padding-right: 30px;
} }
.right-box-title{ .right-box-title{

2
nezha-fronted/src/components/common/project/popData/endpointTable.vue
View File

@@ -334,7 +334,7 @@
<style scoped> <style scoped>
.right-box-project-alert{ .right-box-project-alert{
width: 1220px; width: 850px;
padding-right: 30px; padding-right: 30px;
} }
.right-box-title{ .right-box-title{

2
nezha-fronted/src/components/common/project/popData/lineChart.vue
View File

@@ -127,7 +127,7 @@
<loading :ref="'localLoadingScreen'+chartIndex"></loading> <loading :ref="'localLoadingScreen'+chartIndex"></loading>
</el-dialog> </el-dialog>
</div> </div>
<span class="vue-resizable-handle" @mousedown="startResize" v-if="filter.from != 'alertRule'"></span> <!--<span class="vue-resizable-handle" @mousedown="startResize" v-if="filter.from != 'alertRule'"></span>-->
</div> </div>
</div> </div>
</template> </template>

32
nezha-fronted/src/components/common/project/topology.vue
View File

@@ -1068,18 +1068,39 @@
.network-pop .error-model-stat .nz-icon.noMove{ .network-pop .error-model-stat .nz-icon.noMove{
color: #EC7F66; color: #EC7F66;
} }
.network-pop .selpop:hover{ .network-pop .selpop.nz-icon-hexagonBorder:hover{
transform: scale(1.2); transform: scale(1.2);
color: #4BB49B;
} }
.network-pop .selpop:hover .nz-icon-liubianxing{ .network-pop .selpop:hover .nz-icon-liubianxing{
transform: scale(1.1); transform: scale(1.1);
left: 4px; left: 4px;
font-size: 41px; font-size: 41px;
top: 0; top: 0;
color: #D7FAF1;
} }
.network-pop .selpop:hover .noMove{ .network-pop .selpop:hover .noMove{
transform: scale(1.2); transform: scale(1.2);
color: #4BB49B;
} }
.network-pop .selpop.nz-icon-hexagonBorder.error-model-stat:hover{
transform: scale(1.2);
color: #EC7F66;
}
.network-pop .selpop.error-model-stat:hover .nz-icon-liubianxing{
transform: scale(1.1);
left: 4px;
font-size: 41px;
top: 0;
color: #FBE7E3;
}
.network-pop .selpop.error-model-stat:hover .noMove{
transform: scale(1.2);
color: #EC7F66;
}
/*.network-pop .nz-icon-hexagonBorder.error-model-stat:hover{*/
/*color: #EC7F66;*/
/*}*/
/*.btmTriangle{*/ /*.btmTriangle{*/
/*position: absolute;*/ /*position: absolute;*/
/*width: 0;*/ /*width: 0;*/
@@ -1141,7 +1162,7 @@
.edit-topology{ .edit-topology{
color: #1a1a1a; color: #1a1a1a;
font-size: 18px; font-size: 18px;
font-weight: bold; /*font-weight: bold;*/
height: 28px; height: 28px;
position: absolute; position: absolute;
top: 15px; top: 15px;
@@ -1159,6 +1180,13 @@
margin-left: 30px; margin-left: 30px;
cursor: pointer; cursor: pointer;
} }
.edit-topology-add{
display: inline-block;
width: 30px;
}
.edit-topology-add:hover,.edit-topology-remove:active,.edit-topologyCancel{
font-weight: bold;
}
.sel-node{ .sel-node{
position: absolute; position: absolute;
width: 0; width: 0;

2
nezha-fronted/src/components/common/project/visNetwork.vue
View File

@@ -444,7 +444,7 @@
align-items:flex-start; align-items:flex-start;
} }
.facade-top-right-content > div{ .facade-top-right-content > div{
width: 80px; min-width: 84px;
height: 22px; height: 22px;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;

4
nezha-fronted/src/components/common/rightBox/assetBox.vue
View File

@@ -80,7 +80,9 @@
<div class="right-box-form-btns"> <div class="right-box-form-btns">
<button style="display: none;">第一个button会出现意料之外的hover样式，找不到原因，只好加个不可见的button规避问题</button> <button style="display: none;">第一个button会出现意料之外的hover样式，找不到原因，只好加个不可见的button规避问题</button>
<button id="module-add-param" type="button" @click="addTag"> <button id="module-add-param" type="button" @click="addTag">
<span><i style="font-size: 12px;" class="nz-icon nz-icon-create-square"></i></span> <span class="create-square-box">
<i style="font-size: 17px; cursor: pointer;" class="nz-icon nz-icon-create-square"></i>
</span>
</button> </button>
</div></div> </div></div>
<div class="line-100 right-box-line"></div> <div class="line-100 right-box-line"></div>

2
nezha-fronted/src/components/common/rightBox/moduleBox.vue
View File

@@ -250,7 +250,7 @@
<span><i class="nz-icon nz-icon-delete"></i></span> <span><i class="nz-icon nz-icon-delete"></i></span>
</button> </button>
<button id="module-add-param" type="button" @click="addParam" class="nz-btn nz-btn-size-normal nz-btn-style-light"> <button id="module-add-param" type="button" @click="addParam" class="nz-btn nz-btn-size-normal nz-btn-style-light">
<span><i style="font-size: 12px;" class="nz-icon nz-icon-create-square"></i></span> <span><i style="font-size: 16px;" class="nz-icon nz-icon-create-square"></i></span>
</button> </button>
</div> </div>
</template> </template>

2
nezha-fronted/src/components/common/rightBox/trafficSetting/trafficSettingTab.vue
View File

@@ -643,7 +643,7 @@
display: flex; display: flex;
margin-bottom: 5px; margin-bottom: 5px;
height: 20px; height: 20px;
line-height: 20px; line-height: 18px;
justify-content: flex-end; justify-content: flex-end;
} }
.tab-tags-item .tag-item-key{ .tab-tags-item .tag-item-key{

9
nezha-fronted/src/components/page/config/dc.vue
View File

@@ -58,9 +58,9 @@
<div v-if="item.prop == 'option'" class="content-right-options"> <div v-if="item.prop == 'option'" class="content-right-options">
<span :title="$t('overall.edit')" @click="edit(scope.row)" class="content-right-option" :id="'dc-edit-'+scope.row.id"><i class="nz-icon nz-icon-edit"></i></span> <span :title="$t('overall.edit')" @click="edit(scope.row)" class="content-right-option" :id="'dc-edit-'+scope.row.id"><i class="nz-icon nz-icon-edit"></i></span>
&nbsp; &nbsp;
<span :title="$t('overall.delete')" @click="del(scope.row)" class="content-right-option" :id="'dc-del-'+scope.row.id"><i class="nz-icon nz-icon-delete"></i></span>
&nbsp;
<span :title="$t('config.dc.traffic.title')" @click="configTraffic(scope.row)" class="content-right-option" :id="'dc-setting-'+scope.row.id" ><i class="nz-icon nz-icon-gear"></i></span> <span :title="$t('config.dc.traffic.title')" @click="configTraffic(scope.row)" class="content-right-option" :id="'dc-setting-'+scope.row.id" ><i class="nz-icon nz-icon-gear"></i></span>
&nbsp;
<span :title="$t('overall.delete')" @click="del(scope.row)" class="content-right-option" :id="'dc-del-'+scope.row.id"><i class="nz-icon nz-icon-delete"></i></span>
</div> </div>
<template v-else-if="item.prop == 'principal'"> <template v-else-if="item.prop == 'principal'">
<template v-if="scope.row.principal"> <template v-if="scope.row.principal">
@@ -467,3 +467,8 @@
} }
} }
</script> </script>
<style scoped>
.nz-icon-gear:before{
color: #606266;
}
</style>

10
nezha-fronted/src/components/page/dashboard/chartBox.vue
View File

@@ -164,7 +164,11 @@
<div v-if="!isUrl&&!isAlert" class="right-box-sub-title"> <div v-if="!isUrl&&!isAlert" class="right-box-sub-title">
<span>{{$t('alert.config.expr')}}</span> <span>{{$t('alert.config.expr')}}</span>
<span v-if="!isSingleStat" class="float-right" @click="addExpression"><i style="font-size: 16px; cursor: pointer;" class="nz-icon nz-icon-create-square"></i></span> <span v-if="!isSingleStat" style="height: 19px;display: inline-block;line-height: 1;" class="float-right" @click="addExpression">
<span class="create-square-box">
<i style="font-size: 17px; cursor: pointer;" class="nz-icon nz-icon-create-square"></i>
</span>
</span>
</div> </div>
<div v-if="isAlert" class="right-box-sub-title">{{$t('dashboard.panel.chartForm.alertParam.param')}}</div> <div v-if="isAlert" class="right-box-sub-title">{{$t('dashboard.panel.chartForm.alertParam.param')}}</div>
<div v-if="!isUrl" class="line-100"></div> <div v-if="!isUrl" class="line-100"></div>
@@ -190,7 +194,7 @@
<el-col style="width: 120px; padding-right: 20px; text-align: right; color: #666"> <el-col style="width: 120px; padding-right: 20px; text-align: right; color: #666">
{{$t('dashboard.panel.chartForm.legend')}}&nbsp; {{$t('dashboard.panel.chartForm.legend')}}&nbsp;
<el-popover :content="$t('dashboard.panel.chartForm.legendTip')" placement="top" width="150" trigger="hover"> <el-popover :content="$t('dashboard.panel.chartForm.legendTip')" placement="top" width="150" trigger="hover">
<i slot="reference" class="nz-icon nz-icon-info-normal" style="font-size: 12px; -webkit-transform:scale(0.75);display:inline-block;" @mouseover="rz"></i> <i slot="reference" class="nz-icon nz-icon-info-normal" style="font-size: 14px; -webkit-transform:scale(0.75);display:inline-block;" @mouseover="rz"></i>
</el-popover> </el-popover>
</el-col> </el-col>
<el-col style="width: calc(100% - 120px);"> <el-col style="width: calc(100% - 120px);">
@@ -261,7 +265,7 @@
<span style="margin-left: 50px;"></span> <span style="margin-left: 50px;"></span>
<template v-for="item in sortedOptionKeys"> <template v-for="item in sortedOptionKeys">
<div style="flex: 1"> <div style="flex: 1">
<span style="margin-right: 10px;">{{item.label}}</span> <span style="margin-right: 10px;color:rgb(102, 102, 102)">{{item.label}}</span>
<el-switch <el-switch
v-model="editChart.param.legendValue[item.key]" v-model="editChart.param.legendValue[item.key]"
active-value="on" active-value="on"

2
nezha-fronted/src/components/page/dashboard/panel.vue
View File

@@ -714,7 +714,7 @@
.panel-dropdown-title { .panel-dropdown-title {
line-height:24px; line-height:24px;
padding-left:5px; padding-left:5px;
margin-left:10px; /*margin-left:10px;*/
margin-top: 3px; margin-top: 3px;
text-align:left; text-align:left;
border-radius:4px; border-radius:4px;