wtsimkins
/
PassionProject_FrontEnd
Watch 1
Star 0
Fork 0
Code Issues 0 Pull Requests 0 Releases 0 Wiki Activity
Browse Source

added topic page

William Simkins 6 years ago
parent
9314c5c26a
commit
281ecc3e16
9 changed files with 88 additions and 4 deletions
Split View Show Diff Stats
  1. 3
    0
      src/app/app.module.ts
  2. 4
    0
      src/app/app.scss
  3. 2
    2
      src/pages/home/home.html
  4. 1
    1
      src/pages/home/home.scss
  5. 2
    1
      src/pages/home/home.ts
  6. 35
    0
      src/pages/topic/topic.html
  7. 13
    0
      src/pages/topic/topic.module.ts
  8. 3
    0
      src/pages/topic/topic.scss
  9. 25
    0
      src/pages/topic/topic.ts

+ 3
- 0
src/app/app.module.ts View File 

@@ -6,6 +6,7 @@ import { MyApp } from './app.component';
6 6 
 import { AboutPage } from '../pages/about/about';
7 7 
 import { ContactPage } from '../pages/contact/contact';
8 8 
 import { HomePage } from '../pages/home/home';
9 
+import { TopicPage } from '../pages/topic/topic';
9 10 
 import { TabsPage } from '../pages/tabs/tabs';
10 11
11 12 
 import { StatusBar } from '@ionic-native/status-bar';
 
@@ -17,6 +18,7 @@ import { SplashScreen } from '@ionic-native/splash-screen';
17 18 
     AboutPage,
18 19 
     ContactPage,
19 20 
     HomePage,
21 
+    TopicPage,
20 22 
     TabsPage
21 23 
   ],
22 24 
   imports: [
 
@@ -29,6 +31,7 @@ import { SplashScreen } from '@ionic-native/splash-screen';
29 31 
     AboutPage,
30 32 
     ContactPage,
31 33 
     HomePage,
34 
+    TopicPage,
32 35 
     TabsPage
33 36 
   ],
34 37 
   providers: [

+ 4
- 0
src/app/app.scss View File 

@@ -14,3 +14,7 @@
14 14 
 // To declare rules for a specific mode, create a child rule
15 15 
 // for the .md, .ios, or .wp mode classes. The mode class is
16 16 
 // automatically applied to the <body> element in the app.
17 
+
18 
+ion-content {
19 
+  background: url("/assets/imgs/bg.jpg") no-repeat center;background-size:cover;
20 
+}

+ 2
- 2
src/pages/home/home.html View File 

@@ -14,6 +14,6 @@
14 14 
       <input type="password" placeholder="Password">
15 15 
     </label>
16 16 
   </form>
17 
-  <a ui-sref="topics()" id="motivateMe-button1" class="button">Login</a>
18 
-  <a ui-sref="createAnAccount()" id="motivateMe-button2" class="button">Or create an account</a>
17 
+  <a (click)="topics()" id="motivateMe-button1" class="button">Login</a>
18 
+  <a (click)="createAnAccount()" id="motivateMe-button2" class="button">Or create an account</a>
19 19 
 </ion-content>

+ 1
- 1
src/pages/home/home.scss View File 

@@ -1,5 +1,5 @@
1 1 
 .page-home {
2 
-  background: url("/assets/imgs/bg.jpg") no-repeat center;background-size:cover;
2 
+
3 3 
   display: block;
4 4
5 5 
   * {

+ 2
- 1
src/pages/home/home.ts View File 

@@ -1,5 +1,6 @@
1 1 
 import { Component } from '@angular/core';
2 2 
 import { NavController } from 'ionic-angular';
3 
+import { TopicPage } from './../topic/topic'
3 4
4 5 
 @Component({
5 6 
   selector: 'page-home',
 
@@ -12,7 +13,7 @@ export class HomePage {
12 13 
   }
13 14
14 15 
   topics(){
15 
-
16 
+    this.navCtrl.push(TopicPage);
16 17 
   }
17 18
18 19 
   createAnAccount(){

+ 35
- 0
src/pages/topic/topic.html View File 

@@ -0,0 +1,35 @@
1 
+<!--
2 
+  Generated template for the TopicPage page.
3 
+
4 
+  See http://ionicframework.com/docs/components/#navigation for more info on
5 
+  Ionic pages and navigation.
6 
+-->
7 
+<ion-header>
8 
+
9 
+  <ion-navbar>
10 
+    <ion-title>topic</ion-title>
11 
+  </ion-navbar>
12 
+
13 
+</ion-header>
14 
+
15 
+<ion-content padding="true" class="has-header">
16 
+  <form id="topics-form5" class="list">
17 
+    <label class="item item-input" id="topics-search1">
18 
+      <i class="icon ion-search placeholder-icon"></i>
19 
+      <input type="search" placeholder="Search for Topic">
20 
+    </label>
21 
+  </form>
22 
+  <a ui-sref="createATopic()" id="topics-button10" class="button button-positive button-block">Create a New Topic</a>
23 
+  <ion-list id="topics-list2">
24 
+    <ion-item class="item-icon-left" id="topics-list-item1">
25 
+      <i class="icon ion-ios-information"></i>Quitting Smoking</ion-item>
26 
+    <ion-item class="item-icon-left" id="topics-list-item2">
27 
+      <i class="icon ion-ios-information"></i>Quitting Drinking</ion-item>
28 
+    <ion-item class="item-icon-left" id="topics-list-item3">
29 
+      <i class="icon ion-ios-information"></i>Eating Healthier</ion-item>
30 
+    <ion-item class="item-icon-left" id="topics-list-item4">
31 
+      <i class="icon ion-ios-information"></i>Working Out</ion-item>
32 
+    <ion-item class="item-icon-left" id="topics-list-item5">
33 
+      <i class="icon ion-ios-information"></i>Public Speaking</ion-item>
34 
+  </ion-list>
35 
+</ion-content>

+ 13
- 0
src/pages/topic/topic.module.ts View File 

@@ -0,0 +1,13 @@
1 
+import { NgModule } from '@angular/core';
2 
+import { IonicPageModule } from 'ionic-angular';
3 
+import { TopicPage } from './topic';
4 
+
5 
+@NgModule({
6 
+  declarations: [
7 
+    TopicPage,
8 
+  ],
9 
+  imports: [
10 
+    IonicPageModule.forChild(TopicPage),
11 
+  ],
12 
+})
13 
+export class TopicPageModule {}

+ 3
- 0
src/pages/topic/topic.scss View File 

@@ -0,0 +1,3 @@
1 
+page-topic {
2 
+
3 
+}

+ 25
- 0
src/pages/topic/topic.ts View File 

@@ -0,0 +1,25 @@
1 
+import { Component } from '@angular/core';
2 
+import { IonicPage, NavController, NavParams } from 'ionic-angular';
3 
+
4 
+/**
5 
+ * Generated class for the TopicPage page.
6 
+ *
7 
+ * See https://ionicframework.com/docs/components/#navigation for more info on
8 
+ * Ionic pages and navigation.
9 
+ */
10 
+
11 
+@IonicPage()
12 
+@Component({
13 
+  selector: 'page-topic',
14 
+  templateUrl: 'topic.html',
15 
+})
16 
+export class TopicPage {
17 
+
18 
+  constructor(public navCtrl: NavController, public navParams: NavParams) {
19 
+  }
20 
+
21 
+  ionViewDidLoad() {
22 
+    console.log('ionViewDidLoad TopicPage');
23 
+  }
24 
+
25 
+}