changed homepage

This commit is contained in:
lotte
2019-03-28 10:18:50 +01:00
parent eddf106557
commit dc858d334d
7 changed files with 103 additions and 91 deletions

View File

@@ -1,20 +1,20 @@
<div class="background-image">
<div class="container">
<div class="jumbotron jumbotron-fluid">
<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>
<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>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>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>
<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>

View File

@@ -1,58 +1,5 @@
@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;
}
}
}

View File

@@ -1,5 +1,10 @@
<ds-home-news></ds-home-news>
<div class="container">
<ds-search-form class="d-block pt-4 pb-3"></ds-search-form>
<div class="background-image">
<div class="container">
<ds-home-news></ds-home-news>
<ds-search-form class="d-block pb-3" [large]="true" [brandColor]="'success'"></ds-search-form>
</div>
<small class="credits">Photo by <a href="https://www.pexels.com/@inspiredimages">@inspiredimages</a></small>
</div>
<div class="container pt-3">
<ds-top-level-community-list></ds-top-level-community-list>
</div>

View File

@@ -1,3 +1,52 @@
:host-context(.preview-release) {
@import '../../../styles/variables.scss';
:host-context(.preview-release) {
div.background-image {
color: white;
background-color: $info;
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;
}
small.credits {
a {
color: inherit;
}
opacity: 0.3;
position: absolute;
right: $spacer;
bottom: 0;
}
}
}

View File

@@ -40,6 +40,10 @@ export class SearchFormComponent {
*/
@Input() scopes: DSpaceObject[];
@Input() large = false;
@Input() brandColor = 'primary';
constructor(private router: Router) {
}

View File

@@ -1,15 +1,20 @@
<form #form="ngForm" (ngSubmit)="onSubmit(form.value)" class="row" action="/search">
<div *ngIf="isNotEmpty(scopes)" class="col-12 col-sm-3">
<select [(ngModel)]="scope" name="scope" class="form-control" aria-label="Search scope" (change)="onScopeChange($event.target.value)">
<div *ngIf="isNotEmpty(scopes)" class="col-12 col-sm-3">
<select [(ngModel)]="scope" name="scope" class="form-control" aria-label="Search scope"
(change)="onScopeChange($event.target.value)">
<option value>{{'search.form.search_dspace' | translate}}</option>
<option *ngFor="let scopeOption of scopes" [value]="scopeOption.id">{{scopeOption?.name ? scopeOption.name : 'search.form.search_dspace' | translate}}</option>
<option *ngFor="let scopeOption of scopes"
[value]="scopeOption.id">{{scopeOption?.name ? scopeOption.name : 'search.form.search_dspace' | translate}}</option>
</select>
</div>
</div>
<div [ngClass]="{'col-sm-9': isNotEmpty(scopes)}" class="col-12">
<div class="form-group input-group">
<input type="text" [(ngModel)]="query" name="query" class="form-control" aria-label="Search input">
<div class="form-group input-group"
[ngClass]="{'input-group-lg': large}">
<input type="text" [(ngModel)]="query" name="query" class="form-control"
aria-label="Search input">
<span class="input-group-append">
<button type="submit" class="search-button btn btn-primary">{{ ('search.form.search' | translate) }}</button>
<button type="submit"
class="search-button btn btn-{{brandColor}}">{{ ('search.form.search' | translate) }}</button>
</span>
</div>
</div>

View File

@@ -15,3 +15,5 @@ $red: #CF4444 !default;
$dark: #43515f !default;
$body-color: $gray-800 !default;
$yiq-contrasted-threshold: 170 !default;