From 6214eb208564a83b29245f5ebed93d1d915bc42c Mon Sep 17 00:00:00 2001 From: emilekm2142 Date: Mon, 20 Jan 2020 15:02:08 +0100 Subject: [PATCH] init --- angular.json | 2 + package-lock.json | 33 +++++++++++++++ package.json | 3 ++ src/app/app.component.css | 16 ++++++++ src/app/app.component.html | 36 ++++++++-------- src/app/app.module.ts | 41 ++++++++++++++++++- src/app/comment/comment.component.css | 0 src/app/comment/comment.component.html | 3 ++ src/app/comment/comment.component.spec.ts | 25 +++++++++++ src/app/comment/comment.component.ts | 15 +++++++ .../main-page-post.component.css | 8 ++++ .../main-page-post.component.html | 18 ++++++++ .../main-page-post.component.spec.ts | 25 +++++++++++ .../main-page-post.component.ts | 16 ++++++++ src/app/main-page/main-page.component.css | 10 +++++ src/app/main-page/main-page.component.html | 6 +++ src/app/main-page/main-page.component.spec.ts | 25 +++++++++++ src/app/main-page/main-page.component.ts | 34 +++++++++++++++ src/app/menu/menu.component.css | 0 src/app/menu/menu.component.html | 3 ++ src/app/menu/menu.component.spec.ts | 25 +++++++++++ src/app/menu/menu.component.ts | 15 +++++++ src/app/posts.service.spec.ts | 12 ++++++ src/app/posts.service.ts | 17 ++++++++ src/app/right-panel/right-panel.component.css | 3 ++ .../right-panel/right-panel.component.html | 23 +++++++++++ .../right-panel/right-panel.component.spec.ts | 25 +++++++++++ src/app/right-panel/right-panel.component.ts | 22 ++++++++++ src/app/single-post/single-post.component.css | 0 .../single-post/single-post.component.html | 3 ++ .../single-post/single-post.component.spec.ts | 25 +++++++++++ src/app/single-post/single-post.component.ts | 15 +++++++ src/index.html | 4 +- src/styles.css | 3 ++ 34 files changed, 489 insertions(+), 22 deletions(-) create mode 100644 src/app/comment/comment.component.css create mode 100644 src/app/comment/comment.component.html create mode 100644 src/app/comment/comment.component.spec.ts create mode 100644 src/app/comment/comment.component.ts create mode 100644 src/app/main-page-post/main-page-post.component.css create mode 100644 src/app/main-page-post/main-page-post.component.html create mode 100644 src/app/main-page-post/main-page-post.component.spec.ts create mode 100644 src/app/main-page-post/main-page-post.component.ts create mode 100644 src/app/main-page/main-page.component.css create mode 100644 src/app/main-page/main-page.component.html create mode 100644 src/app/main-page/main-page.component.spec.ts create mode 100644 src/app/main-page/main-page.component.ts create mode 100644 src/app/menu/menu.component.css create mode 100644 src/app/menu/menu.component.html create mode 100644 src/app/menu/menu.component.spec.ts create mode 100644 src/app/menu/menu.component.ts create mode 100644 src/app/posts.service.spec.ts create mode 100644 src/app/posts.service.ts create mode 100644 src/app/right-panel/right-panel.component.css create mode 100644 src/app/right-panel/right-panel.component.html create mode 100644 src/app/right-panel/right-panel.component.spec.ts create mode 100644 src/app/right-panel/right-panel.component.ts create mode 100644 src/app/single-post/single-post.component.css create mode 100644 src/app/single-post/single-post.component.html create mode 100644 src/app/single-post/single-post.component.spec.ts create mode 100644 src/app/single-post/single-post.component.ts diff --git a/angular.json b/angular.json index 79de9ef..a5af0e3 100644 --- a/angular.json +++ b/angular.json @@ -23,6 +23,7 @@ "src/assets" ], "styles": [ + "./node_modules/@angular/material/prebuilt-themes/indigo-pink.css", "src/styles.css" ], "scripts": [], @@ -80,6 +81,7 @@ "tsConfig": "src/tsconfig.spec.json", "karmaConfig": "src/karma.conf.js", "styles": [ + "./node_modules/@angular/material/prebuilt-themes/indigo-pink.css", "src/styles.css" ], "scripts": [], diff --git a/package-lock.json b/package-lock.json index b2264ba..51fd02f 100644 --- a/package-lock.json +++ b/package-lock.json @@ -129,6 +129,23 @@ "tslib": "1.10.0" } }, + "@angular/cdk": { + "version": "7.3.7", + "resolved": "https://registry.npmjs.org/@angular/cdk/-/cdk-7.3.7.tgz", + "integrity": "sha512-xbXxhHHKGkVuW6K7pzPmvpJXIwpl0ykBnvA2g+/7Sgy5Pd35wCC+UtHD9RYczDM/mkygNxMQtagyCErwFnDtQA==", + "requires": { + "parse5": "5.1.1", + "tslib": "1.10.0" + }, + "dependencies": { + "parse5": { + "version": "5.1.1", + "resolved": "https://registry.npmjs.org/parse5/-/parse5-5.1.1.tgz", + "integrity": "sha512-ugq4DFI0Ptb+WWjAdOK16+u/nHfiIrcE+sh8kZMaM0WllQKLI9rOUq6c2b7cwPkXdzfQESqvoqK6ug7U/Yyzug==", + "optional": true + } + } + }, "@angular/cli": { "version": "7.3.9", "resolved": "https://registry.npmjs.org/@angular/cli/-/cli-7.3.9.tgz", @@ -482,6 +499,14 @@ "integrity": "sha512-a/Bqf19+YhqACxQOkpYB0HK/zjHqDrZVUyBtdiX17njuvlWgD4wvdtdxae//ZeIVHNDJS+G5Gelbe+Yzon+VGA==", "dev": true }, + "@angular/material": { + "version": "7.3.7", + "resolved": "https://registry.npmjs.org/@angular/material/-/material-7.3.7.tgz", + "integrity": "sha512-Eq+7frkeNGkLOfEtmkmJgR+AgoWajOipXZWWfCSamNfpCcPof82DwvGOpAmgGni9FuN2XFQdqP5MoaffQzIvUA==", + "requires": { + "tslib": "1.10.0" + } + }, "@angular/platform-browser": { "version": "7.2.16", "resolved": "https://registry.npmjs.org/@angular/platform-browser/-/platform-browser-7.2.16.tgz", @@ -6545,6 +6570,14 @@ "integrity": "sha512-iyam8fBuCUpWeKPGpaNMetEocMt364qkCsfL9JuhjXX6dRnguRVOfk2GZaDpPjcOKiiXCPINZC1GczQ7iTq3Zw==", "dev": true }, + "ng-animate": { + "version": "0.3.4", + "resolved": "https://registry.npmjs.org/ng-animate/-/ng-animate-0.3.4.tgz", + "integrity": "sha512-akMSySNAAe4H7f+XhjDvRnxa1eg+6zvl0DwVFXYpFDiGClPGlC93hT1+EXq0z9rq2U8IpBFh2FkSUT/FRIeROw==", + "requires": { + "tslib": "1.10.0" + } + }, "nice-try": { "version": "1.0.5", "resolved": "https://registry.npmjs.org/nice-try/-/nice-try-1.0.5.tgz", diff --git a/package.json b/package.json index 5f08c36..567a91b 100644 --- a/package.json +++ b/package.json @@ -12,14 +12,17 @@ "private": true, "dependencies": { "@angular/animations": "~7.2.0", + "@angular/cdk": "~7.3.7", "@angular/common": "~7.2.0", "@angular/compiler": "~7.2.0", "@angular/core": "~7.2.0", "@angular/forms": "~7.2.0", + "@angular/material": "^7.3.7", "@angular/platform-browser": "~7.2.0", "@angular/platform-browser-dynamic": "~7.2.0", "@angular/router": "~7.2.0", "core-js": "^2.5.4", + "ng-animate": "^0.3.4", "rxjs": "~6.3.3", "tslib": "^1.9.0", "zone.js": "~0.8.26" diff --git a/src/app/app.component.css b/src/app/app.component.css index e69de29..d1e815d 100644 --- a/src/app/app.component.css +++ b/src/app/app.component.css @@ -0,0 +1,16 @@ +.page{ + width:90%; + max-width: 1200px; + margin:auto; + display:flex; + flex-direction: column; +} +.bottom{ + display:flex; + flex-direction: row; +} +.right{ + width:20%; + min-width:300px; +} +.left{width:100%;} diff --git a/src/app/app.component.html b/src/app/app.component.html index 5226d57..bceb110 100644 --- a/src/app/app.component.html +++ b/src/app/app.component.html @@ -1,20 +1,18 @@ - -
-

- Welcome to {{ title }}! -

- Angular Logo -
-

Here are some links to help you start:

- +
+
+

+Anonimowy mikroblog +

+
+
+
+
+ +
+
+ + +
+
+
diff --git a/src/app/app.module.ts b/src/app/app.module.ts index f657163..9b6c466 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -2,13 +2,50 @@ import { BrowserModule } from '@angular/platform-browser'; import { NgModule } from '@angular/core'; import { AppComponent } from './app.component'; +import { MainPageComponent } from './main-page/main-page.component'; +import { MainPagePostComponent } from './main-page-post/main-page-post.component'; +import { SinglePostComponent } from './single-post/single-post.component'; +import { CommentComponent } from './comment/comment.component'; +import { MenuComponent } from './menu/menu.component'; +import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; +import {RouterModule, Routes} from '@angular/router'; +import {MatButtonModule, MatCardModule, MatFormFieldModule, MatInputModule, MatRippleModule} from '@angular/material'; +import { RightPanelComponent } from './right-panel/right-panel.component'; +import {FormsModule} from '@angular/forms'; +import {HttpClientModule} from '@angular/common/http'; + +const appRoutes: Routes = [ + { path: '', component: MainPageComponent }, + {path: 'post/:id', component: SinglePostComponent}, + // { path: 'hero/:id', component: HeroDetailComponent }, + + // { path: '**', component: PageNotFoundComponent } +]; @NgModule({ declarations: [ - AppComponent + AppComponent, + MainPageComponent, + MainPagePostComponent, + SinglePostComponent, + CommentComponent, + MenuComponent, + RightPanelComponent ], imports: [ - BrowserModule + RouterModule.forRoot( + appRoutes, + {enableTracing: true} // <-- debugging purposes only + ), + BrowserModule, + BrowserAnimationsModule, + MatCardModule, + MatButtonModule, + MatRippleModule, + MatInputModule, + MatFormFieldModule, + FormsModule, + HttpClientModule, ], providers: [], bootstrap: [AppComponent] diff --git a/src/app/comment/comment.component.css b/src/app/comment/comment.component.css new file mode 100644 index 0000000..e69de29 diff --git a/src/app/comment/comment.component.html b/src/app/comment/comment.component.html new file mode 100644 index 0000000..076c1e4 --- /dev/null +++ b/src/app/comment/comment.component.html @@ -0,0 +1,3 @@ +

+ comment works! +

diff --git a/src/app/comment/comment.component.spec.ts b/src/app/comment/comment.component.spec.ts new file mode 100644 index 0000000..bcac3f2 --- /dev/null +++ b/src/app/comment/comment.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { CommentComponent } from './comment.component'; + +describe('CommentComponent', () => { + let component: CommentComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ CommentComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(CommentComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/comment/comment.component.ts b/src/app/comment/comment.component.ts new file mode 100644 index 0000000..0b10391 --- /dev/null +++ b/src/app/comment/comment.component.ts @@ -0,0 +1,15 @@ +import { Component, OnInit } from '@angular/core'; + +@Component({ + selector: 'app-comment', + templateUrl: './comment.component.html', + styleUrls: ['./comment.component.css'] +}) +export class CommentComponent implements OnInit { + + constructor() { } + + ngOnInit() { + } + +} diff --git a/src/app/main-page-post/main-page-post.component.css b/src/app/main-page-post/main-page-post.component.css new file mode 100644 index 0000000..9b2853c --- /dev/null +++ b/src/app/main-page-post/main-page-post.component.css @@ -0,0 +1,8 @@ +.example-card { + width:90%; +} + +.example-header-image { + background-image: url('https://steamcdn-a.akamaihd.net/steamcommunity/public/images/avatars/66/66e2ca8e3874a6b9518ffd7ad2c5842b51e829ee_full.jpg'); + background-size: cover; +} diff --git a/src/app/main-page-post/main-page-post.component.html b/src/app/main-page-post/main-page-post.component.html new file mode 100644 index 0000000..af56010 --- /dev/null +++ b/src/app/main-page-post/main-page-post.component.html @@ -0,0 +1,18 @@ + +
+ +
+ {{post.text | slice:0:20}}... + {{x}}, + + +

+ {{post.text}} +

+ + + + + +
+ diff --git a/src/app/main-page-post/main-page-post.component.spec.ts b/src/app/main-page-post/main-page-post.component.spec.ts new file mode 100644 index 0000000..e2f5cbd --- /dev/null +++ b/src/app/main-page-post/main-page-post.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { MainPagePostComponent } from './main-page-post.component'; + +describe('MainPagePostComponent', () => { + let component: MainPagePostComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ MainPagePostComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(MainPagePostComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/main-page-post/main-page-post.component.ts b/src/app/main-page-post/main-page-post.component.ts new file mode 100644 index 0000000..9862a59 --- /dev/null +++ b/src/app/main-page-post/main-page-post.component.ts @@ -0,0 +1,16 @@ +import {Component, Input, OnInit} from '@angular/core'; + +@Component({ + selector: 'app-main-page-post', + templateUrl: './main-page-post.component.html', + styleUrls: ['./main-page-post.component.css'] +}) +export class MainPagePostComponent implements OnInit { + @Input() post; + @Input() id; + constructor() { } + + ngOnInit() { + } + +} diff --git a/src/app/main-page/main-page.component.css b/src/app/main-page/main-page.component.css new file mode 100644 index 0000000..0d8577f --- /dev/null +++ b/src/app/main-page/main-page.component.css @@ -0,0 +1,10 @@ +.mainPage{ + display:flex; + flex-direction: column; +} +.postContainer{ + margin-bottom:2em; +} + + + diff --git a/src/app/main-page/main-page.component.html b/src/app/main-page/main-page.component.html new file mode 100644 index 0000000..9b778f0 --- /dev/null +++ b/src/app/main-page/main-page.component.html @@ -0,0 +1,6 @@ +
+
+ +
+ +
diff --git a/src/app/main-page/main-page.component.spec.ts b/src/app/main-page/main-page.component.spec.ts new file mode 100644 index 0000000..39261a3 --- /dev/null +++ b/src/app/main-page/main-page.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { MainPageComponent } from './main-page.component'; + +describe('MainPageComponent', () => { + let component: MainPageComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ MainPageComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(MainPageComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/main-page/main-page.component.ts b/src/app/main-page/main-page.component.ts new file mode 100644 index 0000000..2abd912 --- /dev/null +++ b/src/app/main-page/main-page.component.ts @@ -0,0 +1,34 @@ +import { Component, OnInit } from '@angular/core'; +import {trigger, transition, useAnimation, state, style, animate} from '@angular/animations'; +import { bounce } from 'ng-animate'; +import {PostsService} from '../posts.service'; +@Component({ + selector: 'app-main-page', + templateUrl: './main-page.component.html', + styleUrls: ['./main-page.component.css'], + animations: [ + trigger('flyInOut', [ + state('in', style({ transform: 'translateX(0)' })), + transition('void => *', [ + style({ transform: 'translateX(-100%)' }), + animate(100) + ]), + transition('* => void', [ + animate(100, style({ transform: 'translateX(100%)' })) + ]) + ]) + ], +}) +export class MainPageComponent implements OnInit { + posts; + constructor(private postService:PostsService) { + + } + + ngOnInit() { + this.postService.getPosts(0).subscribe(d=>{ + this.posts = d; + }); + } + +} diff --git a/src/app/menu/menu.component.css b/src/app/menu/menu.component.css new file mode 100644 index 0000000..e69de29 diff --git a/src/app/menu/menu.component.html b/src/app/menu/menu.component.html new file mode 100644 index 0000000..2c6c529 --- /dev/null +++ b/src/app/menu/menu.component.html @@ -0,0 +1,3 @@ +

+ menu works! +

diff --git a/src/app/menu/menu.component.spec.ts b/src/app/menu/menu.component.spec.ts new file mode 100644 index 0000000..beb2d9b --- /dev/null +++ b/src/app/menu/menu.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { MenuComponent } from './menu.component'; + +describe('MenuComponent', () => { + let component: MenuComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ MenuComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(MenuComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/menu/menu.component.ts b/src/app/menu/menu.component.ts new file mode 100644 index 0000000..af2aede --- /dev/null +++ b/src/app/menu/menu.component.ts @@ -0,0 +1,15 @@ +import { Component, OnInit } from '@angular/core'; + +@Component({ + selector: 'app-menu', + templateUrl: './menu.component.html', + styleUrls: ['./menu.component.css'] +}) +export class MenuComponent implements OnInit { + + constructor() { } + + ngOnInit() { + } + +} diff --git a/src/app/posts.service.spec.ts b/src/app/posts.service.spec.ts new file mode 100644 index 0000000..c07c92d --- /dev/null +++ b/src/app/posts.service.spec.ts @@ -0,0 +1,12 @@ +import { TestBed } from '@angular/core/testing'; + +import { PostsService } from './posts.service'; + +describe('PostsService', () => { + beforeEach(() => TestBed.configureTestingModule({})); + + it('should be created', () => { + const service: PostsService = TestBed.get(PostsService); + expect(service).toBeTruthy(); + }); +}); diff --git a/src/app/posts.service.ts b/src/app/posts.service.ts new file mode 100644 index 0000000..2f5f0ae --- /dev/null +++ b/src/app/posts.service.ts @@ -0,0 +1,17 @@ +import { Injectable } from '@angular/core'; +import {HttpClient} from '@angular/common/http'; +const BACKEND_URL = "http://localhost:8001"; +@Injectable({ + providedIn: 'root' +}) +export class PostsService { + + constructor(private http:HttpClient) { } + getPosts(page){ + return this.http.get(`${BACKEND_URL}/post?page=${page}`) + } + addNewPost(name,text){ + return this.http.post(`${BACKEND_URL}/post`, ) + } + +} diff --git a/src/app/right-panel/right-panel.component.css b/src/app/right-panel/right-panel.component.css new file mode 100644 index 0000000..d354842 --- /dev/null +++ b/src/app/right-panel/right-panel.component.css @@ -0,0 +1,3 @@ +mat-form-field{ + width:100%; +} diff --git a/src/app/right-panel/right-panel.component.html b/src/app/right-panel/right-panel.component.html new file mode 100644 index 0000000..bc3a9a9 --- /dev/null +++ b/src/app/right-panel/right-panel.component.html @@ -0,0 +1,23 @@ + + + + Add a new mikrowpis! + Down here! + + + + + + + + + +
+ {{emoji}} +
+ + + + diff --git a/src/app/right-panel/right-panel.component.spec.ts b/src/app/right-panel/right-panel.component.spec.ts new file mode 100644 index 0000000..a740c0b --- /dev/null +++ b/src/app/right-panel/right-panel.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { RightPanelComponent } from './right-panel.component'; + +describe('RightPanelComponent', () => { + let component: RightPanelComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ RightPanelComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(RightPanelComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/right-panel/right-panel.component.ts b/src/app/right-panel/right-panel.component.ts new file mode 100644 index 0000000..0d40c21 --- /dev/null +++ b/src/app/right-panel/right-panel.component.ts @@ -0,0 +1,22 @@ +import { Component, OnInit } from '@angular/core'; + +@Component({ + selector: 'app-right-panel', + templateUrl: './right-panel.component.html', + styleUrls: ['./right-panel.component.css'] +}) +export class RightPanelComponent implements OnInit { + emojis="๐Ÿ˜€ ๐Ÿ˜ ๐Ÿ˜‚ ๐Ÿคฃ ๐Ÿ˜ƒ ๐Ÿ˜„ ๐Ÿ˜… ๐Ÿ˜† ๐Ÿ˜‰ ๐Ÿ˜Š ๐Ÿ˜‹ ๐Ÿ˜Ž ๐Ÿ˜ ๐Ÿ˜˜ ๐Ÿฅฐ ๐Ÿ˜— ๐Ÿ˜™ ๐Ÿ˜š โ˜บ๏ธ ๐Ÿ™‚ ๐Ÿค— ๐Ÿคฉ ๐Ÿค” ๐Ÿคจ ๐Ÿ˜ ๐Ÿ˜‘ ๐Ÿ˜ถ ๐Ÿ™„ ๐Ÿ˜ ๐Ÿ˜ฃ ๐Ÿ˜ฅ ๐Ÿ˜ฎ ๐Ÿค ๐Ÿ˜ฏ ๐Ÿ˜ช ๐Ÿ˜ซ ๐Ÿ˜ด ๐Ÿ˜Œ ๐Ÿ˜› ๐Ÿ˜œ ๐Ÿ˜ ๐Ÿคค ๐Ÿ˜’ ๐Ÿ˜“ ๐Ÿ˜” ๐Ÿ˜• ๐Ÿ™ƒ ๐Ÿค‘ ๐Ÿ˜ฒ โ˜น๏ธ ๐Ÿ™ ๐Ÿ˜– ๐Ÿ˜ž ๐Ÿ˜Ÿ ๐Ÿ˜ค ๐Ÿ˜ข ๐Ÿ˜ญ ๐Ÿ˜ฆ ๐Ÿ˜ง ๐Ÿ˜จ ๐Ÿ˜ฉ ๐Ÿคฏ ๐Ÿ˜ฌ ๐Ÿ˜ฐ ๐Ÿ˜ฑ ๐Ÿฅต ๐Ÿฅถ ๐Ÿ˜ณ ๐Ÿคช ๐Ÿ˜ต ๐Ÿ˜ก ๐Ÿ˜  ๐Ÿคฌ ๐Ÿ˜ท ๐Ÿค’ ๐Ÿค• ๐Ÿคข ๐Ÿคฎ ๐Ÿคง ๐Ÿ˜‡ ๐Ÿค  ๐Ÿคก ๐Ÿฅณ ๐Ÿฅด ๐Ÿฅบ ๐Ÿคฅ ๐Ÿคซ ๐Ÿคญ ๐Ÿง ๐Ÿค“ ๐Ÿ˜ˆ ๐Ÿ‘ฟ ๐Ÿ‘น ๐Ÿ‘บ ๐Ÿ’€ ๐Ÿ‘ป ๐Ÿ‘ฝ ๐Ÿค– ๐Ÿ’ฉ ๐Ÿ˜บ ๐Ÿ˜ธ ๐Ÿ˜น ๐Ÿ˜ป ๐Ÿ˜ผ ๐Ÿ˜ฝ ๐Ÿ™€ ๐Ÿ˜ฟ ๐Ÿ˜พ" + emoji_list=[] + text=""; + constructor() { } + + ngOnInit() { + this.emoji_list = Array.from(this.emojis); + this.emoji_list = this.emoji_list.filter(d=>d.length>0); + } + addEmoji(emoji){ + this.text+=emoji; + } + +} diff --git a/src/app/single-post/single-post.component.css b/src/app/single-post/single-post.component.css new file mode 100644 index 0000000..e69de29 diff --git a/src/app/single-post/single-post.component.html b/src/app/single-post/single-post.component.html new file mode 100644 index 0000000..06ed54a --- /dev/null +++ b/src/app/single-post/single-post.component.html @@ -0,0 +1,3 @@ +

+ single-post works! +

diff --git a/src/app/single-post/single-post.component.spec.ts b/src/app/single-post/single-post.component.spec.ts new file mode 100644 index 0000000..a3c6236 --- /dev/null +++ b/src/app/single-post/single-post.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { SinglePostComponent } from './single-post.component'; + +describe('SinglePostComponent', () => { + let component: SinglePostComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ SinglePostComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(SinglePostComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/single-post/single-post.component.ts b/src/app/single-post/single-post.component.ts new file mode 100644 index 0000000..fdabec7 --- /dev/null +++ b/src/app/single-post/single-post.component.ts @@ -0,0 +1,15 @@ +import { Component, OnInit } from '@angular/core'; + +@Component({ + selector: 'app-single-post', + templateUrl: './single-post.component.html', + styleUrls: ['./single-post.component.css'] +}) +export class SinglePostComponent implements OnInit { + + constructor() { } + + ngOnInit() { + } + +} diff --git a/src/index.html b/src/index.html index 3faefb6..6603c21 100644 --- a/src/index.html +++ b/src/index.html @@ -7,8 +7,10 @@ + + - + diff --git a/src/styles.css b/src/styles.css index 90d4ee0..7cb65d5 100644 --- a/src/styles.css +++ b/src/styles.css @@ -1 +1,4 @@ /* You can add global styles to this file, and also import other style files */ + +html, body { height: 100%; } +body { margin: 0; font-family: Roboto, "Helvetica Neue", sans-serif; background-color: #fafafa;}