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 17:33:00 +09:00
parent e3c9b8bd40
commit be0b0088f3
8 changed files with 43 additions and 56 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
@overflow/commons/ui/component/window/title-bar.component.html
View File

@ -1,12 +1,6 @@
<div [ngClass]="titleBarClass" id="app-title-bar" (dblclick)="onTitlebarDoubleClick($event)" [ngStyle]="style"> <div [ngClass]="titleBarClass" id="app-title-bar" (dblclick)="onTitlebarDoubleClick($event)" [ngStyle]="style">
<div *ngIf="showTopResize" class="resize-handle top"></div> <div *ngIf="showTopResize" class="resize-handle top"></div>
<div *ngIf="showLeftResize" class="resize-handle left"></div> <div *ngIf="showLeftResize" class="resize-handle left"></div>
<svg svg aria-hidden="true" class="app-icon" version="1.1" viewBox="0 0 16 16" width="16" height="16">
<path d="M10.2,8.4L10,8l0.2-0.4l3.4,0l2.1-3.7l-2.1-3.7H9.4L7.3,3.9L9,6.9L8.7,7.3H8.2L6.5,4.3H2.3L0.2,8l2.1,3.7h4.2
l1.7-2.9h0.5L9,9.1l-1.7,2.9l2.1,3.7l4.2,0l2.1-3.7l-2.1-3.7L10.2,8.4z M9,3.9l1.3-2.2h2.5l1.3,2.2l-1.3,2.2l-1.7,0l1-1.7l-1.3-0.7
l-1,1.7L9,3.9z M5.7,10.2H3.1L1.9,8l1.3-2.2h2.5l0.8,1.5H4.6v1.5h1.9L5.7,10.2z M12.8,14.3h-2.5L9,12.1l0.8-1.5l1,1.7l1.3-0.7
l-1-1.7h1.7l1.3,2.2L12.8,14.3z"></path>
</svg>
<svg svg aria-hidden="true" class="app-icon" version="1.1" viewBox="0 0 16 16" width="16" height="16"> <svg svg aria-hidden="true" class="app-icon" version="1.1" viewBox="0 0 16 16" width="16" height="16">
<polygon points="6.7,6.3 8,5.6 11.9,7.8 11.9,5.8 8,3.5 4.1,5.8 4.1,10.3 8,12.5 8,10.5 5.8,9.3 5.8,7.8 14,12.5 <polygon points="6.7,6.3 8,5.6 11.9,7.8 11.9,5.8 8,3.5 4.1,5.8 4.1,10.3 8,12.5 8,10.5 5.8,9.3 5.8,7.8 14,12.5
@ -15,16 +9,6 @@
14.9,4.1 " /> 14.9,4.1 " />
</svg> </svg>
<!-- <svg aria-hidden="true" class="app-icon" version="1.1" viewBox="0 0 16 16" width="16" height="16">
<path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01
1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12
0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82
2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.013 8.013 0 0 0 16 8c0-4.42-3.58-8-8-8z"
/>
</svg> -->
<app-menu-bar></app-menu-bar> <app-menu-bar></app-menu-bar>
<div class="window-controls"> <div class="window-controls">

20
src/assets/image/icon/icon_overflow.svg
View File

@ -21,21 +21,9 @@
</g> </g>
<path class="st2" d="M16,35.3l12-20.8h24l12,20.8L52,56.1H28L16,35.3z M20,69.9h40l20-34.6L60,0.7H20L0,35.3L20,69.9z"/> <path class="st2" d="M16,35.3l12-20.8h24l12,20.8L52,56.1H28L16,35.3z M20,69.9h40l20-34.6L60,0.7H20L0,35.3L20,69.9z"/>
<g> <g>
<g> <polygon class="st3" points="38.8,31.9 39.9,31.2 43.5,33.2 43.5,31.4 39.9,29.4 36.4,31.4 36.4,35.5 39.9,37.5 39.9,35.7 38,34.6
<path class="st3" d="M37.4,35.4h-2.3l-1.1-2l1.1-2h2.3l1.1,2L37.4,35.4z M40,33.4l-1.9-3.3h-3.8l-1.9,3.3l1.9,3.3h3.8L40,33.4z"/> 38,33.2 45.5,37.5 46.2,37.1 46.2,36.2 "/>
<path class="st3" d="M36.4,34.1H41v-1.3h-4.5L36.4,34.1L36.4,34.1z"/> <polygon class="st3" points="39.9,26.2 33.7,29.8 33.7,37.1 39.9,40.7 44.8,37.9 43.2,37 39.9,38.9 35.2,36.2 35.2,30.7 39.9,28
</g> 44.7,30.7 44.7,34.6 46.2,35.5 46.2,29.8 "/>
<g>
<g>
<path class="st3" d="M43.7,35.1l1.1,2l-1.1,2h-2.3l-1.1-2l1.1-2H43.7z M40.7,33.8l-1.9,3.3l1.9,3.3h3.8l1.9-3.3l-1.9-3.3H40.7z"
/>
<path class="st3" d="M43,36.6l-2.3-3.9l-1.1,0.7l2.3,3.9L43,36.6z"/>
</g>
<g>
<path class="st3" d="M40.3,29.8l1.1-2h2.3l1.1,2l-1.1,2h-2.3L40.3,29.8z M40.7,33.1h3.8l1.9-3.3l-1.9-3.3h-3.8l-1.9,3.3
L40.7,33.1z"/>
<path class="st3" d="M41.9,29.7l-2.3,3.9l1.1,0.7l2.3-3.9L41.9,29.7z"/>
</g>
</g>
</g> </g>
</svg> </svg>

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.8 KiB

