[REF] web_editor: BS4, review media dialog layout
This commit is contained in:
qsm-odoo
@@ -613,7 +613,7 @@ var ImageWidget = MediaWidget.extend({
|
||||
*/
|
||||
_onSearchInput: function (ev) {
|
||||
var $input = $(ev.currentTarget);
|
||||
var $button = $input.next('button');
|
||||
var $button = $input.next('.input-group-append').children();
|
||||
var emptyValue = ($input.val() === '');
|
||||
$button.toggleClass('btn-secondary', emptyValue).toggleClass('btn-primary', !emptyValue)
|
||||
.prop('disabled', emptyValue);
|
||||
@@ -1104,7 +1104,7 @@ var MediaDialog = Dialog.extend({
|
||||
events : _.extend({}, Dialog.prototype.events, {
|
||||
'input input#icon-search': '_onSearchInput',
|
||||
'shown.bs.tab a[data-toggle="tab"]': '_onTabChange',
|
||||
'click .pager > li > a:not(.disabled)': '_onPagerClick',
|
||||
'click .previous:not(.disabled), .next:not(.disabled)': '_onPagerClick',
|
||||
}),
|
||||
custom_events: _.extend({}, Dialog.prototype.custom_events || {}, {
|
||||
save_request: '_onSaveRequest',
|
||||
@@ -1274,9 +1274,9 @@ var MediaDialog = Dialog.extend({
|
||||
_updateControlPanel: function () {
|
||||
var cpConfig = this.active.getControlPanelConfig();
|
||||
this.$('li.search').toggleClass('d-none', !cpConfig.searchEnabled);
|
||||
this.$('li.previous, li.next').toggleClass('d-none', !cpConfig.pagerEnabled);
|
||||
this.$('li.previous > a').toggleClass("disabled", !cpConfig.pagerLeftEnabled);
|
||||
this.$('li.next > a').toggleClass("disabled", !cpConfig.pagerRightEnabled);
|
||||
this.$('.previous, .next').toggleClass('d-none', !cpConfig.pagerEnabled);
|
||||
this.$('.previous').toggleClass("disabled", !cpConfig.pagerLeftEnabled);
|
||||
this.$('.next').toggleClass("disabled", !cpConfig.pagerRightEnabled);
|
||||
},
|
||||
|
||||
//--------------------------------------------------------------------------
|
||||
@@ -1287,7 +1287,7 @@ var MediaDialog = Dialog.extend({
|
||||
* @private
|
||||
*/
|
||||
_onPagerClick: function (ev) {
|
||||
this.active.goToPage(this.active.page + ($(ev.currentTarget).parent().hasClass('previous') ? -1 : 1));
|
||||
this.active.goToPage(this.active.page + ($(ev.currentTarget).hasClass('previous') ? -1 : 1));
|
||||
this._updateControlPanel();
|
||||
},
|
||||
/**
|
||||
|
||||
@@ -1332,7 +1332,7 @@ body.editor_enable {
|
||||
body .modal {
|
||||
// SELECT MEDIA
|
||||
.o_select_media_dialog {
|
||||
width: 80%;
|
||||
max-width: 80%;
|
||||
|
||||
.modal-body {
|
||||
.nav-tabs .active > a[href="#editor-media-icon"] {
|
||||
@@ -1340,9 +1340,6 @@ body .modal {
|
||||
}
|
||||
|
||||
li.search {
|
||||
ul.pager li:last-child{
|
||||
margin-left: 2px;
|
||||
}
|
||||
.form-group {
|
||||
position: relative;
|
||||
margin: 0 10px 0 0;
|
||||
@@ -1359,6 +1356,8 @@ body .modal {
|
||||
.card {
|
||||
border-color: gray('200');
|
||||
border-top-width: 0;
|
||||
border-top-left-radius: 0;
|
||||
border-top-right-radius: 0;
|
||||
}
|
||||
|
||||
.o_existing_attachment_cell {
|
||||
|
||||
@@ -47,30 +47,26 @@
|
||||
<!-- Media Dialog (allows to choose an img/pictogram/video) -->
|
||||
<div t-name="web_editor.dialog.media">
|
||||
<ul class="nav nav-tabs" role="tablist">
|
||||
<li class="nav-item"><a role="tab" href="#editor-media-image" aria-controls="editor-media-image" data-toggle="tab" t-attf-class="nav-link active#{widget.noImages ? ' d-none' : ''}">Image</a></li>
|
||||
<li class="nav-item"><a role="tab" href="#editor-media-image" aria-controls="editor-media-image" data-toggle="tab" t-attf-class="nav-link#{widget.noImages ? ' d-none' : ''}">Image</a></li>
|
||||
<li class="nav-item"><a role="tab" href="#editor-media-document" aria-controls="editor-media-document" data-toggle="tab" t-attf-class="nav-link#{widget.noDocuments ? ' d-none' : ''}">Document</a></li>
|
||||
<li class="nav-item"><a role="tab" href="#editor-media-icon" aria-controls="editor-media-icon" data-toggle="tab" t-attf-class="nav-link#{widget.noIcons ? ' d-none' : ''}">Pictogram</a></li>
|
||||
<li class="nav-item"><a role="tab" href="#editor-media-video" aria-controls="editor-media-video" data-toggle="tab" t-attf-class="nav-link#{widget.noVideos ? ' d-none' : ''}">Video</a></li>
|
||||
<li class="nav-item search float-right">
|
||||
<ul class="pager mb0 mt0">
|
||||
<li class="previous">
|
||||
<a role="button" class="btn btn-secondary disabled" href="#"><i class="fa fa-angle-left"/> Previous</a>
|
||||
</li>
|
||||
<li class="next">
|
||||
<a role="button" class="btn btn-secondary disabled" href="#">Next <i class="fa fa-angle-right"/></a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item search float-right">
|
||||
<li class="nav-item ml-auto search">
|
||||
<div class="form-group">
|
||||
<input class="form-control" id="icon-search" type="search"/>
|
||||
<span class="fa fa-search" title="Search" role="img" aria-label="Search"/>
|
||||
</div>
|
||||
</li>
|
||||
<li class="nav-item search">
|
||||
<div class="btn-group">
|
||||
<a role="button" class="btn btn-secondary disabled previous" href="#"><i class="fa fa-angle-left"/> Previous</a>
|
||||
<a role="button" class="btn btn-secondary disabled next" href="#">Next <i class="fa fa-angle-right"/></a>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
<!-- Tab panes -->
|
||||
<div class="tab-content">
|
||||
<div role="tabpanel" class="tab-pane fade in active" id="editor-media-image"/>
|
||||
<div role="tabpanel" class="tab-pane fade" id="editor-media-image"/>
|
||||
<div role="tabpanel" class="tab-pane fade" id="editor-media-document"/>
|
||||
<div role="tabpanel" class="tab-pane fade" id="editor-media-icon"/>
|
||||
<div role="tabpanel" class="tab-pane fade" id="editor-media-video"/>
|
||||
@@ -90,26 +86,26 @@
|
||||
<input t-if="widget.options.res_model" type="hidden" name="res_model" t-att-value="widget.options.res_model"/>
|
||||
<div class="card">
|
||||
<div class="card-body">
|
||||
<div class="form-group float-left">
|
||||
<div class="form-inline">
|
||||
<input type="file" class="d-none" name="upload" t-att-accept="widget.accept" multiple="multiple"/>
|
||||
<input type="hidden" name="disable_optimization" value=""/>
|
||||
<div class="btn-group">
|
||||
<button class="btn btn-primary o_upload_image_button" type="button">Upload an image</button>
|
||||
<button class="btn btn-primary dropdown-toggle" data-toggle="dropdown" type="button">
|
||||
<button class="btn btn-primary dropdown-toggle dropdown-toggle-split" data-toggle="dropdown" type="button">
|
||||
<span class="sr-only">Alternate Upload</span>
|
||||
</button>
|
||||
<div class="dropdown-menu" role="menu">
|
||||
<a role="menuitem" class="dropdown-item o_upload_image_button_no_optimization">Upload image without optimization</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<span class="text-muted">— or —</span>
|
||||
<label for="imageurl">Add an image URL</label>
|
||||
<div class="form-group btn-group">
|
||||
<input type="text" class="form-control url float-left" id="imageurl" name="url" placeholder="https://www.odoo.com/logo.png" style="width: 250px;"/>
|
||||
<button type="button" class="btn btn-secondary o_upload_image_url_button" disabled="disabled">Add</button>
|
||||
<span class="text-muted">— or —</span>
|
||||
<label for="imageurl">Add an image URL</label>
|
||||
<div class="input-group">
|
||||
<input type="text" class="form-control url" id="imageurl" name="url" placeholder="https://www.odoo.com/logo.png" style="width: 250px;"/>
|
||||
<div class="input-group-append">
|
||||
<button type="button" class="btn btn-secondary o_upload_image_url_button" disabled="disabled">Add</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user