Browse Source

user profile, signup, login to the new design

master
arnaucode 7 years ago
parent
commit
50b6529de7
11 changed files with 89 additions and 61 deletions
  1. +34
    -0
      www/css/style.css
  2. BIN
      www/img/faircoinpublickey_sample.png
  3. BIN
      www/img/foucault.jpg
  4. BIN
      www/img/header.png
  5. BIN
      www/img/header_background.png
  6. BIN
      www/img/userProfileBackground.png
  7. BIN
      www/img/userProfileBackground_old.png
  8. +1
    -1
      www/js/translations.js
  9. +14
    -18
      www/templates/login.html
  10. +29
    -36
      www/templates/signup.html
  11. +11
    -6
      www/templates/user.html

+ 34
- 0
www/css/style.css

@ -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

BIN
www/img/faircoinpublickey_sample.png

Before After
Width: 374  |  Height: 374  |  Size: 18 KiB

BIN
www/img/foucault.jpg

Before After
Width: 223  |  Height: 226  |  Size: 6.5 KiB

BIN
www/img/header.png

Before After
Width: 1300  |  Height: 975  |  Size: 764 KiB

BIN
www/img/header_background.png

Before After
Width: 1300  |  Height: 975  |  Size: 767 KiB

BIN
www/img/userProfileBackground.png

Before After
Width: 634  |  Height: 393  |  Size: 245 KiB

BIN
www/img/userProfileBackground_old.png

Before After
Width: 634  |  Height: 393  |  Size: 141 KiB

+ 1
- 1
www/js/translations.js

@ -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",

+ 14
- 18
www/templates/login.html

@ -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">
<label class="item item-input">
<span class="input-label">{{'Username' | translate}}</span>
<input type="text" ng-model="loginData.username">
</label>
<label class="item item-input">
<span class="input-label">{{'Password' | translate}}</span>
<input type="password" ng-model="loginData.password">
</label>
<label class="item">
<button class="button button-block button-positive" type="submit">{{'Login' | translate}}</button>
</label>
<div class="list padding">
<md-input-container class="md-block" flex-gt-sm>
<label>{{'Username' | translate}}</label>
<input ng-model="loginData.username">
</md-input-container>
<md-input-container class="md-block" flex-gt-sm>
<label>{{'Password' | translate}}</label>
<input ng-model="loginData.password" type="password">
</md-input-container>
<div>
<md-button class="o_purple100" ng-href="#/app/signup">{{'Signup' | translate}}</md-button>
<md-button class="o_purple300 o_floatRight" ng-click="doLogin()">{{'Login' | translate}}</md-button>
</div>
</div> </div>
</form> </form>
</ion-content> </ion-content>

+ 29
- 36
www/templates/signup.html

@ -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="list">
<label class="item item-input">
<span class="input-label">{{'Username' | translate }}*</span>
<input type="text" ng-model="signupData.username">
</label>
<label class="item item-input">
<span class="input-label">{{'Password' | translate }}*</span>
<input type="password" ng-model="signupData.password">
</label>
<label class="item item-input">
<span class="input-label">{{'Mail' | translate }}*</span>
<input type="email" ng-model="signupData.email">
</label>
<label class="item item-input">
<span class="input-label">{{'Phone' | translate }}</span>
<input type="number" ng-model="signupData.phone">
</label>
<label class="item item-input">
<span class="input-label">{{'Telegram' | translate }}</span>
<input type="text" ng-model="signupData.telegram">
</label>
<label class="item item-input">
<span class="input-label">{{'Description' | translate }}</span>
<input type="text" ng-model="signupData.description">
</label>
<!--<p>{{'Avatar' | translate }}*: <b>{{signupData.avatar}}</b></p>
<img ng-repeat="avatar in avatars" ng-click="avatarSelect('{{avatar}}')" ng-src="img/avatars/{{avatar}}.png" class="o-imgSelectAvatar" >
-->
<label class="item">
<button class="button button-block button-positive" type="submit">{{'Signup' | translate }}</button>
</label>
<div class="padding">
<md-input-container class="md-block" flex-gt-sm>
<label>{{'Username' | translate}}</label>
<input ng-model="signupData.username">
</md-input-container>
<md-input-container class="md-block" flex-gt-sm>
<label>{{'Password' | translate}}</label>
<input type="password" ng-model="signupData.password">
</md-input-container>
<md-input-container class="md-block" flex-gt-sm>
<label>{{'Email' | translate}}</label>
<input ng-model="signupData.email">
</md-input-container>
<md-input-container class="md-block" flex-gt-sm>
<label>{{'Phone' | translate}}</label>
<input type="number" ng-model="signupData.phone">
</md-input-container>
<md-input-container class="md-block" flex-gt-sm>
<label>{{'Telegram' | translate}}</label>
<input ng-model="signupData.telegram">
</md-input-container>
<md-input-container class="md-block" flex-gt-sm>
<label>{{'Description' | translate}}</label>
<input ng-model="signupData.description">
</md-input-container>
<div>
<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>
</div>
</div> </div>
</form>
</ion-content> </ion-content>
</ion-modal-view> </ion-modal-view>

+ 11
- 6
www/templates/user.html

@ -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">
<img ng-src="{{user.avatar}}" />
<h2>{{user.username}}</h2>
<div class="o_userProfileBackground">
<img ng-src="{{user.avatar}}" class="o_userImgCircular" />
<h3>{{user.username}}</h3>
<p>{{user.description}}</p>
<p>{{user.email}}</p>
</div> </div>
<div class="item item-body">
<p class="o-bold">{{user.description}}</p>
<p>{{user.mail}}</p>
<div class="">
<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>

Loading…
Cancel
Save