diff --git a/src/Squidex/app/features/apps/pages/apps-page.component.html b/src/Squidex/app/features/apps/pages/apps-page.component.html index f39515ad5..f3204ade1 100644 --- a/src/Squidex/app/features/apps/pages/apps-page.component.html +++ b/src/Squidex/app/features/apps/pages/apps-page.component.html @@ -80,4 +80,6 @@ - \ No newline at end of file + + + \ No newline at end of file diff --git a/src/Squidex/app/features/apps/pages/apps-page.component.ts b/src/Squidex/app/features/apps/pages/apps-page.component.ts index 3bdb2d566..77a773b03 100644 --- a/src/Squidex/app/features/apps/pages/apps-page.component.ts +++ b/src/Squidex/app/features/apps/pages/apps-page.component.ts @@ -27,7 +27,7 @@ export class AppsPageComponent implements OnDestroy, OnInit { public addAppDialog = new ModalView(); - public apps: ImmutableArray; + public apps: ImmutableArray = ImmutableArray.empty(); public appTemplate = ''; public onboardingModal = new ModalView(); diff --git a/src/Squidex/app/features/apps/pages/onboarding-dialog.component.html b/src/Squidex/app/features/apps/pages/onboarding-dialog.component.html index 14ad6c355..f58c2dc71 100644 --- a/src/Squidex/app/features/apps/pages/onboarding-dialog.component.html +++ b/src/Squidex/app/features/apps/pages/onboarding-dialog.component.html @@ -1,149 +1,146 @@ - - - - Skip Tour + + + Skip Tour -
- +
+ -
-

Welcome to Squidex CMS

+
+

Welcome to Squidex CMS

-

- You can start managing and distributing your content right away, but we we'd like to walk you through some basics first... -

-

- How's that? -

+

+ You can start managing and distributing your content right away, but we we'd like to walk you through some basics first... +

+

+ How's that? +

- -
+
-
-

Apps

- -
-
-
-
-

- An App is the repository for your project, e.g. (blog, webshop or mobile app). You can assign contributors to your app to work together. -

-

- You can create an unlimited number of Apps in Squidex to manage multiple projects at the same time. -

-
-
-
- +
+
+

Apps

+ +
+
+
+
+

+ An App is the repository for your project, e.g. (blog, webshop or mobile app). You can assign contributors to your app to work together. +

+

+ You can create an unlimited number of Apps in Squidex to manage multiple projects at the same time. +

- - + +
-
-

Schemas

- -
-
-
-
-

- Schemas define the structure of your content, the fields and the data types of a content item. -

-

- Before you can add content to your schema, make sure to hit the 'Publish' button at the top to make the schema available to your content editors. -

-
-
-
- +
+
+

Schemas

+ +
+
+
+
+

+ Schemas define the structure of your content, the fields and the data types of a content item. +

+

+ Before you can add content to your schema, make sure to hit the 'Publish' button at the top to make the schema available to your content editors. +

- - + +
-
-

Contents

- -
-
-
-
-

- Content is the actual data in your app which is grouped by the schema. -

-

- Select a published schema first, then add content for this schema. -

-
-
-
- +
+
+

Contents

+ +
+
+
+
+

+ Content is the actual data in your app which is grouped by the schema. +

+

+ Select a published schema first, then add content for this schema. +

- - + +
-
-

Assets

- -
- -
-
-
-

- The assets contains all files that can also be linked to your content. For example images, videos or documents. -

-

- You can upload the assets here and use them later or also upload them directly when you create a new content item with an asset field. -

-
-
-
- +
+
+

Assets

+ +
+
+
+
+

+ The assets contains all files that can also be linked to your content. For example images, videos or documents. +

+

+ You can upload the assets here and use them later or also upload them directly when you create a new content item with an asset field. +

- - + +
-
- - -
-

Awesome, now you know the basics!

- -

- But that's not all of the support we can provide.
You can go to https://docs.squidex.io/ to read more. -

-

- Do you want to join our community? -

- - +
+
+ + +
+

Awesome, now you know the basics!

+ +

+ But that's not all of the support we can provide.
You can go to https://docs.squidex.io/ to read more. +

+

+ Do you want to join our community? +

+ +
- - - +
+ + diff --git a/src/Squidex/app/features/apps/pages/onboarding-dialog.component.scss b/src/Squidex/app/features/apps/pages/onboarding-dialog.component.scss index 88131e189..f2c725f3b 100644 --- a/src/Squidex/app/features/apps/pages/onboarding-dialog.component.scss +++ b/src/Squidex/app/features/apps/pages/onboarding-dialog.component.scss @@ -19,7 +19,7 @@ p { max-width: 489px; } -.modal { +:host /deep/ .modal { &-content, &-dialog { min-height: $size-height; @@ -32,10 +32,14 @@ p { color: $color-dark-foreground; background-color: $color-dark-onboarding; background-image: url('/images/onboarding-background.png'); - overflow: hidden; position: relative; } + &-body, + &-content { + overflow: hidden; + } + &-close { text-decoration: underline !important; cursor: pointer; diff --git a/src/Squidex/app/features/apps/pages/onboarding-dialog.component.ts b/src/Squidex/app/features/apps/pages/onboarding-dialog.component.ts index f6511f0b1..53fe2a8d7 100644 --- a/src/Squidex/app/features/apps/pages/onboarding-dialog.component.ts +++ b/src/Squidex/app/features/apps/pages/onboarding-dialog.component.ts @@ -5,13 +5,9 @@ * Copyright (c) Squidex UG (haftungsbeschränkt). All rights reserved. */ -import { Component, Input } from '@angular/core'; +import { Component, EventEmitter, Output } from '@angular/core'; -import { - fadeAnimation, - ModalView, - slideAnimation -} from '@app/framework'; +import { fadeAnimation, slideAnimation } from '@app/framework'; @Component({ selector: 'sqx-onboarding-dialog', @@ -24,8 +20,8 @@ import { export class OnboardingDialogComponent { public step = 0; - @Input() - public modalView = new ModalView(); + @Output() + public close = new EventEmitter(); public next() { this.step = this.step + 1;