diff --git a/package-lock.json b/package-lock.json index 0a7fcc7..4674138 100644 --- a/package-lock.json +++ b/package-lock.json @@ -6724,6 +6724,14 @@ "os-tmpdir": "^1.0.0" } }, + "owl.carousel": { + "version": "2.3.4", + "resolved": "https://registry.npmjs.org/owl.carousel/-/owl.carousel-2.3.4.tgz", + "integrity": "sha512-JaDss9+feAvEW8KZppPSpllfposEzQiW+Ytt/Xm5t/3CTJ7YVmkh6RkWixoA2yXk2boIwedYxOvrrppIGzru9A==", + "requires": { + "jquery": ">=1.8.3" + } + }, "p-defer": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/p-defer/-/p-defer-1.0.0.tgz", diff --git a/package.json b/package.json index 6f4ea42..e2cd2a9 100644 --- a/package.json +++ b/package.json @@ -27,6 +27,7 @@ "font-awesome": "4.7.0", "jquery": "3.3.1", "node-sass": "4.11.0", + "owl.carousel": "^2.3.4", "popper.js": "1.14.7", "rxjs": "6.3.3", "tslib": "1.9.0", diff --git a/src/app/app.module.ts b/src/app/app.module.ts index d7f3cb7..aedb086 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -16,6 +16,10 @@ import { CoursesDescriptionComponent } from './courses-description/courses-descr import { ForumComponent } from './forum/forum.component'; import { CoursePreviewComponent } from './course-preview/course-preview.component'; import { AboutComponent } from './about/about.component'; +import { CourseEnrollmentComponent } from './courses-description/course-enrollment/course-enrollment.component'; +import { CoursesAvailedComponent } from './courses-description/courses-availed/courses-availed.component'; +import { RelatedCoursesComponent } from './courses-description/related-courses/related-courses.component'; +import { CourseDetailsComponent } from './courses-description/course-details/course-details.component'; import { CategoriesComponent } from './categories/categories.component'; import { CourseCategoryComponent } from './courses/course-category/course-category.component'; import { AllCoursesComponent } from './courses/all-courses/all-courses.component'; @@ -35,6 +39,10 @@ import { AllCoursesComponent } from './courses/all-courses/all-courses.component CoursePreviewComponent, ContactComponent, AboutComponent, + CourseEnrollmentComponent, + CoursesAvailedComponent, + RelatedCoursesComponent, + CourseDetailsComponent, CategoriesComponent, CourseCategoryComponent, AllCoursesComponent, diff --git a/src/app/courses-description/course-details/course-details.component.html b/src/app/courses-description/course-details/course-details.component.html new file mode 100644 index 0000000..532cdd0 --- /dev/null +++ b/src/app/courses-description/course-details/course-details.component.html @@ -0,0 +1,26 @@ + + + + + +
+
+ Reviews about the course: +

Lorem ipsum dolor sit amet consectetur adipisicing elit. Et cum neque molestias magnam sunt. Doloremque sequi laudantium impedit, nemo eum beatae! Quo quaerat assumenda distinctio tenetur commodi quidem consequatur ducimus?Lorem ipsum dolor sit amet consectetur adipisicing elit. Sequi quaerat corporis sapiente possimus qui magni voluptatem sint ipsam, doloribus maiores explicabo earum praesentium consequatur in atque quasi odit incidunt expedita.

+
+
+
+ +
+
+ About the Instructor: +

Lorem ipsum dolor sit amet consectetur adipisicing elit. Est magni tempora eaque ratione amet cupiditate quos odit deserunt, aut natus architecto facere illum laboriosam, reiciendis enim quis earum aspernatur pariatur.

