nasty big monolithic commit of a whole bunch of UI/UX improvements:

- add a simple CSS template across the app for navigation & cosmetics
 - split login into login & register, and totally reskin it
 - restructure room CSS to play nicely with it
 - implement basis 1:1 chat from user pages
 - disable autofocus on iOS to improve UX
This commit is contained in:
Matthew Hodgson 2014-08-31 00:40:42 +01:00
parent b040bd6157
commit 1bc036a12d
15 changed files with 363 additions and 317 deletions

View file

@ -1,29 +1,24 @@
<div ng-controller="HomeController" data-ng-init="onInit()">
<div id="page">
<div id="wrapper">
<div>
<form>
<table>
<tr>
<td>
<div class="profile-avatar">
<img ng-src="{{ (null !== profile.avatarUrl) ? profile.avatarUrl : 'img/default-profile.jpg' }}"/>
</div>
</td>
<td>
<div id="user-ids">
<div id="user-displayname">{{ profile.displayName }}</div>
<div>{{ config.user_id }}</div>
</div>
</td>
</tr>
</table>
</form>
<div id="genericHeading">
<img src="img/logo-small.png" width="100" height="43" alt="[matrix]"/>
</div>
<h3>Recents</h3>
<h1>Welcome to homeserver {{ config.homeserver }}</h1>
<div>
<div class="profile-avatar">
<img ng-src="{{ (null !== profile.avatarUrl) ? profile.avatarUrl : 'img/default-profile.png' }}"/>
</div>
<div id="user-ids">
<div id="user-displayname">{{ profile.displayName }}</div>
<div>{{ config.user_id }}</div>
</div>
</div>
<h3>Recent conversations</h3>
<div ng-include="'recents/recents.html'"></div>
<br/>
@ -38,9 +33,9 @@
<div>
<form>
<input size="40" ng-model="newRoom.room_id" ng-enter="createNewRoom(newRoom.room_id, newRoom.private)" placeholder="(e.g. foo_channel)"/>
<input size="40" ng-model="newRoom.room_alias" ng-enter="createNewRoom(newRoom.room_alias, newRoom.private)" placeholder="(e.g. foo_channel)"/>
<input type="checkbox" ng-model="newRoom.private">private
<button ng-disabled="!newRoom.room_id" ng-click="createNewRoom(newRoom.room_id, newRoom.private)">Create room</button>
<button ng-disabled="!newRoom.room_alias" ng-click="createNewRoom(newRoom.room_alias, newRoom.private)">Create room</button>
</form>
</div>
<div>
@ -54,5 +49,4 @@
{{ feedback }}
</div>
</div>
</div>