After

Width:  |  Height:  |  Size: 1.5 KiB

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

@ -1,12 +1,13 @@
<div class="ui-g-12"> <div class="ui-g-12">
<div class="ui-g 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">
<image x="-40" y="-20" width="260" height="260" preserveAspectRatio="xMidYMid slice" xlink:href="../../assets/image/logo/logo_tomcat.svg" /> <image x="-40" y="-20" width="260" height="260" preserveAspectRatio="xMidYMid slice" xlink:href="../../assets/image/logo/logo_tomcat.svg" />
</svg> --> </svg> -->
<svg width="140" height="140" viewBox="15 35 140 100"> <div class="svg-div">
<image x="-50" y="-40" width="260" height="260" preserveAspectRatio="xMidYMid slice" xlink:href="../../assets/image/icon/icon_router.svg" /> <svg width="140" height="140" viewBox="15 35 140 100">
</svg> <image x="-50" y="-40" width="260" height="260" preserveAspectRatio="xMidYMid slice" xlink:href="../../assets/image/icon/icon_router.svg" />
</svg>
</div>
<h3>{{host.name}} <span>{{host.address}}</span></h3> <h3>{{host.name}} <span>{{host.address}}</span></h3>
</div> </div>

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

@ -1,10 +1,12 @@
.detail-img { .detail-img {
display: inline; display: inline;
width: 140px;
padding: 10px; padding: 10px;
svg{ .svg-div{
display: inline; display: inline;
} }
// svg{
// display: inline;
// }
h3{ h3{
display: inline; display: inline;
padding: 10px 0 10px 5px; padding: 10px 0 10px 5px;

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

@ -1,12 +1,14 @@
<div class="ui-g-12"> <div class="ui-g-12">
<div class="detail-img"> <div class="ui-g detail-img">
<!-- <svg width="200" height="200" viewBox="20 40 140 100"> <!-- <svg width="200" height="200" viewBox="20 40 140 100">
<image x="-40" y="-20" width="260" height="260" preserveAspectRatio="xMidYMid slice" xlink:href="../../assets/image/logo/logo_tomcat.svg" /> <image x="-40" y="-20" width="260" height="260" preserveAspectRatio="xMidYMid slice" xlink:href="../../assets/image/logo/logo_tomcat.svg" />
</svg> --> </svg> -->
<svg width="140" height="140" viewBox="15 35 140 100"> <div class="svg-div">
<image x="-50" y="-40" width="260" height="260" preserveAspectRatio="xMidYMid slice" xlink:href="../../assets/image/icon/icon_router.svg" /> <svg width="140" height="140" viewBox="15 35 140 100">
</svg> <image x="-50" y="-40" width="260" height="260" preserveAspectRatio="xMidYMid slice" xlink:href="../../assets/image/icon/icon_router.svg" />
</svg>
</div>
<h3> <h3>
{{service.name}} {{service.port.host.address}} {{service.name}} {{service.port.host.address}}
</h3> </h3>

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

@ -1,10 +1,12 @@
.detail-img { .detail-img {
display: inline; display: inline;
width: 140px;
padding: 10px; padding: 10px;
svg{ .svg-div{
display: inline; display: inline;
} }
// svg{
// display: inline;
// }
h3{ h3{
display: inline; display: inline;
padding: 10px 0 10px 5px; padding: 10px 0 10px 5px;
@ -16,7 +18,11 @@
display: inline; display: inline;
} }
.detail-content-meta-title > ul{ .detail-content-meta-title > ul{
padding-top: 0; -webkit-margin-before: 0.5em;
-webkit-margin-after: 1em;
-webkit-margin-start: 0px;
-webkit-margin-end: 0px;
-webkit-padding-start: 0px;
} }
.detail-content-meta-title > li{ .detail-content-meta-title > li{
padding: 20px 0 0 0; padding: 20px 0 0 0;

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

@ -1,12 +1,14 @@
<div class="ui-g-12"> <div class="ui-g-12">
<div class="detail-img"> <div class="ui-g detail-img">
<!-- <svg width="200" height="200" viewBox="20 40 140 100"> <!-- <svg width="200" height="200" viewBox="20 40 140 100">
<image x="-40" y="-20" width="260" height="260" preserveAspectRatio="xMidYMid slice" xlink:href="../../assets/image/logo/logo_tomcat.svg" /> <image x="-40" y="-20" width="260" height="260" preserveAspectRatio="xMidYMid slice" xlink:href="../../assets/image/logo/logo_tomcat.svg" />
</svg> --> </svg> -->
<svg width="140" height="140" viewBox="15 35 140 100"> <div class="svg-div">
<image x="-50" y="-40" width="260" height="260" preserveAspectRatio="xMidYMid slice" xlink:href="../../assets/image/icon/icon_router.svg" /> <svg width="140" height="140" viewBox="15 35 140 100">
</svg> <image x="-50" y="-40" width="260" height="260" preserveAspectRatio="xMidYMid slice" xlink:href="../../assets/image/icon/icon_router.svg" />
</svg>
</div>
<h3> <h3>
{{zone.network}} {{zone.network}}
</h3> </h3>

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

@ -1,10 +1,12 @@
.detail-img { .detail-img {
display: inline; display: inline;
width: 140px;
padding: 10px; padding: 10px;
svg{ .svg-div{
display: inline; display: inline;
} }
// svg{
// display: inline;
// }
h3{ h3{
display: inline; display: inline;
padding: 10px 0 10px 5px; padding: 10px 0 10px 5px;