@oat-sa/tao-core-ui 1.55.0 → 1.56.2

package/src/css/basic.css

@@ -1170,7 +1170,6 @@ html small {
 html sub,
 html sup {
     font-size: .75em;
-    line-height: 0;
     position: relative;
     vertical-align: baseline;
 }
@@ -2752,11 +2751,12 @@ Usage:
 /* The box that holds buttons. */
 .cke_toolgroup, .tlb-group {
     float: left;
-    margin: 0 2px 2px 0;
+    margin: 0 2px 0 0;
     border: 1px solid #ddd;
     border-radius: 2px;
     border-radius: 1px;
     background: white;
+    display: flex;
 }
 
 .cke_hc .cke_toolgroup, .cke_hc .tlb-group {
@@ -2886,8 +2886,19 @@ a.cke_button_disabled:active {
     vertical-align: middle;
     float: left;
     cursor: default;
-    color: #474747;
-    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
+}
+
+.cke_button_label.cke_button__language_label {
+    display: block;
+    cursor: pointer;
+}
+
+.cke_button__language {
+    cursor: pointer;
+}
+
+.cke_button__language_icon {
+    display: none;
 }
 
 .cke_rtl .cke_button_label {
@@ -3408,12 +3419,18 @@ Usage:
     visibility: visible;
     width: 120px;
     height: 100px;
-    overflow: hidden;
+    overflow-x: hidden;
+    overflow-y: auto;
     background-color: #fff;
     border: 1px solid #b6b6b6;
     border-bottom-color: #999;
     border-radius: 3px;
     box-shadow: 0 0 3px rgba(0, 0, 0, 0.15);
+    font-size: 14px;
+}
+
+.cke_panel_visible .cke_panel {
+    visibility: visible;
 }
 
 /* This class represents panels which are used as context menus. */
@@ -3421,18 +3438,24 @@ Usage:
     padding: 0;
     margin: 0;
     visibility: hidden;
+    background-color: white;
+    border: 1px solid #ddd;
+    border-radius: 2px;
+    box-shadow: none;
+    max-height: 60vh;
 }
 
 /* This class represents panels which are used by rich combos. */
 .cke_combopanel {
     width: 150px;
     height: 170px;
+    overflow: hidden;
 }
 
 /* The IFRAME the panel is wrapped into. */
 .cke_panel_frame {
     width: 100%;
-    height: 100%;
+    height: inherit;
     font-size: 12px;
     overflow: auto;
     overflow-x: hidden;
@@ -3492,7 +3515,7 @@ is its visual representation:
     padding: 3px 4px;
     display: block;
     border: 1px solid #fff;
-    color: inherit !important;
+    color: inherit;
     text-decoration: none;
     overflow: hidden;
     text-overflow: ellipsis;
@@ -3519,7 +3542,9 @@ is its visual representation:
 .cke_panel_listItem a:hover,
 .cke_panel_listItem a:focus,
 .cke_panel_listItem a:active {
+    color: white;
     background-color: #3e7da7;
+    outline: none;
 }
 
 .cke_hc .cke_panel_listItem a {
@@ -3759,11 +3784,12 @@ Usage:
 /* The box that holds buttons. */
 .cke_toolgroup, .tlb-group {
     float: left;
-    margin: 0 2px 2px 0;
+    margin: 0 2px 0 0;
     border: 1px solid #ddd;
     border-radius: 2px;
     border-radius: 1px;
     background: white;
+    display: flex;
 }
 
 .cke_hc .cke_toolgroup, .cke_hc .tlb-group {
@@ -3893,8 +3919,19 @@ a.cke_button_disabled:active {
     vertical-align: middle;
     float: left;
     cursor: default;
-    color: #474747;
-    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
+}
+
+.cke_button_label.cke_button__language_label {
+    display: block;
+    cursor: pointer;
+}
+
+.cke_button__language {
+    cursor: pointer;
+}
+
+.cke_button__language_icon {
+    display: none;
 }
 
 .cke_rtl .cke_button_label {
@@ -4062,19 +4099,56 @@ Special outer level classes used in this file:
     /* The "button" inside a menu item is a <a> element.
      Transforms it into a block. */
     display: block;
+    color: #222;
+    padding: 5px 7px;
+    cursor: pointer;
 }
 
-.cke_menuitem span {
-    /* Avoid the text selection cursor inside menu items. */
-    cursor: default;
-    font-size: 12px;
+.cke_menubutton .cke_menubutton_label {
+    cursor: pointer;
+}
+
+.cke_menubutton__rtl {
+    padding-right: 40px;
+    position: relative;
+}
+
+.cke_menubutton__rtl:after {
+    content: 'RTL';
+    display: block;
+    color: #ada194;
+    border: #ada194 1px solid;
+    border-radius: 2px;
+    font-size: 10px;
+    top: 50%;
+    transform: translateY(-50%);
+    right: 5px;
+    line-height: 12px;
+    padding: 0 4px;
+    position: absolute;
+}
+
+.cke_menubutton:active,
+.cke_menubutton:focus {
+    outline: none;
+    background: none;
 }
 
 .cke_menubutton:hover,
-.cke_menubutton:focus,
-.cke_menubutton:active {
-    background-color: #D3D3D3;
+.cke_menubutton_on,
+.cke_menubutton_on:focus {
+    background: #3e7da7;
+    color: white;
     display: block;
+    outline: none;
+    cursor: pointer;
+}
+
+.cke_menubutton:hover:after,
+.cke_menubutton_on:after,
+.cke_menubutton_on:focus:after {
+    color: white;
+    border-color: white;
 }
 
 .cke_hc .cke_menubutton {
@@ -4100,6 +4174,7 @@ Special outer level classes used in this file:
 
 /* The menu item icon. */
 .cke_menubutton_icon {
+    display: none;
     background-color: #D7D8D7;
     opacity: 0.70;
     /* Safari, Opera and Mozilla */
@@ -4114,12 +4189,6 @@ Special outer level classes used in this file:
     padding: 4px 0;
 }
 
-.cke_menubutton:hover .cke_menubutton_icon,
-.cke_menubutton:focus .cke_menubutton_icon,
-.cke_menubutton:active .cke_menubutton_icon {
-    background-color: #D0D2D0;
-}
-
 .cke_menubutton_disabled:hover .cke_menubutton_icon,
 .cke_menubutton_disabled:focus .cke_menubutton_icon,
 .cke_menubutton_disabled:active .cke_menubutton_icon {
@@ -4134,6 +4203,7 @@ Special outer level classes used in this file:
     background-color: transparent;
     width: 100%;
     vertical-align: middle;
+    font-size: 14px;
 }
 
 .cke_menubutton_disabled .cke_menubutton_label {
@@ -4142,22 +4212,10 @@ Special outer level classes used in this file:
     filter: alpha(opacity=30);
 }
 
-.cke_menubutton_on {
-    border: 1px solid #dedede;
-    background-color: #f2f2f2;
-    box-shadow: 0 0 2px rgba(0, 0, 0, 0.1) inset;
-}
-
 .cke_menubutton_on .cke_menubutton_icon {
     padding-right: 3px;
 }
 
-.cke_menubutton:hover,
-.cke_menubutton:focus,
-.cke_menubutton:active {
-    background-color: #EFF0EF;
-}
-
 .cke_panel_frame .cke_menubutton_label {
     display: none;
 }
@@ -4344,7 +4402,6 @@ Usage:
     float: left;
     cursor: default;
     color: #474747;
-    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
     width: 60px;
 }
 
@@ -5009,6 +5066,19 @@ legend.cke_voice_label {
     color: #222;
 }
 
+.cke_taolanguage_enabled.cke_focus span[lang][dir] {
+    border-right: 1px solid transparent;
+    border-left: 1px solid transparent;
+    box-shadow: inset 0px 0px 0px 1px #222;
+    padding: 0 4px;
+}
+
+.cke_taolanguage_enabled.cke_focus span[lang][dir] span[lang][dir] {
+    border: none;
+    box-shadow: none;
+    padding: 0;
+}
+
 .xhtml_form .form-toolbar:before, .xhtml_form .form-toolbar:after {
     content: " ";
     display: table;
@@ -6815,15 +6885,21 @@ label input[type="checkbox"]:active ~ [class*=" icon-"] {
 }
 
 label input[type="radio"].disabled ~ [class^="icon-"],
-label input[type="radio"].disabled ~ [class*=" icon-"], label input[type="radio"][disabled] ~ [class^="icon-"],
-label input[type="radio"][disabled] ~ [class*=" icon-"], label input[type="radio"][readonly] ~ [class^="icon-"],
+label input[type="radio"].disabled ~ [class*=" icon-"],
+label input[type="radio"].disabled ~ label, label input[type="radio"][disabled] ~ [class^="icon-"],
+label input[type="radio"][disabled] ~ [class*=" icon-"],
+label input[type="radio"][disabled] ~ label, label input[type="radio"][readonly] ~ [class^="icon-"],
 label input[type="radio"][readonly] ~ [class*=" icon-"],
+label input[type="radio"][readonly] ~ label,
 label input[type="checkbox"].disabled ~ [class^="icon-"],
 label input[type="checkbox"].disabled ~ [class*=" icon-"],
+label input[type="checkbox"].disabled ~ label,
 label input[type="checkbox"][disabled] ~ [class^="icon-"],
 label input[type="checkbox"][disabled] ~ [class*=" icon-"],
+label input[type="checkbox"][disabled] ~ label,
 label input[type="checkbox"][readonly] ~ [class^="icon-"],
-label input[type="checkbox"][readonly] ~ [class*=" icon-"] {
+label input[type="checkbox"][readonly] ~ [class*=" icon-"],
+label input[type="checkbox"][readonly] ~ label {
     cursor: not-allowed !important;
     opacity: .4 !important;
     color: #555;
@@ -7106,6 +7182,11 @@ label input[type="checkbox"][readonly] ~ [class*=" icon-"] {
     -webkit-border-radius: 2px;
 }
 
+.xhtml_form .form_desc ~ .form-error {
+    color: #ba122b;
+    text-align: right;
+}
+
 [dir="rtl"] .xhtml_form .form_desc {
     padding: 0 0 0 10px;
 }