Some visual / layout improvements

src/app/+browse-by/+browse-by-metadata-page/browse-by-metadata-page.component.html

 <div class="container">
     <ng-container *ngVar="(parent$ | async) as parent">
         <ng-container *ngIf="parent?.payload as parentContext">
-        <header class="comcol-header">
+        <header class="comcol-header border-bottom mb-4 pb-4">
         <!-- Parent Name -->
         <ds-comcol-page-header [name]="parentContext.name">
         </ds-comcol-page-header>
+        <!-- Handle -->
+        <ds-comcol-page-handle
+            [content]="parentContext.handle"
+            [title]="parentContext.type+'.page.handle'" >
+        </ds-comcol-page-handle>
         <!-- Introductory text -->
         <ds-comcol-page-content [content]="parentContext.introductoryText" [hasInnerHtml]="true">
         </ds-comcol-page-content>
         <!-- News -->
         <ds-comcol-page-content [content]="parentContext.sidebarText" [hasInnerHtml]="true" [title]="'community.page.news'">
         </ds-comcol-page-content>
-        <!-- Handle -->
-        <ds-comcol-page-handle
-            [content]="parentContext.handle"
-            [title]="parentContext.type+'.page.handle'" >
-        </ds-comcol-page-handle>
+
       </header>
       <section class="comcol-page-browse-section">
         <!-- Browse-By Links -->
@@ -39,7 +40,7 @@
     <ds-loading *ngIf="!startsWithOptions" message="{{'loading.browse-by-page' | translate}}"></ds-loading>
   </div>
   </section>
-  <footer >
+  <footer *ngIf="parentContext.copyrightText" class="border-top my-5 pt-4">
     <div >
 
       <!-- Copyright -->

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

@@ -3,7 +3,7 @@
          *ngVar="(collectionRD$ | async) as collectionRD">
         <div *ngIf="collectionRD?.hasSucceeded" @fadeInOut>
             <div *ngIf="collectionRD?.payload as collection">
-                <header class="comcol-header">
+                <header class="comcol-header border-bottom mb-4 pb-4">
                     <!-- Collection logo -->
                     <ds-comcol-page-logo *ngIf="logoRD$"
                         [logo]="(logoRD$ | async)?.payload" [alternateText]="'Collection Logo'">
@@ -13,6 +13,11 @@
                 <ds-comcol-page-header
                         [name]="collection.name">
                 </ds-comcol-page-header>
+                 <!-- Handle -->
+                <ds-comcol-page-handle
+                        [content]="collection.handle"
+                        [title]="'collection.page.handle'" >
+                </ds-comcol-page-handle>
                 <!-- Introductory text -->
                 <ds-comcol-page-content
                         [content]="collection.introductoryText"
@@ -24,11 +29,7 @@
                         [hasInnerHtml]="true"
                         [title]="'collection.page.news'">
                 </ds-comcol-page-content>
-               <!-- Handle -->
-               <ds-comcol-page-handle
-                        [content]="collection.handle"
-                        [title]="'collection.page.handle'" >
-                </ds-comcol-page-handle>
+
               </header>
               <section class="comcol-page-browse-section">
               <!-- Browse-By Links -->
@@ -38,7 +39,7 @@
               </ds-comcol-page-browse-by>
 
             <ng-container *ngVar="(itemRD$ | async) as itemRD">
-                <div *ngIf="itemRD?.hasSucceeded" @fadeIn>
+                <div class="mt-4" *ngIf="itemRD?.hasSucceeded" @fadeIn>
                     <h3 class="sr-only">{{'collection.page.browse.recent.head' | translate}}</h3>
                     <ds-viewable-collection
                             [config]="paginationConfig"
@@ -57,7 +58,7 @@
                 </div>
             </ng-container>
             </section>
-        <footer>
+            <footer *ngIf="collection.copyrightText" class="border-top my-5 pt-4">
           <!-- Copyright -->
           <ds-comcol-page-content
                       [content]="collection.copyrightText"

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

 <div class="container" *ngVar="(communityRD$ | async) as communityRD">
   <div class="community-page" *ngIf="communityRD?.hasSucceeded" @fadeInOut>
     <div *ngIf="communityRD?.payload; let communityPayload">
-      <header class="comcol-header">
+      <header class="comcol-header border-bottom mb-4 pb-4">
         <!-- Community logo -->
         <ds-comcol-page-logo *ngIf="logoRD$" [logo]="(logoRD$ | async)?.payload" [alternateText]="'Community Logo'">
         </ds-comcol-page-logo>
 
         <!-- Community name -->
         <ds-comcol-page-header [name]="communityPayload.name"></ds-comcol-page-header>
-
+        <!-- Handle -->
+        <ds-comcol-page-handle [content]="communityPayload.handle" [title]="'community.page.handle'">
+        </ds-comcol-page-handle>
         <!-- Introductory text -->
         <ds-comcol-page-content [content]="communityPayload.introductoryText" [hasInnerHtml]="true">
         </ds-comcol-page-content>
@@ -16,9 +18,7 @@
         <ds-comcol-page-content [content]="communityPayload.sidebarText" [hasInnerHtml]="true"
           [title]="'community.page.news'">
         </ds-comcol-page-content>
-        <!-- Handle -->
-        <ds-comcol-page-handle [content]="communityPayload.handle" [title]="'community.page.handle'">
-        </ds-comcol-page-handle>
+
       </header>
       <section class="comcol-page-browse-section">
         <!-- Browse-By Links -->
@@ -28,7 +28,7 @@
         <ds-community-page-sub-community-list [community]="communityPayload"></ds-community-page-sub-community-list>
         <ds-community-page-sub-collection-list [community]="communityPayload"></ds-community-page-sub-collection-list>
       </section>
-      <footer>
+      <footer  *ngIf="communityPayload.copyrightText"  class="border-top my-5 pt-4">
         <!-- Copyright -->
         <ds-comcol-page-content [content]="communityPayload.copyrightText" [hasInnerHtml]="true">
         </ds-comcol-page-content>

src/app/shared/comcol-page-browse-by/comcol-page-browse-by.component.html

-<h2 class="comcol-browse-label">{{'browse.comcol.head' | translate}}</h2>
+<h2 class="comcol-browse-label h5">{{'browse.comcol.head' | translate}}</h2>
 <nav class="comcol-browse" aria-label="Browse Community or Collection" >
   <div class="list-group list-group-horizontal">
     <a *ngIf="contentType=='collection'" [routerLink]="['/collections/' + id ]" class="list-group-item" routerLinkActive="active">{{'collection.page.browse.recent.head' | translate}}</a>

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

 <div *ngIf="content" class="content-with-optional-title mb-2">
-    <h2 *ngIf="title">{{ title | translate }}</h2>
-    <div><a href="{{content}}">{{content}}</a></div>
+    <h2 class="d-inline-block h6" *ngIf="title">{{ title | translate }}</h2>
+    <div  class="d-inline-block "><a href="{{content}}">{{content}}</a></div>
 </div>