overflow_scanner/app
3
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

design

Browse Source
This commit is contained in:
sunny 2018-09-12 16:24:02 +09:00
parent b9df48a54c
commit 17d142a740
9 changed files with 180 additions and 201 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
src/commons/component/host-detail.component.html
View File

@ -1,4 +1,4 @@
<div class="ui-g-12 detail-view-box"> <div class="ui-g-12">
<div class="detail-img"> <div class="detail-img">
<!-- <svg width="200" height="200" viewBox="20 40 140 100"> <!-- <svg width="200" height="200" viewBox="20 40 140 100">
@ -7,13 +7,10 @@
<svg width="140" height="140" viewBox="15 35 140 100"> <svg width="140" height="140" viewBox="15 35 140 100">
<image x="-50" y="-40" width="260" height="260" preserveAspectRatio="xMidYMid slice" xlink:href="../../assets/image/icon/icon_router.svg" /> <image x="-50" y="-40" width="260" height="260" preserveAspectRatio="xMidYMid slice" xlink:href="../../assets/image/icon/icon_router.svg" />
</svg> </svg>
<h3>{{host.name}} <span>{{host.address}}</span></h3>
</div> </div>
<div class="detail-content"> <p-tabView class="detail-content">
<h3>{{host.name}} <span>{{host.address}}</span></h3>
<p-tabView>
<p-tabPanel header="General"> <p-tabPanel header="General">
<ul class="key-value"> <ul class="key-value">
@ -69,4 +66,3 @@
<p-listbox [options]="ports" [(ngModel)]="selectedPort" optionLabel="name"></p-listbox> <p-listbox [options]="ports" [(ngModel)]="selectedPort" optionLabel="name"></p-listbox>
</p-tabPanel> </p-tabPanel>
</p-tabView> </p-tabView>
</div>

27
src/commons/component/host-detail.component.scss
View File

@ -1,15 +1,21 @@
.detail-view-box { .detail-img {
width: 100%; display: inline;
padding : 10px 160px 0 0; width: 140px;
padding: 10px;
svg{
display: inline;
}
h3{ h3{
padding: 20px 0 20px 5px; display: inline;
padding: 10px 0 10px 5px;
// padding: 5px; // padding: 5px;
// height: 60px; // height: 60px;
// span{
// font-size: 0.7em;
// color: #757575;
// }
} }
}
.detail-content {
display: inline;
}
.key-value { .key-value {
list-style-type: none; list-style-type: none;
margin: 0; margin: 0;
@ -30,8 +36,3 @@
} }
} }
} }
}
.tab-border-bottom .ui-widget-header {
border: 0 !important;
}

14
src/commons/component/nic-dropdown.component.scss
View File

@ -2,9 +2,15 @@
border: 0px; border: 0px;
} }
#nic-list-border .ui-widget-content .ui-listbox .ui-listbox-list { // #nic-list-border.ui-widget-content .ui-listbox .ui-listbox-list {
line-height: 2em; // line-height: 2em;
// }
#nic-list-border.ui-listbox-item {
padding: 1em;
.title{
}
.description {
font-size: 0.8em;
} }
#nic-list-border .ui-widget-content .ui-listbox .ui-listbox-item {
padding: 0.5em;
} }

2
src/commons/component/node-detail.component.html
View File

@ -1,4 +1,5 @@
<div class="ui-g"> <div class="ui-g">
<div class="ui-g-12">
<ng-container [ngSwitch]="node.group"> <ng-container [ngSwitch]="node.group">
@ -19,3 +20,4 @@
</ng-container> </ng-container>
</div> </div>
</div>

14
src/commons/component/node-detail.component.scss
View File

@ -1,14 +0,0 @@
.detail-img {
position: absolute;
top: 0px;
left: 0px;
width: 140px;
padding: 10px;
}
.detail-content {
position: absolute;
top: 0px;
left: 0px;
width: 100%;
margin: 0 0 0 150px
}

7
src/commons/component/service-detail.component.html
View File

