From 1439b9744d06852bb1b28fa30ab3009d17626176 Mon Sep 17 00:00:00 2001 From: Christophe Matthieu Date: Thu, 5 Nov 2015 11:59:52 +0100 Subject: [PATCH] [FIX] web_editor: move bootstrap default css value from editor.css to inline.css to don't overwrite backend css values and have css style in html field (iframe) --- addons/web_editor/static/src/css/editor.css | 200 ------------------ addons/web_editor/static/src/css/editor.sass | 129 ------------ addons/web_editor/static/src/css/inline.css | 201 +++++++++++++++++++ 3 files changed, 201 insertions(+), 329 deletions(-) diff --git a/addons/web_editor/static/src/css/editor.css b/addons/web_editor/static/src/css/editor.css index 73d79d856d2..ab39d4e1e37 100644 --- a/addons/web_editor/static/src/css/editor.css +++ b/addons/web_editor/static/src/css/editor.css @@ -791,202 +791,6 @@ display: inline-block; } -/* }}} */ -/* ---- Default values ---- {{{ */ -.tooltip { - position: absolute; - z-index: 1070; - display: block; - visibility: visible; - font-size: 12px; - line-height: 1.4; - opacity: 0; - filter: alpha(opacity=0); -} -.tooltip.in { - opacity: 0.9; - filter: alpha(opacity=90); -} -.tooltip.bottom { - margin-top: 3px; - padding: 5px 0; -} -.tooltip.bottom .tooltip-arrow { - top: 0; - left: 50%; - margin-left: -5px; - border-width: 0 5px 5px; - border-bottom-color: #000; -} - -.tooltip-arrow { - position: absolute; - width: 0; - height: 0; - border-color: transparent; - border-style: solid; -} - -.tooltip-inner { - max-width: 200px; - padding: 3px 8px; - color: #fff; - text-align: center; - text-decoration: none; - background-color: #000; - border-radius: 4px; -} - -.fade:not(.modal-backdrop) { - opacity: 0; - -webkit-transition: opacity 0.15s linear; - -o-transition: opacity 0.15s linear; - transition: opacity 0.15s linear; -} - -.fade.in:not(.modal-backdrop) { - opacity: 1; -} - -.pull-right { - float: right; -} - -.center-block { - display: block; - margin-left: auto; - margin-right: auto; -} - -.pull-left { - float: left; -} - -.img-responsive { - display: block; - width: 100% \9; - max-width: 100%; - height: auto; -} - -.img-rounded { - border-radius: 6px; -} - -.img-thumbnail { - padding: 4px; - line-height: 1.42857; - background-color: #fff; - border: 1px solid #ddd; - border-radius: 4px; - -webkit-transition: all 0.2s ease-in-out; - -o-transition: all 0.2s ease-in-out; - transition: all 0.2s ease-in-out; - display: inline-block; - width: 100% \9; - max-width: 100%; - height: auto; -} - -.img-circle { - border-radius: 50%; -} - -.img-responsive { - text-align: center; -} - -img.shadow { - -moz-box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.2); - -webkit-box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.2); - box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.2); -} - -.fa-1x { - font-size: 1em; -} - -.fa-2x { - font-size: 2em; -} - -.fa-3x { - font-size: 3em; -} - -.fa-4x { - font-size: 4em; -} - -.fa-5x { - font-size: 5em; -} - -.fa-6x { - font-size: 6em; -} - -.fa-7x { - font-size: 7em; -} - -.fa-8x { - font-size: 8em; -} - -.fa-9x { - font-size: 9em; -} - -.fa-10x { - font-size: 10em; -} - -.text-primary { - color: #428bca; -} - -.text-success { - color: #3c763d; -} - -.text-info { - color: #31708f; -} - -.text-warning { - color: #8a6d3b; -} - -.text-danger { - color: #a94442; -} - -.bg-primary { - color: #fff; - background-color: #428bca; -} - -.bg-success { - background-color: #dff0d8; -} - -.bg-info { - background-color: #d9edf7; -} - -.bg-warning { - background-color: #fcf8e3; -} - -.bg-danger { - background-color: #f2dede; -} - -.hidden { - display: none; -} - /* }}} */ /* ---- COLOR-PICKER ---- {{{ */ .colorpicker { @@ -1086,10 +890,6 @@ html[data-translatable] .oe_field_translate { cursor: pointer; } -.img-responsive { - text-align: center; -} - .css_editable_display { display: block !important; } diff --git a/addons/web_editor/static/src/css/editor.sass b/addons/web_editor/static/src/css/editor.sass index 420ec01fe1e..bf929e89002 100644 --- a/addons/web_editor/static/src/css/editor.sass +++ b/addons/web_editor/static/src/css/editor.sass @@ -683,132 +683,6 @@ $attachment-border-color: #848490 /* }}} */ -/* ---- Default values ---- {{{ */ - -.tooltip - position: absolute - z-index: 1070 - display: block - visibility: visible - font-size: 12px - line-height: 1.4 - opacity: 0 - filter: alpha(opacity=0) - &.in - opacity: .9 - filter: alpha(opacity=90) - &.bottom - margin-top: 3px - padding: 5px 0 - .tooltip-arrow - top: 0 - left: 50% - margin-left: -5px - border-width: 0 5px 5px - border-bottom-color: #000 -.tooltip-arrow - position: absolute - width: 0 - height: 0 - border-color: transparent - border-style: solid -.tooltip-inner - max-width: 200px - padding: 3px 8px - color: #fff - text-align: center - text-decoration: none - background-color: #000 - border-radius: 4px -.fade:not(.modal-backdrop) - opacity: 0 - -webkit-transition: opacity .15s linear - -o-transition: opacity .15s linear - transition: opacity .15s linear -.fade.in:not(.modal-backdrop) - opacity: 1 -.pull-right - float: right -.center-block - display: block - margin-left: auto - margin-right: auto -.pull-left - float: left -.img-responsive - display: block - width: 100% \9 - max-width: 100% - height: auto -.img-rounded - border-radius: 6px -.img-thumbnail - padding: 4px - line-height: 1.42857143 - background-color: #fff - border: 1px solid #ddd - border-radius: 4px - -webkit-transition: all .2s ease-in-out - -o-transition: all .2s ease-in-out - transition: all .2s ease-in-out - display: inline-block - width: 100% \9 - max-width: 100% - height: auto -.img-circle - border-radius: 50% -.img-responsive - text-align: center -img.shadow - -moz-box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.2) - -webkit-box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.2) - box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.2) -.fa-1x - font-size: 1em -.fa-2x - font-size: 2em -.fa-3x - font-size: 3em -.fa-4x - font-size: 4em -.fa-5x - font-size: 5em -.fa-6x - font-size: 6em -.fa-7x - font-size: 7em -.fa-8x - font-size: 8em -.fa-9x - font-size: 9em -.fa-10x - font-size: 10em -.text-primary - color: #428bca -.text-success - color: #3c763d -.text-info - color: #31708f -.text-warning - color: #8a6d3b -.text-danger - color: #a94442 -.bg-primary - color: #fff - background-color: #428bca -.bg-success - background-color: #dff0d8 -.bg-info - background-color: #d9edf7 -.bg-warning - background-color: #fcf8e3 -.bg-danger - background-color: #f2dede -.hidden - display: none - -/* }}} */ - /* ---- COLOR-PICKER ---- {{{ */ .colorpicker @@ -897,9 +771,6 @@ html[data-translatable] .oe_field_translate .o_editable .fa cursor: pointer -.img-responsive - text-align: center - .css_editable_display display: block !important diff --git a/addons/web_editor/static/src/css/inline.css b/addons/web_editor/static/src/css/inline.css index 61e995fa3fa..cba6343becb 100644 --- a/addons/web_editor/static/src/css/inline.css +++ b/addons/web_editor/static/src/css/inline.css @@ -62,3 +62,204 @@ body { .note-color-palette .colorpicker { display: none; } + +/* ---- Default bootstrap values ---- {{{ */ +.tooltip { + position: absolute; + z-index: 1070; + display: block; + visibility: visible; + font-size: 12px; + line-height: 1.4; + opacity: 0; + filter: alpha(opacity=0); +} +.tooltip.in { + opacity: 0.9; + filter: alpha(opacity=90); +} +.tooltip.bottom { + margin-top: 3px; + padding: 5px 0; +} +.tooltip.bottom .tooltip-arrow { + top: 0; + left: 50%; + margin-left: -5px; + border-width: 0 5px 5px; + border-bottom-color: #000; +} + +.tooltip-arrow { + position: absolute; + width: 0; + height: 0; + border-color: transparent; + border-style: solid; +} + +.tooltip-inner { + max-width: 200px; + padding: 3px 8px; + color: #fff; + text-align: center; + text-decoration: none; + background-color: #000; + border-radius: 4px; +} + +.fade:not(.modal-backdrop) { + opacity: 0; + -webkit-transition: opacity 0.15s linear; + -o-transition: opacity 0.15s linear; + transition: opacity 0.15s linear; +} + +.fade.in:not(.modal-backdrop) { + opacity: 1; +} + +.pull-right { + float: right; +} + +.center-block { + display: block; + margin-left: auto; + margin-right: auto; +} + +.pull-left { + float: left; +} + +.img-responsive { + display: block; + width: 100% \9; + max-width: 100%; + height: auto; +} + +.img-rounded { + border-radius: 6px; +} + +.img-thumbnail { + padding: 4px; + line-height: 1.42857; + background-color: #fff; + border: 1px solid #ddd; + border-radius: 4px; + -webkit-transition: all 0.2s ease-in-out; + -o-transition: all 0.2s ease-in-out; + transition: all 0.2s ease-in-out; + display: inline-block; + width: 100% \9; + max-width: 100%; + height: auto; +} + +.img-circle { + border-radius: 50%; +} + +.img-responsive { + text-align: center; +} + +img.shadow { + -moz-box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.2); + -webkit-box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.2); + box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.2); +} + +.fa-1x { + font-size: 1em; +} + +.fa-2x { + font-size: 2em; +} + +.fa-3x { + font-size: 3em; +} + +.fa-4x { + font-size: 4em; +} + +.fa-5x { + font-size: 5em; +} + +.fa-6x { + font-size: 6em; +} + +.fa-7x { + font-size: 7em; +} + +.fa-8x { + font-size: 8em; +} + +.fa-9x { + font-size: 9em; +} + +.fa-10x { + font-size: 10em; +} + +.text-primary { + color: #428bca; +} + +.text-success { + color: #3c763d; +} + +.text-info { + color: #31708f; +} + +.text-warning { + color: #8a6d3b; +} + +.text-danger { + color: #a94442; +} + +.bg-primary { + color: #fff; + background-color: #428bca; +} + +.bg-success { + background-color: #dff0d8; +} + +.bg-info { + background-color: #d9edf7; +} + +.bg-warning { + background-color: #fcf8e3; +} + +.bg-danger { + background-color: #f2dede; +} + +.hidden { + display: none; +} + +.img-responsive { + text-align: center; +} + +/* }}} */ \ No newline at end of file