Fit contacts list to guidelines

Signed-off-by: John Molakvoæ (skjnldsv) <skjnldsv@protonmail.com>
nextcloud · Nov 17, 2017 · af0188e · af0188e
1 parent 93fdbd4
commit af0188e
Show file tree

Hide file tree

Showing 7 changed files with 27 additions and 171 deletions.
diff --git a/css/_app-content-list.scss b/css/_app-content-list.scss
diff --git a/css/style.scss b/css/style.scss
@@ -1,4 +1,3 @@
-@import "app-content-list";
 @import "details";
 @import "contactlist";
 @import "navigation";

diff --git a/js/components/contact/contact_controller.js b/js/components/contact/contact_controller.js
@@ -6,12 +6,6 @@ angular.module('contactsApp')
 		errorMessage : t('contacts', 'This card is corrupted and has been fixed. Please check the data and trigger a save to make the changes permanent.'),
 	};
 
-	ctrl.openContact = function() {
-		$route.updateParams({
-			gid: $routeParams.gid,
-			uid: ctrl.contact.uid()});
-	};
-
 	ctrl.getName = function() {
 		// If lastName equals to firstName then none of them is set
 		if (ctrl.contact.lastName() === ctrl.contact.firstName()) {

diff --git a/templates/contact.html b/templates/contact.html
@@ -1,8 +1,6 @@
-<a class="app-content-list-item-link" ng-click="ctrl.openContact()">
-    <img class="app-content-list-item-icon contact__icon" ng-show="ctrl.contact.photo()!==undefined" data-ng-src="{{ctrl.contact.photo()}}" />
-    <div class="app-content-list-item-icon contact__icon" ng-show="ctrl.contact.photo()===undefined" ng-style="{'background-color': (ctrl.contact.uid() | contactColor) }">{{ ctrl.contact.displayName() | firstCharacter }}</div>
-    <div class="app-content-list-item-star icon-star" data-starred="false"></div>
-    <div class="app-content-list-item-failed icon-error" tooltip-placement="auto left" ng-if="ctrl.contact.failedProps.length>0" uib-tooltip="{{ ctrl.t.errorMessage }}"></div>
-    <div class="app-content-list-item-line-one" ng-class="{'no-line-two':!ctrl.contact.email()}">{{ ctrl.getName() | newContact }}</div>
-    <div class="app-content-list-item-line-two">{{ctrl.contact.email()}}</div>
-</a>
+<img class="app-content-list-item-icon contact__icon" ng-show="ctrl.contact.photo()!==undefined" data-ng-src="{{ctrl.contact.photo()}}" />
+<div class="app-content-list-item-icon contact__icon" ng-show="ctrl.contact.photo()===undefined" ng-style="{'background-color': (ctrl.contact.uid() | contactColor) }">{{ ctrl.contact.displayName() | firstCharacter }}</div>
+<div class="app-content-list-item-star icon-star" data-starred="false"></div>
+<div class="app-content-list-item-failed icon-error" tooltip-placement="auto left" ng-if="ctrl.contact.failedProps.length>0" uib-tooltip="{{ ctrl.t.errorMessage }}"></div>
+<div class="app-content-list-item-line-one">{{ ctrl.getName() | newContact }}</div>
+<div class="app-content-list-item-line-two" ng-if="ctrl.contact.email()">{{ctrl.contact.email()}}</div>
diff --git a/templates/contactList.html b/templates/contactList.html
@@ -1,14 +1,12 @@
-<div class="contacts-list" ng-class="{loading: ctrl.loading, 'mobile-show': ctrl.show}">
-        <div class="app-content-list-item"
-			 ng-repeat="contact in ctrl.filteredContacts = (ctrl.contactList | contactGroupFilter:ctrl.routeParams.gid | localeOrderBy:ctrl.sortBy | filter:query | limitTo:ctrl.limitTo ) as filtered track by contact.uid()"
-			 contact data="contact"
-			 ng-click="setSelected(contact.uid())"
-			 ng-class="{active: contact.uid() === ctrl.getSelectedId()}">
-	</div>
-	<div ng-show="!ctrl.filteredContacts.length && !ctrl.loading && ctrl.searchTerm !== ''">
-	        <div id="emptycontent" class="emptycontent-search">
-		        <div class="icon-search"></div>
-			<h2>{{ctrl.t.emptySearch}}</h2>
-		</div>
+<a class="app-content-list-item"
+   ng-repeat="contact in ctrl.filteredContacts = (ctrl.contactList | contactGroupFilter:ctrl.routeParams.gid | localeOrderBy:ctrl.sortBy | filter:query | limitTo:ctrl.limitTo ) as filtered track by contact.uid()"
+   contact data="contact"
+   href="#/{{ctrl.routeParams.gid}}/{{contact.uid()}}"
+   ng-class="{active: contact.uid() === ctrl.getSelectedId()}">
+</a>
+<div ng-show="!ctrl.filteredContacts.length && !ctrl.loading && ctrl.searchTerm !== ''">
+        <div id="emptycontent" class="emptycontent-search">
+	        <div class="icon-search"></div>
+		<h2>{{ctrl.t.emptySearch}}</h2>
 	</div>
 </div>
diff --git a/templates/importScreen.html b/templates/importScreen.html
@@ -1,9 +1,7 @@
-<div id="importscreen-wrapper" ng-show="ctrl.importing">
-	<div id="importscreen-content">
-		<span class="icon-upload"></span>
-		<h3 id="importscreen-title">{{ctrl.t.importingTo}} {{ctrl.selectedAddressBook}}</h3>
-		<progress id="importscreen-progress" max="100" value="{{ctrl.importPercent}}"></progress>
-		<span id="importscreen-user">{{ctrl.importedUser}}</span>
-		<span id="importscreen-percent">{{ctrl.importPercent}} %</span>
-	</div>
+<div id="importscreen-content" class="emptycontent">
+	<span class="icon-upload"></span>
+	<h3 id="importscreen-title">{{ctrl.t.importingTo}} {{ctrl.selectedAddressBook}}</h3>
+	<progress id="importscreen-progress" max="100" value="{{ctrl.importPercent}}"></progress>
+	<span id="importscreen-user">{{ctrl.importedUser}}</span>
+	<span id="importscreen-percent">{{ctrl.importPercent}} %</span>
 </div>
diff --git a/templates/main.php b/templates/main.php
@@ -47,10 +47,11 @@
 	</div>
 
 	<div id="app-content">
-		<div class="app-content-list">
-			<contactlist></contactlist>
+		<div id="app-content-wrapper">
+			<div class="app-content-list" contactlist>
+			</div>
+			<div class="app-content-detail" ng-view></div>
+			<importscreen id="importscreen-wrapper" ng-show="ctrl.importing"></importscreen>
 		</div>
-		<div class="app-content-detail" ng-view></div>
-		<importscreen class="emptycontent"></importscreen>
 	</div>
 </div>