diff --git a/resources/assets/js/components/markdown-editor.js b/resources/assets/js/components/markdown-editor.js index b8e2bc040..96cc1e6d1 100644 --- a/resources/assets/js/components/markdown-editor.js +++ b/resources/assets/js/components/markdown-editor.js @@ -71,6 +71,19 @@ class MarkdownEditor { if (action === 'insertDrawing') this.actionStartDrawing(); }); + // Mobile section toggling + this.elem.addEventListener('click', event => { + const toolbarLabel = event.target.closest('.editor-toolbar-label'); + if (!toolbarLabel) return; + + const currentActiveSections = this.elem.querySelectorAll('.markdown-editor-wrap'); + for (let activeElem of currentActiveSections) { + activeElem.classList.remove('active'); + } + + toolbarLabel.closest('.markdown-editor-wrap').classList.add('active'); + }); + window.$events.listen('editor-markdown-update', value => { this.cm.setValue(value); this.updateAndRender(); diff --git a/resources/assets/sass/_blocks.scss b/resources/assets/sass/_blocks.scss index 278917cd5..efdefc016 100644 --- a/resources/assets/sass/_blocks.scss +++ b/resources/assets/sass/_blocks.scss @@ -189,11 +189,21 @@ width: 100%; } } +@include smaller-than($xxl) { + .content-wrap.card { + padding: $-l $-xl; + } +} @include smaller-than($m) { .content-wrap.card { padding: $-m $-l; } } +@include smaller-than($s) { + .content-wrap.card { + padding: $-m $-s; + } +} /** * Tags diff --git a/resources/assets/sass/_forms.scss b/resources/assets/sass/_forms.scss index 9e4ef702d..f40c92a19 100644 --- a/resources/assets/sass/_forms.scss +++ b/resources/assets/sass/_forms.scss @@ -63,6 +63,34 @@ } } +@include smaller-than($m) { + #markdown-editor { + flex-direction: column; + } + #markdown-editor .markdown-editor-wrap { + width: 100%; + max-width: 100%; + } + #markdown-editor .editor-toolbar { + padding: 0; + } + #markdown-editor .editor-toolbar > * { + padding: $-xs $-s; + } + .editor-toolbar-label { + float: none !important; + border-bottom: 1px solid #DDD; + display: block; + } + .markdown-editor-wrap:not(.active) .editor-toolbar + div, .markdown-editor-wrap:not(.active) .editor-toolbar .buttons { + display: none; + } + #markdown-editor .markdown-editor-wrap:not(.active) { + flex-grow: 0; + flex: none; + } +} + .markdown-display { padding: 0 $-m 0; margin-left: -1px; diff --git a/resources/assets/sass/_header.scss b/resources/assets/sass/_header.scss index 00b791803..7fd6d7ae9 100644 --- a/resources/assets/sass/_header.scss +++ b/resources/assets/sass/_header.scss @@ -145,12 +145,13 @@ header .search-box { padding: 0 $-xs; position: absolute; right: $-m; - top: 8px; + top: 13px; line-height: 1; cursor: pointer; user-select: none; svg { margin: 0; + bottom: -2px; } } @@ -302,6 +303,17 @@ header .search-box { } } +@include smaller-than($m) { + .breadcrumb-listing-dropdown { + position: fixed; + right: auto; + left: $-m; + } + .breadcrumb-listing-dropdown .breadcrumb-listing-entity-list { + max-height: 240px; + } +} + .faded { a, button, span, span > div { color: #666; diff --git a/resources/assets/sass/_layout.scss b/resources/assets/sass/_layout.scss index 30bbafc10..137048935 100644 --- a/resources/assets/sass/_layout.scss +++ b/resources/assets/sass/_layout.scss @@ -53,6 +53,9 @@ grid-row-gap: 0; grid-column-gap: 0; } + &.no-row-gap { + grid-row-gap: 0; + } } @include smaller-than($m) { @@ -216,9 +219,6 @@ body.flexbox { grid-template-columns: 1fr 3fr; grid-template-rows: max-content min-content; padding-right: $-l; - .content-wrap.card { - padding: $-l $-xl; - } } } @include larger-than($xxl) { diff --git a/resources/assets/sass/_pages.scss b/resources/assets/sass/_pages.scss index cda310caf..969682c3b 100755 --- a/resources/assets/sass/_pages.scss +++ b/resources/assets/sass/_pages.scss @@ -8,6 +8,7 @@ .edit-area { flex: 1; flex-direction: column; + z-index: 1; } .mce-tinymce { diff --git a/resources/views/comments/comment.blade.php b/resources/views/comments/comment.blade.php index 2993425bb..b93e79ac8 100644 --- a/resources/views/comments/comment.blade.php +++ b/resources/views/comments/comment.blade.php @@ -1,6 +1,6 @@
-
+
#{{$comment->local_id}}    diff --git a/resources/views/common/header.blade.php b/resources/views/common/header.blade.php index 2b83edc71..c9c301572 100644 --- a/resources/views/common/header.blade.php +++ b/resources/views/common/header.blade.php @@ -55,13 +55,13 @@
diff --git a/resources/views/common/home.blade.php b/resources/views/common/home.blade.php index 590825faf..53da79fd2 100644 --- a/resources/views/common/home.blade.php +++ b/resources/views/common/home.blade.php @@ -8,7 +8,7 @@
-
+
@if(count($draftPages) > 0)
diff --git a/resources/views/pages/form.blade.php b/resources/views/pages/form.blade.php index 29096fc8e..7a530b0a9 100644 --- a/resources/views/pages/form.blade.php +++ b/resources/views/pages/form.blade.php @@ -79,9 +79,9 @@ @if(setting('app-editor') === 'markdown')
-
+
- {{ trans('entities.pages_md_editor') }} + {{ trans('entities.pages_md_editor') }}
@if(config('services.drawio')) @@ -102,7 +102,7 @@
-
{{ trans('entities.pages_md_preview') }}
+
{{ trans('entities.pages_md_preview') }}
diff --git a/resources/views/settings/index.blade.php b/resources/views/settings/index.blade.php index cf043544e..582bb078e 100644 --- a/resources/views/settings/index.blade.php +++ b/resources/views/settings/index.blade.php @@ -3,7 +3,7 @@ @section('body')
-
+
@include('settings.navbar', ['selected' => 'settings'])
diff --git a/resources/views/settings/maintenance.blade.php b/resources/views/settings/maintenance.blade.php index 50f30c54b..c3ca8c96f 100644 --- a/resources/views/settings/maintenance.blade.php +++ b/resources/views/settings/maintenance.blade.php @@ -3,7 +3,7 @@ @section('body')
-
+
@include('settings.navbar', ['selected' => 'maintenance'])
diff --git a/resources/views/users/profile.blade.php b/resources/views/users/profile.blade.php index bfa749ed9..e2689790f 100644 --- a/resources/views/users/profile.blade.php +++ b/resources/views/users/profile.blade.php @@ -29,7 +29,7 @@
{{ trans('entities.profile_created_content') }}
-