login

config.xml

@@ -1,4 +1,4 @@
-<?xml version='1.0' encoding='utf-8'?>
+<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
 <widget id="com.ionicframework.app751563" version="0.0.1" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
   <name>CarsInCommon</name>
   <description>
@@ -7,42 +7,43 @@
   <author email="mail@mail.com" href="http://arnaucode.com/">
       ArnauCode
     </author>
-    <content src="index.html" />
-    <access origin="*" />
-    <preference name="webviewbounce" value="false" />
-    <preference name="UIWebViewBounce" value="false" />
-    <preference name="DisallowOverscroll" value="true" />
-    <preference name="SplashScreenDelay" value="3000" />
-    <preference name="FadeSplashScreenDuration" value="500" />
-    <preference name="android-minSdkVersion" value="16" />
-    <preference name="BackupWebStorage" value="none" />
-    <preference name="SplashScreen" value="screen" />
+  <content src="index.html"/>
+  <access origin="*"/>
+  <preference name="webviewbounce" value="false"/>
+  <preference name="UIWebViewBounce" value="false"/>
+  <preference name="DisallowOverscroll" value="true"/>
+  <preference name="SplashScreenDelay" value="3000"/>
+  <preference name="FadeSplashScreenDuration" value="500"/>
+  <preference name="android-minSdkVersion" value="16"/>
+  <preference name="BackupWebStorage" value="none"/>
+  <preference name="SplashScreen" value="screen"/>
   <feature name="StatusBar">
-        <param name="ios-package" onload="true" value="CDVStatusBar" />
+    <param name="ios-package" onload="true" value="CDVStatusBar"/>
   </feature>
   <platform name="android">
-        <icon density="ldpi" src="resources/android/icon/drawable-ldpi-icon.png" />
-        <icon density="mdpi" src="resources/android/icon/drawable-mdpi-icon.png" />
-        <icon density="hdpi" src="resources/android/icon/drawable-hdpi-icon.png" />
-        <icon density="xhdpi" src="resources/android/icon/drawable-xhdpi-icon.png" />
-        <icon density="xxhdpi" src="resources/android/icon/drawable-xxhdpi-icon.png" />
-        <icon density="xxxhdpi" src="resources/android/icon/drawable-xxxhdpi-icon.png" />
-        <splash density="land-ldpi" src="resources/android/splash/drawable-land-ldpi-screen.png" />
-        <splash density="land-mdpi" src="resources/android/splash/drawable-land-mdpi-screen.png" />
-        <splash density="land-hdpi" src="resources/android/splash/drawable-land-hdpi-screen.png" />
-        <splash density="land-xhdpi" src="resources/android/splash/drawable-land-xhdpi-screen.png" />
-        <splash density="land-xxhdpi" src="resources/android/splash/drawable-land-xxhdpi-screen.png" />
-        <splash density="land-xxxhdpi" src="resources/android/splash/drawable-land-xxxhdpi-screen.png" />
-        <splash density="port-ldpi" src="resources/android/splash/drawable-port-ldpi-screen.png" />
-        <splash density="port-mdpi" src="resources/android/splash/drawable-port-mdpi-screen.png" />
-        <splash density="port-hdpi" src="resources/android/splash/drawable-port-hdpi-screen.png" />
-        <splash density="port-xhdpi" src="resources/android/splash/drawable-port-xhdpi-screen.png" />
-        <splash density="port-xxhdpi" src="resources/android/splash/drawable-port-xxhdpi-screen.png" />
-        <splash density="port-xxxhdpi" src="resources/android/splash/drawable-port-xxxhdpi-screen.png" />
+    <icon src="resources/android/icon/drawable-ldpi-icon.png" density="ldpi"/>
+    <icon src="resources/android/icon/drawable-mdpi-icon.png" density="mdpi"/>
+    <icon src="resources/android/icon/drawable-hdpi-icon.png" density="hdpi"/>
+    <icon src="resources/android/icon/drawable-xhdpi-icon.png" density="xhdpi"/>
+    <icon src="resources/android/icon/drawable-xxhdpi-icon.png" density="xxhdpi"/>
+    <icon src="resources/android/icon/drawable-xxxhdpi-icon.png" density="xxxhdpi"/>
+    <splash src="resources/android/splash/drawable-land-ldpi-screen.png" density="land-ldpi"/>
+    <splash src="resources/android/splash/drawable-land-mdpi-screen.png" density="land-mdpi"/>
+    <splash src="resources/android/splash/drawable-land-hdpi-screen.png" density="land-hdpi"/>
+    <splash src="resources/android/splash/drawable-land-xhdpi-screen.png" density="land-xhdpi"/>
+    <splash src="resources/android/splash/drawable-land-xxhdpi-screen.png" density="land-xxhdpi"/>
+    <splash src="resources/android/splash/drawable-land-xxxhdpi-screen.png" density="land-xxxhdpi"/>
+    <splash src="resources/android/splash/drawable-port-ldpi-screen.png" density="port-ldpi"/>
+    <splash src="resources/android/splash/drawable-port-mdpi-screen.png" density="port-mdpi"/>
+    <splash src="resources/android/splash/drawable-port-hdpi-screen.png" density="port-hdpi"/>
+    <splash src="resources/android/splash/drawable-port-xhdpi-screen.png" density="port-xhdpi"/>
+    <splash src="resources/android/splash/drawable-port-xxhdpi-screen.png" density="port-xxhdpi"/>
+    <splash src="resources/android/splash/drawable-port-xxxhdpi-screen.png" density="port-xxxhdpi"/>
   </platform>
