From b3c1adc07758629e3cf9a1a1ab514af194e57f85 Mon Sep 17 00:00:00 2001 From: kj1352 Date: Sat, 27 Jun 2020 13:47:41 +0530 Subject: [PATCH] Class list card integration with Home page --- .../class-card-list.component.html | 10 +- .../class-card-list.component.ts | 1 + src/app/tabs/home/home.component.html | 154 +----------------- src/app/tabs/home/home.component.scss | 20 +++ src/app/tabs/home/home.component.ts | 99 ++++++++++- src/app/welcome/welcome.component.html | 2 +- src/app/welcome/welcome.component.ts | 4 +- 7 files changed, 140 insertions(+), 150 deletions(-) diff --git a/src/app/reusable-components/class-card-list/class-card-list.component.html b/src/app/reusable-components/class-card-list/class-card-list.component.html index c5351ee..c54ae25 100644 --- a/src/app/reusable-components/class-card-list/class-card-list.component.html +++ b/src/app/reusable-components/class-card-list/class-card-list.component.html @@ -1,5 +1,7 @@ diff --git a/src/app/reusable-components/class-card-list/class-card-list.component.ts b/src/app/reusable-components/class-card-list/class-card-list.component.ts index c189ffa..595a2b0 100644 --- a/src/app/reusable-components/class-card-list/class-card-list.component.ts +++ b/src/app/reusable-components/class-card-list/class-card-list.component.ts @@ -11,6 +11,7 @@ export class ClassCardListComponent implements OnInit { constructor() { } ngOnInit(): void { + } } diff --git a/src/app/tabs/home/home.component.html b/src/app/tabs/home/home.component.html index 2cf946c..5fec398 100644 --- a/src/app/tabs/home/home.component.html +++ b/src/app/tabs/home/home.component.html @@ -5,7 +5,7 @@
- +

English Class

