Merge pull request #156 from julianpoy/fix/#151-fix-welcome-norecipes

Fix/#151 Fix and update my recipes welcome screen
julianpoy · Feb 6, 2019 · 652d661 · 652d661
2 parents d8192cf + c86950b
commit 652d661
Show file tree

Hide file tree

Showing 8 changed files with 62 additions and 8 deletions.
diff --git a/Frontend/src/components/components.module.ts b/Frontend/src/components/components.module.ts
@@ -4,12 +4,14 @@ import { SelectRecipeComponent } from './select-recipe/select-recipe';
 import { CommonModule } from '@angular/common';
 import { IonicModule } from 'ionic-angular';
 import { SelectCollaboratorsComponent } from './select-collaborators/select-collaborators';
+import { LogoIconComponent } from './logo-icon/logo-icon';
 import { PipesModule } from '../pipes/pipes.module';
 @NgModule({
 	declarations: [
     SelectRecipeComponent,
     SelectIngredientsComponent,
-    SelectCollaboratorsComponent
+    SelectCollaboratorsComponent,
+    LogoIconComponent
   ],
 	imports: [
     CommonModule,
@@ -19,7 +21,8 @@ import { PipesModule } from '../pipes/pipes.module';
 	exports: [
     SelectRecipeComponent,
     SelectIngredientsComponent,
-    SelectCollaboratorsComponent
+    SelectCollaboratorsComponent,
+    LogoIconComponent
   ]
 })
 export class ComponentsModule {}
diff --git a/Frontend/src/components/logo-icon/logo-icon.html b/Frontend/src/components/logo-icon/logo-icon.html
@@ -0,0 +1,7 @@
+<div class="logo-icon">
+  <a [href]="href">
+    <div class="bg">
+      <img src="/assets/imgs/logo_green.png" />
+    </div>
+  </a>
+</div>
diff --git a/Frontend/src/components/logo-icon/logo-icon.scss b/Frontend/src/components/logo-icon/logo-icon.scss
@@ -0,0 +1,16 @@
+logo-icon {
+  .logo-icon {
+    $iconSize: 50px;
+
+    .bg {
+      box-shadow: 1px 1px 7px rgba(0, 0, 0, 0.3);
+      display: inline-block;
+      border-radius: 100%;
+      background: #353b48;
+      padding: 6px;
+      bottom: middle;
+      width: $iconSize;
+      height: $iconSize;
+    }
+  }
+}
diff --git a/Frontend/src/components/logo-icon/logo-icon.ts b/Frontend/src/components/logo-icon/logo-icon.ts
@@ -0,0 +1,12 @@
+import { Component, Input } from '@angular/core';
+
+@Component({
+  selector: 'logo-icon',
+  templateUrl: 'logo-icon.html'
+})
+export class LogoIconComponent {
+
+  @Input('href') href
+
+  constructor() {}
+}
diff --git a/Frontend/src/index.html b/Frontend/src/index.html
@@ -88,7 +88,7 @@
   </script>
 
   <script>
-    window.version = '1.4.10';
+    window.version = '1.4.11';
   </script>
 
   <link href="build/main.css" rel="stylesheet" async>

diff --git a/Frontend/src/pages/home/home.html b/Frontend/src/pages/home/home.html
@@ -48,13 +48,22 @@ <h2 text-wrap>{{ recipe.title }}</h2>
     </div>
   </virtual-scroller>
 
-  <ion-list *ngIf="!initialLoadComplete">
+  <ion-list *ngIf="initialLoadComplete">
     <ion-item *ngIf="folder === 'main' && (!recipes || recipes.length === 0) && searchText.length === 0" no-lines text-wrap text-center>
+      <br /><br />
+      <logo-icon href="/#/about"></logo-icon>
+      <br /><br />
+      <h2>Welcome to Recipe Sage!</h2>
+      <br /><br />
       <p>
-        Welcome to Recipe Sage!<br /><br />
-        This is your recipe list.<br />
+        This is where your recipes will appear.<br />
         It looks like you don't have any recipes yet.<br />
-        Click the button in the bottom right corner to add one!
+        <b>Click the + button in the bottom right corner to add one!</b><br />
+
+        <br /><br />
+
+        You can also import recipes!<br />
+        Use the side menu to go to settings -> import
       </p>
     </ion-item>
 

diff --git a/Frontend/src/pages/home/home.module.ts b/Frontend/src/pages/home/home.module.ts
@@ -2,6 +2,7 @@ import { NgModule } from '@angular/core';
 import { IonicPageModule } from 'ionic-angular';
 import { HomePage } from './home';
 import { PipesModule } from './../../pipes/pipes.module';
+import { ComponentsModule } from '../../components/components.module';
 
 import { VirtualScrollerModule } from 'ngx-virtual-scroller';
 
@@ -12,7 +13,8 @@ import { VirtualScrollerModule } from 'ngx-virtual-scroller';
   imports: [
     IonicPageModule.forChild(HomePage),
     PipesModule,
-    VirtualScrollerModule
+    VirtualScrollerModule,
+    ComponentsModule
   ],
 })
 export class HomePageModule {}
diff --git a/Frontend/src/pages/info-components/release-notes/release-notes.html b/Frontend/src/pages/info-components/release-notes/release-notes.html
@@ -20,6 +20,11 @@
 
   <br />
 
+  <b>v1.4.11</b><br />
+  - Updated "My Recipes" welcome screen<br />
+
+  <br />
+
   <b>v1.4.10</b><br />
   - Fixes a bug where Pepperplate import would fail due to updates to Pepperplate<br />
   - Adds a select/deselect all option to select ingredients component<br />