diff --git a/docs/app/@core/data/service/descriptions.service.ts b/docs/app/@core/data/service/descriptions.service.ts index 6d07bfa9..104d099e 100644 --- a/docs/app/@core/data/service/descriptions.service.ts +++ b/docs/app/@core/data/service/descriptions.service.ts @@ -38,4 +38,33 @@ export class DescriptionsService { getDescriptions(): Observable { return observableOf(this.descriptions); } + + /* tslint:disable:max-line-length */ + private bundleDescriptions: Descriptions[] = [ + { + icon: 'umbrella-outline', + title: 'Convenient', + description: 'Complete pack of well known Angular based ngx-admin template, integrated with Backend Solution. Finally, you can get fully backend integrated solution out of the box. Flexibility of Ngx Admin, the variety of Nebular features and convenience of integrated Backend in one pack.', + }, + { + icon: 'settings-2-outline', + title: 'Functional', + description: 'Functional Backend Solution with Designed and Implemented Services and Data Flow. Deploy it as ready to use solution for a particular case, or give it to your development team to incrementally add functionality for the bigger system. it gives you a significant boost on start and solid development structure.', + }, + { + icon: 'clock-outline', + title: 'Efficient', + description: 'Save more than $21,000 using Backend Bundle. According to our research usage of a ready Backend Bundle optimizes 300 hours of development time. Taking the average hourly rate of a full stack developer in the US - $70.', + }, + { + icon: 'checkmark-circle-2-outline', + title: 'Ready to use', + description: 'We prepared this backend pack as development basement which lets your team concentrate on business logic and data models. Now .NET and .NET Core are available as frameworks of choice. More are in progress…', + }, + ]; + /* tslint:enable:max-line-length */ + + getBundleDescriptions(): Observable { + return observableOf(this.bundleDescriptions); + } } diff --git a/docs/app/@core/data/service/header-menu.service.ts b/docs/app/@core/data/service/header-menu.service.ts index 9b7c9121..c1daa2fc 100644 --- a/docs/app/@core/data/service/header-menu.service.ts +++ b/docs/app/@core/data/service/header-menu.service.ts @@ -11,6 +11,11 @@ export class HeaderMenuService { title: 'Home', link: '/', }, + { + title: 'Backend Bundles', + link: '/', + fragment: 'backend-bundles', + }, { title: 'Docs', link: '/docs', diff --git a/docs/app/app-routing.module.ts b/docs/app/app-routing.module.ts index 1455aacc..6f7ee75a 100644 --- a/docs/app/app-routing.module.ts +++ b/docs/app/app-routing.module.ts @@ -14,6 +14,7 @@ const routes: Routes = [ const config: ExtraOptions = { useHash: false, + anchorScrolling: 'enabled', }; @NgModule({ diff --git a/docs/app/pages/home/backend-bundles-section/backend-bundles-section.component.html b/docs/app/pages/home/backend-bundles-section/backend-bundles-section.component.html new file mode 100644 index 00000000..bab29dfb --- /dev/null +++ b/docs/app/pages/home/backend-bundles-section/backend-bundles-section.component.html @@ -0,0 +1,306 @@ + + Backend Bundles + + +
+ +

Akveo new product created after a number of community and clients requests. We did all backend integration in ngx-admin for you! Now you can buy a complete UI + backend solution based on the backend framework of choice to use it as a template for your solution implementation. +

+ +
+
+ + +
+
+ +
    +
  • + + + + +
    + Coming soon +
    +
    +

    {{ ecomName }}

    +

    {{ netName }}

    +

    + E-Commerce Dashboard integrated with REST data services based on .NET Framework, Web API and Entity Framework 6.2 +

    +
    + ${{ isCommercial() ? '2000' : '200' }} + ${{ isCommercial() ? '1500' : '150' }} +
    + + Buy now + +     +     +     + + + +

    {{ selectedLicenseType }}

    + + + Buy now + +     +     +     +     +
    • +
  • + + + + +
    + Coming soon +
    +
    +

    {{ iotName }}

    +

    {{ netName }}

    +

    + IoT Dashboard integrated with REST data services based on .NET Framework, Web API and Entity Framework 6.2 +

    +
    + ${{ isCommercial() ? '2000' : '200' }} + ${{ isCommercial() ? '1500' : '150' }} +
    + + Buy now + +     +     +     + + + +

    {{ selectedLicenseType }}

    + + + Buy now + +     +     +     +     +
    • +
  • + + + + +
    + Coming soon +
    +
    +

    {{ ecomName }}

    +

    {{ netCoreName }}

    +

    + E-Commerce Dashboard integrated with REST data services based on .NET Core, Web API and Entity Framework 2.2 +

    +
    + ${{ isCommercial() ? '1800' : '180' }} + ${{ isCommercial() ? '1400' : '140' }} +
    + + Buy now + +     +     +     + + + +

    {{ selectedLicenseType }}

    + + + Buy now + +     +     +     +     +
    • +
  • + + + + +
    + Coming soon +
    +
    +

    {{ iotName }}

    +

    {{ netCoreName }}

    +

    + IoT Dashboard integrated with REST data services based on .NET Core, Web API and Entity Framework 2.2 +

    +
    + ${{ isCommercial() ? '1800' : '180' }} + ${{ isCommercial() ? '1400' : '140' }} +
    + + Buy now + +     +     +     + + + +

    {{ selectedLicenseType }}

    + + + Buy now + +     +     +     +     +
    • +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
FEATURESPERSONALCOMMERCIAL
NGX Admin template with 100+ UI components integrated with Backend +
    +
  • +
+ 		+
    +
  • +
+
.NET backend Services and Repository layers with data access +
    +
  • +
+ 		+
    +
  • +
+
JWT Authentication setup for UI and Backend +
    +
  • +
+ 		+
    +
  • +
+
Running instructions and code documentation +
    +
  • +
+ 		+
    +
  • +
+
Commercial Usage +
    +
  • +
+ 		+
    +
  • +
+
One Year Support and Bug Fixes by Request +
    +
  • +
+ 		+
    +
  • +
+
+ + + + + + Architecture Design + + +

The schema describes the idea of how backend part of the .NET solution is organized. +

+ + + + Backend bundles + + +
diff --git a/docs/app/pages/home/backend-bundles-section/backend-bundles-section.component.scss b/docs/app/pages/home/backend-bundles-section/backend-bundles-section.component.scss new file mode 100644 index 00000000..91a3c51c --- /dev/null +++ b/docs/app/pages/home/backend-bundles-section/backend-bundles-section.component.scss @@ -0,0 +1,447 @@ +/** + * @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() { + $content-width: nb-theme(content-width); + $left-right-offset: 8.125rem; + + display: block; + padding-top: 5.125rem; + + .section-container { + width: calc(#{$content-width} - #{$left-right-offset} * 2); + max-width: 100%; + margin: 0 auto; + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + } + + .features { + display: flex; + flex-direction: row; + flex-wrap: wrap; + padding: 0 11px; + margin-top: 5rem; + margin-left: -11px; + margin-right: -11px; + width: 100%; + width: calc(100% + 22px); + + &__item { + flex: 0 0 25%; + width: 25%; + max-width: 25%; + display: flex; + flex-direction: column; + text-align: center; + list-style: none; + padding-left: 11px; + padding-right: 11px; + margin-bottom: 1.625rem; + } + &__title { + display: flex; + justify-content: center; + align-items: center; + min-height: 60px; + font-weight: bold; + font-size: 24px; + line-height: 30px; + text-align: center; + color: rgba(0, 0, 0, 0.87); + } + &__description { + font-family: nb-theme(font-secondary), sans-serif; + color: #8994a3; + font-size: nb-theme(font-size-lg); + line-height: 1.75; + text-align: center; + } + } + + .bundle-scheme { + display: none; + width: 100%; + height: auto; + margin: 2.5rem auto; + + &__image { + width: 100%; + } + + @include media-breakpoint-up(md) { + display: block; + } + } + + .package-switcher { + margin: 2.375rem 0 5rem; + + &__btn-group { + box-shadow: 0 8px 20px 0 rgba(218, 224, 235, 0.5); + border-radius: 1.5rem; + &:not(.btn-divided-group) > .package-switcher__btn:not(.dropdown-toggle):first-child { + border-top-left-radius: 1.5rem; + border-bottom-left-radius: 1.5rem; + } + &:not(.btn-divided-group) > .package-switcher__btn:not(.dropdown-toggle):last-child { + border-top-right-radius: 1.5rem; + border-bottom-right-radius: 1.5rem; + } + } + + &__btn { + min-width: 10.625rem; + color: #bdc3cb; + border-color: #e6e8eb; + text-transform: none; + cursor: pointer; + + &:active { + color: #ffffff; + } + &.active { + color: #000000; + background-color: #fafafa; + } + } + } + + .packages { + display: flex; + flex-direction: row; + flex-wrap: wrap; + padding: 0; + margin-left: -11px; + margin-right: -11px; + margin-bottom: 4rem; + width: 100%; + width: calc(100% + 22px); + + &__item { + flex: 0 0 25%; + width: 25%; + max-width: 25%; + display: flex; + flex-direction: column; + list-style: none; + padding-left: 11px; + padding-right: 11px; + margin-bottom: 22px; + } + } + + nb-flip-card { + display: flex; + height: 100%; + } + + /deep/ .flipcard-body { + height: 100%; + width: 100%; + } + + /deep/ .front-container, .back-container { + height: 100%; + } + + nb-card-front, nb-card-back { + display: flex; + height: 100%; + } + + nb-card { + height: 100%; + border: 0; + background-color: #ffffff; + box-shadow: 0 7px 17px 0 rgba(218, 224, 235, 0.5); + margin-bottom: 0; + } + + nb-card-body { + display: flex; + flex-direction: column; + flex-wrap: nowrap; + justify-content: flex-start; + align-content: stretch; + align-items: stretch; + padding: 1rem; + } + + .package-card { + width: 100%; + display: flex; + flex-direction: column; + flex-wrap: nowrap; + justify-content: flex-start; + align-content: stretch; + align-items: stretch; + cursor: pointer; + + &--front { + text-align: center; + } + + &__header { + display: flex; + flex-direction: column; + flex: 0 0 auto; + margin-bottom: 0.5625rem; + } + &__demo-link { + align-self: flex-end; + color: #ff8588; + font-weight: bold; + font-size: 0.75rem; + line-height: 1rem; + text-align: center; + text-transform: uppercase; + padding: 0.25rem 1rem; + border: 1px solid #ff8588; + border-radius: 0.75rem; + &--secondary { + color: #ad7efa; + border-color: #ad7efa; + } + } + &__image { + margin: 0 -1rem; + display: flex; + flex: 0 0 14.125rem; + background-repeat: no-repeat; + background-position: center center; + background-size: auto 100%; + &--dot-net { + background-image: url('assets/img/bundle-dot-net.png'); + } + &--dot-net-core { + background-image: url('assets/img/bundle-dot-net-core.png'); + } + } + &__price-wrapper { + flex: 0 0 2.5rem; + margin-bottom: 0.5rem; + } + &__price { + font-weight: bold; + font-size: 1.75rem; + line-height: 2.5rem; + color: rgba(0, 0, 0, 0.87); + vertical-align: middle; + &--old { + font-size: 1.5rem; + color: #ff4d6b; + text-decoration: line-through; + vertical-align: middle; + margin-right: 1rem; + } + } + &__title { + // min-height: 2rem; + font-weight: bold; + font-size: 1.125rem; + color: rgba(0, 0, 0, 0.87); + // margin-bottom: 0.5rem; + } + &__description { + margin-top: 0.5rem; + font-family: nb-theme(font-secondary), sans-serif; + font-weight: lighter; + font-size: 0.875rem; + color: rgba(0, 0, 0, 0.87); + margin-bottom: 1.675rem; + } + &__buy-link { + font-family: nb-theme(font-secondary), sans-serif; + font-size: 0.75rem; + color: #ffffff; + text-transform: uppercase; + background-color: #18cb90; + box-shadow: 0 5px 29px 0 rgba(0, 219, 146, 0.32); + border-radius: 3px; + margin-top: auto; + cursor: pointer; + &:hover { + box-shadow: 0 0.375rem 2.125rem 0 rgba(0, 219, 146, 0.32); + } + } + &__type { + font-weight: bold; + font-size: 1rem; + line-height: 1.25rem; + color: rgba(0, 0, 0, 0.87); + text-align: center; + margin-top: 0.25rem; + margin-bottom: 0.5rem; + } + } + + .included { + display: flex; + flex-wrap: nowrap; + flex-direction: column; + padding: 0; + margin: 1rem 0 0; + + &__item { + display: flex; + flex-direction: row; + flex-wrap: nowrap; + list-style: none; + margin: 0 0 1rem; + font-size: 0.875rem; + line-height: 1.25rem; + font-weight: 300; + padding-left: 0.5rem; + + &::before { + content: ''; + display: inline-flex; + width: 10px; + height: 14px; + border: solid #00db92; + border-width: 0 2px 2px 0; + transform: rotate(45deg); + // ff3d71 + } + } + + &__text { + margin: 0 0 0 1.5rem; + } + } + + .not-included { + display: flex; + flex-wrap: nowrap; + flex-direction: column; + padding: 0; + margin: 1rem 0 0; + + &__item { + display: flex; + flex-direction: row; + flex-wrap: nowrap; + list-style: none; + margin: 0 0 1rem; + font-size: 0.875rem; + line-height: 1.25rem; + font-weight: 300; + padding-left: 0.5rem; + + &::before { + content: ''; + display: inline-flex; + width: 10px; + height: 14px; + border: solid #ff8588; + border-width: 0 2px 2px 0; + transform: rotate(45deg); + } + } + + &__text { + margin: 0 0 0 1.5rem; + } + } + + @include media-breakpoint-down(xl) { + .section-container { + padding-left: 1rem; + padding-right: 1rem; + } + + .bundle-scheme { + padding: 0 11px; + } + + .features { + padding-left: 11px; + padding-right: 11px; + + &__item { + flex-basis: 50%; + width: 50%; + max-width: 50%; + } + } + + .packages { + padding-left: 11px; + padding-right: 11px; + + &__item { + flex-basis: 50%; + width: 50%; + max-width: 50%; + margin-bottom: 1.625rem; + } + } + } + + .features-table { + width: 100%; + margin-bottom: 5rem; + + box-shadow: 0 8px 20px 0 rgba(218, 224, 235, 0.5); + background-color: #fafafa; + + th, td { + //border: 0.5px solid #dae0eb; + padding: 0.5rem; + text-align: center; + } + + th { + padding: 1rem; + } + + td { + font-weight: lighter; + font-size: 0.75rem; + } + + td ul { + display: inline-block; + margin: auto; + } + + .left { + text-align: left; + padding-left: 1rem; + } + + tr:nth-child(even) { + background-color: #ffffff; + } + } + + @include media-breakpoint-down(sm) { + + .packages__item { + flex-basis: 100%; + width: 100%; + max-width: 100%; + } + } + + @include media-breakpoint-down(is) { + + .features__item { + flex-basis: 100%; + width: 100%; + max-width: 100%; + } + .package-switcher__btn { + min-width: 8rem; + } + } +} diff --git a/docs/app/pages/home/backend-bundles-section/backend-bundles-section.component.ts b/docs/app/pages/home/backend-bundles-section/backend-bundles-section.component.ts new file mode 100644 index 00000000..b1cb384c --- /dev/null +++ b/docs/app/pages/home/backend-bundles-section/backend-bundles-section.component.ts @@ -0,0 +1,80 @@ +/** + * @license + * Copyright Akveo. All Rights Reserved. + * Licensed under the MIT License. See License.txt in the project root for license information. + */ + +import { Component, OnDestroy } from '@angular/core'; +import { Descriptions, DescriptionsService } from '../../../@core/data/service/descriptions.service'; +import { takeWhile } from 'rxjs/operators'; + +@Component({ + selector: 'ngx-backend-bundles-section', + templateUrl: 'backend-bundles-section.component.html', + styleUrls: ['./backend-bundles-section.component.scss'], +}) + +export class BackendBundlesSectionComponent implements OnDestroy { + + private alive = true; + descriptions: Descriptions[]; + + ngOnDestroy() { + this.alive = false; + } + + selectedLicenseType = 'Personal'; + personalLicense = 'Personal'; + commercialLicense = 'Commercial'; + + ecomName = 'E-Commerce:'; + iotName = 'IoT:'; + + netName = '.NET + NGX Admin'; + netCoreName = '.NET Core + NGX Admin'; + + + constructor(private descriptionsService: DescriptionsService) { + this.descriptionsService.getBundleDescriptions() + .pipe(takeWhile(() => this.alive)) + .subscribe((descriptions) => this.descriptions = descriptions); + } + + get firstBundleMail(): string { + return this.getMailToText('.NET E-commerce'); + } + + get secondBundleMail(): string { + return this.getMailToText('.NET IoT'); + } + + get thirdBundleMail(): string { + return this.getMailToText('.NET Core E-commerce'); + } + + get fourthBundleMail(): string { + return this.getMailToText('.NET Core IoT'); + } + + firstCardFlipped: boolean = false; + secondCardFlipped: boolean = false; + thirdCardFlipped: boolean = false; + fourthCardFlipped: boolean = false; + + stopPropagation(e) { + e.stopPropagation(); + } + + isCommercial() { + return this.selectedLicenseType === 'Commercial'; + } + + private getMailToText(bundleName: string) { + return 'mailto:support@akveo.com' + + `?subject=${this.selectedLicenseType} ${bundleName} Bundle` + + '&body=Dear Akveo, %0D%0A%0D%0A' + + `I would like to purchase ${this.selectedLicenseType} ${bundleName} Bundle. ` + + 'Please give me details how I can proceed with that. %0D%0A%0D%0A' + + 'Thanks and regards'; + } +} diff --git a/docs/app/pages/home/description-section/description-section.component.scss b/docs/app/pages/home/description-section/description-section.component.scss index f0551d1f..3388ecb7 100644 --- a/docs/app/pages/home/description-section/description-section.component.scss +++ b/docs/app/pages/home/description-section/description-section.component.scss @@ -48,6 +48,7 @@ } .description { + width: 100%; color: nb-theme(color-fg); font-family: nb-theme(font-secondary), sans-serif; margin-top: 1.25rem; diff --git a/docs/app/pages/home/description-section/description-section.component.ts b/docs/app/pages/home/description-section/description-section.component.ts index 5fbf39ad..c9566568 100644 --- a/docs/app/pages/home/description-section/description-section.component.ts +++ b/docs/app/pages/home/description-section/description-section.component.ts @@ -4,28 +4,14 @@ * Licensed under the MIT License. See License.txt in the project root for license information. */ -import { Component, OnDestroy } from '@angular/core'; -import { Descriptions, DescriptionsService } from '../../../@core/data/service/descriptions.service'; -import { takeWhile } from 'rxjs/operators'; +import { Component, Input } from '@angular/core'; +import { Descriptions } from '../../../@core/data/service/descriptions.service'; @Component({ selector: 'ngx-landing-description-section', templateUrl: './description-section.component.html', styleUrls: ['./description-section.component.scss'], }) -export class DescriptionSectionComponent implements OnDestroy { - - private alive = true; - - descriptions: Descriptions[]; - - constructor(private descriptionsService: DescriptionsService) { - this.descriptionsService.getDescriptions() - .pipe(takeWhile(() => this.alive)) - .subscribe((descriptions) => this.descriptions = descriptions); - } - - ngOnDestroy() { - this.alive = false; - } +export class DescriptionSectionComponent { + @Input() descriptions: Descriptions[]; } diff --git a/docs/app/pages/home/landing-home.module.ts b/docs/app/pages/home/landing-home.module.ts index 7e744f95..0b6cdc4c 100644 --- a/docs/app/pages/home/landing-home.module.ts +++ b/docs/app/pages/home/landing-home.module.ts @@ -12,6 +12,7 @@ import { SwiperModule } from 'ngx-swiper-wrapper'; // modules // components +import { NgbModule } from '@ng-bootstrap/ng-bootstrap'; import { LandingHomeComponent } from './landing-home.component'; import { MainInfoSectionComponent } from './main-info-section/main-info-section.component'; import { DescriptionSectionComponent } from './description-section/description-section.component'; @@ -23,6 +24,7 @@ import { ContactSectionComponent } from './contact-section/contact-section.compo import { OurProjectsSectionComponent } from './our-projects-section/our-projects-section.component'; import { LandingHomeRoutingModule } from './landing-home-routing.module'; import { NgxLandingSectionsContainerComponent } from './sections-container/ngx-landing-sections-container.component'; +import { BackendBundlesSectionComponent } from './backend-bundles-section/backend-bundles-section.component'; // components const COMPONENTS = [ @@ -36,6 +38,7 @@ const COMPONENTS = [ OurProjectsSectionComponent, SocialSectionComponent, ContactSectionComponent, + BackendBundlesSectionComponent, ]; @NgModule({ @@ -43,6 +46,7 @@ const COMPONENTS = [ ...COMPONENTS, ], imports: [ + NgbModule, NgxLandingThemeModule, SwiperModule, LandingHomeRoutingModule, 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 05471b1a..0551d0e2 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 @@ -3,6 +3,7 @@ target="_blank"> 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 9f74211d..1c9414b2 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 @@ -186,7 +186,7 @@ .mobile-main-img-container { width: 100%; - height: 100%; + height: auto; img { width: 100%; diff --git a/docs/app/pages/home/our-projects-section/our-projects-section.component.scss b/docs/app/pages/home/our-projects-section/our-projects-section.component.scss index 8389ce63..f965452f 100644 --- a/docs/app/pages/home/our-projects-section/our-projects-section.component.scss +++ b/docs/app/pages/home/our-projects-section/our-projects-section.component.scss @@ -16,10 +16,10 @@ .project-img { min-width: 39.75rem; min-height: 20.375rem; + max-height: 20.375rem; .lazy-load-image { width: 100%; - height: 100%; visibility: hidden; transition: opacity 1s; opacity: 0; @@ -28,6 +28,9 @@ visibility: visible; opacity: 1; } + &.ng-failed-lazyloaded { + height: 100%; + } } } 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 b0423650..5bc1571b 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,7 +2,7 @@ - + @@ -12,6 +12,8 @@ + +
diff --git a/docs/app/pages/home/sections-container/ngx-landing-sections-container.component.scss b/docs/app/pages/home/sections-container/ngx-landing-sections-container.component.scss index 78764e5c..65f8945a 100644 --- a/docs/app/pages/home/sections-container/ngx-landing-sections-container.component.scss +++ b/docs/app/pages/home/sections-container/ngx-landing-sections-container.component.scss @@ -19,7 +19,8 @@ ngx-landing-reviews-section, ngx-landing-our-projects-section, ngx-landing-social-section, - ngx-landing-contact-section { + ngx-landing-contact-section, + ngx-backend-bundles-section { max-width: $content-width; margin: 0 auto; } diff --git a/docs/app/pages/home/sections-container/ngx-landing-sections-container.component.ts b/docs/app/pages/home/sections-container/ngx-landing-sections-container.component.ts index 765259ab..208d32ac 100644 --- a/docs/app/pages/home/sections-container/ngx-landing-sections-container.component.ts +++ b/docs/app/pages/home/sections-container/ngx-landing-sections-container.component.ts @@ -4,15 +4,27 @@ * Licensed under the MIT License. See License.txt in the project root for license information. */ -import { Component } from '@angular/core'; +import { Component, OnDestroy } from '@angular/core'; +import { Descriptions, DescriptionsService } from '../../../@core/data/service/descriptions.service'; +import { takeWhile } from 'rxjs/operators'; @Component({ selector: 'ngx-landing-sections-container', templateUrl: './ngx-landing-sections-container.component.html', styleUrls: ['./ngx-landing-sections-container.component.scss'], }) -export class NgxLandingSectionsContainerComponent { +export class NgxLandingSectionsContainerComponent implements OnDestroy { - constructor() { + private alive = true; + descriptions: Descriptions[]; + + constructor(private descriptionsService: DescriptionsService) { + this.descriptionsService.getDescriptions() + .pipe(takeWhile(() => this.alive)) + .subscribe((descriptions) => this.descriptions = descriptions); + } + + ngOnDestroy() { + this.alive = false; } } diff --git a/docs/app/pages/home/social-section/social-section.component.scss b/docs/app/pages/home/social-section/social-section.component.scss index a06ef10f..8397f38a 100644 --- a/docs/app/pages/home/social-section/social-section.component.scss +++ b/docs/app/pages/home/social-section/social-section.component.scss @@ -14,6 +14,7 @@ padding-bottom: 5.125rem; .social-button { + width: 19rem; display: inline-flex; align-items: center; box-shadow: nb-theme(shadow-default); @@ -32,8 +33,13 @@ box-shadow: nb-theme(shadow-active-btn); } + > i { + width: 2.75rem; + text-align: center; + } + .info { - margin-left: 2rem; + margin-left: 1.625rem; text-align: left; } @@ -56,10 +62,7 @@ .github { margin-top: 2rem; - margin-left: 1.25rem; - padding-right: 6.5rem; - padding-top: 1.5rem; - padding-bottom: 1.5rem; + padding: 1.5rem 5rem 1.5rem 1.625rem; } .sub-title { @@ -83,10 +86,10 @@ } .facebook { - padding: 1.5rem 6.625rem 1.25rem 1.375rem; + padding: 1.5rem 5rem 1.25rem 1.625rem; .info { - margin-left: 1.125rem; + margin-left: 1.625rem; } .title { @@ -95,18 +98,18 @@ } .linkedin { - padding: 1.5rem 7rem 1.25rem 1.625rem; + padding: 1.5rem 5rem 1.25rem 1.625rem; .info { - margin-left: 1.75rem; + margin-left: 1.625rem; } } .twitter { - padding: 1.5rem 8rem 1.25rem 1.625rem; + padding: 1.5rem 5rem 1.25rem 1.625rem; .info { - margin-left: 1.75rem; + margin-left: 1.625rem; } } @@ -115,16 +118,27 @@ width: 80%; } + //.social-button { + // width: auto; + //} + + .github { + width: auto; + } + .facebook { + width: 13rem; padding-right: 1.5rem; } .linkedin { + width: 13rem; padding-right: 1.5rem; } .twitter { - padding-right: 3rem; + width: 13rem; + padding-right: 1.5rem; } } @@ -136,13 +150,15 @@ font-size: nb-theme(font-size); } - .github { + .social-button { margin-top: 2rem; margin-left: 0; - padding-right: 0; - padding-top: 1.25rem; - padding-bottom: 1.25rem; + padding: 1.25rem 0 1.25rem 1.875rem; width: 100%; + + .info { + margin-left: 1.5rem; + } } .sub-title { diff --git a/docs/assets/img/bundle-dot-net-core.png b/docs/assets/img/bundle-dot-net-core.png new file mode 100644 index 00000000..e7439040 Binary files /dev/null and b/docs/assets/img/bundle-dot-net-core.png differ diff --git a/docs/assets/img/bundle-dot-net.png b/docs/assets/img/bundle-dot-net.png new file mode 100644 index 00000000..c740ce9a Binary files /dev/null and b/docs/assets/img/bundle-dot-net.png differ diff --git a/docs/assets/img/bundle-scheme@1x.png b/docs/assets/img/bundle-scheme@1x.png new file mode 100644 index 00000000..7aa003e6 Binary files /dev/null and b/docs/assets/img/bundle-scheme@1x.png differ diff --git a/docs/assets/img/bundle-scheme@1x.webp b/docs/assets/img/bundle-scheme@1x.webp new file mode 100644 index 00000000..53367597 Binary files /dev/null and b/docs/assets/img/bundle-scheme@1x.webp differ diff --git a/docs/assets/img/bundle-scheme@2x.png b/docs/assets/img/bundle-scheme@2x.png new file mode 100644 index 00000000..c3011a52 Binary files /dev/null and b/docs/assets/img/bundle-scheme@2x.png differ diff --git a/docs/assets/img/bundle-scheme@2x.webp b/docs/assets/img/bundle-scheme@2x.webp new file mode 100644 index 00000000..9b768595 Binary files /dev/null and b/docs/assets/img/bundle-scheme@2x.webp differ diff --git a/docs/assets/img/default.png b/docs/assets/img/default.png index 2b5f7f59..f227640b 100644 Binary files a/docs/assets/img/default.png and b/docs/assets/img/default.png differ diff --git a/docs/index.html b/docs/index.html index e83269a1..105a553b 100644 --- a/docs/index.html +++ b/docs/index.html @@ -5,7 +5,7 @@ ngx-admin: Free Open Source admin dashboard template based on Angular, Bootstrap - +