Merge branch 'master' into improve-support-for-hal-links

src/app/+collection-page/collection-page.component.html

-<div class="collection-page"
-     *ngVar="(collectionRDObs | async) as collectionRD"
-  >
-  <div *ngIf="collectionRD?.hasSucceeded" @fadeInOut>
-    <div *ngIf="collectionRD?.payload as collection">
-      <!-- Collection Name -->
-      <ds-comcol-page-header
-        [name]="collection.name">
-      </ds-comcol-page-header>
-      <!-- Collection logo -->
-      <ds-comcol-page-logo *ngIf="logoRDObs"
-        [logo]="(logoRDObs | async)?.payload"
-        [alternateText]="'Collection Logo'">
-      </ds-comcol-page-logo>
-      <!-- Introductionary text -->
-      <ds-comcol-page-content
-        [content]="collection.introductoryText"
-        [hasInnerHtml]="true">
-      </ds-comcol-page-content>
-      <!-- News -->
-      <ds-comcol-page-content
-        [content]="collection.sidebarText"
-        [hasInnerHtml]="true"
-        [title]="'community.page.news'">
-      </ds-comcol-page-content>
-      <!-- Copyright -->
-      <ds-comcol-page-content
-        [content]="collection.copyrightText"
-        [hasInnerHtml]="true">
-      </ds-comcol-page-content>
-      <!-- Licence -->
-      <ds-comcol-page-content
-        [content]="collection.license"
-        [title]="'collection.page.license'">
-      </ds-comcol-page-content>
+<div class="container">
+  <div class="collection-page"
+       *ngVar="(collectionRDObs | async) as collectionRD">
+    <div *ngIf="collectionRD?.hasSucceeded" @fadeInOut>
+      <div *ngIf="collectionRD?.payload as collection">
+        <!-- Collection Name -->
+        <ds-comcol-page-header
+          [name]="collection.name">
+        </ds-comcol-page-header>
+        <!-- Collection logo -->
+        <ds-comcol-page-logo *ngIf="logoRDObs"
+                             [logo]="(logoRDObs | async)?.payload"
+                             [alternateText]="'Collection Logo'">
+        </ds-comcol-page-logo>
+        <!-- Introductionary text -->
+        <ds-comcol-page-content
+          [content]="collection.introductoryText"
+          [hasInnerHtml]="true">
+        </ds-comcol-page-content>
+        <!-- News -->
+        <ds-comcol-page-content
+          [content]="collection.sidebarText"
+          [hasInnerHtml]="true"
+          [title]="'community.page.news'">
+        </ds-comcol-page-content>
+        <!-- Copyright -->
+        <ds-comcol-page-content
+          [content]="collection.copyrightText"
+          [hasInnerHtml]="true">
+        </ds-comcol-page-content>
+        <!-- Licence -->
+        <ds-comcol-page-content
+          [content]="collection.license"
+          [title]="'collection.page.license'">
+        </ds-comcol-page-content>
+      </div>
     </div>
+    <ds-error *ngIf="collectionRD?.hasFailed" message="{{'error.collection' | translate}}"></ds-error>
+    <ds-loading *ngIf="collectionRD?.isLoading" message="{{'loading.collection' | translate}}"></ds-loading>
+    <br>
+    <ng-container *ngVar="(itemRDObs | async) as itemRD">
+      <div *ngIf="itemRD?.hasSucceeded" @fadeIn>
+        <h2>{{'collection.page.browse.recent.head' | translate}}</h2>
+        <ds-object-list
+          [config]="paginationConfig"
+          [sortConfig]="sortConfig"
+          [objects]="itemRD"
+          [hideGear]="false"
+          (paginationChange)="onPaginationChange($event)">
+        </ds-object-list>
+      </div>
+      <ds-error *ngIf="itemRD?.hasFailed" message="{{'error.recent-submissions' | translate}}"></ds-error>
+      <ds-loading *ngIf="!itemRD || itemRD.isLoading" message="{{'loading.recent-submissions' | translate}}"></ds-loading>
+    </ng-container>
   </div>
