From 59fdb51857829f96128b53b2e452cef58465e2ca Mon Sep 17 00:00:00 2001 From: Dslak Date: Tue, 1 Dec 2020 20:06:42 +0100 Subject: [PATCH 01/38] add header --- src/app/app-layout/app-layout.component.html | 52 ++++++++ src/app/header/header.component.html | 17 ++- src/app/header/header.component.scss | 128 ++++++++++++++++++- src/app/header/header.component.ts | 27 +++- src/assets/images/logo.svg | 109 ++++++++++++++++ src/assets/scss/fonts.scss | 10 ++ src/assets/scss/global.scss | 8 +- src/assets/scss/main.scss | 1 + src/assets/scss/variables.scss | 17 +-- 9 files changed, 351 insertions(+), 18 deletions(-) create mode 100644 src/assets/images/logo.svg create mode 100644 src/assets/scss/fonts.scss diff --git a/src/app/app-layout/app-layout.component.html b/src/app/app-layout/app-layout.component.html index 04d51c8..4b338cb 100644 --- a/src/app/app-layout/app-layout.component.html +++ b/src/app/app-layout/app-layout.component.html @@ -1,2 +1,54 @@

app-layout works!

+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/src/app/header/header.component.html b/src/app/header/header.component.html index 3c43e57..44f716b 100644 --- a/src/app/header/header.component.html +++ b/src/app/header/header.component.html @@ -1,3 +1,18 @@ -
+
+
+ + +
+ +
diff --git a/src/app/header/header.component.scss b/src/app/header/header.component.scss index 7281308..fd99b8d 100644 --- a/src/app/header/header.component.scss +++ b/src/app/header/header.component.scss @@ -1,9 +1,131 @@ +@import "../../assets/scss/variables"; .component-header { position: fixed; + display: flex; top: 0; left: 0; - height: 5px; - width: 100%; - background: black; + height: 100vh; + width: 100vw; + background: $yellow; + transition: height .5s; + + .logo-container { + height: 200px; + width: 200px; + max-height: 50vh; + max-width: 90vw; + position: relative; + margin: auto; + padding-top: 20px; + transition: height .6s, width .6s; + z-index: 101; + + .logo { + display: flex; + height: 100%; + width: 100%; + margin: auto; + cursor: pointer; + object-fit: contain; + } + + .circles { + &:before, + &:after { + content: ' '; + position: absolute; + top: -12%; + left: -12%; + display: block; + height: 125%; + width: 125%; + background: $white-alpha; + border-radius: 5px; + z-index: -1; + opacity: .3; + transition: background .6s; + } + + &:after { + border-radius: 20px; + animation: circle2 13s linear infinite; + opacity: .4; + } + &:before { + border-radius: 20px; + animation: circle1 10s linear infinite; + } + } + } + + &.sticky { + height: 0px; + + .logo-container { + height: 80px; + width: 80px; + + .circles { + &:before, + &:after { + background: $yellow; + } + } + + &.menu-open { + height: 120px; + width: 120px; + .circles { + &:before, + &:after { + background: $white-alpha; + } + } + } + } + } + + .menu { + position: fixed; + top: 0; + left: 0; + height: 100%; + width: 100%; + background: $yellow; + border-radius: 100px; + transform: scale(0) skew(20deg, 20deg); + transition: transform .5s, border-radius .4s; + z-index: -1; + + .nav { + display: block; + text-align: center; + padding-top: 150px; + height: 100vh; + overflow: auto; + border: 1px solid red; + } + + &.open { + border-radius: 0; + transform: scale(1) skew(0deg, 0deg); + z-index: 100; + } + } + +} + + +@keyframes circle1 { + 0% { transform: translate(-5%, 8%) rotate(10deg) scale(1) skew(20deg, 20deg); } + 75% { transform: translate(10%, -5%) rotate(20deg) scale(1.1) skew(-10deg, -20deg); } + 50% { transform: translate(5%, 0%) rotate(-16deg) scale(.6) skew(-40deg, -10deg); } + 100% { transform: translate(-5%, 8%) rotate(10deg) scale(1) skew(20deg, 20deg); } +} +@keyframes circle2 { + 0% { transform: translate(10%, 5%) rotate(-30deg) scale(1) skew(20deg, 20deg); } + 50% { transform: translate(-5%, 8%) rotate(-17deg) scale(.7) skew(-10deg, -20deg); } + 75% { transform: translate(0%, -10%) rotate(10deg) scale(1.2) skew(-10deg, -50deg); } + 100% { transform: translate(10%, 5%) rotate(-30deg) scale(1) skew(20deg, 20deg); } } diff --git a/src/app/header/header.component.ts b/src/app/header/header.component.ts index 7ab4cf7..33cc14c 100644 --- a/src/app/header/header.component.ts +++ b/src/app/header/header.component.ts @@ -1,4 +1,5 @@ -import { Component, OnInit } from '@angular/core'; +import { Component, OnInit, HostListener, Inject } from '@angular/core' +import { DOCUMENT } from '@angular/common' @Component({ selector: 'app-header', @@ -7,9 +8,31 @@ import { Component, OnInit } from '@angular/core'; }) export class HeaderComponent implements OnInit { - constructor() { } + public isSticky: boolean = false + public isMenuOpen: boolean = false + + constructor(@Inject(DOCUMENT) private document: Document) { } ngOnInit(): void { } + @HostListener('window:scroll', ['$event']) + onScroll(event) { + const verticalOffset = window.pageYOffset + || document.documentElement.scrollTop + || document.body.scrollTop || 0 + + this.isSticky = this.isMenuOpen || verticalOffset > 10 + } + + toggleMenu(): void { + this.isMenuOpen = !this.isMenuOpen + if(this.isMenuOpen) { + this.isSticky = true + this.document.body.classList.add('no-scroll') + } else { + this.document.body.classList.remove('no-scroll') + } + } + } diff --git a/src/assets/images/logo.svg b/src/assets/images/logo.svg new file mode 100644 index 0000000..c1073ec --- /dev/null +++ b/src/assets/images/logo.svg @@ -0,0 +1,109 @@ + + + + + + + image/svg+xml + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/assets/scss/fonts.scss b/src/assets/scss/fonts.scss new file mode 100644 index 0000000..aba175e --- /dev/null +++ b/src/assets/scss/fonts.scss @@ -0,0 +1,10 @@ +@import url('https://fonts.googleapis.com/css2?family=Abel&display=swap'); + +.font-primary { font-family: $font-primary; } +.font-secondary { font-family: $font-secondary; } +.font-bold { font-weight: bold !important; } +.font-light { font-weight: ight !important; } + +@each $size in 8, 10, 12, 13, 14, 15, 16, 18, 20, 22, 24, 26, 28, 30, 32, 34, 36, 38, 40, 42, 46, 48, 50, 52, 54, 60, 72 { + .font-#{$size} {font-size: #{$size/16}rem !important;} +} diff --git a/src/assets/scss/global.scss b/src/assets/scss/global.scss index 5b51c54..cf6408b 100644 --- a/src/assets/scss/global.scss +++ b/src/assets/scss/global.scss @@ -1,6 +1,12 @@ - body { padding: 0; margin: 0; + height: 100%; + font-family: $font-primary; + font-size: $font-20; + + &.no-scroll { + overflow: hidden; + } } diff --git a/src/assets/scss/main.scss b/src/assets/scss/main.scss index 369a37a..a43e426 100644 --- a/src/assets/scss/main.scss +++ b/src/assets/scss/main.scss @@ -1,2 +1,3 @@ @import "./variables"; +@import "./fonts"; @import "./global"; diff --git a/src/assets/scss/variables.scss b/src/assets/scss/variables.scss index 7479928..fa4843e 100644 --- a/src/assets/scss/variables.scss +++ b/src/assets/scss/variables.scss @@ -23,23 +23,18 @@ $breadcrumb-height: 60px; // Colors $white: #fff; $black: #000; -$gray: #e8e8e8; -$gray2: #666; +$gray: #666; $light-gray: #f5f5f5; -$light-gray2: #c3c3c3; $dark-gray: #47464e; -$dark-gray2: #2c2c2c; -$gold: #f1c060; -$red: #ea2d31; -$green: #55aa2a; -$blue: #3785ff; + +$yellow: #a2dc02; $white-alpha: rgba(255, 255, 255, 0.9); -$white-alpha-light: rgba(255, 255, 255, 0.2); +$black-alpha: rgba(0, 0, 0, 0.9); // Fonts -$font-primary: 'Akzidenz'; -$font-secondary: 'Akzidenz'; +$font-primary: 'Abel'; +$font-secondary: 'Abel'; $font-icon: 'icomoon'; // Font-size variables From 6a7e506202901e550674559039c4a2a142420f74 Mon Sep 17 00:00:00 2001 From: Dslak Date: Wed, 2 Dec 2020 10:33:36 +0100 Subject: [PATCH 02/38] add styles and routing --- src/app/about/about.component.html | 1 + src/app/about/about.component.scss | 0 src/app/about/about.component.spec.ts | 25 +++++++++++++++ src/app/about/about.component.ts | 15 +++++++++ src/app/app-layout/app-layout.component.html | 2 +- src/app/app-routing.module.ts | 18 ++++++++++- src/app/app.module.ts | 16 +++++++++- .../entertainment.component.html | 1 + .../entertainment.component.scss | 0 .../entertainment.component.spec.ts | 25 +++++++++++++++ .../entertainment/entertainment.component.ts | 15 +++++++++ .../exhibitions/exhibitions.component.html | 1 + .../exhibitions/exhibitions.component.scss | 0 .../exhibitions/exhibitions.component.spec.ts | 25 +++++++++++++++ src/app/exhibitions/exhibitions.component.ts | 15 +++++++++ src/app/header/header.component.html | 11 ++++--- src/app/header/header.component.scss | 32 ++++++++++++++++--- src/app/header/header.component.ts | 9 +++++- .../installations.component.html | 1 + .../installations.component.scss | 0 .../installations.component.spec.ts | 25 +++++++++++++++ .../installations/installations.component.ts | 15 +++++++++ .../performances/performances.component.html | 1 + .../performances/performances.component.scss | 0 .../performances.component.spec.ts | 25 +++++++++++++++ .../performances/performances.component.ts | 15 +++++++++ src/app/portfolio/portfolio.component.html | 1 + src/app/portfolio/portfolio.component.scss | 0 src/app/portfolio/portfolio.component.spec.ts | 25 +++++++++++++++ src/app/portfolio/portfolio.component.ts | 15 +++++++++ src/app/workshops/workshops.component.html | 1 + src/app/workshops/workshops.component.scss | 0 src/app/workshops/workshops.component.spec.ts | 25 +++++++++++++++ src/app/workshops/workshops.component.ts | 15 +++++++++ src/assets/scss/global.scss | 1 + src/assets/scss/variables.scss | 8 ++--- 36 files changed, 368 insertions(+), 16 deletions(-) create mode 100644 src/app/about/about.component.html create mode 100644 src/app/about/about.component.scss create mode 100644 src/app/about/about.component.spec.ts create mode 100644 src/app/about/about.component.ts create mode 100644 src/app/entertainment/entertainment.component.html create mode 100644 src/app/entertainment/entertainment.component.scss create mode 100644 src/app/entertainment/entertainment.component.spec.ts create mode 100644 src/app/entertainment/entertainment.component.ts create mode 100644 src/app/exhibitions/exhibitions.component.html create mode 100644 src/app/exhibitions/exhibitions.component.scss create mode 100644 src/app/exhibitions/exhibitions.component.spec.ts create mode 100644 src/app/exhibitions/exhibitions.component.ts create mode 100644 src/app/installations/installations.component.html create mode 100644 src/app/installations/installations.component.scss create mode 100644 src/app/installations/installations.component.spec.ts create mode 100644 src/app/installations/installations.component.ts create mode 100644 src/app/performances/performances.component.html create mode 100644 src/app/performances/performances.component.scss create mode 100644 src/app/performances/performances.component.spec.ts create mode 100644 src/app/performances/performances.component.ts create mode 100644 src/app/portfolio/portfolio.component.html create mode 100644 src/app/portfolio/portfolio.component.scss create mode 100644 src/app/portfolio/portfolio.component.spec.ts create mode 100644 src/app/portfolio/portfolio.component.ts create mode 100644 src/app/workshops/workshops.component.html create mode 100644 src/app/workshops/workshops.component.scss create mode 100644 src/app/workshops/workshops.component.spec.ts create mode 100644 src/app/workshops/workshops.component.ts diff --git a/src/app/about/about.component.html b/src/app/about/about.component.html new file mode 100644 index 0000000..6094aa9 --- /dev/null +++ b/src/app/about/about.component.html @@ -0,0 +1 @@ +

about works!

diff --git a/src/app/about/about.component.scss b/src/app/about/about.component.scss new file mode 100644 index 0000000..e69de29 diff --git a/src/app/about/about.component.spec.ts b/src/app/about/about.component.spec.ts new file mode 100644 index 0000000..6b77344 --- /dev/null +++ b/src/app/about/about.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { AboutComponent } from './about.component'; + +describe('AboutComponent', () => { + let component: AboutComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ AboutComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(AboutComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/about/about.component.ts b/src/app/about/about.component.ts new file mode 100644 index 0000000..9898f7a --- /dev/null +++ b/src/app/about/about.component.ts @@ -0,0 +1,15 @@ +import { Component, OnInit } from '@angular/core'; + +@Component({ + selector: 'app-about', + templateUrl: './about.component.html', + styleUrls: ['./about.component.scss'] +}) +export class AboutComponent implements OnInit { + + constructor() { } + + ngOnInit(): void { + } + +} diff --git a/src/app/app-layout/app-layout.component.html b/src/app/app-layout/app-layout.component.html index 4b338cb..a8b3c97 100644 --- a/src/app/app-layout/app-layout.component.html +++ b/src/app/app-layout/app-layout.component.html @@ -1,5 +1,5 @@ -

app-layout works!

+


diff --git a/src/app/app-routing.module.ts b/src/app/app-routing.module.ts index 9f96b1f..c438ec1 100644 --- a/src/app/app-routing.module.ts +++ b/src/app/app-routing.module.ts @@ -1,13 +1,29 @@ import { NgModule } from '@angular/core' import { Routes, RouterModule } from '@angular/router' import { AppLayoutComponent } from './app-layout/app-layout.component' +import { AboutComponent } from './about/about.component' +import { PortfolioComponent } from './portfolio/portfolio.component' +import { ExhibitionsComponent } from './exhibitions/exhibitions.component' +import { InstallationsComponent } from './installations/installations.component' +import { EntertainmentComponent } from './entertainment/entertainment.component' +import { PerformancesComponent } from './performances/performances.component' +import { WorkshopsComponent } from './workshops/workshops.component' const routes: Routes = [ { path: '', component: AppLayoutComponent, - children: [] + children: [ + { path: '', redirectTo: '/portfolio', pathMatch: 'full' }, + { path: 'portfolio', component: PortfolioComponent }, + { path: 'about', component: AboutComponent }, + { path: 'exhibitions', component: ExhibitionsComponent }, + { path: 'installations', component: InstallationsComponent }, + { path: 'entertainment', component: EntertainmentComponent }, + { path: 'performances', component: PerformancesComponent }, + { path: 'workshops', component: WorkshopsComponent } + ] } ] diff --git a/src/app/app.module.ts b/src/app/app.module.ts index a10ec68..37e4b7f 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -5,12 +5,26 @@ import { AppRoutingModule } from './app-routing.module'; import { AppComponent } from './app.component'; import { HeaderComponent } from './header/header.component'; import { AppLayoutComponent } from './app-layout/app-layout.component'; +import { AboutComponent } from './about/about.component'; +import { PortfolioComponent } from './portfolio/portfolio.component'; +import { ExhibitionsComponent } from './exhibitions/exhibitions.component'; +import { InstallationsComponent } from './installations/installations.component'; +import { EntertainmentComponent } from './entertainment/entertainment.component'; +import { PerformancesComponent } from './performances/performances.component'; +import { WorkshopsComponent } from './workshops/workshops.component'; @NgModule({ declarations: [ AppComponent, HeaderComponent, - AppLayoutComponent + AppLayoutComponent, + AboutComponent, + PortfolioComponent, + ExhibitionsComponent, + InstallationsComponent, + EntertainmentComponent, + PerformancesComponent, + WorkshopsComponent ], imports: [ BrowserModule, diff --git a/src/app/entertainment/entertainment.component.html b/src/app/entertainment/entertainment.component.html new file mode 100644 index 0000000..64e075f --- /dev/null +++ b/src/app/entertainment/entertainment.component.html @@ -0,0 +1 @@ +

entertainment works!

diff --git a/src/app/entertainment/entertainment.component.scss b/src/app/entertainment/entertainment.component.scss new file mode 100644 index 0000000..e69de29 diff --git a/src/app/entertainment/entertainment.component.spec.ts b/src/app/entertainment/entertainment.component.spec.ts new file mode 100644 index 0000000..416bfd2 --- /dev/null +++ b/src/app/entertainment/entertainment.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { EntertainmentComponent } from './entertainment.component'; + +describe('EntertainmentComponent', () => { + let component: EntertainmentComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ EntertainmentComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(EntertainmentComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/entertainment/entertainment.component.ts b/src/app/entertainment/entertainment.component.ts new file mode 100644 index 0000000..c6b6381 --- /dev/null +++ b/src/app/entertainment/entertainment.component.ts @@ -0,0 +1,15 @@ +import { Component, OnInit } from '@angular/core'; + +@Component({ + selector: 'app-entertainment', + templateUrl: './entertainment.component.html', + styleUrls: ['./entertainment.component.scss'] +}) +export class EntertainmentComponent implements OnInit { + + constructor() { } + + ngOnInit(): void { + } + +} diff --git a/src/app/exhibitions/exhibitions.component.html b/src/app/exhibitions/exhibitions.component.html new file mode 100644 index 0000000..85a0021 --- /dev/null +++ b/src/app/exhibitions/exhibitions.component.html @@ -0,0 +1 @@ +

exhibitions works!

diff --git a/src/app/exhibitions/exhibitions.component.scss b/src/app/exhibitions/exhibitions.component.scss new file mode 100644 index 0000000..e69de29 diff --git a/src/app/exhibitions/exhibitions.component.spec.ts b/src/app/exhibitions/exhibitions.component.spec.ts new file mode 100644 index 0000000..c655d74 --- /dev/null +++ b/src/app/exhibitions/exhibitions.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { ExhibitionsComponent } from './exhibitions.component'; + +describe('ExhibitionsComponent', () => { + let component: ExhibitionsComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ ExhibitionsComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(ExhibitionsComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/exhibitions/exhibitions.component.ts b/src/app/exhibitions/exhibitions.component.ts new file mode 100644 index 0000000..c2c1747 --- /dev/null +++ b/src/app/exhibitions/exhibitions.component.ts @@ -0,0 +1,15 @@ +import { Component, OnInit } from '@angular/core'; + +@Component({ + selector: 'app-exhibitions', + templateUrl: './exhibitions.component.html', + styleUrls: ['./exhibitions.component.scss'] +}) +export class ExhibitionsComponent implements OnInit { + + constructor() { } + + ngOnInit(): void { + } + +} diff --git a/src/app/header/header.component.html b/src/app/header/header.component.html index 44f716b..dbba668 100644 --- a/src/app/header/header.component.html +++ b/src/app/header/header.component.html @@ -7,10 +7,13 @@ diff --git a/src/app/header/header.component.scss b/src/app/header/header.component.scss index fd99b8d..0c448c9 100644 --- a/src/app/header/header.component.scss +++ b/src/app/header/header.component.scss @@ -101,10 +101,34 @@ .nav { display: block; text-align: center; - padding-top: 150px; - height: 100vh; - overflow: auto; - border: 1px solid red; + padding-top: 180px; + height: calc(100vh - 180px); + overflow: hidden; + overflow-y: auto; + + .items { + list-style: none; + padding: 0; + margin: 0; + + .item { + padding: 0; + margin: 10px 0; + font-weight: bold; + font-size: $font-30; + color: $black; + cursor: pointer; + transition: transform .4s; + + &:hover { + transform: scale(1.4); + } + + &.active { + text-decoration: underline; + } + } + } } &.open { diff --git a/src/app/header/header.component.ts b/src/app/header/header.component.ts index 33cc14c..5776f44 100644 --- a/src/app/header/header.component.ts +++ b/src/app/header/header.component.ts @@ -1,4 +1,5 @@ import { Component, OnInit, HostListener, Inject } from '@angular/core' +import { Router, NavigationEnd } from '@angular/router' import { DOCUMENT } from '@angular/common' @Component({ @@ -11,7 +12,13 @@ export class HeaderComponent implements OnInit { public isSticky: boolean = false public isMenuOpen: boolean = false - constructor(@Inject(DOCUMENT) private document: Document) { } + constructor(@Inject(DOCUMENT) private document: Document, private router: Router) { + router.events.subscribe((val) => { + this.isMenuOpen = false + this.isSticky = true + this.document.body.classList.remove('no-scroll') + }) + } ngOnInit(): void { } diff --git a/src/app/installations/installations.component.html b/src/app/installations/installations.component.html new file mode 100644 index 0000000..c142693 --- /dev/null +++ b/src/app/installations/installations.component.html @@ -0,0 +1 @@ +

installations works!

diff --git a/src/app/installations/installations.component.scss b/src/app/installations/installations.component.scss new file mode 100644 index 0000000..e69de29 diff --git a/src/app/installations/installations.component.spec.ts b/src/app/installations/installations.component.spec.ts new file mode 100644 index 0000000..c50ae75 --- /dev/null +++ b/src/app/installations/installations.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { InstallationsComponent } from './installations.component'; + +describe('InstallationsComponent', () => { + let component: InstallationsComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ InstallationsComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(InstallationsComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/installations/installations.component.ts b/src/app/installations/installations.component.ts new file mode 100644 index 0000000..61102ea --- /dev/null +++ b/src/app/installations/installations.component.ts @@ -0,0 +1,15 @@ +import { Component, OnInit } from '@angular/core'; + +@Component({ + selector: 'app-installations', + templateUrl: './installations.component.html', + styleUrls: ['./installations.component.scss'] +}) +export class InstallationsComponent implements OnInit { + + constructor() { } + + ngOnInit(): void { + } + +} diff --git a/src/app/performances/performances.component.html b/src/app/performances/performances.component.html new file mode 100644 index 0000000..7b9658d --- /dev/null +++ b/src/app/performances/performances.component.html @@ -0,0 +1 @@ +

performances works!

diff --git a/src/app/performances/performances.component.scss b/src/app/performances/performances.component.scss new file mode 100644 index 0000000..e69de29 diff --git a/src/app/performances/performances.component.spec.ts b/src/app/performances/performances.component.spec.ts new file mode 100644 index 0000000..0ee44e3 --- /dev/null +++ b/src/app/performances/performances.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { PerformancesComponent } from './performances.component'; + +describe('PerformancesComponent', () => { + let component: PerformancesComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ PerformancesComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(PerformancesComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/performances/performances.component.ts b/src/app/performances/performances.component.ts new file mode 100644 index 0000000..97bbb04 --- /dev/null +++ b/src/app/performances/performances.component.ts @@ -0,0 +1,15 @@ +import { Component, OnInit } from '@angular/core'; + +@Component({ + selector: 'app-performances', + templateUrl: './performances.component.html', + styleUrls: ['./performances.component.scss'] +}) +export class PerformancesComponent implements OnInit { + + constructor() { } + + ngOnInit(): void { + } + +} diff --git a/src/app/portfolio/portfolio.component.html b/src/app/portfolio/portfolio.component.html new file mode 100644 index 0000000..6944f6f --- /dev/null +++ b/src/app/portfolio/portfolio.component.html @@ -0,0 +1 @@ +

portfolio works!

diff --git a/src/app/portfolio/portfolio.component.scss b/src/app/portfolio/portfolio.component.scss new file mode 100644 index 0000000..e69de29 diff --git a/src/app/portfolio/portfolio.component.spec.ts b/src/app/portfolio/portfolio.component.spec.ts new file mode 100644 index 0000000..d16d6bc --- /dev/null +++ b/src/app/portfolio/portfolio.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { PortfolioComponent } from './portfolio.component'; + +describe('PortfolioComponent', () => { + let component: PortfolioComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ PortfolioComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(PortfolioComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/portfolio/portfolio.component.ts b/src/app/portfolio/portfolio.component.ts new file mode 100644 index 0000000..f11071c --- /dev/null +++ b/src/app/portfolio/portfolio.component.ts @@ -0,0 +1,15 @@ +import { Component, OnInit } from '@angular/core'; + +@Component({ + selector: 'app-portfolio', + templateUrl: './portfolio.component.html', + styleUrls: ['./portfolio.component.scss'] +}) +export class PortfolioComponent implements OnInit { + + constructor() { } + + ngOnInit(): void { + } + +} diff --git a/src/app/workshops/workshops.component.html b/src/app/workshops/workshops.component.html new file mode 100644 index 0000000..d0e6442 --- /dev/null +++ b/src/app/workshops/workshops.component.html @@ -0,0 +1 @@ +

workshops works!

diff --git a/src/app/workshops/workshops.component.scss b/src/app/workshops/workshops.component.scss new file mode 100644 index 0000000..e69de29 diff --git a/src/app/workshops/workshops.component.spec.ts b/src/app/workshops/workshops.component.spec.ts new file mode 100644 index 0000000..46e2e57 --- /dev/null +++ b/src/app/workshops/workshops.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { WorkshopsComponent } from './workshops.component'; + +describe('WorkshopsComponent', () => { + let component: WorkshopsComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ WorkshopsComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(WorkshopsComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/workshops/workshops.component.ts b/src/app/workshops/workshops.component.ts new file mode 100644 index 0000000..af08b35 --- /dev/null +++ b/src/app/workshops/workshops.component.ts @@ -0,0 +1,15 @@ +import { Component, OnInit } from '@angular/core'; + +@Component({ + selector: 'app-workshops', + templateUrl: './workshops.component.html', + styleUrls: ['./workshops.component.scss'] +}) +export class WorkshopsComponent implements OnInit { + + constructor() { } + + ngOnInit(): void { + } + +} diff --git a/src/assets/scss/global.scss b/src/assets/scss/global.scss index cf6408b..a8e6487 100644 --- a/src/assets/scss/global.scss +++ b/src/assets/scss/global.scss @@ -5,6 +5,7 @@ body { height: 100%; font-family: $font-primary; font-size: $font-20; + color: $black; &.no-scroll { overflow: hidden; diff --git a/src/assets/scss/variables.scss b/src/assets/scss/variables.scss index fa4843e..3eab155 100644 --- a/src/assets/scss/variables.scss +++ b/src/assets/scss/variables.scss @@ -22,10 +22,10 @@ $breadcrumb-height: 60px; // Colors $white: #fff; -$black: #000; -$gray: #666; -$light-gray: #f5f5f5; -$dark-gray: #47464e; +$black: #111; +$gray: #ccc; +$light-gray: #eee; +$dark-gray: #666; $yellow: #a2dc02; From b3e0026cb2c9fc64fd6f5717facd6c772f34af1b Mon Sep 17 00:00:00 2001 From: Dslak Date: Wed, 2 Dec 2020 12:09:47 +0100 Subject: [PATCH 03/38] add about add bootstrap --- package.json | 1 + src/app/about/about.component.html | 41 ++++++++++- src/app/about/about.component.scss | 48 +++++++++++++ src/app/app-layout/app-layout.component.html | 52 -------------- src/app/app-routing.module.ts | 3 +- src/app/header/header.component.scss | 9 ++- src/app/header/header.component.ts | 4 +- src/app/portfolio/portfolio.component.html | 42 +++++++++++ src/assets/fonts/icomoon.eot | Bin 0 -> 5464 bytes src/assets/fonts/icomoon.svg | 24 +++++++ src/assets/fonts/icomoon.ttf | Bin 0 -> 5300 bytes src/assets/fonts/icomoon.woff | Bin 0 -> 5376 bytes src/assets/fonts/selection.json | 1 + src/assets/scss/icons.scss | 72 +++++++++++++++++++ src/assets/scss/main.scss | 4 ++ src/assets/scss/variables.scss | 2 +- 16 files changed, 244 insertions(+), 59 deletions(-) create mode 100644 src/assets/fonts/icomoon.eot create mode 100644 src/assets/fonts/icomoon.svg create mode 100644 src/assets/fonts/icomoon.ttf create mode 100644 src/assets/fonts/icomoon.woff create mode 100644 src/assets/fonts/selection.json create mode 100644 src/assets/scss/icons.scss diff --git a/package.json b/package.json index 5c909c1..48394a0 100644 --- a/package.json +++ b/package.json @@ -20,6 +20,7 @@ "@angular/platform-browser": "~9.1.7", "@angular/platform-browser-dynamic": "~9.1.7", "@angular/router": "~9.1.7", + "bootstrap": "^4.5.3", "rxjs": "~6.5.4", "tslib": "^1.10.0", "zone.js": "~0.10.2" diff --git a/src/app/about/about.component.html b/src/app/about/about.component.html index 6094aa9..cded0fb 100644 --- a/src/app/about/about.component.html +++ b/src/app/about/about.component.html @@ -1 +1,40 @@ -

about works!

+
+
+
+

DSLAK è un progetto che nasce nel 2010 da un'idea di Carmine De Rosa, sviluppatore ed amministratore di sistema in ambiente Unix/Linux, dopo aver completato gli studi in ambito elettronico approfondisce le proprie conoscenze informatiche presso l'Università di Salerno dove insieme ad un gruppo di appassionati di haking fonda HCSSLUG (Linux Users Group dell'Università di Salerno) e ed il relativo HackLab con il quale realizza numerosi progetti in ambito OpenSource, basati sulla ricerca e sulla sperimentazione in ambito tecnologico.

+ +

Nel 2006 si avvicina alle arti digitali e nel 2009, incuriosito dapprima dall'aspetto tecnico ma senza tralasciare quello scenico e concettuale, inizia ad approfondire le propie conoscenze nell'ambito della new-media art e delle installazioni interattive, studiando le soluzioni adottate da artisti affermati e sviluppando varie soluzioni alternative che utilizzano però un approccio più sostenibile, efficiente e soprattutto open.

+ +

Nel 2011 realizza le sue prime installazioni interattive e ad oggi è alla continua ricerca di soluzioni creative.

+ +

DSLAK ha ad oggi all'attivo numerosi progetti, come workshops sull'utilizzo di sensori e microcontrollori nel campo dell'interattività e delle arti digitali, installazioni interattive e performances live frutto della sperimentazione e della ricerca continua, oltre alle collaborazioni con diversi artisti nazionali ed internazionali.

+ + + +
+
diff --git a/src/app/about/about.component.scss b/src/app/about/about.component.scss index e69de29..198b00f 100644 --- a/src/app/about/about.component.scss +++ b/src/app/about/about.component.scss @@ -0,0 +1,48 @@ +@import "../../assets/scss/variables"; + +.component-about { + padding-top: 160px; + font-size: $font-18; + z-index: 0; + + .about-links { + color: $black; + + .link { + display: flex; + text-decoration: none; + margin: 0; + padding: 0; + line-height: 35px; + width: 200px; + transition: transform .3s; + + + .icon { + display: inline-block; + font-size: 15px; + padding: 5px; + margin: 5px; + background: $dark-gray; + border-radius: 2px; + color: $white; + height: 25px; + width: 25px; + text-align: center; + } + + .label { + display: inline-block; + color: $dark-gray; + font-size: $font-16; + padding-left: 5px; + + } + + &:hover { + transform: scale(1.1); + } + } + } + +} diff --git a/src/app/app-layout/app-layout.component.html b/src/app/app-layout/app-layout.component.html index a8b3c97..1e15754 100644 --- a/src/app/app-layout/app-layout.component.html +++ b/src/app/app-layout/app-layout.component.html @@ -1,54 +1,2 @@ -
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
diff --git a/src/app/app-routing.module.ts b/src/app/app-routing.module.ts index c438ec1..880d671 100644 --- a/src/app/app-routing.module.ts +++ b/src/app/app-routing.module.ts @@ -15,7 +15,8 @@ const routes: Routes = [ path: '', component: AppLayoutComponent, children: [ - { path: '', redirectTo: '/portfolio', pathMatch: 'full' }, + //{ path: '', redirectTo: '/portfolio', pathMatch: 'full' }, + { path: '', component: PortfolioComponent }, { path: 'portfolio', component: PortfolioComponent }, { path: 'about', component: AboutComponent }, { path: 'exhibitions', component: ExhibitionsComponent }, diff --git a/src/app/header/header.component.scss b/src/app/header/header.component.scss index 0c448c9..b4ea69a 100644 --- a/src/app/header/header.component.scss +++ b/src/app/header/header.component.scss @@ -8,7 +8,8 @@ height: 100vh; width: 100vw; background: $yellow; - transition: height .5s; + transition: height .5s, background .4s; + z-index: 100; .logo-container { height: 200px; @@ -60,7 +61,9 @@ } &.sticky { - height: 0px; + height: 100px; + background: linear-gradient(0deg, rgba(255, 255, 255, 0) 0%, + rgba(255, 255, 255, 0.8) 20%, $white 70%, $white 100%); .logo-container { height: 80px; @@ -102,7 +105,7 @@ display: block; text-align: center; padding-top: 180px; - height: calc(100vh - 180px); + height: 100vh; overflow: hidden; overflow-y: auto; diff --git a/src/app/header/header.component.ts b/src/app/header/header.component.ts index 5776f44..6c4796e 100644 --- a/src/app/header/header.component.ts +++ b/src/app/header/header.component.ts @@ -11,6 +11,7 @@ export class HeaderComponent implements OnInit { public isSticky: boolean = false public isMenuOpen: boolean = false + public isFirstScroll: boolean = true constructor(@Inject(DOCUMENT) private document: Document, private router: Router) { router.events.subscribe((val) => { @@ -29,7 +30,8 @@ export class HeaderComponent implements OnInit { || document.documentElement.scrollTop || document.body.scrollTop || 0 - this.isSticky = this.isMenuOpen || verticalOffset > 10 + this.isFirstScroll = this.router.url == '/' + this.isSticky = this.isFirstScroll ? this.isMenuOpen || verticalOffset > 10 : true } toggleMenu(): void { diff --git a/src/app/portfolio/portfolio.component.html b/src/app/portfolio/portfolio.component.html index 6944f6f..616f657 100644 --- a/src/app/portfolio/portfolio.component.html +++ b/src/app/portfolio/portfolio.component.html @@ -1 +1,43 @@

portfolio works!

+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/src/assets/fonts/icomoon.eot b/src/assets/fonts/icomoon.eot new file mode 100644 index 0000000000000000000000000000000000000000..5824380a35eafe9d20ddccab6fe2bdb7af243f82 GIT binary patch literal 5464 zcmaJ_X^b4lb*`%J>HCN&I*4{?{v-6cg*Tu~w^QCwb2I^12Fqy$Q# zK*^R2!-ykAVPZ=%Y$xy~KyVDp5rf15q`)v>I8bCcLFmY_ojCuJ02BcShGQ=Cs(W_1 zOAD##?y6T+U0tv0``&v~kJt!($3h4rf;K0NUc$6y_rA^bv~Q5wH{Sf&y=@3-=qx&c zR?rgMD`*)yXy`$73N4~1&^fe#E)6n*QuMOY%Wf<$v z>lgI%`k?kT?P+a7y$0iLoQFTah6hF%M%6d;0dRFk{8#S2_y5=VYsey|1bTJRG(sgq z!@PeD;(WPM#q=_)sF!PY+D5Bf$mKcPiaHq#*BEYgx?3<@?XF>Q&{l>%9q1cnu8WpD z@$|U6cZdw_b;qBckS$T>nOR;Y;orW+%hmGeg%M|0hGcd*BNs+f_sw)lzkRFJ>6Dn+ zQs)T1E}268STosfC!5FWf+?-e@UqO4Lvl*y8wWDOM~2POQ4_N0fueo;W%?#rE_XTs z#h7Jg8Er@VVJkr!m?J!^xDZSpRMIfj0yLzV1`Xv3sI*q_npCY$dmL9FzgIW%K{#)k zDbA=^;cB8WP4L{a!@QV`>uGhQpVx$t%qbI4s6@{uoK0RjPl0|led35 zb?n#_DNZhs!@NY~f-UQeVeM@48prPFYT0nM9Ts>zbiY6tf{QgAOJbZzWwXa8CdL_o zRouwR-9Z+5SoQTSgV2oHuoZ*Y@VbRI>_xZjtDVLL+cVZTi2Pu3VPW$3J|6jGtbeCC zQk;AI;>FeXf|)VP!7TCo3-jp$eiE~XA6j@}^^IWG!S`mE60GlTz>CENaG@&*>w5Q5 z#qjw69bU5s7{H8e-NldB>}+acN(v_qnDJJ+Z>E%J#)_57tm{T~M^Y2ICZ}z!sWTiS z8myMocP!CH%@#JeuAD|#5hj|Y<$Oo7lQUKFtBP?3{$bOeq=ClxB6G({2MLAV6CBw}f zsMTwUPAYRyWra=1!7B6shX@u}^AWjz0FedVQ#Zaeo=_>JrQ_>Zu(>QgD2KJzld1@`a|RGmhX zudhCUzy11^ZvViDrc+l!2lZ`Zky=K)zKO6F>pSe5Kp*D*qYZTM2|*ve1zjfuB_kL{ zn?-@4Q`6x>u{d2Q7K#s7N%djK3)9775sb)qIhW7v$mepY`8>(br*gUc4yegYR)?u^ zB)Qd5YVPp&wYVIM#TxN=BGGOq60vv_L^-Z~qyAtb<~UWj&9O1labi`tt%oWDTRLDQ z5CSjS!?uQE$VFpl9$iI$i2f3N5B(hd21~$f05*lR?Sr7*g(akN8kg*XU1%5D4m<;c zS;Z6B1K`6&5#RP4U^y%RrHNfIJbMc;fi9Wt*r}d-2`DsyeH#(9QX3VFFpk?EwG_~a z_JC#^Hv*pd){G(*sMc6>L;=qz)o{1KR|>v&a%`{d1ndl`nZ|zq9w{BKU9f{W)>{+) zr+bXGOY2)5>={u7AtbS^6cU89Wl<8P)xWL|4F9^U*s`dAl`i2B%gKECB|=zTmMpPS z5lvavSwddKm}P{RraJ=1g*d^{HHYW8-IBx$q_TQP68$9MIwNqU_~?^kV^5C8OPs(E zkt@Z)Ps>((YnB&v1lrOg>)RT`C4L0|u7L zMSSV?l@+tk%nXMwUaZa<@nF2TL5q?sOG4b3`o}*P#ZXA#zVHoM4+*@YI^W!6%VebA zxy~E~-cu~+(72D~&!RWcJLm)SKY-)_NtLz_L%^W#7y(ly3IWgX4AV2#u+Rd;Q5dda zp?eoWZGdt+Fo|IA+6C}rK7IiFcROi#6U@4uRvR2)z#Jdk_#Tf5mbCFZj?xCp1=IBX zO~rFI@QHG5182Hm+yW2>BuwFeuRuaF2=S82aVo@3?|6!;s<&@Ue0zN4tIehu7D61x zO@OPRXzB2;2oth(Eva~(n$UDR#E^Gdm?)yEo)!c-V_F$mfFx%vD=V`+#;aeERaJpO zW&9c|3(ef#FYSdZ=Ls?!k_2yE<`w4l_eZBjSVI#{aiZ@xyeMTXvo{_cSrYlTTj8{( zM1U?W%!P!o*t+?YX>$A<9A}z1k+4kDdZyD^{Tn<5cjAVka2%Gz_kOP1oGclU?EJ^A zl&BkF{mSYK$*>;Q#dKT<8w9v$HO8ErL_sO#oDHjWC;znXq?4B^#O1tmk`75n&+lCQ zWj10+GH>hu_P!`#j#HF>*%(K(&?NYgPPtO%AS4B=7TB@C6hd$jh&=ezz#y(i5WgFO z{yS4`+<(YX93^HmU@Bo5RYzu2NvM{>wX9Qh($P2*&T48xHLI!NrR`g{<3HGF3&`x2 zt%S_(32~`pxSn;h^}4=mtmCmHm9z$|imrQJ?P$&O=I8fatzO+kImEB~4+XsKEINWd ziC#os^5a2Jhx$6;7vo#-p3tQ@t*(XOz#K}lAOnjW5GaTkX&DIScxAB5<6zOFRvLrf zCe5;+q3iKLAvYI0fQA>#|fU_p3aU>WwPD8 zTdcVGQaSUg?0_9PFdcP@#e>D-lZR$LJyNqGsx#DD+LvfKxh z1A+-&8dT$ItmZ6{_Yw_JB5Bua=5k((QUs$KDltD|X3#bedXZs}f%@zJCwPi?xH^7Z zx$a^*{t5=sCF}*y{D`PZJzuES2Z#2Rin;!&BuvYy#zMvHP<}E$JQeHQuWDup{-0_? znRJ%0S%`ikk$CL>{=UZaBuie*_w_y2ZjWuLR=4Q-+}z}6rsn3N_I;U&OkY0<&F($; zF?)J?xK`a6>+2Kv`v&^Es!GUXN2o4-`q`T|+K=nwzd|zW%OCuA&Y^`MzjGZT=IbB| zLHrCQc+WpuK`aE-G@@P`iAsKo1S16k4ZEof|GR>_)XO2RCx=mILz}+V2kI&?dd(j} zLKe!PPs8!ZefSNMAkULGm<0Q5=sj)}xcsg_H-_pG!Ez7>ug}zfz4y@2H+%EMzO@Uq zCs01tt7o9x>6KY1KhZ0PfNOTI%t8HJuPnhC(P!wH4l6>91}#CEKzXrOW}rOLE3;6( z(kqAHFwgCkIjDcISC&uD!atwdxGkH@{|9EoEFu5^ literal 0 HcmV?d00001 diff --git a/src/assets/fonts/icomoon.svg b/src/assets/fonts/icomoon.svg new file mode 100644 index 0000000..72eb491 --- /dev/null +++ b/src/assets/fonts/icomoon.svg @@ -0,0 +1,24 @@ + + + +Generated by IcoMoon + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/src/assets/fonts/icomoon.ttf b/src/assets/fonts/icomoon.ttf new file mode 100644 index 0000000000000000000000000000000000000000..1492972c54ff9c9c8dfdaaa8b572a256ed2c6f1a GIT binary patch literal 5300 zcmaJ_X^b4lb*`%J>HCN&K>@DO)N?k*{k;)*g!iQ_iL_2ap28fZ;%qKs`_=ks_%R6%_58tlF>7WLG^tHYfU|(8_@GTxR0M)UO4}gzxl>n2;mgS z*OnG8o`*UN^0%QDmd-tSdQ$w|zX$m*q5I64#f4LeUw`^#gd#4CcW4Lyx6FGWe+=Z} zndM8DyFK*hAYTD__qo-R3+d^FmPL|3n@Z>AXz^!?N!#+Yq|>H1p=|H_{%H50*sx8v3L7p`1UWuSbt8xpr6-=wXbVWX+8BC=-a#wU%{paMi{i} zo8}ONx?}z;ci#K|`}{p*5mN%Yx@Z?dB}2o!e+}b&xl+aSGOVbVYj)a3t6a$CIopal z84TA1Zg#p`FkJ1fVR0~4hB+OW8)dGGmfU-4(%m;gM)tXrPxWL=lzC>Bmr3}yZ}4)p zJbq!!*_|Po-OkvB@zi}YozidLD0Mm|X13HhimywiP(R*Gw%f_(@w#A2Ycsqo^W?Cc zlKIBL%;?ckb9~%{DtfSJ-+GC@Nmk084g!nes8*O2v>hFQqXcVUjqt4ELa=x+NyF3% zu#i?743sNi(t5*dQnNbkNnC;YUfam~;k;?4IHO{PtBJ-gg6EzY<;7%NPpe~tye5QX zPU%&$dxm(OA9&O|xNYmhP83Hn${#LF-TK+|@#E8^IJH2I@Dh;=wyZOTwX?}<9J`~d zWy9HaSm5!<{Q_YKF4k}?iE$#8&7SD>CK-WM+{o%3B@2D5`u3JVXhv-~ieYSc-9j7A zqTBY(PUC{@85;*gemJ$TF!ej1he(*z4NGI_qd1)QWLr+r){mNGaMrttd`Vx>r9v%Isbr^lAWo9nv`RWnCLPX z-_)C$otD*bLK7X`aow3pr5I}_N;3oLR@@pCIR#_J72=JUoKzD#;3+?FewZ`PSiF{0 zLxu?700`Z|(Kwm~vjGe~9RNgqV|^3bt-$6y^utzAJo(nr2N+1nVctUy@;)Yq6~MIF z2#Xd!cEDwoIW5H31QH^0QBIXi$#8QAYxP>9lgb=YS>Z0^U=`*GH9n-xDXe>7jJL#a z1GEXsVS)u#J(Njx67cfDoNGvCDFrI=_wK<=9L+Fa0^U!9Wx$Q7WrOvY_e~2H4#uuG zdKkzN9BAJ*U!aESm&{rci1hr46Ib`W*ps8mw#VzeV-e91)tItvJ~HH#MpY$0 zG_=s^j5Fli-pbCnJCT%!(y30Iyq&6BoWdPF_UPy9^^pq3gJrzCOEANzi#v#<;P`=h zyk-yO3r$UDBwOCI>?S!U?6wU?mnr2j>cF8Dnd>MHf(^%!#vWfV;IHkqTRx*<#iV$o zmHkHa5B}_>m%`z(fq_PKH}mb!SBvLfTYCV1=d~-{!J#otr=f%@^?hTJdPcl)h_DwM zC+xdGALjm}4Rr7cK_9*c-5>-dBREEzMS-JJ)8Rs~xT{bs6d$gV>cdbMb`^_7a3YiC zTt2rWpUb7@^CUl?%H{GqpeHj`9i`5Z<5b}`CnikCiB;jY9;ys&>41|!2%>1;M`|dBTr`2^(N*;O=r7Rs(a+IuumsEo zU{grjJ_y=f*g`6&amg;&g?6Fsz%y`|RoufK03R-j__pT&%V7g3P3(f<*;{}KbjxhV zPW8h}K%pM?eMB%yeN>=f61P3-DPR(v0mC+K1U&P-8AU2kt+5`60-jN-;ckJi6#VGq z*k0QS*cnhWjs5w3QaWC{U(t4ou&@O{KCM^n*+PwbyRAiE`R+Mp2uuR z6u+`{UbA@xij5PG$WZf^J{yu0hEqbaBFjQNJZr=R8Hx}yhRd2R@I;mIKOLre4{N%v zt(__DDaP{*M+nE{Z}nD^u-O@lw?^F;>Pqp z{HZ90LIU^2Z_0W|;1$*R)?L0#M*8jR%rW3S#c~c!`dI!P`Yw74y^sC}kQ^YX()M8p z81w@pV5&qR;2EA_dd4~yT7WnT!*wil?;xlRP;Lh<5&T`d0Flhc4}ky9Bn{sMvu>x= zhCmoF#|JmQCt`vpZG0$D+TgihnSQ*fc+Mt1QLb&`Oc$J60OEjzDID+>NJxeuUs5?v zg}mu4Pf=C%)_cA0Opbl6*%ZSnr?>}@>UBIMO4+( zf*@y1Dm_rId3{ zM)Q&m*yME)EGN=ss`;{IS!+wp)Af9n5gE9u`TFT*W2v4WWvR@L=Icuh^3(r#^;LUv zAlXj-@xUo3FH?xidFK>WNww#9uKh9_F(jF{^?!R;lrYCB%0F+;BU)$*;z*}lDRYpL zf>#UtSl|jFxd=oaVrt+JH!_G1r=b7NR2%mnb`(d6*$lW!*hbZn8C4RhrEo3lRGoA* z&V;j?no!MZYIJ$~*6sNBHv0lHyJagOvwK5aDjBY4-E6(C@1E#*EJ-D;A*-V6o>x0o z^St@_{a343@1h*yH{yo^(RLOcMV~@1pfCIRAecjA9q^0sJ$PT}Qk+)TQ*dAoC0S5` zM-B)SWQ?>81arJH_~l9P=us<;A#RicqyycWQD80|$pG65Hl&f`5P;UB2jkN%2qpKr za=f=-MutmfWY9JtBAW52^_W>PHP>iN<2PwONkG*DTisYG!M99~0tG1$^UA!8gjtK{MzudKP^SPHEE)ZQiXeoCojc z=rp`qfIkO9&u>p>C#N&nZr&|c+j~v_;b&AD9#o`l(XFfAlvm&Z9 z(pui1XgRqpnK!Nya+ScT9Cp0;Bcm7&LomcHCZA+aK*HIGxJFi6yFQZ3kB;W^!-q*}ZeOhB}Cnw9Xczp8Y+?J2EdSRlJoM=^Iw3Ea8&#GEj zUK7o-i61dbkx0>4`xCQ#?z}2JHTy$?30@vn<7%wtER%N<4N)R#*K6i-UW-x$qZ%qP zKW1joHW2!mVNikj8^0%big&m=eqOl|Vmkf~2H7Q?1<(ALs7gIwsMd!^_Lqve!RaI{ z%c{mg#q3CaDnB|M>)fwuW(apP>cs`Ttu%EF{%5qh8lUCBH-hO@TnuZYsm? z%iu2cYsl-#5!Bf5ep{di zLv4v*Imm-IR_edre`x4i{dHpB+XdDWXdmzQGtlnz+bpyn@3%w1HM`&DpntC4mf(Lx zpQZoPVMXZCU?gZ0XfO5K477XwHVf@5{dNdNk=t)`(Enh+Euj|r>e-X4%d4v^=qx&k zR?#xtt7zrW;)RQ6S6AFdwT=#L2;mM|M8Axb*nBg$wY}MOf(L z=p0%=7d~?4&efGm?$YAQ;)R7vi>KTZPr5TFSNFo&s%WSG?Mv|WB~Y{CuV?{Xg8CHn Yoj^~*bH+DdZ(snd5e|Oyk$kxQf6!GLjsO4v literal 0 HcmV?d00001 diff --git a/src/assets/fonts/icomoon.woff b/src/assets/fonts/icomoon.woff new file mode 100644 index 0000000000000000000000000000000000000000..6deaa896ab58dbcb0073ddbf316b033602a6f22e GIT binary patch literal 5376 zcmaJ_X^b4lb*`%J>HCYhDF z5$Wx!dUbSFy{hkf@6G=9!Ko>P5j-|RGA*qi(EM)C!6VfMLRf&llQiie-8j9ncoEvp zLH#9~e)`wnetUWGGHv@9>U1nk!Q~5&pGAnUAi~(-xpDD#{^8ux;u(ZO7ofjQQ|#BD zfB76VLfdOlFVMvQ4fFoFl`D@y+uuQbA5EPu`oV>@(=g5qLcK&&^4Vx^W$`gs*W3a1 zjF-|_U0qyRg0@e=em+mr%d_JDUR=9;1@!!Ia~uN_!+aXQfC8|`m&xBl{dvE{|AkyE zLVf##>9V&yyAita6!X@tx6p0|67+dz+8dMcN^cdA63|EG1mtv706_@%qlG^8tTpCU6m}wV3ezVwa7n#{&`#8QP znL_PkBi?Go8z*amDXq`&vdohOIU)1)BdOuz!{+Fy2}Srw!M^z-{gSMf+HC|H10YtJ zRkQ~khN}c^V2_YjaNgfMsH9=41!zbM4LV9?P-#PO8&s`!YaExMyi+&wK`>{U3C<{6 z!Ah(?P4L{)!@L-e>PdB^pVx$d%qiV+dj9~g^L-DwM|SUezzO3}O8JAuiJL#4Jb7}G z6ebqQFGY{?cbpMeB@RAI0pk`xl>Ef5YFkzupW}g!A1Gc(FJiF7yQ9T(`0chUI;9 zxQ!lQ05i6=g&()kzO9QXDx5fAMw`jLnPRLFDU{2znM_!BBsHdMa?;isI>Rxd!D?}h zx6TE*p^NuQ3E7#5sc|_{kBAut;~RQIvy-wKjA^2yJDJQ(xm<`eV#S%hWHV~@i=2Wn zlM$lzh#XgAdm)$ay*S7j=PX`}s{uoVH2^|eI2uK>pf-TPqXU4br>v)9tLf{UgLXIy ziYHH7nt_6p9OfP5ARl0|pa7=LdQi0Zk;55QnbQJ%RUiQ(7vx0Il#ERFNVQgtwG*kM zDl6QE9IV1Pp~?reIfcy}9^ox9SclmJWr1LURgb0;?HGJ~B%3iLvzUM>@n7A6nJAiJ zz7D*f1kHdOVao>XG4HA7Zyc1}5V{!1;a_M^H?Kl3&!-mT%-79o9EkMXsZ&=EzR;D! z%I-&M-4h|v5Y>pXdp_pGK_!R15&qnyY)JFL;jN_I|Ed>msBcR*Hb)RRR zHKRxcs?|3fkdBlR(<`j zJD5xjgP)L8X7HOF%%ypAaU4%2n18uk1`e?-E)&8iq8yfSX1mLI=NKS6@H89Hv?)`E z$NXB~jT?RY-g8u{qAq{y6`sdzKotLI*Su!)3OqKBJt#xTTl#E3QW#DN$ciir(cr8R z5oCCTh%s2wbb%+TjQ@Fo&by%Ly0(6s zqHzz)UqatUZ=(;;{{WJGB$Znp3;~0lV+2eUDFj@@HB8soz(NxcM`5^uh0Yd&S^(vi zZxX@YwesM}Jp2Iow+3nWHkftV%@#O9pE(}5@f{u$ENT4{j?xCp1>5xeP1$v}@riP6 z8)rIT+v3_m?)yEo)rW+Wm+j&fJaVSR$69xjMrb2RaJpWW&A2D3yti- zZyba->k2X(kOX(L&MVB#AC69ru!bg@Vz=)%yeOqCvo{}|SrYlTn!%)|gn%wh%msv? z*u4I@X>$A<9A}z17PCy#daB)C|4TdxDfYgia2%GzcYmSVoGclk^!#V6gs2-q{mJ#` z;z2#Ai^-@EGzf6fs*gEYiGotfI;X=qNe685x(J#R=`lLeB!N0rR7LeJUy9k**5a1H= zU@e_V*J}E{v9`;SMBEy%%DV2l)e}|Mou5B+wQ}_~${~K!e<XVG!=IrKdGh8GWl zI@H$zzZlPg_bMHV)5=B&4$Pq>^9!)ZK7ss*k;*_Y$1Q$ z=F*-Nuq|&x7&!_KXv2Fj9^HIba;GWB2l8fUuxN(*Z4*4A84X(xn`KkW81;#4OcP`^ zS-5|=GqXFdWOQ|?$r4`UbN6BlFU|>;WXUN(=f}w*s0QQ!!!tNB0_XhWxNRpAwjIYO zwx9Bk9ZiWisvN;`I35d!Q)z2(nwLajPd(lh374QIoQUOgr&Jvu%<{z0HH`?nhG7xH zFxTON|5dUi$(BBp!P!i5Tsrs+-m4{bK^J3tF@CZ-%klUnE0Y0grmMGK6XH-AY~#I%gZE-|>Rv6tp94;vx?y@VV2-v5ics+NW*!Wj0im%A zAHeU#BFq58sY%RHqsPvMAxU!0tq3)?$V-Be#c3Ctcm`e}Q5dbnDd ziuCmf{EmVCj;a#!&~d7Z_x#)U-)}vvkN*nEtXKcwzq1Y%{PNZ{h?uWIRq*3ykl;J- ze=CTEpqfV18#B?G_k{eJ{0a@bX&ruF`l;9}A+9IKP;OWt5&?9+jFxl!QqI|98Js!IsVejL2HQ}6R$rlIfl_K7`f=W94HzDz(~?#T?u-JZ;X{A5oKpfJkx zWDeTz>&X&oqSwx!URzmPTSe#5X|#q`Ag!U*qf3`ApI=+e)GIY~6fL1k=rRm|4w$Eo zDyVkXukPA--_r6U7ZxwUqD!#RN6-bdh%ViAe8jfD@$iGrykGDoL)Ns td#j)+Z|y6v`Z7$j>g{L|U4ilpw4FkaLq6jvaKKjp_6Qfh{YpM5{~s*t9#sGU literal 0 HcmV?d00001 diff --git a/src/assets/fonts/selection.json b/src/assets/fonts/selection.json new file mode 100644 index 0000000..2365dd4 --- /dev/null +++ b/src/assets/fonts/selection.json @@ -0,0 +1 @@ +{"IcoMoonType":"selection","icons":[{"icon":{"paths":["M950.857 859.429v-438.857c-12 13.714-25.143 26.286-39.429 37.714-81.714 62.857-164 126.857-243.429 193.143-42.857 36-96 80-155.429 80h-1.143c-59.429 0-112.571-44-155.429-80-79.429-66.286-161.714-130.286-243.429-193.143-14.286-11.429-27.429-24-39.429-37.714v438.857c0 9.714 8.571 18.286 18.286 18.286h841.143c9.714 0 18.286-8.571 18.286-18.286zM950.857 258.857c0-14.286 3.429-39.429-18.286-39.429h-841.143c-9.714 0-18.286 8.571-18.286 18.286 0 65.143 32.571 121.714 84 162.286 76.571 60 153.143 120.571 229.143 181.143 30.286 24.571 85.143 77.143 125.143 77.143h1.143c40 0 94.857-52.571 125.143-77.143 76-60.571 152.571-121.143 229.143-181.143 37.143-29.143 84-92.571 84-141.143zM1024 237.714v621.714c0 50.286-41.143 91.429-91.429 91.429h-841.143c-50.286 0-91.429-41.143-91.429-91.429v-621.714c0-50.286 41.143-91.429 91.429-91.429h841.143c50.286 0 91.429 41.143 91.429 91.429z"],"width":1024,"attrs":[],"isMulticolor":false,"isMulticolor2":false,"tags":["envelope-o"],"defaultCode":61443,"grid":14},"attrs":[],"properties":{"name":"envelope-o","id":0,"order":47,"prevSize":28,"code":61443},"setIdx":0,"setId":0,"iconIdx":0},{"icon":{"paths":["M731.429 348.571c-21.714 9.714-44.571 16-69.143 19.429 25.143-14.857 44-38.857 53.143-66.857-23.429 13.714-49.143 24-76.571 29.143-21.714-23.429-53.143-37.714-87.429-37.714-66.286 0-120 53.714-120 120 0 9.143 0.571 18.857 2.857 27.429-100-5.143-188.571-52.571-248-125.714-10.286 17.714-16.571 38.857-16.571 60.571 0 41.714 19.429 78.286 52 100-20-0.571-38.857-6.286-57.143-14.857v1.143c0 58.286 44 106.857 98.857 117.714-10.286 2.857-18.286 4.571-29.143 4.571-7.429 0-14.857-1.143-22.286-2.286 15.429 47.429 59.429 82.286 112 83.429-41.143 32-92.571 51.429-149.143 51.429-9.714 0-19.429-0.571-28.571-1.714 53.143 33.714 116 53.714 184 53.714 220.571 0 341.714-182.857 341.714-341.714 0-5.143 0-10.286-0.571-15.429 23.429-16.571 44-37.714 60-62.286zM877.714 237.714v548.571c0 90.857-73.714 164.571-164.571 164.571h-548.571c-90.857 0-164.571-73.714-164.571-164.571v-548.571c0-90.857 73.714-164.571 164.571-164.571h548.571c90.857 0 164.571 73.714 164.571 164.571z"],"width":877.7142857142857,"attrs":[],"isMulticolor":false,"isMulticolor2":false,"tags":["twitter-square"],"defaultCode":61569,"grid":14},"attrs":[],"properties":{"name":"twitter-square","id":1,"order":31,"prevSize":28,"code":61569},"setIdx":0,"setId":0,"iconIdx":1},{"icon":{"paths":["M713.143 73.143c90.857 0 164.571 73.714 164.571 164.571v548.571c0 90.857-73.714 164.571-164.571 164.571h-107.429v-340h113.714l17.143-132.571h-130.857v-84.571c0-38.286 10.286-64 65.714-64l69.714-0.571v-118.286c-12-1.714-53.714-5.143-101.714-5.143-101.143 0-170.857 61.714-170.857 174.857v97.714h-114.286v132.571h114.286v340h-304c-90.857 0-164.571-73.714-164.571-164.571v-548.571c0-90.857 73.714-164.571 164.571-164.571h548.571z"],"width":877.7142857142857,"attrs":[],"isMulticolor":false,"isMulticolor2":false,"tags":["facebook-square"],"defaultCode":61570,"grid":14},"attrs":[],"properties":{"name":"facebook-square","id":2,"order":30,"prevSize":28,"code":61570},"setIdx":0,"setId":0,"iconIdx":2},{"icon":{"paths":["M804.571 708.571c0 20.571-9.143 60.571-17.714 79.429-12 28-44 46.286-69.714 60.571-33.714 18.286-68 29.143-106.286 29.143-53.143 0-101.143-21.714-149.714-39.429-34.857-12.571-68.571-28-100-47.429-97.143-60-214.286-177.143-274.286-274.286-19.429-31.429-34.857-65.143-47.429-100-17.714-48.571-39.429-96.571-39.429-149.714 0-38.286 10.857-72.571 29.143-106.286 14.286-25.714 32.571-57.714 60.571-69.714 18.857-8.571 58.857-17.714 79.429-17.714 4 0 8 0 12 1.714 12 4 24.571 32 30.286 43.429 18.286 32.571 36 65.714 54.857 97.714 9.143 14.857 26.286 33.143 26.286 50.857 0 34.857-103.429 85.714-103.429 116.571 0 15.429 14.286 35.429 22.286 49.143 57.714 104 129.714 176 233.714 233.714 13.714 8 33.714 22.286 49.143 22.286 30.857 0 81.714-103.429 116.571-103.429 17.714 0 36 17.143 50.857 26.286 32 18.857 65.143 36.571 97.714 54.857 11.429 5.714 39.429 18.286 43.429 30.286 1.714 4 1.714 8 1.714 12z"],"width":804.5714285714286,"attrs":[],"isMulticolor":false,"isMulticolor2":false,"tags":["phone"],"defaultCode":61589,"grid":14},"attrs":[],"properties":{"name":"phone","id":3,"order":43,"prevSize":28,"code":61589},"setIdx":0,"setId":0,"iconIdx":3},{"icon":{"paths":["M731.429 681.714c0-2.857 0-6.286-1.143-9.143-3.429-10.286-86.857-52.571-102.857-61.714-10.857-6.286-24-18.857-37.143-18.857-25.143 0-62.286 74.857-84.571 74.857-11.429 0-25.714-10.286-36-16-75.429-42.286-127.429-94.286-169.714-169.714-5.714-10.286-16-24.571-16-36 0-22.286 74.857-59.429 74.857-84.571 0-13.143-12.571-26.286-18.857-37.143-9.143-16-51.429-99.429-61.714-102.857-2.857-1.143-6.286-1.143-9.143-1.143-14.857 0-44 6.857-57.714 12.571-37.714 17.143-65.143 89.143-65.143 128.571 0 38.286 15.429 73.143 28.571 108.571 45.714 125.143 181.714 261.143 306.857 306.857 35.429 13.143 70.286 28.571 108.571 28.571 39.429 0 111.429-27.429 128.571-65.143 5.714-13.714 12.571-42.857 12.571-57.714zM877.714 237.714v548.571c0 90.857-73.714 164.571-164.571 164.571h-548.571c-90.857 0-164.571-73.714-164.571-164.571v-548.571c0-90.857 73.714-164.571 164.571-164.571h548.571c90.857 0 164.571 73.714 164.571 164.571z"],"width":877.7142857142857,"attrs":[],"isMulticolor":false,"isMulticolor2":false,"tags":["phone-square"],"defaultCode":61592,"grid":14},"attrs":[],"properties":{"name":"phone-square","id":4,"order":35,"prevSize":28,"code":61592},"setIdx":0,"setId":0,"iconIdx":4},{"icon":{"paths":["M925.714 233.143c-25.143 36.571-56.571 69.143-92.571 95.429 0.571 8 0.571 16 0.571 24 0 244-185.714 525.143-525.143 525.143-104.571 0-201.714-30.286-283.429-82.857 14.857 1.714 29.143 2.286 44.571 2.286 86.286 0 165.714-29.143 229.143-78.857-81.143-1.714-149.143-54.857-172.571-128 11.429 1.714 22.857 2.857 34.857 2.857 16.571 0 33.143-2.286 48.571-6.286-84.571-17.143-148-91.429-148-181.143v-2.286c24.571 13.714 53.143 22.286 83.429 23.429-49.714-33.143-82.286-89.714-82.286-153.714 0-34.286 9.143-65.714 25.143-93.143 90.857 112 227.429 185.143 380.571 193.143-2.857-13.714-4.571-28-4.571-42.286 0-101.714 82.286-184.571 184.571-184.571 53.143 0 101.143 22.286 134.857 58.286 41.714-8 81.714-23.429 117.143-44.571-13.714 42.857-42.857 78.857-81.143 101.714 37.143-4 73.143-14.286 106.286-28.571z"],"width":950.8571428571428,"attrs":[],"isMulticolor":false,"isMulticolor2":false,"tags":["twitter"],"defaultCode":61593,"grid":14},"attrs":[],"properties":{"name":"twitter","id":5,"order":45,"prevSize":28,"code":61593},"setIdx":0,"setId":0,"iconIdx":5},{"icon":{"paths":["M548 6.857v150.857h-89.714c-70.286 0-83.429 33.714-83.429 82.286v108h167.429l-22.286 169.143h-145.143v433.714h-174.857v-433.714h-145.714v-169.143h145.714v-124.571c0-144.571 88.571-223.429 217.714-223.429 61.714 0 114.857 4.571 130.286 6.857z"],"width":602.2582857142856,"attrs":[],"isMulticolor":false,"isMulticolor2":false,"tags":["facebook","facebook-f"],"defaultCode":61594,"grid":14},"attrs":[],"properties":{"name":"facebook, facebook-f","id":6,"order":44,"prevSize":28,"code":61594},"setIdx":0,"setId":0,"iconIdx":6},{"icon":{"paths":["M1024 405.714v453.714c0 50.286-41.143 91.429-91.429 91.429h-841.143c-50.286 0-91.429-41.143-91.429-91.429v-453.714c17.143 18.857 36.571 35.429 57.714 49.714 94.857 64.571 190.857 129.143 284 197.143 48 35.429 107.429 78.857 169.714 78.857h1.143c62.286 0 121.714-43.429 169.714-78.857 93.143-67.429 189.143-132.571 284.571-197.143 20.571-14.286 40-30.857 57.143-49.714zM1024 237.714c0 64-47.429 121.714-97.714 156.571-89.143 61.714-178.857 123.429-267.429 185.714-37.143 25.714-100 78.286-146.286 78.286h-1.143c-46.286 0-109.143-52.571-146.286-78.286-88.571-62.286-178.286-124-266.857-185.714-40.571-27.429-98.286-92-98.286-144 0-56 30.286-104 91.429-104h841.143c49.714 0 91.429 41.143 91.429 91.429z"],"width":1024,"attrs":[],"isMulticolor":false,"isMulticolor2":false,"tags":["envelope"],"defaultCode":61664,"grid":14},"attrs":[],"properties":{"name":"envelope","id":7,"order":36,"prevSize":28,"code":61664},"setIdx":0,"setId":0,"iconIdx":7},{"icon":{"paths":["M525.143 744.571v-89.714c0-18.857-5.714-28.571-16.571-28.571-6.286 0-12.571 2.857-18.857 9.143v128c6.286 6.286 12.571 9.143 18.857 9.143 10.857 0 16.571-9.143 16.571-28zM630.286 674.857h37.714v-19.429c0-19.429-6.286-29.143-18.857-29.143s-18.857 9.714-18.857 29.143v19.429zM304 522.857v40h-45.714v241.714h-42.286v-241.714h-44.571v-40h132.571zM418.857 594.857v209.714h-38.286v-22.857c-14.857 17.143-29.143 25.714-43.429 25.714-12 0-20.571-5.143-24-16-2.286-6.286-3.429-16-3.429-30.857v-165.714h37.714v154.286c0 8.571 0 13.714 0.571 14.857 0.571 5.714 3.429 8.571 8.571 8.571 8 0 15.429-5.714 24-17.714v-160h38.286zM562.857 658.286v83.429c0 18.857-1.143 33.143-4 41.714-4.571 16-14.857 24-30.286 24-13.143 0-26.286-8-38.857-23.429v20.571h-38.286v-281.714h38.286v92c12-14.857 25.143-22.857 38.857-22.857 15.429 0 25.714 8 30.286 24 2.857 8.571 4 22.286 4 42.286zM706.286 732v5.143c0 12.571-0.571 20.571-1.143 24.571-1.143 8.571-4 16-8.571 22.857-10.286 15.429-26.286 22.857-45.714 22.857-20 0-35.429-7.429-46.286-21.714-8-10.286-12-26.857-12-49.143v-73.714c0-22.286 3.429-38.286 11.429-49.143 10.857-14.286 26.286-21.714 45.714-21.714 18.857 0 34.286 7.429 44.571 21.714 8 10.857 12 26.857 12 49.143v43.429h-76v37.143c0 19.429 6.286 29.143 19.429 29.143 9.143 0 14.857-5.143 17.143-14.857 0-2.286 0.571-10.857 0.571-25.714h38.857zM448.571 261.143v89.143c0 19.429-6.286 29.143-18.286 29.143-12.571 0-18.286-9.714-18.286-29.143v-89.143c0-19.429 5.714-29.714 18.286-29.714 12 0 18.286 10.286 18.286 29.714zM753.143 668.571v0c0-49.143 0-101.143-10.857-148.571-8-33.714-35.429-58.286-68-61.714-77.714-8.571-156.571-8.571-235.429-8.571-78.286 0-157.143 0-234.857 8.571-33.143 3.429-60.571 28-68 61.714-10.857 47.429-11.429 99.429-11.429 148.571v0c0 48.571 0 100.571 11.429 148.571 7.429 33.143 34.857 57.714 67.429 61.714 78.286 8.571 157.143 8.571 235.429 8.571s157.143 0 235.429-8.571c32.571-4 60-28.571 67.429-61.714 11.429-48 11.429-100 11.429-148.571zM321.714 296.571l51.429-169.143h-42.857l-29.143 111.429-30.286-111.429h-44.571c8.571 26.286 18.286 52.571 26.857 78.857 13.714 40 22.286 69.714 26.286 90.286v114.857h42.286v-114.857zM486.857 342.857v-74.286c0-22.286-4-38.857-12-49.714-10.857-14.286-25.714-21.714-44.571-21.714-19.429 0-34.286 7.429-44.571 21.714-8 10.857-12 27.429-12 49.714v74.286c0 22.286 4 38.857 12 49.714 10.286 14.286 25.143 21.714 44.571 21.714 18.857 0 33.714-7.429 44.571-21.714 8-10.286 12-27.429 12-49.714zM590.286 411.429h38.286v-211.429h-38.286v161.714c-8.571 12-16.571 17.714-24 17.714-5.143 0-8.571-2.857-9.143-9.143-0.571-1.143-0.571-5.714-0.571-14.857v-155.429h-38.286v167.429c0 14.857 1.143 24.571 3.429 31.429 4 10.286 12.571 15.429 24.571 15.429 14.286 0 28.571-8.571 44-25.714v22.857zM877.714 237.714v548.571c0 90.857-73.714 164.571-164.571 164.571h-548.571c-90.857 0-164.571-73.714-164.571-164.571v-548.571c0-90.857 73.714-164.571 164.571-164.571h548.571c90.857 0 164.571 73.714 164.571 164.571z"],"width":877.7142857142857,"attrs":[],"isMulticolor":false,"isMulticolor2":false,"tags":["youtube-square"],"defaultCode":61798,"grid":14},"attrs":[],"properties":{"name":"youtube-square","id":8,"order":37,"prevSize":28,"code":61798},"setIdx":0,"setId":0,"iconIdx":8},{"icon":{"paths":["M554.857 710.857v120.571c0 25.714-7.429 38.286-22.286 38.286-8.571 0-17.143-4-25.714-12.571v-172c8.571-8.571 17.143-12.571 25.714-12.571 14.857 0 22.286 13.143 22.286 38.286zM748 711.429v26.286h-51.429v-26.286c0-25.714 8.571-38.857 25.714-38.857s25.714 13.143 25.714 38.857zM196 586.857h61.143v-53.714h-178.286v53.714h60v325.143h57.143v-325.143zM360.571 912h50.857v-282.286h-50.857v216c-11.429 16-22.286 24-32.571 24-6.857 0-10.857-4-12-12-0.571-1.714-0.571-8-0.571-20v-208h-50.857v223.429c0 20 1.714 33.143 4.571 41.714 4.571 14.286 16.571 21.143 33.143 21.143 18.286 0 37.714-11.429 58.286-34.857v30.857zM605.714 827.429v-112.571c0-26.286-1.143-45.143-5.143-56.571-6.286-21.143-20.571-32-40.571-32-18.857 0-36.571 10.286-53.143 30.857v-124h-50.857v378.857h50.857v-27.429c17.143 21.143 34.857 31.429 53.143 31.429 20 0 34.286-10.857 40.571-31.429 4-12 5.143-30.857 5.143-57.143zM798.857 821.714v-7.429h-52c0 20.571-0.571 32-1.143 34.857-2.857 13.714-10.286 20.571-22.857 20.571-17.714 0-26.286-13.143-26.286-39.429v-49.714h102.286v-58.857c0-30.286-5.143-52-15.429-66.286-14.857-19.429-34.857-29.143-60.571-29.143-26.286 0-46.286 9.714-61.143 29.143-10.857 14.286-16 36-16 66.286v98.857c0 30.286 5.714 52.571 16.571 66.286 14.857 19.429 34.857 29.143 61.714 29.143s48-10.286 61.714-30.286c6.286-9.143 10.857-19.429 12-30.857 1.143-5.143 1.143-16.571 1.143-33.143zM451.429 300v-120c0-26.286-7.429-39.429-24.571-39.429-16.571 0-24.571 13.143-24.571 39.429v120c0 26.286 8 40 24.571 40 17.143 0 24.571-13.714 24.571-40zM862.286 729.143c0 65.714-0.571 136-14.857 200-10.857 45.143-47.429 78.286-91.429 82.857-105.143 12-211.429 12-317.143 12s-212 0-317.143-12c-44-4.571-81.143-37.714-91.429-82.857-14.857-64-14.857-134.286-14.857-200v0c0-66.286 0.571-136 14.857-200 10.857-45.143 47.429-78.286 92-83.429 104.571-11.429 210.857-11.429 316.571-11.429s212 0 317.143 11.429c44 5.143 81.143 38.286 91.429 83.429 14.857 64 14.857 133.714 14.857 200zM292 0h58.286l-69.143 228v154.857h-57.143v-154.857c-5.143-28-16.571-68-34.857-121.143-12.571-35.429-25.143-71.429-37.143-106.857h60.571l40.571 150.286zM503.429 190.286v100c0 30.286-5.143 53.143-16 67.429-14.286 19.429-34.286 29.143-60.571 29.143-25.714 0-45.714-9.714-60-29.143-10.857-14.857-16-37.143-16-67.429v-100c0-30.286 5.143-52.571 16-66.857 14.286-19.429 34.286-29.143 60-29.143 26.286 0 46.286 9.714 60.571 29.143 10.857 14.286 16 36.571 16 66.857zM694.857 97.714v285.143h-52v-31.429c-20.571 24-40 35.429-58.857 35.429-16.571 0-28.571-6.857-33.714-21.143-2.857-8.571-4.571-22.286-4.571-42.857v-225.143h52v209.714c0 12 0 18.857 0.571 20 1.143 8 5.143 12.571 12 12.571 10.286 0 21.143-8 32.571-24.571v-217.714h52z"],"width":877.7142857142857,"attrs":[],"isMulticolor":false,"isMulticolor2":false,"tags":["youtube"],"defaultCode":61799,"grid":14},"attrs":[],"properties":{"name":"youtube","id":9,"order":42,"prevSize":28,"code":61799},"setIdx":0,"setId":0,"iconIdx":9},{"icon":{"paths":["M738.286 364.571c4-82.857-26.857-124.571-92-126.857-88-2.857-147.429 46.857-178.286 149.143 16-6.857 31.429-10.857 46.857-10.857 32 0 46.286 18.286 42.286 54.857-1.714 21.714-16 53.714-42.286 95.429-26.857 42.286-46.857 62.857-60 62.857-17.143 0-32-32-46.857-96.571-4.571-19.429-13.143-67.429-25.714-145.714-11.429-72-41.714-105.714-91.429-101.143-20.571 2.286-52.571 20.571-93.714 57.143-30.857 26.857-61.143 54.857-92.571 82.286l29.714 38.286c28.571-19.429 45.143-29.714 49.714-29.714 21.714 0 42.286 34.286 61.143 102.286 17.143 62.857 34.286 125.143 51.429 188 25.714 68 56.571 102.286 93.714 102.286 59.429 0 132.571-56 218.857-168 83.429-107.429 126.857-192 129.143-253.714zM877.714 237.714v548.571c0 90.857-73.714 164.571-164.571 164.571h-548.571c-90.857 0-164.571-73.714-164.571-164.571v-548.571c0-90.857 73.714-164.571 164.571-164.571h548.571c90.857 0 164.571 73.714 164.571 164.571z"],"width":877.7142857142857,"attrs":[],"isMulticolor":false,"isMulticolor2":false,"tags":["vimeo-square"],"defaultCode":61844,"grid":14},"attrs":[],"properties":{"name":"vimeo-square","id":10,"order":38,"prevSize":28,"code":61844},"setIdx":0,"setId":0,"iconIdx":10},{"icon":{"paths":["M332.571 747.429c0 30.857-28 37.714-53.143 37.714-24.571 0-61.143-4-61.143-36 0-31.429 30.857-36.571 56-36.571 24 0 58.286 4 58.286 34.857zM312 481.143c0 28.571-11.429 48.571-42.286 48.571-31.429 0-44-18.286-44-48s11.429-51.429 44-51.429c29.143 0 42.286 24 42.286 50.857zM406.857 438.286v-71.429c-24.571 9.143-50.857 16.571-77.143 16.571-18.857-10.857-40.571-16.571-62.857-16.571-65.143 0-116.571 48-116.571 114.286 0 35.429 23.429 84.571 58.857 96.571v1.714c-18.286 8-21.714 30.286-21.714 48.571 0 18.857 6.857 34.286 23.429 44v1.714c-38.857 12.571-64.571 37.143-64.571 79.429 0 72.571 69.143 93.143 129.714 93.143 73.143 0 128-26.857 128-107.429 0-57.143-52-74.286-99.429-82.857-16-2.857-43.429-14.286-43.429-34.286 0-18.857 10.286-26.857 28-29.714 58.286-11.429 95.429-56.571 95.429-116.571 0-10.286-2.286-20-5.714-29.714 9.143-2.286 18.857-4.571 28-7.429zM440.571 677.714h78.286c-1.143-15.429-1.143-31.429-1.143-46.857v-221.143c0-13.143 0-26.286 1.143-39.429h-78.286c1.714 13.143 1.714 27.429 1.714 40.571v224c0 14.286 0 28.571-1.714 42.857zM731.429 668.571v-69.143c-11.429 8-25.143 12-38.857 12-25.714 0-30.286-25.714-30.286-46.857v-128.571h29.714c10.286 0 20 1.143 30.286 1.143v-66.857h-60c0-19.429-1.143-38.857 1.714-58.286h-80c1.714 10.286 2.286 20.571 2.286 31.429v26.857h-34.286v66.857c6.857-0.571 13.714-1.714 21.143-1.714 4 0 8.571 0.571 13.143 0.571v1.143h-1.143v124c0 61.714 9.143 121.143 84.571 121.143 21.143 0 42.857-3.429 61.714-13.714zM528 265.143c0-26.857-20-52-48-52s-48.571 24.571-48.571 52c0 26.857 21.143 50.857 48.571 50.857s48-24.571 48-50.857zM877.714 237.714v548.571c0 90.857-73.714 164.571-164.571 164.571h-548.571c-90.857 0-164.571-73.714-164.571-164.571v-548.571c0-90.857 73.714-164.571 164.571-164.571h548.571c90.857 0 164.571 73.714 164.571 164.571z"],"width":877.7142857142857,"attrs":[],"isMulticolor":false,"isMulticolor2":false,"tags":["git-square"],"defaultCode":61906,"grid":14},"attrs":[],"properties":{"name":"git-square","id":11,"order":39,"prevSize":28,"code":61906},"setIdx":0,"setId":0,"iconIdx":11},{"icon":{"paths":["M340 865.143c0-50.286-55.429-57.143-94.286-57.143-40.571 0-90.286 8.571-90.286 59.429 0 51.429 58.857 57.714 98.286 57.714 41.714 0 86.286-10.286 86.286-60zM306.286 433.714c0-42.857-20.571-81.714-68-81.714-52.571 0-70.857 34.857-70.857 82.857 0 47.429 20.571 77.143 70.857 77.143 49.714 0 68-32 68-78.286zM460 248.571v115.429c-14.857 5.143-29.714 9.143-45.143 12.571 5.714 15.429 9.143 31.429 9.143 48 0 96.571-59.429 170.286-154.286 188-28.571 5.714-45.143 17.714-45.143 48.571 0 87.429 230.857 28 230.857 189.143 0 130.857-88.571 173.714-207.429 173.714-97.714 0-209.143-32.571-209.143-150.286 0-68.571 41.714-108 104-128.571v-2.286c-26.286-16-38.286-41.143-38.286-72 0-29.143 6.286-65.143 36-78.286v-2.286c-57.714-19.429-95.429-98.857-95.429-156.571 0-106.857 82.857-185.143 188.571-185.143 35.429 0 70.857 9.143 101.714 26.857 42.857 0 85.143-11.429 124.571-26.857zM641.714 752h-126.857c2.286-25.714 2.286-50.857 2.286-76.571v-348c0-24.571 0.571-49.143-2.286-73.143h126.857c-2.857 23.429-2.286 47.429-2.286 70.857v350.286c0 25.714 0 50.857 2.286 76.571zM985.143 625.143v112c-30.286 16.571-65.143 22.286-99.429 22.286-122.286 0-136.571-96.571-136.571-196v-200.571h1.143v-2.286c-7.429 0-14.286-1.143-21.143-1.143-11.429 0-22.857 1.714-33.714 3.429v-108.571h54.857v-43.429c0-17.143-0.571-34.286-3.429-50.857h129.714c-4.571 31.429-3.429 62.857-3.429 94.286h97.714v108.571c-16.571 0-33.143-2.286-49.143-2.286h-48.571v208.571c0 33.714 7.429 74.857 49.714 74.857 22.286 0 44-6.286 62.286-18.857zM656 84c0 42.857-33.143 82.857-77.143 82.857-45.143 0-78.857-39.429-78.857-82.857 0-44 33.143-84 78.857-84 45.143 0 77.143 41.143 77.143 84z"],"width":1024,"attrs":[],"isMulticolor":false,"isMulticolor2":false,"tags":["git"],"defaultCode":61907,"grid":14},"attrs":[],"properties":{"name":"git","id":12,"order":40,"prevSize":28,"code":61907},"setIdx":0,"setId":0,"iconIdx":12},{"icon":{"paths":["M976.571 296c-4 90.286-67.429 214.286-189.714 372-126.857 164-233.143 246.286-321.143 246.286-54.286 0-100-50.286-137.143-150.286-25.143-91.429-50.286-183.429-75.429-275.429-27.429-100-57.714-149.714-89.714-149.714-6.857 0-30.857 14.286-72.571 43.429l-44-56c45.714-40.571 90.857-81.714 136-121.143 60.571-53.714 106.857-80.571 137.714-83.429 72.571-6.857 116.571 42.286 133.714 148 17.714 114.286 30.857 185.714 37.714 213.143 21.143 94.857 43.429 142.286 68.571 142.286 19.429 0 48.571-30.286 88-92 38.857-61.714 59.429-108.571 62.286-140.571 5.143-53.143-15.429-79.429-62.286-79.429-22.286 0-45.143 5.143-69.143 14.857 45.714-149.714 133.143-222.286 262.286-218.286 95.429 2.857 140.571 65.143 134.857 186.286z"],"width":1029.12,"attrs":[],"isMulticolor":false,"isMulticolor2":false,"tags":["vimeo"],"defaultCode":62077,"grid":14},"attrs":[],"properties":{"name":"vimeo","id":13,"order":46,"prevSize":28,"code":62077},"setIdx":0,"setId":0,"iconIdx":13}],"height":1024,"metadata":{"name":"icomoon"},"preferences":{"showGlyphs":true,"showQuickUse":true,"showQuickUse2":true,"showSVGs":true,"fontPref":{"prefix":"icon-","metadata":{"fontFamily":"icomoon"},"metrics":{"emSize":1024,"baseline":6.25,"whitespace":50},"embed":false},"imagePref":{"prefix":"icon-","png":true,"useClassSelector":true,"color":0,"bgColor":16777215,"classSelector":".icon"},"historySize":50,"showCodes":true,"gridSize":16}} \ No newline at end of file diff --git a/src/assets/scss/icons.scss b/src/assets/scss/icons.scss new file mode 100644 index 0000000..7483006 --- /dev/null +++ b/src/assets/scss/icons.scss @@ -0,0 +1,72 @@ +@font-face { + font-family: 'icomoon'; + src: url('../fonts/icomoon.eot?9ti7zb'); + src: url('../fonts/icomoon.eot?9ti7zb#iefix') format('embedded-opentype'), + url('../fonts/icomoon.ttf?9ti7zb') format('truetype'), + url('../fonts/icomoon.woff?9ti7zb') format('woff'), + url('../fonts/icomoon.svg?9ti7zb#icomoon') format('svg'); + font-weight: normal; + font-style: normal; + font-display: block; +} + +[class^="icon-"], [class*=" icon-"] { + /* use !important to prevent issues with browser extensions that change fonts */ + font-family: 'icomoon' !important; + speak: never; + font-style: normal; + font-weight: normal; + font-variant: normal; + text-transform: none; + line-height: 1; + + /* Better Font Rendering =========== */ + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; +} + +.icon-envelope-o:before { + content: "\f003"; +} +.icon-twitter-square:before { + content: "\f081"; +} +.icon-facebook-square:before { + content: "\f082"; +} +.icon-phone:before { + content: "\f095"; +} +.icon-phone-square:before { + content: "\f098"; +} +.icon-twitter:before { + content: "\f099"; +} +.icon-facebook:before { + content: "\f09a"; +} +.icon-facebook-f:before { + content: "\f09a"; +} +.icon-envelope:before { + content: "\f0e0"; +} +.icon-youtube-square:before { + content: "\f166"; +} +.icon-youtube:before { + content: "\f167"; +} +.icon-vimeo-square:before { + content: "\f194"; +} +.icon-git-square:before { + content: "\f1d2"; +} +.icon-git:before { + content: "\f1d3"; +} +.icon-vimeo:before { + content: "\f27d"; +} diff --git a/src/assets/scss/main.scss b/src/assets/scss/main.scss index a43e426..faf70d3 100644 --- a/src/assets/scss/main.scss +++ b/src/assets/scss/main.scss @@ -1,3 +1,7 @@ @import "./variables"; @import "./fonts"; +@import "./icons"; @import "./global"; + + +@import "node_modules/bootstrap/scss/bootstrap-grid"; diff --git a/src/assets/scss/variables.scss b/src/assets/scss/variables.scss index 3eab155..d4114e6 100644 --- a/src/assets/scss/variables.scss +++ b/src/assets/scss/variables.scss @@ -25,7 +25,7 @@ $white: #fff; $black: #111; $gray: #ccc; $light-gray: #eee; -$dark-gray: #666; +$dark-gray: #333; $yellow: #a2dc02; From b211b61a4988ca01d18bc103d89f25f3753011e1 Mon Sep 17 00:00:00 2001 From: Dslak Date: Wed, 2 Dec 2020 13:46:40 +0100 Subject: [PATCH 04/38] add particles --- package.json | 1 + src/app/about/about.component.html | 2 +- src/app/about/about.component.scss | 82 ++++++++++-------- src/app/app-layout/app-layout.component.html | 2 + src/app/app-layout/app-layout.component.ts | 87 +++++++++++++++++++- src/app/app.module.ts | 4 +- src/app/header/header.component.scss | 11 ++- src/app/header/header.component.ts | 3 +- src/assets/scss/global.scss | 12 +++ src/assets/scss/variables.scss | 7 +- 10 files changed, 165 insertions(+), 46 deletions(-) diff --git a/package.json b/package.json index 48394a0..05dfa36 100644 --- a/package.json +++ b/package.json @@ -21,6 +21,7 @@ "@angular/platform-browser-dynamic": "~9.1.7", "@angular/router": "~9.1.7", "bootstrap": "^4.5.3", + "ng-particles": "^2.1.11", "rxjs": "~6.5.4", "tslib": "^1.10.0", "zone.js": "~0.10.2" diff --git a/src/app/about/about.component.html b/src/app/about/about.component.html index cded0fb..16f8f6c 100644 --- a/src/app/about/about.component.html +++ b/src/app/about/about.component.html @@ -1,6 +1,6 @@
-
+

DSLAK è un progetto che nasce nel 2010 da un'idea di Carmine De Rosa, sviluppatore ed amministratore di sistema in ambiente Unix/Linux, dopo aver completato gli studi in ambito elettronico approfondisce le proprie conoscenze informatiche presso l'Università di Salerno dove insieme ad un gruppo di appassionati di haking fonda HCSSLUG (Linux Users Group dell'Università di Salerno) e ed il relativo HackLab con il quale realizza numerosi progetti in ambito OpenSource, basati sulla ricerca e sulla sperimentazione in ambito tecnologico.

Nel 2006 si avvicina alle arti digitali e nel 2009, incuriosito dapprima dall'aspetto tecnico ma senza tralasciare quello scenico e concettuale, inizia ad approfondire le propie conoscenze nell'ambito della new-media art e delle installazioni interattive, studiando le soluzioni adottate da artisti affermati e sviluppando varie soluzioni alternative che utilizzano però un approccio più sostenibile, efficiente e soprattutto open.

diff --git a/src/app/about/about.component.scss b/src/app/about/about.component.scss index 198b00f..de85f7e 100644 --- a/src/app/about/about.component.scss +++ b/src/app/about/about.component.scss @@ -1,48 +1,64 @@ @import "../../assets/scss/variables"; .component-about { - padding-top: 160px; - font-size: $font-18; z-index: 0; - .about-links { + .content { + margin: 150px auto 80px auto; + padding: 40px 50px; + font-size: $font-18; + text-align: justify; + background: $white-alpha; color: $black; + box-shadow: 0px 0px 25px $white-alpha; + border-radius: 10px; - .link { - display: flex; - text-decoration: none; - margin: 0; - padding: 0; - line-height: 35px; - width: 200px; - transition: transform .3s; - - - .icon { - display: inline-block; - font-size: 15px; - padding: 5px; - margin: 5px; - background: $dark-gray; - border-radius: 2px; - color: $white; - height: 25px; - width: 25px; - text-align: center; - } + .about-links { + color: $black; - .label { - display: inline-block; - color: $dark-gray; - font-size: $font-16; - padding-left: 5px; + .link { + display: flex; + text-decoration: none; + margin: 0; + padding: 0; + line-height: 35px; + width: 200px; + transition: transform .3s; - } - &:hover { - transform: scale(1.1); + .icon { + display: inline-block; + font-size: 15px; + padding: 5px; + margin: 5px; + background: $dark-gray; + border-radius: 2px; + color: $white; + height: 25px; + width: 25px; + text-align: center; + } + + .label { + display: inline-block; + color: $dark-gray; + font-size: $font-16; + padding-left: 5px; + + } + + &:hover { + transform: scale(1.1); + } } } } +} +@media (min-width: map-get($grid-breakpoints, 'md')) { + .component-about { + .content { + transform: rotate(2deg) skew(0deg, -6deg); + } + } } diff --git a/src/app/app-layout/app-layout.component.html b/src/app/app-layout/app-layout.component.html index 1e15754..d132564 100644 --- a/src/app/app-layout/app-layout.component.html +++ b/src/app/app-layout/app-layout.component.html @@ -1,2 +1,4 @@ + + diff --git a/src/app/app-layout/app-layout.component.ts b/src/app/app-layout/app-layout.component.ts index ec8cf2b..8fea4ac 100644 --- a/src/app/app-layout/app-layout.component.ts +++ b/src/app/app-layout/app-layout.component.ts @@ -1,4 +1,5 @@ -import { Component, OnInit } from '@angular/core'; +import { Component, OnInit } from '@angular/core' +import type { Container } from 'tsparticles' @Component({ selector: 'app-app-layout', @@ -7,9 +8,93 @@ import { Component, OnInit } from '@angular/core'; }) export class AppLayoutComponent implements OnInit { + id="tsparticles" + particlesOptions = { + background: { + color: { + value: "transparent" + } + }, + fpsLimit: 60, + interactivity: { + detectsOn: "canvas", + events: { + onClick: { + enable: true, + mode: "push" + }, + onHover: { + enable: true, + mode: "repulse" + }, + resize: true + }, + modes: { + bubble: { + distance: 200, + duration: 2, + opacity: 0.8, + size: 40 + }, + push: { + quantity: 6 + }, + repulse: { + distance: 100, + duration: 0.4 + } + } + }, + particles: { + color: { + value: "#fff" + }, + links: { + color: "#fff", + distance: 150, + enable: true, + opacity: 0.7, + width: 1 + }, + collisions: { + enable: true + }, + move: { + direction: "none", + enable: true, + outMode: "bounce", + random: false, + speed: 2, + straight: false + }, + number: { + density: { + enable: true, + value_area: 600 + }, + value: 90 + }, + opacity: { + value: 0.5 + }, + shape: { + type: "circle" + }, + size: { + random: true, + value: 5 + } + }, + detectRetina: true + } + constructor() { } ngOnInit(): void { } + + particlesLoaded(container: Container): void { + console.log('particlesLoaded', container) + } } diff --git a/src/app/app.module.ts b/src/app/app.module.ts index 37e4b7f..b84bd67 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -1,5 +1,6 @@ import { BrowserModule } from '@angular/platform-browser'; import { NgModule } from '@angular/core'; +import { NgParticlesModule } from "ng-particles"; import { AppRoutingModule } from './app-routing.module'; import { AppComponent } from './app.component'; @@ -28,7 +29,8 @@ import { WorkshopsComponent } from './workshops/workshops.component'; ], imports: [ BrowserModule, - AppRoutingModule + AppRoutingModule, + NgParticlesModule ], providers: [], bootstrap: [AppComponent] diff --git a/src/app/header/header.component.scss b/src/app/header/header.component.scss index b4ea69a..72629da 100644 --- a/src/app/header/header.component.scss +++ b/src/app/header/header.component.scss @@ -7,7 +7,7 @@ left: 0; height: 100vh; width: 100vw; - background: $yellow; + background: transparent; transition: height .5s, background .4s; z-index: 100; @@ -61,9 +61,8 @@ } &.sticky { - height: 100px; - background: linear-gradient(0deg, rgba(255, 255, 255, 0) 0%, - rgba(255, 255, 255, 0.8) 20%, $white 70%, $white 100%); + height: 0; + background: transparent; .logo-container { height: 80px; @@ -72,7 +71,7 @@ .circles { &:before, &:after { - background: $yellow; + //background: $yellow; } } @@ -95,7 +94,7 @@ left: 0; height: 100%; width: 100%; - background: $yellow; + background: $yellow-alpha; border-radius: 100px; transform: scale(0) skew(20deg, 20deg); transition: transform .5s, border-radius .4s; diff --git a/src/app/header/header.component.ts b/src/app/header/header.component.ts index 6c4796e..e4c7522 100644 --- a/src/app/header/header.component.ts +++ b/src/app/header/header.component.ts @@ -16,12 +16,13 @@ export class HeaderComponent implements OnInit { constructor(@Inject(DOCUMENT) private document: Document, private router: Router) { router.events.subscribe((val) => { this.isMenuOpen = false - this.isSticky = true + //this.isSticky = true this.document.body.classList.remove('no-scroll') }) } ngOnInit(): void { + this.isSticky = this.router.url != '/' } @HostListener('window:scroll', ['$event']) diff --git a/src/assets/scss/global.scss b/src/assets/scss/global.scss index a8e6487..e028bef 100644 --- a/src/assets/scss/global.scss +++ b/src/assets/scss/global.scss @@ -11,3 +11,15 @@ body { overflow: hidden; } } + + +.particles { + position: fixed; + top: 0; + left: 0; + height: 100vh; + width: 100vw; + background: radial-gradient(circle, $white 0%, $white 80%, rgba(160, 220,0,0.1) 90%, rgba(160, 220,0,0.2) 100%); + background: $yellow; + z-index: -1; +} diff --git a/src/assets/scss/variables.scss b/src/assets/scss/variables.scss index d4114e6..a6189e7 100644 --- a/src/assets/scss/variables.scss +++ b/src/assets/scss/variables.scss @@ -22,15 +22,16 @@ $breadcrumb-height: 60px; // Colors $white: #fff; -$black: #111; +$black: #000; $gray: #ccc; $light-gray: #eee; $dark-gray: #333; $yellow: #a2dc02; -$white-alpha: rgba(255, 255, 255, 0.9); -$black-alpha: rgba(0, 0, 0, 0.9); +$white-alpha: rgba(255, 255, 255, 0.8); +$black-alpha: rgba(0, 0, 0, 0.8); +$yellow-alpha: rgba(160, 220, 0, 0.8); // Fonts $font-primary: 'Abel'; From ec2f5957e8f1ee3b88490bb0cf182248abbe8115 Mon Sep 17 00:00:00 2001 From: Dslak Date: Wed, 2 Dec 2020 13:56:29 +0100 Subject: [PATCH 05/38] enable/disable particles --- src/app/app-layout/app-layout.component.html | 2 +- src/app/app-layout/app-layout.component.ts | 6 ++++-- src/assets/scss/global.scss | 4 ++-- 3 files changed, 7 insertions(+), 5 deletions(-) diff --git a/src/app/app-layout/app-layout.component.html b/src/app/app-layout/app-layout.component.html index d132564..10a7dc1 100644 --- a/src/app/app-layout/app-layout.component.html +++ b/src/app/app-layout/app-layout.component.html @@ -1,4 +1,4 @@ - + diff --git a/src/app/app-layout/app-layout.component.ts b/src/app/app-layout/app-layout.component.ts index 8fea4ac..d041db1 100644 --- a/src/app/app-layout/app-layout.component.ts +++ b/src/app/app-layout/app-layout.component.ts @@ -8,8 +8,10 @@ import type { Container } from 'tsparticles' }) export class AppLayoutComponent implements OnInit { - id="tsparticles" - particlesOptions = { + public particlesEnabled: boolean = false + public id: string = 'tsparticles' + + public particlesOptions: any = { background: { color: { value: "transparent" diff --git a/src/assets/scss/global.scss b/src/assets/scss/global.scss index e028bef..581badd 100644 --- a/src/assets/scss/global.scss +++ b/src/assets/scss/global.scss @@ -6,6 +6,7 @@ body { font-family: $font-primary; font-size: $font-20; color: $black; + background: $yellow; &.no-scroll { overflow: hidden; @@ -19,7 +20,6 @@ body { left: 0; height: 100vh; width: 100vw; - background: radial-gradient(circle, $white 0%, $white 80%, rgba(160, 220,0,0.1) 90%, rgba(160, 220,0,0.2) 100%); - background: $yellow; + background: radial-gradient(circle, transparent 0%, transparent 85%, rgba(255,255,255,0.2) 95%, rgba(255,255,255,0.3) 100%); z-index: -1; } From aea1dc71dbe85b2bbce4df8c3806354dc35600a3 Mon Sep 17 00:00:00 2001 From: Dslak Date: Wed, 2 Dec 2020 14:55:20 +0100 Subject: [PATCH 06/38] portfolio setup and add apis service --- src/app/app.module.ts | 4 +- src/app/portfolio/portfolio.component.html | 52 ++++------------------ src/app/portfolio/portfolio.component.scss | 7 +++ src/app/portfolio/portfolio.component.ts | 15 ++++++- src/app/services/apis.service.spec.ts | 16 +++++++ src/app/services/apis.service.ts | 26 +++++++++++ src/app/services/base-service.ts | 16 +++++++ src/app/services/parse-xml.ts | 13 ++++++ src/environments/environment.prod.ts | 6 ++- src/environments/environment.ts | 17 ++----- 10 files changed, 110 insertions(+), 62 deletions(-) create mode 100644 src/app/services/apis.service.spec.ts create mode 100644 src/app/services/apis.service.ts create mode 100644 src/app/services/base-service.ts create mode 100644 src/app/services/parse-xml.ts diff --git a/src/app/app.module.ts b/src/app/app.module.ts index b84bd67..9ac77c7 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -1,5 +1,6 @@ import { BrowserModule } from '@angular/platform-browser'; import { NgModule } from '@angular/core'; +import { HttpClientModule } from '@angular/common/http'; import { NgParticlesModule } from "ng-particles"; import { AppRoutingModule } from './app-routing.module'; @@ -30,7 +31,8 @@ import { WorkshopsComponent } from './workshops/workshops.component'; imports: [ BrowserModule, AppRoutingModule, - NgParticlesModule + NgParticlesModule, + HttpClientModule ], providers: [], bootstrap: [AppComponent] diff --git a/src/app/portfolio/portfolio.component.html b/src/app/portfolio/portfolio.component.html index 616f657..24db7e7 100644 --- a/src/app/portfolio/portfolio.component.html +++ b/src/app/portfolio/portfolio.component.html @@ -1,43 +1,9 @@ -

portfolio works!

-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+ {{portfolioItems.title}} +
+
+
+
diff --git a/src/app/portfolio/portfolio.component.scss b/src/app/portfolio/portfolio.component.scss index e69de29..5ae1eae 100644 --- a/src/app/portfolio/portfolio.component.scss +++ b/src/app/portfolio/portfolio.component.scss @@ -0,0 +1,7 @@ +@import "../../assets/scss/variables"; + +.component-portfolio { + .box { + + } +} diff --git a/src/app/portfolio/portfolio.component.ts b/src/app/portfolio/portfolio.component.ts index f11071c..95cbf2b 100644 --- a/src/app/portfolio/portfolio.component.ts +++ b/src/app/portfolio/portfolio.component.ts @@ -1,4 +1,5 @@ -import { Component, OnInit } from '@angular/core'; +import { Component, OnInit } from '@angular/core' +import { ApisService } from '../services/apis.service' @Component({ selector: 'app-portfolio', @@ -7,9 +8,19 @@ import { Component, OnInit } from '@angular/core'; }) export class PortfolioComponent implements OnInit { - constructor() { } + public portfolioItems: any = [] + + constructor(private apisService: ApisService) { } ngOnInit(): void { + this.apisService.getPortfolio('portfolio').toPromise().then((response) => { + this.portfolioItems = response.items + },(error) => { + console.error('getPortfolio ERROR', error) + }).catch((e) => { + console.error('getPortfolio CATCH', e) + }) } + } diff --git a/src/app/services/apis.service.spec.ts b/src/app/services/apis.service.spec.ts new file mode 100644 index 0000000..a952a5c --- /dev/null +++ b/src/app/services/apis.service.spec.ts @@ -0,0 +1,16 @@ +import { TestBed } from '@angular/core/testing'; + +import { ApisService } from './apis.service'; + +describe('ApisService', () => { + let service: ApisService; + + beforeEach(() => { + TestBed.configureTestingModule({}); + service = TestBed.inject(ApisService); + }); + + it('should be created', () => { + expect(service).toBeTruthy(); + }); +}); diff --git a/src/app/services/apis.service.ts b/src/app/services/apis.service.ts new file mode 100644 index 0000000..48124b9 --- /dev/null +++ b/src/app/services/apis.service.ts @@ -0,0 +1,26 @@ +import { Injectable } from '@angular/core' +import { HttpClient, HttpHeaders, HttpParams, HttpRequest } from '@angular/common/http' +import { Observable, Subject, throwError } from 'rxjs' +import { catchError } from 'rxjs/operators' +import { BaseService } from './base-service' +import { environment } from '../../environments/environment' + +@Injectable({ + providedIn: 'root' +}) +export class ApisService extends BaseService { + + private restApi = `${environment.API_URL}` + + constructor(private http: HttpClient) { + super() + } + + getPortfolio(section): Observable { + let urlApi = `${this.restApi}?query=${section}` + return this.http.get(urlApi).pipe( + catchError(this.handleError) + ) + } + +} diff --git a/src/app/services/base-service.ts b/src/app/services/base-service.ts new file mode 100644 index 0000000..50813ce --- /dev/null +++ b/src/app/services/base-service.ts @@ -0,0 +1,16 @@ +import { HttpErrorResponse } from "@angular/common/http" +import { throwError } from "rxjs" +import { ParseXML } from "./parse-xml" + +export class BaseService { + + constructor() { } + + protected handleError(error: HttpErrorResponse) { + if(error.error instanceof ErrorEvent) { + console.error('An error occurred:', error.error.message) + } + + return throwError( ParseXML.getXMLResponseMessage(error.error) ) + } +} diff --git a/src/app/services/parse-xml.ts b/src/app/services/parse-xml.ts new file mode 100644 index 0000000..781bd33 --- /dev/null +++ b/src/app/services/parse-xml.ts @@ -0,0 +1,13 @@ +export class ParseXML { + constructor() {} + + public sanitize(str: string): string { + let sanitizeString = encodeURIComponent(str).replace(/%0A/g, '') + return decodeURIComponent(sanitizeString) + } + + public static getXMLResponseMessage(responseBody: string): string { + let parseXMLClass = new ParseXML() + return parseXMLClass.sanitize(responseBody).match(/(.*?)<\/Message>/g)[0].replace(/<[^>]+>/g, '') + } +} diff --git a/src/environments/environment.prod.ts b/src/environments/environment.prod.ts index 3612073..a646658 100644 --- a/src/environments/environment.prod.ts +++ b/src/environments/environment.prod.ts @@ -1,3 +1,5 @@ export const environment = { - production: true -}; + production: true, + + API_URL: `https://apis.dslak.it/` +} diff --git a/src/environments/environment.ts b/src/environments/environment.ts index 7b4f817..2128c6d 100644 --- a/src/environments/environment.ts +++ b/src/environments/environment.ts @@ -1,16 +1,5 @@ -// This file can be replaced during build by using the `fileReplacements` array. -// `ng build --prod` replaces `environment.ts` with `environment.prod.ts`. -// The list of file replacements can be found in `angular.json`. - export const environment = { - production: false -}; + production: false, -/* - * For easier debugging in development mode, you can import the following file - * to ignore zone related error stack frames such as `zone.run`, `zoneDelegate.invokeTask`. - * - * This import should be commented out in production mode because it will have a negative impact - * on performance if an error is thrown. - */ -// import 'zone.js/dist/zone-error'; // Included with Angular CLI. + API_URL: `http://localhost/dslak_website/apis/` +} From 13bc26e587c6f0b1da87ef0fa5abe3316268775e Mon Sep 17 00:00:00 2001 From: Dslak Date: Wed, 2 Dec 2020 15:43:22 +0100 Subject: [PATCH 07/38] add items style --- .gitignore | 2 + src/app/portfolio/portfolio.component.html | 9 ++- src/app/portfolio/portfolio.component.scss | 69 ++++++++++++++++++++++ 3 files changed, 78 insertions(+), 2 deletions(-) diff --git a/.gitignore b/.gitignore index 27fa5eb..915068b 100644 --- a/.gitignore +++ b/.gitignore @@ -2,3 +2,5 @@ node_modules/ package-lock\.json + +src/assets/images/contents/ diff --git a/src/app/portfolio/portfolio.component.html b/src/app/portfolio/portfolio.component.html index 24db7e7..8efcc9d 100644 --- a/src/app/portfolio/portfolio.component.html +++ b/src/app/portfolio/portfolio.component.html @@ -1,8 +1,13 @@
-
- {{portfolioItems.title}} +
+ +
+ {{item.title}} + {{item.type}} + {{item.tags}} +
diff --git a/src/app/portfolio/portfolio.component.scss b/src/app/portfolio/portfolio.component.scss index 5ae1eae..df199b0 100644 --- a/src/app/portfolio/portfolio.component.scss +++ b/src/app/portfolio/portfolio.component.scss @@ -1,7 +1,76 @@ @import "../../assets/scss/variables"; .component-portfolio { + padding-top: 100px; + .box { + position: relative; + display: flex; + background: $black; + border-radius: 10px; + overflow: hidden; + margin: 40px; + padding: 20px; + cursor: pointer; + transition: transform .4s; + + .image { + position: absolute; + top: 50%; + left: 50%; + height: 100%; + width: 100%; + object-fit: cover; + transform: translate(-50%, -50%); + transition: transform .4s; + opacity: .5; + z-index: 0; + } + + .text { + display: block; + margin: auto; + text-align: center; + transform: translate(0%, 0%); + z-index: 1; + + .title { + display: block; + color: $white; + font-size: $font-24; + text-transform: uppercase; + font-weight: bold; + } + + .type { + display: block; + color: $white; + font-size: $font-18; + font-weight: bold; + } + + .tags { + display: block; + color: $white; + font-size: $font-14; + text-transform: uppercase; + font-weight: bold; + padding-top: 20px; + } + } + + @each $angle in 0,1,2,3,4,5,6 { + &.skew-#{$angle} {transform: skew(#{$angle - 3}deg, #{$angle - 3}deg) ;} + } + &:hover { + //transform: scale(1.4) skew(2deg, 2deg) rotate(2deg); + @each $angle in 0,1,2,3,4,5,6 { + &.skew-#{$angle} {transform: scale(1.4) rotate(2deg) skew(#{3 - $angle}deg, #{3 - $angle}deg) ;} + } + .image { + transform: translate(-50%, -50%) scale(1.4); + } + } } } From a8ca76ae17e3d3e3677d8c9c358560ea2943c6e5 Mon Sep 17 00:00:00 2001 From: Dslak Date: Wed, 2 Dec 2020 17:25:37 +0100 Subject: [PATCH 08/38] add details --- src/app/about/about.component.html | 2 + src/app/about/about.component.scss | 24 ++++++- src/app/about/about.component.ts | 10 ++- src/app/app-layout/app-layout.component.ts | 2 +- src/app/app-routing.module.ts | 25 +++---- src/app/app.module.ts | 12 +--- src/app/detail/detail.component.html | 9 +++ src/app/detail/detail.component.scss | 63 ++++++++++++++++++ .../detail.component.spec.ts} | 12 ++-- src/app/detail/detail.component.ts | 38 +++++++++++ .../entertainment.component.html | 1 - .../entertainment.component.scss | 0 .../entertainment.component.spec.ts | 25 ------- .../entertainment/entertainment.component.ts | 15 ----- .../exhibitions/exhibitions.component.html | 1 - .../exhibitions/exhibitions.component.scss | 0 src/app/exhibitions/exhibitions.component.ts | 15 ----- src/app/header/header.component.scss | 8 +-- .../installations.component.html | 1 - .../installations.component.scss | 0 .../installations.component.spec.ts | 25 ------- .../installations/installations.component.ts | 15 ----- .../performances/performances.component.html | 1 - .../performances/performances.component.scss | 0 .../performances.component.spec.ts | 25 ------- .../performances/performances.component.ts | 15 ----- src/app/portfolio/portfolio.component.html | 14 ++-- src/app/portfolio/portfolio.component.scss | 8 ++- src/app/portfolio/portfolio.component.ts | 11 ++- src/app/services/apis.service.ts | 7 ++ src/assets/fonts/icomoon.eot | Bin 5464 -> 5512 bytes src/assets/fonts/icomoon.svg | 1 + src/assets/fonts/icomoon.ttf | Bin 5300 -> 5348 bytes src/assets/fonts/icomoon.woff | Bin 5376 -> 5424 bytes src/assets/fonts/selection.json | 2 +- src/assets/scss/global.scss | 1 + src/assets/scss/icons.scss | 3 + 37 files changed, 204 insertions(+), 187 deletions(-) create mode 100644 src/app/detail/detail.component.html create mode 100644 src/app/detail/detail.component.scss rename src/app/{exhibitions/exhibitions.component.spec.ts => detail/detail.component.spec.ts} (53%) create mode 100644 src/app/detail/detail.component.ts delete mode 100644 src/app/entertainment/entertainment.component.html delete mode 100644 src/app/entertainment/entertainment.component.scss delete mode 100644 src/app/entertainment/entertainment.component.spec.ts delete mode 100644 src/app/entertainment/entertainment.component.ts delete mode 100644 src/app/exhibitions/exhibitions.component.html delete mode 100644 src/app/exhibitions/exhibitions.component.scss delete mode 100644 src/app/exhibitions/exhibitions.component.ts delete mode 100644 src/app/installations/installations.component.html delete mode 100644 src/app/installations/installations.component.scss delete mode 100644 src/app/installations/installations.component.spec.ts delete mode 100644 src/app/installations/installations.component.ts delete mode 100644 src/app/performances/performances.component.html delete mode 100644 src/app/performances/performances.component.scss delete mode 100644 src/app/performances/performances.component.spec.ts delete mode 100644 src/app/performances/performances.component.ts diff --git a/src/app/about/about.component.html b/src/app/about/about.component.html index 16f8f6c..980843a 100644 --- a/src/app/about/about.component.html +++ b/src/app/about/about.component.html @@ -1,6 +1,8 @@
+ +

DSLAK è un progetto che nasce nel 2010 da un'idea di Carmine De Rosa, sviluppatore ed amministratore di sistema in ambiente Unix/Linux, dopo aver completato gli studi in ambito elettronico approfondisce le proprie conoscenze informatiche presso l'Università di Salerno dove insieme ad un gruppo di appassionati di haking fonda HCSSLUG (Linux Users Group dell'Università di Salerno) e ed il relativo HackLab con il quale realizza numerosi progetti in ambito OpenSource, basati sulla ricerca e sulla sperimentazione in ambito tecnologico.

Nel 2006 si avvicina alle arti digitali e nel 2009, incuriosito dapprima dall'aspetto tecnico ma senza tralasciare quello scenico e concettuale, inizia ad approfondire le propie conoscenze nell'ambito della new-media art e delle installazioni interattive, studiando le soluzioni adottate da artisti affermati e sviluppando varie soluzioni alternative che utilizzano però un approccio più sostenibile, efficiente e soprattutto open.

diff --git a/src/app/about/about.component.scss b/src/app/about/about.component.scss index de85f7e..24c9086 100644 --- a/src/app/about/about.component.scss +++ b/src/app/about/about.component.scss @@ -4,6 +4,7 @@ z-index: 0; .content { + position: relative; margin: 150px auto 80px auto; padding: 40px 50px; font-size: $font-18; @@ -24,7 +25,7 @@ line-height: 35px; width: 200px; transition: transform .3s; - + -webkit-backface-visibility: hidden; .icon { display: inline-block; @@ -52,6 +53,27 @@ } } } + + .back { + position: absolute; + top: -40px; + left: 0px; + height: 40px; + width: 60px; + appearance: none; + border: none; + padding: 0; + font-size: $font-40; + color: $white-alpha; + background: transparent; + cursor: pointer; + transition: transform .3s; + -webkit-backface-visibility: hidden; + + &:hover { + transform: scale(1.1) translateX(-10px); + } + } } } diff --git a/src/app/about/about.component.ts b/src/app/about/about.component.ts index 9898f7a..204648a 100644 --- a/src/app/about/about.component.ts +++ b/src/app/about/about.component.ts @@ -1,4 +1,5 @@ -import { Component, OnInit } from '@angular/core'; +import { Component, OnInit } from '@angular/core' +import { Location } from '@angular/common' @Component({ selector: 'app-about', @@ -7,9 +8,14 @@ import { Component, OnInit } from '@angular/core'; }) export class AboutComponent implements OnInit { - constructor() { } + constructor( + private location: Location + ) { } ngOnInit(): void { } + back() { + this.location.back() + } } diff --git a/src/app/app-layout/app-layout.component.ts b/src/app/app-layout/app-layout.component.ts index d041db1..83ed410 100644 --- a/src/app/app-layout/app-layout.component.ts +++ b/src/app/app-layout/app-layout.component.ts @@ -8,7 +8,7 @@ import type { Container } from 'tsparticles' }) export class AppLayoutComponent implements OnInit { - public particlesEnabled: boolean = false + public particlesEnabled: boolean = true public id: string = 'tsparticles' public particlesOptions: any = { diff --git a/src/app/app-routing.module.ts b/src/app/app-routing.module.ts index 880d671..1b2066f 100644 --- a/src/app/app-routing.module.ts +++ b/src/app/app-routing.module.ts @@ -3,12 +3,7 @@ import { Routes, RouterModule } from '@angular/router' import { AppLayoutComponent } from './app-layout/app-layout.component' import { AboutComponent } from './about/about.component' import { PortfolioComponent } from './portfolio/portfolio.component' -import { ExhibitionsComponent } from './exhibitions/exhibitions.component' -import { InstallationsComponent } from './installations/installations.component' -import { EntertainmentComponent } from './entertainment/entertainment.component' -import { PerformancesComponent } from './performances/performances.component' -import { WorkshopsComponent } from './workshops/workshops.component' - +import { DetailComponent } from './detail/detail.component' const routes: Routes = [ { @@ -17,13 +12,19 @@ const routes: Routes = [ children: [ //{ path: '', redirectTo: '/portfolio', pathMatch: 'full' }, { path: '', component: PortfolioComponent }, - { path: 'portfolio', component: PortfolioComponent }, { path: 'about', component: AboutComponent }, - { path: 'exhibitions', component: ExhibitionsComponent }, - { path: 'installations', component: InstallationsComponent }, - { path: 'entertainment', component: EntertainmentComponent }, - { path: 'performances', component: PerformancesComponent }, - { path: 'workshops', component: WorkshopsComponent } + { path: 'portfolio', component: PortfolioComponent }, + { path: 'exhibitions', component: PortfolioComponent }, + { path: 'installations', component: PortfolioComponent }, + { path: 'entertainment', component: PortfolioComponent }, + { path: 'performances', component: PortfolioComponent }, + { path: 'workshops', component: PortfolioComponent }, + { path: 'detail', component: DetailComponent, + children: [ + { path: '**', component: DetailComponent } + ] + } + ] } ] diff --git a/src/app/app.module.ts b/src/app/app.module.ts index 9ac77c7..cb94103 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -9,11 +9,7 @@ import { HeaderComponent } from './header/header.component'; import { AppLayoutComponent } from './app-layout/app-layout.component'; import { AboutComponent } from './about/about.component'; import { PortfolioComponent } from './portfolio/portfolio.component'; -import { ExhibitionsComponent } from './exhibitions/exhibitions.component'; -import { InstallationsComponent } from './installations/installations.component'; -import { EntertainmentComponent } from './entertainment/entertainment.component'; -import { PerformancesComponent } from './performances/performances.component'; -import { WorkshopsComponent } from './workshops/workshops.component'; +import { DetailComponent } from './detail/detail.component'; @NgModule({ declarations: [ @@ -22,11 +18,7 @@ import { WorkshopsComponent } from './workshops/workshops.component'; AppLayoutComponent, AboutComponent, PortfolioComponent, - ExhibitionsComponent, - InstallationsComponent, - EntertainmentComponent, - PerformancesComponent, - WorkshopsComponent + DetailComponent ], imports: [ BrowserModule, diff --git a/src/app/detail/detail.component.html b/src/app/detail/detail.component.html new file mode 100644 index 0000000..408cb39 --- /dev/null +++ b/src/app/detail/detail.component.html @@ -0,0 +1,9 @@ +
+
+
+ +

{{details.title}}

+
+ Tags: {{details.tags}} +
+
diff --git a/src/app/detail/detail.component.scss b/src/app/detail/detail.component.scss new file mode 100644 index 0000000..0df604d --- /dev/null +++ b/src/app/detail/detail.component.scss @@ -0,0 +1,63 @@ +@import "../../assets/scss/variables"; + +.component-detail { + z-index: 0; + + .content { + position: relative; + margin: 150px auto 80px auto; + padding: 40px 50px; + background: $white-alpha; + color: $black; + box-shadow: 0px 0px 25px $white-alpha; + border-radius: 10px; + + .title { + margin-top: 0; + font-size: $font-34; + font-weight: bold; + text-transform: uppercase; + } + + .text { + font-size: $font-18; + text-align: justify; + } + + .tags { + display: block; + font-size: $font-12; + text-transform: uppercase; + padding-top: 40px; + } + + .back { + position: absolute; + top: -40px; + left: 0px; + height: 40px; + width: 60px; + appearance: none; + border: none; + padding: 0; + font-size: $font-40; + color: $white-alpha; + background: transparent; + cursor: pointer; + transition: transform .3s; + -webkit-backface-visibility: hidden; + + &:hover { + transform: scale(1.1) translateX(-10px); + } + } + } +} + +@media (min-width: map-get($grid-breakpoints, 'md')) { + .component-detail { + .content { + transform: rotate(2deg) skew(0deg, -6deg); + } + } +} diff --git a/src/app/exhibitions/exhibitions.component.spec.ts b/src/app/detail/detail.component.spec.ts similarity index 53% rename from src/app/exhibitions/exhibitions.component.spec.ts rename to src/app/detail/detail.component.spec.ts index c655d74..149b9be 100644 --- a/src/app/exhibitions/exhibitions.component.spec.ts +++ b/src/app/detail/detail.component.spec.ts @@ -1,20 +1,20 @@ import { async, ComponentFixture, TestBed } from '@angular/core/testing'; -import { ExhibitionsComponent } from './exhibitions.component'; +import { DetailComponent } from './detail.component'; -describe('ExhibitionsComponent', () => { - let component: ExhibitionsComponent; - let fixture: ComponentFixture; +describe('DetailComponent', () => { + let component: DetailComponent; + let fixture: ComponentFixture; beforeEach(async(() => { TestBed.configureTestingModule({ - declarations: [ ExhibitionsComponent ] + declarations: [ DetailComponent ] }) .compileComponents(); })); beforeEach(() => { - fixture = TestBed.createComponent(ExhibitionsComponent); + fixture = TestBed.createComponent(DetailComponent); component = fixture.componentInstance; fixture.detectChanges(); }); diff --git a/src/app/detail/detail.component.ts b/src/app/detail/detail.component.ts new file mode 100644 index 0000000..760367f --- /dev/null +++ b/src/app/detail/detail.component.ts @@ -0,0 +1,38 @@ +import { Component, OnInit } from '@angular/core' +import { Router, NavigationEnd } from '@angular/router' +import { Location } from '@angular/common' +import { ApisService } from '../services/apis.service' + +@Component({ + selector: 'app-detail', + templateUrl: './detail.component.html', + styleUrls: ['./detail.component.scss'] +}) +export class DetailComponent implements OnInit { + + public details: any = {} + + constructor( + private apisService: ApisService, + private router: Router, + private location: Location + ){ } + + ngOnInit(): void { + this.showDetails(this.router.url.split('/')[2]) + } + + showDetails(id): void { + this.apisService.getDetails(id).toPromise().then((response) => { + this.details = response.item + },(error) => { + console.error('getPortfolio ERROR', error) + }).catch((e) => { + console.error('getPortfolio CATCH', e) + }) + } + + back() { + this.location.back() + } +} diff --git a/src/app/entertainment/entertainment.component.html b/src/app/entertainment/entertainment.component.html deleted file mode 100644 index 64e075f..0000000 --- a/src/app/entertainment/entertainment.component.html +++ /dev/null @@ -1 +0,0 @@ -

entertainment works!

diff --git a/src/app/entertainment/entertainment.component.scss b/src/app/entertainment/entertainment.component.scss deleted file mode 100644 index e69de29..0000000 diff --git a/src/app/entertainment/entertainment.component.spec.ts b/src/app/entertainment/entertainment.component.spec.ts deleted file mode 100644 index 416bfd2..0000000 --- a/src/app/entertainment/entertainment.component.spec.ts +++ /dev/null @@ -1,25 +0,0 @@ -import { async, ComponentFixture, TestBed } from '@angular/core/testing'; - -import { EntertainmentComponent } from './entertainment.component'; - -describe('EntertainmentComponent', () => { - let component: EntertainmentComponent; - let fixture: ComponentFixture; - - beforeEach(async(() => { - TestBed.configureTestingModule({ - declarations: [ EntertainmentComponent ] - }) - .compileComponents(); - })); - - beforeEach(() => { - fixture = TestBed.createComponent(EntertainmentComponent); - component = fixture.componentInstance; - fixture.detectChanges(); - }); - - it('should create', () => { - expect(component).toBeTruthy(); - }); -}); diff --git a/src/app/entertainment/entertainment.component.ts b/src/app/entertainment/entertainment.component.ts deleted file mode 100644 index c6b6381..0000000 --- a/src/app/entertainment/entertainment.component.ts +++ /dev/null @@ -1,15 +0,0 @@ -import { Component, OnInit } from '@angular/core'; - -@Component({ - selector: 'app-entertainment', - templateUrl: './entertainment.component.html', - styleUrls: ['./entertainment.component.scss'] -}) -export class EntertainmentComponent implements OnInit { - - constructor() { } - - ngOnInit(): void { - } - -} diff --git a/src/app/exhibitions/exhibitions.component.html b/src/app/exhibitions/exhibitions.component.html deleted file mode 100644 index 85a0021..0000000 --- a/src/app/exhibitions/exhibitions.component.html +++ /dev/null @@ -1 +0,0 @@ -

exhibitions works!

diff --git a/src/app/exhibitions/exhibitions.component.scss b/src/app/exhibitions/exhibitions.component.scss deleted file mode 100644 index e69de29..0000000 diff --git a/src/app/exhibitions/exhibitions.component.ts b/src/app/exhibitions/exhibitions.component.ts deleted file mode 100644 index c2c1747..0000000 --- a/src/app/exhibitions/exhibitions.component.ts +++ /dev/null @@ -1,15 +0,0 @@ -import { Component, OnInit } from '@angular/core'; - -@Component({ - selector: 'app-exhibitions', - templateUrl: './exhibitions.component.html', - styleUrls: ['./exhibitions.component.scss'] -}) -export class ExhibitionsComponent implements OnInit { - - constructor() { } - - ngOnInit(): void { - } - -} diff --git a/src/app/header/header.component.scss b/src/app/header/header.component.scss index 72629da..83a90d6 100644 --- a/src/app/header/header.component.scss +++ b/src/app/header/header.component.scss @@ -65,8 +65,8 @@ background: transparent; .logo-container { - height: 80px; - width: 80px; + height: 100px; + width: 100px; .circles { &:before, @@ -76,8 +76,8 @@ } &.menu-open { - height: 120px; - width: 120px; + height: 140px; + width: 140px; .circles { &:before, &:after { diff --git a/src/app/installations/installations.component.html b/src/app/installations/installations.component.html deleted file mode 100644 index c142693..0000000 --- a/src/app/installations/installations.component.html +++ /dev/null @@ -1 +0,0 @@ -

installations works!

diff --git a/src/app/installations/installations.component.scss b/src/app/installations/installations.component.scss deleted file mode 100644 index e69de29..0000000 diff --git a/src/app/installations/installations.component.spec.ts b/src/app/installations/installations.component.spec.ts deleted file mode 100644 index c50ae75..0000000 --- a/src/app/installations/installations.component.spec.ts +++ /dev/null @@ -1,25 +0,0 @@ -import { async, ComponentFixture, TestBed } from '@angular/core/testing'; - -import { InstallationsComponent } from './installations.component'; - -describe('InstallationsComponent', () => { - let component: InstallationsComponent; - let fixture: ComponentFixture; - - beforeEach(async(() => { - TestBed.configureTestingModule({ - declarations: [ InstallationsComponent ] - }) - .compileComponents(); - })); - - beforeEach(() => { - fixture = TestBed.createComponent(InstallationsComponent); - component = fixture.componentInstance; - fixture.detectChanges(); - }); - - it('should create', () => { - expect(component).toBeTruthy(); - }); -}); diff --git a/src/app/installations/installations.component.ts b/src/app/installations/installations.component.ts deleted file mode 100644 index 61102ea..0000000 --- a/src/app/installations/installations.component.ts +++ /dev/null @@ -1,15 +0,0 @@ -import { Component, OnInit } from '@angular/core'; - -@Component({ - selector: 'app-installations', - templateUrl: './installations.component.html', - styleUrls: ['./installations.component.scss'] -}) -export class InstallationsComponent implements OnInit { - - constructor() { } - - ngOnInit(): void { - } - -} diff --git a/src/app/performances/performances.component.html b/src/app/performances/performances.component.html deleted file mode 100644 index 7b9658d..0000000 --- a/src/app/performances/performances.component.html +++ /dev/null @@ -1 +0,0 @@ -

performances works!

diff --git a/src/app/performances/performances.component.scss b/src/app/performances/performances.component.scss deleted file mode 100644 index e69de29..0000000 diff --git a/src/app/performances/performances.component.spec.ts b/src/app/performances/performances.component.spec.ts deleted file mode 100644 index 0ee44e3..0000000 --- a/src/app/performances/performances.component.spec.ts +++ /dev/null @@ -1,25 +0,0 @@ -import { async, ComponentFixture, TestBed } from '@angular/core/testing'; - -import { PerformancesComponent } from './performances.component'; - -describe('PerformancesComponent', () => { - let component: PerformancesComponent; - let fixture: ComponentFixture; - - beforeEach(async(() => { - TestBed.configureTestingModule({ - declarations: [ PerformancesComponent ] - }) - .compileComponents(); - })); - - beforeEach(() => { - fixture = TestBed.createComponent(PerformancesComponent); - component = fixture.componentInstance; - fixture.detectChanges(); - }); - - it('should create', () => { - expect(component).toBeTruthy(); - }); -}); diff --git a/src/app/performances/performances.component.ts b/src/app/performances/performances.component.ts deleted file mode 100644 index 97bbb04..0000000 --- a/src/app/performances/performances.component.ts +++ /dev/null @@ -1,15 +0,0 @@ -import { Component, OnInit } from '@angular/core'; - -@Component({ - selector: 'app-performances', - templateUrl: './performances.component.html', - styleUrls: ['./performances.component.scss'] -}) -export class PerformancesComponent implements OnInit { - - constructor() { } - - ngOnInit(): void { - } - -} diff --git a/src/app/portfolio/portfolio.component.html b/src/app/portfolio/portfolio.component.html index 8efcc9d..546cba5 100644 --- a/src/app/portfolio/portfolio.component.html +++ b/src/app/portfolio/portfolio.component.html @@ -1,12 +1,14 @@
-
- -
- {{item.title}} - {{item.type}} - {{item.tags}} +
+
+ +
+ {{item.title}} + {{item.type}} + {{item.tags}} +
diff --git a/src/app/portfolio/portfolio.component.scss b/src/app/portfolio/portfolio.component.scss index df199b0..554c6d3 100644 --- a/src/app/portfolio/portfolio.component.scss +++ b/src/app/portfolio/portfolio.component.scss @@ -1,7 +1,7 @@ @import "../../assets/scss/variables"; .component-portfolio { - padding-top: 100px; + padding-top: 140px; .box { position: relative; @@ -9,7 +9,7 @@ background: $black; border-radius: 10px; overflow: hidden; - margin: 40px; + margin: 20px 0; padding: 20px; cursor: pointer; transition: transform .4s; @@ -64,10 +64,12 @@ } &:hover { - //transform: scale(1.4) skew(2deg, 2deg) rotate(2deg); + z-index: 50; + @each $angle in 0,1,2,3,4,5,6 { &.skew-#{$angle} {transform: scale(1.4) rotate(2deg) skew(#{3 - $angle}deg, #{3 - $angle}deg) ;} } + .image { transform: translate(-50%, -50%) scale(1.4); } diff --git a/src/app/portfolio/portfolio.component.ts b/src/app/portfolio/portfolio.component.ts index 95cbf2b..ecdf1e1 100644 --- a/src/app/portfolio/portfolio.component.ts +++ b/src/app/portfolio/portfolio.component.ts @@ -1,4 +1,5 @@ import { Component, OnInit } from '@angular/core' +import { Router, NavigationEnd } from '@angular/router' import { ApisService } from '../services/apis.service' @Component({ @@ -10,10 +11,13 @@ export class PortfolioComponent implements OnInit { public portfolioItems: any = [] - constructor(private apisService: ApisService) { } + constructor( + private apisService: ApisService, + private router: Router) + { } ngOnInit(): void { - this.apisService.getPortfolio('portfolio').toPromise().then((response) => { + this.apisService.getPortfolio(this.router.url.split('/')[1]).toPromise().then((response) => { this.portfolioItems = response.items },(error) => { console.error('getPortfolio ERROR', error) @@ -22,5 +26,8 @@ export class PortfolioComponent implements OnInit { }) } + showDetails(id): void { + this.router.navigate([`/detail/${id}`]) + } } diff --git a/src/app/services/apis.service.ts b/src/app/services/apis.service.ts index 48124b9..3df86b3 100644 --- a/src/app/services/apis.service.ts +++ b/src/app/services/apis.service.ts @@ -23,4 +23,11 @@ export class ApisService extends BaseService { ) } + getDetails(id): Observable { + let urlApi = `${this.restApi}?query=single&id=${id}` + return this.http.get(urlApi).pipe( + catchError(this.handleError) + ) + } + } diff --git a/src/assets/fonts/icomoon.eot b/src/assets/fonts/icomoon.eot index 5824380a35eafe9d20ddccab6fe2bdb7af243f82..80e12dbd43409d270b9fdf8364ea878bce2e3512 100644 GIT binary patch delta 424 zcmcbi)uGMWA;0MY_L{th6`k)BhTcBP=|Gmw7(DBP2gnwTQ>Qz)H*LC6OvZMc&ODe2w8EymlD}a2Toc!cO$t`knK>imXUn4iMqJTj`kCB&wK^SDALSABS>P#=r z-$1?%(2}--{NfS@W}pm%$Pth{12c2UqirSwgOCDH-V7wbeu()7kRJi$ zt7PPsRG8Z`Yyt9XfP9af{NzO07D*)_{|Jz;mYY~nz#y;3$O{yB0~AomOUzB3>Bae* zfkBuDXh~Z^esKu{Gf;*>WC}>0ftfjLatdQLe+7^y1#}oQ0~Z4$gTmwwj53q?n54u6 z82MZHi}(xpwfUCuRq@&KP5~-mob1RXJvo-iW%E%cV*#0an{SxL^V@u7;AR1t%y9dy zqBxA6EFx?!C + diff --git a/src/assets/fonts/icomoon.ttf b/src/assets/fonts/icomoon.ttf index 1492972c54ff9c9c8dfdaaa8b572a256ed2c6f1a..ccc99c46565654ac321127d864d74a3c753b1f3c 100644 GIT binary patch delta 446 zcmdm@`9!mxfsuiMft#U$ftkU;KUm+0Ux;5CD6$8L6OwZi3$}5t>tkSGlmYVRq$d^^ z0BHdre+Q7}NYANEyHZf~8OT2X6z<7LO-zycDU{B@Amjs-H_HGDupeT+3FNl``6?N? zB^B1T47Y*&6+pgEPJXguqU07iIiSE7pnyhhVnqRi0wXU2gD}WKg}lVv)R|tKzkz%k zpe1bu`NbtbhXR4f5s*9sGjqwr1J!~JK#mO1UCazTK>sMbWSH#5C}Z-H;RExB#t&0J z%=qx&W7@|lA1{5X{r~s>e+I_?kHuL8nD|@yi}?%rb@-O^RrA^LP6cXboV-v(c=84j z7BF7V=%&QTpw1}6e3L1Vft7)QlTp!B(VTJRzdGhkf3p`e1^zpo(!BXIqp5(*i&rbI z#`D{JW#DE3I);Ja_S>|7FnY3!kh!QZL>w&1zyzd#eD%paLe9Dd46_)87`+(xG3hW( nW7@~8!!n8W5t|RY0{a6FH*ow2Gjaoc1_DeV2X5vUUdjjnyYF)I delta 371 zcmaE&xka;{fsuiMft#U$ftkU;KUm+0Ux;52D6$8L6OwZi3oh?nevpBIQ3lALlAc&x z0Hg(g{0%^wBR!`w&4#o3JdnQwD4daznwTQ>qirSwgOCDH-V7wbeu()7kRJi$t7PPs zRG8Z`Yyt9XfP9af{A9;O*%nD9puiEJfLd;1MFE36BQKEu2FO>)OUzB3>Bae*fkBuD zXh~Z^esKxVp+F!q1tibF%$zmxKsA2_kRt_j7c&DF&_4>3eHdjXXE92N2{7`v@E7qH z@N4re*$qr~KGjP9EinT!Qw?rpwd8qaU@m4TZDWH7_+w~FF0dUAn~ zxu6h494yJe1f(YK5pve;U}RvlU|ho_#ni&IhFOZGf%O8L6+0jMISvz`5>TKDF>*5i RT@3_GKpTZO+Y2vc1OUNNOp*Wq diff --git a/src/assets/fonts/icomoon.woff b/src/assets/fonts/icomoon.woff index 6deaa896ab58dbcb0073ddbf316b033602a6f22e..84f93b7b502e87e66daa3f32db8568f4c52a6563 100644 GIT binary patch delta 481 zcmZqB+Mp#;?(gQtz{mguq6Q4yAX?EztR0tN=g44}vy5Z=bQt}i{Y7%0ZX z0_1Z*u|RrGWg1Y7hk-$$2ZXN_RDI4!O-x~65Sjs0V+O)fKZVjWfPz4=3qZaK2(uqz zzL}9*QUMhE0_6LEu(d72?VS8%pgKQc2cUok2up5}lgmx409q^za*P5PD=_lrCFZ6A z#X5kFYy;t$UYx%R@{3D=J`sScV+OLAnM)?~FjmJl0NFAO0u0OyJU|~Sykz*m{GsW? z)DN>hJouRYamvTbpKAaA{r?}R3TO*hwh<^h11OsYl)VI%W&HnGoJD|%zm>n3zmQ*t zZ#iEzpB?Yi$@duLC;w)2Q(|OLXOv;S$rQ-I%D}+MsA#Ha&babl9rLEY*^8M1|D8^0 z-fYigDj@UX)rza}{5D@1xIw|mz;OF*+CLaQd4iC+s4zqvEXlwGq=0<&$v1?Yl?@nX nF$ytyG45m1VVcIYk6DLh66+&2A9e-y2ON;d6y9tne25VMtRR6g delta 427 zcmdm>)u1I(?(gQtz{mguq6`e&AX;S0Il~hCg&y=FfcG?041h?@a4VB z52hy;gT(#-`5aIzke*YS#=yYD!oVN^R4b5S!&!YkBQ-IFfk7w-sKyM0rGB){%m4}k z#g+j1Dj>{$i1|iFZb=1D>;#bS0mA0C3|n&YlY#2|gav>CY9K7zBB_*{SOK(H*aFB` z0AqPZ-n_)zRG?S{&_Qh=JkyKwcR_w}3D6@C;OdxxEN14c$vlkJ{6MQ1q!IZ$ z9#@z=gHgud1M`Q*4^uzP`0(Ik+Q%s$FMX>0|M&lY2FCx71sM5T_>1@p__g_#@m2BJ z@=gJ2WQ2qe>ttpox6Qds#sV_;Hs3If=ePOFzzqxmAh`WjQ5;53-Xml#C Date: Wed, 2 Dec 2020 19:04:40 +0100 Subject: [PATCH 09/38] new portfolio grid style add favicon --- angular.json | 2 +- src/app/about/about.component.scss | 2 +- src/app/app-layout/app-layout.component.ts | 2 +- src/app/detail/detail.component.scss | 2 +- src/app/portfolio/portfolio.component.html | 2 +- src/app/portfolio/portfolio.component.scss | 56 +++++++++++++++------ src/assets/images/favicon.png | Bin 0 -> 1488 bytes src/assets/scss/variables.scss | 4 +- src/favicon.ico | Bin 948 -> 0 bytes src/favicon.png | Bin 0 -> 1488 bytes src/index.html | 2 +- 11 files changed, 48 insertions(+), 24 deletions(-) create mode 100644 src/assets/images/favicon.png delete mode 100644 src/favicon.ico create mode 100644 src/favicon.png diff --git a/angular.json b/angular.json index 52df64f..48a4209 100644 --- a/angular.json +++ b/angular.json @@ -24,7 +24,7 @@ "tsConfig": "tsconfig.app.json", "aot": true, "assets": [ - "src/favicon.ico", + "src/assets/images/favicon.png", "src/assets" ], "styles": [ diff --git a/src/app/about/about.component.scss b/src/app/about/about.component.scss index 24c9086..a0eb681 100644 --- a/src/app/about/about.component.scss +++ b/src/app/about/about.component.scss @@ -64,7 +64,7 @@ border: none; padding: 0; font-size: $font-40; - color: $white-alpha; + color: $black-alpha; background: transparent; cursor: pointer; transition: transform .3s; diff --git a/src/app/app-layout/app-layout.component.ts b/src/app/app-layout/app-layout.component.ts index 83ed410..7174112 100644 --- a/src/app/app-layout/app-layout.component.ts +++ b/src/app/app-layout/app-layout.component.ts @@ -97,6 +97,6 @@ export class AppLayoutComponent implements OnInit { particlesLoaded(container: Container): void { - console.log('particlesLoaded', container) + //console.log('particlesLoaded', container) } } diff --git a/src/app/detail/detail.component.scss b/src/app/detail/detail.component.scss index 0df604d..6900e99 100644 --- a/src/app/detail/detail.component.scss +++ b/src/app/detail/detail.component.scss @@ -41,7 +41,7 @@ border: none; padding: 0; font-size: $font-40; - color: $white-alpha; + color: $black-alpha; background: transparent; cursor: pointer; transition: transform .3s; diff --git a/src/app/portfolio/portfolio.component.html b/src/app/portfolio/portfolio.component.html index 546cba5..3f9d61a 100644 --- a/src/app/portfolio/portfolio.component.html +++ b/src/app/portfolio/portfolio.component.html @@ -1,7 +1,7 @@
-
+
diff --git a/src/app/portfolio/portfolio.component.scss b/src/app/portfolio/portfolio.component.scss index 554c6d3..a0965c4 100644 --- a/src/app/portfolio/portfolio.component.scss +++ b/src/app/portfolio/portfolio.component.scss @@ -6,13 +6,15 @@ .box { position: relative; display: flex; - background: $black; + //background: $black-alpha; border-radius: 10px; overflow: hidden; - margin: 20px 0; - padding: 20px; + margin: 10px 0; + padding: 40px 20px; + min-height: 250px; cursor: pointer; - transition: transform .4s; + transition: transform .4s, background .4s; + -webkit-backface-visibility: hidden; .image { position: absolute; @@ -21,9 +23,11 @@ height: 100%; width: 100%; object-fit: cover; - transform: translate(-50%, -50%); - transition: transform .4s; + transform: translate(-50%, -50%) scale(1.2); opacity: .5; + filter: grayscale(100%) invert(100%); + transition: transform .4s, opacity .4s, filter .4s; + -webkit-backface-visibility: hidden; z-index: 0; } @@ -32,47 +36,67 @@ margin: auto; text-align: center; transform: translate(0%, 0%); + color: $black; + transition: color .4s; + -webkit-backface-visibility: hidden; z-index: 1; .title { display: block; - color: $white; - font-size: $font-24; + font-size: $font-20; text-transform: uppercase; font-weight: bold; } .type { display: block; - color: $white; - font-size: $font-18; + font-size: $font-16; font-weight: bold; } .tags { display: block; - color: $white; - font-size: $font-14; + font-size: $font-12; text-transform: uppercase; font-weight: bold; - padding-top: 20px; + padding-top: 10px; } } @each $angle in 0,1,2,3,4,5,6 { - &.skew-#{$angle} {transform: skew(#{$angle - 3}deg, #{$angle - 3}deg) ;} + &.skew-#{$angle} { + transform: skew(#{$angle - 3}deg, #{$angle - 3}deg); + /*animation: zoom#{$angle} #{$angle + 3}s ease-in infinite forwards; + @keyframes zoom#{$angle} { + 0% { transform: scale(1) skew(#{$angle - 3}deg, #{$angle - 3}deg); } + 50% { transform: scale(1.1) skew(#{$angle - 3}deg, #{$angle - 3}deg); } + 75% { transform: scale(.9) skew(#{$angle - 3}deg, #{$angle - 3}deg); } + 100% { transform: scale(1) skew(#{$angle - 3}deg, #{$angle - 3}deg); } + }*/ + } } &:hover { + background: $black; z-index: 50; + //animation-play-state: paused; + @each $angle in 0,1,2,3,4,5,6 { - &.skew-#{$angle} {transform: scale(1.4) rotate(2deg) skew(#{3 - $angle}deg, #{3 - $angle}deg) ;} + &.skew-#{$angle} { + transform: scale(1.4) rotate(2deg) skew(#{3 - $angle}deg, #{3 - $angle}deg); } + } .image { - transform: translate(-50%, -50%) scale(1.4); + filter: grayscale(100%) invert(0%) brightness(.5); + opacity: .9; + transform: translate(-50%, -50%) scale(1.6); + } + .text { + color: $yellow; } } } } + diff --git a/src/assets/images/favicon.png b/src/assets/images/favicon.png new file mode 100644 index 0000000000000000000000000000000000000000..0d75435d056e6a1e937f63e0e7c67ceab3879cfd GIT binary patch literal 1488 zcmV;>1uy!EP)C5J*HI zDphKwN`0tQQC^CGhZczkKtb&b?Ms1Hg0v~BL=+MbNu0Ea6DPHuIN5dlk+t`8W=2Wou6vHe}KECxk;0d6;=MsXF#q@+j zcHANRABX92m+ZL1jf{#?ugIW=Si+! zaGASiqfzG{ZiJr>0oZY0fuK?)R4Ivx*_9^@u)m%2$l)G7d}9;ET&#Nr4S4dU2|#$` zz#VmV+tGUraQkYGClB@T{;ONojmR?o{??|Jb~hO<7$6U9Xk5%q+x+#ned|Wz{_oH6 zoo6#dq41micM+7OY0u{ErE}I2p(Y%Ee*4Xm$X)NK0<^`$&tKz9-&g?P>Uozx z{9@axd$;Z?60?kF6v+$q5{@4AZ}v5IX$!?R@r^GywVe=D1l#%vSn#mQYd8pi-yM*(2Sn zGca7>@n2p+mV^ld;mscpt{IPgJBq|?MHSzul9v_Ap8qu2HKBM)Nu=sy#YwE)WBP|n z0EpmONG;2Xixv~76I~N()!(FpQr5q_u(TP^k`;C6!f~H4=)M?6EfT4d=HI`&s*oz4 z5h1@kGK?PW?z)n_0m;pLQ)_*M0eRe@DpsPNXXRuhzj8(_dm1vxeb(IeY@Q-(D6?qw% zi)&Z=4Vx?Y>7e!v)H9Jv{#=XRHTkbNm8CHuiePrq;rBn^hBSm(ZrYIET;aP1vZ%s) zuk~+PG%2Kb=J=n}d)La6Pu}fi^k|Z)^DaBT(lD(E%ud-HetXroLQ5o4Ap>_e zC?xo1Va6F;%X#ul;%1Q>+*5x@{mj!j_U@a-iZx~qi>4ef_P-o-{Jo8wJXD*vqb_>i z&adYA`VVHC>?$0Rp`oG8$)4DiQo&lkm*6UJ{g4M9o#VmBXPVW4&ozu55rBP94gBQX zvE<9$K6^wUo(eUQiUQXU!nm)+L@F#Ll40KQqJ>0Hm{0drt`2=|@v?C>Cqho4Y$5YN zG172!aFSyWJw#3KhkrQm&H1eJaxUxa4g+zF6D=4=bH>)0n5}cRtut6;Vs>~v7L!Sh qG3CU$I&nfSj*MK)0=LjWYWOc$;1V8B_ltG_0000CBYU7IjCFmI-B}4sMJt3^s9NVg!P0 z6hDQy(L`XWMkB@zOLgN$4KYz;j0zZxq9KKdpZE#5@k0crP^5f9KO};h)ZDQ%ybhht z%t9#h|nu0K(bJ ztIkhEr!*UyrZWQ1k2+YkGqDi8Z<|mIN&$kzpKl{cNP=OQzXHz>vn+c)F)zO|Bou>E z2|-d_=qY#Y+yOu1a}XI?cU}%04)zz%anD(XZC{#~WreV!a$7k2Ug`?&CUEc0EtrkZ zL49MB)h!_K{H(*l_93D5tO0;BUnvYlo+;yss%n^&qjt6fZOa+}+FDO(~2>G z2dx@=JZ?DHP^;b7*Y1as5^uphBsh*s*z&MBd?e@I>-9kU>63PjP&^#5YTOb&x^6Cf z?674rmSHB5Fk!{Gv7rv!?qX#ei_L(XtwVqLX3L}$MI|kJ*w(rhx~tc&L&xP#?cQow zX_|gx$wMr3pRZIIr_;;O|8fAjd;1`nOeu5K(pCu7>^3E&D2OBBq?sYa(%S?GwG&_0-s%_v$L@R!5H_fc)lOb9ZoOO#p`Nn`KU z3LTTBtjwo`7(HA6 z7gmO$yTR!5L>Bsg!X8616{JUngg_@&85%>W=mChTR;x4`P=?PJ~oPuy5 zU-L`C@_!34D21{fD~Y8NVnR3t;aqZI3fIhmgmx}$oc-dKDC6Ap$Gy>a!`A*x2L1v0 WcZ@i?LyX}700001uy!EP)C5J*HI zDphKwN`0tQQC^CGhZczkKtb&b?Ms1Hg0v~BL=+MbNu0Ea6DPHuIN5dlk+t`8W=2Wou6vHe}KECxk;0d6;=MsXF#q@+j zcHANRABX92m+ZL1jf{#?ugIW=Si+! zaGASiqfzG{ZiJr>0oZY0fuK?)R4Ivx*_9^@u)m%2$l)G7d}9;ET&#Nr4S4dU2|#$` zz#VmV+tGUraQkYGClB@T{;ONojmR?o{??|Jb~hO<7$6U9Xk5%q+x+#ned|Wz{_oH6 zoo6#dq41micM+7OY0u{ErE}I2p(Y%Ee*4Xm$X)NK0<^`$&tKz9-&g?P>Uozx z{9@axd$;Z?60?kF6v+$q5{@4AZ}v5IX$!?R@r^GywVe=D1l#%vSn#mQYd8pi-yM*(2Sn zGca7>@n2p+mV^ld;mscpt{IPgJBq|?MHSzul9v_Ap8qu2HKBM)Nu=sy#YwE)WBP|n z0EpmONG;2Xixv~76I~N()!(FpQr5q_u(TP^k`;C6!f~H4=)M?6EfT4d=HI`&s*oz4 z5h1@kGK?PW?z)n_0m;pLQ)_*M0eRe@DpsPNXXRuhzj8(_dm1vxeb(IeY@Q-(D6?qw% zi)&Z=4Vx?Y>7e!v)H9Jv{#=XRHTkbNm8CHuiePrq;rBn^hBSm(ZrYIET;aP1vZ%s) zuk~+PG%2Kb=J=n}d)La6Pu}fi^k|Z)^DaBT(lD(E%ud-HetXroLQ5o4Ap>_e zC?xo1Va6F;%X#ul;%1Q>+*5x@{mj!j_U@a-iZx~qi>4ef_P-o-{Jo8wJXD*vqb_>i z&adYA`VVHC>?$0Rp`oG8$)4DiQo&lkm*6UJ{g4M9o#VmBXPVW4&ozu55rBP94gBQX zvE<9$K6^wUo(eUQiUQXU!nm)+L@F#Ll40KQqJ>0Hm{0drt`2=|@v?C>Cqho4Y$5YN zG172!aFSyWJw#3KhkrQm&H1eJaxUxa4g+zF6D=4=bH>)0n5}cRtut6;Vs>~v7L!Sh qG3CU$I&nfSj*MK)0=LjWYWOc$;1V8B_ltG_0000DslakWebsite - + From 0201c1b10f13824bbfe13bc1cd5f02609ff2316a Mon Sep 17 00:00:00 2001 From: Dslak Date: Thu, 3 Dec 2020 12:08:26 +0100 Subject: [PATCH 10/38] add apis and fix back navigation --- .gitignore | 2 + angular.json | 3 +- src/apis/conn.conn | 16 ++++ src/apis/index.php | 93 ++++++++++++++++++++++ src/app/app-layout/app-layout.component.ts | 2 +- src/app/app-routing.module.ts | 6 +- src/app/detail/detail.component.html | 16 +++- src/app/detail/detail.component.scss | 14 +++- src/app/detail/detail.component.ts | 28 +++++-- src/app/portfolio/portfolio.component.ts | 3 +- src/app/services/apis.service.ts | 4 +- src/environments/environment.ts | 2 +- 12 files changed, 170 insertions(+), 19 deletions(-) create mode 100755 src/apis/conn.conn create mode 100644 src/apis/index.php diff --git a/.gitignore b/.gitignore index 915068b..cd1b3c8 100644 --- a/.gitignore +++ b/.gitignore @@ -4,3 +4,5 @@ node_modules/ package-lock\.json src/assets/images/contents/ + +dist/ diff --git a/angular.json b/angular.json index 48a4209..be23e47 100644 --- a/angular.json +++ b/angular.json @@ -25,7 +25,8 @@ "aot": true, "assets": [ "src/assets/images/favicon.png", - "src/assets" + "src/assets", + "src/apis" ], "styles": [ "src/assets/scss/main.scss" diff --git a/src/apis/conn.conn b/src/apis/conn.conn new file mode 100755 index 0000000..877d806 --- /dev/null +++ b/src/apis/conn.conn @@ -0,0 +1,16 @@ + diff --git a/src/apis/index.php b/src/apis/index.php new file mode 100644 index 0000000..8adaa9a --- /dev/null +++ b/src/apis/index.php @@ -0,0 +1,93 @@ +items = array(); + +$filter = array("portfolio", "installations", "entertainment", "performances", "workshops"); + +switch($_GET['query']) { + case "portfolio": + case "installations": + case "entertainment": + case "performances": + case "workshops": + if($_GET['query'] == 'portfolio') {$filter = '';} else {$filter = "WHERE type='".$_GET['query']."'";} + $qe = mysqli_query($conn,"SELECT * FROM `works` $filter ORDER BY id DESC"); + if(mysqli_num_rows($qe) > 0) { + $content = null; + $content->items = array(); + while($re = mysqli_fetch_array($qe)) { + $item = null; + $item->id = $re['id']; + $item->title = $re['title']; + $item->type = $re['type']; + $item->tags = $re['tags']; + $item->image = $re['image']; + array_push($content->items, $item); + } + } + break; + case "exhibitions": + $qe = mysqli_query($conn,"SELECT * FROM `exhibitions` ORDER BY date_from DESC"); + if(mysqli_num_rows($qe) > 0) { + $content = null; + $content->items = array(); + while($re = mysqli_fetch_array($qe)) { + $item = null; + $item->id = $re['id']; + $item->title = $re['title']; + $item->date_from = $re['date_from']; + $item->date_to = $re['date_to']; + $item->tags = $re['tags']; + $item->image = $re['image']; + array_push($content->items, $item); + } + } + break; + case "detail": + $qe = mysqli_query($conn,"SELECT * FROM `".$_GET['type']."` WHERE id=".$_GET['id']); + if(mysqli_num_rows($qe)>0) { + $content = null; + $re = mysqli_fetch_array($qe); + $item = null; + $item->id = $re['id']; + $item->title = $re['title']; + $item->content = $re['content']; + $item->tags = $re['tags']; + $item->image = $re['image']; + if($_GET['type'] == 'exhibitions') { + $item->date_from = $re['date_from']; + $item->date_to = $re['date_to']; + $item->works = array(); + $qx = mysqli_query($conn,"SELECT id,title FROM `works` WHERE id IN (".$re['works'].")"); + while($re = mysqli_fetch_array($qx)) { + $ex = null; + $ex->id = $re['id']; + $ex->title = $re['title']; + array_push($item->works, $ex); + } + } else if($_GET['type'] == 'works') { + $item->type = $re['type']; + $item->exhibitions = array(); + $qx = mysqli_query($conn,"SELECT id,title FROM `exhibitions` WHERE id IN (".$re['exhibitions'].")"); + while($re = mysqli_fetch_array($qx)) { + $ex = null; + $ex->id = $re['id']; + $ex->title = $re['title']; + array_push($item->exhibitions, $ex); + } + } + $content->item = $item; + } + break; +} + + +header('Access-Control-Allow-Origin: *'); +header('Content-Type: application/json'); +echo json_encode($content); + +?> diff --git a/src/app/app-layout/app-layout.component.ts b/src/app/app-layout/app-layout.component.ts index 7174112..0b874c6 100644 --- a/src/app/app-layout/app-layout.component.ts +++ b/src/app/app-layout/app-layout.component.ts @@ -8,7 +8,7 @@ import type { Container } from 'tsparticles' }) export class AppLayoutComponent implements OnInit { - public particlesEnabled: boolean = true + public particlesEnabled: boolean = false public id: string = 'tsparticles' public particlesOptions: any = { diff --git a/src/app/app-routing.module.ts b/src/app/app-routing.module.ts index 1b2066f..83b3dbc 100644 --- a/src/app/app-routing.module.ts +++ b/src/app/app-routing.module.ts @@ -21,7 +21,11 @@ const routes: Routes = [ { path: 'workshops', component: PortfolioComponent }, { path: 'detail', component: DetailComponent, children: [ - { path: '**', component: DetailComponent } + { path: '**', component: DetailComponent, + children: [ + { path: '**', component: DetailComponent } + ] + } ] } diff --git a/src/app/detail/detail.component.html b/src/app/detail/detail.component.html index 408cb39..f5aa256 100644 --- a/src/app/detail/detail.component.html +++ b/src/app/detail/detail.component.html @@ -3,7 +3,19 @@

{{details.title}}

-
- Tags: {{details.tags}} +
+ Tags: {{details.tags}} + + Exhibitions: + {{exhibition.title}} + + + Works: + {{work.title}} +
diff --git a/src/app/detail/detail.component.scss b/src/app/detail/detail.component.scss index 6900e99..aeeb2d8 100644 --- a/src/app/detail/detail.component.scss +++ b/src/app/detail/detail.component.scss @@ -22,13 +22,23 @@ .text { font-size: $font-18; text-align: justify; + padding-bottom: 40px; } - .tags { + .tags, + .links { display: block; font-size: $font-12; text-transform: uppercase; - padding-top: 40px; + padding: 5px 0; + + .link { + display: inline-block; + font-size: $font-12; + text-transform: uppercase; + padding: 0 5px; + cursor: pointer; + } } .back { diff --git a/src/app/detail/detail.component.ts b/src/app/detail/detail.component.ts index 760367f..9b5cf81 100644 --- a/src/app/detail/detail.component.ts +++ b/src/app/detail/detail.component.ts @@ -1,5 +1,5 @@ import { Component, OnInit } from '@angular/core' -import { Router, NavigationEnd } from '@angular/router' +import { Router, NavigationEnd, NavigationStart, ActivatedRoute } from '@angular/router' import { Location } from '@angular/common' import { ApisService } from '../services/apis.service' @@ -11,19 +11,24 @@ import { ApisService } from '../services/apis.service' export class DetailComponent implements OnInit { public details: any = {} + private history: string[] = [] constructor( private apisService: ApisService, private router: Router, - private location: Location - ){ } + private location: Location, + private activeRoute: ActivatedRoute + ) { } ngOnInit(): void { - this.showDetails(this.router.url.split('/')[2]) + this.showDetails(this.router.url.split('/')[2], this.router.url.split('/')[3]) } - showDetails(id): void { - this.apisService.getDetails(id).toPromise().then((response) => { + showDetails(section, id): void { + this.apisService.getDetails(section, id).toPromise().then((response) => { + if(this.history[this.history.length - 1] != `/detail/${section}/${id}`) { + this.history.push(`/detail/${section}/${id}`) + } this.details = response.item },(error) => { console.error('getPortfolio ERROR', error) @@ -32,7 +37,14 @@ export class DetailComponent implements OnInit { }) } - back() { - this.location.back() + back(): void { + this.history.pop() + if(this.history.length > 0) { + const last = this.history[this.history.length - 1] + this.showDetails(last.split('/')[2], last.split('/')[3]) + this.location.back() + } else { + this.location.back() + } } } diff --git a/src/app/portfolio/portfolio.component.ts b/src/app/portfolio/portfolio.component.ts index ecdf1e1..6bf8d0f 100644 --- a/src/app/portfolio/portfolio.component.ts +++ b/src/app/portfolio/portfolio.component.ts @@ -27,7 +27,8 @@ export class PortfolioComponent implements OnInit { } showDetails(id): void { - this.router.navigate([`/detail/${id}`]) + const section = this.router.url.split('/')[1] == 'exhibitions' ? 'exhibitions' : 'works' + this.router.navigate([`/detail/${section}/${id}`]) } } diff --git a/src/app/services/apis.service.ts b/src/app/services/apis.service.ts index 3df86b3..ce4e16d 100644 --- a/src/app/services/apis.service.ts +++ b/src/app/services/apis.service.ts @@ -23,8 +23,8 @@ export class ApisService extends BaseService { ) } - getDetails(id): Observable { - let urlApi = `${this.restApi}?query=single&id=${id}` + getDetails(section, id): Observable { + let urlApi = `${this.restApi}?query=detail&type=${section}&id=${id}` return this.http.get(urlApi).pipe( catchError(this.handleError) ) diff --git a/src/environments/environment.ts b/src/environments/environment.ts index 2128c6d..4e9ecb9 100644 --- a/src/environments/environment.ts +++ b/src/environments/environment.ts @@ -1,5 +1,5 @@ export const environment = { production: false, - API_URL: `http://localhost/dslak_website/apis/` + API_URL: `http://dslakng.local/apis/` } From dd15765127d763bda76e865c35c057269e2c386b Mon Sep 17 00:00:00 2001 From: Dslak Date: Thu, 3 Dec 2020 13:37:49 +0100 Subject: [PATCH 11/38] add linked exhibitions and dates --- src/app/detail/detail.component.html | 8 +++++++ src/app/detail/detail.component.scss | 22 ++++++++++++++++-- src/app/detail/detail.component.ts | 10 +++++++-- src/app/portfolio/portfolio.component.html | 14 +++++++++++- src/app/portfolio/portfolio.component.scss | 26 ++++++++++++++++++++++ src/app/portfolio/portfolio.component.ts | 7 ++++-- src/assets/scss/global.scss | 14 ++++++++++++ 7 files changed, 94 insertions(+), 7 deletions(-) diff --git a/src/app/detail/detail.component.html b/src/app/detail/detail.component.html index f5aa256..d9eed73 100644 --- a/src/app/detail/detail.component.html +++ b/src/app/detail/detail.component.html @@ -3,6 +3,14 @@

{{details.title}}

+ +
+ from + on + {{details.date_from | date}} + to {{details.date_to | date}} +
+
Tags: {{details.tags}} diff --git a/src/app/detail/detail.component.scss b/src/app/detail/detail.component.scss index aeeb2d8..6d7c7c9 100644 --- a/src/app/detail/detail.component.scss +++ b/src/app/detail/detail.component.scss @@ -13,7 +13,7 @@ border-radius: 10px; .title { - margin-top: 0; + margin: 0; font-size: $font-34; font-weight: bold; text-transform: uppercase; @@ -22,7 +22,25 @@ .text { font-size: $font-18; text-align: justify; - padding-bottom: 40px; + padding: 40px 0; + } + + .date-container { + display: inline-flex; + position: absolute; + top: 40px; + right: 40px; + + .date { + display: inline-flex; + margin: auto; + font-size: $font-20; + } + + .date-indication { + margin: 2px 5px auto 5px; + font-size: $font-12; + } } .tags, diff --git a/src/app/detail/detail.component.ts b/src/app/detail/detail.component.ts index 9b5cf81..1b0c36a 100644 --- a/src/app/detail/detail.component.ts +++ b/src/app/detail/detail.component.ts @@ -11,6 +11,8 @@ import { ApisService } from '../services/apis.service' export class DetailComponent implements OnInit { public details: any = {} + public section: string = '' + public id: number = 0 private history: string[] = [] constructor( @@ -21,7 +23,9 @@ export class DetailComponent implements OnInit { ) { } ngOnInit(): void { - this.showDetails(this.router.url.split('/')[2], this.router.url.split('/')[3]) + this.section = this.router.url.split('/')[2] + this.id = parseInt(this.router.url.split('/')[3]) + this.showDetails(this.section, this.id) } showDetails(section, id): void { @@ -41,7 +45,9 @@ export class DetailComponent implements OnInit { this.history.pop() if(this.history.length > 0) { const last = this.history[this.history.length - 1] - this.showDetails(last.split('/')[2], last.split('/')[3]) + this.section = last.split('/')[2] + this.id = parseInt(last.split('/')[3]) + this.showDetails(this.section, this.id) this.location.back() } else { this.location.back() diff --git a/src/app/portfolio/portfolio.component.html b/src/app/portfolio/portfolio.component.html index 3f9d61a..094f09d 100644 --- a/src/app/portfolio/portfolio.component.html +++ b/src/app/portfolio/portfolio.component.html @@ -6,7 +6,19 @@
{{item.title}} - {{item.type}} + {{item.type}} + +
+
+ from + on + {{item.date_from | date}} +
+
+ to {{item.date_to | date}} +
+
+ {{item.tags}}
diff --git a/src/app/portfolio/portfolio.component.scss b/src/app/portfolio/portfolio.component.scss index a0965c4..4bf8974 100644 --- a/src/app/portfolio/portfolio.component.scss +++ b/src/app/portfolio/portfolio.component.scss @@ -61,6 +61,32 @@ font-weight: bold; padding-top: 10px; } + + .date-container { + display: inline-flex; + flex-wrap: wrap; + + .date-row { + display: block; + width: 100%; + + .date { + display: inline-flex; + margin: auto; + font-size: $font-20; + } + + .date-indication { + margin: 2px 5px auto 5px; + font-size: $font-12; + } + + &:nth-of-type(2) { + margin-top: -12px; + } + } + } + } @each $angle in 0,1,2,3,4,5,6 { diff --git a/src/app/portfolio/portfolio.component.ts b/src/app/portfolio/portfolio.component.ts index 6bf8d0f..1902028 100644 --- a/src/app/portfolio/portfolio.component.ts +++ b/src/app/portfolio/portfolio.component.ts @@ -10,6 +10,7 @@ import { ApisService } from '../services/apis.service' export class PortfolioComponent implements OnInit { public portfolioItems: any = [] + public section: string = '' constructor( private apisService: ApisService, @@ -17,7 +18,9 @@ export class PortfolioComponent implements OnInit { { } ngOnInit(): void { - this.apisService.getPortfolio(this.router.url.split('/')[1]).toPromise().then((response) => { + this.section = this.router.url.split('/')[1] + + this.apisService.getPortfolio(this.section).toPromise().then((response) => { this.portfolioItems = response.items },(error) => { console.error('getPortfolio ERROR', error) @@ -27,7 +30,7 @@ export class PortfolioComponent implements OnInit { } showDetails(id): void { - const section = this.router.url.split('/')[1] == 'exhibitions' ? 'exhibitions' : 'works' + const section = this.section == 'exhibitions' ? 'exhibitions' : 'works' this.router.navigate([`/detail/${section}/${id}`]) } diff --git a/src/assets/scss/global.scss b/src/assets/scss/global.scss index 97bdc40..c575f20 100644 --- a/src/assets/scss/global.scss +++ b/src/assets/scss/global.scss @@ -14,6 +14,20 @@ body { } } +a, +li, +button { + outline: none !important; + &:active, + &:focus { + outline: none !important; + } +} + +.w-100 { + width: 100%; +} + .particles { position: fixed; From 6f3926de17b5122364abb7d357c788cb7837f1de Mon Sep 17 00:00:00 2001 From: Dslak Date: Thu, 3 Dec 2020 14:40:43 +0100 Subject: [PATCH 12/38] add video --- src/apis/index.php | 1 + src/app/detail/detail.component.html | 17 +++++++++++++++++ src/app/detail/detail.component.scss | 21 +++++++++++++++++++++ src/app/detail/detail.component.ts | 15 +++++++++++++-- 4 files changed, 52 insertions(+), 2 deletions(-) diff --git a/src/apis/index.php b/src/apis/index.php index 8adaa9a..2505490 100644 --- a/src/apis/index.php +++ b/src/apis/index.php @@ -71,6 +71,7 @@ switch($_GET['query']) { } } else if($_GET['type'] == 'works') { $item->type = $re['type']; + $item->videos = $re['videos']; $item->exhibitions = array(); $qx = mysqli_query($conn,"SELECT id,title FROM `exhibitions` WHERE id IN (".$re['exhibitions'].")"); while($re = mysqli_fetch_array($qx)) { diff --git a/src/app/detail/detail.component.html b/src/app/detail/detail.component.html index d9eed73..3840c58 100644 --- a/src/app/detail/detail.component.html +++ b/src/app/detail/detail.component.html @@ -12,6 +12,23 @@
+ +
+
+ {{video.title}} +
+ {{video.code}} + +
+
+
+ + Tags: {{details.tags}} Exhibitions: diff --git a/src/app/detail/detail.component.scss b/src/app/detail/detail.component.scss index 6d7c7c9..e7516ba 100644 --- a/src/app/detail/detail.component.scss +++ b/src/app/detail/detail.component.scss @@ -43,6 +43,27 @@ } } + .videos { + .video-title { + font-size: $font-18; + font-weight: bold; + padding-bottom: 5px; + } + + .youtube { + position: relative; + padding-bottom: 56.25%; + + .iframe{ + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + } + } + } + .tags, .links { display: block; diff --git a/src/app/detail/detail.component.ts b/src/app/detail/detail.component.ts index 1b0c36a..724e402 100644 --- a/src/app/detail/detail.component.ts +++ b/src/app/detail/detail.component.ts @@ -1,5 +1,6 @@ import { Component, OnInit } from '@angular/core' import { Router, NavigationEnd, NavigationStart, ActivatedRoute } from '@angular/router' +import { DomSanitizer } from '@angular/platform-browser' import { Location } from '@angular/common' import { ApisService } from '../services/apis.service' @@ -19,7 +20,8 @@ export class DetailComponent implements OnInit { private apisService: ApisService, private router: Router, private location: Location, - private activeRoute: ActivatedRoute + private activeRoute: ActivatedRoute, + private sanitizer: DomSanitizer ) { } ngOnInit(): void { @@ -33,7 +35,16 @@ export class DetailComponent implements OnInit { if(this.history[this.history.length - 1] != `/detail/${section}/${id}`) { this.history.push(`/detail/${section}/${id}`) } - this.details = response.item + + const detail = response.item + detail.videos = detail.videos ? JSON.parse(detail.videos) : [] + detail.videos.forEach((e) => { + e.code = e.url.split('/').pop() + e.embed = this.sanitizer.bypassSecurityTrustResourceUrl(`https://www.youtube.com/embed/${e.code}`) + }) + this.details = detail + console.log(response.item) + },(error) => { console.error('getPortfolio ERROR', error) }).catch((e) => { From 2634aa53101a9cd55215b992a1aa312845cb9212 Mon Sep 17 00:00:00 2001 From: Dslak Date: Thu, 3 Dec 2020 15:09:02 +0100 Subject: [PATCH 13/38] add gallery --- src/apis/index.php | 1 + src/app/detail/detail.component.html | 13 +++++++++++++ src/app/detail/detail.component.scss | 25 +++++++++++++++++++++++++ src/app/detail/detail.component.ts | 1 + 4 files changed, 40 insertions(+) diff --git a/src/apis/index.php b/src/apis/index.php index 2505490..830ff2e 100644 --- a/src/apis/index.php +++ b/src/apis/index.php @@ -72,6 +72,7 @@ switch($_GET['query']) { } else if($_GET['type'] == 'works') { $item->type = $re['type']; $item->videos = $re['videos']; + $item->gallery = $re['gallery']; $item->exhibitions = array(); $qx = mysqli_query($conn,"SELECT id,title FROM `exhibitions` WHERE id IN (".$re['exhibitions'].")"); while($re = mysqli_fetch_array($qx)) { diff --git a/src/app/detail/detail.component.html b/src/app/detail/detail.component.html index 3840c58..02f93e2 100644 --- a/src/app/detail/detail.component.html +++ b/src/app/detail/detail.component.html @@ -4,6 +4,19 @@

{{details.title}}

+ + +
from on diff --git a/src/app/detail/detail.component.scss b/src/app/detail/detail.component.scss index e7516ba..6fa4c52 100644 --- a/src/app/detail/detail.component.scss +++ b/src/app/detail/detail.component.scss @@ -43,6 +43,31 @@ } } + .gallery { + padding-top: 40px; + + .gallery-title { + font-size: $font-18; + font-weight: bold; + padding-bottom: 5px; + } + + .gallery-container { + position: relative; + //padding-bottom: 56.25%; + height: 180px; + + .image{ + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + object-fit: cover; + } + } + } + .videos { .video-title { font-size: $font-18; diff --git a/src/app/detail/detail.component.ts b/src/app/detail/detail.component.ts index 724e402..f620e03 100644 --- a/src/app/detail/detail.component.ts +++ b/src/app/detail/detail.component.ts @@ -42,6 +42,7 @@ export class DetailComponent implements OnInit { e.code = e.url.split('/').pop() e.embed = this.sanitizer.bypassSecurityTrustResourceUrl(`https://www.youtube.com/embed/${e.code}`) }) + detail.gallery = detail.gallery ? JSON.parse(detail.gallery) : [] this.details = detail console.log(response.item) From 87ee5e08d22330f6de0aa206e4943eece7ff0d82 Mon Sep 17 00:00:00 2001 From: Dslak Date: Thu, 3 Dec 2020 15:33:33 +0100 Subject: [PATCH 14/38] add image gallery zoom component --- package.json | 1 + src/app/app.module.ts | 2 + src/app/detail/detail.component.html | 19 ++++- src/app/detail/detail.component.scss | 7 ++ src/app/detail/detail.component.ts | 88 +++++++++++++++++++++- src/app/portfolio/portfolio.component.scss | 7 -- 6 files changed, 112 insertions(+), 12 deletions(-) diff --git a/package.json b/package.json index 05dfa36..948d16c 100644 --- a/package.json +++ b/package.json @@ -22,6 +22,7 @@ "@angular/router": "~9.1.7", "bootstrap": "^4.5.3", "ng-particles": "^2.1.11", + "ngx-image-gallery": "^2.0.5", "rxjs": "~6.5.4", "tslib": "^1.10.0", "zone.js": "~0.10.2" diff --git a/src/app/app.module.ts b/src/app/app.module.ts index cb94103..ec33f1b 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -2,6 +2,7 @@ import { BrowserModule } from '@angular/platform-browser'; import { NgModule } from '@angular/core'; import { HttpClientModule } from '@angular/common/http'; import { NgParticlesModule } from "ng-particles"; +import { NgxImageGalleryModule } from 'ngx-image-gallery'; import { AppRoutingModule } from './app-routing.module'; import { AppComponent } from './app.component'; @@ -24,6 +25,7 @@ import { DetailComponent } from './detail/detail.component'; BrowserModule, AppRoutingModule, NgParticlesModule, + NgxImageGalleryModule, HttpClientModule ], providers: [], diff --git a/src/app/detail/detail.component.html b/src/app/detail/detail.component.html index 02f93e2..15c2be3 100644 --- a/src/app/detail/detail.component.html +++ b/src/app/detail/detail.component.html @@ -6,13 +6,13 @@ @@ -57,3 +57,14 @@
+ + + diff --git a/src/app/detail/detail.component.scss b/src/app/detail/detail.component.scss index 6fa4c52..5e764b1 100644 --- a/src/app/detail/detail.component.scss +++ b/src/app/detail/detail.component.scss @@ -64,6 +64,13 @@ width: 100%; height: 100%; object-fit: cover; + cursor: pointer; + transition: transform .4s; + + &:hover { + transform: scale(1.2) rotate(1deg); + z-index: 10; + } } } } diff --git a/src/app/detail/detail.component.ts b/src/app/detail/detail.component.ts index f620e03..4e4fba0 100644 --- a/src/app/detail/detail.component.ts +++ b/src/app/detail/detail.component.ts @@ -1,7 +1,8 @@ -import { Component, OnInit } from '@angular/core' +import { Component, OnInit, ViewChild } from '@angular/core' import { Router, NavigationEnd, NavigationStart, ActivatedRoute } from '@angular/router' import { DomSanitizer } from '@angular/platform-browser' import { Location } from '@angular/common' +import { NgxImageGalleryComponent, GALLERY_IMAGE, GALLERY_CONF } from "ngx-image-gallery" import { ApisService } from '../services/apis.service' @Component({ @@ -11,11 +12,21 @@ import { ApisService } from '../services/apis.service' }) export class DetailComponent implements OnInit { + @ViewChild(NgxImageGalleryComponent) ngxImageGallery: NgxImageGalleryComponent + public details: any = {} public section: string = '' public id: number = 0 private history: string[] = [] + public conf: GALLERY_CONF = { + imageOffset: '0px', + showDeleteControl: false, + showImageTitle: false, + } + + public galleryImages: GALLERY_IMAGE[] = [] + constructor( private apisService: ApisService, private router: Router, @@ -43,6 +54,15 @@ export class DetailComponent implements OnInit { e.embed = this.sanitizer.bypassSecurityTrustResourceUrl(`https://www.youtube.com/embed/${e.code}`) }) detail.gallery = detail.gallery ? JSON.parse(detail.gallery) : [] + + detail.gallery.forEach((e) => { + this.galleryImages.push({ + url: e.url, + altText: e.title, + title: e.title, + thumbnailUrl: e.url + }) + }) this.details = detail console.log(response.item) @@ -65,4 +85,70 @@ export class DetailComponent implements OnInit { this.location.back() } } + + + + + + + + + + + + + + + + openGallery(index: number = 0) { + this.ngxImageGallery.open(index); + } + + // close gallery + closeGallery() { + this.ngxImageGallery.close(); + } + + // set new active(visible) image in gallery + newImage(index: number = 0) { + this.ngxImageGallery.setActiveImage(index); + } + + // next image in gallery + nextImage(index: number = 0) { + this.ngxImageGallery.next(); + } + + // prev image in gallery + prevImage(index: number = 0) { + this.ngxImageGallery.prev(); + } + + /**************************************************/ + + // EVENTS + // callback on gallery opened + galleryOpened(index) { + console.info('Gallery opened at index ', index); + } + + // callback on gallery closed + galleryClosed() { + console.info('Gallery closed.'); + } + + // callback on gallery image clicked + galleryImageClicked(index) { + console.info('Gallery image clicked with index ', index); + } + + // callback on gallery image changed + galleryImageChanged(index) { + console.info('Gallery image changed to index ', index); + } + + // callback on user clicked delete button + deleteImage(index) { + console.info('Delete image at index ', index); + } } diff --git a/src/app/portfolio/portfolio.component.scss b/src/app/portfolio/portfolio.component.scss index 4bf8974..d799a61 100644 --- a/src/app/portfolio/portfolio.component.scss +++ b/src/app/portfolio/portfolio.component.scss @@ -92,13 +92,6 @@ @each $angle in 0,1,2,3,4,5,6 { &.skew-#{$angle} { transform: skew(#{$angle - 3}deg, #{$angle - 3}deg); - /*animation: zoom#{$angle} #{$angle + 3}s ease-in infinite forwards; - @keyframes zoom#{$angle} { - 0% { transform: scale(1) skew(#{$angle - 3}deg, #{$angle - 3}deg); } - 50% { transform: scale(1.1) skew(#{$angle - 3}deg, #{$angle - 3}deg); } - 75% { transform: scale(.9) skew(#{$angle - 3}deg, #{$angle - 3}deg); } - 100% { transform: scale(1) skew(#{$angle - 3}deg, #{$angle - 3}deg); } - }*/ } } From 023840f0b5dc968275e6f6a9e9b31becc5fffc2d Mon Sep 17 00:00:00 2001 From: Dslak Date: Thu, 3 Dec 2020 15:40:20 +0100 Subject: [PATCH 15/38] remove log --- src/app/detail/detail.component.ts | 1 - 1 file changed, 1 deletion(-) diff --git a/src/app/detail/detail.component.ts b/src/app/detail/detail.component.ts index 4e4fba0..8a0eb7f 100644 --- a/src/app/detail/detail.component.ts +++ b/src/app/detail/detail.component.ts @@ -64,7 +64,6 @@ export class DetailComponent implements OnInit { }) }) this.details = detail - console.log(response.item) },(error) => { console.error('getPortfolio ERROR', error) From 053b24b9776add9d3d0086ee22694a112842a569 Mon Sep 17 00:00:00 2001 From: Dslak Date: Thu, 3 Dec 2020 17:56:52 +0100 Subject: [PATCH 16/38] add autehntication --- src/apis/auth.php | 29 ++++++++++ src/app/admin/admin.component.html | 28 ++++++++++ src/app/admin/admin.component.scss | 58 ++++++++++++++++++++ src/app/admin/admin.component.spec.ts | 25 +++++++++ src/app/admin/admin.component.ts | 49 +++++++++++++++++ src/app/app-layout/app-layout.component.html | 5 +- src/app/app-layout/app-layout.component.ts | 5 +- src/app/app-routing.module.ts | 5 +- src/app/app.module.ts | 4 +- src/app/services/apis.service.ts | 1 + src/app/services/auth.service.spec.ts | 16 ++++++ src/app/services/auth.service.spec.ts_ | 16 ++++++ src/app/services/auth.service.ts | 33 +++++++++++ src/app/services/auth.service.ts_ | 27 +++++++++ 14 files changed, 295 insertions(+), 6 deletions(-) create mode 100755 src/apis/auth.php create mode 100644 src/app/admin/admin.component.html create mode 100644 src/app/admin/admin.component.scss create mode 100644 src/app/admin/admin.component.spec.ts create mode 100644 src/app/admin/admin.component.ts create mode 100644 src/app/services/auth.service.spec.ts create mode 100644 src/app/services/auth.service.spec.ts_ create mode 100644 src/app/services/auth.service.ts create mode 100644 src/app/services/auth.service.ts_ diff --git a/src/apis/auth.php b/src/apis/auth.php new file mode 100755 index 0000000..581c326 --- /dev/null +++ b/src/apis/auth.php @@ -0,0 +1,29 @@ +status = 404; + +if(isset($_POST['act']) && $_POST['act'] == 'auth') { + if($_POST['usr'] == 'admin' && $_POST['pwd'] == 'JohnHolmes') { + $content->status = 200; + $content->authToken = md5(date("Y-m-d")); + } else { + $content->status = 403; + } +} else if(isset($_POST['act']) && $_POST['act'] == 'check') { + if($_POST['token'] == md5(date("Y-m-d"))) { + $content->status = 200; + $content->authToken = md5(date("Y-m-d")); + } else { + $content->status = 403; + } +} + +header('Access-Control-Allow-Origin: *'); +header('Content-Type: application/json'); +echo json_encode($content); + +?> diff --git a/src/app/admin/admin.component.html b/src/app/admin/admin.component.html new file mode 100644 index 0000000..717bddf --- /dev/null +++ b/src/app/admin/admin.component.html @@ -0,0 +1,28 @@ +
+
+
+ +
+
+ +
+ +
+
diff --git a/src/app/admin/admin.component.scss b/src/app/admin/admin.component.scss new file mode 100644 index 0000000..08ad394 --- /dev/null +++ b/src/app/admin/admin.component.scss @@ -0,0 +1,58 @@ +@import "../../assets/scss/variables"; + +.component-admin { + + .login-form-container { + text-align: center; + padding: 40px; + color: $white; + + .input { + width: 100%; + } + + .button { + background: $black; + } + } + + .menu { + background: $dark-gray; + + .section-title { + display: block; + width: 100%; + padding: 50px 10px 10px; + font-size: $font-22; + font-weight: bolder; + text-transform: uppercase; + color: $white; + text-align: center; + border-bottom: 1px dotted $white-alpha; + } + + .action { + display: block; + appearance: none; + border: none; + width: 100%; + padding: 10px; + font-size: $font-14; + text-transform: uppercase; + color: $white; + background: $dark-gray; + cursor: pointer; + border-bottom: 1px dotted $white-alpha; + } + } +} + +@media (min-width: map-get($grid-breakpoints, 'md')) { + .component-admin { + .menu { + height: 100vh; + background: $dark-gray; + } + } + +} diff --git a/src/app/admin/admin.component.spec.ts b/src/app/admin/admin.component.spec.ts new file mode 100644 index 0000000..72e742f --- /dev/null +++ b/src/app/admin/admin.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { AdminComponent } from './admin.component'; + +describe('AdminComponent', () => { + let component: AdminComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ AdminComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(AdminComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/admin/admin.component.ts b/src/app/admin/admin.component.ts new file mode 100644 index 0000000..18082e0 --- /dev/null +++ b/src/app/admin/admin.component.ts @@ -0,0 +1,49 @@ +import { Component, OnInit } from '@angular/core' +import { AuthService } from '../services/auth.service' + +@Component({ + selector: 'app-admin', + templateUrl: './admin.component.html', + styleUrls: ['./admin.component.scss'] +}) +export class AdminComponent implements OnInit { + + public authCheck: boolean = false + + constructor(private authService: AuthService) { } + + ngOnInit(): void { + + const body = { + token: window.sessionStorage.getItem('authToken') + } + + this.authService.authCheck(body).toPromise().then((response) => { + this.authCheck = response.status == 200 + },(error) => { + console.error('Auth ERROR', error) + }).catch((e) => { + console.error('Auth CATCH', e) + }) + } + + + login(): void { + + const body = { + usr: 'admin', + pwd: 'JohnHolmes' + } + this.authService.login(body).toPromise().then((response) => { + this.authCheck = response.status == 200 + if(this.authCheck) { + window.sessionStorage.setItem('authToken', response.authToken) + } + },(error) => { + console.error('Auth ERROR', error) + }).catch((e) => { + console.error('Auth CATCH', e) + }) + + } +} diff --git a/src/app/app-layout/app-layout.component.html b/src/app/app-layout/app-layout.component.html index 10a7dc1..89a86da 100644 --- a/src/app/app-layout/app-layout.component.html +++ b/src/app/app-layout/app-layout.component.html @@ -1,4 +1,5 @@ - + - + diff --git a/src/app/app-layout/app-layout.component.ts b/src/app/app-layout/app-layout.component.ts index 0b874c6..956d7d3 100644 --- a/src/app/app-layout/app-layout.component.ts +++ b/src/app/app-layout/app-layout.component.ts @@ -1,4 +1,5 @@ import { Component, OnInit } from '@angular/core' +import { Router } from '@angular/router' import type { Container } from 'tsparticles' @Component({ @@ -8,6 +9,7 @@ import type { Container } from 'tsparticles' }) export class AppLayoutComponent implements OnInit { + public page: string = '/' public particlesEnabled: boolean = false public id: string = 'tsparticles' @@ -90,9 +92,10 @@ export class AppLayoutComponent implements OnInit { detectRetina: true } - constructor() { } + constructor(private router: Router) { } ngOnInit(): void { + this.page = this.router.url } diff --git a/src/app/app-routing.module.ts b/src/app/app-routing.module.ts index 83b3dbc..453d579 100644 --- a/src/app/app-routing.module.ts +++ b/src/app/app-routing.module.ts @@ -4,6 +4,7 @@ import { AppLayoutComponent } from './app-layout/app-layout.component' import { AboutComponent } from './about/about.component' import { PortfolioComponent } from './portfolio/portfolio.component' import { DetailComponent } from './detail/detail.component' +import { AdminComponent } from './admin/admin.component' const routes: Routes = [ { @@ -27,8 +28,8 @@ const routes: Routes = [ ] } ] - } - + }, + { path: 'admin', component: AdminComponent } ] } ] diff --git a/src/app/app.module.ts b/src/app/app.module.ts index ec33f1b..4962f37 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -11,6 +11,7 @@ import { AppLayoutComponent } from './app-layout/app-layout.component'; import { AboutComponent } from './about/about.component'; import { PortfolioComponent } from './portfolio/portfolio.component'; import { DetailComponent } from './detail/detail.component'; +import { AdminComponent } from './admin/admin.component'; @NgModule({ declarations: [ @@ -19,7 +20,8 @@ import { DetailComponent } from './detail/detail.component'; AppLayoutComponent, AboutComponent, PortfolioComponent, - DetailComponent + DetailComponent, + AdminComponent ], imports: [ BrowserModule, diff --git a/src/app/services/apis.service.ts b/src/app/services/apis.service.ts index ce4e16d..3e02ae0 100644 --- a/src/app/services/apis.service.ts +++ b/src/app/services/apis.service.ts @@ -30,4 +30,5 @@ export class ApisService extends BaseService { ) } + } diff --git a/src/app/services/auth.service.spec.ts b/src/app/services/auth.service.spec.ts new file mode 100644 index 0000000..f1251ca --- /dev/null +++ b/src/app/services/auth.service.spec.ts @@ -0,0 +1,16 @@ +import { TestBed } from '@angular/core/testing'; + +import { AuthService } from './auth.service'; + +describe('AuthService', () => { + let service: AuthService; + + beforeEach(() => { + TestBed.configureTestingModule({}); + service = TestBed.inject(AuthService); + }); + + it('should be created', () => { + expect(service).toBeTruthy(); + }); +}); diff --git a/src/app/services/auth.service.spec.ts_ b/src/app/services/auth.service.spec.ts_ new file mode 100644 index 0000000..f1251ca --- /dev/null +++ b/src/app/services/auth.service.spec.ts_ @@ -0,0 +1,16 @@ +import { TestBed } from '@angular/core/testing'; + +import { AuthService } from './auth.service'; + +describe('AuthService', () => { + let service: AuthService; + + beforeEach(() => { + TestBed.configureTestingModule({}); + service = TestBed.inject(AuthService); + }); + + it('should be created', () => { + expect(service).toBeTruthy(); + }); +}); diff --git a/src/app/services/auth.service.ts b/src/app/services/auth.service.ts new file mode 100644 index 0000000..3ee8d3c --- /dev/null +++ b/src/app/services/auth.service.ts @@ -0,0 +1,33 @@ +import { Injectable } from '@angular/core' +import { HttpClient, HttpHeaders, HttpParams, HttpRequest } from '@angular/common/http' +import { Observable, Subject, throwError } from 'rxjs' +import { catchError } from 'rxjs/operators' +import { BaseService } from './base-service' +import { environment } from '../../environments/environment' + +@Injectable({ + providedIn: 'root' +}) +export class AuthService extends BaseService { + + private restApi = `${environment.API_URL}` + + constructor(private http: HttpClient) { + super() + } + + login(body): Observable { + let urlApi = `${this.restApi}auth.php?act=login` + return this.http.post(urlApi, JSON.stringify(body)).pipe( + catchError(this.handleError) + ) + } + + authCheck(body): Observable { + let urlApi = `${this.restApi}auth.php?act=check` + return this.http.post(urlApi, JSON.stringify(body)).pipe( + catchError(this.handleError) + ) + } + +} diff --git a/src/app/services/auth.service.ts_ b/src/app/services/auth.service.ts_ new file mode 100644 index 0000000..dd4e29d --- /dev/null +++ b/src/app/services/auth.service.ts_ @@ -0,0 +1,27 @@ +import { Injectable } from '@angular/core' +import { HttpClient, HttpHeaders, HttpParams, HttpRequest } from '@angular/common/http' +import { Observable, Subject, throwError } from 'rxjs' +import { catchError } from 'rxjs/operators' +import { BaseService } from './base-service' +import { environment } from '../../environments/environment' + +@Injectable({ + providedIn: 'root' +}) +export class AuthService extends BaseService { + + private restApi = `${environment.API_URL}` + + constructor(private http: HttpClient) { + super() + } + + login(body): Observable { + let urlApi = `${this.restApi}auth.php` + return this.http.post(urlApi, body).pipe( + catchError(this.handleError) + ) + } + + +} From 4d67f36c578475cf05ecbe406fb8b486e2c89586 Mon Sep 17 00:00:00 2001 From: Dslak Date: Thu, 3 Dec 2020 18:15:33 +0100 Subject: [PATCH 17/38] add autentication --- src/apis/auth.php | 21 ++-- src/apis/index.php | 170 ++++++++++++++++------------- src/app/admin/admin.component.html | 12 +- src/app/admin/admin.component.scss | 6 +- src/app/admin/admin.component.ts | 6 +- src/app/app.module.ts | 2 + src/assets/scss/forms.scss | 76 +++++++++++++ src/assets/scss/main.scss | 1 + 8 files changed, 198 insertions(+), 96 deletions(-) create mode 100644 src/assets/scss/forms.scss diff --git a/src/apis/auth.php b/src/apis/auth.php index 581c326..1e206e5 100755 --- a/src/apis/auth.php +++ b/src/apis/auth.php @@ -4,26 +4,29 @@ $GLOBALS['conn']; $conn=@mysqli_connect($DATAhst,$DATAusr,$DATApwd,$DATAdtb)or die("CONNECTION ERROR"); $content = null; -$content->status = 404; +$content->status = array(); +$data = json_decode(file_get_contents("php://input")); -if(isset($_POST['act']) && $_POST['act'] == 'auth') { - if($_POST['usr'] == 'admin' && $_POST['pwd'] == 'JohnHolmes') { +if(isset($_GET['act']) && $_GET['act'] == 'login') { + if($data->usr == 'admin' && $data->pwd == 'JohnHolmes') { $content->status = 200; - $content->authToken = md5(date("Y-m-d")); + $content->authToken = base64_encode(date("Y-m-d")); } else { $content->status = 403; } -} else if(isset($_POST['act']) && $_POST['act'] == 'check') { - if($_POST['token'] == md5(date("Y-m-d"))) { +} else if(isset($_GET['act']) && $_GET['act'] == 'check') { + if($data->token == base64_encode(date("Y-m-d"))) { $content->status = 200; - $content->authToken = md5(date("Y-m-d")); + $content->authToken = base64_encode(date("Y-m-d")); } else { $content->status = 403; } } +header("Access-Control-Allow-Origin: *"); +header("Content-Type: application/json; charset=UTF-8"); +header("Access-Control-Allow-Methods: POST"); +header("Access-Control-Max-Age: 3600"); -header('Access-Control-Allow-Origin: *'); -header('Content-Type: application/json'); echo json_encode($content); ?> diff --git a/src/apis/index.php b/src/apis/index.php index 830ff2e..e8e2b18 100644 --- a/src/apis/index.php +++ b/src/apis/index.php @@ -4,92 +4,114 @@ $GLOBALS['conn']; $conn=@mysqli_connect($DATAhst,$DATAusr,$DATApwd,$DATAdtb)or die("CONNECTION ERROR"); $content = null; -$content->items = array(); -$filter = array("portfolio", "installations", "entertainment", "performances", "workshops"); +if(isset($_GET['query'])) { -switch($_GET['query']) { - case "portfolio": - case "installations": - case "entertainment": - case "performances": - case "workshops": - if($_GET['query'] == 'portfolio') {$filter = '';} else {$filter = "WHERE type='".$_GET['query']."'";} - $qe = mysqli_query($conn,"SELECT * FROM `works` $filter ORDER BY id DESC"); - if(mysqli_num_rows($qe) > 0) { - $content = null; - $content->items = array(); - while($re = mysqli_fetch_array($qe)) { - $item = null; - $item->id = $re['id']; - $item->title = $re['title']; - $item->type = $re['type']; - $item->tags = $re['tags']; - $item->image = $re['image']; - array_push($content->items, $item); + $content->items = array(); + switch($_GET['query']) { + case "portfolio": + case "installations": + case "entertainment": + case "performances": + case "workshops": + if($_GET['query'] == 'portfolio') {$filter = '';} else {$filter = "WHERE type='".$_GET['query']."'";} + $qe = mysqli_query($conn,"SELECT * FROM `works` $filter ORDER BY id DESC"); + if(mysqli_num_rows($qe) > 0) { + $content = null; + $content->items = array(); + while($re = mysqli_fetch_array($qe)) { + $item = null; + $item->id = $re['id']; + $item->title = $re['title']; + $item->type = $re['type']; + $item->tags = $re['tags']; + $item->image = $re['image']; + array_push($content->items, $item); + } + } + break; + case "exhibitions": + $qe = mysqli_query($conn,"SELECT * FROM `exhibitions` ORDER BY date_from DESC"); + if(mysqli_num_rows($qe) > 0) { + $content = null; + $content->items = array(); + while($re = mysqli_fetch_array($qe)) { + $item = null; + $item->id = $re['id']; + $item->title = $re['title']; + $item->date_from = $re['date_from']; + $item->date_to = $re['date_to']; + $item->tags = $re['tags']; + $item->image = $re['image']; + array_push($content->items, $item); + } } - } - break; - case "exhibitions": - $qe = mysqli_query($conn,"SELECT * FROM `exhibitions` ORDER BY date_from DESC"); - if(mysqli_num_rows($qe) > 0) { - $content = null; - $content->items = array(); - while($re = mysqli_fetch_array($qe)) { + break; + case "detail": + $qe = mysqli_query($conn,"SELECT * FROM `".$_GET['type']."` WHERE id=".$_GET['id']); + if(mysqli_num_rows($qe)>0) { + $content = null; + $re = mysqli_fetch_array($qe); $item = null; $item->id = $re['id']; $item->title = $re['title']; - $item->date_from = $re['date_from']; - $item->date_to = $re['date_to']; + $item->content = $re['content']; $item->tags = $re['tags']; $item->image = $re['image']; - array_push($content->items, $item); - } - } - break; - case "detail": - $qe = mysqli_query($conn,"SELECT * FROM `".$_GET['type']."` WHERE id=".$_GET['id']); - if(mysqli_num_rows($qe)>0) { - $content = null; - $re = mysqli_fetch_array($qe); - $item = null; - $item->id = $re['id']; - $item->title = $re['title']; - $item->content = $re['content']; - $item->tags = $re['tags']; - $item->image = $re['image']; - if($_GET['type'] == 'exhibitions') { - $item->date_from = $re['date_from']; - $item->date_to = $re['date_to']; - $item->works = array(); - $qx = mysqli_query($conn,"SELECT id,title FROM `works` WHERE id IN (".$re['works'].")"); - while($re = mysqli_fetch_array($qx)) { - $ex = null; - $ex->id = $re['id']; - $ex->title = $re['title']; - array_push($item->works, $ex); - } - } else if($_GET['type'] == 'works') { - $item->type = $re['type']; - $item->videos = $re['videos']; - $item->gallery = $re['gallery']; - $item->exhibitions = array(); - $qx = mysqli_query($conn,"SELECT id,title FROM `exhibitions` WHERE id IN (".$re['exhibitions'].")"); - while($re = mysqli_fetch_array($qx)) { - $ex = null; - $ex->id = $re['id']; - $ex->title = $re['title']; - array_push($item->exhibitions, $ex); + if($_GET['type'] == 'exhibitions') { + $item->date_from = $re['date_from']; + $item->date_to = $re['date_to']; + $item->works = array(); + $qx = mysqli_query($conn,"SELECT id,title FROM `works` WHERE id IN (".$re['works'].")"); + while($re = mysqli_fetch_array($qx)) { + $ex = null; + $ex->id = $re['id']; + $ex->title = $re['title']; + array_push($item->works, $ex); + } + } else if($_GET['type'] == 'works') { + $item->type = $re['type']; + $item->videos = $re['videos']; + $item->gallery = $re['gallery']; + $item->exhibitions = array(); + $qx = mysqli_query($conn,"SELECT id,title FROM `exhibitions` WHERE id IN (".$re['exhibitions'].")"); + while($re = mysqli_fetch_array($qx)) { + $ex = null; + $ex->id = $re['id']; + $ex->title = $re['title']; + array_push($item->exhibitions, $ex); + } } + $content->item = $item; } - $content->item = $item; - } - break; -} + break; + } +} else if(isset($_GET['auth'])) { + switch($_GET['auth']) { + case 'auth': + if($_POST['usr'] == 'admin' && $_POST['pwd'] == 'JohnHolmes') { + $content->status = 200; + $content->authToken = md5(date("Y-m-d")); + } else { + $content->status = 403; + } + break; + case 'check': + if($_POST['token'] == md5(date("Y-m-d"))) { + $content->status = 200; + $content->authToken = md5(date("Y-m-d")); + } else { + $content->status = 403; + } + break; + } +} -header('Access-Control-Allow-Origin: *'); -header('Content-Type: application/json'); +header("Access-Control-Allow-Origin: *"); +header("Content-Type: application/json; charset=UTF-8"); +header("Access-Control-Allow-Methods: GET"); +header("Access-Control-Max-Age: 3600"); echo json_encode($content); ?> diff --git a/src/app/admin/admin.component.html b/src/app/admin/admin.component.html index 717bddf..618f8eb 100644 --- a/src/app/admin/admin.component.html +++ b/src/app/admin/admin.component.html @@ -1,19 +1,19 @@
-
diff --git a/src/app/admin/admin.component.scss b/src/app/admin/admin.component.scss index 08ad394..af3b1e3 100644 --- a/src/app/admin/admin.component.scss +++ b/src/app/admin/admin.component.scss @@ -7,12 +7,8 @@ padding: 40px; color: $white; - .input { - width: 100%; - } - .button { - background: $black; + width: 300px; } } diff --git a/src/app/admin/admin.component.ts b/src/app/admin/admin.component.ts index 18082e0..d8aa620 100644 --- a/src/app/admin/admin.component.ts +++ b/src/app/admin/admin.component.ts @@ -9,6 +9,8 @@ import { AuthService } from '../services/auth.service' export class AdminComponent implements OnInit { public authCheck: boolean = false + public userName: string = '' + public password: string = '' constructor(private authService: AuthService) { } @@ -31,8 +33,8 @@ export class AdminComponent implements OnInit { login(): void { const body = { - usr: 'admin', - pwd: 'JohnHolmes' + usr: this.userName, + pwd: this.password } this.authService.login(body).toPromise().then((response) => { this.authCheck = response.status == 200 diff --git a/src/app/app.module.ts b/src/app/app.module.ts index 4962f37..ac157ca 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -3,6 +3,7 @@ import { NgModule } from '@angular/core'; import { HttpClientModule } from '@angular/common/http'; import { NgParticlesModule } from "ng-particles"; import { NgxImageGalleryModule } from 'ngx-image-gallery'; +import { FormsModule } from '@angular/forms' import { AppRoutingModule } from './app-routing.module'; import { AppComponent } from './app.component'; @@ -28,6 +29,7 @@ import { AdminComponent } from './admin/admin.component'; AppRoutingModule, NgParticlesModule, NgxImageGalleryModule, + FormsModule, HttpClientModule ], providers: [], diff --git a/src/assets/scss/forms.scss b/src/assets/scss/forms.scss new file mode 100644 index 0000000..28abac5 --- /dev/null +++ b/src/assets/scss/forms.scss @@ -0,0 +1,76 @@ + + +input, +button, +textarea { + border: none; + border-radius: 4px; + background: $white; + appearance: none; + font-family: $font-primary; + font-size: $font-20; + resize: none; + &::-ms-clear { + display: none; + } + &:focus {outline:none;} + &::-moz-focus-inner {border:0;} +} + +input[type=text], +input[type=password]{ + color: $gray; + padding: 10px 20px; + width: 100%; + text-align: left; + box-sizing: border-box; + &:focus::placeholder { + color: transparent; + } +} + +.input-text { + padding: 10px 20px; +} + +.input-textarea { + padding: 10px; + width: 100%; +} + +.button { + position: relative; + appearance: none; + color: $white; + border: none; + background: $black; + display: inline-block; + padding: 8px 20px 10px 20px; + text-align: center; + font-family: $font-20; + text-transform: uppercase; + font-weight: 500; + transition: opacity .3s; + white-space: nowrap; + outline: none; + cursor: pointer; + + &:disabled { + opacity: 0.5; + } + + &.button-white { + background: $white; + color: $black !important; + &:before { + content: ''; + height: 100%; + width: 100%; + position: absolute; + left: 0; + top: 0; + z-index: 1; + border: 1px solid $light-gray; + } + } +} diff --git a/src/assets/scss/main.scss b/src/assets/scss/main.scss index faf70d3..05094d3 100644 --- a/src/assets/scss/main.scss +++ b/src/assets/scss/main.scss @@ -1,6 +1,7 @@ @import "./variables"; @import "./fonts"; @import "./icons"; +@import "./forms"; @import "./global"; From ed78021d92428eb26d297b8268ad8663fecd97d3 Mon Sep 17 00:00:00 2001 From: Dslak Date: Thu, 3 Dec 2020 19:11:44 +0100 Subject: [PATCH 18/38] wip add form --- src/app/admin/admin.component.html | 59 +++++++++++++++++++++++++++--- src/app/admin/admin.component.scss | 40 +++++++++++++++++++- src/app/admin/admin.component.ts | 44 ++++++++++++++++------ src/assets/scss/forms.scss | 19 ++++++++-- 4 files changed, 141 insertions(+), 21 deletions(-) diff --git a/src/app/admin/admin.component.html b/src/app/admin/admin.component.html index 618f8eb..4701d01 100644 --- a/src/app/admin/admin.component.html +++ b/src/app/admin/admin.component.html @@ -18,11 +18,60 @@
-
diff --git a/src/app/admin/admin.component.scss b/src/app/admin/admin.component.scss index af3b1e3..d3d1aa7 100644 --- a/src/app/admin/admin.component.scss +++ b/src/app/admin/admin.component.scss @@ -12,6 +12,36 @@ } } + .edit-container { + .title { + display: block; + font-size: $font-30; + font-weight: bolder; + text-transform: uppercase; + padding: 20px 0; + } + .form { + .label { + display: block; + font-size: $font-20; + text-transform: uppercase; + padding: 20px 0 5px 0; + } + + .selected-exhibition { + display: block; + font-size: $font-16; + font-weight: bolder; + border-radius: 4px; + border: 2px solid $white; + background: $white-alpha; + cursor: pointer; + padding: 8px 20px; + margin-bottom: 5px; + } + } + } + .menu { background: $dark-gray; @@ -46,9 +76,17 @@ @media (min-width: map-get($grid-breakpoints, 'md')) { .component-admin { .menu { + position: fixed; height: 100vh; - background: $dark-gray; + width: 25%; } } +} +@media (min-width: map-get($grid-breakpoints, 'lg')) { + .component-admin { + .menu { + width: 16.66%; + } + } } diff --git a/src/app/admin/admin.component.ts b/src/app/admin/admin.component.ts index d8aa620..686c8a2 100644 --- a/src/app/admin/admin.component.ts +++ b/src/app/admin/admin.component.ts @@ -1,4 +1,5 @@ import { Component, OnInit } from '@angular/core' +import { ApisService } from '../services/apis.service' import { AuthService } from '../services/auth.service' @Component({ @@ -11,17 +12,28 @@ export class AdminComponent implements OnInit { public authCheck: boolean = false public userName: string = '' public password: string = '' + public activeEditor: string = '' + public exhibitions: any = [] - constructor(private authService: AuthService) { } + public selectedExhibitions: any = [] - ngOnInit(): void { - - const body = { - token: window.sessionStorage.getItem('authToken') - } + constructor( + private authService: AuthService, + private apisService: ApisService + ) { } + ngOnInit(): void { + const body = { token: window.sessionStorage.getItem('authToken') } this.authService.authCheck(body).toPromise().then((response) => { this.authCheck = response.status == 200 + + this.apisService.getPortfolio('exhibitions').toPromise().then((response) => { + this.exhibitions = response.items + },(error) => { + console.error('getPortfolio ERROR', error) + }).catch((e) => { + console.error('getPortfolio CATCH', e) + }) },(error) => { console.error('Auth ERROR', error) }).catch((e) => { @@ -31,11 +43,7 @@ export class AdminComponent implements OnInit { login(): void { - - const body = { - usr: this.userName, - pwd: this.password - } + const body = { usr: this.userName, pwd: this.password } this.authService.login(body).toPromise().then((response) => { this.authCheck = response.status == 200 if(this.authCheck) { @@ -46,6 +54,20 @@ export class AdminComponent implements OnInit { }).catch((e) => { console.error('Auth CATCH', e) }) + } + + showEditor(section): void { + this.activeEditor = section + } + + exhibitionAdd(e, id): void { + //e.originalTarget.value = '' + this.selectedExhibitions.push( + this.exhibitions.filter(item => item.id == id)[0] + ) + } + exhibitionRemove(id): void { + this.selectedExhibitions = this.selectedExhibitions.filter(item => item.id != id) } } diff --git a/src/assets/scss/forms.scss b/src/assets/scss/forms.scss index 28abac5..12f4a41 100644 --- a/src/assets/scss/forms.scss +++ b/src/assets/scss/forms.scss @@ -1,6 +1,7 @@ input, +select, button, textarea { border: none; @@ -18,8 +19,10 @@ textarea { } input[type=text], -input[type=password]{ - color: $gray; +input[type=password], +input[type=file], +select { + color: $black; padding: 10px 20px; width: 100%; text-align: left; @@ -30,7 +33,11 @@ input[type=password]{ } .input-text { - padding: 10px 20px; + padding: 10px 20px !important; +} + +.input-file { + padding: 6px 20px !important; } .input-textarea { @@ -38,6 +45,10 @@ input[type=password]{ width: 100%; } +.input-select { + padding: 9px 20px !important; +} + .button { position: relative; appearance: none; @@ -45,7 +56,7 @@ input[type=password]{ border: none; background: $black; display: inline-block; - padding: 8px 20px 10px 20px; + padding: 8px 20px 10px 20px !important; text-align: center; font-family: $font-20; text-transform: uppercase; From 1a4ab2f2cefd9b71d4615a18f00c0098fa525daa Mon Sep 17 00:00:00 2001 From: Dslak Date: Fri, 4 Dec 2020 10:30:00 +0100 Subject: [PATCH 19/38] add exhibitions and videos wip --- src/app/admin/admin.component.html | 34 +++++++++++++++++++++++------ src/app/admin/admin.component.scss | 27 +++++++++++++++++++---- src/app/admin/admin.component.ts | 21 +++++++++++++++++- src/assets/fonts/icomoon.eot | Bin 5512 -> 5964 bytes src/assets/fonts/icomoon.svg | 3 +++ src/assets/fonts/icomoon.ttf | Bin 5348 -> 5800 bytes src/assets/fonts/icomoon.woff | Bin 5424 -> 5876 bytes src/assets/fonts/selection.json | 2 +- src/assets/scss/forms.scss | 2 +- src/assets/scss/global.scss | 5 ++--- src/assets/scss/icons.scss | 10 +++++++++ src/assets/scss/variables.scss | 2 +- 12 files changed, 88 insertions(+), 18 deletions(-) diff --git a/src/app/admin/admin.component.html b/src/app/admin/admin.component.html index 4701d01..6909bdf 100644 --- a/src/app/admin/admin.component.html +++ b/src/app/admin/admin.component.html @@ -21,9 +21,9 @@
@@ -58,16 +58,36 @@
Exhibitions + + Selected exhibitions + + {{se.date_from | date}} | {{se.title}} +
+
- Selected exhibitions - - {{se.title}} + Video +
+ +
+
+ +
+
+ +
+ + Selected Videos + + {{sv.type | date}} | {{sv.title}}
diff --git a/src/app/admin/admin.component.scss b/src/app/admin/admin.component.scss index d3d1aa7..724a4e3 100644 --- a/src/app/admin/admin.component.scss +++ b/src/app/admin/admin.component.scss @@ -28,16 +28,28 @@ padding: 20px 0 5px 0; } - .selected-exhibition { + .selected-exhibition, + .selected-video { display: block; + position: relative; font-size: $font-16; font-weight: bolder; border-radius: 4px; border: 2px solid $white; background: $white-alpha; cursor: pointer; - padding: 8px 20px; + padding: 8px 50px 8px 15px; margin-bottom: 5px; + + &:before { + content: '\e903'; + position: absolute; + top: 8px; + right: 10px; + font-family: $font-icon; + font-size: $font-20; + color: $gray; + } } } } @@ -54,13 +66,14 @@ text-transform: uppercase; color: $white; text-align: center; - border-bottom: 1px dotted $white-alpha; + border-bottom: 1px solid $black-alpha; } .action { display: block; appearance: none; border: none; + border-radius: 0px; width: 100%; padding: 10px; font-size: $font-14; @@ -68,7 +81,13 @@ color: $white; background: $dark-gray; cursor: pointer; - border-bottom: 1px dotted $white-alpha; + border-bottom: 1px solid $black-alpha; + + &.active { + background: $yellow; + color: $black; + border: none; + } } } } diff --git a/src/app/admin/admin.component.ts b/src/app/admin/admin.component.ts index 686c8a2..ccb397c 100644 --- a/src/app/admin/admin.component.ts +++ b/src/app/admin/admin.component.ts @@ -14,8 +14,10 @@ export class AdminComponent implements OnInit { public password: string = '' public activeEditor: string = '' public exhibitions: any = [] + public videos: any = [] public selectedExhibitions: any = [] + public selectedVideos: any = [] constructor( private authService: AuthService, @@ -61,13 +63,30 @@ export class AdminComponent implements OnInit { } exhibitionAdd(e, id): void { - //e.originalTarget.value = '' this.selectedExhibitions.push( this.exhibitions.filter(item => item.id == id)[0] ) + this.exhibitions = this.exhibitions.filter(item => item.id != id) } exhibitionRemove(id): void { + this.exhibitions.push( + this.selectedExhibitions.filter(item => item.id == id)[0] + ) this.selectedExhibitions = this.selectedExhibitions.filter(item => item.id != id) } + + videoAdd(e, id): void { + this.selectedVideos.push( + this.videos.filter(item => item.id == id)[0] + ) + this.videos = this.videos.filter(item => item.id != id) + } + + videoRemove(id): void { + this.videos.push( + this.selectedVideos.filter(item => item.id == id)[0] + ) + this.selectedVideos = this.selectedVideos.filter(item => item.id != id) + } } diff --git a/src/assets/fonts/icomoon.eot b/src/assets/fonts/icomoon.eot index 80e12dbd43409d270b9fdf8364ea878bce2e3512..3a37fe3bf3fc924eb97c400db854f09cba16008d 100644 GIT binary patch delta 788 zcmY*XPiWI{6n^iQ^p}R_Pt&9coujPFy21i2>$>jXRCZ8Nc2pT6xON*h;SzW2SCta`7Ce9{59 zZ?EyHSlTLU?boKYc4EdD27sqz(=*N5;-mC~duuOyTbrqm4*~EQKx(`(SDWqGy}bco z{-U~Sg96fX;T?cgAw1A%F0ULtz?KM45uUoRFjLE)?mI%5IH1_9tt^6zD&hBp`{rxS zxm(BOp8#oscy)1MX&D511$#BjgCO9w_AFjUq5TE-r(^o6eo0@}OWLM(S({LAQZcqC zSa16bJJ&+!KwUV=zCsQlU&xiKqm@B7H&(3_2Kyz{P|`4M*$&#}FvhYz?iiVj5g5Lz zDg#Q;6=KMcbMy$Q>RmsRGBUpEs!EuXL@_SPIuE*0HR%N(RUylcfk_9!7SUofOUG~^ zw;UgVm=K}{-;Y?C`kOE%LRyL`s;khh0wll_LGU069!wH@*>(6p9gmk%L5Xt@&ZZT(M)aD|j}N#b0WcRvL`kTYkuD;qp` zlStr@l$4p*Q!-MPl`={_LA_p&G}r5q=Km4va?X?S0OVwh6nQvwDlP?`VWm$AHYLe2 zQpJ4?h|Nd`KDD}Z%UX^2T$T93waJBRZ@*xp$zH9zRXVGWe}jY=etCGi)4B84w=Hul zXYa+MBrtM>3uGNKpDfXyHV=<9;0DI=B7SE5Y+VqAd0|}?W9Ru3X+ZiOe=KLI5y@;! QKzMKfMt_dE{lVP8KUyxA{Qv*} delta 316 zcmX@3*P+eUANAwU|`q-#0kl{i3Qs@*Y!<2Aya>)pz1RN z1LFY(27#W8)Wj62pF-&j3_?CYb!Hhr0ro@8H-Y>XAYUaTx1_?_mf<##zXHhj$;nSn zl-wdG2jqVN@-=c3D+(AC7+mh-tLC%goeEUUIN6a&W^xQu=H^lsV*!~L zuU1@*=ePOFz|8_OhvD|yw0|&q@(~epQDKNUSdxJWNCElklVwC*6=yLDF?uoXW71)o g# + + + diff --git a/src/assets/fonts/icomoon.ttf b/src/assets/fonts/icomoon.ttf index ccc99c46565654ac321127d864d74a3c753b1f3c..98fc19ccdf2745419e471fd1d403f33dc7b97fa7 100644 GIT binary patch delta 812 zcmY*Y&ubG=5T1E&^EOL%v)N6uF}1{|+cwx>W7D)fSS>xMC z07PI3I2=B6wouefy`LgmWS1tZPVH6lD`C;VvInXi$L5#A&po}RgJWzF1PC;S$` z9H~q>m)mw9t^&k=QGTdG0r?&O2#_cd?y6K57Ec~!^Moe|Pt43sjyc^II!;i4NT9Fk zEY`qAjqoSJ9kWh#>cMH{CqR-Q-m1;bFOX1rtYtqBoZr6p_73vKI37uc^kx0JzMvPP zYtft0G3`Db#l|z-*I36;<26?52u&#SbL=Z*0lIV9;?Q8J$IcE9m2y3uGDcC3VlrW+ z&?@>dmT_^%NT&_Ya5YWsQoR-rAwwZBPe{|AxM|Z!yPB=3eomI8u%zh1YXzrCF}SGl z3_AsJ+6mT)7K2_o`VB=QQ+x##Zjae4OhUussAbAOQc-L zvJkqm``P<}f~9s_iXpuBkqGw6F@@#Z3Wk|Tm`0(^E0@cG=5jgE{6AtXAw(?fff5Um zqCEDV56fP&U+qx6HCav=X5W4W#AYNtmr8BgrQ;Bvtr4F;HaUOnjRR~j)*dasC|uM> zzClFt?;bwvG#~%1pI{qF#3Ap8>8`6`~&J5nO^_^ delta 358 zcmZ3X`$V&zfsuiMft#U$ftkU;KUm+0Ux;5CD6$8L6OwZi3$}5t>tkSGlmYVRq$d^^ z0BHdre+Q7}NYANEyHZf~8OT2X6z<7LO-zycDU{B@Amjs-H_HGDupeT+3FNl``6?N? zB^B1T47Y*&6+pgEPJXguqU07iIiSE7pnyhhVnqRi0wXU2gD}WKg}lVv)R|tKzkz%k zpe1bu`NbtbhXR4f5s*9sGjqwr1Ko@alYJPiMVa_p`HT4r`E~e~^HuZN@lFLQWt_Z_ zQDX82M%KwY88bFtWHuI%dGTt+)p&lJuMFHQAd?twzfJoGqbDnfn2QQS#KDpbOh5|A zSD#!V;;KE1QHartaUYWo(=?`i%sMQSSRb+Zuq&`X;BW(nqc9^k0}ogq6VP7a&CH@p F83FMkP`UsB diff --git a/src/assets/fonts/icomoon.woff b/src/assets/fonts/icomoon.woff index 84f93b7b502e87e66daa3f32db8568f4c52a6563..97305ed3ccbec219660dd91c31a5164c3696781f 100644 GIT binary patch delta 845 zcmY*XO>5L(5T1FHeUq@sW|Pfk*(yu7X}j31UAp$;U{yR=KM*}B;zhExcF}HIY|(mg zdlFF)bfHxIz=MKxQ3?eS@zmeodeKwxqL(665Vg^HQ!N;HGMQ)Qoq3)lD?J;#ovSBD zM*)E@cLU;4eBStq&OIjI?M>DD$7=oz09L8;P~cVi<&z12mN+I;uKq=GV)EJr;&cFe zL}1zev{D`S&jUC|sAou^ZS%piDv`u3P~It^tVtiMwYhoXo>G2B;P5^+J2^c@eJ7k> zMDz)Cooyej`SY|m-Aj3U1P_fVzcxR5-SFrukexUb zWsr)Hgd&L7Q+6{sOj`~o*&6Z~I@O?avJxWqz#kP`VJC1FY+QLeu5^1hfBF+D2 zti?G`sv&5}7%3`Z&uLW&oBevb9xf}2W7&N>7|=8;9R_sNqj%~1G|w|=p0G_p*j~NF z29rAzm%U|?X(07}dO;ccAj z`qC4NfnrQ7Kt2Z)3#8{%rUAux7#IY4K=?{Q)#r@V#1sYwp&39mW*{u}Qz$(HCtOMxCHV~fa#reA+zqkbGApy8LW+021xnwdAV>cti`V$mPxFS*nHR(*dK5}f?Sx9 Tn*kVLK)?jFS$MO*=u$=i*27fr diff --git a/src/assets/fonts/selection.json b/src/assets/fonts/selection.json index 167f908..e3b41d3 100644 --- a/src/assets/fonts/selection.json +++ b/src/assets/fonts/selection.json @@ -1 +1 @@ -{"IcoMoonType":"selection","icons":[{"icon":{"paths":["M950.857 859.429v-438.857c-12 13.714-25.143 26.286-39.429 37.714-81.714 62.857-164 126.857-243.429 193.143-42.857 36-96 80-155.429 80h-1.143c-59.429 0-112.571-44-155.429-80-79.429-66.286-161.714-130.286-243.429-193.143-14.286-11.429-27.429-24-39.429-37.714v438.857c0 9.714 8.571 18.286 18.286 18.286h841.143c9.714 0 18.286-8.571 18.286-18.286zM950.857 258.857c0-14.286 3.429-39.429-18.286-39.429h-841.143c-9.714 0-18.286 8.571-18.286 18.286 0 65.143 32.571 121.714 84 162.286 76.571 60 153.143 120.571 229.143 181.143 30.286 24.571 85.143 77.143 125.143 77.143h1.143c40 0 94.857-52.571 125.143-77.143 76-60.571 152.571-121.143 229.143-181.143 37.143-29.143 84-92.571 84-141.143zM1024 237.714v621.714c0 50.286-41.143 91.429-91.429 91.429h-841.143c-50.286 0-91.429-41.143-91.429-91.429v-621.714c0-50.286 41.143-91.429 91.429-91.429h841.143c50.286 0 91.429 41.143 91.429 91.429z"],"width":1024,"attrs":[],"isMulticolor":false,"isMulticolor2":false,"tags":["envelope-o"],"defaultCode":61443,"grid":14},"attrs":[],"properties":{"name":"envelope-o","id":0,"order":47,"prevSize":28,"code":61443},"setIdx":0,"setId":0,"iconIdx":0},{"icon":{"paths":["M731.429 348.571c-21.714 9.714-44.571 16-69.143 19.429 25.143-14.857 44-38.857 53.143-66.857-23.429 13.714-49.143 24-76.571 29.143-21.714-23.429-53.143-37.714-87.429-37.714-66.286 0-120 53.714-120 120 0 9.143 0.571 18.857 2.857 27.429-100-5.143-188.571-52.571-248-125.714-10.286 17.714-16.571 38.857-16.571 60.571 0 41.714 19.429 78.286 52 100-20-0.571-38.857-6.286-57.143-14.857v1.143c0 58.286 44 106.857 98.857 117.714-10.286 2.857-18.286 4.571-29.143 4.571-7.429 0-14.857-1.143-22.286-2.286 15.429 47.429 59.429 82.286 112 83.429-41.143 32-92.571 51.429-149.143 51.429-9.714 0-19.429-0.571-28.571-1.714 53.143 33.714 116 53.714 184 53.714 220.571 0 341.714-182.857 341.714-341.714 0-5.143 0-10.286-0.571-15.429 23.429-16.571 44-37.714 60-62.286zM877.714 237.714v548.571c0 90.857-73.714 164.571-164.571 164.571h-548.571c-90.857 0-164.571-73.714-164.571-164.571v-548.571c0-90.857 73.714-164.571 164.571-164.571h548.571c90.857 0 164.571 73.714 164.571 164.571z"],"width":877.7142857142857,"attrs":[],"isMulticolor":false,"isMulticolor2":false,"tags":["twitter-square"],"defaultCode":61569,"grid":14},"attrs":[],"properties":{"name":"twitter-square","id":1,"order":31,"prevSize":28,"code":61569},"setIdx":0,"setId":0,"iconIdx":1},{"icon":{"paths":["M713.143 73.143c90.857 0 164.571 73.714 164.571 164.571v548.571c0 90.857-73.714 164.571-164.571 164.571h-107.429v-340h113.714l17.143-132.571h-130.857v-84.571c0-38.286 10.286-64 65.714-64l69.714-0.571v-118.286c-12-1.714-53.714-5.143-101.714-5.143-101.143 0-170.857 61.714-170.857 174.857v97.714h-114.286v132.571h114.286v340h-304c-90.857 0-164.571-73.714-164.571-164.571v-548.571c0-90.857 73.714-164.571 164.571-164.571h548.571z"],"width":877.7142857142857,"attrs":[],"isMulticolor":false,"isMulticolor2":false,"tags":["facebook-square"],"defaultCode":61570,"grid":14},"attrs":[],"properties":{"name":"facebook-square","id":2,"order":30,"prevSize":28,"code":61570},"setIdx":0,"setId":0,"iconIdx":2},{"icon":{"paths":["M804.571 708.571c0 20.571-9.143 60.571-17.714 79.429-12 28-44 46.286-69.714 60.571-33.714 18.286-68 29.143-106.286 29.143-53.143 0-101.143-21.714-149.714-39.429-34.857-12.571-68.571-28-100-47.429-97.143-60-214.286-177.143-274.286-274.286-19.429-31.429-34.857-65.143-47.429-100-17.714-48.571-39.429-96.571-39.429-149.714 0-38.286 10.857-72.571 29.143-106.286 14.286-25.714 32.571-57.714 60.571-69.714 18.857-8.571 58.857-17.714 79.429-17.714 4 0 8 0 12 1.714 12 4 24.571 32 30.286 43.429 18.286 32.571 36 65.714 54.857 97.714 9.143 14.857 26.286 33.143 26.286 50.857 0 34.857-103.429 85.714-103.429 116.571 0 15.429 14.286 35.429 22.286 49.143 57.714 104 129.714 176 233.714 233.714 13.714 8 33.714 22.286 49.143 22.286 30.857 0 81.714-103.429 116.571-103.429 17.714 0 36 17.143 50.857 26.286 32 18.857 65.143 36.571 97.714 54.857 11.429 5.714 39.429 18.286 43.429 30.286 1.714 4 1.714 8 1.714 12z"],"width":804.5714285714286,"attrs":[],"isMulticolor":false,"isMulticolor2":false,"tags":["phone"],"defaultCode":61589,"grid":14},"attrs":[],"properties":{"name":"phone","id":3,"order":43,"prevSize":28,"code":61589},"setIdx":0,"setId":0,"iconIdx":3},{"icon":{"paths":["M731.429 681.714c0-2.857 0-6.286-1.143-9.143-3.429-10.286-86.857-52.571-102.857-61.714-10.857-6.286-24-18.857-37.143-18.857-25.143 0-62.286 74.857-84.571 74.857-11.429 0-25.714-10.286-36-16-75.429-42.286-127.429-94.286-169.714-169.714-5.714-10.286-16-24.571-16-36 0-22.286 74.857-59.429 74.857-84.571 0-13.143-12.571-26.286-18.857-37.143-9.143-16-51.429-99.429-61.714-102.857-2.857-1.143-6.286-1.143-9.143-1.143-14.857 0-44 6.857-57.714 12.571-37.714 17.143-65.143 89.143-65.143 128.571 0 38.286 15.429 73.143 28.571 108.571 45.714 125.143 181.714 261.143 306.857 306.857 35.429 13.143 70.286 28.571 108.571 28.571 39.429 0 111.429-27.429 128.571-65.143 5.714-13.714 12.571-42.857 12.571-57.714zM877.714 237.714v548.571c0 90.857-73.714 164.571-164.571 164.571h-548.571c-90.857 0-164.571-73.714-164.571-164.571v-548.571c0-90.857 73.714-164.571 164.571-164.571h548.571c90.857 0 164.571 73.714 164.571 164.571z"],"width":877.7142857142857,"attrs":[],"isMulticolor":false,"isMulticolor2":false,"tags":["phone-square"],"defaultCode":61592,"grid":14},"attrs":[],"properties":{"name":"phone-square","id":4,"order":35,"prevSize":28,"code":61592},"setIdx":0,"setId":0,"iconIdx":4},{"icon":{"paths":["M925.714 233.143c-25.143 36.571-56.571 69.143-92.571 95.429 0.571 8 0.571 16 0.571 24 0 244-185.714 525.143-525.143 525.143-104.571 0-201.714-30.286-283.429-82.857 14.857 1.714 29.143 2.286 44.571 2.286 86.286 0 165.714-29.143 229.143-78.857-81.143-1.714-149.143-54.857-172.571-128 11.429 1.714 22.857 2.857 34.857 2.857 16.571 0 33.143-2.286 48.571-6.286-84.571-17.143-148-91.429-148-181.143v-2.286c24.571 13.714 53.143 22.286 83.429 23.429-49.714-33.143-82.286-89.714-82.286-153.714 0-34.286 9.143-65.714 25.143-93.143 90.857 112 227.429 185.143 380.571 193.143-2.857-13.714-4.571-28-4.571-42.286 0-101.714 82.286-184.571 184.571-184.571 53.143 0 101.143 22.286 134.857 58.286 41.714-8 81.714-23.429 117.143-44.571-13.714 42.857-42.857 78.857-81.143 101.714 37.143-4 73.143-14.286 106.286-28.571z"],"width":950.8571428571428,"attrs":[],"isMulticolor":false,"isMulticolor2":false,"tags":["twitter"],"defaultCode":61593,"grid":14},"attrs":[],"properties":{"name":"twitter","id":5,"order":45,"prevSize":28,"code":61593},"setIdx":0,"setId":0,"iconIdx":5},{"icon":{"paths":["M548 6.857v150.857h-89.714c-70.286 0-83.429 33.714-83.429 82.286v108h167.429l-22.286 169.143h-145.143v433.714h-174.857v-433.714h-145.714v-169.143h145.714v-124.571c0-144.571 88.571-223.429 217.714-223.429 61.714 0 114.857 4.571 130.286 6.857z"],"width":602.2582857142856,"attrs":[],"isMulticolor":false,"isMulticolor2":false,"tags":["facebook","facebook-f"],"defaultCode":61594,"grid":14},"attrs":[],"properties":{"name":"facebook, facebook-f","id":6,"order":44,"prevSize":28,"code":61594},"setIdx":0,"setId":0,"iconIdx":6},{"icon":{"paths":["M1024 405.714v453.714c0 50.286-41.143 91.429-91.429 91.429h-841.143c-50.286 0-91.429-41.143-91.429-91.429v-453.714c17.143 18.857 36.571 35.429 57.714 49.714 94.857 64.571 190.857 129.143 284 197.143 48 35.429 107.429 78.857 169.714 78.857h1.143c62.286 0 121.714-43.429 169.714-78.857 93.143-67.429 189.143-132.571 284.571-197.143 20.571-14.286 40-30.857 57.143-49.714zM1024 237.714c0 64-47.429 121.714-97.714 156.571-89.143 61.714-178.857 123.429-267.429 185.714-37.143 25.714-100 78.286-146.286 78.286h-1.143c-46.286 0-109.143-52.571-146.286-78.286-88.571-62.286-178.286-124-266.857-185.714-40.571-27.429-98.286-92-98.286-144 0-56 30.286-104 91.429-104h841.143c49.714 0 91.429 41.143 91.429 91.429z"],"width":1024,"attrs":[],"isMulticolor":false,"isMulticolor2":false,"tags":["envelope"],"defaultCode":61664,"grid":14},"attrs":[],"properties":{"name":"envelope","id":7,"order":36,"prevSize":28,"code":61664},"setIdx":0,"setId":0,"iconIdx":7},{"icon":{"paths":["M525.143 744.571v-89.714c0-18.857-5.714-28.571-16.571-28.571-6.286 0-12.571 2.857-18.857 9.143v128c6.286 6.286 12.571 9.143 18.857 9.143 10.857 0 16.571-9.143 16.571-28zM630.286 674.857h37.714v-19.429c0-19.429-6.286-29.143-18.857-29.143s-18.857 9.714-18.857 29.143v19.429zM304 522.857v40h-45.714v241.714h-42.286v-241.714h-44.571v-40h132.571zM418.857 594.857v209.714h-38.286v-22.857c-14.857 17.143-29.143 25.714-43.429 25.714-12 0-20.571-5.143-24-16-2.286-6.286-3.429-16-3.429-30.857v-165.714h37.714v154.286c0 8.571 0 13.714 0.571 14.857 0.571 5.714 3.429 8.571 8.571 8.571 8 0 15.429-5.714 24-17.714v-160h38.286zM562.857 658.286v83.429c0 18.857-1.143 33.143-4 41.714-4.571 16-14.857 24-30.286 24-13.143 0-26.286-8-38.857-23.429v20.571h-38.286v-281.714h38.286v92c12-14.857 25.143-22.857 38.857-22.857 15.429 0 25.714 8 30.286 24 2.857 8.571 4 22.286 4 42.286zM706.286 732v5.143c0 12.571-0.571 20.571-1.143 24.571-1.143 8.571-4 16-8.571 22.857-10.286 15.429-26.286 22.857-45.714 22.857-20 0-35.429-7.429-46.286-21.714-8-10.286-12-26.857-12-49.143v-73.714c0-22.286 3.429-38.286 11.429-49.143 10.857-14.286 26.286-21.714 45.714-21.714 18.857 0 34.286 7.429 44.571 21.714 8 10.857 12 26.857 12 49.143v43.429h-76v37.143c0 19.429 6.286 29.143 19.429 29.143 9.143 0 14.857-5.143 17.143-14.857 0-2.286 0.571-10.857 0.571-25.714h38.857zM448.571 261.143v89.143c0 19.429-6.286 29.143-18.286 29.143-12.571 0-18.286-9.714-18.286-29.143v-89.143c0-19.429 5.714-29.714 18.286-29.714 12 0 18.286 10.286 18.286 29.714zM753.143 668.571v0c0-49.143 0-101.143-10.857-148.571-8-33.714-35.429-58.286-68-61.714-77.714-8.571-156.571-8.571-235.429-8.571-78.286 0-157.143 0-234.857 8.571-33.143 3.429-60.571 28-68 61.714-10.857 47.429-11.429 99.429-11.429 148.571v0c0 48.571 0 100.571 11.429 148.571 7.429 33.143 34.857 57.714 67.429 61.714 78.286 8.571 157.143 8.571 235.429 8.571s157.143 0 235.429-8.571c32.571-4 60-28.571 67.429-61.714 11.429-48 11.429-100 11.429-148.571zM321.714 296.571l51.429-169.143h-42.857l-29.143 111.429-30.286-111.429h-44.571c8.571 26.286 18.286 52.571 26.857 78.857 13.714 40 22.286 69.714 26.286 90.286v114.857h42.286v-114.857zM486.857 342.857v-74.286c0-22.286-4-38.857-12-49.714-10.857-14.286-25.714-21.714-44.571-21.714-19.429 0-34.286 7.429-44.571 21.714-8 10.857-12 27.429-12 49.714v74.286c0 22.286 4 38.857 12 49.714 10.286 14.286 25.143 21.714 44.571 21.714 18.857 0 33.714-7.429 44.571-21.714 8-10.286 12-27.429 12-49.714zM590.286 411.429h38.286v-211.429h-38.286v161.714c-8.571 12-16.571 17.714-24 17.714-5.143 0-8.571-2.857-9.143-9.143-0.571-1.143-0.571-5.714-0.571-14.857v-155.429h-38.286v167.429c0 14.857 1.143 24.571 3.429 31.429 4 10.286 12.571 15.429 24.571 15.429 14.286 0 28.571-8.571 44-25.714v22.857zM877.714 237.714v548.571c0 90.857-73.714 164.571-164.571 164.571h-548.571c-90.857 0-164.571-73.714-164.571-164.571v-548.571c0-90.857 73.714-164.571 164.571-164.571h548.571c90.857 0 164.571 73.714 164.571 164.571z"],"width":877.7142857142857,"attrs":[],"isMulticolor":false,"isMulticolor2":false,"tags":["youtube-square"],"defaultCode":61798,"grid":14},"attrs":[],"properties":{"name":"youtube-square","id":8,"order":37,"prevSize":28,"code":61798},"setIdx":0,"setId":0,"iconIdx":8},{"icon":{"paths":["M554.857 710.857v120.571c0 25.714-7.429 38.286-22.286 38.286-8.571 0-17.143-4-25.714-12.571v-172c8.571-8.571 17.143-12.571 25.714-12.571 14.857 0 22.286 13.143 22.286 38.286zM748 711.429v26.286h-51.429v-26.286c0-25.714 8.571-38.857 25.714-38.857s25.714 13.143 25.714 38.857zM196 586.857h61.143v-53.714h-178.286v53.714h60v325.143h57.143v-325.143zM360.571 912h50.857v-282.286h-50.857v216c-11.429 16-22.286 24-32.571 24-6.857 0-10.857-4-12-12-0.571-1.714-0.571-8-0.571-20v-208h-50.857v223.429c0 20 1.714 33.143 4.571 41.714 4.571 14.286 16.571 21.143 33.143 21.143 18.286 0 37.714-11.429 58.286-34.857v30.857zM605.714 827.429v-112.571c0-26.286-1.143-45.143-5.143-56.571-6.286-21.143-20.571-32-40.571-32-18.857 0-36.571 10.286-53.143 30.857v-124h-50.857v378.857h50.857v-27.429c17.143 21.143 34.857 31.429 53.143 31.429 20 0 34.286-10.857 40.571-31.429 4-12 5.143-30.857 5.143-57.143zM798.857 821.714v-7.429h-52c0 20.571-0.571 32-1.143 34.857-2.857 13.714-10.286 20.571-22.857 20.571-17.714 0-26.286-13.143-26.286-39.429v-49.714h102.286v-58.857c0-30.286-5.143-52-15.429-66.286-14.857-19.429-34.857-29.143-60.571-29.143-26.286 0-46.286 9.714-61.143 29.143-10.857 14.286-16 36-16 66.286v98.857c0 30.286 5.714 52.571 16.571 66.286 14.857 19.429 34.857 29.143 61.714 29.143s48-10.286 61.714-30.286c6.286-9.143 10.857-19.429 12-30.857 1.143-5.143 1.143-16.571 1.143-33.143zM451.429 300v-120c0-26.286-7.429-39.429-24.571-39.429-16.571 0-24.571 13.143-24.571 39.429v120c0 26.286 8 40 24.571 40 17.143 0 24.571-13.714 24.571-40zM862.286 729.143c0 65.714-0.571 136-14.857 200-10.857 45.143-47.429 78.286-91.429 82.857-105.143 12-211.429 12-317.143 12s-212 0-317.143-12c-44-4.571-81.143-37.714-91.429-82.857-14.857-64-14.857-134.286-14.857-200v0c0-66.286 0.571-136 14.857-200 10.857-45.143 47.429-78.286 92-83.429 104.571-11.429 210.857-11.429 316.571-11.429s212 0 317.143 11.429c44 5.143 81.143 38.286 91.429 83.429 14.857 64 14.857 133.714 14.857 200zM292 0h58.286l-69.143 228v154.857h-57.143v-154.857c-5.143-28-16.571-68-34.857-121.143-12.571-35.429-25.143-71.429-37.143-106.857h60.571l40.571 150.286zM503.429 190.286v100c0 30.286-5.143 53.143-16 67.429-14.286 19.429-34.286 29.143-60.571 29.143-25.714 0-45.714-9.714-60-29.143-10.857-14.857-16-37.143-16-67.429v-100c0-30.286 5.143-52.571 16-66.857 14.286-19.429 34.286-29.143 60-29.143 26.286 0 46.286 9.714 60.571 29.143 10.857 14.286 16 36.571 16 66.857zM694.857 97.714v285.143h-52v-31.429c-20.571 24-40 35.429-58.857 35.429-16.571 0-28.571-6.857-33.714-21.143-2.857-8.571-4.571-22.286-4.571-42.857v-225.143h52v209.714c0 12 0 18.857 0.571 20 1.143 8 5.143 12.571 12 12.571 10.286 0 21.143-8 32.571-24.571v-217.714h52z"],"width":877.7142857142857,"attrs":[],"isMulticolor":false,"isMulticolor2":false,"tags":["youtube"],"defaultCode":61799,"grid":14},"attrs":[],"properties":{"name":"youtube","id":9,"order":42,"prevSize":28,"code":61799},"setIdx":0,"setId":0,"iconIdx":9},{"icon":{"paths":["M738.286 364.571c4-82.857-26.857-124.571-92-126.857-88-2.857-147.429 46.857-178.286 149.143 16-6.857 31.429-10.857 46.857-10.857 32 0 46.286 18.286 42.286 54.857-1.714 21.714-16 53.714-42.286 95.429-26.857 42.286-46.857 62.857-60 62.857-17.143 0-32-32-46.857-96.571-4.571-19.429-13.143-67.429-25.714-145.714-11.429-72-41.714-105.714-91.429-101.143-20.571 2.286-52.571 20.571-93.714 57.143-30.857 26.857-61.143 54.857-92.571 82.286l29.714 38.286c28.571-19.429 45.143-29.714 49.714-29.714 21.714 0 42.286 34.286 61.143 102.286 17.143 62.857 34.286 125.143 51.429 188 25.714 68 56.571 102.286 93.714 102.286 59.429 0 132.571-56 218.857-168 83.429-107.429 126.857-192 129.143-253.714zM877.714 237.714v548.571c0 90.857-73.714 164.571-164.571 164.571h-548.571c-90.857 0-164.571-73.714-164.571-164.571v-548.571c0-90.857 73.714-164.571 164.571-164.571h548.571c90.857 0 164.571 73.714 164.571 164.571z"],"width":877.7142857142857,"attrs":[],"isMulticolor":false,"isMulticolor2":false,"tags":["vimeo-square"],"defaultCode":61844,"grid":14},"attrs":[],"properties":{"name":"vimeo-square","id":10,"order":38,"prevSize":28,"code":61844},"setIdx":0,"setId":0,"iconIdx":10},{"icon":{"paths":["M332.571 747.429c0 30.857-28 37.714-53.143 37.714-24.571 0-61.143-4-61.143-36 0-31.429 30.857-36.571 56-36.571 24 0 58.286 4 58.286 34.857zM312 481.143c0 28.571-11.429 48.571-42.286 48.571-31.429 0-44-18.286-44-48s11.429-51.429 44-51.429c29.143 0 42.286 24 42.286 50.857zM406.857 438.286v-71.429c-24.571 9.143-50.857 16.571-77.143 16.571-18.857-10.857-40.571-16.571-62.857-16.571-65.143 0-116.571 48-116.571 114.286 0 35.429 23.429 84.571 58.857 96.571v1.714c-18.286 8-21.714 30.286-21.714 48.571 0 18.857 6.857 34.286 23.429 44v1.714c-38.857 12.571-64.571 37.143-64.571 79.429 0 72.571 69.143 93.143 129.714 93.143 73.143 0 128-26.857 128-107.429 0-57.143-52-74.286-99.429-82.857-16-2.857-43.429-14.286-43.429-34.286 0-18.857 10.286-26.857 28-29.714 58.286-11.429 95.429-56.571 95.429-116.571 0-10.286-2.286-20-5.714-29.714 9.143-2.286 18.857-4.571 28-7.429zM440.571 677.714h78.286c-1.143-15.429-1.143-31.429-1.143-46.857v-221.143c0-13.143 0-26.286 1.143-39.429h-78.286c1.714 13.143 1.714 27.429 1.714 40.571v224c0 14.286 0 28.571-1.714 42.857zM731.429 668.571v-69.143c-11.429 8-25.143 12-38.857 12-25.714 0-30.286-25.714-30.286-46.857v-128.571h29.714c10.286 0 20 1.143 30.286 1.143v-66.857h-60c0-19.429-1.143-38.857 1.714-58.286h-80c1.714 10.286 2.286 20.571 2.286 31.429v26.857h-34.286v66.857c6.857-0.571 13.714-1.714 21.143-1.714 4 0 8.571 0.571 13.143 0.571v1.143h-1.143v124c0 61.714 9.143 121.143 84.571 121.143 21.143 0 42.857-3.429 61.714-13.714zM528 265.143c0-26.857-20-52-48-52s-48.571 24.571-48.571 52c0 26.857 21.143 50.857 48.571 50.857s48-24.571 48-50.857zM877.714 237.714v548.571c0 90.857-73.714 164.571-164.571 164.571h-548.571c-90.857 0-164.571-73.714-164.571-164.571v-548.571c0-90.857 73.714-164.571 164.571-164.571h548.571c90.857 0 164.571 73.714 164.571 164.571z"],"width":877.7142857142857,"attrs":[],"isMulticolor":false,"isMulticolor2":false,"tags":["git-square"],"defaultCode":61906,"grid":14},"attrs":[],"properties":{"name":"git-square","id":11,"order":39,"prevSize":28,"code":61906},"setIdx":0,"setId":0,"iconIdx":11},{"icon":{"paths":["M340 865.143c0-50.286-55.429-57.143-94.286-57.143-40.571 0-90.286 8.571-90.286 59.429 0 51.429 58.857 57.714 98.286 57.714 41.714 0 86.286-10.286 86.286-60zM306.286 433.714c0-42.857-20.571-81.714-68-81.714-52.571 0-70.857 34.857-70.857 82.857 0 47.429 20.571 77.143 70.857 77.143 49.714 0 68-32 68-78.286zM460 248.571v115.429c-14.857 5.143-29.714 9.143-45.143 12.571 5.714 15.429 9.143 31.429 9.143 48 0 96.571-59.429 170.286-154.286 188-28.571 5.714-45.143 17.714-45.143 48.571 0 87.429 230.857 28 230.857 189.143 0 130.857-88.571 173.714-207.429 173.714-97.714 0-209.143-32.571-209.143-150.286 0-68.571 41.714-108 104-128.571v-2.286c-26.286-16-38.286-41.143-38.286-72 0-29.143 6.286-65.143 36-78.286v-2.286c-57.714-19.429-95.429-98.857-95.429-156.571 0-106.857 82.857-185.143 188.571-185.143 35.429 0 70.857 9.143 101.714 26.857 42.857 0 85.143-11.429 124.571-26.857zM641.714 752h-126.857c2.286-25.714 2.286-50.857 2.286-76.571v-348c0-24.571 0.571-49.143-2.286-73.143h126.857c-2.857 23.429-2.286 47.429-2.286 70.857v350.286c0 25.714 0 50.857 2.286 76.571zM985.143 625.143v112c-30.286 16.571-65.143 22.286-99.429 22.286-122.286 0-136.571-96.571-136.571-196v-200.571h1.143v-2.286c-7.429 0-14.286-1.143-21.143-1.143-11.429 0-22.857 1.714-33.714 3.429v-108.571h54.857v-43.429c0-17.143-0.571-34.286-3.429-50.857h129.714c-4.571 31.429-3.429 62.857-3.429 94.286h97.714v108.571c-16.571 0-33.143-2.286-49.143-2.286h-48.571v208.571c0 33.714 7.429 74.857 49.714 74.857 22.286 0 44-6.286 62.286-18.857zM656 84c0 42.857-33.143 82.857-77.143 82.857-45.143 0-78.857-39.429-78.857-82.857 0-44 33.143-84 78.857-84 45.143 0 77.143 41.143 77.143 84z"],"width":1024,"attrs":[],"isMulticolor":false,"isMulticolor2":false,"tags":["git"],"defaultCode":61907,"grid":14},"attrs":[],"properties":{"name":"git","id":12,"order":40,"prevSize":28,"code":61907},"setIdx":0,"setId":0,"iconIdx":12},{"icon":{"paths":["M976.571 296c-4 90.286-67.429 214.286-189.714 372-126.857 164-233.143 246.286-321.143 246.286-54.286 0-100-50.286-137.143-150.286-25.143-91.429-50.286-183.429-75.429-275.429-27.429-100-57.714-149.714-89.714-149.714-6.857 0-30.857 14.286-72.571 43.429l-44-56c45.714-40.571 90.857-81.714 136-121.143 60.571-53.714 106.857-80.571 137.714-83.429 72.571-6.857 116.571 42.286 133.714 148 17.714 114.286 30.857 185.714 37.714 213.143 21.143 94.857 43.429 142.286 68.571 142.286 19.429 0 48.571-30.286 88-92 38.857-61.714 59.429-108.571 62.286-140.571 5.143-53.143-15.429-79.429-62.286-79.429-22.286 0-45.143 5.143-69.143 14.857 45.714-149.714 133.143-222.286 262.286-218.286 95.429 2.857 140.571 65.143 134.857 186.286z"],"width":1029.12,"attrs":[],"isMulticolor":false,"isMulticolor2":false,"tags":["vimeo"],"defaultCode":62077,"grid":14},"attrs":[],"properties":{"name":"vimeo","id":13,"order":46,"prevSize":28,"code":62077},"setIdx":0,"setId":0,"iconIdx":13},{"icon":{"paths":["M424.633 357.564l-386.090 308.871h946.914v-100h-661.836l163.48-130.785z"],"attrs":[{}],"isMulticolor":false,"isMulticolor2":false,"grid":14,"tags":["back"]},"attrs":[{}],"properties":{"order":49,"id":14,"name":"back","prevSize":28,"code":59648},"setIdx":0,"setId":0,"iconIdx":14}],"height":1024,"metadata":{"name":"icomoon"},"preferences":{"showGlyphs":true,"showQuickUse":true,"showQuickUse2":true,"showSVGs":true,"fontPref":{"prefix":"icon-","metadata":{"fontFamily":"icomoon"},"metrics":{"emSize":1024,"baseline":6.25,"whitespace":50},"embed":false},"imagePref":{"prefix":"icon-","png":true,"useClassSelector":true,"color":0,"bgColor":16777215,"classSelector":".icon"},"historySize":50,"showCodes":true,"gridSize":16}} \ No newline at end of file +{"IcoMoonType":"selection","icons":[{"icon":{"paths":["M542.165 780.501l-225.835-225.835h494.336c23.552 0 42.667-19.115 42.667-42.667s-19.115-42.667-42.667-42.667h-494.336l225.835-225.835c16.683-16.683 16.683-43.691 0-60.331s-43.691-16.683-60.331 0l-298.667 298.667c-4.096 4.096-7.168 8.789-9.259 13.824-2.176 5.205-3.243 10.795-3.243 16.341 0 10.923 4.181 21.845 12.501 30.165l298.667 298.667c16.683 16.683 43.691 16.683 60.331 0s16.683-43.691 0-60.331z"],"attrs":[],"isMulticolor":false,"isMulticolor2":false,"tags":["arrow-left"],"grid":24},"attrs":[],"properties":{"id":17,"order":52,"prevSize":24,"code":59649,"name":"arrow-left"},"setIdx":0,"setId":1,"iconIdx":16},{"icon":{"paths":["M225.835 414.165l256 256c16.683 16.683 43.691 16.683 60.331 0l256-256c16.683-16.683 16.683-43.691 0-60.331s-43.691-16.683-60.331 0l-225.835 225.835-225.835-225.835c-16.683-16.683-43.691-16.683-60.331 0s-16.683 43.691 0 60.331z"],"attrs":[],"isMulticolor":false,"isMulticolor2":false,"tags":["chevron-down"],"grid":24},"attrs":[],"properties":{"id":47,"order":56,"prevSize":24,"code":59650,"name":"chevron-down"},"setIdx":0,"setId":1,"iconIdx":46},{"icon":{"paths":["M896 213.333c11.776 0 22.4 4.736 30.165 12.501s12.501 18.389 12.501 30.165v512c0 11.776-4.736 22.4-12.501 30.165s-18.389 12.501-30.165 12.501h-535.296l-261.333-298.667 261.333-298.667zM896 128h-554.667c-12.8 0-24.235 5.632-32.128 14.549l-298.667 341.333c-14.208 16.213-13.909 40.192 0 56.192l298.667 341.333c8.448 9.643 20.224 14.549 32.128 14.592h554.667c35.328 0 67.413-14.379 90.496-37.504s37.504-55.168 37.504-90.496v-512c0-35.328-14.379-67.413-37.504-90.496s-55.168-37.504-90.496-37.504zM481.835 414.165l97.835 97.835-97.835 97.835c-16.683 16.683-16.683 43.691 0 60.331s43.691 16.683 60.331 0l97.835-97.835 97.835 97.835c16.683 16.683 43.691 16.683 60.331 0s16.683-43.691 0-60.331l-97.835-97.835 97.835-97.835c16.683-16.683 16.683-43.691 0-60.331s-43.691-16.683-60.331 0l-97.835 97.835-97.835-97.835c-16.683-16.683-43.691-16.683-60.331 0s-16.683 43.691 0 60.331z"],"attrs":[],"isMulticolor":false,"isMulticolor2":false,"tags":["delete"],"grid":24},"attrs":[],"properties":{"id":86,"order":54,"prevSize":24,"code":59651,"name":"delete"},"setIdx":0,"setId":1,"iconIdx":85},{"icon":{"paths":["M950.857 859.429v-438.857c-12 13.714-25.143 26.286-39.429 37.714-81.714 62.857-164 126.857-243.429 193.143-42.857 36-96 80-155.429 80h-1.143c-59.429 0-112.571-44-155.429-80-79.429-66.286-161.714-130.286-243.429-193.143-14.286-11.429-27.429-24-39.429-37.714v438.857c0 9.714 8.571 18.286 18.286 18.286h841.143c9.714 0 18.286-8.571 18.286-18.286zM950.857 258.857c0-14.286 3.429-39.429-18.286-39.429h-841.143c-9.714 0-18.286 8.571-18.286 18.286 0 65.143 32.571 121.714 84 162.286 76.571 60 153.143 120.571 229.143 181.143 30.286 24.571 85.143 77.143 125.143 77.143h1.143c40 0 94.857-52.571 125.143-77.143 76-60.571 152.571-121.143 229.143-181.143 37.143-29.143 84-92.571 84-141.143zM1024 237.714v621.714c0 50.286-41.143 91.429-91.429 91.429h-841.143c-50.286 0-91.429-41.143-91.429-91.429v-621.714c0-50.286 41.143-91.429 91.429-91.429h841.143c50.286 0 91.429 41.143 91.429 91.429z"],"width":1024,"attrs":[],"isMulticolor":false,"isMulticolor2":false,"tags":["envelope-o"],"defaultCode":61443,"grid":14},"attrs":[],"properties":{"name":"envelope-o","id":0,"order":47,"prevSize":28,"code":61443},"setIdx":1,"setId":0,"iconIdx":0},{"icon":{"paths":["M731.429 348.571c-21.714 9.714-44.571 16-69.143 19.429 25.143-14.857 44-38.857 53.143-66.857-23.429 13.714-49.143 24-76.571 29.143-21.714-23.429-53.143-37.714-87.429-37.714-66.286 0-120 53.714-120 120 0 9.143 0.571 18.857 2.857 27.429-100-5.143-188.571-52.571-248-125.714-10.286 17.714-16.571 38.857-16.571 60.571 0 41.714 19.429 78.286 52 100-20-0.571-38.857-6.286-57.143-14.857v1.143c0 58.286 44 106.857 98.857 117.714-10.286 2.857-18.286 4.571-29.143 4.571-7.429 0-14.857-1.143-22.286-2.286 15.429 47.429 59.429 82.286 112 83.429-41.143 32-92.571 51.429-149.143 51.429-9.714 0-19.429-0.571-28.571-1.714 53.143 33.714 116 53.714 184 53.714 220.571 0 341.714-182.857 341.714-341.714 0-5.143 0-10.286-0.571-15.429 23.429-16.571 44-37.714 60-62.286zM877.714 237.714v548.571c0 90.857-73.714 164.571-164.571 164.571h-548.571c-90.857 0-164.571-73.714-164.571-164.571v-548.571c0-90.857 73.714-164.571 164.571-164.571h548.571c90.857 0 164.571 73.714 164.571 164.571z"],"width":877.7142857142857,"attrs":[],"isMulticolor":false,"isMulticolor2":false,"tags":["twitter-square"],"defaultCode":61569,"grid":14},"attrs":[],"properties":{"name":"twitter-square","id":1,"order":31,"prevSize":28,"code":61569},"setIdx":1,"setId":0,"iconIdx":1},{"icon":{"paths":["M713.143 73.143c90.857 0 164.571 73.714 164.571 164.571v548.571c0 90.857-73.714 164.571-164.571 164.571h-107.429v-340h113.714l17.143-132.571h-130.857v-84.571c0-38.286 10.286-64 65.714-64l69.714-0.571v-118.286c-12-1.714-53.714-5.143-101.714-5.143-101.143 0-170.857 61.714-170.857 174.857v97.714h-114.286v132.571h114.286v340h-304c-90.857 0-164.571-73.714-164.571-164.571v-548.571c0-90.857 73.714-164.571 164.571-164.571h548.571z"],"width":877.7142857142857,"attrs":[],"isMulticolor":false,"isMulticolor2":false,"tags":["facebook-square"],"defaultCode":61570,"grid":14},"attrs":[],"properties":{"name":"facebook-square","id":2,"order":30,"prevSize":28,"code":61570},"setIdx":1,"setId":0,"iconIdx":2},{"icon":{"paths":["M804.571 708.571c0 20.571-9.143 60.571-17.714 79.429-12 28-44 46.286-69.714 60.571-33.714 18.286-68 29.143-106.286 29.143-53.143 0-101.143-21.714-149.714-39.429-34.857-12.571-68.571-28-100-47.429-97.143-60-214.286-177.143-274.286-274.286-19.429-31.429-34.857-65.143-47.429-100-17.714-48.571-39.429-96.571-39.429-149.714 0-38.286 10.857-72.571 29.143-106.286 14.286-25.714 32.571-57.714 60.571-69.714 18.857-8.571 58.857-17.714 79.429-17.714 4 0 8 0 12 1.714 12 4 24.571 32 30.286 43.429 18.286 32.571 36 65.714 54.857 97.714 9.143 14.857 26.286 33.143 26.286 50.857 0 34.857-103.429 85.714-103.429 116.571 0 15.429 14.286 35.429 22.286 49.143 57.714 104 129.714 176 233.714 233.714 13.714 8 33.714 22.286 49.143 22.286 30.857 0 81.714-103.429 116.571-103.429 17.714 0 36 17.143 50.857 26.286 32 18.857 65.143 36.571 97.714 54.857 11.429 5.714 39.429 18.286 43.429 30.286 1.714 4 1.714 8 1.714 12z"],"width":804.5714285714286,"attrs":[],"isMulticolor":false,"isMulticolor2":false,"tags":["phone"],"defaultCode":61589,"grid":14},"attrs":[],"properties":{"name":"phone","id":3,"order":43,"prevSize":28,"code":61589},"setIdx":1,"setId":0,"iconIdx":3},{"icon":{"paths":["M731.429 681.714c0-2.857 0-6.286-1.143-9.143-3.429-10.286-86.857-52.571-102.857-61.714-10.857-6.286-24-18.857-37.143-18.857-25.143 0-62.286 74.857-84.571 74.857-11.429 0-25.714-10.286-36-16-75.429-42.286-127.429-94.286-169.714-169.714-5.714-10.286-16-24.571-16-36 0-22.286 74.857-59.429 74.857-84.571 0-13.143-12.571-26.286-18.857-37.143-9.143-16-51.429-99.429-61.714-102.857-2.857-1.143-6.286-1.143-9.143-1.143-14.857 0-44 6.857-57.714 12.571-37.714 17.143-65.143 89.143-65.143 128.571 0 38.286 15.429 73.143 28.571 108.571 45.714 125.143 181.714 261.143 306.857 306.857 35.429 13.143 70.286 28.571 108.571 28.571 39.429 0 111.429-27.429 128.571-65.143 5.714-13.714 12.571-42.857 12.571-57.714zM877.714 237.714v548.571c0 90.857-73.714 164.571-164.571 164.571h-548.571c-90.857 0-164.571-73.714-164.571-164.571v-548.571c0-90.857 73.714-164.571 164.571-164.571h548.571c90.857 0 164.571 73.714 164.571 164.571z"],"width":877.7142857142857,"attrs":[],"isMulticolor":false,"isMulticolor2":false,"tags":["phone-square"],"defaultCode":61592,"grid":14},"attrs":[],"properties":{"name":"phone-square","id":4,"order":35,"prevSize":28,"code":61592},"setIdx":1,"setId":0,"iconIdx":4},{"icon":{"paths":["M925.714 233.143c-25.143 36.571-56.571 69.143-92.571 95.429 0.571 8 0.571 16 0.571 24 0 244-185.714 525.143-525.143 525.143-104.571 0-201.714-30.286-283.429-82.857 14.857 1.714 29.143 2.286 44.571 2.286 86.286 0 165.714-29.143 229.143-78.857-81.143-1.714-149.143-54.857-172.571-128 11.429 1.714 22.857 2.857 34.857 2.857 16.571 0 33.143-2.286 48.571-6.286-84.571-17.143-148-91.429-148-181.143v-2.286c24.571 13.714 53.143 22.286 83.429 23.429-49.714-33.143-82.286-89.714-82.286-153.714 0-34.286 9.143-65.714 25.143-93.143 90.857 112 227.429 185.143 380.571 193.143-2.857-13.714-4.571-28-4.571-42.286 0-101.714 82.286-184.571 184.571-184.571 53.143 0 101.143 22.286 134.857 58.286 41.714-8 81.714-23.429 117.143-44.571-13.714 42.857-42.857 78.857-81.143 101.714 37.143-4 73.143-14.286 106.286-28.571z"],"width":950.8571428571428,"attrs":[],"isMulticolor":false,"isMulticolor2":false,"tags":["twitter"],"defaultCode":61593,"grid":14},"attrs":[],"properties":{"name":"twitter","id":5,"order":45,"prevSize":28,"code":61593},"setIdx":1,"setId":0,"iconIdx":5},{"icon":{"paths":["M548 6.857v150.857h-89.714c-70.286 0-83.429 33.714-83.429 82.286v108h167.429l-22.286 169.143h-145.143v433.714h-174.857v-433.714h-145.714v-169.143h145.714v-124.571c0-144.571 88.571-223.429 217.714-223.429 61.714 0 114.857 4.571 130.286 6.857z"],"width":602.2582857142856,"attrs":[],"isMulticolor":false,"isMulticolor2":false,"tags":["facebook","facebook-f"],"defaultCode":61594,"grid":14},"attrs":[],"properties":{"name":"facebook, facebook-f","id":6,"order":44,"prevSize":28,"code":61594},"setIdx":1,"setId":0,"iconIdx":6},{"icon":{"paths":["M1024 405.714v453.714c0 50.286-41.143 91.429-91.429 91.429h-841.143c-50.286 0-91.429-41.143-91.429-91.429v-453.714c17.143 18.857 36.571 35.429 57.714 49.714 94.857 64.571 190.857 129.143 284 197.143 48 35.429 107.429 78.857 169.714 78.857h1.143c62.286 0 121.714-43.429 169.714-78.857 93.143-67.429 189.143-132.571 284.571-197.143 20.571-14.286 40-30.857 57.143-49.714zM1024 237.714c0 64-47.429 121.714-97.714 156.571-89.143 61.714-178.857 123.429-267.429 185.714-37.143 25.714-100 78.286-146.286 78.286h-1.143c-46.286 0-109.143-52.571-146.286-78.286-88.571-62.286-178.286-124-266.857-185.714-40.571-27.429-98.286-92-98.286-144 0-56 30.286-104 91.429-104h841.143c49.714 0 91.429 41.143 91.429 91.429z"],"width":1024,"attrs":[],"isMulticolor":false,"isMulticolor2":false,"tags":["envelope"],"defaultCode":61664,"grid":14},"attrs":[],"properties":{"name":"envelope","id":7,"order":36,"prevSize":28,"code":61664},"setIdx":1,"setId":0,"iconIdx":7},{"icon":{"paths":["M525.143 744.571v-89.714c0-18.857-5.714-28.571-16.571-28.571-6.286 0-12.571 2.857-18.857 9.143v128c6.286 6.286 12.571 9.143 18.857 9.143 10.857 0 16.571-9.143 16.571-28zM630.286 674.857h37.714v-19.429c0-19.429-6.286-29.143-18.857-29.143s-18.857 9.714-18.857 29.143v19.429zM304 522.857v40h-45.714v241.714h-42.286v-241.714h-44.571v-40h132.571zM418.857 594.857v209.714h-38.286v-22.857c-14.857 17.143-29.143 25.714-43.429 25.714-12 0-20.571-5.143-24-16-2.286-6.286-3.429-16-3.429-30.857v-165.714h37.714v154.286c0 8.571 0 13.714 0.571 14.857 0.571 5.714 3.429 8.571 8.571 8.571 8 0 15.429-5.714 24-17.714v-160h38.286zM562.857 658.286v83.429c0 18.857-1.143 33.143-4 41.714-4.571 16-14.857 24-30.286 24-13.143 0-26.286-8-38.857-23.429v20.571h-38.286v-281.714h38.286v92c12-14.857 25.143-22.857 38.857-22.857 15.429 0 25.714 8 30.286 24 2.857 8.571 4 22.286 4 42.286zM706.286 732v5.143c0 12.571-0.571 20.571-1.143 24.571-1.143 8.571-4 16-8.571 22.857-10.286 15.429-26.286 22.857-45.714 22.857-20 0-35.429-7.429-46.286-21.714-8-10.286-12-26.857-12-49.143v-73.714c0-22.286 3.429-38.286 11.429-49.143 10.857-14.286 26.286-21.714 45.714-21.714 18.857 0 34.286 7.429 44.571 21.714 8 10.857 12 26.857 12 49.143v43.429h-76v37.143c0 19.429 6.286 29.143 19.429 29.143 9.143 0 14.857-5.143 17.143-14.857 0-2.286 0.571-10.857 0.571-25.714h38.857zM448.571 261.143v89.143c0 19.429-6.286 29.143-18.286 29.143-12.571 0-18.286-9.714-18.286-29.143v-89.143c0-19.429 5.714-29.714 18.286-29.714 12 0 18.286 10.286 18.286 29.714zM753.143 668.571v0c0-49.143 0-101.143-10.857-148.571-8-33.714-35.429-58.286-68-61.714-77.714-8.571-156.571-8.571-235.429-8.571-78.286 0-157.143 0-234.857 8.571-33.143 3.429-60.571 28-68 61.714-10.857 47.429-11.429 99.429-11.429 148.571v0c0 48.571 0 100.571 11.429 148.571 7.429 33.143 34.857 57.714 67.429 61.714 78.286 8.571 157.143 8.571 235.429 8.571s157.143 0 235.429-8.571c32.571-4 60-28.571 67.429-61.714 11.429-48 11.429-100 11.429-148.571zM321.714 296.571l51.429-169.143h-42.857l-29.143 111.429-30.286-111.429h-44.571c8.571 26.286 18.286 52.571 26.857 78.857 13.714 40 22.286 69.714 26.286 90.286v114.857h42.286v-114.857zM486.857 342.857v-74.286c0-22.286-4-38.857-12-49.714-10.857-14.286-25.714-21.714-44.571-21.714-19.429 0-34.286 7.429-44.571 21.714-8 10.857-12 27.429-12 49.714v74.286c0 22.286 4 38.857 12 49.714 10.286 14.286 25.143 21.714 44.571 21.714 18.857 0 33.714-7.429 44.571-21.714 8-10.286 12-27.429 12-49.714zM590.286 411.429h38.286v-211.429h-38.286v161.714c-8.571 12-16.571 17.714-24 17.714-5.143 0-8.571-2.857-9.143-9.143-0.571-1.143-0.571-5.714-0.571-14.857v-155.429h-38.286v167.429c0 14.857 1.143 24.571 3.429 31.429 4 10.286 12.571 15.429 24.571 15.429 14.286 0 28.571-8.571 44-25.714v22.857zM877.714 237.714v548.571c0 90.857-73.714 164.571-164.571 164.571h-548.571c-90.857 0-164.571-73.714-164.571-164.571v-548.571c0-90.857 73.714-164.571 164.571-164.571h548.571c90.857 0 164.571 73.714 164.571 164.571z"],"width":877.7142857142857,"attrs":[],"isMulticolor":false,"isMulticolor2":false,"tags":["youtube-square"],"defaultCode":61798,"grid":14},"attrs":[],"properties":{"name":"youtube-square","id":8,"order":37,"prevSize":28,"code":61798},"setIdx":1,"setId":0,"iconIdx":8},{"icon":{"paths":["M554.857 710.857v120.571c0 25.714-7.429 38.286-22.286 38.286-8.571 0-17.143-4-25.714-12.571v-172c8.571-8.571 17.143-12.571 25.714-12.571 14.857 0 22.286 13.143 22.286 38.286zM748 711.429v26.286h-51.429v-26.286c0-25.714 8.571-38.857 25.714-38.857s25.714 13.143 25.714 38.857zM196 586.857h61.143v-53.714h-178.286v53.714h60v325.143h57.143v-325.143zM360.571 912h50.857v-282.286h-50.857v216c-11.429 16-22.286 24-32.571 24-6.857 0-10.857-4-12-12-0.571-1.714-0.571-8-0.571-20v-208h-50.857v223.429c0 20 1.714 33.143 4.571 41.714 4.571 14.286 16.571 21.143 33.143 21.143 18.286 0 37.714-11.429 58.286-34.857v30.857zM605.714 827.429v-112.571c0-26.286-1.143-45.143-5.143-56.571-6.286-21.143-20.571-32-40.571-32-18.857 0-36.571 10.286-53.143 30.857v-124h-50.857v378.857h50.857v-27.429c17.143 21.143 34.857 31.429 53.143 31.429 20 0 34.286-10.857 40.571-31.429 4-12 5.143-30.857 5.143-57.143zM798.857 821.714v-7.429h-52c0 20.571-0.571 32-1.143 34.857-2.857 13.714-10.286 20.571-22.857 20.571-17.714 0-26.286-13.143-26.286-39.429v-49.714h102.286v-58.857c0-30.286-5.143-52-15.429-66.286-14.857-19.429-34.857-29.143-60.571-29.143-26.286 0-46.286 9.714-61.143 29.143-10.857 14.286-16 36-16 66.286v98.857c0 30.286 5.714 52.571 16.571 66.286 14.857 19.429 34.857 29.143 61.714 29.143s48-10.286 61.714-30.286c6.286-9.143 10.857-19.429 12-30.857 1.143-5.143 1.143-16.571 1.143-33.143zM451.429 300v-120c0-26.286-7.429-39.429-24.571-39.429-16.571 0-24.571 13.143-24.571 39.429v120c0 26.286 8 40 24.571 40 17.143 0 24.571-13.714 24.571-40zM862.286 729.143c0 65.714-0.571 136-14.857 200-10.857 45.143-47.429 78.286-91.429 82.857-105.143 12-211.429 12-317.143 12s-212 0-317.143-12c-44-4.571-81.143-37.714-91.429-82.857-14.857-64-14.857-134.286-14.857-200v0c0-66.286 0.571-136 14.857-200 10.857-45.143 47.429-78.286 92-83.429 104.571-11.429 210.857-11.429 316.571-11.429s212 0 317.143 11.429c44 5.143 81.143 38.286 91.429 83.429 14.857 64 14.857 133.714 14.857 200zM292 0h58.286l-69.143 228v154.857h-57.143v-154.857c-5.143-28-16.571-68-34.857-121.143-12.571-35.429-25.143-71.429-37.143-106.857h60.571l40.571 150.286zM503.429 190.286v100c0 30.286-5.143 53.143-16 67.429-14.286 19.429-34.286 29.143-60.571 29.143-25.714 0-45.714-9.714-60-29.143-10.857-14.857-16-37.143-16-67.429v-100c0-30.286 5.143-52.571 16-66.857 14.286-19.429 34.286-29.143 60-29.143 26.286 0 46.286 9.714 60.571 29.143 10.857 14.286 16 36.571 16 66.857zM694.857 97.714v285.143h-52v-31.429c-20.571 24-40 35.429-58.857 35.429-16.571 0-28.571-6.857-33.714-21.143-2.857-8.571-4.571-22.286-4.571-42.857v-225.143h52v209.714c0 12 0 18.857 0.571 20 1.143 8 5.143 12.571 12 12.571 10.286 0 21.143-8 32.571-24.571v-217.714h52z"],"width":877.7142857142857,"attrs":[],"isMulticolor":false,"isMulticolor2":false,"tags":["youtube"],"defaultCode":61799,"grid":14},"attrs":[],"properties":{"name":"youtube","id":9,"order":42,"prevSize":28,"code":61799},"setIdx":1,"setId":0,"iconIdx":9},{"icon":{"paths":["M738.286 364.571c4-82.857-26.857-124.571-92-126.857-88-2.857-147.429 46.857-178.286 149.143 16-6.857 31.429-10.857 46.857-10.857 32 0 46.286 18.286 42.286 54.857-1.714 21.714-16 53.714-42.286 95.429-26.857 42.286-46.857 62.857-60 62.857-17.143 0-32-32-46.857-96.571-4.571-19.429-13.143-67.429-25.714-145.714-11.429-72-41.714-105.714-91.429-101.143-20.571 2.286-52.571 20.571-93.714 57.143-30.857 26.857-61.143 54.857-92.571 82.286l29.714 38.286c28.571-19.429 45.143-29.714 49.714-29.714 21.714 0 42.286 34.286 61.143 102.286 17.143 62.857 34.286 125.143 51.429 188 25.714 68 56.571 102.286 93.714 102.286 59.429 0 132.571-56 218.857-168 83.429-107.429 126.857-192 129.143-253.714zM877.714 237.714v548.571c0 90.857-73.714 164.571-164.571 164.571h-548.571c-90.857 0-164.571-73.714-164.571-164.571v-548.571c0-90.857 73.714-164.571 164.571-164.571h548.571c90.857 0 164.571 73.714 164.571 164.571z"],"width":877.7142857142857,"attrs":[],"isMulticolor":false,"isMulticolor2":false,"tags":["vimeo-square"],"defaultCode":61844,"grid":14},"attrs":[],"properties":{"name":"vimeo-square","id":10,"order":38,"prevSize":28,"code":61844},"setIdx":1,"setId":0,"iconIdx":10},{"icon":{"paths":["M332.571 747.429c0 30.857-28 37.714-53.143 37.714-24.571 0-61.143-4-61.143-36 0-31.429 30.857-36.571 56-36.571 24 0 58.286 4 58.286 34.857zM312 481.143c0 28.571-11.429 48.571-42.286 48.571-31.429 0-44-18.286-44-48s11.429-51.429 44-51.429c29.143 0 42.286 24 42.286 50.857zM406.857 438.286v-71.429c-24.571 9.143-50.857 16.571-77.143 16.571-18.857-10.857-40.571-16.571-62.857-16.571-65.143 0-116.571 48-116.571 114.286 0 35.429 23.429 84.571 58.857 96.571v1.714c-18.286 8-21.714 30.286-21.714 48.571 0 18.857 6.857 34.286 23.429 44v1.714c-38.857 12.571-64.571 37.143-64.571 79.429 0 72.571 69.143 93.143 129.714 93.143 73.143 0 128-26.857 128-107.429 0-57.143-52-74.286-99.429-82.857-16-2.857-43.429-14.286-43.429-34.286 0-18.857 10.286-26.857 28-29.714 58.286-11.429 95.429-56.571 95.429-116.571 0-10.286-2.286-20-5.714-29.714 9.143-2.286 18.857-4.571 28-7.429zM440.571 677.714h78.286c-1.143-15.429-1.143-31.429-1.143-46.857v-221.143c0-13.143 0-26.286 1.143-39.429h-78.286c1.714 13.143 1.714 27.429 1.714 40.571v224c0 14.286 0 28.571-1.714 42.857zM731.429 668.571v-69.143c-11.429 8-25.143 12-38.857 12-25.714 0-30.286-25.714-30.286-46.857v-128.571h29.714c10.286 0 20 1.143 30.286 1.143v-66.857h-60c0-19.429-1.143-38.857 1.714-58.286h-80c1.714 10.286 2.286 20.571 2.286 31.429v26.857h-34.286v66.857c6.857-0.571 13.714-1.714 21.143-1.714 4 0 8.571 0.571 13.143 0.571v1.143h-1.143v124c0 61.714 9.143 121.143 84.571 121.143 21.143 0 42.857-3.429 61.714-13.714zM528 265.143c0-26.857-20-52-48-52s-48.571 24.571-48.571 52c0 26.857 21.143 50.857 48.571 50.857s48-24.571 48-50.857zM877.714 237.714v548.571c0 90.857-73.714 164.571-164.571 164.571h-548.571c-90.857 0-164.571-73.714-164.571-164.571v-548.571c0-90.857 73.714-164.571 164.571-164.571h548.571c90.857 0 164.571 73.714 164.571 164.571z"],"width":877.7142857142857,"attrs":[],"isMulticolor":false,"isMulticolor2":false,"tags":["git-square"],"defaultCode":61906,"grid":14},"attrs":[],"properties":{"name":"git-square","id":11,"order":39,"prevSize":28,"code":61906},"setIdx":1,"setId":0,"iconIdx":11},{"icon":{"paths":["M340 865.143c0-50.286-55.429-57.143-94.286-57.143-40.571 0-90.286 8.571-90.286 59.429 0 51.429 58.857 57.714 98.286 57.714 41.714 0 86.286-10.286 86.286-60zM306.286 433.714c0-42.857-20.571-81.714-68-81.714-52.571 0-70.857 34.857-70.857 82.857 0 47.429 20.571 77.143 70.857 77.143 49.714 0 68-32 68-78.286zM460 248.571v115.429c-14.857 5.143-29.714 9.143-45.143 12.571 5.714 15.429 9.143 31.429 9.143 48 0 96.571-59.429 170.286-154.286 188-28.571 5.714-45.143 17.714-45.143 48.571 0 87.429 230.857 28 230.857 189.143 0 130.857-88.571 173.714-207.429 173.714-97.714 0-209.143-32.571-209.143-150.286 0-68.571 41.714-108 104-128.571v-2.286c-26.286-16-38.286-41.143-38.286-72 0-29.143 6.286-65.143 36-78.286v-2.286c-57.714-19.429-95.429-98.857-95.429-156.571 0-106.857 82.857-185.143 188.571-185.143 35.429 0 70.857 9.143 101.714 26.857 42.857 0 85.143-11.429 124.571-26.857zM641.714 752h-126.857c2.286-25.714 2.286-50.857 2.286-76.571v-348c0-24.571 0.571-49.143-2.286-73.143h126.857c-2.857 23.429-2.286 47.429-2.286 70.857v350.286c0 25.714 0 50.857 2.286 76.571zM985.143 625.143v112c-30.286 16.571-65.143 22.286-99.429 22.286-122.286 0-136.571-96.571-136.571-196v-200.571h1.143v-2.286c-7.429 0-14.286-1.143-21.143-1.143-11.429 0-22.857 1.714-33.714 3.429v-108.571h54.857v-43.429c0-17.143-0.571-34.286-3.429-50.857h129.714c-4.571 31.429-3.429 62.857-3.429 94.286h97.714v108.571c-16.571 0-33.143-2.286-49.143-2.286h-48.571v208.571c0 33.714 7.429 74.857 49.714 74.857 22.286 0 44-6.286 62.286-18.857zM656 84c0 42.857-33.143 82.857-77.143 82.857-45.143 0-78.857-39.429-78.857-82.857 0-44 33.143-84 78.857-84 45.143 0 77.143 41.143 77.143 84z"],"width":1024,"attrs":[],"isMulticolor":false,"isMulticolor2":false,"tags":["git"],"defaultCode":61907,"grid":14},"attrs":[],"properties":{"name":"git","id":12,"order":40,"prevSize":28,"code":61907},"setIdx":1,"setId":0,"iconIdx":12},{"icon":{"paths":["M976.571 296c-4 90.286-67.429 214.286-189.714 372-126.857 164-233.143 246.286-321.143 246.286-54.286 0-100-50.286-137.143-150.286-25.143-91.429-50.286-183.429-75.429-275.429-27.429-100-57.714-149.714-89.714-149.714-6.857 0-30.857 14.286-72.571 43.429l-44-56c45.714-40.571 90.857-81.714 136-121.143 60.571-53.714 106.857-80.571 137.714-83.429 72.571-6.857 116.571 42.286 133.714 148 17.714 114.286 30.857 185.714 37.714 213.143 21.143 94.857 43.429 142.286 68.571 142.286 19.429 0 48.571-30.286 88-92 38.857-61.714 59.429-108.571 62.286-140.571 5.143-53.143-15.429-79.429-62.286-79.429-22.286 0-45.143 5.143-69.143 14.857 45.714-149.714 133.143-222.286 262.286-218.286 95.429 2.857 140.571 65.143 134.857 186.286z"],"width":1029.12,"attrs":[],"isMulticolor":false,"isMulticolor2":false,"tags":["vimeo"],"defaultCode":62077,"grid":14},"attrs":[],"properties":{"name":"vimeo","id":13,"order":46,"prevSize":28,"code":62077},"setIdx":1,"setId":0,"iconIdx":13},{"icon":{"paths":["M424.633 357.564l-386.090 308.871h946.914v-100h-661.836l163.48-130.785z"],"attrs":[{}],"isMulticolor":false,"isMulticolor2":false,"grid":14,"tags":["back"]},"attrs":[{}],"properties":{"order":49,"id":14,"name":"back","prevSize":28,"code":59648},"setIdx":1,"setId":0,"iconIdx":14}],"height":1024,"metadata":{"name":"icomoon"},"preferences":{"showGlyphs":true,"showQuickUse":true,"showQuickUse2":true,"showSVGs":true,"fontPref":{"prefix":"icon-","metadata":{"fontFamily":"icomoon"},"metrics":{"emSize":1024,"baseline":6.25,"whitespace":50},"embed":false},"imagePref":{"prefix":"icon-","png":true,"useClassSelector":true,"color":0,"bgColor":16777215,"classSelector":".icon"},"historySize":50,"showCodes":true,"gridSize":16}} \ No newline at end of file diff --git a/src/assets/scss/forms.scss b/src/assets/scss/forms.scss index 12f4a41..ebd4f0a 100644 --- a/src/assets/scss/forms.scss +++ b/src/assets/scss/forms.scss @@ -56,7 +56,7 @@ select { border: none; background: $black; display: inline-block; - padding: 8px 20px 10px 20px !important; + padding: 10px 20px 10px 20px !important; text-align: center; font-family: $font-20; text-transform: uppercase; diff --git a/src/assets/scss/global.scss b/src/assets/scss/global.scss index c575f20..03331ed 100644 --- a/src/assets/scss/global.scss +++ b/src/assets/scss/global.scss @@ -24,11 +24,10 @@ button { } } -.w-100 { - width: 100%; +@each $size in 10,20,30,40,50,60,70,80,90,100 { + .w-#{$size} {width: percentage($size/100) !important;} } - .particles { position: fixed; top: 0; diff --git a/src/assets/scss/icons.scss b/src/assets/scss/icons.scss index dba71be..0dd8488 100644 --- a/src/assets/scss/icons.scss +++ b/src/assets/scss/icons.scss @@ -25,6 +25,16 @@ -moz-osx-font-smoothing: grayscale; } +.icon-arrow-left:before { + content: "\e901"; +} +.icon-chevron-down:before { + content: "\e902"; +} +.icon-delete:before { + content: "\e903"; +} + .icon-envelope-o:before { content: "\f003"; } diff --git a/src/assets/scss/variables.scss b/src/assets/scss/variables.scss index 12602c7..2ec5306 100644 --- a/src/assets/scss/variables.scss +++ b/src/assets/scss/variables.scss @@ -23,7 +23,7 @@ $breadcrumb-height: 60px; // Colors $white: #fff; $black: #000; -$gray: #ccc; +$gray: #999; $light-gray: #eee; $dark-gray: #333; From 4cd71c37c5a05ec93b99ac84ce5fd5e68933866a Mon Sep 17 00:00:00 2001 From: Dslak Date: Fri, 4 Dec 2020 11:42:07 +0100 Subject: [PATCH 20/38] add videos --- src/app/admin/admin.component.html | 20 +++++++++---------- src/app/admin/admin.component.scss | 6 ++++++ src/app/admin/admin.component.ts | 25 ++++++++++++----------- src/assets/fonts/icomoon.eot | Bin 5964 -> 8396 bytes src/assets/fonts/icomoon.svg | 10 ++++++++++ src/assets/fonts/icomoon.ttf | Bin 5800 -> 8232 bytes src/assets/fonts/icomoon.woff | Bin 5876 -> 8308 bytes src/assets/fonts/selection.json | 2 +- src/assets/scss/forms.scss | 15 +++++--------- src/assets/scss/icons.scss | 31 ++++++++++++++++++++++++++++- src/assets/scss/variables.scss | 1 + 11 files changed, 76 insertions(+), 34 deletions(-) diff --git a/src/app/admin/admin.component.html b/src/app/admin/admin.component.html index 6909bdf..5901b5b 100644 --- a/src/app/admin/admin.component.html +++ b/src/app/admin/admin.component.html @@ -3,11 +3,11 @@
-
- Add work -
+
+ {{sectionTitle}} + +
+ Select work + +
+ +
Title @@ -37,10 +48,7 @@
Type
@@ -61,8 +69,8 @@
- - + +
diff --git a/src/app/admin/admin.component.ts b/src/app/admin/admin.component.ts index e441e1e..9f015cc 100644 --- a/src/app/admin/admin.component.ts +++ b/src/app/admin/admin.component.ts @@ -19,8 +19,12 @@ export class AdminComponent implements OnInit { public userName: string = '' public password: string = '' public activeEditor: string = '' - public exhibitions: any = [] + public sectionTitle: string = '' + public activeModify: boolean = false + public modifyId: number = null + public exhibitions: any = [] + public works: any = [] public selectedExhibitions: any = [] public selectedVideos: any = [] public selectedGallery: any = [] @@ -34,7 +38,13 @@ export class AdminComponent implements OnInit { public videoType: string = '' public videoURL: string = '' - editorConfig: AngularEditorConfig = editorConfig + public editorConfig: AngularEditorConfig = editorConfig + public workSections: any = [ + {title: 'Entertainment', section: 'entertainment'}, + {title: 'Installations', section: 'installations'}, + {title: 'Performances', section: 'performances'}, + {title: 'Workshops', section: 'workshops'} + ] constructor( private authService: AuthService, @@ -54,6 +64,14 @@ export class AdminComponent implements OnInit { }).catch((e) => { console.error('getPortfolio CATCH', e) }) + + this.apisService.getPortfolio('portfolio').toPromise().then((response) => { + this.works = response.items + },(error) => { + console.error('getPortfolio ERROR', error) + }).catch((e) => { + console.error('getPortfolio CATCH', e) + }) },(error) => { console.error('Auth ERROR', error) }).catch((e) => { @@ -76,7 +94,20 @@ export class AdminComponent implements OnInit { } showEditor(section): void { + switch(section) { + case 'works-add': + this.sectionTitle = 'Add work' + break; + case 'works-modify': + this.sectionTitle = 'Modify work' + break; + case 'works-delete': + this.sectionTitle = 'Delete work' + break; + } + this.activeModify = false this.activeEditor = section + this.resetFields() } exhibitionAdd(id): void { @@ -147,6 +178,36 @@ export class AdminComponent implements OnInit { }) } + selectWork(id): void { + + this.activeModify = true + this.modifyId = id + this.apisService.getDetails('works', id).toPromise().then((response) => { + const detail = response.item + this.apisService.getPortfolio('exhibitions').toPromise().then((response) => { + this.exhibitions = response.items + this.title = detail.title + this.content = detail.content + this.type = detail.type + this.tags = detail.tags + this.selectedExhibitions = detail.exhibitions.length ? + this.exhibitions.filter(item => detail.exhibitions.map(a => a.id).indexOf(item.id) > -1) : [] + this.selectedGallery = detail.gallery ? JSON.parse(detail.gallery) : [] + this.selectedVideos = detail.videos ? JSON.parse(detail.videos) : [] + + console.log(detail.exhibitions, this.selectedExhibitions) + },(error) => { + console.error(error) + }).catch((e) => { + console.error(e) + }) + },(error) => { + console.error(error) + }).catch((e) => { + console.error(e) + }) + } + saveWork(): void { let error = false @@ -167,9 +228,10 @@ export class AdminComponent implements OnInit { } if(error) { - console.log('ERORS:',errorMessages) + console.log('ERRORS:',errorMessages) } else { const body = { + id: this.activeModify ? this.modifyId : null, token: window.sessionStorage.getItem('authToken'), title: this.title, content: this.content, @@ -182,14 +244,9 @@ export class AdminComponent implements OnInit { } this.apisService.saveWork(body).toPromise().then((response) => { - console.log(response) - this.title = '' - this.content = '' - this.type = '' - this.tags = '' - this.selectedExhibitions = [] - this.selectedGallery = [] - this.selectedVideos = [] + this.resetFields() + + this.works = response.items },(error) => { console.error(error) }).catch((e) => { @@ -197,4 +254,14 @@ export class AdminComponent implements OnInit { }) } } + + resetFields(): void { + this.title = '' + this.content = '' + this.type = '' + this.tags = '' + this.selectedExhibitions = [] + this.selectedGallery = [] + this.selectedVideos = [] + } } From f090ed8aff38c987f2f7ba0e81b02c5450bc2bc8 Mon Sep 17 00:00:00 2001 From: Dslak Date: Fri, 4 Dec 2020 19:19:17 +0100 Subject: [PATCH 25/38] delete work --- src/apis/auth.php | 10 +++-- src/apis/index.php | 23 +----------- src/apis/remove.php | 18 ++++++--- src/apis/upload.php | 27 ++++++++++++-- src/apis/work.php | 59 ++++++++++++++++++++++++++++++ src/app/admin/admin.component.html | 35 +++++++++++++++--- src/app/admin/admin.component.scss | 9 ++++- src/app/admin/admin.component.ts | 21 ++++++++++- src/app/services/apis.service.ts | 7 ++++ src/assets/images/angle-down.svg | 7 ++++ src/assets/scss/forms.scss | 4 ++ 11 files changed, 179 insertions(+), 41 deletions(-) create mode 100644 src/apis/work.php create mode 100644 src/assets/images/angle-down.svg diff --git a/src/apis/auth.php b/src/apis/auth.php index 9626b05..483eb4e 100755 --- a/src/apis/auth.php +++ b/src/apis/auth.php @@ -1,7 +1,7 @@ status = array(); @@ -9,17 +9,21 @@ $data = json_decode(file_get_contents("php://input")); if(isset($_GET['act']) && $_GET['act'] == 'login') { if($data->usr == 'admin' && $data->pwd == 'JohnHolmes') { + http_response_code(200); $content->status = 200; $content->authToken = base64_encode('admin:JohnHolmes'.date("Y-m-d")); } else { - $content->status = 403; + http_response_code(401); + $content->status = 401; } } else if(isset($_GET['act']) && $_GET['act'] == 'check') { if($data->token == base64_encode('admin:JohnHolmes'.date("Y-m-d"))) { + http_response_code(200); $content->status = 200; $content->authToken = base64_encode('admin:JohnHolmes'.date("Y-m-d")); } else { - $content->status = 403; + http_response_code(401); + $content->status = 401; } } header("Access-Control-Allow-Origin: *"); diff --git a/src/apis/index.php b/src/apis/index.php index e8e2b18..10fd756 100644 --- a/src/apis/index.php +++ b/src/apis/index.php @@ -1,7 +1,7 @@ status = 200; - $content->authToken = md5(date("Y-m-d")); - } else { - $content->status = 403; - } - break; - case 'check': - if($_POST['token'] == md5(date("Y-m-d"))) { - $content->status = 200; - $content->authToken = md5(date("Y-m-d")); - } else { - $content->status = 403; - } - break; - } } +http_response_code(200); header("Access-Control-Allow-Origin: *"); header("Content-Type: application/json; charset=UTF-8"); diff --git a/src/apis/remove.php b/src/apis/remove.php index 6051c5a..8f3b4a0 100644 --- a/src/apis/remove.php +++ b/src/apis/remove.php @@ -1,14 +1,22 @@ imageUrl = 'http://unsplash.it/800/600'; +$data = json_decode(file_get_contents("php://input")); + +if(isset($data->token) && $data->token == base64_encode('admin:JohnHolmes'.date("Y-m-d"))) { + + @unlink('..'.$data->url); + http_response_code(200); + $content->status = 200; + +} else { + http_response_code(401); + $content->status = 401; +} header("Access-Control-Allow-Origin: *"); header("Content-Type: application/json; charset=UTF-8"); -header("Access-Control-Allow-Methods: GET"); +header("Access-Control-Allow-Methods: POST"); header("Access-Control-Max-Age: 3600"); echo json_encode($content); diff --git a/src/apis/upload.php b/src/apis/upload.php index fcdbcc6..39e84a7 100644 --- a/src/apis/upload.php +++ b/src/apis/upload.php @@ -1,10 +1,29 @@ imageUrl = 'http://unsplash.it/800/600'; + +if(isset($_POST['token']) && $_POST['token'] == base64_encode('admin:JohnHolmes'.date("Y-m-d"))) { + + if(is_uploaded_file($_FILES['file']['tmp_name'])) { + $file = $_FILES['file']['tmp_name']; + $filename = date("YmdHis").".".end((explode(".", $_FILES["file"]["name"]))); + + $path = isset($_POST['path']) ? "/uploads/".$_POST['path'] : "/uploads/"; + @move_uploaded_file($file, "..".$path."/".$filename); + + http_response_code(200); + $content->status = 200; + $content->imageUrl = $path."/".$filename; + + } else { + http_response_code(401); + $content->status = 401; + $content->megssage = 'No file uploaded'; + } +} else { + http_response_code(401); + $content->status = 401; +} header("Access-Control-Allow-Origin: *"); header("Content-Type: application/json; charset=UTF-8"); diff --git a/src/apis/work.php b/src/apis/work.php new file mode 100644 index 0000000..4736285 --- /dev/null +++ b/src/apis/work.php @@ -0,0 +1,59 @@ +token) && $data->token == base64_encode('admin:JohnHolmes'.date("Y-m-d"))) { + + if(isset($_GET['act']) && $_GET['act'] == 'save') { + + if(isset($data->id)) { + $q = mysqli_query($conn,"UPDATE `works` SET title = '".addslashes($data->title)."', content = '".addslashes($data->content)."', + type = '".$data->type."', tags = '".$data->tags."', image = '".$data->image."', + exhibitions = '".$data->exhibitions."', gallery = '".$data->gallery."', videos = '".$data->videos."' + WHERE id = ".$data->id.""); + } else { + $q = mysqli_query($conn,"INSERT INTO `works` (`id`, `title`, `content`, `type`, `tags`, `image`, `exhibitions`, `gallery`, `videos`) + VALUES (NULL, '".addslashes($data->title)."', '".addslashes($data->content)."', '".$data->type."', + '".$data->tags."', '".$data->image."', '".$data->exhibitions."', '".$data->gallery."', + '".$data->videos."')"); + } + + $qe = mysqli_query($conn,"SELECT * FROM `works` ORDER BY id DESC"); + if(mysqli_num_rows($qe) > 0) { + $content->items = array(); + while($re = mysqli_fetch_array($qe)) { + $item = null; + $item->id = $re['id']; + $item->title = $re['title']; + $item->type = $re['type']; + $item->tags = $re['tags']; + $item->image = $re['image']; + array_push($content->items, $item); + } + } + + if($q) { + http_response_code(201); + $content->status = 201; + } else { + http_response_code(403); + $content->status = 403; + } + } + +} else { + http_response_code(401); + $content->status = 401; +} +header("Access-Control-Allow-Origin: *"); +header("Content-Type: application/json; charset=UTF-8"); +header("Access-Control-Allow-Methods: POST"); +header("Access-Control-Max-Age: 3600"); + +echo json_encode($content); + +?> diff --git a/src/app/admin/admin.component.html b/src/app/admin/admin.component.html index ca38265..711c236 100644 --- a/src/app/admin/admin.component.html +++ b/src/app/admin/admin.component.html @@ -29,18 +29,17 @@
{{sectionTitle}} - +
- Select work
-
+
Title @@ -113,6 +112,32 @@
+ + +
+
+ Title +
{{title}} | {{type}}
+
+
+ Content +
+
+ +
+ Gallery + +
+ +
+ +
+
diff --git a/src/app/admin/admin.component.scss b/src/app/admin/admin.component.scss index 01f960e..729fed7 100644 --- a/src/app/admin/admin.component.scss +++ b/src/app/admin/admin.component.scss @@ -34,13 +34,13 @@ padding: 20px 0 5px 0; } - .gallery-container { display: flex; background: $white; border-radius: 4px; width: 100%; padding: 5px; + min-height: 100px; .image-add { appearance: none; @@ -142,6 +142,13 @@ color: $gray; } } + + .preview-box { + border-radius: 4px; + background: $white-alpha2; + padding: 10px; + width: 100%; + } } } diff --git a/src/app/admin/admin.component.ts b/src/app/admin/admin.component.ts index 9f015cc..efe953f 100644 --- a/src/app/admin/admin.component.ts +++ b/src/app/admin/admin.component.ts @@ -107,6 +107,7 @@ export class AdminComponent implements OnInit { } this.activeModify = false this.activeEditor = section + this.modifyId = null this.resetFields() } @@ -209,7 +210,6 @@ export class AdminComponent implements OnInit { } saveWork(): void { - let error = false let errorMessages = [] const mainImage = this.selectedGallery.filter(item => item.main) @@ -245,7 +245,6 @@ export class AdminComponent implements OnInit { this.apisService.saveWork(body).toPromise().then((response) => { this.resetFields() - this.works = response.items },(error) => { console.error(error) @@ -255,6 +254,23 @@ export class AdminComponent implements OnInit { } } + deleteWork(id): void { + + const body = { + id: id, + token: window.sessionStorage.getItem('authToken') + } + + this.apisService.deleteWork(body).toPromise().then((response) => { + this.resetFields() + this.works = response.items + },(error) => { + console.error(error) + }).catch((e) => { + console.error(e) + }) + } + resetFields(): void { this.title = '' this.content = '' @@ -263,5 +279,6 @@ export class AdminComponent implements OnInit { this.selectedExhibitions = [] this.selectedGallery = [] this.selectedVideos = [] + this.modifyId = null } } diff --git a/src/app/services/apis.service.ts b/src/app/services/apis.service.ts index 4f730e1..0ffcf69 100644 --- a/src/app/services/apis.service.ts +++ b/src/app/services/apis.service.ts @@ -52,5 +52,12 @@ export class ApisService extends BaseService { ) } + deleteWork(body): Observable { + let urlApi = `${this.restApi}work.php?act=delete` + return this.http.post(urlApi, JSON.stringify(body)).pipe( + catchError(this.handleError) + ) + } + } diff --git a/src/assets/images/angle-down.svg b/src/assets/images/angle-down.svg new file mode 100644 index 0000000..1008067 --- /dev/null +++ b/src/assets/images/angle-down.svg @@ -0,0 +1,7 @@ + + + + + + + diff --git a/src/assets/scss/forms.scss b/src/assets/scss/forms.scss index d60b308..60e4caa 100644 --- a/src/assets/scss/forms.scss +++ b/src/assets/scss/forms.scss @@ -50,6 +50,10 @@ select { .input-select { padding: 9px 20px !important; + background-image: url('/assets/images/angle-down.svg'); + background-size: 28px; + background-position: right 10px top 10px; + background-repeat: no-repeat; } .button { From d78fc019ee1216cb1e2916d3f803ab868c6cbab3 Mon Sep 17 00:00:00 2001 From: Dslak Date: Sat, 5 Dec 2020 17:42:16 +0100 Subject: [PATCH 26/38] admin exhibitions --- src/apis/exhibition.php | 61 ++++++++++ src/app/admin/admin.component.html | 61 ++++++++-- src/app/admin/admin.component.scss | 3 +- src/app/admin/admin.component.ts | 180 ++++++++++++++++++++++++++--- src/app/services/apis.service.ts | 14 +++ 5 files changed, 294 insertions(+), 25 deletions(-) create mode 100644 src/apis/exhibition.php diff --git a/src/apis/exhibition.php b/src/apis/exhibition.php new file mode 100644 index 0000000..2c30b34 --- /dev/null +++ b/src/apis/exhibition.php @@ -0,0 +1,61 @@ +token) && $data->token == base64_encode('admin:JohnHolmes'.date("Y-m-d"))) { + + if(isset($_GET['act']) && $_GET['act'] == 'save') { + + if(isset($data->id)) { + $q = mysqli_query($conn,"UPDATE `exhibitions` SET title = '".addslashes($data->title)."', content = '".addslashes($data->content)."', + tags = '".$data->tags."', date_from = '".$data->date_from."', date_to = '".$data->date_to."', + image = '".$data->image."', exhibitions = '".$data->exhibitions."', gallery = '".$data->gallery."', + videos = '".$data->videos."' WHERE id = ".$data->id.""); + } else { + $q = mysqli_query($conn,"INSERT INTO `exhibitions` + (`id`, `title`, `content`, `tags`, `date_from`, `date_to`, `image`, `works`, `gallery`, `videos`) + VALUES (NULL, '".addslashes($data->title)."', '".addslashes($data->content)."', '".$data->tags."', + '".$data->date_from."', '".$data->date_to."', '".$data->image."', '".$data->exhibitions."', + '".$data->gallery."', '".$data->videos."')"); + } + + $qe = mysqli_query($conn,"SELECT * FROM `exhibitions` ORDER BY id DESC"); + if(mysqli_num_rows($qe) > 0) { + $content->items = array(); + while($re = mysqli_fetch_array($qe)) { + $item = null; + $item->id = $re['id']; + $item->title = $re['title']; + $item->date_from = $re['date_from']; + $item->date_to = $re['date_to']; + $item->tags = $re['tags']; + $item->image = $re['image']; + array_push($content->items, $item); + } + } + + if($q) { + http_response_code(201); + $content->status = 201; + } else { + http_response_code(403); + $content->status = 403; + } + } + +} else { + http_response_code(401); + $content->status = 401; +} +header("Access-Control-Allow-Origin: *"); +header("Content-Type: application/json; charset=UTF-8"); +header("Access-Control-Allow-Methods: POST"); +header("Access-Control-Max-Age: 3600"); + +echo json_encode($content); + +?> diff --git a/src/app/admin/admin.component.html b/src/app/admin/admin.component.html index 711c236..e5615a0 100644 --- a/src/app/admin/admin.component.html +++ b/src/app/admin/admin.component.html @@ -24,12 +24,17 @@ + + Exhibitions + + +
-
+
{{sectionTitle}} -
+
-
-
+ +
+ +
+ +
+
Title
-
+
Type
+
+ Date from + +
+
+ Date to + +
Content @@ -73,7 +99,8 @@
-
+ +
Exhibitions + + + + + Selected works + + {{sw.type}} | {{sw.title}} + + +
+
Video
@@ -114,10 +157,12 @@ -
+
Title -
{{title}} | {{type}}
+
{{type}} | {{title}}
+
{{dateFrom}} | {{title}}
Content diff --git a/src/app/admin/admin.component.scss b/src/app/admin/admin.component.scss index 729fed7..be80feb 100644 --- a/src/app/admin/admin.component.scss +++ b/src/app/admin/admin.component.scss @@ -4,7 +4,7 @@ .login-form-container { text-align: center; - padding: 40px; + padding: 30px 40px; color: $white; .login-label { @@ -120,6 +120,7 @@ } .selected-exhibition, + .selected-work, .selected-video { display: block; position: relative; diff --git a/src/app/admin/admin.component.ts b/src/app/admin/admin.component.ts index efe953f..54e129b 100644 --- a/src/app/admin/admin.component.ts +++ b/src/app/admin/admin.component.ts @@ -26,6 +26,7 @@ export class AdminComponent implements OnInit { public exhibitions: any = [] public works: any = [] public selectedExhibitions: any = [] + public selectedWorks: any = [] public selectedVideos: any = [] public selectedGallery: any = [] @@ -34,6 +35,8 @@ export class AdminComponent implements OnInit { public type: string = '' public content: string = '' public tags: string = '' + public dateFrom: string = '' + public dateTo: string = '' public mainImage: string = '' public videoType: string = '' public videoURL: string = '' @@ -55,26 +58,30 @@ export class AdminComponent implements OnInit { const body = { token: window.sessionStorage.getItem('authToken') } this.authService.authCheck(body).toPromise().then((response) => { - this.authCheck = response.status == 200 + this.authCheck = response.status && response.status == 200 - this.apisService.getPortfolio('exhibitions').toPromise().then((response) => { - this.exhibitions = response.items - },(error) => { - console.error('getPortfolio ERROR', error) - }).catch((e) => { - console.error('getPortfolio CATCH', e) - }) + if(this.authCheck) { + this.apisService.getPortfolio('exhibitions').toPromise().then((response) => { + this.exhibitions = response.items + },(error) => { + console.error('getPortfolio ERROR', error) + }).catch((e) => { + console.error('getPortfolio CATCH', e) + }) - this.apisService.getPortfolio('portfolio').toPromise().then((response) => { - this.works = response.items - },(error) => { - console.error('getPortfolio ERROR', error) - }).catch((e) => { - console.error('getPortfolio CATCH', e) - }) + this.apisService.getPortfolio('portfolio').toPromise().then((response) => { + this.works = response.items + },(error) => { + console.error('getPortfolio ERROR', error) + }).catch((e) => { + console.error('getPortfolio CATCH', e) + }) + } },(error) => { + this.authCheck = false console.error('Auth ERROR', error) }).catch((e) => { + this.authCheck = false console.error('Auth CATCH', e) }) } @@ -104,6 +111,15 @@ export class AdminComponent implements OnInit { case 'works-delete': this.sectionTitle = 'Delete work' break; + case 'exhibitions-add': + this.sectionTitle = 'Add exhibition' + break; + case 'exhibitions-modify': + this.sectionTitle = 'Modify exhibition' + break; + case 'exhibitions-delete': + this.sectionTitle = 'Delete exhibition' + break; } this.activeModify = false this.activeEditor = section @@ -125,6 +141,20 @@ export class AdminComponent implements OnInit { this.selectedExhibitions = this.selectedExhibitions.filter(item => item.id != id) } + workAdd(id): void { + this.selectedWorks.push( + this.works.filter(item => item.id == id)[0] + ) + this.works = this.works.filter(item => item.id != id) + } + + workRemove(id): void { + this.works.push( + this.selectedWorks.filter(item => item.id == id)[0] + ) + this.selectedWorks = this.selectedWorks.filter(item => item.id != id) + } + videoAdd(): void { this.selectedVideos.push({ type: this.videoType, @@ -196,7 +226,6 @@ export class AdminComponent implements OnInit { this.selectedGallery = detail.gallery ? JSON.parse(detail.gallery) : [] this.selectedVideos = detail.videos ? JSON.parse(detail.videos) : [] - console.log(detail.exhibitions, this.selectedExhibitions) },(error) => { console.error(error) }).catch((e) => { @@ -209,6 +238,45 @@ export class AdminComponent implements OnInit { }) } + selectExhibition(id): void { + + this.activeModify = true + this.modifyId = id + this.apisService.getDetails('exhibitions', id).toPromise().then((response) => { + const detail = response.item + this.apisService.getPortfolio('portfolio').toPromise().then((response) => { + this.works = response.items + this.title = detail.title + this.content = detail.content + this.tags = detail.tags + this.dateFrom = detail.date_from + this.dateTo = detail.date_to + this.selectedWorks = detail.works.length ? + this.works.filter(item => detail.works.map(a => a.id).indexOf(item.id) > -1) : [] + this.selectedGallery = detail.gallery ? JSON.parse(detail.gallery) : [] + this.selectedVideos = detail.videos ? JSON.parse(detail.videos) : [] + + },(error) => { + console.error(error) + }).catch((e) => { + console.error(e) + }) + },(error) => { + console.error(error) + }).catch((e) => { + console.error(e) + }) + } + + saveData(): void { + if(this.activeEditor == 'works-add' || this.activeEditor == 'works-modify') { + this.saveWork() + } + if(this.activeEditor == 'exhibitions-add' || this.activeEditor == 'exhibitions-modify') { + this.saveExhibition() + } + } + saveWork(): void { let error = false let errorMessages = [] @@ -222,6 +290,7 @@ export class AdminComponent implements OnInit { error = true errorMessages.push('No type selected') } + if(this.selectedGallery.length == 0 || mainImage.length == 0){ error = true errorMessages.push('No main image selected') @@ -254,6 +323,65 @@ export class AdminComponent implements OnInit { } } + saveExhibition(): void { + let error = false + let errorMessages = [] + const mainImage = this.selectedGallery.filter(item => item.main) + + if(!this.title){ + error = true + errorMessages.push('No title') + } + if(!this.dateFrom){ + error = true + errorMessages.push('No date from selected') + } + if(!this.dateTo){ + error = true + errorMessages.push('No date to selected') + } + if(this.selectedGallery.length == 0 || mainImage.length == 0){ + error = true + errorMessages.push('No main image selected') + } + + if(error) { + console.log('ERRORS:',errorMessages) + } else { + const body = { + id: this.activeModify ? this.modifyId : null, + token: window.sessionStorage.getItem('authToken'), + title: this.title, + content: this.content, + date_from: this.dateFrom, + date_to: this.dateTo, + tags: this.tags, + image: mainImage[0].url, + works: this.selectedWorks.map(a => a.id).join(','), + gallery: JSON.stringify(this.selectedGallery), + videos: JSON.stringify(this.selectedVideos) + } + + this.apisService.saveExhibition(body).toPromise().then((response) => { + this.resetFields() + this.exhibitions = response.items + },(error) => { + console.error(error) + }).catch((e) => { + console.error(e) + }) + } + } + + deleteData(id): void { + if(this.activeEditor == 'works-delete') { + this.deleteWork(id) + } + if(this.activeEditor == 'exhibitions-delete') { + this.deleteExhibition(id) + } + } + deleteWork(id): void { const body = { @@ -271,12 +399,32 @@ export class AdminComponent implements OnInit { }) } + deleteExhibition(id): void { + + const body = { + id: id, + token: window.sessionStorage.getItem('authToken') + } + + this.apisService.deleteExhibition(body).toPromise().then((response) => { + this.resetFields() + this.exhibitions = response.items + },(error) => { + console.error(error) + }).catch((e) => { + console.error(e) + }) + } + resetFields(): void { this.title = '' this.content = '' this.type = '' this.tags = '' + this.dateFrom = '' + this.dateTo = '' this.selectedExhibitions = [] + this.selectedWorks = [] this.selectedGallery = [] this.selectedVideos = [] this.modifyId = null diff --git a/src/app/services/apis.service.ts b/src/app/services/apis.service.ts index 0ffcf69..31e6ab1 100644 --- a/src/app/services/apis.service.ts +++ b/src/app/services/apis.service.ts @@ -59,5 +59,19 @@ export class ApisService extends BaseService { ) } + saveExhibition(body): Observable { + let urlApi = `${this.restApi}exhibition.php?act=save` + return this.http.post(urlApi, JSON.stringify(body)).pipe( + catchError(this.handleError) + ) + } + + deleteExhibition(body): Observable { + let urlApi = `${this.restApi}exhibition.php?act=delete` + return this.http.post(urlApi, JSON.stringify(body)).pipe( + catchError(this.handleError) + ) + } + } From 87444cc39ef66b9dda1ef6b848abc5e61d5d8b3a Mon Sep 17 00:00:00 2001 From: Dslak Date: Sat, 5 Dec 2020 20:46:21 +0100 Subject: [PATCH 27/38] chrome fixes --- src/app/admin/admin.component.html | 22 +++++----- src/app/admin/admin.component.ts | 43 +++++++++++-------- src/app/app-layout/app-layout.component.ts | 1 + src/app/detail/detail.component.html | 2 +- src/app/detail/detail.component.ts | 3 ++ src/app/portfolio/portfolio.component.scss | 26 ++++++----- src/app/workshops/workshops.component.html | 1 - src/app/workshops/workshops.component.scss | 0 src/app/workshops/workshops.component.spec.ts | 25 ----------- src/app/workshops/workshops.component.ts | 15 ------- 10 files changed, 53 insertions(+), 85 deletions(-) delete mode 100644 src/app/workshops/workshops.component.html delete mode 100644 src/app/workshops/workshops.component.scss delete mode 100644 src/app/workshops/workshops.component.spec.ts delete mode 100644 src/app/workshops/workshops.component.ts diff --git a/src/app/admin/admin.component.html b/src/app/admin/admin.component.html index e5615a0..694eb5d 100644 --- a/src/app/admin/admin.component.html +++ b/src/app/admin/admin.component.html @@ -36,9 +36,9 @@ {{sectionTitle}}
- - @@ -46,9 +46,9 @@
- - @@ -58,7 +58,7 @@ *ngIf="activeEditor == 'works-add' || (activeEditor == 'works-modify' && activeModify) || activeEditor == 'exhibitions-add' || (activeEditor == 'exhibitions-modify' && activeModify)">
+ 'col-6': activeEditor == 'exhibitions-add' || activeEditor == 'exhibitions-modify'}"> Title
@@ -68,11 +68,11 @@
-
+
Date from
-
+
Date to
@@ -102,9 +102,9 @@
Exhibitions - - @@ -117,9 +117,9 @@
Works - - diff --git a/src/app/admin/admin.component.ts b/src/app/admin/admin.component.ts index 54e129b..1e1fc0b 100644 --- a/src/app/admin/admin.component.ts +++ b/src/app/admin/admin.component.ts @@ -61,37 +61,25 @@ export class AdminComponent implements OnInit { this.authCheck = response.status && response.status == 200 if(this.authCheck) { - this.apisService.getPortfolio('exhibitions').toPromise().then((response) => { - this.exhibitions = response.items - },(error) => { - console.error('getPortfolio ERROR', error) - }).catch((e) => { - console.error('getPortfolio CATCH', e) - }) - - this.apisService.getPortfolio('portfolio').toPromise().then((response) => { - this.works = response.items - },(error) => { - console.error('getPortfolio ERROR', error) - }).catch((e) => { - console.error('getPortfolio CATCH', e) - }) + this.loadData() } + },(error) => { this.authCheck = false - console.error('Auth ERROR', error) + console.error('Auth ERROR INIT', error) }).catch((e) => { this.authCheck = false - console.error('Auth CATCH', e) + console.error('Auth CATCH INIT', e) }) } login(): void { const body = { usr: this.userName, pwd: this.password } this.authService.login(body).toPromise().then((response) => { - this.authCheck = response.status == 200 + this.authCheck = response.status && response.status == 200 if(this.authCheck) { window.sessionStorage.setItem('authToken', response.authToken) + this.loadData() } },(error) => { console.error('Auth ERROR', error) @@ -100,6 +88,24 @@ export class AdminComponent implements OnInit { }) } + loadData(): void { + this.apisService.getPortfolio('exhibitions').toPromise().then((response) => { + this.exhibitions = response.items + },(error) => { + console.error('getPortfolio ERROR', error) + }).catch((e) => { + console.error('getPortfolio CATCH', e) + }) + + this.apisService.getPortfolio('portfolio').toPromise().then((response) => { + this.works = response.items + },(error) => { + console.error('getPortfolio ERROR', error) + }).catch((e) => { + console.error('getPortfolio CATCH', e) + }) + } + showEditor(section): void { switch(section) { case 'works-add': @@ -210,6 +216,7 @@ export class AdminComponent implements OnInit { } selectWork(id): void { + console.log('selectWork') this.activeModify = true this.modifyId = id diff --git a/src/app/app-layout/app-layout.component.ts b/src/app/app-layout/app-layout.component.ts index 956d7d3..26318ab 100644 --- a/src/app/app-layout/app-layout.component.ts +++ b/src/app/app-layout/app-layout.component.ts @@ -96,6 +96,7 @@ export class AppLayoutComponent implements OnInit { ngOnInit(): void { this.page = this.router.url + this.particlesEnabled = this.page != '/admin' } diff --git a/src/app/detail/detail.component.html b/src/app/detail/detail.component.html index 15c2be3..79c0db1 100644 --- a/src/app/detail/detail.component.html +++ b/src/app/detail/detail.component.html @@ -12,7 +12,7 @@ 'col-md-3': details.gallery.length >= 3}">
diff --git a/src/app/detail/detail.component.ts b/src/app/detail/detail.component.ts index 34e5412..1d191d6 100644 --- a/src/app/detail/detail.component.ts +++ b/src/app/detail/detail.component.ts @@ -4,6 +4,7 @@ import { DomSanitizer } from '@angular/platform-browser' import { Location } from '@angular/common' import { NgxImageGalleryComponent, GALLERY_IMAGE, GALLERY_CONF } from "ngx-image-gallery" import { ApisService } from '../services/apis.service' +import { environment } from '../../environments/environment' @Component({ selector: 'app-detail', @@ -12,6 +13,8 @@ import { ApisService } from '../services/apis.service' }) export class DetailComponent implements OnInit { + public basePath = `${environment.BASE_PATH}` + @ViewChild(NgxImageGalleryComponent) ngxImageGallery: NgxImageGalleryComponent public details: any = {} diff --git a/src/app/portfolio/portfolio.component.scss b/src/app/portfolio/portfolio.component.scss index d799a61..6a6f4ac 100644 --- a/src/app/portfolio/portfolio.component.scss +++ b/src/app/portfolio/portfolio.component.scss @@ -6,7 +6,7 @@ .box { position: relative; display: flex; - //background: $black-alpha; + background: $black-alpha; border-radius: 10px; overflow: hidden; margin: 10px 0; @@ -23,10 +23,10 @@ height: 100%; width: 100%; object-fit: cover; - transform: translate(-50%, -50%) scale(1.2); - opacity: .5; - filter: grayscale(100%) invert(100%); - transition: transform .4s, opacity .4s, filter .4s; + transform: translate(-50%, -50%); + opacity: .9; + filter: grayscale(100%) brightness(.4); + transition: opacity .4s, filter .4s; -webkit-backface-visibility: hidden; z-index: 0; } @@ -36,8 +36,8 @@ margin: auto; text-align: center; transform: translate(0%, 0%); - color: $black; - transition: color .4s; + color: $yellow; + //transition: color .4s; -webkit-backface-visibility: hidden; z-index: 1; @@ -99,21 +99,19 @@ background: $black; z-index: 50; - //animation-play-state: paused; - @each $angle in 0,1,2,3,4,5,6 { &.skew-#{$angle} { - transform: scale(1.4) rotate(2deg) skew(#{3 - $angle}deg, #{3 - $angle}deg); + //transform: scale(1.4) rotate(2deg) skew(#{3 - $angle}deg, #{3 - $angle}deg); + transform: scale(1.4) rotate(0deg) skew(0deg, 0deg); } } .image { - filter: grayscale(100%) invert(0%) brightness(.5); - opacity: .9; - transform: translate(-50%, -50%) scale(1.6); + filter: grayscale(0%) brightness(1); + opacity: .5; } .text { - color: $yellow; + //color: $yellow; } } } diff --git a/src/app/workshops/workshops.component.html b/src/app/workshops/workshops.component.html deleted file mode 100644 index d0e6442..0000000 --- a/src/app/workshops/workshops.component.html +++ /dev/null @@ -1 +0,0 @@ -

workshops works!

diff --git a/src/app/workshops/workshops.component.scss b/src/app/workshops/workshops.component.scss deleted file mode 100644 index e69de29..0000000 diff --git a/src/app/workshops/workshops.component.spec.ts b/src/app/workshops/workshops.component.spec.ts deleted file mode 100644 index 46e2e57..0000000 --- a/src/app/workshops/workshops.component.spec.ts +++ /dev/null @@ -1,25 +0,0 @@ -import { async, ComponentFixture, TestBed } from '@angular/core/testing'; - -import { WorkshopsComponent } from './workshops.component'; - -describe('WorkshopsComponent', () => { - let component: WorkshopsComponent; - let fixture: ComponentFixture; - - beforeEach(async(() => { - TestBed.configureTestingModule({ - declarations: [ WorkshopsComponent ] - }) - .compileComponents(); - })); - - beforeEach(() => { - fixture = TestBed.createComponent(WorkshopsComponent); - component = fixture.componentInstance; - fixture.detectChanges(); - }); - - it('should create', () => { - expect(component).toBeTruthy(); - }); -}); diff --git a/src/app/workshops/workshops.component.ts b/src/app/workshops/workshops.component.ts deleted file mode 100644 index af08b35..0000000 --- a/src/app/workshops/workshops.component.ts +++ /dev/null @@ -1,15 +0,0 @@ -import { Component, OnInit } from '@angular/core'; - -@Component({ - selector: 'app-workshops', - templateUrl: './workshops.component.html', - styleUrls: ['./workshops.component.scss'] -}) -export class WorkshopsComponent implements OnInit { - - constructor() { } - - ngOnInit(): void { - } - -} From 5b1e69a8e66c6c5edbbd5f1cddb9c10751c0b353 Mon Sep 17 00:00:00 2001 From: Dslak Date: Sun, 6 Dec 2020 12:07:59 +0100 Subject: [PATCH 28/38] fix galleri path and add embed video --- src/app/admin/admin.component.html | 1 + src/app/admin/admin.component.ts | 2 +- src/app/detail/detail.component.html | 17 +++++++---- src/app/detail/detail.component.scss | 7 +++-- src/app/detail/detail.component.ts | 33 ++++++++++++++++------ src/app/portfolio/portfolio.component.html | 2 +- src/app/portfolio/portfolio.component.ts | 3 ++ 7 files changed, 46 insertions(+), 19 deletions(-) diff --git a/src/app/admin/admin.component.html b/src/app/admin/admin.component.html index 694eb5d..7cc2eb5 100644 --- a/src/app/admin/admin.component.html +++ b/src/app/admin/admin.component.html @@ -137,6 +137,7 @@
diff --git a/src/app/admin/admin.component.ts b/src/app/admin/admin.component.ts index 1e1fc0b..f0b46f7 100644 --- a/src/app/admin/admin.component.ts +++ b/src/app/admin/admin.component.ts @@ -164,7 +164,7 @@ export class AdminComponent implements OnInit { videoAdd(): void { this.selectedVideos.push({ type: this.videoType, - url: this.videoURL + url: this.videoURL.replace(/\"/g, "\\\"") }) this.videoURL = '' } diff --git a/src/app/detail/detail.component.html b/src/app/detail/detail.component.html index 79c0db1..7d9e587 100644 --- a/src/app/detail/detail.component.html +++ b/src/app/detail/detail.component.html @@ -5,11 +5,11 @@

{{details.title}}

-