addons/website/static/src/css/editor.css

   1 /* ---- CKEditor Minimal Reset ---- {{{ */
   2 .navbar.navbar-inverse .cke_chrome {
   3   border: none;
   4 }
   5
   6 .navbar.navbar-inverse .cke_inner {
   7   background: transparent;
   8 }
   9
  10 .navbar.navbar-inverse .cke_toolbar {
  11   position: relative;
  12   top: 1px;
  13 }
  14 .navbar.navbar-inverse .cke_combo_button {
  15   padding-top: 3px;
  16   padding-bottom: 3px;
  17 }
  18 .navbar.navbar-inverse .cke_button {
  19   padding-top: 7px;
  20   padding-bottom: 7px;
  21 }
  22
  23 .navbar.navbar-inverse .cke_top {
  24   background: transparent;
  25   border: none;
  26   -moz-box-shadow: none;
  27   -webkit-box-shadow: none;
  28   box-shadow: none;
  29   -ms-filter: "alpha(opacity=50)";
  30 }
  31
  32 #cke_1_top {
  33   padding: 0;
  34 }
  35
  36 #cke_wrapwrap {
  37   -moz-box-shadow: none;
  38   -webkit-box-shadow: none;
  39   box-shadow: none;
  40 }
  41 #cke_wrapwrap .cke_button {
  42   padding-top: 5px;
  43   padding-bottom: 5px;
  44 }
  45 #cke_wrapwrap .cke_combo_button {
  46   padding-top: 1px;
  47   padding-bottom: 1px;
  48 }
  49
  50 /* ---- OpenERP Style ---- {{{ */
  51 .oe_website_editorbar {
  52   position: fixed;
  53   top: 0;
  54   right: 0;
  55   display: block;
  56   width: 100%;
  57   padding: 2px;
  58   margin: 0;
  59   z-index: 20000;
  60   background: #414141, -moz-linear-gradient(#646060, #262626);
  61   background: #414141, -webkit-linear-gradient(#646060, #262626);
  62   background: #414141, linear-gradient(#646060, #262626);
  63   -moz-box-sizing: border-box;
  64   -webkit-box-sizing: border-box;
  65   box-sizing: border-box;
  66 }
  67 .oe_website_editorbar li {
  68   display: inline;
  69   color: #eeeeee;
  70 }
  71 .oe_website_editorbar li:hover {
  72   background: rgba(0, 0, 0, 0.2);
  73   text-shadow: black 0px 0px 3px;
  74   color: white;
  75 }
  76
  77 .oe_website_editorbar .oe_rte_toolbar div.dropdown {
  78   display: inline-block;
  79 }
  80 .oe_website_editorbar .oe_rte_toolbar div.dropdown li {
  81   display: list-item;
  82 }
  83 .oe_website_editorbar .oe_rte_toolbar button {
  84   font-family: FontAwesome;
  85   font-weight: normal;
  86   font-style: normal;
  87   text-decoration: inherit;
  88 }
  89 .oe_website_editorbar .oe_rte_toolbar button.oe_button_list {
  90   padding-right: 3px;
  91 }
  92 .oe_website_editorbar .oe_rte_toolbar button.oe_button_list:after {
  93   content: "\F0D7";
  94   padding-left: 6px;
  95 }
  96
  97 .oe_editable:focus {
  98   outline: none !important;
  99 }
 100
 101 .css_editable_display {
 102   display: block !important;
 103 }
 104
 105 .css_editable_hidden {
 106   display: none !important;
 107 }
 108
 109 .cke_editable .css_editable_mode_hidden {
 110   display: none;
 111 }
 112
 113 .cke_editable .css_editable_mode_display {
 114   display: block !important;
 115 }
 116
 117 .oe_structure.oe_empty:empty, [data-oe-type=html]:empty, .oe_structure.oe_empty > .oe_drop_zone.oe_insert:only-child, [data-oe-type=html] > .oe_drop_zone.oe_insert:only-child {
 118   background-image: url("/website/static/src/img/edit_here.png") !important;
 119 }
 120
 121 .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 {
 122   content: "Press The Top-Left Edit Button" !important;
 123 }
 124
 125 [data-oe-type=html].oe_no_empty:empty:before {
 126   content: "" !important;
 127 }
 128
 129 [data-oe-type=html].oe_no_empty:empty {
 130   background-image: none !important;
 131   height: 16px !important;
 132 }
 133
 134 #website-top-edit {
 135   width: 100%;
 136 }
 137 #website-top-edit > ul > li {
 138   margin: 0;
 139 }
 140
 141 #website-top-navbar {
 142   min-height: 34px;
 143   height: 34px;
 144 }
 145 #website-top-navbar form {
 146   margin: 0;
 147 }
 148 #website-top-navbar form button, #website-top-navbar form a {
 149   padding: 4px 8px 4px 8px;
 150   margin-top: 2px;
 151   font-size: 13px;
 152 }
 153
 154 /* ---- EDITOR BAR ---- {{{ */
 155 table.editorbar-panel {
 156   cursor: pointer;
 157   width: 100%;
 158 }
 159 table.editorbar-panel td {
 160   border: 1px solid #aaaaaa;
 161 }
 162 table.editorbar-panel td.selected {
 163   background-color: #b1c9d9;
 164 }
 165
 166 .link-style .dropdown > .btn {
 167   min-width: 160px;
 168 }
 169 .link-style .link-style {
 170   display: none;
 171 }
 172 .link-style li {
 173   text-align: center;
 174 }
 175 .link-style li label {
 176   width: 100px;
 177   margin: 0 5px;
 178 }
 179 .link-style .col-sm-2 > * {
 180   line-height: 2em;
 181 }
 182
 183 /* ---- TRANSLATIONS ---- {{{ */
 184 .oe_translate_or {
 185   color: white;
 186   padding: 0 0 0 1em;
 187 }
 188
 189 .oe_translate_examples li {
 190   margin: 10px;
 191   padding: 4px;
 192 }
 193
 194 .oe_translatable_text {
 195   outline: 1px solid black;
 196 }
 197
 198 .oe_translatable_field {
 199   outline: 1px dashed black;
 200 }
 201
 202 .oe_translatable_text.oe_dirty, .oe_translatable_field.oe_dirty {
 203   outline-color: red;
 204 }
 205
 206 .oe_translatable_text.oe_dirty:empty {
 207   padding: 0 10px;
 208 }
 209
 210 .oe_translatable_todo {
 211   background: #ffffb6;
 212 }
 213
 214 /* ---- MENU ---- {{{ */
 215 div.oe_menu_buttons {
 216   top: -8px;
 217   right: -8px;
 218 }
 219
 220 ul.oe_menu_editor .fa-home {
 221   display: none;
 222 }
 223 ul.oe_menu_editor > li:first-child > div > span > .fa-home {
 224   display: block;
 225 }
 226 ul.oe_menu_editor .oe_menu_placeholder {
 227   outline: 1px dashed #4183c4;
 228 }
 229 ul.oe_menu_editor ul {
 230   list-style: none;
 231 }
 232 ul.oe_menu_editor li div {
 233   cursor: move;
 234 }
 235 ul.oe_menu_editor .disclose {
 236   cursor: pointer;
 237   width: 10px;
 238   display: none;
 239 }
 240
 241 /* ---- RTE ---- {{{ */
 242 .oe_editable .btn, .btn.oe_editable {
 243   -moz-user-select: auto;
 244   -ms-user-select: auto;
 245   -webkit-user-select: auto;
 246   user-select: auto;
 247   cursor: text !important;
 248 }
 249
 250 .modal-dialog.select-media {
 251   width: 80%;
 252 }
 253
 254 .modal .existing-attachments .pager {
 255   margin: 0;
 256 }
 257
 258 .modal .image-preview {
 259   margin-bottom: 0.5em;
 260 }
 261
 262 .modal-footer {
 263   text-align: left;
 264 }
 265
 266 .modal.nosave .wait {
 267   display: inline-block !important;
 268   visibility: visible !important;
 269 }
 270 .modal.nosave .modal-body .filepicker, .modal.nosave .modal-body .image-preview {
 271   display: none;
 272 }
 273 .modal.nosave .modal-body .wait {
 274   width: 100%;
 275 }
 276 .modal.nosave .modal-footer .save {
 277   display: none;
 278 }
 279
 280 .modal .font-icons-icons {
 281   font-size: 2em;
 282   max-height: 9em;
 283   overflow: auto;
 284 }
 285 .modal .font-icons-icons .font-icons-icon {
 286   display: inline-block;
 287   width: 2em;
 288   padding: 0.25em;
 289   text-align: center;
 290   cursor: pointer;
 291 }
 292 .modal .font-icons {
 293   position: relative;
 294   display: block;
 295 }
 296 .modal .font-icons:before {
 297   filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);
 298   opacity: 0.7;
 299   position: absolute;
 300   top: 2px;
 301   left: 3px;
 302   font-size: 2em;
 303 }
 304 .modal #icon-search {
 305   padding-left: 2.5em;
 306 }
 307 .modal #fa-preview {
 308   text-align: center;
 309 }
 310 .modal #fa-preview span {
 311   cursor: pointer;
 312   padding: 0 15px;
 313 }
 314 .modal #fa-preview .font-icons-selected {
 315   background-color: #dddddd;
 316 }
 317
 318 .existing-attachments .pager .disabled {
 319   display: none;
 320 }
 321 .existing-attachments .existing-attachment-cell {
 322   position: relative;
 323 }
 324 .existing-attachments .existing-attachment-cell .img {
 325   border: 1px solid #848490;
 326 }
 327 .existing-attachments .existing-attachment-cell .existing-attachment-remove {
 328   position: absolute;
 329   top: 0;
 330   left: 15px;
 331   cursor: pointer;
 332   background: white;
 333   padding: 2px;
 334   border: 1px solid #848490;
 335   border-top: none;
 336   border-left: none;
 337   -moz-border-radius-bottomright: 8px;
 338   -webkit-border-bottom-right-radius: 8px;
 339   border-bottom-right-radius: 8px;
 340 }
 341 .existing-attachments .existing-attachment-cell.media_selected > i, .existing-attachments .existing-attachment-cell.media_selected > img {
 342   border-width: 5px;
 343   border-color: #00f8f8;
 344 }
 345
 346 .cke_widget_wrapper {
 347   position: static !important;
 348 }
 349
 350 .cke_widget_inline {
 351   display: inline !important;
 352 }
 353
 354 .cke_widget_editable:empty:after {
 355   opacity: 0.3;
 356   white-space: pre-wrap;
 357 }
 358 .cke_widget_editable:not([placeholder]):empty::after {
 359   content: " ";
 360 }
 361 .cke_widget_editable[placeholder]:not(:focus):empty::after {
 362   content: attr(placeholder);
 363 }
 364
 365 .oe_carlos_danger {
 366   outline: 1px solid red !important;
 367   background-color: #ffd9dd !important;
 368 }
 369
 370 .hover-edition {
 371   display: inline-block;
 372   position: absolute;
 373   top: 0;
 374   left: 0;
 375   z-index: 1001;
 376 }
 377
 378 .preview-container {
 379   text-align: center;
 380   line-height: 100px;
 381   height: 100px;
 382 }
 383 .preview-container > * {
 384   max-height: 100px;
 385   line-height: 100px;
 386   margin: 0 auto;
 387   display: inline-block;
 388 }
 389
 390 .cke_editable .fa {
 391   cursor: pointer;
 392 }
 393
 394 .img-responsive {
 395   text-align: center;
 396 }
 397
 398 /* ---- MOBILE PREVIEW ---- {{{ */
 399 .oe_mobile_preview.modal .modal-content {
 400   height: 660px;
 401   background-color: black;
 402   border: 2px solid #1c1f1f;
 403   -moz-border-radius: 10px;
 404   -webkit-border-radius: 10px;
 405   border-radius: 10px;
 406   margin: auto;
 407   top: 0;
 408   left: 0;
 409   bottom: 0;
 410   right: 0;
 411   max-width: 330px;
 412 }
 413 .oe_mobile_preview.modal .modal-content .modal-header {
 414   background-color: black;
 415   border-bottom: 0;
 416   -moz-border-radius-topleft: 10px;
 417   -webkit-border-top-left-radius: 10px;
 418   border-top-left-radius: 10px;
 419   -moz-border-radius-topright: 10px;
 420   -webkit-border-top-right-radius: 10px;
 421   border-top-right-radius: 10px;
 422 }
 423 .oe_mobile_preview.modal .modal-content .modal-header .modal-title {
 424   color: #1c1f1f;
 425 }
 426 .oe_mobile_preview.modal .modal-content .modal-header .close {
 427   color: lightgray;
 428   filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false);
 429   opacity: 1;
 430 }
 431 .oe_mobile_preview.modal .modal-content .modal-header .close:hover {
 432   color: #e00101;
 433   filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false);
 434   opacity: 1;
 435 }
 436 .oe_mobile_preview.modal .modal-content .modal-body {
 437   background-color: black;
 438   max-height: 600px;
 439   padding: 0;
 440   margin: 0;
 441 }
 442 .oe_mobile_preview.modal .modal-content .modal-body .oe_mobile_viewport {
 443   width: 320px;
 444   height: 568px;
 445   padding: 5px;
 446   border: none;
 447 }
 448 .oe_mobile_preview.modal .modal-content .modal-footer {
 449   background-color: black;
 450 }
 451
 452 /* ---- SEO TOOLS ---- {{{ */
 453 .oe_seo_configuration .modal-dialog {
 454   width: 80%;
 455 }
 456 .oe_seo_configuration .oe_remove {
 457   color: #e00101;
 458 }
 459 .oe_seo_configuration .oe_seo_suggestion {
 460   cursor: pointer;
 461 }
 462 .oe_seo_configuration .oe_seo_keyword {
 463   padding: 0.2em 0.4em 0.2em 0.5em;
 464   -moz-border-radius: 0.4em;
 465   -webkit-border-radius: 0.4em;
 466   border-radius: 0.4em;
 467 }
 468 .oe_seo_configuration li.oe_seo_preview_g {
 469   line-height: 1.2;
 470   list-style: none;
 471   list-style-image: none;
 472   list-style-position: outside;
 473   list-style-type: none;
 474   font-size: small;
 475   font-family: arial, sans-serif;
 476 }
 477 .oe_seo_configuration li.oe_seo_preview_g h3 {
 478   font-size: medium;
 479 }
 480 .oe_seo_configuration li.oe_seo_preview_g .r {
 481   margin: 0;
 482   font-size: 16px;
 483   font-style: normal;
 484   font-weight: normal;
 485   overflow: hidden;
 486   text-overflow: ellipsis;
 487   -webkit-text-overflow: ellipsis;
 488   white-space: nowrap;
 489 }
 490 .oe_seo_configuration li.oe_seo_preview_g .r a {
 491   color: #1e0fbe;
 492   text-decoration: underline;
 493   text-transform: none;
 494 }
 495 .oe_seo_configuration li.oe_seo_preview_g .r a em {
 496   font-style: normal !important;
 497 }
 498 .oe_seo_configuration li.oe_seo_preview_g .s {
 499   color: #444444;
 500   max-width: 42em;
 501 }
 502 .oe_seo_configuration li.oe_seo_preview_g .kv, .oe_seo_configuration li.oe_seo_preview_g .slp {
 503   display: block;
 504   margin-bottom: 1px;
 505 }
 506 .oe_seo_configuration li.oe_seo_preview_g .f {
 507   color: #666666;
 508   margin-bottom: 1px;
 509 }
 510 .oe_seo_configuration li.oe_seo_preview_g .f cite {
 511   color: #006621;
 512   font-style: normal;
 513   font-size: 14px;
 514 }
 515 .oe_seo_configuration li.oe_seo_preview_g .st {
 516   line-height: 1.24;
 517 }
 518
 519 /* ---- ACE EDITOR ---- {{{ */
 520 .oe_ace_view_editor {
 521   position: fixed;
 522   right: 0;
 523   z-index: 1001;
 524   height: 100%;
 525   background: #2f3129;
 526   color: white;
 527 }
 528 .oe_ace_view_editor .oe_ace_view_editor_title {
 529   width: 100%;
 530   padding-top: 0;
 531   padding-left: 0;
 532   height: 30px;
 533 }
 534 .oe_ace_view_editor .oe_ace_view_editor_title .oe_view_list {
 535   width: 50%;
 536   height: 30px;
 537   font-size: 14px;
 538   font-family: "Monaco", "Menlo", "Ubuntu Mono", "Consolas", "source-code-pro", monospace;
 539   line-height: normal;
 540 }
 541 .oe_ace_view_editor .oe_ace_view_editor_title .btn {
 542   height: 30px;
 543   padding: 0 4px 0 4px;
 544   font-size: 14px;
 545   font-family: "Monaco", "Menlo", "Ubuntu Mono", "Consolas", "source-code-pro", monospace;
 546   line-height: normal;
 547 }
 548 .oe_ace_view_editor .ace_editor {
 549   position: absolute;
 550   top: 50px;
 551   right: 0;
 552   left: 0;
 553 }
 554 .oe_ace_view_editor .ace_editor .ace_gutter {
 555   cursor: ew-resize;
 556 }
 557 .oe_ace_view_editor #ace-view-id {
 558   padding: 0 1em;
 559 }
 560 .oe_ace_view_editor.oe_ace_open {
 561   filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=97);
 562   opacity: 0.97;
 563 }
 564 .oe_ace_view_editor.oe_ace_closed {
 565   z-index: -1000;
 566   filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
 567   opacity: 0;
 568 }
 569
 570 .oe_include_bundles {
 571   font-weight: normal;
 572   padding: 0 8px;
 573 }