@@ -99,149 +99,13 @@
- +
+
+
+
{{ class.date }}
+
+ +
+
diff --git a/src/app/tabs/home/home.component.scss b/src/app/tabs/home/home.component.scss index dac1a66..e34a50b 100644 --- a/src/app/tabs/home/home.component.scss +++ b/src/app/tabs/home/home.component.scss @@ -63,6 +63,8 @@ transition: width 0.5s, border-radius 0.5s; overflow: hidden; height: 30vh; + background-color: var(--dark-grey); + flex-direction: column; @media screen and (min-width: 1023px) { justify-content: space-between; @@ -73,6 +75,7 @@ width: 100%; padding: 0px 5%; z-index: 1; + flex-direction: row; } iframe { @@ -371,3 +374,20 @@ } } } + + +.card-list-holder { + width: 90%; + margin: 0 auto; + + header { + color: var(--dark-grey); + position: relative; + + h5 { + font-size: 14px; + margin-top: 30px; + font-weight: 500; + } + } +} diff --git a/src/app/tabs/home/home.component.ts b/src/app/tabs/home/home.component.ts index 9f1d05b..ee6dbce 100644 --- a/src/app/tabs/home/home.component.ts +++ b/src/app/tabs/home/home.component.ts @@ -1,6 +1,6 @@ import { Component, OnInit } from '@angular/core'; import { ScrollEvent } from 'ngx-scroll-event'; - +import * as moment from 'moment'; @Component({ selector: 'app-home', @@ -12,6 +12,103 @@ export class HomeComponent implements OnInit { showClassDetails: boolean; selectedSegment: string = 'transcript'; + studentClassList = [{ + date: moment(new Date()).format('MMM, DD 2020'), + classes: [{ + time: '10:00 AM', + duration: '45 Mins', + subject: 'Mathematics', + teacher: { + name: 'Mr Kashinath Kashyap', + profile_image: 'https://pbs.twimg.com/profile_images/3478244961/01ebfc40ecc194a2abc81e82ab877af4.jpeg' + }, + classUrl: '/video-chapter', + classId: 'topic1', + attendanceStatus: 'LATE' + }, { + time: '11:00 AM', + duration: '45 Mins', + subject: 'Physics', + teacher: { + name: 'Dr Meghana', + profile_image: 'https://pbs.twimg.com/profile_images/416884752377843712/MW2qg7-f.jpeg' + }, + classUrl: '/chapter-notes', + classId: 'topic1', + attendanceStatus: 'ABSENT' + }, { + time: '12:00 PM', + duration: '45 Mins', + subject: 'Chemistry', + teacher: { + name: 'Mr Kashinath Kashyap', + profile_image: 'https://pbs.twimg.com/profile_images/3478244961/01ebfc40ecc194a2abc81e82ab877af4.jpeg' + }, + classUrl: '/chapter-notes', + classId: 'topic1', + attendanceStatus: 'PRESENT' + }, { + time: '2:00 PM', + duration: '45 Mins', + subject: 'EVS', + teacher: { + name: 'Mr Kashinath Kashyap', + profile_image: 'https://pbs.twimg.com/profile_images/3478244961/01ebfc40ecc194a2abc81e82ab877af4.jpeg' + } + }, { + time: '3:00 PM', + duration: '45 Mins', + subject: 'Biology', + teacher: { + name: 'Dr Meghana', + profile_image: 'https://pbs.twimg.com/profile_images/416884752377843712/MW2qg7-f.jpeg' + } + }] + }, { + date: moment(new Date()).subtract(1, 'day').format('MMM, DD 2020'), + classes: [{ + time: '10:00 AM', + duration: '45 Mins', + subject: 'Mathematics', + teacher: { + name: 'Mr Kashinath Kashyap', + profile_image: 'https://pbs.twimg.com/profile_images/3478244961/01ebfc40ecc194a2abc81e82ab877af4.jpeg' + } + }, { + time: '11:00 AM', + duration: '45 Mins', + subject: 'Physics', + teacher: { + name: 'Dr Meghana', + profile_image: 'https://pbs.twimg.com/profile_images/416884752377843712/MW2qg7-f.jpeg' + } + }, { + time: '12:00 PM', + duration: '45 Mins', + subject: 'Chemistry', + teacher: { + name: 'Mr Kashinath Kashyap', + profile_image: 'https://pbs.twimg.com/profile_images/3478244961/01ebfc40ecc194a2abc81e82ab877af4.jpeg' + } + }, { + time: '2:00 PM', + duration: '45 Mins', + subject: 'EVS', + teacher: { + name: 'Mr Kashinath Kashyap', + profile_image: 'https://pbs.twimg.com/profile_images/3478244961/01ebfc40ecc194a2abc81e82ab877af4.jpeg' + } + }, { + time: '3:00 PM', + duration: '45 Mins', + subject: 'Biology', + teacher: { + name: 'Dr Meghana', + profile_image: 'https://pbs.twimg.com/profile_images/416884752377843712/MW2qg7-f.jpeg' + } + }] + }]; + constructor() { } ngOnInit(): void { diff --git a/src/app/welcome/welcome.component.html b/src/app/welcome/welcome.component.html index 125053e..ec3bed5 100644 --- a/src/app/welcome/welcome.component.html +++ b/src/app/welcome/welcome.component.html @@ -10,7 +10,7 @@
-
+
{{ class.date }}
diff --git a/src/app/welcome/welcome.component.ts b/src/app/welcome/welcome.component.ts index 5b2856b..4306d7b 100644 --- a/src/app/welcome/welcome.component.ts +++ b/src/app/welcome/welcome.component.ts @@ -7,7 +7,7 @@ import * as moment from 'moment'; styleUrls: ['./welcome.component.scss'] }) export class WelcomeComponent implements OnInit { - classList = [{ + studentClassList = [{ date: moment(new Date()).format('MMM, DD 2020'), classes: [{ time: '10:00 AM', @@ -93,7 +93,7 @@ export class WelcomeComponent implements OnInit { profile_image: 'https://pbs.twimg.com/profile_images/416884752377843712/MW2qg7-f.jpeg' } }] - }] + }]; constructor() { }