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-26 21:27:36 +09:00
parent 282b02a0a7
commit da0d397c34
2 changed files with 42 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
src/packages/member/component/profile/profile.component.html
View File

@ -1,36 +1,35 @@
<form [formGroup]="modifyForm" (ngSubmit)="modifyProfile()"> <form [formGroup]="modifyForm" (ngSubmit)="modifyProfile()">
<div class="ui-g"> <div class="ui-g">
<div class="ui-g-12 ui-md-3"> <div class="ui-g-12 ui-md-4 ui-img-profile">
<div> <div class="ui-img-profile-box">
<p-card>
<div class="ui-g"> <div class="ui-g">
<img class="profile-image ui-img-profile-responsive" src="assets/layout/images/dark-user-bg.png" /> <img class="profile-image " src="assets/layout/images/dark-user-bg.png" />
</div> </div>
</p-card> <button type="button" class="ui-button-photo-add" pButton icon="ui-icon-account-box" (click)="onAddSensorWithTarget(item.target)"></button>
</div> </div>
</div> </div>
<div class="ui-g-12 ui-md-9"> <div class="ui-g-12 ui-md-8">
<div class="ui-g form-group"> <div class="ui-g form-group">
<div class="ui-g-12 ui-md-6"> <div class="ui-g-12">
<span class="md-inputfield"> <span class="md-inputfield">
<input type="text" pInputText readonly value="{{member.email}}"> <input type="text" pInputText readonly value="{{member.email}}">
<label>Email</label> <label>Email</label>
</span> </span>
</div> </div>
<div class="ui-g-12 ui-md-6"> <div class="ui-g-12">
<span class="md-inputfield"> <span class="md-inputfield">
<input type="text" pInputText value="{{member.name}}" > <input type="text" pInputText value="{{member.name}}" >
<label>Name</label> <label>Name</label>
</span> </span>
</div> </div>
<div class="ui-g-12 ui-md-6"> <div class="ui-g-12">
<span class="md-inputfield"> <span class="md-inputfield">
<input type="text" pInputText value="{{member.companyName}}" > <input type="text" pInputText value="{{member.companyName}}" >
<label>Company Name</label> <label>Company Name</label>
</span> </span>
</div> </div>
<div class="ui-g-12 ui-md-6"> <div class="ui-g-12">
<span class="md-inputfield"> <span class="md-inputfield">
<input type="text" pInputText value="{{member.phone}}" > <input type="text" pInputText value="{{member.phone}}" >
<label>Phone</label> <label>Phone</label>
@ -46,5 +45,3 @@
</div> </div>
</div> </div>
</form> </form>

33
src/styles.scss
View File

@ -112,11 +112,29 @@
color: #8BC34A !important; color: #8BC34A !important;
} }
} }
.ui-img-profile{
min-width: 250px !important;
@media (max-width: 640px) {
text-align: center;
}
}
.ui-img-profile-box {
width: 244px !important;
padding: 12px;
box-sizing: border-box;
display: block;
background-color: #ffffff;
border: 1px solid #bdbdbd;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
margin: auto;
img.ui-img-profile-responsive { img {
object-fit: cover;
width : 100%; width:220px;
height: auto; height:220px;
}
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
@ -130,6 +148,7 @@ img.ui-img-profile-responsive {
} }
} }
.ui-sensors-datalist { .ui-sensors-datalist {
.ui-sensors{ .ui-sensors{
.ui-sensor{ .ui-sensor{
@ -232,3 +251,9 @@ img.ui-img-profile-responsive {
} }
} }
} }
.ui-button-photo-add {
vertical-align: text-bottom;
float: right;
margin-top: -30px;
margin-right: -5px;
}