diff options
Diffstat (limited to 'addons/web_editor/static/src')
4 files changed, 30 insertions, 9 deletions
diff --git a/addons/web_editor/static/src/js/editor/snippets.options.js b/addons/web_editor/static/src/js/editor/snippets.options.js index 23fe6ff1bfd..5b7aba79184 100644 --- a/addons/web_editor/static/src/js/editor/snippets.options.js +++ b/addons/web_editor/static/src/js/editor/snippets.options.js @@ -1680,7 +1680,6 @@ const SelectPagerUserValueWidget = SelectUserValueWidget.extend({ this.pageNum = document.createElement('span'); this.currentPage = 0; - this._updatePageNum(); const next = document.createElement('i'); next.classList.add('o_we_pager_next', 'fa', 'fa-chevron-right'); @@ -1691,9 +1690,16 @@ const SelectPagerUserValueWidget = SelectUserValueWidget.extend({ pagerControls.appendChild(this.pageNum); pagerControls.appendChild(next); + this.pageName = document.createElement('b'); + const pagerHeader = document.createElement('div'); + pagerHeader.classList.add('o_we_pager_header'); + pagerHeader.appendChild(this.pageName); + pagerHeader.appendChild(pagerControls); + await _super(...arguments); this.menuEl.classList.add('o_we_has_pager'); - $(this.menuEl).prepend(pagerControls); + $(this.menuEl).prepend(pagerHeader); + this._updatePage(); }, //-------------------------------------------------------------------------- @@ -1705,9 +1711,11 @@ const SelectPagerUserValueWidget = SelectUserValueWidget.extend({ * * @private */ - _updatePageNum() { + _updatePage() { this.pages.forEach((page, i) => page.classList.toggle('active', i === this.currentPage)); this.pageNum.textContent = `${this.currentPage + 1}/${this.numPages}`; + const activePage = this.pages.find((page, i) => i === this.currentPage); + this.pageName.textContent = activePage.getAttribute('string'); }, //-------------------------------------------------------------------------- @@ -1724,7 +1732,7 @@ const SelectPagerUserValueWidget = SelectUserValueWidget.extend({ ev.stopPropagation(); const delta = ev.target.matches('.o_we_pager_next') ? 1 : -1; this.currentPage = (this.currentPage + this.numPages + delta) % this.numPages; - this._updatePageNum(); + this._updatePage(); }, /** * @override @@ -1735,7 +1743,7 @@ const SelectPagerUserValueWidget = SelectUserValueWidget.extend({ const currentPage = this.pages.indexOf(activeButton.el.closest('we-select-page')); if (currentPage !== -1) { this.currentPage = currentPage; - this._updatePageNum(); + this._updatePage(); } } return this._super(...arguments); diff --git a/addons/web_editor/static/src/scss/web_editor.frontend.scss b/addons/web_editor/static/src/scss/web_editor.frontend.scss index 37ce7b974eb..39c96304361 100644 --- a/addons/web_editor/static/src/scss/web_editor.frontend.scss +++ b/addons/web_editor/static/src/scss/web_editor.frontend.scss @@ -60,6 +60,11 @@ } } } +@include media-breakpoint-down(sm) { + .o_we_shape { + display: none; + } +} .o_we_flip_x { transform: scaleX(-1); } diff --git a/addons/web_editor/static/src/scss/web_editor.variables.scss b/addons/web_editor/static/src/scss/web_editor.variables.scss index d777752fe06..321adeb7024 100644 --- a/addons/web_editor/static/src/scss/web_editor.variables.scss +++ b/addons/web_editor/static/src/scss/web_editor.variables.scss @@ -608,7 +608,7 @@ $o-bg-shapes: ('web_editor': ( 'Airy/13': ('position': bottom, 'size': 100% auto, 'colors': (1, 4), 'repeat-y': false), 'Airy/14': ('position': bottom, 'size': 100% auto, 'colors': (1, 4), 'repeat-y': false), 'Blobs/01': ('position': top, 'size': 100% auto, 'colors': (2), 'repeat-y': false), - 'Blobs/02': ('position': center, 'size': 100% 100%, 'colors': (1, 2), 'repeat-y': false), + 'Blobs/02': ('position': bottom, 'size': 100% auto, 'colors': (1, 2), 'repeat-y': false), 'Blobs/03': ('position': top, 'size': 100% auto, 'colors': (2), 'repeat-y': false), 'Blobs/04': ('position': center, 'size': 100% auto, 'colors': (5), 'repeat-y': false), 'Blobs/05': ('position': bottom, 'size': 100% auto, 'colors': (1), 'repeat-y': false), @@ -645,7 +645,7 @@ $o-bg-shapes: ('web_editor': ( 'Origins/08': ('position': bottom, 'size': 100% auto, 'colors': (3), 'repeat-y': false), 'Origins/09': ('position': top, 'size': 100% auto, 'colors': (1, 5), 'repeat-y': false), 'Origins/10': ('position': bottom, 'size': 100% auto, 'colors': (2, 5), 'repeat-y': false), - 'Origins/11': ('position': bottom, 'size': 100% auto, 'colors': (3, 5), 'repeat-y': false), + 'Origins/11': ('position': top, 'size': 100% auto, 'colors': (3, 5), 'repeat-y': false), 'Origins/12': ('position': top, 'size': 100% auto, 'colors': (3, 5), 'repeat-y': false), 'Origins/13': ('position': center, 'size': 100% auto, 'colors': (3, 5), 'repeat-y': false), 'Origins/14': ('position': bottom, 'size': 100% auto, 'colors': (4), 'repeat-y': false), diff --git a/addons/web_editor/static/src/scss/wysiwyg_snippets.scss b/addons/web_editor/static/src/scss/wysiwyg_snippets.scss index e50a728c93b..404646b0584 100644 --- a/addons/web_editor/static/src/scss/wysiwyg_snippets.scss +++ b/addons/web_editor/static/src/scss/wysiwyg_snippets.scss @@ -682,10 +682,18 @@ body.editor_enable.editor_has_snippets { } } } + .o_we_pager_header { + display: flex; + align-items: center; + justify-content: space-between; + + & > b { + padding: $o-we-sidebar-content-field-label-spacing; + } + } .o_we_pager_controls { display: flex; align-items: center; - padding: $o-we-sidebar-content-field-label-spacing; } .o_we_pager_next, .o_we_pager_prev { padding: $o-we-sidebar-content-field-label-spacing; @@ -1717,9 +1725,9 @@ we-select.o_we_shape_menu { width: 100%; } .o_we_shape_btn_content { + @extend %o-preview-alpha-background; width: 100%; height: 75px; - background-color: lightgray; // Must be a color which can make all shapes appear } } } |