Use v1 proxy; even more style adjustments.

services/web/app/views/user/settings.pug

@@ -21,7 +21,6 @@ block content
 									.col-md-12
 										h3 Emails and Affiliations
 										p.small Add additional email addresses to your account to access any upgrades your university or institution has, to make it easier for collaborators to find you, and to make sure you can recover your account.
-
 										table.table.affiliations-table
 											thead
 												tr
@@ -33,7 +32,11 @@ block content
 													ng-repeat="userEmail in userEmails"
 												)
 													td {{ userEmail.email + (userEmail.default ? ' (default)' : '') }}
-													td {{ userEmail.institution }}
+													td 
+														div(ng-if="userEmail.affiliation.institution") {{ userEmail.affiliation.institution.name }}
+														div(ng-if="userEmail.affiliation.role || userEmail.affiliation.department") 
+															span(ng-if="userEmail.affiliation.role") {{ userEmail.affiliation.role + ", " }}
+															span(ng-if="userEmail.affiliation.department") {{ userEmail.affiliation.department }}
 													td 
 														a(
 															href
@@ -53,7 +56,7 @@ block content
 														i.fa.fa-fw.fa-spin.fa-refresh
 														|  Loading...
 												
-												tr(
+												tr.affiliations-table-highlighted-row(
 													ng-if="!ui.showAddEmailUI && !ui.isLoadingEmails"
 												)
 													td(colspan="3")
@@ -100,72 +103,73 @@ block content
 																href
 																ng-click="selectUniversityManually();"
 															) Let us know
-														div(
+														.affiliations-form-group(
 															ng-if="ui.showManualUniversitySelectionUI"
 														)
-															.affiliations-form-group
-																ui-select(
-																	ng-model="newAffiliation.country"
+															ui-select(
+																ng-model="newAffiliation.country"
+															)
+																ui-select-match(
+																	placeholder="Country"
+																) {{ $select.selected.name }}
+																ui-select-choices(
+																	repeat="country in countries | filter: $select.search"
 																)
-																	ui-select-match(
-																		placeholder="Country"
-																	) {{ $select.selected.name }}
-																	ui-select-choices(
-																		repeat="country in countries | filter: $select.search"
-																	)
-																		span(
-																			ng-bind="country.name"
-																		s)
-															.affiliations-form-group
-																ui-select(
-																	ng-model="newAffiliation.university"
-																	ng-disabled="!newAffiliation.country"
-																	tagging="addUniversityToSelection"
-																	tagging-label="false"
+																	span(
+																		ng-bind="country.name"
+																	s)
+														.affiliations-form-group(
+															ng-if="ui.showManualUniversitySelectionUI"
+														)
+															ui-select(
+																ng-model="newAffiliation.university"
+																ng-disabled="!newAffiliation.country"
+																tagging="addUniversityToSelection"
+																tagging-label="false"
+															)
+																ui-select-match(
+																	placeholder="Institution"
+																) {{ $select.selected.name }}
+																ui-select-choices(
+																	repeat="university in universities | filter: $select.search"
 																)
-																	ui-select-match(
-																		placeholder="Institution"
-																	) {{ $select.selected.name }}
-																	ui-select-choices(
-																		repeat="university in universities | filter: $select.search"
+																	span(
+																		ng-bind="university.name"
 																	)
-																		span(
-																			ng-bind="university.name"
-																		)
-															.affiliations-form-group(
-																ng-if="ui.isValidEmail && newAffiliation.university"
+														.affiliations-form-group(
+															ng-if="ui.isValidEmail && newAffiliation.university"
+														)
+															input.form-control(
+																type="text"
+																id="affiliations-role"
+																placeholder="Role"
+																ng-model="newAffiliation.role"
 															)
-																input.form-control(
-																	type="text"
-																	id="affiliations-role"
-																	placeholder="Role"
-																	ng-model="newAffiliation.role"
-																s)
-															.affiliations-form-group(
-																ng-if="ui.isValidEmail && newAffiliation.university"
+														.affiliations-form-group(
+															ng-if="ui.isValidEmail && newAffiliation.university"
+														)
+															input.form-control(
+																type="text"
+																id="affiliations-department"
+																placeholder="Department"
+																ng-model="newAffiliation.department"
+																ng-if="!newAffiliation.university.departments || newAffiliation.university.departments.length === 0"
+															)
+															ui-select(
+																ng-model="newAffiliation.department"
+																ng-if="newAffiliation.university.departments.length > 0"
+																tagging
+																tagging-label="false"
 															)
-																input.form-control(
-																	type="text"
-																	id="affiliations-department"
+																ui-select-match(
 																	placeholder="Department"
-																	ng-model="newAffiliation.department"
-																	ng-if="!newAffiliation.university.departments || newAffiliation.university.departments.length === 0"
-																)
-																ui-select(
-																	ng-model="newAffiliation.department"
-																	ng-if="newAffiliation.university.departments.length > 0"
-																	tagging
-																	tagging-label="false"
+																) {{ $select.selected }}
+																ui-select-choices(
+																	repeat="department in getUniqueUniversityDepartments() | filter: $select.search"
 																)
-																	ui-select-match(
-																		placeholder="Department"
-																	) {{ $select.selected }}
-																	ui-select-choices(
-																		repeat="department in getUniqueUniversityDepartments() | filter: $select.search"
+																	span(
+																		ng-bind="department"
 																	)
-																		span(
-																			ng-bind="department"
-																		)
 													td
 														button.btn.btn-primary(
 															ng-disabled="affiliationsForm.$invalid || ui.isAddingNewEmail"

services/web/public/coffee/components/inputSuggestions.coffee

@@ -45,8 +45,8 @@ define [
 		controller: inputSuggestionsController
 		template: """
 			<div class="input-suggestions">
-				<div type="text"  + $ctrl.suggestion" class="form-control input-suggestions-shadow" ng-show="$ctrl.showHint">
-					<span ng-bind="$ctrl.localNgModel" class="input-suggestions-shadow-existing"></span><span ng-bind="$ctrl.suggestion" class="input-suggestions-shadow-suggested"></span>
+				<div type="text" class="form-control input-suggestions-shadow">
+					<span ng-bind="$ctrl.localNgModel" class="input-suggestions-shadow-existing" ng-show="$ctrl.showHint"></span><span ng-bind="$ctrl.suggestion" class="input-suggestions-shadow-suggested" ng-show="$ctrl.showHint"></span>
 				</div>
 				<input type="text" ng-focus="$ctrl.handleFocus()" ng-keyDown="$ctrl.handleKeyDown($event)" ng-blur="$ctrl.handleBlur()" ng-model="$ctrl.localNgModel" ng-model-options="$ctrl.localNgModelOptions" ng-model-options="{ debounce: 50 }" class="form-control input-suggestions-main" ng-attr-id="{{ ::$ctrl.inputId }}" ng-attr-placeholder="{{ ::$ctrl.inputPlaceholder }}" ng-attr-type="{{ ::$ctrl.inputType }}" ng-attr-name="{{ ::$ctrl.inputName }}" ng-required="::$ctrl.inputRequired">
 			</div>

services/web/public/coffee/main/affiliations/controllers/UserAffiliationsController.coffee

@@ -28,7 +28,7 @@ define [
 				$scope.ui.isBlacklistedEmail = UserAffiliationsDataService.isDomainBlacklisted userInputLocalAndDomain.domain
 
 				UserAffiliationsDataService.getUniversityDomainFromPartialDomainInput(userInputLocalAndDomain.domain)
-					.then (universityDomain) -> 						
+					.then (universityDomain) ->
 						if userInputLocalAndDomain.domain == universityDomain.hostname
 							$scope.newAffiliation.university = universityDomain.university
 							$scope.newAffiliation.department = universityDomain.department

services/web/public/coffee/main/affiliations/factories/UserAffiliationsDataService.coffee

@@ -28,7 +28,7 @@ define [
 				universitiesFromCountry = universities[country.code]
 			else
 				universitiesFromCountry = $http
-					.get "http://www.overleaf.test:5000/universities/list.json" , { params: { country_code: country.code } }
+					.get "/institutions/list" , { params: { country_code: country.code } }
 					.then (response) -> universities[country.code] = response.data
 			$q.resolve(universitiesFromCountry)
 
@@ -36,7 +36,7 @@ define [
 			if universitiesByDomain[partialDomainInput]?
 				$q.resolve universitiesByDomain[partialDomainInput]
 			else 
-				$http.get "http://www.overleaf.test:5000/university/domains.json" , { params: { hostname: partialDomainInput, limit: 1 } }
+				$http.get "/institutions/domains" , { params: { hostname: partialDomainInput, limit: 1 } }
 					.then (response) ->
 						university = response.data[0]
 						if university?

services/web/public/stylesheets/app/account-settings.less

@@ -28,9 +28,9 @@
 	}
 
 	.affiliations-form-group {
-		margin-bottom: @table-cell-padding;
-		&:last-of-type {
-			margin-bottom: 0;
+		margin-top: @table-cell-padding;
+		&:first-child {
+			margin-top: 0;
 		}
 	}
 	.affiliations-table-label {

services/web/public/stylesheets/components/input-suggestions.less

@@ -5,7 +5,7 @@
 	.input-suggestions-main {
 		position: absolute;
 		top: 0;
-		// background-color: transparent;
+		background-color: transparent;
 	}
 
 	.input-suggestions-shadow {