Change icons in get-started to outline. Add get-started button in navbar

src/app/app.component.ts

@@ -26,12 +26,20 @@ import {AlertModal} from "./openaireLibrary/utils/modal/alert";
     <div class="monitorApp">
       <navbar *ngIf="properties && showMenu && header" portal="monitor" [header]="header" [onlyTop]="false"
               [userMenuItems]=userMenuItems [menuItems]=menuItems [user]="user"
-              [showMenu]=showMenu [properties]="properties"></navbar>
+              [showMenu]=showMenu [properties]="properties">
+        <ul extra-s class="uk-nav uk-nav-default uk-margin-small-top">
+          <li routerLinkActive="uk-active">
+            <a routerLink="/get-started">Get Started</a>
+          </li>
+        </ul>
+        <a *ngIf="showGetStarted" extra-m class="uk-button uk-button-primary uk-text-uppercase uk-margin-left" routerLink="/get-started">Get Started</a>
+      </navbar>
       <schema2jsonld *ngIf="properties " [URL]="properties.domain + properties.baseLink"
                      [logoURL]="properties.domain + properties.baseLink+'/assets/common-assets/logo-small-monitor.png'"
-                     type="home" 
+                     type="home"
                      description="OpenAIRE - Monitor, A new era of monitoring research. Open data. Open methodologies. Work together with us to view, understand and visualize research statistics and indicators. "
-                     name="OpenAIRE Monitor" [searchAction]="true" [searchActionRoute]="properties.domain + properties.baseLink + '/browse'">
+                     name="OpenAIRE Monitor" [searchAction]="true"
+                     [searchActionRoute]="properties.domain + properties.baseLink + '/browse'">
       </schema2jsonld>
       <div class="uk-background-default">
         <main>
@@ -51,8 +59,9 @@ import {AlertModal} from "./openaireLibrary/utils/modal/alert";
       </cookie-law>
       <bottom *ngIf="properties && showMenu" [grantAdvance]="false"
               [properties]="properties"></bottom>
-			<quick-contact #quickContact *ngIf="showQuickContact && contactForm" (sendEmitter)="send($event)"
-                     [contactForm]="contactForm" [sending]="sending" [organizationTypes]="organizationTypes"></quick-contact>
+      <quick-contact #quickContact *ngIf="showQuickContact && contactForm" (sendEmitter)="send($event)"
+                     [contactForm]="contactForm" [sending]="sending"
+                     [organizationTypes]="organizationTypes"></quick-contact>
       <modal-alert #modal>
         <div class="uk-padding-small uk-padding-remove-horizontal">
           Our team will respond to your submission soon.
