From 90d40eb2bcf8eed0037f90ce75e4360b11a15a55 Mon Sep 17 00:00:00 2001 From: Sebastian Stehle Date: Tue, 27 Feb 2024 20:42:28 +0100 Subject: [PATCH] Fix modal. --- .../Actions/Prerender/PrerenderPlugin.cs | 2 +- .../pages/contents/contents-page.component.scss | 2 +- .../rules/pages/rules/rules-page.component.html | 2 +- .../angular/dropdown-menu.component.scss | 1 + .../framework/angular/modals/modal.directive.ts | 16 ++++++++++------ .../assets/asset-uploader.component.html | 4 ++-- .../assets/asset-uploader.component.scss | 11 ++++++----- .../assets/asset-uploader.component.ts | 3 ++- .../notification-dropdown.component.html | 4 ++-- .../notification-dropdown.component.scss | 7 +++++-- .../pages/internal/profile-menu.component.html | 2 +- frontend/src/app/theme/_common.scss | 4 ---- 12 files changed, 32 insertions(+), 26 deletions(-) diff --git a/backend/extensions/Squidex.Extensions/Actions/Prerender/PrerenderPlugin.cs b/backend/extensions/Squidex.Extensions/Actions/Prerender/PrerenderPlugin.cs index 559875744..6d9ac37c7 100644 --- a/backend/extensions/Squidex.Extensions/Actions/Prerender/PrerenderPlugin.cs +++ b/backend/extensions/Squidex.Extensions/Actions/Prerender/PrerenderPlugin.cs @@ -15,7 +15,7 @@ public sealed class PrerenderPlugin : IPlugin { public void ConfigureServices(IServiceCollection services, IConfiguration config) { - services.AddHttpClient("PrerenderAction", options => + services.AddHttpClient("Prerender", options => { options.BaseAddress = new Uri("https://api.prerender.io"); }); diff --git a/frontend/src/app/features/content/pages/contents/contents-page.component.scss b/frontend/src/app/features/content/pages/contents/contents-page.component.scss index c144da15f..0eeb112d8 100644 --- a/frontend/src/app/features/content/pages/contents/contents-page.component.scss +++ b/frontend/src/app/features/content/pages/contents/contents-page.component.scss @@ -67,7 +67,7 @@ } &-button { - @include absolute(null, 1rem, -2.375rem); + @include absolute(null, 1.5rem, -2.375rem); background-color: $color-background; border: 0; border-radius: 4px; diff --git a/frontend/src/app/features/rules/pages/rules/rules-page.component.html b/frontend/src/app/features/rules/pages/rules/rules-page.component.html index c9296ea64..726cfa202 100644 --- a/frontend/src/app/features/rules/pages/rules/rules-page.component.html +++ b/frontend/src/app/features/rules/pages/rules/rules-page.component.html @@ -13,7 +13,7 @@ -
+
{{ 'rules.runningRule' | sqxTranslate: { name: runningRule.name || 'Unnamed Rule' } }} {{ 'common.cancel' | sqxTranslate }} diff --git a/frontend/src/app/framework/angular/dropdown-menu.component.scss b/frontend/src/app/framework/angular/dropdown-menu.component.scss index 9c313b4c8..ea3566377 100644 --- a/frontend/src/app/framework/angular/dropdown-menu.component.scss +++ b/frontend/src/app/framework/angular/dropdown-menu.component.scss @@ -3,4 +3,5 @@ :host { background-color: $color-white; + display: block; } \ No newline at end of file diff --git a/frontend/src/app/framework/angular/modals/modal.directive.ts b/frontend/src/app/framework/angular/modals/modal.directive.ts index 44f505d94..a56819b66 100644 --- a/frontend/src/app/framework/angular/modals/modal.directive.ts +++ b/frontend/src/app/framework/angular/modals/modal.directive.ts @@ -7,7 +7,7 @@ /* eslint-disable @angular-eslint/no-input-rename */ -import { booleanAttribute, ChangeDetectorRef, Directive, EmbeddedViewRef, Input, OnDestroy, Renderer2, TemplateRef, ViewContainerRef } from '@angular/core'; +import { booleanAttribute, ChangeDetectorRef, Directive, EmbeddedViewRef, Input, OnDestroy, Renderer2, RendererFactory2, TemplateRef, ViewContainerRef } from '@angular/core'; import { DialogModel, ModalModel, Subscriptions, Types } from '@app/framework/internal'; import { RootViewComponent } from './root-view.component'; @@ -53,6 +53,7 @@ export class ModalDirective implements OnDestroy { constructor( private readonly changeDetector: ChangeDetectorRef, private readonly renderer: Renderer2, + private readonly rendererFactory: RendererFactory2, private readonly rootView: RootViewComponent, private readonly templateRef: TemplateRef>, private readonly viewContainer: ViewContainerRef, @@ -86,13 +87,16 @@ export class ModalDirective implements OnDestroy { this.changeDetector.detectChanges(); } } else if (this.renderedView) { - this.renderedView.destroy(); - this.renderedView = null; - this.renderRoots = null; + this.rendererFactory.begin?.(); + try { + this.renderedView.destroy(); + this.renderedView = null; + this.renderRoots = null; + } finally { + this.rendererFactory.end?.(); + } remove(this.renderer, ModalDirective.backdrop); - - this.changeDetector.detectChanges(); } this.isOpen = isOpen; diff --git a/frontend/src/app/shared/components/assets/asset-uploader.component.html b/frontend/src/app/shared/components/assets/asset-uploader.component.html index b47b40baf..fbfa14daf 100644 --- a/frontend/src/app/shared/components/assets/asset-uploader.component.html +++ b/frontend/src/app/shared/components/assets/asset-uploader.component.html @@ -1,14 +1,14 @@
    -
  • +
  • {{uploads.length}} - +
    {{ 'assets.uploaderUploadHere' | sqxTranslate }} diff --git a/frontend/src/app/shared/components/assets/asset-uploader.component.scss b/frontend/src/app/shared/components/assets/asset-uploader.component.scss index ab328704b..a50bf83e7 100644 --- a/frontend/src/app/shared/components/assets/asset-uploader.component.scss +++ b/frontend/src/app/shared/components/assets/asset-uploader.component.scss @@ -1,6 +1,10 @@ @import 'mixins'; @import 'vars'; +.nav-item { + height: 3rem; +} + .icon-upload-3 { font-size: 1.4rem; font-weight: lighter; @@ -9,17 +13,14 @@ } .dropdown-menu { - @include absolute(2.6rem, 0, auto, auto); - display: block; - max-width: 60%; - min-height: 4rem; - min-width: 30rem; + @include force-width(30rem); padding: 1rem; } .uploads { background: none; border: 2px solid transparent; + border-radius: 0; min-height: 2rem; &-empty { diff --git a/frontend/src/app/shared/components/assets/asset-uploader.component.ts b/frontend/src/app/shared/components/assets/asset-uploader.component.ts index 93ba9ccb4..76d75c29a 100644 --- a/frontend/src/app/shared/components/assets/asset-uploader.component.ts +++ b/frontend/src/app/shared/components/assets/asset-uploader.component.ts @@ -7,7 +7,7 @@ import { AsyncPipe, NgFor, NgIf, NgSwitch, NgSwitchCase, NgSwitchDefault } from '@angular/common'; import { ChangeDetectionStrategy, Component } from '@angular/core'; -import { DropdownMenuComponent, FileDropDirective, ModalDirective, ProgressBarComponent, TranslatePipe } from '@app/framework'; +import { DropdownMenuComponent, FileDropDirective, ModalDirective, ModalPlacementDirective, ProgressBarComponent, TranslatePipe } from '@app/framework'; import { AppsState, AssetsState, AssetUploaderState, ModalModel, Types, Upload } from '@app/shared/internal'; @Component({ @@ -21,6 +21,7 @@ import { AppsState, AssetsState, AssetUploaderState, ModalModel, Types, Upload } DropdownMenuComponent, FileDropDirective, ModalDirective, + ModalPlacementDirective, NgFor, NgIf, NgSwitch, diff --git a/frontend/src/app/shell/pages/internal/notification-dropdown.component.html b/frontend/src/app/shell/pages/internal/notification-dropdown.component.html index 95916a33a..e4a81f917 100644 --- a/frontend/src/app/shell/pages/internal/notification-dropdown.component.html +++ b/frontend/src/app/shell/pages/internal/notification-dropdown.component.html @@ -1,4 +1,4 @@ -
  • +
  • @@ -6,7 +6,7 @@
    • - + {{ 'notifications.empty' | sqxTranslate}} diff --git a/frontend/src/app/shell/pages/internal/notification-dropdown.component.scss b/frontend/src/app/shell/pages/internal/notification-dropdown.component.scss index e340fb490..19ac53553 100644 --- a/frontend/src/app/shell/pages/internal/notification-dropdown.component.scss +++ b/frontend/src/app/shell/pages/internal/notification-dropdown.component.scss @@ -1,10 +1,13 @@ @import 'mixins'; @import 'vars'; +.nav-item { + height: 3rem; +} + .dropdown-menu { - max-height: 500px; + max-height: 70%; min-height: 4rem; - overflow-y: scroll; padding: 1.25rem; padding-bottom: 1rem; width: 300px; diff --git a/frontend/src/app/shell/pages/internal/profile-menu.component.html b/frontend/src/app/shell/pages/internal/profile-menu.component.html index 6b73e3030..7744e4790 100644 --- a/frontend/src/app/shell/pages/internal/profile-menu.component.html +++ b/frontend/src/app/shell/pages/internal/profile-menu.component.html @@ -8,7 +8,7 @@
- +
{{ 'profile.userEmail' | sqxTranslate }}
diff --git a/frontend/src/app/theme/_common.scss b/frontend/src/app/theme/_common.scss index 74b6c6727..ef12bc012 100644 --- a/frontend/src/app/theme/_common.scss +++ b/frontend/src/app/theme/_common.scss @@ -17,10 +17,6 @@ body { } } -* { - @include scrollbars(8px, darken($color-border, 15%), transparent); -} - hr { border-color: $color-border; }