[MERGE] from upstream
[odoo/odoo.git] / addons / website / static / src / css / editor.css
1 .oe_hidden {
2   display: none !important;
3 }
4
5 .oe_website_editorbar {
6   position: fixed;
7   top: 0;
8   right: 0;
9   z-index: 10;
10   display: block;
11   width: 100%;
12   padding: 2px;
13   margin: 0px;
14   z-index: 10000;
15   background-color: #414141;
16   background: -webkit-linear-gradient(#646060, #262626);
17   box-sizing: border-box;
18 }
19 .oe_website_editorbar li {
20   display: inline;
21   color: #eeeeee;
22 }
23 .oe_website_editorbar li:hover {
24   background: rgba(0, 0, 0, 0.2);
25   text-shadow: black 0px 0px 3px;
26   color: white;
27 }
28
29 .oe_website_editorbar .oe_rte_toolbar div.dropdown {
30   display: inline-block;
31 }
32 .oe_website_editorbar .oe_rte_toolbar div.dropdown li {
33   display: list-item;
34 }
35 .oe_website_editorbar .oe_rte_toolbar button {
36   font-family: FontAwesome;
37   font-weight: normal;
38   font-style: normal;
39   text-decoration: inherit;
40 }
41 .oe_website_editorbar .oe_rte_toolbar button.oe_button_list {
42   padding-right: 3px;
43 }
44 .oe_website_editorbar .oe_rte_toolbar button.oe_button_list:after {
45   content: "\F0D7";
46   padding-left: 6px;
47 }
48
49 .oe_editable:focus {
50   outline: none !important;
51 }
52
53 .oe_carousel_options {
54   cursor: pointer;
55   position: absolute;
56   white-space: nowrap;
57   z-index: 1;
58   display: none;
59 }
60
61 .oe_snippets {
62   position: fixed;
63   left: 0px;
64   right: 0px;
65   bottom: 0px;
66   max-height: 280px;
67   min-height: 140px;
68   background: #282828;
69   box-shadow: 0px 10px 10px -10px black inset;
70   overflow-y: auto;
71 }
72
73 .oe_snippet {
74   display: inline-block;
75   vertical-align: top;
76   background: white;
77   width: 120px;
78   height: 120px;
79   border-radius: 3px;
80   margin: 10px;
81   margin-right: 0px;
82   position: relative;
83   box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.2);
84   overflow: hidden;
85   -webkit-user-select: none;
86   user-select: none;
87 }
88 .oe_snippet .oe_snippet_thumbnail.oe_label {
89   text-align: center;
90   background: #747474;
91   background-image: radial-gradient(rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.4));
92   height: 100%;
93   line-height: 120px;
94   color: white;
95   text-shadow: 0px 1px 2px rgba(0, 0, 0, 0.95);
96 }
97 .oe_snippet .oe_snippet_body {
98   display: none;
99 }
100 .oe_snippet > * {
101   pointer-events: none;
102 }
103 .oe_snippet > *:first-child:not(.oe_snippet_thumbnail) {
104   display: block;
105   -webkit-transform-origin-x: 5px;
106   -webkit-transform-origin-y: 10px;
107   -webkit-transform: scale(0.095);
108 }
109
110 .oe_drop_zone {
111   display: block;
112   background: rgba(153, 0, 255, 0.17);
113   border-radius: 3px;
114   height: 32px;
115   margin: -16px 0px;
116   -webkit-transition: margin 250ms linear;
117 }
118 .oe_drop_zone:first-child:not(:last-child) {
119   margin-top: -8px;
120   margin-bottom: -24px;
121 }
122 .oe_drop_zone:last-child:not(:first-child) {
123   margin-top: -24px;
124   margin-bottom: -8px;
125 }
126 .oe_drop_zone.oe_hover {
127   background: rgba(0, 255, 133, 0.22);
128   z-index: 100000;
129 }
130 .oe_drop_zone:before {
131   content: "";
132   display: block;
133   border-top: dashed 2px rgba(209, 178, 255, 0.72);
134   position: relative;
135   top: 16px;
136 }
137 .oe_drop_zone:first-child:not(:last-child):before {
138   top: 8px;
139 }
140 .oe_drop_zone:last-child:not(:first-child):before {
141   top: 24px;
142 }
143 .oe_drop_zone.oe_hover:before {
144   border-top: dashed 2px rgba(116, 255, 161, 0.72);
145 }
146
147 .oe_hover_zone {
148   position: absolute;
149   background: rgba(153, 0, 255, 0.17);
150   border-radius: 3px;
151 }
152 .oe_hover_zone.oe_hover {
153   background: rgba(0, 255, 133, 0.22);
154   z-index: 100000;
155 }
156
157 .oe_stop_scrolling {
158   height: 100%;
159   overflow: hidden;
160 }
161
162 #mobile-preview.modal {
163   height: 660px;
164   background-color: black;
165   border: 2px solid;
166   border-radius: 10px;
167   margin: auto;
168   top: 0;
169   left: 0;
170   bottom: 0;
171   right: 0;
172   max-width: 330px;
173 }
174
175 #mobile-preview .modal-header {
176   border-bottom: 0;
177   border-top-left-radius: 10px;
178   border-top-right-radius: 10px;
179 }
180 #mobile-preview .modal-body {
181   max-height: 600px;
182   padding: 0;
183   margin: 0;
184 }
185
186 .oe_mobile_viewport {
187   width: 320px;
188   height: 568px;
189   padding: 5px;
190   border: none;
191 }
192
193 .oe_mobile_preview_header .close {
194   color: lightgrey;
195   opacity: 1;
196 }
197 .oe_mobile_preview_header .close:hover {
198   color: darkgrey;
199 }