@@ -74,7 +83,8 @@ export class AppComponent {
   header: Header;
   logoPath: string = 'assets/common-assets/';
   /* Contact */
-	public showQuickContact: boolean;
+  public showQuickContact: boolean;
+  public showGetStarted: boolean = true;
   public contactForm: FormGroup;
   public organizationTypes: string[] = [
     'Funding agency', 'University / Research Center',
@@ -86,28 +96,29 @@ export class AppComponent {
   @ViewChild('quickContact') quickContact: QuickContactComponent;
   private subscriptions: any[] = [];
   
-  constructor(private  route: ActivatedRoute, private propertiesService: EnvironmentSpecificService,
+  constructor(private route: ActivatedRoute, private propertiesService: EnvironmentSpecificService,
               private router: Router, private stakeholderService: StakeholderService, private smoothScroll: SmoothScroll,
               private userManagementService: UserManagementService,
-							private quickContactService: QuickContactService,
+              private quickContactService: QuickContactService,
               private fb: FormBuilder,
               private emailService: EmailService) {
     this.subscriptions.push(router.events.forEach((event) => {
       if (event instanceof NavigationEnd) {
-          this.url = event.url;
-          let r = this.route;
-          while (r.firstChild) {
-            r = r.firstChild;
-          }
-          let params = r.snapshot.params;
-          this.params.next(params);
-          if(event.url === '/contact-us') {
-            this.quickContactService.setDisplay(false);
-          } else if(event.url !== '/contact-us' && !this.showQuickContact) {
-            this.quickContactService.setDisplay(true);
-          }
+        this.url = event.url;
+        let r = this.route;
+        while (r.firstChild) {
+          r = r.firstChild;
         }
-        
+        let params = r.snapshot.params;
+        this.params.next(params);
+        if (event.url === '/contact-us') {
+          this.quickContactService.setDisplay(false);
+        } else if (event.url !== '/contact-us' && !this.showQuickContact) {
+          this.quickContactService.setDisplay(true);
+        }
+        this.showGetStarted = event.url !== '/get-started';
+      }
+      
     }));
   }
   
@@ -121,17 +132,17 @@ export class AppComponent {
         url: null,
         title: 'monitor',
         logoUrl: this.logoPath + 'logo-large-monitor.png',
-        logoSmallUrl:this.logoPath + 'logo-small-monitor.png',
-        position:'left',
-        badge:true,
+        logoSmallUrl: this.logoPath + 'logo-small-monitor.png',
+        position: 'left',
+        badge: true,
         menuPosition: 'center'
       };
       this.buildMenu();
       this.reset();
     }));
-		this.subscriptions.push(this.quickContactService.isDisplayed.subscribe(display => {
-			this.showQuickContact = display;
-		}));
+    this.subscriptions.push(this.quickContactService.isDisplayed.subscribe(display => {
+      this.showQuickContact = display;
+    }));
   }
   
   public ngOnDestroy() {
@@ -181,16 +192,16 @@ export class AppComponent {
   }
   
   public send(event) {
-    if(event.valid === true) {
+    if (event.valid === true) {
       this.sendMail(this.properties.admins);
     }
   }
   
   public reset() {
-    if(this.quickContact) {
+    if (this.quickContact) {
       this.quickContact.close();
     }
-    this.contactForm = this.fb.group( {
+    this.contactForm = this.fb.group({
       name: this.fb.control('', Validators.required),
       surname: this.fb.control('', Validators.required),
       email: this.fb.control('', [Validators.required, Validators.email]),
@@ -233,7 +244,7 @@ export class AppComponent {
   }
   
   handleError(message: string, error = null) {
-    if(error) {
+    if (error) {
       console.error(error);
     }
     this.sending = false;

src/app/get-started/get-started.component.html

@@ -20,7 +20,7 @@
 			<div class="uk-flex uk-flex-center uk-flex-bottom" uk-scrollspy-class>
 				<img class="transform-translate-y uk-visible@m" src="assets/monitor-assets/get-started/1.svg" alt="Step 1" loading="lazy">
 				<div class="uk-flex uk-flex-column uk-padding-small uk-margin-small-left">
-					<icon name="description" ratio="2" visuallyHidden="Provide some information"
+					<icon name="description" type="outlined" ratio="2" visuallyHidden="Provide some information"
 						customClass="uk-text-primary-gradient"></icon>
 					<span class="uk-h5 uk-margin-remove uk-text-uppercase">Provide some <br> information</span>
 				</div>
@@ -28,7 +28,7 @@
 			<div class="uk-flex uk-flex-center uk-flex-bottom" uk-scrollspy-class>
 				<img class="transform-translate-y uk-visible@m" src="assets/monitor-assets/get-started/2.svg" alt="Step 2" loading="lazy">
 				<div class="uk-flex uk-flex-column uk-padding-small uk-margin-small-left">
-					<icon name="email" ratio="2" visuallyHidden="Provide some information"
+					<icon name="email" type="outlined" ratio="2" visuallyHidden="Provide some information"
 						customClass="uk-text-primary-gradient"></icon>
 					<span class="uk-h5 uk-margin-remove uk-margin-small-top uk-text-uppercase">We contact <br> you</span>
 				</div>

src/app/openaireLibrary

@@ -1 +1 @@
-Subproject commit 2b7c52a8b0cb4599324253f57f9eb428682275cb
+Subproject commit 360cc0f3e3bd4892fbffea94391fa8af4a339fea

src/assets/openaire-theme

@@ -1 +1 @@
-Subproject commit 60be89ef464a3eb6a485b1f68bd9f3dcde0393a0
+Subproject commit e5410728a16312eca7bd11ebb6b8dc8777c072a3