@ -1,4 +1,4 @@
<div class="ui-g-12 detail-view-box"> <div class="ui-g-12">
<div class="detail-img"> <div class="detail-img">
<!-- <svg width="200" height="200" viewBox="20 40 140 100"> <!-- <svg width="200" height="200" viewBox="20 40 140 100">
@ -7,13 +7,12 @@
<svg width="140" height="140" viewBox="15 35 140 100"> <svg width="140" height="140" viewBox="15 35 140 100">
<image x="-50" y="-40" width="260" height="260" preserveAspectRatio="xMidYMid slice" xlink:href="../../assets/image/icon/icon_router.svg" /> <image x="-50" y="-40" width="260" height="260" preserveAspectRatio="xMidYMid slice" xlink:href="../../assets/image/icon/icon_router.svg" />
</svg> </svg>
</div>
<h3> <h3>
{{service.name}} {{service.port.host.address}} {{service.name}} {{service.port.host.address}}
</h3> </h3>
</div>
<p-tabView> <p-tabView class="detail-content">
<p-tabPanel header="General"> <p-tabPanel header="General">
<ul class="key-value"> <ul class="key-value">

43
src/commons/component/service-detail.component.scss
View File

@ -1,11 +1,21 @@
.detail-view-box { .detail-img {
width: 100%; display: inline;
padding : 10px 160px 0 0; width: 140px;
padding: 10px;
svg{
display: inline;
}
h3{ h3{
padding: 20px 0 20px 5px; display: inline;
padding: 10px 0 10px 5px;
// padding: 5px; // padding: 5px;
// height: 60px; // height: 60px;
} }
}
.detail-content {
display: inline;
}
.key-value { .key-value {
list-style-type: none; list-style-type: none;
margin: 0; margin: 0;
@ -26,28 +36,3 @@
} }
} }
} }
}
.tab-border-bottom .ui-widget-header {
border: 0 !important;
}
// .key-value {
// list-style-type: none;
// margin: 28px 0 0 0;
// padding: 0;
// box-sizing: border-box;
// width: 500px;
// li {
// padding: 8px 14px;
// border-bottom: 1px solid #d8dae2;
// position: relative;
// font-weight: bold;
// width: 180px;
// .meta-value {
// font-weight: 100;
// position: absolute;
// width: 300px;
// right: 40px;
// }
// }
// }

7
src/commons/component/zone-detail.component.html
View File

@ -1,4 +1,4 @@
<div id="detail-view-box"> <div class="ui-g-12">
<div class="detail-img"> <div class="detail-img">
<!-- <svg width="200" height="200" viewBox="20 40 140 100"> <!-- <svg width="200" height="200" viewBox="20 40 140 100">
@ -7,13 +7,12 @@
<svg width="140" height="140" viewBox="15 35 140 100"> <svg width="140" height="140" viewBox="15 35 140 100">
<image x="-50" y="-40" width="260" height="260" preserveAspectRatio="xMidYMid slice" xlink:href="../../assets/image/icon/icon_router.svg" /> <image x="-50" y="-40" width="260" height="260" preserveAspectRatio="xMidYMid slice" xlink:href="../../assets/image/icon/icon_router.svg" />
</svg> </svg>
</div>
<h3> <h3>
{{zone.network}} {{zone.network}}
</h3> </h3>
</div>
<p-tabView class="tab-border-bottom"> <p-tabView class="detail-content">
<p-tabPanel header="General"> <p-tabPanel header="General">
<ul class="key-value"> <ul class="key-value">

23
src/commons/component/zone-detail.component.scss
View File

@ -1,11 +1,21 @@
#detail-view-box { .detail-img {
width: 100%; display: inline;
padding : 10px 160px 0 0; width: 140px;
padding: 10px;
svg{
display: inline;
}
h3{ h3{
padding: 20px 0 20px 5px; display: inline;
padding: 10px 0 10px 5px;
// padding: 5px; // padding: 5px;
// height: 60px; // height: 60px;
} }
}
.detail-content {
display: inline;
}
.key-value { .key-value {
list-style-type: none; list-style-type: none;
margin: 0; margin: 0;
@ -26,8 +36,3 @@
} }
} }
} }
}
#detail-view-box .ui-widget-header {
border: 0 0 1px 0 !important;
}