+
+
+
+ Rating of the course:
+ +
+
+ + diff --git a/src/app/courses-description/course-details/course-details.component.scss b/src/app/courses-description/course-details/course-details.component.scss new file mode 100644 index 0000000..a3ef30f --- /dev/null +++ b/src/app/courses-description/course-details/course-details.component.scss @@ -0,0 +1,17 @@ +.new{ + background-color:#bcb7b7; + border-radius: .6rem; + padding: 20px 20px 20px 20px; + margin: 10px 10px 10px 10px; +} +span{ + font-size: 1.4rem; + color: white; +} +i{ + font-size: 1.6rem; +} +img{ + border-radius: 50%; + margin:10px 20px 20px 8px; +} \ No newline at end of file diff --git a/src/app/courses-description/course-details/course-details.component.spec.ts b/src/app/courses-description/course-details/course-details.component.spec.ts new file mode 100644 index 0000000..ccb5ff5 --- /dev/null +++ b/src/app/courses-description/course-details/course-details.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { CourseDetailsComponent } from './course-details.component'; + +describe('CourseDetailsComponent', () => { + let component: CourseDetailsComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ CourseDetailsComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(CourseDetailsComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/courses-description/course-details/course-details.component.ts b/src/app/courses-description/course-details/course-details.component.ts new file mode 100644 index 0000000..2028b5a --- /dev/null +++ b/src/app/courses-description/course-details/course-details.component.ts @@ -0,0 +1,15 @@ +import { Component, OnInit } from '@angular/core'; + +@Component({ + selector: 'app-course-details', + templateUrl: './course-details.component.html', + styleUrls: ['./course-details.component.scss'] +}) +export class CourseDetailsComponent implements OnInit { + + constructor() { } + + ngOnInit() { + } + +} diff --git a/src/app/courses-description/course-enrollment/course-enrollment.component.html b/src/app/courses-description/course-enrollment/course-enrollment.component.html new file mode 100644 index 0000000..b3b6f7e --- /dev/null +++ b/src/app/courses-description/course-enrollment/course-enrollment.component.html @@ -0,0 +1,180 @@ + + + + + +
+
Learn Machine Learning by Building Projects
+
+ image +
+
    + + + + + + + + + + + + + + + + + + +
+
+
+
+ +
Lorem ipsum dolor sit amet consectetur, adipisicing elit. Inventore iste explicabo praesentium, voluptatibus facilis voluptates vitae iusto sint quo saepe quisquam consequatur deleniti distinctio rem delectus aut officia. Officiis, impedit!Loremlore + Lorem ipsum dolor sit, amet consectetur adipisicing elit. Id aut at vero aperiam quod quidem, asperiores laborum, dolores error incidunt nemo earum saepe nisi dolore voluptatem ratione. Debitis, placeat animi? + ae suscipit, autem similique earum distinctio debitis error enim sed explicabo. + Facilis autem quae delectus impedit eaque deleniti.
+
Lorem ipsum dolor sit, amet consectetur adipisicing elit. Quo itaque repellat cum possimus non eveniet velit sequi voluptate quia omnis explicabo repellendus rem a quasi temporibus quibusdam, quas, nesciunt quod!Lorem + distinctio, enim perferendis nihil vitae blanditiis voluptate, non iure molestias iusto esse modi atque repellendus omnis qui velit expedita dolores excepturi! +
+
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Odio placeat corporis qui inventore iure. Vero minus iure voluptas illum labore, at mollitia eius nesciunt impedit ullam dignissimos quasi molestiae + ut deleniti, quisquam quos ipsum voluptatum fugiat voluptate rerum sapiente amet autem hic suscipit architecto! +
+
+
+ + diff --git a/src/app/courses-description/course-enrollment/course-enrollment.component.scss b/src/app/courses-description/course-enrollment/course-enrollment.component.scss new file mode 100644 index 0000000..ca219f6 --- /dev/null +++ b/src/app/courses-description/course-enrollment/course-enrollment.component.scss @@ -0,0 +1,43 @@ +.course_head{ + margin-bottom: 20px; +} +span{ + color: chocolate; + font-size: 1.6rem; +} +.course_data{ + display: inline-flex; + margin-bottom: 15px; +} +.course_img{ + width: 45%; + height: 25%; +} +.but{ + padding: 80px 20px 80px 20px; + justify-content: space-between; + +} +button{ + margin-bottom:16px; + padding: 6px 6px 6px 6px; + width: 260px; + height: 50px; + border-radius: .6em; +} +.but_list{ + list-style:none; + padding-left: 40px; + padding-right: 40px; + margin-bottom: 0px; +} +.course_point{ + padding: 30px 20px 20px 20px; + background-color: burlywood; + border-radius: .8rem; +} +li{ + list-style: none; + display: inline-flex; + font-size: 1.4rem; +} \ No newline at end of file diff --git a/src/app/courses-description/course-enrollment/course-enrollment.component.spec.ts b/src/app/courses-description/course-enrollment/course-enrollment.component.spec.ts new file mode 100644 index 0000000..92f919a --- /dev/null +++ b/src/app/courses-description/course-enrollment/course-enrollment.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { CourseEnrollmentComponent } from './course-enrollment.component'; + +describe('CourseEnrollmentComponent', () => { + let component: CourseEnrollmentComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ CourseEnrollmentComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(CourseEnrollmentComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/courses-description/course-enrollment/course-enrollment.component.ts b/src/app/courses-description/course-enrollment/course-enrollment.component.ts new file mode 100644 index 0000000..753b1cc --- /dev/null +++ b/src/app/courses-description/course-enrollment/course-enrollment.component.ts @@ -0,0 +1,15 @@ +import { Component, OnInit } from '@angular/core'; + +@Component({ + selector: 'app-course-enrollment', + templateUrl: './course-enrollment.component.html', + styleUrls: ['./course-enrollment.component.scss'] +}) +export class CourseEnrollmentComponent implements OnInit { + + constructor() { } + + ngOnInit() { + } + +} diff --git a/src/app/courses-description/courses-availed/courses-availed.component.html b/src/app/courses-description/courses-availed/courses-availed.component.html new file mode 100644 index 0000000..6922aa4 --- /dev/null +++ b/src/app/courses-description/courses-availed/courses-availed.component.html @@ -0,0 +1,17 @@ + + + + + +
+
Availed Courses Details
+
    +
  •  Machine Learning with Python

    • +
  •  Machine Learning with R

    • +
  •  Data Science with R

    • +
  •  Big Data

    • +
  •  Python

    • +
+
+ + diff --git a/src/app/courses-description/courses-availed/courses-availed.component.scss b/src/app/courses-description/courses-availed/courses-availed.component.scss new file mode 100644 index 0000000..8620e51 --- /dev/null +++ b/src/app/courses-description/courses-availed/courses-availed.component.scss @@ -0,0 +1,18 @@ +.availed_courses{ + padding: 30px 20px 20px 20px; + background-color: burlywood; + border-radius: .8rem; + height: 760px; +} +h5{ + text-align: center; + margin-bottom: 20px; + font-size: 2rem; +} +li{ + list-style: none; +} +img{ + width: 25%; + height: 25%; +} \ No newline at end of file diff --git a/src/app/courses-description/courses-availed/courses-availed.component.spec.ts b/src/app/courses-description/courses-availed/courses-availed.component.spec.ts new file mode 100644 index 0000000..7fd00a1 --- /dev/null +++ b/src/app/courses-description/courses-availed/courses-availed.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { CoursesAvailedComponent } from './courses-availed.component'; + +describe('CoursesAvailedComponent', () => { + let component: CoursesAvailedComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ CoursesAvailedComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(CoursesAvailedComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/courses-description/courses-availed/courses-availed.component.ts b/src/app/courses-description/courses-availed/courses-availed.component.ts new file mode 100644 index 0000000..ffa6adb --- /dev/null +++ b/src/app/courses-description/courses-availed/courses-availed.component.ts @@ -0,0 +1,15 @@ +import { Component, OnInit } from '@angular/core'; + +@Component({ + selector: 'app-courses-availed', + templateUrl: './courses-availed.component.html', + styleUrls: ['./courses-availed.component.scss'] +}) +export class CoursesAvailedComponent implements OnInit { + + constructor() { } + + ngOnInit() { + } + +} diff --git a/src/app/courses-description/courses-description.component.html b/src/app/courses-description/courses-description.component.html index 4991197..2c4b455 100644 --- a/src/app/courses-description/courses-description.component.html +++ b/src/app/courses-description/courses-description.component.html @@ -1,3 +1,21 @@ -

- courses-description works! -

+ + + + + + +
+
+
+ +
+
+ +
+
+
+ + +
+ + \ No newline at end of file diff --git a/src/app/courses-description/courses-description.component.scss b/src/app/courses-description/courses-description.component.scss index e69de29..b30bf2c 100644 --- a/src/app/courses-description/courses-description.component.scss +++ b/src/app/courses-description/courses-description.component.scss @@ -0,0 +1,4 @@ +body{ + margin: 30px 30px 30px 30px; + padding: auto; +} diff --git a/src/app/courses-description/related-courses/related-courses.component.html b/src/app/courses-description/related-courses/related-courses.component.html new file mode 100644 index 0000000..83cb5ce --- /dev/null +++ b/src/app/courses-description/related-courses/related-courses.component.html @@ -0,0 +1,75 @@ + + + + + + + +

Realted Courses

+
+
+ ... +
+

A complete two week course on Data Science

+ Rating of the course:
+ +
+
+
+ ... +
+

A complete two week course on Data Science

+ Rating of the course:
+ +
+
+
+ ... +

A complete two week course on Data Science

+ Rating of the course:
+

Some quick example text to build on the card title and make up the bulk of the card's content.

+
+
+
+ ... +
+

A complete two week course on Data Science

+ Rating of the course:
+ +
+
+
+ ... +
+

A complete two week course on Data Science

+ Rating of the course:
+ +
+
+
+ ... +
+

A complete two week course on Data Science

+ Rating of the course:
+ +
+
+
+ ... +
+

A complete two week course on Data Science

+ Rating of the course:
+ +
+
+
+ + + + + + + + + + diff --git a/src/app/courses-description/related-courses/related-courses.component.scss b/src/app/courses-description/related-courses/related-courses.component.scss new file mode 100644 index 0000000..16bd72d --- /dev/null +++ b/src/app/courses-description/related-courses/related-courses.component.scss @@ -0,0 +1,5 @@ +h1{ + text-align: center; + margin-bottom: 20px; + font-size: 2.6rem; +} \ No newline at end of file diff --git a/src/app/courses-description/related-courses/related-courses.component.spec.ts b/src/app/courses-description/related-courses/related-courses.component.spec.ts new file mode 100644 index 0000000..0f1ccbb --- /dev/null +++ b/src/app/courses-description/related-courses/related-courses.component.spec.ts @@ -0,0 +1,26 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { RelatedCoursesComponent } from './related-courses.component'; + +describe('RelatedCoursesComponent', () => { + let component: RelatedCoursesComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ RelatedCoursesComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(RelatedCoursesComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); + diff --git a/src/app/courses-description/related-courses/related-courses.component.ts b/src/app/courses-description/related-courses/related-courses.component.ts new file mode 100644 index 0000000..4cebd95 --- /dev/null +++ b/src/app/courses-description/related-courses/related-courses.component.ts @@ -0,0 +1,26 @@ +import { Component, OnInit } from '@angular/core'; +import 'owl.carousel/dist/assets/owl.carousel.css'; +import 'owl.carousel'; + +@Component({ + selector: 'app-related-courses', + templateUrl: './related-courses.component.html', + styleUrls: ['./related-courses.component.scss'] +}) + +export class RelatedCoursesComponent implements OnInit { + + + constructor() + { + + } + + ngOnInit() { + + } + + + + +} diff --git a/src/assets/images/Machine_Learn.png b/src/assets/images/Machine_Learn.png new file mode 100644 index 0000000..a812639 Binary files /dev/null and b/src/assets/images/Machine_Learn.png differ diff --git a/src/assets/images/data_science.jpg b/src/assets/images/data_science.jpg new file mode 100644 index 0000000..8d21f09 Binary files /dev/null and b/src/assets/images/data_science.jpg differ diff --git a/src/assets/images/instructor b/src/assets/images/instructor new file mode 100644 index 0000000..3beac19 Binary files /dev/null and b/src/assets/images/instructor differ diff --git a/src/assets/images/java.png b/src/assets/images/java.png new file mode 100644 index 0000000..9a353af Binary files /dev/null and b/src/assets/images/java.png differ diff --git a/src/assets/images/jquery.png b/src/assets/images/jquery.png new file mode 100644 index 0000000..8bddafe Binary files /dev/null and b/src/assets/images/jquery.png differ diff --git a/src/assets/images/python.png b/src/assets/images/python.png new file mode 100644 index 0000000..644f264 Binary files /dev/null and b/src/assets/images/python.png differ