-    <plugin name="cordova-plugin-whitelist" spec="~1.3.1" />
-    <plugin name="cordova-plugin-device" spec="~1.1.4" />
-    <plugin name="cordova-plugin-splashscreen" spec="~4.0.1" />
-    <plugin name="cordova-plugin-console" spec="~1.0.5" />
-    <plugin name="ionic-plugin-keyboard" spec="~2.2.1" />
+  <plugin name="cordova-plugin-whitelist" spec="~1.3.1"/>
+  <plugin name="cordova-plugin-device" spec="~1.1.4"/>
+  <plugin name="cordova-plugin-splashscreen" spec="~4.0.1"/>
+  <plugin name="cordova-plugin-console" spec="~1.0.5"/>
+  <plugin name="ionic-plugin-keyboard" spec="~2.2.1"/>
+  <icon src="resources/android/icon/drawable-xhdpi-icon.png"/>
 </widget>

www/css/style.css

@@ -8,6 +8,62 @@
 .o_floatRight{
     float: right;
 }
+.o_loginBackground{
+    height: 100%!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;
+
+    padding-top: 30%;
+}
+@font-face {
+    font-family: 'Thinking_of_Betty';
+    src: url('../fonts/Thinking_of_Betty.ttf');
+}
+.o_loginBackground h1{
+    color: #ffffff!important;
+    margin: 10px;
+    font-family: 'Thinking_of_Betty'
+    /*font-weight: bold;*/
+}
+.o_loginDivForm{
+    /*background: rgba(255, 255, 255, 0.2);*/
+}
+.o_loginInput{
+    background: rgba(255, 255, 255, 0.2);
+    padding:10px;
+    color: #ffffff;
+    border: 0px;
+    width: 80%;
+    font-size: 120%;
+}
+.o_loginInput::-webkit-input-placeholder{
+    color: rgba(255, 255, 255, 0.6);
+}
+.o_loginButton{
+    color: rgba(0, 0, 0, 0.8);
+    font-weight: bold;
+    margin: 10%;
+}
+.o_transparentBackground{
+    background: rgba(255, 255, 255, 0);
+    color: #ffffff;
+}
 .o_userProfileBackground{
     min-height: 30%!important;
     width: 100%;

www/templates/login.html

@@ -1,22 +1,39 @@
 <ion-modal-view>
   <ion-content>
-      <img src="img/header.png" style="width:100%;"/>
-    <form ng-submit="doLogin()">
-      <div class="list padding">
+    <div class="o_loginBackground">
+      <div class="o_loginDivForm">
+        <h1>Cars in Common</h1>
+
         <span class="item-note">v0.0.1</span>
-          <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>
+        <br><br>
+        <p>
+            <i class="icon ion-person"></i>
+            <input ng-model="loginData.username" class="o_loginInput"
+            placeholder="{{'Username' | translate}}">
+        </p>
+        <br>
+        <p>
+            <i class="icon ion-locked"></i>
+            <input ng-model="loginData.password" class="o_loginInput"
+            placeholder="{{'Password' | translate}}" style="-webkit-text-security: disc;">
+        </p>
+        <br>
+        <p>
+            <a class="o_loginButton button button-block" ng-click="doLogin()">
+                {{'LOG IN' | translate}}
+            </a>
+        </p>
+        <!--<p>
+            <a class="o_loginButton button button-block" ng-href="#/app/signup">
+                {{'Signup' | translate}}
+            </a>
+        </p>-->
+        <div class="bar bar-footer o_transparentBackground">
+            <a class="button o_purple300 pull-right" ng-href="#/app/signup">
+                {{'SIGN UP' | translate}}
+            </a>
+        </div>
       </div>
     </div>
-    </form>
   </ion-content>
 </ion-modal-view>

www/templates/newTravel.html

@@ -6,11 +6,11 @@
       </a>
       <a href="#/app/askCar" class="item item-icon-left o_purple400">
         <i class="icon ion-help"></i>
-        Ask for Car
+        Ask for Car (not yet)
       </a>
       <a href="#/app/askPackage" class="item item-icon-left o_purple300">
       <i class="icon ion-ios-box"></i>
-        Ask for Package
+        Ask for Package (not yet)
     </a>
   </ion-content>
 </ion-view>