odoo
/
odoo
2
0
Fork 0
Code Pull Requests Releases Activity

[FIX] website: snippet resizing: display top and bottom arrow in function of margin size 

bzr revid: chm@openerp.com-20140218101017-f827kued494rfu9g
This commit is contained in:
Christophe Matthieu 2014-02-18 11:10:17 +01:00
parent 7d6dd7070d
commit c11e6f6249
3 changed files with 102 additions and 76 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

57
addons/website/static/src/css/snippets.css
View File

@ -270,6 +270,10 @@
-moz-box-shadow: 0 0 5px 3px rgba(255, 255, 255, 0.7);
box-shadow: 0 0 5px 3px rgba(255, 255, 255, 0.7);
}
.oe_overlay .oe_handle.e:before, .oe_overlay .oe_handle.w:before {
content: "\f0d9-\f0da";
line-height: 16px;
}
.oe_overlay .oe_handle.e {
left: auto;
top: 2px;
@ -277,9 +281,17 @@
right: -6px;
cursor: w-resize;
}
.oe_overlay .oe_handle.e:before {
content: "\f0d9-\f0da";
line-height: 16px;
.oe_overlay .oe_handle.w {
top: 2px;
height: 100%;
left: -6px;
cursor: e-resize;
}
.oe_overlay .oe_handle.s:before, .oe_overlay .oe_handle.n:before {
z-index: 0;
content: "\f07d";
text-align: center;
padding: 1px;
}
.oe_overlay .oe_handle.s {
top: auto;
@ -288,9 +300,11 @@
bottom: -6px;
cursor: n-resize;
}
.oe_overlay .oe_handle.s:before {
z-index: 0;
content: "\F063";
.oe_overlay .oe_handle.n {
left: 2px;
width: 100%;
top: -6px;
cursor: s-resize;
}
.oe_overlay .oe_handle.size {
top: auto;
@ -321,25 +335,6 @@
position: relative;
top: 8px;
}
.oe_overlay .oe_handle.w {
top: 2px;
height: 100%;
left: -6px;
cursor: e-resize;
}
.oe_overlay .oe_handle.w:before {
content: "\f0d9-\f0da";
line-height: 16px;
}
.oe_overlay .oe_handle.n {
left: 2px;
width: 100%;
top: -6px;
cursor: s-resize;
}
.oe_overlay .oe_handle.n:before {
content: "\f062";
}
.oe_overlay .icon.btn {
display: inline-block;
}
@ -382,6 +377,18 @@
.oe_overlay.block-e-left.block-e-right .e {
display: none !important;
}
.oe_overlay.block-s-top .s:before {
content: "\F063" !important;
}
.oe_overlay.block-s-bottom .s:before {
content: "\f062" !important;
}
.oe_overlay.block-n-top .n:before {
content: "\F063" !important;
}
.oe_overlay.block-n-bottom .n:before {
content: "\f062" !important;
}
.s-resize-important, .s-resize-important * {
cursor: s-resize !important;

68
addons/website/static/src/css/snippets.sass
View File

@ -195,24 +195,38 @@
background: rgba(0, 0, 0, .5)
color: #fff
+box-shadow(0 0 5px 3px rgba(255,255,255,.7))
&.e, &.w
&:before
content: "\f0d9-\f0da"
line-height: 16px
&.e
left: auto
top: 2px
height: 100%
right: -6px
cursor: w-resize
&.w
top: 2px
height: 100%
left: -6px
cursor: e-resize
&.s, &.n
&:before
content: "\f0d9-\f0da"
line-height: 16px
z-index: 0
content: "\f07d"
text-align: center
padding: 1px
&.s
top: auto
left: 2px
width: 100%
bottom: -6px
cursor: n-resize
&:before
z-index: 0
content: "\F063"
&.n
left: 2px
width: 100%
top: -6px
cursor: s-resize
&.size
top: auto
left: 2px
@ -236,21 +250,6 @@
border-color: rgba(0, 0, 0, 0.5)
position: relative
top: 8px
&.w
top: 2px
height: 100%
left: -6px
cursor: e-resize
&:before
content: "\f0d9-\f0da"
line-height: 16px
&.n
left: 2px
width: 100%
top: -6px
cursor: s-resize
&:before
content: "\f062"
.icon.btn
display: inline-block
@ -272,23 +271,28 @@
.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 .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 .e:before
content: "\F061" !important
&.block-e-right .e:before
content: "\F060" !important
&.block-e-left.block-e-right .e
display: none !important
&.block-s-top .s:before
content: "\F063" !important
&.block-s-bottom .s:before
content: "\f062" !important
&.block-n-top .n:before
content: "\F063" !important
&.block-n-bottom .n:before
content: "\f062" !important
.s-resize-important, .s-resize-important *
cursor: s-resize !important

53
addons/website/static/src/js/website.snippets.editor.js
View File

@ -1120,6 +1120,38 @@
return this.grid;
},
onFocus : function () {
this._super();
this.change_cursor();
},
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";
var mb = _class.match(/mb([0-9-]+)/i);
mb = mb ? +mb[1] : 0;
if (mb >= 128) overlay_class+= " block-s-bottom";
else if (!mb) overlay_class+= " block-s-top";
var mt = _class.match(/mt([0-9-]+)/i);
mt = mt ? +mt[1] : 0;
if (mt >= 128) overlay_class+= " block-n-top";
else if (!mt) overlay_class+= " block-n-bottom";
this.$overlay.attr("class", overlay_class);
},
/* on_resize
* called when the box is resizing and the class change, before the cover_target
* @compass: resize direction : 'n', 's', 'e', 'w'
@ -1127,7 +1159,7 @@
* @current: curent increment in this.grid
*/
on_resize: function (compass, beginClass, current) {
this.change_cursor();
}
});
@ -1176,26 +1208,9 @@
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);
@ -1243,7 +1258,7 @@
this.$target.addClass('col-md-offset-' + offset);
}
}
this.change_cursor();
this._super(compass, beginClass, current);
},
});