From fd231be0e2b9d51c708ad4e44f1f4d829d7fe656 Mon Sep 17 00:00:00 2001 From: SFilinsky Date: Tue, 22 Sep 2020 12:24:41 +0300 Subject: [PATCH 1/5] feat(demo): moved backend block up in landing (#5777) --- .../ngx-landing-sections-container.component.html | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/docs/app/pages/home/sections-container/ngx-landing-sections-container.component.html b/docs/app/pages/home/sections-container/ngx-landing-sections-container.component.html index 488e1269..4dc0dd6c 100644 --- a/docs/app/pages/home/sections-container/ngx-landing-sections-container.component.html +++ b/docs/app/pages/home/sections-container/ngx-landing-sections-container.component.html @@ -2,6 +2,8 @@ + + @@ -16,8 +18,6 @@ bundleUrl="https://store.akveo.com/products/net-ngx-admin-angular-starter-bundle?utm_campaign=akveo_store%20-%20specific%20bundle%20-%20ngx_admin%20landing&utm_source=ngx_admin&utm_medium=referral&utm_content=.net_free_dashboard_banner"> - -
From 8813e4735490aead6c0ceb85dd4c21f74f0d68e5 Mon Sep 17 00:00:00 2001 From: SFilinsky Date: Tue, 22 Sep 2020 13:13:42 +0300 Subject: [PATCH 2/5] feat(demo): changed links in landing (#5772) --- .../default-admin-main-info/default-info.component.html | 4 ++-- .../home/main-info-section/main-info-section.component.html | 2 +- .../our-projects-section/our-projects-section.component.html | 4 ++-- .../pages/home/social-section/social-section.component.html | 2 +- .../app/pages/home/theme-section/theme-section.component.html | 2 +- 5 files changed, 7 insertions(+), 7 deletions(-) diff --git a/docs/app/pages/home/main-info-section/default-admin-main-info/default-info.component.html b/docs/app/pages/home/main-info-section/default-admin-main-info/default-info.component.html index a69e1d6a..9364858d 100644 --- a/docs/app/pages/home/main-info-section/default-admin-main-info/default-info.component.html +++ b/docs/app/pages/home/main-info-section/default-admin-main-info/default-info.component.html @@ -2,8 +2,8 @@

ngx-admin

The most popular admin dashboard based on Angular 9+ and - Nebular with - Eva Design System support. + Nebular with + Eva Design System support. Free and Open Source for personal and commercial purposes.
diff --git a/docs/app/pages/home/main-info-section/main-info-section.component.html b/docs/app/pages/home/main-info-section/main-info-section.component.html index 426e0573..f615a8d5 100644 --- a/docs/app/pages/home/main-info-section/main-info-section.component.html +++ b/docs/app/pages/home/main-info-section/main-info-section.component.html @@ -35,7 +35,7 @@ Installation Docs Demo diff --git a/docs/app/pages/home/our-projects-section/our-projects-section.component.html b/docs/app/pages/home/our-projects-section/our-projects-section.component.html index 8e45596a..8012e061 100644 --- a/docs/app/pages/home/our-projects-section/our-projects-section.component.html +++ b/docs/app/pages/home/our-projects-section/our-projects-section.component.html @@ -15,7 +15,7 @@

Nebular is a great toolkit if you build Rich UI web applications based on Angular. Complete with a set of native Angular components, themeable components, authentication and security layers that are easily configurable to your API. Nebular offers a world of possibilities
- Learn more + Learn more
  • @@ -30,7 +30,7 @@
    Eva Icons is a pack of more than 480 beautifully crafted Open Source icons. Download for desktop and use them in your creations for Web, iOS, and Android. The icons are available in several formats: PNG, SVG, font, Sketch
    - Learn more + Learn more
    • diff --git a/docs/app/pages/home/social-section/social-section.component.html b/docs/app/pages/home/social-section/social-section.component.html index 29565cb4..e3d961e8 100644 --- a/docs/app/pages/home/social-section/social-section.component.html +++ b/docs/app/pages/home/social-section/social-section.component.html @@ -35,7 +35,7 @@
    diff --git a/docs/app/pages/home/theme-section/theme-section.component.html b/docs/app/pages/home/theme-section/theme-section.component.html index ceafb6d8..3f654c14 100644 --- a/docs/app/pages/home/theme-section/theme-section.component.html +++ b/docs/app/pages/home/theme-section/theme-section.component.html @@ -81,5 +81,5 @@
    View demo From 067f179ed6cda1bcaa65aa43b2595620616cfaad Mon Sep 17 00:00:00 2001 From: SFilinsky Date: Wed, 23 Sep 2020 18:44:04 +0300 Subject: [PATCH 3/5] feat(demo): added backend integration descriptions (#5768) --- package-lock.json | 5 ++ package.json | 5 +- src/app/app.module.ts | 2 + .../backend-integration-routing.module.ts | 56 ++++++++++++++++++ .../backend-integration.component.scss | 58 +++++++++++++++++++ .../backend-integration.component.ts | 16 +++++ .../backend-integration.module.ts | 43 ++++++++++++++ ...-core-integration-description.component.ts | 31 ++++++++++ ...t-net-integration-description.component.ts | 29 ++++++++++ ...merce-integration-description.component.ts | 22 +++++++ .../iot-integration-description.component.ts | 22 +++++++ .../java-integration-description.component.ts | 31 ++++++++++ ...de-js-integration-description.component.ts | 31 ++++++++++ .../php-integration-description.component.ts | 29 ++++++++++ ...ython-integration-description.component.ts | 28 +++++++++ ...backend-integration-diagram.component.html | 2 + ...backend-integration-diagram.component.scss | 29 ++++++++++ .../backend-integration-diagram.component.ts | 8 +++ .../integration-description.component.scss | 30 ++++++++++ .../integration-description.component.ts | 30 ++++++++++ src/app/pages/pages-menu.ts | 16 ++--- src/app/pages/pages-routing.module.ts | 5 ++ .../images/backend-integration-diagram.svg | 1 + 23 files changed, 519 insertions(+), 10 deletions(-) create mode 100644 src/app/pages/backend-integration/backend-integration-routing.module.ts create mode 100644 src/app/pages/backend-integration/backend-integration.component.scss create mode 100644 src/app/pages/backend-integration/backend-integration.component.ts create mode 100644 src/app/pages/backend-integration/backend-integration.module.ts create mode 100644 src/app/pages/backend-integration/descriptions/dot-net-core-integration-description.component.ts create mode 100644 src/app/pages/backend-integration/descriptions/dot-net-integration-description.component.ts create mode 100644 src/app/pages/backend-integration/descriptions/ecommerce-integration-description.component.ts create mode 100644 src/app/pages/backend-integration/descriptions/iot-integration-description.component.ts create mode 100644 src/app/pages/backend-integration/descriptions/java-integration-description.component.ts create mode 100644 src/app/pages/backend-integration/descriptions/node-js-integration-description.component.ts create mode 100644 src/app/pages/backend-integration/descriptions/php-integration-description.component.ts create mode 100644 src/app/pages/backend-integration/descriptions/python-integration-description.component.ts create mode 100644 src/app/pages/backend-integration/diagram/backend-integration-diagram.component.html create mode 100644 src/app/pages/backend-integration/diagram/backend-integration-diagram.component.scss create mode 100644 src/app/pages/backend-integration/diagram/backend-integration-diagram.component.ts create mode 100644 src/app/pages/backend-integration/integration-description/integration-description.component.scss create mode 100644 src/app/pages/backend-integration/integration-description/integration-description.component.ts create mode 100644 src/assets/images/backend-integration-diagram.svg diff --git a/package-lock.json b/package-lock.json index 717aabf5..0c896696 100644 --- a/package-lock.json +++ b/package-lock.json @@ -16530,6 +16530,11 @@ "integrity": "sha1-yobR/ogoFpsBICCOPchCS524NCw=", "dev": true }, + "ng-inline-svg": { + "version": "11.0.0", + "resolved": "https://registry.npmjs.org/ng-inline-svg/-/ng-inline-svg-11.0.0.tgz", + "integrity": "sha512-D4dXt379cveaYJobu7JnYixZzw/+AqRkMGDqOrNhGDEiBgDaxb8DZ57mSg8V9ekTl3fK+H98p9SevhLSakzRkA==" + }, "ng-lazyload-image": { "version": "7.1.0", "resolved": "https://registry.npmjs.org/ng-lazyload-image/-/ng-lazyload-image-7.1.0.tgz", diff --git a/package.json b/package.json index 436a8b78..bc2dfc22 100644 --- a/package.json +++ b/package.json @@ -61,8 +61,8 @@ "chart.js": "2.7.1", "ckeditor": "4.7.3", "classlist.js": "1.1.20150312", - "core-js": "2.5.1", "colors.js": "1.2.4", + "core-js": "2.5.1", "echarts": "^4.0.2", "eva-icons": "^1.1.3", "gulp-bump": "2.7.0", @@ -72,12 +72,13 @@ "leaflet": "1.2.0", "marked": "^0.5.2", "nebular-icons": "1.1.0", + "ng-inline-svg": "^11.0.0", "ng-lazyload-image": "^7.1.0", "ng2-ckeditor": "^1.2.9", "ng2-smart-table": "^1.6.0", "ngx-echarts": "^4.2.2", - "node-sass": "^4.12.0", "ngx-swiper-wrapper": "^9.0.1", + "node-sass": "^4.12.0", "normalize.css": "6.0.0", "pace-js": "1.0.2", "roboto-fontface": "0.8.0", diff --git a/src/app/app.module.ts b/src/app/app.module.ts index d55f48ee..dabd611e 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -20,6 +20,7 @@ import { NbToastrModule, NbWindowModule, } from '@nebular/theme'; +import {InlineSVGModule} from 'ng-inline-svg'; @NgModule({ declarations: [AppComponent], @@ -39,6 +40,7 @@ import { }), CoreModule.forRoot(), ThemeModule.forRoot(), + InlineSVGModule.forRoot(), ], bootstrap: [AppComponent], }) diff --git a/src/app/pages/backend-integration/backend-integration-routing.module.ts b/src/app/pages/backend-integration/backend-integration-routing.module.ts new file mode 100644 index 00000000..6e97fe77 --- /dev/null +++ b/src/app/pages/backend-integration/backend-integration-routing.module.ts @@ -0,0 +1,56 @@ +import {RouterModule, Routes} from '@angular/router'; +import {NgModule} from '@angular/core'; +import {BackendIntegrationComponent} from './backend-integration.component'; +import {PhpIntegrationDescriptionComponent} from './descriptions/php-integration-description.component'; +import {DotNetIntegrationDescriptionComponent} from './descriptions/dot-net-integration-description.component'; +import {DotNetCoreIntegrationDescriptionComponent} from './descriptions/dot-net-core-integration-description.component'; +import {NodeJsIntegrationDescriptionComponent} from './descriptions/node-js-integration-description.component'; +import {JavaIntegrationDescriptionComponent} from './descriptions/java-integration-description.component'; +import {PythonIntegrationDescriptionComponent} from './descriptions/python-integration-description.component'; +import {EcommerceIntegrationDescriptionComponent} from './descriptions/ecommerce-integration-description.component'; +import {IotIntegrationDescriptionComponent} from './descriptions/iot-integration-description.component'; + +const routes: Routes = [{ + path: '', + component: BackendIntegrationComponent, + children: [ + { + path: 'php', + component: PhpIntegrationDescriptionComponent, + }, + { + path: 'dot-net', + component: DotNetIntegrationDescriptionComponent, + }, + { + path: 'dot-net-core', + component: DotNetCoreIntegrationDescriptionComponent, + }, + { + path: 'node-js', + component: NodeJsIntegrationDescriptionComponent, + }, + { + path: 'java', + component: JavaIntegrationDescriptionComponent, + }, + { + path: 'python', + component: PythonIntegrationDescriptionComponent, + }, + { + path: 'ecommerce', + component: EcommerceIntegrationDescriptionComponent, + }, + { + path: 'iot', + component: IotIntegrationDescriptionComponent, + }, + ], +}]; + +@NgModule({ + imports: [RouterModule.forChild(routes)], + exports: [RouterModule], +}) +export class BackendIntegrationRoutingModule { } diff --git a/src/app/pages/backend-integration/backend-integration.component.scss b/src/app/pages/backend-integration/backend-integration.component.scss new file mode 100644 index 00000000..697a35b3 --- /dev/null +++ b/src/app/pages/backend-integration/backend-integration.component.scss @@ -0,0 +1,58 @@ +@import '../../@theme/styles/themes'; +@import '~@nebular/theme/styles/global/breakpoints'; + +:host { + display: flex !important; + flex-direction: row; + justify-content: stretch; + align-items: stretch; + height: 100%; +} + +.description-container, .diagram-container { + display: flex; +} + +.diagram-container { + flex: 2 1 auto; + align-items: center; + min-width: 30rem; + width: 70%; +} + +.description-container { + flex: 1 2 auto; + max-width: 45rem; + align-items: stretch; + height: 100%; + + ::ng-deep :last-child { + width: 100%; + } +} + +@include media-breakpoint-down(lg) { + :host { + flex-direction: column; + justify-content: flex-start; + align-items: center; + + .diagram-container, .description-container { + width: 100%; + max-width: none; + } + + .description-container { + padding-bottom: 1.5rem; + + ::ng-deep ngx-integration-description .subheader { + margin-bottom: 1.5rem; + } + } + + .diagram-container { + min-width: 0; + } + } +} + diff --git a/src/app/pages/backend-integration/backend-integration.component.ts b/src/app/pages/backend-integration/backend-integration.component.ts new file mode 100644 index 00000000..34f282c4 --- /dev/null +++ b/src/app/pages/backend-integration/backend-integration.component.ts @@ -0,0 +1,16 @@ +import {Component} from '@angular/core'; + +@Component({ + selector: 'ngx-backend-integration', + template: ` +
    + +
    +
    + +
    + `, + styleUrls: ['./backend-integration.component.scss'], +}) +export class BackendIntegrationComponent { +} diff --git a/src/app/pages/backend-integration/backend-integration.module.ts b/src/app/pages/backend-integration/backend-integration.module.ts new file mode 100644 index 00000000..db7c9094 --- /dev/null +++ b/src/app/pages/backend-integration/backend-integration.module.ts @@ -0,0 +1,43 @@ +import {ThemeModule} from '../../@theme/theme.module'; +import {NgModule} from '@angular/core'; +import {BackendIntegrationDiagramComponent} from './diagram/backend-integration-diagram.component'; +import {BackendIntegrationComponent} from './backend-integration.component'; +import {RouterModule} from '@angular/router'; +import {NbButtonModule, NbCardModule, NbIconModule} from '@nebular/theme'; +import {BackendIntegrationRoutingModule} from './backend-integration-routing.module'; +import {IntegrationDescriptionComponent} from './integration-description/integration-description.component'; +import {PhpIntegrationDescriptionComponent} from './descriptions/php-integration-description.component'; +import {DotNetIntegrationDescriptionComponent} from './descriptions/dot-net-integration-description.component'; +import {DotNetCoreIntegrationDescriptionComponent} from './descriptions/dot-net-core-integration-description.component'; +import {NodeJsIntegrationDescriptionComponent} from './descriptions/node-js-integration-description.component'; +import { JavaIntegrationDescriptionComponent } from './descriptions/java-integration-description.component'; +import { PythonIntegrationDescriptionComponent } from './descriptions/python-integration-description.component'; +import { EcommerceIntegrationDescriptionComponent } from './descriptions/ecommerce-integration-description.component'; +import { IotIntegrationDescriptionComponent } from './descriptions/iot-integration-description.component'; +import {InlineSVGModule} from 'ng-inline-svg'; + +@NgModule({ + imports: [ + ThemeModule, + RouterModule, + NbCardModule, + BackendIntegrationRoutingModule, + NbIconModule, + NbButtonModule, + InlineSVGModule, + ], + declarations: [ + BackendIntegrationComponent, + BackendIntegrationDiagramComponent, + PhpIntegrationDescriptionComponent, + DotNetIntegrationDescriptionComponent, + DotNetCoreIntegrationDescriptionComponent, + NodeJsIntegrationDescriptionComponent, + JavaIntegrationDescriptionComponent, + PythonIntegrationDescriptionComponent, + EcommerceIntegrationDescriptionComponent, + IotIntegrationDescriptionComponent, + IntegrationDescriptionComponent, + ], +}) +export class BackendIntegrationModule { } diff --git a/src/app/pages/backend-integration/descriptions/dot-net-core-integration-description.component.ts b/src/app/pages/backend-integration/descriptions/dot-net-core-integration-description.component.ts new file mode 100644 index 00000000..db5a3cc5 --- /dev/null +++ b/src/app/pages/backend-integration/descriptions/dot-net-core-integration-description.component.ts @@ -0,0 +1,31 @@ +import { Component } from '@angular/core'; + +@Component({ + selector: 'ngx-dot-net-core-integration-description', + template: ` + + `, +}) +export class DotNetCoreIntegrationDescriptionComponent { + + buttonText = 'Get Backend From 49$'; + url = 'https://store.akveo.com/collections/net-core-bundles?utm_campaign=akveo_store%20-%20all%20bundles%20-%20ngx_admin_demo&utm_source=ngx_admin&utm_medium=referral&utm_content=sidebar_link_dotnetcore'; + + features: string[] = [ + 'Backend layered architecture, authentication, solution structure', + 'Ngx-admin template with 100+ UI components', + 'Authentication using JWT tokens is implemented and integrated into both client and server side', + 'Basic role management and ACL is in place', + 'Data entities classes, independent of any ORM', + 'Dependency injection takes care of services and repositories instantiation', + 'Swagger included for automatic API testing and documentation', + 'Serilog is used for logging', + 'OWIN startup is configured', + 'Documentation is included', + '3 months free updates', + ]; + +} diff --git a/src/app/pages/backend-integration/descriptions/dot-net-integration-description.component.ts b/src/app/pages/backend-integration/descriptions/dot-net-integration-description.component.ts new file mode 100644 index 00000000..2063822e --- /dev/null +++ b/src/app/pages/backend-integration/descriptions/dot-net-integration-description.component.ts @@ -0,0 +1,29 @@ +import { Component } from '@angular/core'; + +@Component({ + selector: 'ngx-dot-net-integration-description', + template: ` + + `, +}) +export class DotNetIntegrationDescriptionComponent { + + buttonText = 'Get Backend From 49$'; + url = 'https://store.akveo.com/collections/net-bundles?utm_campaign=akveo_store%20-%20all%20bundles%20-%20ngx_admin_demo&utm_source=ngx_admin&utm_medium=referral&utm_content=sidebar_link_dotnet'; + + features: string[] = [ + 'Backend layered architecture, authentication, solution structure', + 'Ngx-admin angular UI with 100+ UI components to use', + 'Authentication using JWT tokens is implemented and integrated with both client and server side', + 'Basic role management and ACL is in place', + 'Swagger included for automatic API testing and documentation', + 'Serilog is used for logging', + 'OWIN startup is configured', + 'Documentation is included', + '3 months free updates', + ]; + +} diff --git a/src/app/pages/backend-integration/descriptions/ecommerce-integration-description.component.ts b/src/app/pages/backend-integration/descriptions/ecommerce-integration-description.component.ts new file mode 100644 index 00000000..0b1fbaac --- /dev/null +++ b/src/app/pages/backend-integration/descriptions/ecommerce-integration-description.component.ts @@ -0,0 +1,22 @@ +import { Component } from '@angular/core'; + +@Component({ + selector: 'ngx-e-commerce-integration-description', + template: ` + + `, +}) +export class EcommerceIntegrationDescriptionComponent { + + buttonText = 'Get Backend From 49$'; + url = 'https://store.akveo.com/collections/e-commerce-bundles?utm_campaign=akveo_store%20-%20all%20bundles%20-%20ngx_admin_demo&utm_source=ngx_admin&utm_medium=referral&utm_content=sidebar_link_e-commerce'; + + features: string[] = [ + 'E-commerce dashboard components integrated with backend', + 'Sample order table and order details page integrated with backend', + ]; + +} diff --git a/src/app/pages/backend-integration/descriptions/iot-integration-description.component.ts b/src/app/pages/backend-integration/descriptions/iot-integration-description.component.ts new file mode 100644 index 00000000..02f502eb --- /dev/null +++ b/src/app/pages/backend-integration/descriptions/iot-integration-description.component.ts @@ -0,0 +1,22 @@ +import { Component } from '@angular/core'; + +@Component({ + selector: 'ngx-iot-integration-description', + template: ` + + `, +}) +export class IotIntegrationDescriptionComponent { + + buttonText = 'Get Backend From 49$'; + url = 'https://store.akveo.com/collections/iot-bundles?utm_campaign=akveo_store%20-%20all%20bundles%20-%20ngx_admin_demo&utm_source=ngx_admin&utm_medium=referral&utm_content=sidebar_link_iot'; + + features: string[] = [ + 'IOT dashboard components integrated with backend', + 'Sample devices table and device details page integrated with backend', + ]; + +} diff --git a/src/app/pages/backend-integration/descriptions/java-integration-description.component.ts b/src/app/pages/backend-integration/descriptions/java-integration-description.component.ts new file mode 100644 index 00000000..00f86939 --- /dev/null +++ b/src/app/pages/backend-integration/descriptions/java-integration-description.component.ts @@ -0,0 +1,31 @@ +import { Component } from '@angular/core'; + +@Component({ + selector: 'ngx-java-integration-description', + template: ` + + `, +}) +export class JavaIntegrationDescriptionComponent { + + buttonText = 'Get Backend From 49$'; + url = 'https://store.akveo.com/collections/java-bundles?utm_campaign=akveo_store%20-%20all%20bundles%20-%20ngx_admin_demo&utm_source=ngx_admin&utm_medium=referral&utm_content=sidebar_link_java'; + + features: string[] = [ + 'Ngx-admin template with 100+ UI components', + 'Spring Boot as the main framework for backend', + 'Maven as building tool', + 'Can be used with a range of SQL databases. In-Memory database H2 by default', + 'Authentication using Json Web Tokens is implemented and integrated with both client and server side', + 'Refresh Token functionality is available out of the box', + `TSLint as part of Angular project settings, it simply wouldn't let you push typescript code with errors`, + 'Backend has Checkstyle setup and findbugs plugin for static code analysis', + 'Swagger for API documentation purpose', + 'Documentation is included', + '3 months free updates', + ]; + +} diff --git a/src/app/pages/backend-integration/descriptions/node-js-integration-description.component.ts b/src/app/pages/backend-integration/descriptions/node-js-integration-description.component.ts new file mode 100644 index 00000000..d4622973 --- /dev/null +++ b/src/app/pages/backend-integration/descriptions/node-js-integration-description.component.ts @@ -0,0 +1,31 @@ +import { Component } from '@angular/core'; + +@Component({ + selector: 'ngx-node-js-integration-description', + template: ` + + `, +}) +export class NodeJsIntegrationDescriptionComponent { + + buttonText = 'Get Backend From 49$'; + url = 'https://store.akveo.com/collections/nodejs-bundles?utm_campaign=akveo_store%20-%20all%20bundles%20-%20ngx_admin_demo&utm_source=ngx_admin&utm_medium=referral&utm_content=sidebar_link_nodejs'; + + features: string[] = [ + 'MongoDB for user data storage', + 'Express server', + 'Authentication using Passport and JWT tokens is implemented and integrated with both client and server side', + 'Eslint for code quality on the backend side', + 'Winston is used for logging', + 'Node-config is used for API settings', + 'Nodemon is used for better development experience', + 'Documentation is included', + 'Basic role management and ACL is in place', + 'Swagger included for automatic API testing and documentation', + '3 months free updates', + ]; + +} diff --git a/src/app/pages/backend-integration/descriptions/php-integration-description.component.ts b/src/app/pages/backend-integration/descriptions/php-integration-description.component.ts new file mode 100644 index 00000000..6e8d8ab9 --- /dev/null +++ b/src/app/pages/backend-integration/descriptions/php-integration-description.component.ts @@ -0,0 +1,29 @@ +import { Component } from '@angular/core'; + +@Component({ + selector: 'ngx-php-integration-description', + template: ` + + `, +}) +export class PhpIntegrationDescriptionComponent { + + buttonText = 'Get Backend From 49$'; + url = 'https://store.akveo.com/products/material-php-starter-bundle?utm_campaign=akveo_store%20-%20all%20bundles%20-%20ngx_admin_demo&utm_source=ngx_admin%20&utm_medium=referral%20&utm_content=sidebar_link_php'; + + features: string[] = [ + 'Ngx-admin template with 100+ UI Nebular and Eva design components', + 'Authentication using JWT tokens is implemented and integrated into both client and server-side', + 'Basic role management and ACL is in place, AUTH, reset the password', + 'Backend solution layered architecture and projects segregation', + 'Swagger included for automatic API testing and documentation', + 'Documentation is included', + 'Docker and docker-compose configuration included', + 'MySQL database', + '3 months free updates', + ]; + +} diff --git a/src/app/pages/backend-integration/descriptions/python-integration-description.component.ts b/src/app/pages/backend-integration/descriptions/python-integration-description.component.ts new file mode 100644 index 00000000..eee9b390 --- /dev/null +++ b/src/app/pages/backend-integration/descriptions/python-integration-description.component.ts @@ -0,0 +1,28 @@ +import { Component } from '@angular/core'; + +@Component({ + selector: 'ngx-python-integration-description', + template: ` + + `, +}) +export class PythonIntegrationDescriptionComponent { + + buttonText = 'Get Backend From 49$'; + url = 'https://store.akveo.com/collections/python-bundles?utm_campaign=akveo_store%20-%20all%20bundles%20-%20ngx_admin_demo&utm_source=ngx_admin&utm_medium=referral&utm_content=sidebar_link_python'; + + features: string[] = [ + 'ngx-admin template with 100+ UI components', + 'Python backend with Flask micro-framework', + 'Any SQL database can be used (PostgreSQL, MySQL, Oracle, Microsoft SQL Server, and SQLite)', + 'SQLAlchemy as database toolkit for CRUD operations', + 'Authentication using JWT tokens is implemented and integrated with both client and server side', + 'Compression is set up for better performance', + 'Documentation is included', + '3 months free updates', + ]; + +} diff --git a/src/app/pages/backend-integration/diagram/backend-integration-diagram.component.html b/src/app/pages/backend-integration/diagram/backend-integration-diagram.component.html new file mode 100644 index 00000000..21b8dd5b --- /dev/null +++ b/src/app/pages/backend-integration/diagram/backend-integration-diagram.component.html @@ -0,0 +1,2 @@ +
    +
    diff --git a/src/app/pages/backend-integration/diagram/backend-integration-diagram.component.scss b/src/app/pages/backend-integration/diagram/backend-integration-diagram.component.scss new file mode 100644 index 00000000..a17d8d7e --- /dev/null +++ b/src/app/pages/backend-integration/diagram/backend-integration-diagram.component.scss @@ -0,0 +1,29 @@ +@import '../../../@theme/styles/themes'; + +@include nb-install-component() { + width: 100%; + + ::ng-deep svg { + path.card-header, path.subcard-header, path.diagram-header { + fill: nb-theme(text-basic-color); + } + + path.card-subheader, path.subcard-subheader, path.diagram-subheader { + fill: nb-theme(text-hint-color); + } + + rect.card-background { + fill: nb-theme(background-basic-color-2); + stroke: nb-theme(border-basic-color-5); + } + + rect.subcard-background { + fill: nb-theme(background-basic-color-1); + } + + path.subcard-border { + fill: nb-theme(background-basic-color-2); + stroke: nb-theme(border-basic-color-5); + } + } +} diff --git a/src/app/pages/backend-integration/diagram/backend-integration-diagram.component.ts b/src/app/pages/backend-integration/diagram/backend-integration-diagram.component.ts new file mode 100644 index 00000000..d7e181f7 --- /dev/null +++ b/src/app/pages/backend-integration/diagram/backend-integration-diagram.component.ts @@ -0,0 +1,8 @@ +import { Component } from '@angular/core'; + +@Component({ + selector: 'ngx-backend-integration-diagram', + templateUrl: './backend-integration-diagram.component.html', + styleUrls: ['./backend-integration-diagram.component.scss'], +}) +export class BackendIntegrationDiagramComponent {} diff --git a/src/app/pages/backend-integration/integration-description/integration-description.component.scss b/src/app/pages/backend-integration/integration-description/integration-description.component.scss new file mode 100644 index 00000000..f6b2733e --- /dev/null +++ b/src/app/pages/backend-integration/integration-description/integration-description.component.scss @@ -0,0 +1,30 @@ +@import '../../../@theme/styles/themes'; + +@include nb-install-component() { + background-color: nb-theme(background-basic-color-1); + display: flex; + flex-direction: column; + justify-content: center; + padding: 1rem 2rem; + width: 100%; + height: 100%; + + .h6 { + margin-bottom: 1rem; + } + + .subtitle { + margin-bottom: 3rem; + } + + .features-list { + list-style-type: '- '; + padding-left: 0; + } + + a { + width: auto; + align-self: flex-start; + margin-top: 2rem; + } +} diff --git a/src/app/pages/backend-integration/integration-description/integration-description.component.ts b/src/app/pages/backend-integration/integration-description/integration-description.component.ts new file mode 100644 index 00000000..ccfadccf --- /dev/null +++ b/src/app/pages/backend-integration/integration-description/integration-description.component.ts @@ -0,0 +1,30 @@ +import {Component, Input} from '@angular/core'; + +@Component({ + selector: 'ngx-integration-description', + template: ` +
    For why do you need a backend admin dashboard?
    +
    To save up to 300 hours on development. To use backend as ready to use examples.
    +
    Features
    + + {{buttonText}} + `, + styleUrls: ['./integration-description.component.scss'], +}) +export class IntegrationDescriptionComponent { + + @Input() features: string[]; + @Input() url: string; + @Input() buttonText: string; + +} diff --git a/src/app/pages/pages-menu.ts b/src/app/pages/pages-menu.ts index 370a2953..02b5635c 100644 --- a/src/app/pages/pages-menu.ts +++ b/src/app/pages/pages-menu.ts @@ -18,35 +18,35 @@ export const MENU_ITEMS: NbMenuItem[] = [ children: [ { title: 'PHP', - url: 'https://store.akveo.com/products/material-php-starter-bundle?utm_campaign=akveo_store%20-%20all%20bundles%20-%20ngx_admin_demo&utm_source=ngx_admin%20&utm_medium=referral%20&utm_content=sidebar_link_php', + link: '/pages/backend-integration/php', }, { title: '.NET', - url: 'https://store.akveo.com/collections/net-bundles?utm_campaign=akveo_store%20-%20all%20bundles%20-%20ngx_admin_demo&utm_source=ngx_admin&utm_medium=referral&utm_content=sidebar_link_dotnet', + link: '/pages/backend-integration/dot-net', }, { title: '.NET Core', - url: 'https://store.akveo.com/collections/net-core-bundles?utm_campaign=akveo_store%20-%20all%20bundles%20-%20ngx_admin_demo&utm_source=ngx_admin&utm_medium=referral&utm_content=sidebar_link_dotnetcore', + link: '/pages/backend-integration/dot-net-core', }, { title: 'Node JS', - url: 'https://store.akveo.com/collections/nodejs-bundles?utm_campaign=akveo_store%20-%20all%20bundles%20-%20ngx_admin_demo&utm_source=ngx_admin&utm_medium=referral&utm_content=sidebar_link_nodejs', + link: '/pages/backend-integration/node-js', }, { title: 'Java', - url: 'https://store.akveo.com/collections/java-bundles?utm_campaign=akveo_store%20-%20all%20bundles%20-%20ngx_admin_demo&utm_source=ngx_admin&utm_medium=referral&utm_content=sidebar_link_java', + link: '/pages/backend-integration/java', }, { title: 'Python', - url: 'https://store.akveo.com/collections/python-bundles?utm_campaign=akveo_store%20-%20all%20bundles%20-%20ngx_admin_demo&utm_source=ngx_admin&utm_medium=referral&utm_content=sidebar_link_python', + link: '/pages/backend-integration/python', }, { title: 'E-commerce', - url: 'https://store.akveo.com/collections/e-commerce-bundles?utm_campaign=akveo_store%20-%20all%20bundles%20-%20ngx_admin_demo&utm_source=ngx_admin&utm_medium=referral&utm_content=sidebar_link_e-commerce', + link: '/pages/backend-integration/ecommerce', }, { title: 'IoT', - url: 'https://store.akveo.com/collections/iot-bundles?utm_campaign=akveo_store%20-%20all%20bundles%20-%20ngx_admin_demo&utm_source=ngx_admin&utm_medium=referral&utm_content=sidebar_link_iot', + link: '/pages/backend-integration/iot', }, ], }, diff --git a/src/app/pages/pages-routing.module.ts b/src/app/pages/pages-routing.module.ts index 376cc4fa..990c630b 100644 --- a/src/app/pages/pages-routing.module.ts +++ b/src/app/pages/pages-routing.module.ts @@ -18,6 +18,11 @@ const routes: Routes = [{ path: 'iot-dashboard', component: DashboardComponent, }, + { + path: 'backend-integration', + loadChildren: () => import('./backend-integration/backend-integration.module') + .then(m => m.BackendIntegrationModule), + }, { path: 'layout', loadChildren: () => import('./layout/layout.module') diff --git a/src/assets/images/backend-integration-diagram.svg b/src/assets/images/backend-integration-diagram.svg new file mode 100644 index 00000000..0114e0cd --- /dev/null +++ b/src/assets/images/backend-integration-diagram.svg @@ -0,0 +1 @@ + From 39600d9ba54a5f43aa30c347986a209b73b08efe Mon Sep 17 00:00:00 2001 From: SFilinsky Date: Fri, 9 Oct 2020 14:44:18 +0300 Subject: [PATCH 4/5] feat(landing): add admin premium modal (#5782) --- docs/app/@theme/styles/_hs-forms.scss | 105 ++++++++++++++++++ docs/app/@theme/styles/styles.scss | 3 + .../main-info-section.component.html | 7 +- .../main-info-section.component.scss | 17 ++- .../main-info-section.component.ts | 16 ++- .../download-admin.component.html | 3 - .../download-admin.component.scss | 59 ---------- .../download-admin.component.ts | 24 ---- .../download-form.component.html | 9 +- .../download-form.component.scss | 88 +++------------ .../download-form/download-form.component.ts | 4 +- .../premium-form/premium-form.component.html | 11 ++ .../premium-form/premium-form.component.scss | 31 ++++++ .../premium-form/premium-form.component.ts | 36 ++++++ docs/app/shared/landing-shared.module.ts | 10 +- .../backend-integration.component.scss | 2 +- 16 files changed, 246 insertions(+), 179 deletions(-) create mode 100644 docs/app/@theme/styles/_hs-forms.scss delete mode 100644 docs/app/shared/components/download-admin/download-admin.component.html delete mode 100644 docs/app/shared/components/download-admin/download-admin.component.scss delete mode 100644 docs/app/shared/components/download-admin/download-admin.component.ts create mode 100644 docs/app/shared/components/premium-form/premium-form.component.html create mode 100644 docs/app/shared/components/premium-form/premium-form.component.scss create mode 100644 docs/app/shared/components/premium-form/premium-form.component.ts diff --git a/docs/app/@theme/styles/_hs-forms.scss b/docs/app/@theme/styles/_hs-forms.scss new file mode 100644 index 00000000..b02931e4 --- /dev/null +++ b/docs/app/@theme/styles/_hs-forms.scss @@ -0,0 +1,105 @@ +/** + * @license + * Copyright Akveo. All Rights Reserved. + * Licensed under the MIT License. See License.txt in the project root for license information. + */ + +@mixin hs-custom-form() { + .hs-custom-form { + .modal-header { + display: none; + } + + .modal-body { + padding-bottom: 0; + } + + .actions { + display: flex; + justify-content: flex-end; + } + + input.hs-input { + width: 100%; + color: nb-theme(input-basic-text-color); + font-size: nb-theme(input-medium-text-font-size); + font-weight: nb-theme(input-medium-text-font-weight); + line-height: nb-theme(input-medium-text-line-height); + padding: nb-theme(input-medium-padding) !important; + border: nb-theme(input-border-width) nb-theme(input-border-style) nb-theme(input-basic-border-color); + border-radius: nb-theme(input-rectangle-border-radius); + background-color: nb-theme(input-basic-background-color); + + &.hover { + background-color: nb-theme(input-basic-hover-background-color); + border-color: nb-theme(input-basic-hover-border-color); + } + + &.invalid { + box-shadow: 0 0 1.25rem 0 rgba(210, 45, 45, 0.6); + } + + &::placeholder { + color: nb-theme(input-basic-placeholder-text-color); + font-size: nb-theme(input-medium-placeholder-text-font-size); + font-weight: nb-theme(input-medium-placeholder-text-font-weight); + line-height: nb-theme(input-medium-placeholder-text-line-height); + } + + &:focus { + outline: none; + background-color: nb-theme(input-basic-focus-background-color); + border-color: nb-theme(input-basic-focus-border-color); + } + } + + .hs-richtext .modal-body { + padding: 0; + margin-bottom: 1rem; + + p { + margin-bottom: 0; + text-align: left !important; + height: auto; + } + } + + .hs-recaptcha { + margin-top: 1rem; + } + + .hs-error-msgs { + list-style-type: none; + padding: 0; + } + + .hs-form-required, .hs-error-msg { + margin-top: 0.5rem; + color: nb-theme(text-danger-color); + } + + .hs_error_rollup { + display: none; + } + + .hs-submit-btn { + font-family: nb-theme(font-main); + border-radius: 3px; + border: none; + background-color: nb-theme(color-active-fg); + color: #ffffff; + padding: 1rem 2rem; + box-shadow: nb-theme(shadow-btn); + cursor: pointer; + text-transform: uppercase; + + &:hover { + box-shadow: nb-theme(shadow-hover-green-btn); + } + + &:active { + box-shadow: nb-theme(shadow-active-green-btn); + } + } + } +} diff --git a/docs/app/@theme/styles/styles.scss b/docs/app/@theme/styles/styles.scss index f81dc20f..35f5b850 100644 --- a/docs/app/@theme/styles/styles.scss +++ b/docs/app/@theme/styles/styles.scss @@ -10,7 +10,10 @@ @import '~@nebular/theme/styles/globals'; @import '~@nebular/bootstrap/styles/globals'; +@import 'hs-forms'; + @include nb-install() { @include nb-theme-global(); @include nb-bootstrap-global(); + @include hs-custom-form(); }; diff --git a/docs/app/pages/home/main-info-section/main-info-section.component.html b/docs/app/pages/home/main-info-section/main-info-section.component.html index f615a8d5..a5b7a206 100644 --- a/docs/app/pages/home/main-info-section/main-info-section.component.html +++ b/docs/app/pages/home/main-info-section/main-info-section.component.html @@ -41,6 +41,11 @@ - + + diff --git a/docs/app/pages/home/main-info-section/main-info-section.component.scss b/docs/app/pages/home/main-info-section/main-info-section.component.scss index b428337a..e81c17a9 100644 --- a/docs/app/pages/home/main-info-section/main-info-section.component.scss +++ b/docs/app/pages/home/main-info-section/main-info-section.component.scss @@ -11,7 +11,7 @@ $color-active: nb-theme(color-active-fg); display: flex; - padding: 3.375rem 0 0; + padding: 3.375rem 0; max-width: 120rem; margin: 0 auto; @@ -133,8 +133,9 @@ cursor: pointer; text-transform: uppercase; - &.btn-demo { - margin-left: 1em; + &.btn-demo, + &.btn-download, + &.btn-download-premium { color: #ffffff; background-color: nb-theme(color-active-fg); box-shadow: nb-theme(shadow-btn); @@ -155,6 +156,16 @@ &:active { box-shadow: nb-theme(shadow-active-btn); } + + &.btn-demo { + margin-left: 1em; + } + } + + .btn-download, + .btn-download-premium { + margin-top: 1rem; + width: 100%; } @include media-breakpoint-down(xxl) { diff --git a/docs/app/pages/home/main-info-section/main-info-section.component.ts b/docs/app/pages/home/main-info-section/main-info-section.component.ts index b2e611e6..9066f8b9 100644 --- a/docs/app/pages/home/main-info-section/main-info-section.component.ts +++ b/docs/app/pages/home/main-info-section/main-info-section.component.ts @@ -5,9 +5,12 @@ */ import { Component, OnDestroy, Input } from '@angular/core'; -import { NbMediaBreakpoint, NbMediaBreakpointsService, NbThemeService } from '@nebular/theme'; +import { NbDialogService, NbMediaBreakpoint, NbMediaBreakpointsService, NbThemeService } from '@nebular/theme'; import { takeWhile } from 'rxjs/operators'; +import { DownloadFormComponent } from '../../../shared/components/download-form/download-form.component'; +import { PremiumFormComponent } from '../../../shared/components/premium-form/premium-form.component'; + @Component({ selector: 'ngx-landing-main-info', templateUrl: './main-info-section.component.html', @@ -15,7 +18,8 @@ import { takeWhile } from 'rxjs/operators'; }) export class MainInfoSectionComponent implements OnDestroy { constructor(themeService: NbThemeService, - breakpointService: NbMediaBreakpointsService) { + breakpointService: NbMediaBreakpointsService, + private dialogService: NbDialogService) { this.breakpoints = breakpointService.getBreakpointsMap(); themeService.onMediaQueryChange() .pipe(takeWhile(() => this.alive)) @@ -42,4 +46,12 @@ export class MainInfoSectionComponent implements OnDestroy { public ngOnDestroy() { this.alive = false; } + + openDownloadDialog() { + this.dialogService.open(DownloadFormComponent); + } + + openDownloadPremiumDialog() { + this.dialogService.open(PremiumFormComponent); + } } diff --git a/docs/app/shared/components/download-admin/download-admin.component.html b/docs/app/shared/components/download-admin/download-admin.component.html deleted file mode 100644 index 48e03664..00000000 --- a/docs/app/shared/components/download-admin/download-admin.component.html +++ /dev/null @@ -1,3 +0,0 @@ - diff --git a/docs/app/shared/components/download-admin/download-admin.component.scss b/docs/app/shared/components/download-admin/download-admin.component.scss deleted file mode 100644 index 75c0a5de..00000000 --- a/docs/app/shared/components/download-admin/download-admin.component.scss +++ /dev/null @@ -1,59 +0,0 @@ -/** - * @license - * Copyright Akveo. All Rights Reserved. - * Licensed under the MIT License. See License.txt in the project root for license information. - */ - -@import '../../../@theme/styles/themes'; -@import '~@nebular/theme/styles/global/breakpoints'; - -@include nb-install-component() { - .btn { - font-family: nb-theme(font-main), sans-serif; - border-radius: 3px; - border: none; - background: #ffffff; - color: #000000; - padding: 1.125rem 0; - box-shadow: nb-theme(shadow-default); - cursor: pointer; - text-transform: uppercase; - - &.btn-download { - margin-left: 1em; - color: #ffffff; - background-color: nb-theme(color-active-fg); - box-shadow: nb-theme(shadow-btn); - - &:hover { - box-shadow: nb-theme(shadow-hover-green-btn); - } - - &:active { - box-shadow: nb-theme(shadow-active-green-btn); - } - } - - &.btn-download { - margin-left: 0; - margin-top: 1rem; - width: 100%; - } - - &:hover { - box-shadow: nb-theme(shadow-hover-btn); - } - - &:active { - box-shadow: nb-theme(shadow-active-btn); - } - } - - @include media-breakpoint-down(md) { - .btn { - font-size: 0.7rem; - padding-bottom: 1rem; - padding-top: 1rem; - } - } -} diff --git a/docs/app/shared/components/download-admin/download-admin.component.ts b/docs/app/shared/components/download-admin/download-admin.component.ts deleted file mode 100644 index 62e4fc05..00000000 --- a/docs/app/shared/components/download-admin/download-admin.component.ts +++ /dev/null @@ -1,24 +0,0 @@ -/** - * @license - * Copyright Akveo. All Rights Reserved. - * Licensed under the MIT License. See License.txt in the project root for license information. - */ - -import { Component } from '@angular/core'; -import { NbDialogService } from '@nebular/theme'; -import { DownloadFormComponent } from '../download-form/download-form.component'; - -@Component({ - selector: 'ngx-download-admin', - templateUrl: './download-admin.component.html', - styleUrls: ['./download-admin.component.scss'], -}) -export class DownloadAdminComponent { - - constructor(private dialogService: NbDialogService) { - } - - openDialog() { - this.dialogService.open(DownloadFormComponent); - } -} diff --git a/docs/app/shared/components/download-form/download-form.component.html b/docs/app/shared/components/download-form/download-form.component.html index 363b74c9..a10636fe 100644 --- a/docs/app/shared/components/download-form/download-form.component.html +++ b/docs/app/shared/components/download-form/download-form.component.html @@ -1,8 +1,11 @@ - -
    + + Download +
    + + +
    diff --git a/docs/app/shared/components/download-form/download-form.component.scss b/docs/app/shared/components/download-form/download-form.component.scss index 418c07a6..7eac4976 100644 --- a/docs/app/shared/components/download-form/download-form.component.scss +++ b/docs/app/shared/components/download-form/download-form.component.scss @@ -9,85 +9,23 @@ @import '../../../@theme/styles/themes'; @include nb-install-component() { - nb-card-body { - position: relative; + + nb-card { + width: 30rem; + } + + nb-card-header { + display: flex; + align-items: center; + justify-content: flex-end; } .close-icon { - cursor: pointer; - position: absolute; - right: 0.1rem; - top: 0.1rem; + margin-left: auto; + padding: 0; } - ::ng-deep .custom-form { - .modal-header { - display: none; - } - - .modal-body { - padding-bottom: 0; - } - - .actions { - display: flex; - justify-content: flex-end; - } - - input.hs-input { - width: 100%; - font-size: nb-theme(font-size-sm); - padding: 0.75rem 1rem !important; - border: 1px solid #e4e9f2; - box-shadow: nb-theme(shadow-default); - border-radius: 0.25rem; - - &.invalid { - box-shadow: 0 0 1.25rem 0 rgba(210, 45, 45, 0.6); - } - - &::placeholder { - color: #434a59; - opacity: 0.24; - } - - &:focus { - outline: none; - } - } - - .hs-error-msgs { - list-style-type: none; - padding: 0; - } - - .hs-form-required, .hs-error-msg { - color: #f2545b; - } - - .hs_error_rollup { - display: none; - } - - .btn { - margin-top: 2rem; - font-family: nb-theme(font-main), sans-serif; - border-radius: 3px; - border: none; - background-color: nb-theme(color-active-fg); - color: #ffffff; - padding: 1rem 2rem; - box-shadow: nb-theme(shadow-btn); - cursor: pointer; - text-transform: uppercase; - - &:hover { - box-shadow: nb-theme(shadow-hover-green-btn); - } - - &:active { - box-shadow: nb-theme(shadow-active-green-btn); - } - } + ::ng-deep .hs-custom-form .hs-submit-btn { + margin-top: 2rem; } } diff --git a/docs/app/shared/components/download-form/download-form.component.ts b/docs/app/shared/components/download-form/download-form.component.ts index f22cacc6..28b540f4 100644 --- a/docs/app/shared/components/download-form/download-form.component.ts +++ b/docs/app/shared/components/download-form/download-form.component.ts @@ -22,9 +22,9 @@ export class DownloadFormComponent implements AfterViewInit { portalId: '2452262', formId: '93007d7b-5f11-4dd8-bcfd-f8b99d31f31e', target: '#hubspotForm', - submitButtonClass: 'btn', + submitButtonClass: 'hs-submit-btn btn', css: '', - cssClass: 'custom-form', + cssClass: 'hs-custom-form', redirectUrl: 'https://github.com/akveo/ngx-admin', }); } diff --git a/docs/app/shared/components/premium-form/premium-form.component.html b/docs/app/shared/components/premium-form/premium-form.component.html new file mode 100644 index 00000000..45436c7b --- /dev/null +++ b/docs/app/shared/components/premium-form/premium-form.component.html @@ -0,0 +1,11 @@ + + + Premium + + + +
    +     +     diff --git a/docs/app/shared/components/premium-form/premium-form.component.scss b/docs/app/shared/components/premium-form/premium-form.component.scss new file mode 100644 index 00000000..a1a8c31c --- /dev/null +++ b/docs/app/shared/components/premium-form/premium-form.component.scss @@ -0,0 +1,31 @@ +/** + * @license + * Copyright Akveo. All Rights Reserved. + * Licensed under the MIT License. See License.txt in the project root for license information. + */ + +@import '~@nebular/theme/styles/global/breakpoints'; + +@import '../../../@theme/styles/themes'; + +@include nb-install-component() { + + nb-card { + width: 30rem; + } + + nb-card-header { + display: flex; + align-items: center; + justify-content: flex-end; + } + + .close-icon { + margin-left: auto; + padding: 0; + } + + ::ng-deep .hs-custom-form .hs-submit-btn { + margin-top: 1rem; + } +} diff --git a/docs/app/shared/components/premium-form/premium-form.component.ts b/docs/app/shared/components/premium-form/premium-form.component.ts new file mode 100644 index 00000000..edfc3eb1 --- /dev/null +++ b/docs/app/shared/components/premium-form/premium-form.component.ts @@ -0,0 +1,36 @@ +/** + * @license + * Copyright Akveo. All Rights Reserved. + * Licensed under the MIT License. See License.txt in the project root for license information. + */ + +import { AfterViewInit, Component } from '@angular/core'; +import { NbDialogRef } from '@nebular/theme'; + +@Component({ + selector: 'ngx-premium-form', + templateUrl: './premium-form.component.html', + styleUrls: ['./premium-form.component.scss'], +}) +export class PremiumFormComponent implements AfterViewInit { + + + constructor(protected ref: NbDialogRef) { + } + + ngAfterViewInit() { + hbspt.forms.create({ + portalId: '2452262', + formId: 'b066428e-c41a-4dce-bbc2-5690cf084a8f', + target: '#hubspotForm', + submitButtonClass: 'hs-submit-btn btn', + css: '', + cssClass: 'hs-custom-form', + redirectUrl: 'https://github.com/akveo/ngx-admin', + }); + } + + closeDialog() { + this.ref.close(); + } +} diff --git a/docs/app/shared/landing-shared.module.ts b/docs/app/shared/landing-shared.module.ts index d43b794b..df1c34a2 100644 --- a/docs/app/shared/landing-shared.module.ts +++ b/docs/app/shared/landing-shared.module.ts @@ -1,16 +1,16 @@ import { NgModule } from '@angular/core'; -import { NbBadgeModule, NbCardModule, NbDialogModule, NbPopoverModule } from '@nebular/theme'; +import {NbBadgeModule, NbButtonModule, NbCardModule, NbDialogModule, NbPopoverModule} from '@nebular/theme'; import { MaterialThemeLinkComponent } from './components/material-theme-link/material-theme-link.component'; import { CapitalizePipe } from './pipes/capitalize.pipe'; import { EvaIconsPipe } from './pipes/eva-icons.pipe'; import { RouterModule } from '@angular/router'; -import { DownloadAdminComponent } from './components/download-admin/download-admin.component'; import { DownloadFormComponent } from './components/download-form/download-form.component'; +import { PremiumFormComponent } from './components/premium-form/premium-form.component'; const component = [ MaterialThemeLinkComponent, - DownloadAdminComponent, DownloadFormComponent, + PremiumFormComponent, ]; const pipes = [ CapitalizePipe, @@ -24,14 +24,12 @@ const pipes = [ NbBadgeModule, NbCardModule, NbDialogModule.forChild(), + NbButtonModule, ], declarations: [ ...component, ...pipes, ], - entryComponents: [ - DownloadFormComponent, - ], exports: [ NbPopoverModule, ...component, diff --git a/src/app/pages/backend-integration/backend-integration.component.scss b/src/app/pages/backend-integration/backend-integration.component.scss index 697a35b3..718fad0e 100644 --- a/src/app/pages/backend-integration/backend-integration.component.scss +++ b/src/app/pages/backend-integration/backend-integration.component.scss @@ -25,7 +25,7 @@ max-width: 45rem; align-items: stretch; height: 100%; - + ::ng-deep :last-child { width: 100%; } From 5e7e4444547f913cd7fe988103f93e0ab539a276 Mon Sep 17 00:00:00 2001 From: Sergey Andrievskiy Date: Fri, 9 Oct 2020 15:53:24 +0300 Subject: [PATCH 5/5] fix(admin premium form): don't redirect to GitHub (#5785) --- .../app/shared/components/premium-form/premium-form.component.ts | 1 - 1 file changed, 1 deletion(-) diff --git a/docs/app/shared/components/premium-form/premium-form.component.ts b/docs/app/shared/components/premium-form/premium-form.component.ts index edfc3eb1..c3d75abe 100644 --- a/docs/app/shared/components/premium-form/premium-form.component.ts +++ b/docs/app/shared/components/premium-form/premium-form.component.ts @@ -26,7 +26,6 @@ export class PremiumFormComponent implements AfterViewInit { submitButtonClass: 'hs-submit-btn btn', css: '', cssClass: 'hs-custom-form', - redirectUrl: 'https://github.com/akveo/ngx-admin', }); }