added banner and changed fonts

src/app/+home-page/home-news/themes/home-news.component.preview-release.html

@@ -0,0 +1,20 @@
+<div class="background-image">
+    <div class="container">
+        <div class="jumbotron jumbotron-fluid">
+            <div class="d-flex flex-wrap">
+                <div>
+                    <h1 class="display-3">DSpace 7</h1>
+                    <p class="lead">DSpace is the world leading open source repository platform that enables organisations to:</p>
+                </div>
+            </div>
+            <ul>
+                <li>easily ingest documents, audio, video, datasets and their corresponding Dublin Core metadata
+                </li>
+                <li>open up this content to local and global audiences, thanks to the OAI-PMH interface and Google Scholar optimizations
+                </li>
+                <li>issue permanent urls and trustworthy identifiers, including optional integrations with handle.net and DataCite DOI</li>
+            </ul>
+        </div>
+    </div>
+    <small class="credits">Photo by <a href="https://www.pexels.com/@inspiredimages">Anthony</a></small>
+</div>

src/app/+home-page/home-news/themes/home-news.component.preview-release.scss

@@ -0,0 +1,58 @@
+@import '../../../../styles/variables.scss';
+
+:host-context(.preview-release) {
+    div.background-image {
+        color: white;
+        background-color: #2e80a3;
+        position: relative;
+        background-position-y: -200px;
+        background-image: url('/assets/images/banner.jpg');
+        background-size: cover;
+        @media screen and (max-width: map-get($grid-breakpoints, lg)) {
+            background-position-y: 0;
+        }
+
+        .container {
+            position: relative;
+            text-shadow: 1px 1px 4px rgba(0, 0, 0, 0.6);
+            &:before, &:after {
+                content: '';
+                display: block;
+                width: $banner-background-gradient-width;
+                height: 100%;
+                top: 0;
+                position: absolute;
+            }
+
+            &:before {
+                background: linear-gradient(to left, $banner-text-background, transparent);
+                left: -$banner-background-gradient-width;
+
+            }
+
+            &:after {
+                background: linear-gradient(to right, $banner-text-background, transparent);
+                right: -$banner-background-gradient-width;
+            }
+
+            background-color: $banner-text-background;
+
+            .jumbotron {
+                background-color: transparent;
+            }
+
+        }
+
+
+        small.credits {
+            a {
+                color: inherit;
+            }
+            opacity: 0.3;
+            position: absolute;
+            right: 5px;
+            bottom: 0;
+        }
+
+    }
+}

src/app/+home-page/themes/home-page.component.preview-release.html

@@ -0,0 +1,5 @@
+<ds-home-news></ds-home-news>
+<div class="container">
+  <ds-search-form class="d-block pt-4 pb-3"></ds-search-form>
+  <ds-top-level-community-list></ds-top-level-community-list>
+</div>

src/app/+home-page/themes/home-page.component.preview-release.scss

@@ -1,3 +1,3 @@
 :host-context(.preview-release) {
-    //color: green;
+
 }

src/app/+search-page/search-filters/search-filter/search-range-filter/themes/search-range-filter.component.scss

@@ -0,0 +1,7 @@
+@import '../../../../../../styles/variables.scss';
+
+:host-context(.preview-release) {
+    ::ng-deep .noUi-connect {
+        background: $info;
+    }
+}

src/app/header/header.component.html

@@ -1,7 +1,7 @@
 <header>
     <div class="container">
         <a class="navbar-brand my-2" routerLink="/home">
-            <img src="assets/images/dspace-logo-monochrome.svg"/>
+            <img src="assets/images/dspace-logo.svg"/>
         </a>
 
         <nav class="navbar navbar-light navbar-expand-md float-right px-0">

src/app/header/themes/header.component.preview-release.scss

@@ -2,6 +2,6 @@
 
 :host-context(.preview-release) {
     ::ng-deep a {
-        color: $dark;
+        //color: $dark;
     }
 }

src/app/navbar/themes/navbar.component.preview-release.html

@@ -1,6 +1,6 @@
 <nav [ngClass]="{'open': !(menuCollapsed | async)}"
      [@slideMobileNav]="!(windowService.isXsOrSm() | async) ? 'default' : ((menuCollapsed | async) ? 'collapsed' : 'expanded')"
-     class="navbar navbar-dark bg-info navbar-expand-md p-md-0 navbar-container">    <!-- TODO remove navbar-container class when https://github.com/twbs/bootstrap/issues/24726 is fixed -->
+     class="navbar navbar-light navbar-expand-md p-md-0 navbar-container">    <!-- TODO remove navbar-container class when https://github.com/twbs/bootstrap/issues/24726 is fixed -->
     <div class="container">
         <div class="reset-padding-md w-100">
             <div id="collapsingNav">

src/app/navbar/themes/navbar.component.preview-release.scss

@@ -1,7 +1,9 @@
-@import '../../styles/variables.scss';
+@import '../../../styles/variables.scss';
 
-nav.navbar {
+:host-context(.preview-release) {
-    border-bottom: 5px $dark solid;
+    nav.navbar {
+        border-bottom: 5px $green solid;
+    }
 }
 
 

src/styles/themes/_bootstrap_variables.preview-release.scss

@@ -1,3 +1,6 @@
+@import url('https://fonts.googleapis.com/css?family=Source+Sans+Pro:200,200i,300,300i,400,400i,600,600i,700,700i,900,900i&subset=cyrillic,cyrillic-ext,greek,greek-ext,latin-ext,vietnamese');
+
+$font-family-sans-serif: 'Source Sans Pro', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
 $gray-100: #e8ebf3 !default; // #eee
 $gray-800: #444444 !default; // #444
 
@@ -6,7 +9,7 @@ $navbar-dark-color: #FFFFFF;
 /* Reassign color vars to semantic color scheme */
 $blue: #43515f !default;
 $green: #92C642 !default;
-$cyan: #56ab9c !default;
+$cyan: #2e80a3 !default;
 $yellow: #ec9433 !default;
 $red: #CF4444 !default;
 $dark: #43515f !default;

src/styles/themes/_custom_variables.preview-release.scss

@@ -0,0 +1,2 @@
+$banner-text-background: rgba(0, 0, 0, 0.35);
+$banner-background-gradient-width: 300px;