summaryrefslogtreecommitdiff
path: root/addons/website/static/src/css
diff options
context:
space:
mode:
Diffstat (limited to 'addons/website/static/src/css')
-rw-r--r--addons/website/static/src/css/editor.css109
-rw-r--r--addons/website/static/src/css/editor.sass95
-rw-r--r--addons/website/static/src/css/snippets.css3
-rw-r--r--addons/website/static/src/css/website.css5
-rw-r--r--addons/website/static/src/css/website.sass4
5 files changed, 134 insertions, 82 deletions
diff --git a/addons/website/static/src/css/editor.css b/addons/website/static/src/css/editor.css
index ebcb7f43826..dc9bb076e59 100644
--- a/addons/website/static/src/css/editor.css
+++ b/addons/website/static/src/css/editor.css
@@ -1,3 +1,4 @@
+@charset "utf-8";
/* ---- CKEditor Minimal Reset ---- */
.navbar.navbar-inverse .cke_chrome {
border: none;
@@ -304,53 +305,87 @@ table.editorbar-panel td.selected {
}
/* ---- SNIPPETS DROP ZONES ---- */
-.oe_drop_zone.oe_insert {
+#dark_for_dropzone {
+ width: 100%;
+ position: absolute;
+ top: 0;
+ left: 0;
+ opacity: 0.4;
+ z-index: 1000;
+ pointer-events: none;
+}
+#dark_for_dropzone td {
+ background: black;
+}
+#dark_for_dropzone td.center.active {
+ background: transparent;
+}
+
+.oe_drop_zone, .oe_drop_zone_style {
+ border: none;
+ background: rgba(100, 255, 255, 0.9);
+ -webkit-border-radius: 4px;
+ -moz-border-radius: 4px;
+ -ms-border-radius: 4px;
+ -o-border-radius: 4px;
+ border-radius: 4px;
+}
+.oe_drop_zone div, .oe_drop_zone_style div {
+ margin: 0;
+ line-height: 48px;
+ text-align: center;
+ color: magenta;
+ font-weight: bold;
+ font-size: 24px;
+}
+.oe_drop_zone .oe_active, .oe_drop_zone_style .oe_active {
+ display: none;
+}
+
+.oe_drop_zone_style div {
+ line-height: 24px;
+}
+
+.oe_drop_zone {
display: block;
height: 48px;
margin: 0px;
margin-top: -4px;
margin-bottom: -44px;
- -webkit-transition: margin 250ms linear;
- -moz-transition: margin 250ms linear;
- -o-transition: margin 250ms linear;
- transition: margin 250ms linear;
+ z-index: 1002;
width: 100%;
position: absolute;
- z-index: 1000;
}
-.oe_drop_zone.oe_insert:not(.oe_vertical):before {
+.oe_drop_zone:not(.oe_vertical):before {
content: "";
display: block;
border-top: dashed 2px rgba(209, 178, 255, 0.72);
position: relative;
top: 0px;
}
-.oe_drop_zone.oe_insert.oe_hover:before {
+.oe_drop_zone.oe_hover:before {
border-top: dashed 2px rgba(116, 255, 161, 0.72);
}
-.oe_drop_zone.oe_insert.oe_vertical {
+.oe_drop_zone.oe_vertical {
width: 48px;
float: left;
position: relative;
- margin: 0px -24px !important;
+ margin: 4px -24px !important;
}
-.oe_drop_zone.oe_insert.oe_overlay {
+.oe_drop_zone.oe_vertical div {
+ display: none;
+}
+.oe_drop_zone.oe_overlay {
border-radius: 3px;
- background: rgba(153, 0, 255, 0.5);
}
-
-.oe_drop_zone, .oe_drop_zone_style {
- border: none;
- background: rgba(153, 0, 255, 0.3);
- -webkit-border-radius: 4px;
- -moz-border-radius: 4px;
- -ms-border-radius: 4px;
- -o-border-radius: 4px;
- border-radius: 4px;
+.oe_drop_zone.oe_drop_active {
+ background: rgba(100, 255, 255, 0.3);
+}
+.oe_drop_zone.oe_drop_active div {
+ display: none;
}
-.oe_drop_zone.oe_hover, .oe_drop_zone_style.oe_hover {
- background: rgba(0, 255, 133, 0.3);
- z-index: 1001;
+.oe_drop_zone.oe_drop_active .oe_active {
+ display: block;
}
.oe_drop_zone_style {
@@ -602,34 +637,29 @@ table.editorbar-panel td.selected {
/* ---- ACE EDITOR ---- */
.oe_ace_view_editor {
- -webkit-transition: all 0.2s ease-in;
- -moz-transition: all 0.2s ease-in;
- -o-transition: all 0.2s ease-in;
- transition: all 0.2s ease-in;
- filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=30);
- opacity: 0.3;
position: fixed;
top: 51px;
right: 0;
z-index: 1000;
height: 100%;
+ width: 720px;
}
.oe_ace_view_editor .oe_ace_view_editor_title {
width: 100%;
- padding-top: 4px;
- padding-left: 4px;
- height: 40px;
+ padding-top: 0;
+ padding-left: 0;
+ height: 30px;
background: #2f3129;
}
.oe_ace_view_editor .oe_ace_view_editor_title .oe_view_list {
width: 50%;
- height: 32px;
+ height: 30px;
font-size: 14px;
font-family: "Monaco", "Menlo", "Ubuntu Mono", "Consolas", "source-code-pro", monospace;
line-height: normal;
}
.oe_ace_view_editor .oe_ace_view_editor_title .btn {
- height: 32px;
+ height: 30px;
padding: 0 4px 0 4px;
font-size: 14px;
font-family: "Monaco", "Menlo", "Ubuntu Mono", "Consolas", "source-code-pro", monospace;
@@ -637,21 +667,18 @@ table.editorbar-panel td.selected {
}
.oe_ace_view_editor .ace_editor {
position: absolute;
- top: 40px;
+ top: 30px;
right: 0;
bottom: 51px;
left: 0;
width: 720px;
}
-.oe_ace_view_editor:hover {
+.oe_ace_view_editor.oe_ace_open {
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
opacity: 1;
}
-.oe_ace_view_editor.oe_ace_open {
- width: 720px;
-}
.oe_ace_view_editor.oe_ace_closed {
- width: 0;
+ z-index: -1000;
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
opacity: 0;
}
diff --git a/addons/website/static/src/css/editor.sass b/addons/website/static/src/css/editor.sass
index 1ef6d67bb49..bc8b238736e 100644
--- a/addons/website/static/src/css/editor.sass
+++ b/addons/website/static/src/css/editor.sass
@@ -4,15 +4,15 @@
@import "compass/css3/user-interface"
@import "compass/css3/transition"
-//smartphones, iPhone, portrait 480x320 phones
+//smartphones, iPhone, portrait 480x320 phones
$smart_phone: 320px
//portrait e-readers (Nook/Kindle), smaller tablets @ 600 or @ 640 wide.*/
-$small-tablet: 481px
+$small-tablet: 481px
//portrait tablets, portrait iPad, landscape e-readers, landscape 800x480 or 854x480 phones
-$portrait-tablet: 641px
-//tablet, landscape iPad, lo-res laptops ands desktops
+$portrait-tablet: 641px
+//tablet, landscape iPad, lo-res laptops ands desktops
$tablet: 961px
-//big landscape tablets, laptops, and desktops
+//big landscape tablets, laptops, and desktops
$desktop: 1025px
/* ---- CKEditor Minimal Reset ---- */
@@ -179,7 +179,7 @@ table.editorbar-panel
background: black !important
> a
padding: 2px 10px !important
- width: 100%
+ width: 100%
display: block
border: 0
z-index: 1
@@ -189,13 +189,13 @@ table.editorbar-panel
display: inline-block
white-space: nowrap
background: black
- > div
+ > div
background: rgb(0,0,0)
label
width: 44px
color: #fff
padding-left: 10px
-
+
div
width: 100px
text-align: center
@@ -242,16 +242,45 @@ table.editorbar-panel
/* ---- SNIPPETS DROP ZONES ---- */
-.oe_drop_zone.oe_insert
+#dark_for_dropzone
+ width: 100%
+ position: absolute
+ top: 0
+ left: 0
+ opacity: 0.4
+ z-index: 1000
+ pointer-events: none
+ td
+ background: #000
+ &.center.active
+ background: transparent
+
+.oe_drop_zone, .oe_drop_zone_style
+ border: none
+ background: rgba(100, 255, 255, .9)
+ +border-radius(4px)
+ div
+ margin: 0
+ line-height: 48px
+ text-align: center
+ color: #FF00FF
+ font-weight: bold
+ font-size: 24px
+ .oe_active
+ display: none
+
+.oe_drop_zone_style div
+ line-height: 24px
+
+.oe_drop_zone
display: block
height: 48px
margin: 0px
margin-top: -4px
margin-bottom: -44px
- @include transition(margin 250ms linear)
+ z-index: 1002
width: 100%
position: absolute
- z-index: 1000
&:not(.oe_vertical):before
content: ""
display: block
@@ -264,22 +293,17 @@ table.editorbar-panel
width: 48px
float: left
position: relative
- margin: 0px -24px !important
+ margin: 4px -24px !important
+ div
+ display: none
&.oe_overlay
border-radius: 3px
- //@include background-image( repeating-linear-gradient(45deg, rgba(255,255,255,.1) ,rgba(255,255,255,.1) 35px, rgba(0,0,0,.1) 35px, rgba(0,0,0,.1) 75px))
- //background-size: 100px 100px
- background: rgba(153, 0, 255,.5)
-
-.oe_drop_zone, .oe_drop_zone_style
- border: none
- //@include background-image( repeating-linear-gradient(45deg, rgba(255,255,255,.1) ,rgba(255,255,255,.1) 35px, rgba(0,0,0,.1) 35px, rgba(0,0,0,.1) 75px))
- //background-size: 100px 100px
- background: rgba(153, 0, 255, .3)
- +border-radius(4px)
- &.oe_hover
- background: rgba(0, 255, 133, .3)
- z-index: 1001
+ &.oe_drop_active
+ background: rgba(100, 255, 255, .3)
+ div
+ display: none
+ .oe_active
+ display: block
.oe_drop_zone_style
color: white
@@ -293,7 +317,7 @@ table.editorbar-panel
display: none
position: absolute
background: transparent
- //@include background-image( repeating-linear-gradient(45deg, rgba(255,255,255,.02) ,rgba(255,255,255,.02) 35px, rgba(0,0,0,.02) 35px, rgba(0,0,0,.02) 75px))
+ //@include background-image( repeating-linear-gradient(45deg, rgba(255,255,255,.02) ,rgba(255,255,255,.02) 35px, rgba(0,0,0,.02) 35px, rgba(0,0,0,.02) 75px))
+border-radius(3px)
@include transition(opacity 100ms linear)
+box-sizing(border-box)
@@ -467,7 +491,7 @@ $highlighted_text_color: #ffffff
/* ---- ACE EDITOR ---- */
$ace_width: 720px
-$editorbar_height: 40px
+$editorbar_height: 30px
// TODO Fix => might break with themes
$navbar_height: 51px
@@ -476,25 +500,24 @@ $navbar_height: 51px
font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', 'Consolas', 'source-code-pro', monospace
line-height: normal
.oe_ace_view_editor
- @include transition(all 0.2s ease-in)
- +opacity(0.3)
position: fixed
top: $navbar_height
right: 0
z-index: 1000
height: 100%
+ width: $ace_width
.oe_ace_view_editor_title
width: 100%
- padding-top: 4px
- padding-left: 4px
+ padding-top: 0
+ padding-left: 0
height: $editorbar_height
background: #2F3129
.oe_view_list
width: 50%
- height: $editorbar_height - 8px
+ height: $editorbar_height
@include editor-font
.btn
- height: $editorbar_height - 8px
+ height: $editorbar_height
padding: 0 4px 0 4px
@include editor-font
.ace_editor
@@ -504,12 +527,10 @@ $navbar_height: 51px
bottom: $navbar_height
left: 0
width: $ace_width
- &:hover
- +opacity(1)
&.oe_ace_open
- width: $ace_width
+ +opacity(1)
&.oe_ace_closed
- width: 0
+ z-index: -1000
+opacity(0)
/* ---- EDITOR TOUR ---- */
diff --git a/addons/website/static/src/css/snippets.css b/addons/website/static/src/css/snippets.css
index 63e8fbefa76..c6bb24d04f0 100644
--- a/addons/website/static/src/css/snippets.css
+++ b/addons/website/static/src/css/snippets.css
@@ -216,5 +216,4 @@
[data-snippet-id] {
min-height: 10px;
min-width: 10px;
-}
-
+} \ No newline at end of file
diff --git a/addons/website/static/src/css/website.css b/addons/website/static/src/css/website.css
index ce87e592136..c5b58815c67 100644
--- a/addons/website/static/src/css/website.css
+++ b/addons/website/static/src/css/website.css
@@ -235,7 +235,10 @@ footer {
}
.oe_structure.oe_empty > .oe_drop_zone.oe_insert:only-child, [data-oe-type=html] > .oe_drop_zone.oe_insert:only-child {
- position: static;
+ position: relative;
+}
+.oe_structure.oe_empty > .oe_drop_zone.oe_insert:only-child div, [data-oe-type=html] > .oe_drop_zone.oe_insert:only-child div {
+ display: none;
}
.oe_structure.oe_empty:empty:before, [data-oe-type=html]:empty:before, .oe_structure.oe_empty > .oe_drop_zone.oe_insert:only-child:before, [data-oe-type=html] > .oe_drop_zone.oe_insert:only-child:before {
diff --git a/addons/website/static/src/css/website.sass b/addons/website/static/src/css/website.sass
index 5197653429c..2735dfe9fc8 100644
--- a/addons/website/static/src/css/website.sass
+++ b/addons/website/static/src/css/website.sass
@@ -161,7 +161,9 @@ footer
height: 220px !important
.oe_structure.oe_empty > .oe_drop_zone.oe_insert:only-child, [data-oe-type=html] > .oe_drop_zone.oe_insert:only-child
- position: static
+ position: relative
+ div
+ display: none
.oe_structure.oe_empty:empty:before, [data-oe-type=html]:empty:before, .oe_structure.oe_empty > .oe_drop_zone.oe_insert:only-child:before, [data-oe-type=html] > .oe_drop_zone.oe_insert:only-child:before
content: 'Click Edit To Create Content'
generated by cgit v1.2.3 (git 2.25.1) at 2026-10-25 04:09:22 +0000