-  <ds-error *ngIf="collectionRD?.hasFailed" message="{{'error.collection' | translate}}"></ds-error>
-  <ds-loading *ngIf="collectionRD?.isLoading" message="{{'loading.collection' | translate}}"></ds-loading>
-  <br>
-  <ng-container *ngVar="(itemRDObs | async) as itemRD">
-    <div *ngIf="itemRD?.hasSucceeded" @fadeIn>
-      <h2>{{'collection.page.browse.recent.head' | translate}}</h2>
-      <ds-object-list
-        [config]="paginationConfig"
-        [sortConfig]="sortConfig"
-        [objects]="itemRD"
-        [hideGear]="false"
-        (paginationChange)="onPaginationChange($event)">
-      </ds-object-list>
-    </div>
-    <ds-error *ngIf="itemRD?.hasFailed" message="{{'error.recent-submissions' | translate}}"></ds-error>
-    <ds-loading *ngIf="!itemRD || itemRD.isLoading" message="{{'loading.recent-submissions' | translate}}"></ds-loading>
-  </ng-container>
 </div>

src/app/+community-page/community-page.component.html

-<ng-container *ngVar="(communityRDObs | async) as communityRD">
+<div class="container" *ngVar="(communityRDObs | async) as communityRD">
   <div class="community-page" *ngIf="communityRD?.hasSucceeded" @fadeInOut>
     <div *ngIf="communityRD?.payload; let communityPayload">
       <!-- Community name -->
@@ -29,4 +29,4 @@
   </div>
   <ds-error *ngIf="communityRD?.hasFailed" message="{{'error.community' | translate}}"></ds-error>
   <ds-loading *ngIf="communityRD?.isLoading" message="{{'loading.community' | translate}}"></ds-loading>
-</ng-container>
+</div>

src/app/+home-page/home-news/home-news.component.html

 <div class="jumbotron jumbotron-fluid">
-  <div class="container-fluid">
-    <div class="row">
+  <div class="container">
+    <div class="d-flex">
       <div class="dspace-logo-container">
         <img src="assets/images/dspace-logo.png" />
       </div>
@@ -9,14 +9,12 @@
         <p class="lead">DSpace is an open source software platform that enables organisations to:</p>
       </div>
     </div>
-    <div class="row">
-      <ul>
-        <li>capture and describe digital material using a submission workflow module, or a variety of programmatic ingest options
-        </li>
-        <li>distribute an organisation's digital assets over the web through a search and retrieval system
-        </li>
-        <li>preserve digital assets over the long term</li>
-      </ul>
-    </div>
+    <ul>
+      <li>capture and describe digital material using a submission workflow module, or a variety of programmatic ingest options
+      </li>
+      <li>distribute an organisation's digital assets over the web through a search and retrieval system
+      </li>
+      <li>preserve digital assets over the long term</li>
+    </ul>
   </div>
 </div>

src/app/+home-page/home-news/home-news.component.scss

 @import '../../../styles/variables.scss';
+
 :host {
   display: block;
-  margin-right: ($grid-gutter-width / -2);
-  margin-left:  ($grid-gutter-width / -2);
   margin-top: -$content-spacing;
   margin-bottom: -$content-spacing;
 }

src/app/+home-page/home-page.component.html

 <ds-home-news></ds-home-news>
-<ds-search-form></ds-search-form>
-<ds-top-level-community-list></ds-top-level-community-list>
+<div class="container">
+  <ds-search-form></ds-search-form>
+  <ds-top-level-community-list></ds-top-level-community-list>
+</div>

src/app/+item-page/full/full-item-page.component.html

