diff --git a/src/app/home/home.component.html b/src/app/home/home.component.html index 4f62461..b27d740 100644 --- a/src/app/home/home.component.html +++ b/src/app/home/home.component.html @@ -1,6 +1,11 @@
SMAll Ruminants breeding for Efficiency and Resilience -

Welcome to the SMARTER database

+

Welcome to the SMARTER Database

+

+ The SMARTER database is a collection of data from small ruminant research projects.
+ The data is open and available to the community. See our + about page for more information. +

diff --git a/src/app/home/home.component.scss b/src/app/home/home.component.scss index 7c9fabe..85a6d03 100644 --- a/src/app/home/home.component.scss +++ b/src/app/home/home.component.scss @@ -8,3 +8,15 @@ width: 85%; height: auto; } + +h1 { + text-align: center; + font-size: 2.5rem; + margin: 1rem; +} + +p { + text-align: center; + margin: 1rem; + padding-top: 1rem; +} diff --git a/src/app/home/home.component.spec.ts b/src/app/home/home.component.spec.ts index bb6a041..3e142f7 100644 --- a/src/app/home/home.component.spec.ts +++ b/src/app/home/home.component.spec.ts @@ -27,6 +27,6 @@ describe('HomeComponent', () => { const fixture = TestBed.createComponent(HomeComponent); fixture.detectChanges(); const compiled = fixture.nativeElement; - expect(compiled.querySelector('h1').textContent).toContain('Welcome to the SMARTER database'); + expect(compiled.querySelector('h1').textContent).toContain('Welcome to the SMARTER Database'); }); }); diff --git a/src/styles.scss b/src/styles.scss index a3db279..47a734e 100644 --- a/src/styles.scss +++ b/src/styles.scss @@ -10,6 +10,18 @@ $my-accent: mat.define-palette(mat.$orange-palette, A200, A100, A400); // The "warn" palette is optional and defaults to red if not specified. $my-warn: mat.define-palette(mat.$red-palette); +// define the light theme +$my-theme: mat.define-light-theme(( + color: ( + primary: $my-primary, + accent: $my-accent, + warn: $my-warn, + ) +)); + +// includes styles for all components in the library +@include mat.all-component-themes($my-theme); + // A mixin to deal with mat-row hover // https://github.com/angular/components/issues/8204 @mixin mat-table-hover($is-dark) { @@ -27,18 +39,6 @@ $my-warn: mat.define-palette(mat.$red-palette); } } -// define the light theme -$my-theme: mat.define-light-theme(( - color: ( - primary: $my-primary, - accent: $my-accent, - warn: $my-warn, - ) -)); - -// includes styles for all components in the library -@include mat.all-component-themes($my-theme); - // include custom mixins @include mat-table-hover(false);