user profile, signup, login to the new design

This commit is contained in:
arnaucode
2017-01-27 01:27:51 +01:00
parent b940800b9f
commit 50b6529de7
11 changed files with 89 additions and 61 deletions

View File

@@ -8,6 +8,40 @@
.o_floatRight{ .o_floatRight{
float: right; float: right;
} }
.o_userProfileBackground{
min-height: 30%!important;
width: 100%;
min-height: auto;
-webkit-background-size: cover;
-moz-background-size: cover;
background-size: cover;
-o-background-size: cover;
background-position: center;
background-image: url('../img/userProfileBackground.png');
text-align: center;
/*color: white;*/
/* Create the parallax scrolling effect */
background-attachment: fixed;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
color: #ffffff;
}
.o_userImgCircular {
margin-top: 5%;
background: #ffffff;
width: 40%;
border: 4px #ffffff solid;
border-radius: 150px;
-webkit-border-radius: 150px;
-moz-border-radius: 150px;
/*background: url(http://link-to-your/image.jpg) no-repeat;*/
}
.o_userImgCircular p{
color: #ffffff!important;
}
/* /*
SISTEMA DE COLORS SISTEMA DE COLORS

Binary file not shown.

After

Width:  |  Height:  |  Size: 18 KiB

BIN
www/img/foucault.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.5 KiB

BIN
www/img/header.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 764 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 767 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 245 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 141 KiB

View File

@@ -13,7 +13,7 @@ var translations = {
"Login": "Login", "Login": "Login",
"Username": "Username", "Username": "Username",
"Password": "Password", "Password": "Password",
"Mail": "Mail", "Email": "Email",
"Phone": "Phone", "Phone": "Phone",
"Telegram": "Telegram", "Telegram": "Telegram",
"Avatar": "Avatar", "Avatar": "Avatar",

View File

@@ -1,24 +1,20 @@
<ion-modal-view> <ion-modal-view>
<ion-header-bar>
<h1 class="title">{{'Login' | translate}}</h1>
<div class="buttons">
<a class="button button-balanced" ng-href="#/app/signup">{{'Signup' | translate}}</a>
</div>
</ion-header-bar>
<ion-content> <ion-content>
<img src="img/header.png" style="width:100%;"/>
<form ng-submit="doLogin()"> <form ng-submit="doLogin()">
<div class="list"> <div class="list padding">
<label class="item item-input"> <md-input-container class="md-block" flex-gt-sm>
<span class="input-label">{{'Username' | translate}}</span> <label>{{'Username' | translate}}</label>
<input type="text" ng-model="loginData.username"> <input ng-model="loginData.username">
</label> </md-input-container>
<label class="item item-input"> <md-input-container class="md-block" flex-gt-sm>
<span class="input-label">{{'Password' | translate}}</span> <label>{{'Password' | translate}}</label>
<input type="password" ng-model="loginData.password"> <input ng-model="loginData.password" type="password">
</label> </md-input-container>
<label class="item"> <div>
<button class="button button-block button-positive" type="submit">{{'Login' | translate}}</button> <md-button class="o_purple100" ng-href="#/app/signup">{{'Signup' | translate}}</md-button>
</label> <md-button class="o_purple300 o_floatRight" ng-click="doLogin()">{{'Login' | translate}}</md-button>
</div>
</div> </div>
</form> </form>
</ion-content> </ion-content>

View File

@@ -1,44 +1,37 @@
<ion-modal-view> <ion-modal-view>
<ion-header-bar> <ion-header-bar>
<h1 class="title">{{'Signup' | translate }}</h1> <h1 class="title">{{'Signup' | translate }}</h1>
<div class="buttons">
<a class="button button-dark" ng-href="#/app/login">{{'Close' | translate }}</a>
</div>
</ion-header-bar> </ion-header-bar>
<ion-content> <ion-content>
<form ng-submit="doSignup()"> <div class="padding">
<div class="list"> <md-input-container class="md-block" flex-gt-sm>
<label class="item item-input"> <label>{{'Username' | translate}}</label>
<span class="input-label">{{'Username' | translate }}*</span> <input ng-model="signupData.username">
<input type="text" ng-model="signupData.username"> </md-input-container>
</label> <md-input-container class="md-block" flex-gt-sm>
<label class="item item-input"> <label>{{'Password' | translate}}</label>
<span class="input-label">{{'Password' | translate }}*</span>
<input type="password" ng-model="signupData.password"> <input type="password" ng-model="signupData.password">
</label> </md-input-container>
<label class="item item-input"> <md-input-container class="md-block" flex-gt-sm>
<span class="input-label">{{'Mail' | translate }}*</span> <label>{{'Email' | translate}}</label>
<input type="email" ng-model="signupData.email"> <input ng-model="signupData.email">
</label> </md-input-container>
<label class="item item-input"> <md-input-container class="md-block" flex-gt-sm>
<span class="input-label">{{'Phone' | translate }}</span> <label>{{'Phone' | translate}}</label>
<input type="number" ng-model="signupData.phone"> <input type="number" ng-model="signupData.phone">
</label> </md-input-container>
<label class="item item-input"> <md-input-container class="md-block" flex-gt-sm>
<span class="input-label">{{'Telegram' | translate }}</span> <label>{{'Telegram' | translate}}</label>
<input type="text" ng-model="signupData.telegram"> <input ng-model="signupData.telegram">
</label> </md-input-container>
<label class="item item-input"> <md-input-container class="md-block" flex-gt-sm>
<span class="input-label">{{'Description' | translate }}</span> <label>{{'Description' | translate}}</label>
<input type="text" ng-model="signupData.description"> <input ng-model="signupData.description">
</label> </md-input-container>
<!--<p>{{'Avatar' | translate }}*: <b>{{signupData.avatar}}</b></p> <div>
<img ng-repeat="avatar in avatars" ng-click="avatarSelect('{{avatar}}')" ng-src="img/avatars/{{avatar}}.png" class="o-imgSelectAvatar" > <md-button class="o_purple100" ng-href="#/app/login">{{'Cancel' | translate}}</md-button>
--> <md-button class="o_purple300 o_floatRight" ng-click="doSignup()">{{'Signup' | translate}}</md-button>
<label class="item"> </div>
<button class="button button-block button-positive" type="submit">{{'Signup' | translate }}</button>
</label>
</div> </div>
</form>
</ion-content> </ion-content>
</ion-modal-view> </ion-modal-view>

View File

@@ -1,12 +1,14 @@
<ion-view view-title="{{'User' | translate}} {{user.username}}"> <ion-view view-title="{{'User' | translate}} {{user.username}}">
<ion-content> <ion-content>
<div class="item item-avatar"> <div class="o_userProfileBackground">
<img ng-src="{{user.avatar}}" /> <img ng-src="{{user.avatar}}" class="o_userImgCircular" />
<h2>{{user.username}}</h2> <h3>{{user.username}}</h3>
<p>{{user.description}}</p>
<p>{{user.email}}</p>
</div> </div>
<div class="item item-body"> <div class="">
<p class="o-bold">{{user.description}}</p>
<p>{{user.mail}}</p>
<p ng-show="user.telegram"> <p ng-show="user.telegram">
<!--<a ng-href="https://telegram.me/{{user.telegram}}" target="_blank" class="button">--> <!--<a ng-href="https://telegram.me/{{user.telegram}}" target="_blank" class="button">-->
<img class='o-imgMenu' src="img/telegram.png" /> @{{user.telegram}} <img class='o-imgMenu' src="img/telegram.png" /> @{{user.telegram}}
@@ -32,6 +34,9 @@
</a>--> </a>-->
</div> </div>
</div> </div>
<div class="item">
<img src="img/faircoinpublickey_sample.png" style="width: 100%;" />
</div>
<div class="item item-body"> <div class="item item-body">
{{'current_publications_of' | translate}} {{user.username}}: {{'current_publications_of' | translate}} {{user.username}}:
<div class="o_text_purple600">{{user.travels.length}} {{'publications' | translate}}</div> <div class="o_text_purple600">{{user.travels.length}} {{'publications' | translate}}</div>