pengyuthon/odoo_source
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[FIX] website: snippet resizing; Users don't understand when they can drag arrows to resize col-md-XX. They try, it does not work, so they think the feature does not work. So, horizontal arrow on col-md-XX snippets should use an icon according to what you can do

Browse Source 
bzr revid: chm@openerp.com-20140217100418-iwdrv36a4u2inasn
This commit is contained in:
Christophe Matthieu
2014-02-17 11:04:18 +01:00
parent 0227d6a056
commit 7d6dd7070d
3 changed files with 83 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files
addons/website/static/src/css/snippets.css
+23 -3
View File
@@ -278,7 +278,8 @@
cursor: w-resize;
}
.oe_overlay .oe_handle.e:before {
content: "\F061";
content: "\f0d9-\f0da";
line-height: 16px;
}
.oe_overlay .oe_handle.s {
top: auto;
@@ -327,7 +328,8 @@
cursor: e-resize;
}
.oe_overlay .oe_handle.w:before {
content: "\F060";
content: "\f0d9-\f0da";
line-height: 16px;
}
.oe_overlay .oe_handle.n {
left: 2px;
@@ -336,7 +338,7 @@
cursor: s-resize;
}
.oe_overlay .oe_handle.n:before {
content: "\F062";
content: "\f062";
}
.oe_overlay .icon.btn {
display: inline-block;
@@ -362,6 +364,24 @@
.oe_overlay .oe_overlay_options .dropdown-menu select, .oe_overlay .oe_overlay_options .dropdown-menu input {
display: block;
}
.oe_overlay.block-w-left .w:before {
content: "\F061" !important;
}
.oe_overlay.block-w-right .w:before {
content: "\F060" !important;
}
.oe_overlay.block-w-left.block-w-right .w {
display: none !important;
}
.oe_overlay.block-e-left .e:before {
content: "\F061" !important;
}
.oe_overlay.block-e-right .e:before {
content: "\F060" !important;
}
.oe_overlay.block-e-left.block-e-right .e {
display: none !important;
}
.s-resize-important, .s-resize-important * {
cursor: s-resize !important;
addons/website/static/src/css/snippets.sass
+24 -3
View File
@@ -147,6 +147,7 @@
.resize_editor_busy
background-color: rgba(0,0,0,0.3)
.oe_overlay
display: none
position: absolute
@@ -201,7 +202,8 @@
right: -6px
cursor: w-resize
&:before
content: "\F061"
content: "\f0d9-\f0da"
line-height: 16px
&.s
top: auto
left: 2px
@@ -240,14 +242,15 @@
left: -6px
cursor: e-resize
&:before
content: "\F060"
content: "\f0d9-\f0da"
line-height: 16px
&.n
left: 2px
width: 100%
top: -6px
cursor: s-resize
&:before
content: "\F062"
content: "\f062"
.icon.btn
display: inline-block
@@ -269,6 +272,24 @@
.dropdown-menu select,.dropdown-menu input
display: block
&.block-w-left
.w:before
content: "\F061" !important
&.block-w-right
.w:before
content: "\F060" !important
&.block-w-left.block-w-right .w
display: none !important
&.block-e-left
.e:before
content: "\F061" !important
&.block-e-right
.e:before
content: "\F060" !important
&.block-e-left.block-e-right .e
display: none !important
.s-resize-important, .s-resize-important *
cursor: s-resize !important
.n-resize-important, .n-resize-important *
addons/website/static/src/js/website.snippets.editor.js
+36 -19
View File
@@ -1176,9 +1176,26 @@
this.$overlay.find('.oe_snippet_remove').toggleClass("hidden",
!this.$target.siblings().length && this.$target.parents("[data-snippet-id]:first").find("[data-snippet-id='colmd']").length > 1);
},
change_cursor: function () {
var _class = this.$target.attr("class");
var col = _class.match(/col-md-([0-9-]+)/i);
col = col ? +col[1] : 0;
var offset = _class.match(/col-md-offset-([0-9-]+)/i);
offset = offset ? +offset[1] : 0;
var overlay_class = this.$overlay.attr("class").replace(/(^|\s+)block-[^\s]*/gi, '');
if (col+offset >= 12) overlay_class+= " block-e-right";
if (col === 1) overlay_class+= " block-w-right block-e-left";
if (offset === 0) overlay_class+= " block-w-left";
this.$overlay.attr("class", overlay_class);
},
onFocus : function () {
this._super();
this.hide_remove_button();
this.change_cursor();
},
on_clone: function () {
var $clone = this.$target.clone(false);
@@ -1206,27 +1223,27 @@
return false;
},
on_resize: function (compass, beginClass, current) {
if (compass !== 'w')
return;
if (compass === 'w') {
// don't change the right border position when we change the offset (replace col size)
var beginCol = Number(beginClass.match(/col-md-([0-9]+)|$/)[1] || 0);
var beginOffset = Number(beginClass.match(/col-md-offset-([0-9-]+)|$/)[1] || beginClass.match(/col-lg-offset-([0-9-]+)|$/)[1] || 0);
var offset = Number(this.grid.w[0][current].match(/col-md-offset-([0-9-]+)|$/)[1] || 0);
if (offset < 0) {
offset = 0;
}
var colSize = beginCol - (offset - beginOffset);
if (colSize <= 0) {
colSize = 1;
offset = beginOffset + beginCol - 1;
}
this.$target.attr("class",this.$target.attr("class").replace(/\s*(col-lg-offset-|col-md-offset-|col-md-)([0-9-]+)/g, ''));
// don't change the right border position when we change the offset (replace col size)
var beginCol = Number(beginClass.match(/col-md-([0-9]+)|$/)[1] || 0);
var beginOffset = Number(beginClass.match(/col-md-offset-([0-9-]+)|$/)[1] || beginClass.match(/col-lg-offset-([0-9-]+)|$/)[1] || 0);
var offset = Number(this.grid.w[0][current].match(/col-md-offset-([0-9-]+)|$/)[1] || 0);
if (offset < 0) {
offset = 0;
}
var colSize = beginCol - (offset - beginOffset);
if (colSize <= 0) {
colSize = 1;
offset = beginOffset + beginCol - 1;
}
this.$target.attr("class",this.$target.attr("class").replace(/\s*(col-lg-offset-|col-md-offset-|col-md-)([0-9-]+)/g, ''));
this.$target.addClass('col-md-' + (colSize > 12 ? 12 : colSize));
if (offset > 0) {
this.$target.addClass('col-md-offset-' + offset);
this.$target.addClass('col-md-' + (colSize > 12 ? 12 : colSize));
if (offset > 0) {
this.$target.addClass('col-md-offset-' + offset);
}
}
this.change_cursor();
},
});