-<ng-container *ngVar="(itemRDObs | async) as itemRD">
+<div class="container" *ngVar="(itemRDObs | async) as itemRD">
   <div class="item-page" *ngIf="itemRD?.hasSucceeded" @fadeInOut>
     <div *ngIf="itemRD?.payload as item">
       <ds-item-page-title-field [item]="item"></ds-item-page-title-field>
@@ -22,4 +22,4 @@
   </div>
   <ds-error *ngIf="itemRD?.hasFailed" message="{{'error.item' | translate}}"></ds-error>
   <ds-loading *ngIf="itemRD?.isLoading" message="{{'loading.item' | translate}}"></ds-loading>
-</ng-container>
+</div>

src/app/+item-page/simple/item-page.component.html

-<ng-container *ngVar="(itemRDObs | async) as itemRD">
+<div class="container" *ngVar="(itemRDObs | async) as itemRD">
   <div class="item-page" *ngIf="itemRD?.hasSucceeded" @fadeInOut>
     <div *ngIf="itemRD?.payload as item">
       <ds-item-page-title-field [item]="item"></ds-item-page-title-field>
@@ -26,4 +26,4 @@
   </div>
   <ds-error *ngIf="itemRD?.hasFailed" message="{{'error.item' | translate}}"></ds-error>
   <ds-loading *ngIf="itemRD?.isLoading" message="{{'loading.item' | translate}}"></ds-loading>
-</ng-container>
+</div>

src/app/+search-page/search-page.component.html

-<div class="search-page">
+<div class="container">
+  <div class="search-page">
     <ds-search-form
       [query]="query"
       [scope]="(scopeObjectRDObs | async)?.payload"
@@ -7,4 +8,5 @@
     </ds-search-form>
     <ds-view-mode-switch></ds-view-mode-switch>
     <ds-search-results [searchResults]="resultsRDObs | async" [searchConfig]="searchOptions"></ds-search-results>
+  </div>
 </div>

src/app/app.component.html

@@ -3,9 +3,7 @@
     <ds-header></ds-header>
 
     <main class="main-content">
-      <div class="container-fluid">
-        <router-outlet></router-outlet>
-      </div>
+      <router-outlet></router-outlet>
     </main>
 
     <ds-footer></ds-footer>

src/app/shared/comcol-page-logo/comcol-page-logo.component.html

 <div *ngIf="logo" class="dso-logo">
-    <img [src]="logo.content" class="img-responsive" [attr.alt]="alternateText ? alternateText : null" (error)="errorHandler($event)"/>
+    <img [src]="logo.content" class="img-fluid" [attr.alt]="alternateText ? alternateText : null" (error)="errorHandler($event)"/>
 </div>

src/app/shared/pagination/pagination.component.html

@@ -6,9 +6,9 @@
         <span class="align-middle" *ngIf="collectionSize">{{ 'pagination.showing.detail' | translate:getShowingDetails(collectionSize)}}</span>
       </div>
       <div class="col">
-        <div ngbDropdown #paginationControls="ngbDropdown" class="d-inline-block float-right">
+        <div ngbDropdown #paginationControls="ngbDropdown" placement="bottom-right" class="d-inline-block float-right">
           <button class="btn btn-outline-primary" id="paginationControls" ngbDropdownToggle><i class="fa fa-cog" aria-hidden="true"></i></button>
-          <div class="dropdown-menu dropdown-menu-right" id="paginationControlsDropdownMenu" aria-labelledby="paginationControls" ngbDropdownMenu>
+          <div id="paginationControlsDropdownMenu" aria-labelledby="paginationControls" ngbDropdownMenu>
             <h6 class="dropdown-header">{{ 'pagination.results-per-page' | translate}}</h6>
             <button class="dropdown-item" *ngFor="let item of pageSizeOptions" (click)="doPageSizeChange(item)"><i [ngClass]="{'invisible': item != pageSize}" class="fa fa-check" aria-hidden="true"></i> {{item}} </button>
             <h6 class="dropdown-header">{{ 'pagination.sort-direction' | translate}}</h6>