From b15fe00f7409b27573e162192530bc73e3f918b1 Mon Sep 17 00:00:00 2001 From: Kim <1877318+kimsible@users.noreply.github.com> Date: Tue, 28 Apr 2020 14:53:43 +0200 Subject: Add maximized mode to markdown-textarea + CSS improvements (#2660) * Add arrows-angle-contract/expand bootstrap icons * Add grey textarea-background-color * Add maximized support to markdown-textarea + improve column display * Refactor CSS + add ResizeObservable * Replace bootstrap icons with softies * Add ResizeObserver typing definition * Add focus on textarea + Fix Observables * Propage component changes on markdown plugins * Ignore ResizeObserver not implemented in typescript yet * Move observers from constructor to click event * Add scss and css variables * Replace textareaWidth with textareaMaxWidth to fix others textareas * Clean unused css rules * Fix ResizeObserver unknown by TypeScript compiler * Set max-width: 100% for small and mobile views * Fix textarea/preview height on maximized mode * Add common padding textarea/preview side-by-side * Hide scrollbar sub-menu on small-views * Add maximized mode for mobile views * Fix sass calculate syntax * Revert custom CSS variable for inputBorderRadius and inputBorderColor * Remove unsued methods * Fix missing implement method Co-authored-by: kimsible --- .../edit-custom-config.component.html | 12 +- .../edit-custom-config.component.scss | 12 - .../plugin-show-installed.component.html | 4 +- .../my-account-video-channel-edit.component.html | 8 +- .../my-account-video-channel-edit.component.scss | 8 - .../shared/forms/markdown-textarea.component.html | 16 +- .../shared/forms/markdown-textarea.component.scss | 244 +++++++++++++++++++-- .../shared/forms/markdown-textarea.component.ts | 37 +++- .../src/app/shared/images/global-icon.component.ts | 4 +- .../+video-edit/shared/video-edit.component.html | 2 +- .../+video-edit/shared/video-edit.component.scss | 14 +- .../src/assets/images/global/exit-fullscreen.svg | 16 ++ client/src/assets/images/global/fullscreen.svg | 17 ++ client/src/sass/application.scss | 18 ++ client/src/sass/include/_variables.scss | 4 + 15 files changed, 338 insertions(+), 78 deletions(-) create mode 100644 client/src/assets/images/global/exit-fullscreen.svg create mode 100644 client/src/assets/images/global/fullscreen.svg (limited to 'client') diff --git a/client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.html b/client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.html index b925d3d02..5703d5a2e 100644 --- a/client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.html +++ b/client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.html @@ -37,7 +37,7 @@
{{ formErrors.instance.description }}
@@ -120,7 +120,7 @@
{{ formErrors.instance.terms }}
@@ -129,7 +129,7 @@
{{ formErrors.instance.codeOfConduct }}
@@ -140,7 +140,7 @@
Who moderates the instance? What is the policy regarding NSFW videos? Political videos? etc
{{ formErrors.instance.moderationInformation }}
@@ -161,7 +161,7 @@
A single person? A non-profit? A company?
@@ -216,7 +216,7 @@
i.e. 2vCore 2GB RAM, a direct the link to the server you rent, etc.
diff --git a/client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.scss b/client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.scss index d8bc30d55..9ee960ad6 100644 --- a/client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.scss +++ b/client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.scss @@ -68,18 +68,6 @@ textarea { pointer-events: none; } -my-markdown-textarea ::ng-deep { - .root { - @media screen and (max-width: 1400px) { - flex-direction: column !important; - } - - textarea { - max-width: 100%; - } - } -} - .form-group-right { padding-top: 2px; } diff --git a/client/src/app/+admin/plugins/plugin-show-installed/plugin-show-installed.component.html b/client/src/app/+admin/plugins/plugin-show-installed/plugin-show-installed.component.html index bf135ecbd..f3fc429ff 100644 --- a/client/src/app/+admin/plugins/plugin-show-installed/plugin-show-installed.component.html +++ b/client/src/app/+admin/plugins/plugin-show-installed/plugin-show-installed.component.html @@ -19,13 +19,13 @@ diff --git a/client/src/app/+my-account/my-account-video-channels/my-account-video-channel-edit.component.html b/client/src/app/+my-account/my-account-video-channels/my-account-video-channel-edit.component.html index 59ac5097b..048d143cd 100644 --- a/client/src/app/+my-account/my-account-video-channels/my-account-video-channel-edit.component.html +++ b/client/src/app/+my-account/my-account-video-channels/my-account-video-channel-edit.component.html @@ -59,7 +59,7 @@ {{ formErrors['display-name'] }}
- +
-