overflow_cloud/member_webapp
3
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

design

Browse Source
This commit is contained in:
sunny 2018-04-20 17:35:36 +09:00
parent 42a78a213b
commit 2f669d986f
5 changed files with 39 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
src/app/pages/account/settings/settings-page.component.html
View File

@ -2,7 +2,6 @@
<div class="ui-g">
<div class="ui-g-12">
<div class="card no-margin">
<h1>totp</h1>
<of-settings-totp></of-settings-totp>
</div>
</div>

29
src/packages/member/component/settings/totp/config/config-setting.component.html
View File

@ -12,30 +12,33 @@
</p-card>
</div>
<div class="ui-g-6">
<p-card>
<p-card>
<p><b>안드로이드 회원</b>은 구글 플레이 스토어 또는 핸드폰 브라우저를 통해 "구글 인증기(OTP)" 검색 후 다운로드 해주세요.</p>
<button type="button" pButton label="Google Play" icon="fa-check"></button>
</p-card>
</p-card>
</div>
</div>
<div class="ui-g-12">
<h2>Key & Backup Code</h2>
<div class="ui-bottom-space-10" *ngIf="totp">{{totp.key}}, {{totp.uri}}</div>
<div class="ui-bottom-space-10" *ngIf="totp">
<qrcode [qrdata]="totp.uri" [size]="128" [level]="'M'"></qrcode>
<div class="ui-g-3" *ngIf="totp">
<qrcode [qrdata]="totp.uri" [size]="150" [level]="'M'"></qrcode>
</div>
<form fxLayout="column" fxLayoutAlign="start stretch" [formGroup]="totpForm" (ngSubmit)="totpRegistClick()">
<input type="text"
id="code" class="input"
placeholder="Please enter your code"
formControlName="code" required matInput>
</form>
<div class="ui-g-9">
<div style="height: 80px;"></div>
<div class="ui-bottom-space-10" *ngIf="totp">{{totp.key}}, {{totp.uri}}</div>
<span class="md-inputfield">
<input type="text" id="code" autocomplete="off" placeholder="Please enter your code" formControlName="code"
required class="ui-inputtext ui-corner-all ui-state-default ui-widget" [formGroup]="totpForm" (ngSubmit)="totpRegistClick()">
</span>
</div>
<!--QR Code print & Key Print-->
</div>
<div class="ui-g-12" dir="rtl">
<button type="button" class="ui-button-width-fit ui-button-secondary" pButton icon="fa-close" (click)="onCancel()" label="No"></button>
<button type="button" class="ui-button-width-fit" pButton icon="fa-check" (click)="totpSettingDisplay=false" label="Yes"></button>
<button type="button" class="ui-button-width-fit ui-button-secondary" pButton icon="fa-close" (click)="onCancel()" label="No"></button>
<button type="button" class="ui-button-width-fit" pButton icon="fa-check" (click)="totpSettingDisplay=false" label="Yes"></button>
</div>
</div>
<!--<p-panel>-->

1
src/packages/member/component/settings/totp/totp.component.html
View File

@ -1,3 +1,4 @@
<h1>Settings</h1>
<p-dialog header="{{headerItem}}" [modal]="true" [width]="800" [(visible)]="totpSettingDisplay" [showHeader]="true" [closeOnEscape]="false">
<of-config-setting [selectedItem]="selectedItem" (close)="onTotpSettingClose()"></of-config-setting>
</p-dialog>

14
src/packages/probe/component/detail/detail.component.html
View File

@ -7,25 +7,25 @@
<div *ngIf="probe">
<div class="ui-g form-group">
<div class="ui-g-12 ui-md-6 ui-lg-4 ui-key-value ui-bottom-border-1">
<div class="ui-g-12 ui-md-6 ui-lg-4 ui-key-value ui-bottom-border-1 ui-nopad">
<of-key-value [key]="'Alias'" [value]="probe.displayName"></of-key-value>
</div>
<div class="ui-g-12 ui-md-6 ui-lg-4 ui-key-value ui-bottom-border-1">
<div class="ui-g-12 ui-md-6 ui-lg-4 ui-key-value ui-bottom-border-1 ui-nopad">
<of-key-value [key]="'CIDR'" [value]="probe.cidr"></of-key-value>
</div>
<div class="ui-g-12 ui-md-6 ui-lg-4 ui-key-value ui-bottom-border-1">
<div class="ui-g-12 ui-md-6 ui-lg-4 ui-key-value ui-bottom-border-1 ui-nopad">
<of-key-value [key]="'Description'" [value]="probe.description"></of-key-value>
</div>
<div class="ui-g-12 ui-md-6 ui-lg-4 ui-key-value ui-bottom-border-1">
<div class="ui-g-12 ui-md-6 ui-lg-4 ui-key-value ui-bottom-border-1 ui-nopad">
<of-key-value [key]="'Key'" [value]="probe.probeKey"></of-key-value>
</div>
<div class="ui-g-12 ui-md-6 ui-lg-4 ui-key-value ui-bottom-border-1">
<div class="ui-g-12 ui-md-6 ui-lg-4 ui-key-value ui-bottom-border-1 ui-nopad">
<of-key-value [key]="'Authrozied at'" [value]="probe.authorizeDate | date: 'dd/MM/yyyy'"></of-key-value>
</div>
<div class="ui-g-12 ui-md-6 ui-lg-4 ui-key-value ui-bottom-border-1">
<div class="ui-g-12 ui-md-6 ui-lg-4 ui-key-value ui-bottom-border-1 ui-nopad">
<of-key-value [key]="'Authrozied by'" [value]="probe.authorizeMember.name"></of-key-value>
</div>
<div class="ui-g-12 ui-md-6 ui-lg-4 ui-key-value ui-bottom-border-1">
<div class="ui-g-12 ui-md-6 ui-lg-4 ui-key-value ui-bottom-border-1 ui-nopad">
<of-key-value [key]="'IP Range'" [value]="IPRange"></of-key-value>
</div>
</div>

21
src/styles.scss
View File

@ -152,25 +152,34 @@ img.ui-img-profile-responsive {
.ui-key-value {
of-key-value{
width: 100%;
min-width: 250px;
margin: 0 -5px;
}
div {
width: 100%;
margin: 0.25em 0.15em;
margin: 0;
padding: 0;
}
span {
font-weight: bold;
width: 30% ;
//display: inline-block;
width: 105px ;
display: inline-block;
padding: 5px;
margin: 0;
text-align: right;
//background: red;
}
span::after {
content: " : ";
}
span.ng-star-inserted {
span.ng-star-inserted, a.ng-star-inserted>span {
font-weight: normal;
text-align: left;
width: 70%;
display: inline-block;
padding: 5px;
margin: 0;
width: 50%;
//background: blue;
}
span.ng-star-inserted::after, a.ng-star-inserted>span::after {
content: " ";