From 99feb93de9d5ceeaeb7e8daca4ea8934308b55a8 Mon Sep 17 00:00:00 2001 From: Fabien Meghazi Date: Thu, 31 May 2012 17:05:50 +0200 Subject: [PATCH] [ADD] form + editable/readonly hidden classes bzr revid: fme@openerp.com-20120531150550-zpl67q0lcy0omlmf --- addons/web/static/src/css/base.css | 47 +++++++++++++++++---------- addons/web/static/src/css/base.sass | 18 +++++++--- addons/web/static/src/js/view_form.js | 2 ++ 3 files changed, 46 insertions(+), 21 deletions(-) diff --git a/addons/web/static/src/css/base.css b/addons/web/static/src/css/base.css index ee32ea2159f..da4e056e411 100644 --- a/addons/web/static/src/css/base.css +++ b/addons/web/static/src/css/base.css @@ -1465,7 +1465,7 @@ .openerp .oe_form_button_save_dirty:hover { background: #ed6f6a; } -.openerp .oe_form_topbar { +.openerp header { position: relative; border-bottom: 1px solid #cacaca; background-color: #fcfcfc; @@ -1478,7 +1478,7 @@ padding: 0 8px; line-height: 30px; } -.openerp .oe_form_topbar button { +.openerp header button { font-size: 12px; height: 24px !important; line-height: 24px; @@ -1486,11 +1486,11 @@ padding: 0 10px; margin: 3px 4px 3px 0; } -.openerp .oe_form_topbar button span.i { +.openerp header button span.i { line-height: 20px; height: 24px; } -.openerp .oe_form_topbar ul { +.openerp header ul { height: 30px; padding: 0; margin: 0; @@ -1498,7 +1498,7 @@ border-left: 1px solid #cacaca; border-right: 1px solid #cacaca; } -.openerp .oe_form_topbar ul li { +.openerp header ul li { padding: 0; margin: 0; float: left; @@ -1507,40 +1507,40 @@ height: 30px; padding: 0 12px; } -.openerp .oe_form_topbar ul li:first-child { +.openerp header ul li:first-child { border-left: 1px solid #cacaca; } -.openerp .oe_form_topbar ul li a { +.openerp header ul li a { color: #4c4c4c; } -.openerp .oe_form_topbar ul li a:hover { +.openerp header ul li a:hover { color: black; } -.openerp .oe_form_topbar .oe_form_steps { +.openerp header .oe_form_steps { display: inline-block; position: absolute; right: 0; } -.openerp .oe_form_topbar .oe_form_steps img { +.openerp header .oe_form_steps img { margin: 0 8px; vertical-align: top; } -.openerp .oe_form_topbar .oe_form_steps li { +.openerp header .oe_form_steps li { border-right: none; padding: 0; } -.openerp .oe_form_topbar .oe_form_steps li:first-child { +.openerp header .oe_form_steps li:first-child { margin-left: 12px; border-left: none; } -.openerp .oe_form_topbar .oe_form_steps li:last-child { +.openerp header .oe_form_steps li:last-child { margin-right: 12px; } -.openerp .oe_form_topbar .oe_form_steps_active { +.openerp header .oe_form_steps_active { font-weight: bold; color: #b33630; } -.openerp .oe_form_topbar.oe_form_topbar_hifirst button:first-child, .openerp button.oe_form_button_hi { +.openerp header.oe_form_topbar_hifirst button:first-child, .openerp button.oe_form_button_hi { color: white; background: #dc5f59; background: -moz-linear-gradient(#dc5f59, #b33630); @@ -1550,7 +1550,7 @@ -webkit-box-shadow: none; -box-shadow: none; } -.openerp .oe_form_topbar.oe_form_topbar_hifirst button:first-child:hover, .openerp button.oe_form_button_hi:hover { +.openerp header.oe_form_topbar_hifirst button:first-child:hover, .openerp button.oe_form_button_hi:hover { background: #df6b66; background: -moz-linear-gradient(#df6b66, #bf3a33); background: -webkit-gradient(linear, left top, left bottom, from(#df6b66), to(#bf3a33)); @@ -1564,7 +1564,7 @@ padding: 8px 0; border-bottom: 1px solid #dddddd; } -.openerp .oe_application .oe_form_sheet_width, .openerp .oe_application .oe_form_bottom { +.openerp .oe_application .oe_form_sheet_width, .openerp .oe_application footer { min-width: 650px; max-width: 980px; margin: 0 auto; @@ -1578,6 +1578,12 @@ -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.3); -box-shadow: 0 0 10px rgba(0, 0, 0, 0.3); } +.openerp .oe_form_editable .oe_form_editable_hidden { + display: none; +} +.openerp .oe_form_readonly .oe_form_readonly_hidden { + display: none; +} .openerp .oe_form .oe_form_group_cell { line-height: 18px; padding: 2px; @@ -1598,6 +1604,13 @@ .openerp .oe_form .oe_form_group_cell > span > .oe_datepicker_root > input.oe_datepicker_master { width: 100%; } +.openerp .oe_form h1, .openerp .oe_form h2, .openerp .oe_form h3, .openerp .oe_form h4, .openerp .oe_form h5, .openerp .oe_form h6 { + margin: 0 0 4px 0; +} +.openerp .oe_form h1 input, .openerp .oe_form h2 input, .openerp .oe_form h3 input, .openerp .oe_form h4 input, .openerp .oe_form h5 input, .openerp .oe_form h6 input { + height: inherit !important; + font-size: inherit; +} .openerp .oe_form .oe_form_label_help[for], .openerp .oe_form .oe_form_label[for] { font-weight: bold; white-space: nowrap; diff --git a/addons/web/static/src/css/base.sass b/addons/web/static/src/css/base.sass index 81c6a6cd3c1..ae6d62a0e31 100644 --- a/addons/web/static/src/css/base.sass +++ b/addons/web/static/src/css/base.sass @@ -1183,7 +1183,7 @@ $colour4: #8a89ba background: #ED6F6A // }}} // FormView.customdivs {{{ - .oe_form_topbar + header position: relative border-bottom: 1px solid #cacaca @include vertical-gradient(#fcfcfc, #dedede) @@ -1238,7 +1238,7 @@ $colour4: #8a89ba .oe_form_steps_active font-weight: bold color: #b33630 - .oe_form_topbar.oe_form_topbar_hifirst button:first-child, button.oe_form_button_hi + header.oe_form_topbar_hifirst button:first-child, button.oe_form_button_hi color: white background: #DC5F59 background: -moz-linear-gradient(#DC5F59, #B33630) @@ -1247,7 +1247,7 @@ $colour4: #8a89ba -moz-box-shadow: none -webkit-box-shadow: none -box-shadow: none - .oe_form_topbar.oe_form_topbar_hifirst button:first-child:hover, button.oe_form_button_hi:hover + header.oe_form_topbar_hifirst button:first-child:hover, button.oe_form_button_hi:hover background: #DF6B66 background: -moz-linear-gradient( #DF6B66, #BF3A33) background: -webkit-gradient(linear, left top, left bottom, from( #DF6B66), to( #BF3A33)) @@ -1260,7 +1260,7 @@ $colour4: #8a89ba background: url(/web/static/src/img/form_sheetbg.png) padding: 8px 0 border-bottom: 1px solid #ddd - .oe_form_sheet_width, .oe_form_bottom + .oe_form_sheet_width, footer min-width: 650px max-width: 980px margin: 0 auto @@ -1272,6 +1272,10 @@ $colour4: #8a89ba @include box-shadow(0 0 10px rgba(0,0,0,0.3)) // }}} // FormView.layout {{{ + .oe_form_editable .oe_form_editable_hidden + display: none + .oe_form_readonly .oe_form_readonly_hidden + display: none .oe_form .oe_form_group_cell line-height: 18px @@ -1291,6 +1295,12 @@ $colour4: #8a89ba .oe_form_group_cell > span > .oe_datepicker_root, .oe_form_group_cell > span > .oe_datepicker_root > input.oe_datepicker_master width: 100% + h1, h2, h3, h4, h5, h6 + margin: 0 0 4px 0 + input + height: inherit !important + font-size: inherit + // }}} // FormView.label {{{ .oe_form diff --git a/addons/web/static/src/js/view_form.js b/addons/web/static/src/js/view_form.js index 41251930675..dda4a24b79f 100644 --- a/addons/web/static/src/js/view_form.js +++ b/addons/web/static/src/js/view_form.js @@ -521,6 +521,7 @@ instance.web.FormView = instance.web.View.extend(_.extend({}, instance.web.form. switch_mode: function() { var self = this; if(this.get("mode") == "view") { + self.$element.removeClass('oe_form_editable').addClass('oe_form_readonly'); self.$buttons.find('.oe_form_buttons_edit').hide(); self.$buttons.find('.oe_form_buttons_view').show(); self.$sidebar.show(); @@ -528,6 +529,7 @@ instance.web.FormView = instance.web.View.extend(_.extend({}, instance.web.form. field.set({"force_readonly": true}); }); } else { + self.$element.removeClass('oe_form_readonly').addClass('oe_form_editable'); self.$buttons.find('.oe_form_buttons_edit').show(); self.$buttons.find('.oe_form_buttons_view').hide(); self.$sidebar.hide();