@sapui5/sap.ui.richtexteditor 1.112.2 → 1.114.0

package/src/sap/ui/richtexteditor/js/tiny_mce6/skins/ui/tinymce-5/skin.css

@@ -109,7 +109,6 @@ button::-moz-focus-inner {
 }
 .tox .accessibility-issue__description {
   align-items: stretch;
-  border: 1px solid #cccccc;
   border-radius: 3px;
   display: flex;
   justify-content: space-between;
@@ -122,83 +121,101 @@ button::-moz-focus-inner {
   display: flex;
   margin-bottom: 4px;
 }
-.tox .accessibility-issue__description > *:last-child:not(:only-child) {
-  border-color: #cccccc;
-  border-style: solid;
+.tox .accessibility-issue__description > div > div .tox-icon svg {
+  display: block;
 }
 .tox .accessibility-issue__repair {
   margin-top: 16px;
 }
 .tox .tox-dialog__body-content .accessibility-issue--info .accessibility-issue__description {
-  background-color: rgba(32, 122, 183, 0.1);
-  border-color: rgba(32, 122, 183, 0.4);
+  background-color: rgba(30, 113, 170, 0.1);
   color: #222f3e;
 }
-.tox .tox-dialog__body-content .accessibility-issue--info .accessibility-issue__description > *:last-child {
-  border-color: rgba(32, 122, 183, 0.4);
-}
 .tox .tox-dialog__body-content .accessibility-issue--info .tox-form__group h2 {
   color: #207ab7;
 }
 .tox .tox-dialog__body-content .accessibility-issue--info .tox-icon svg {
   fill: #207ab7;
 }
-.tox .tox-dialog__body-content .accessibility-issue--info a .tox-icon {
-  color: #207ab7;
+.tox .tox-dialog__body-content .accessibility-issue--info a.tox-button--naked.tox-button--icon {
+  background-color: #207ab7;
+  color: #fff;
+}
+.tox .tox-dialog__body-content .accessibility-issue--info a.tox-button--naked.tox-button--icon:hover,
+.tox .tox-dialog__body-content .accessibility-issue--info a.tox-button--naked.tox-button--icon:focus {
+  background-color: #1c6ca1;
+}
+.tox .tox-dialog__body-content .accessibility-issue--info a.tox-button--naked.tox-button--icon:active {
+  background-color: #185d8c;
+}
+.tox .tox-dialog__body-content .accessibility-issue--warn {
+  /* stylelint-disable-next-line no-descending-specificity */
 }
 .tox .tox-dialog__body-content .accessibility-issue--warn .accessibility-issue__description {
-  background-color: rgba(255, 165, 0, 0.1);
-  border-color: rgba(255, 165, 0, 0.5);
+  background-color: rgba(255, 165, 0, 0.08);
   color: #222f3e;
 }
-.tox .tox-dialog__body-content .accessibility-issue--warn .accessibility-issue__description > *:last-child {
-  border-color: rgba(255, 165, 0, 0.5);
-}
 .tox .tox-dialog__body-content .accessibility-issue--warn .tox-form__group h2 {
-  color: #cc8500;
+  color: #8f5d00;
 }
 .tox .tox-dialog__body-content .accessibility-issue--warn .tox-icon svg {
-  fill: #cc8500;
+  fill: #8f5d00;
 }
-.tox .tox-dialog__body-content .accessibility-issue--warn a .tox-icon {
-  color: #cc8500;
+.tox .tox-dialog__body-content .accessibility-issue--warn a.tox-button--naked.tox-button--icon {
+  background-color: #FFE89D;
+  color: #222f3e;
+}
+.tox .tox-dialog__body-content .accessibility-issue--warn a.tox-button--naked.tox-button--icon:hover,
+.tox .tox-dialog__body-content .accessibility-issue--warn a.tox-button--naked.tox-button--icon:focus {
+  background-color: #F2D574;
+  color: #222f3e;
+}
+.tox .tox-dialog__body-content .accessibility-issue--warn a.tox-button--naked.tox-button--icon:active {
+  background-color: #E8C657;
+  color: #222f3e;
+}
+.tox .tox-dialog__body-content .accessibility-issue--error {
+  /* stylelint-disable-next-line no-descending-specificity */
 }
 .tox .tox-dialog__body-content .accessibility-issue--error .accessibility-issue__description {
   background-color: rgba(204, 0, 0, 0.1);
-  border-color: rgba(204, 0, 0, 0.4);
   color: #222f3e;
 }
-.tox .tox-dialog__body-content .accessibility-issue--error .accessibility-issue__description > *:last-child {
-  border-color: rgba(204, 0, 0, 0.4);
-}
 .tox .tox-dialog__body-content .accessibility-issue--error .tox-form__group h2 {
   color: #c00;
 }
 .tox .tox-dialog__body-content .accessibility-issue--error .tox-icon svg {
   fill: #c00;
 }
-.tox .tox-dialog__body-content .accessibility-issue--error a .tox-icon {
-  color: #c00;
+.tox .tox-dialog__body-content .accessibility-issue--error a.tox-button--naked.tox-button--icon {
+  background-color: #F2BFBF;
+  color: #222f3e;
+}
+.tox .tox-dialog__body-content .accessibility-issue--error a.tox-button--naked.tox-button--icon:hover,
+.tox .tox-dialog__body-content .accessibility-issue--error a.tox-button--naked.tox-button--icon:focus {
+  background-color: #E9A4A4;
+  color: #222f3e;
+}
+.tox .tox-dialog__body-content .accessibility-issue--error a.tox-button--naked.tox-button--icon:active {
+  background-color: #EE9494;
+  color: #222f3e;
 }
 .tox .tox-dialog__body-content .accessibility-issue--success .accessibility-issue__description {
   background-color: rgba(120, 171, 70, 0.1);
-  border-color: rgba(120, 171, 70, 0.4);
   color: #222f3e;
 }
 .tox .tox-dialog__body-content .accessibility-issue--success .accessibility-issue__description > *:last-child {
-  border-color: rgba(120, 171, 70, 0.4);
+  display: none;
 }
 .tox .tox-dialog__body-content .accessibility-issue--success .tox-form__group h2 {
-  color: #78AB46;
+  color: #527530;
 }
 .tox .tox-dialog__body-content .accessibility-issue--success .tox-icon svg {
-  fill: #78AB46;
-}
-.tox .tox-dialog__body-content .accessibility-issue--success a .tox-icon {
-  color: #78AB46;
+  fill: #527530;
 }
-.tox .tox-dialog__body-content .accessibility-issue__header h1,
+.tox .tox-dialog__body-content .accessibility-issue__header .tox-form__group h1,
 .tox .tox-dialog__body-content .tox-form__group .accessibility-issue__description h2 {
+  font-size: 14px;
   margin-top: 0;
 }
 .tox:not([dir=rtl]) .tox-dialog__body-content .accessibility-issue__header .tox-button {
@@ -210,10 +227,6 @@ button::-moz-focus-inner {
 .tox:not([dir=rtl]) .tox-dialog__body-content .accessibility-issue__description {
   padding: 4px 4px 4px 8px;
 }
-.tox:not([dir=rtl]) .tox-dialog__body-content .accessibility-issue__description > *:last-child {
-  border-left-width: 1px;
-  padding-left: 4px;
-}
 .tox[dir=rtl] .tox-dialog__body-content .accessibility-issue__header .tox-button {
   margin-right: 4px;
 }
@@ -223,10 +236,6 @@ button::-moz-focus-inner {
 .tox[dir=rtl] .tox-dialog__body-content .accessibility-issue__description {
   padding: 4px 8px 4px 4px;
 }
-.tox[dir=rtl] .tox-dialog__body-content .accessibility-issue__description > *:last-child {
-  border-right-width: 1px;
-  padding-right: 4px;
-}
 .tox .tox-anchorbar {
   display: flex;
   flex: 0 0 auto;
@@ -927,6 +936,22 @@ button::-moz-focus-inner {
 .tox .tox-swatches__picker-btn:hover {
   background: #dee0e2;
 }
+.tox div.tox-swatch:not(.tox-swatch--remove) svg {
+  display: none;
+  fill: #222f3e;
+  height: 24px;
+  margin: calc((30px - 24px) / 2) calc((30px - 24px) / 2);
+  width: 24px;
+}
+.tox div.tox-swatch:not(.tox-swatch--remove) svg path {
+  fill: #fff;
+  paint-order: stroke;
+  stroke: #222f3e;
+  stroke-width: 2px;
+}
+.tox div.tox-swatch:not(.tox-swatch--remove)[aria-checked="true"] svg {
+  display: block;
+}
 .tox:not([dir=rtl]) .tox-swatches__picker-btn {
   margin-left: auto;
 }
@@ -1537,6 +1562,8 @@ body.tox-dialog__disable-scroll {
   overflow: hidden;
 }
 .tox .tox-editor-header {
+  display: grid;
+  grid-template-columns: 1fr min-content;
   z-index: 1;
 }
 .tox:not(.tox-tinymce-inline) .tox-editor-header {
@@ -1547,7 +1574,7 @@ body.tox-dialog__disable-scroll {
   transition: box-shadow 0.5s;
 }
 .tox:not(.tox-tinymce-inline).tox-tinymce--toolbar-bottom .tox-editor-header {
-  border-top: 1px solid #c1c1c1;
+  border-top: 1px solid #cccccc;
   box-shadow: none;
 }
 .tox:not(.tox-tinymce-inline).tox-tinymce--toolbar-sticky-on .tox-editor-header {
@@ -1558,6 +1585,12 @@ body.tox-dialog__disable-scroll {
 .tox:not(.tox-tinymce-inline).tox-tinymce--toolbar-sticky-on.tox-tinymce--toolbar-bottom .tox-editor-header {
   box-shadow: 0 4px 4px -3px rgba(0, 0, 0, 0.25);
 }
+.tox.tox:not(.tox-tinymce-inline) .tox-editor-header.tox-editor-header--empty {
+  background: none;
+  border: none;
+  box-shadow: none;
+  padding: 0;
+}
 .tox-editor-dock-fadeout {
   opacity: 0;
   visibility: hidden;
@@ -2133,10 +2166,39 @@ body.tox-dialog__disable-scroll {
   flex: 0 0 auto;
   flex-shrink: 0;
   flex-wrap: wrap;
+  grid-column: 1 / -1;
+  grid-row: 1;
   padding: 0 4px 0 4px;
 }
-.tox.tox-tinymce:not(.tox-tinymce-inline) .tox-editor-header:not(:first-child) .tox-menubar {
-  border-top: 1px solid #cccccc;
+.tox .tox-promotion + .tox-menubar {
+  grid-column: 1;
+}
+.tox .tox-promotion {
+  background: url("data:image/svg+xml;charset=utf8,%3Csvg height='39px' viewBox='0 0 40 39px' width='40' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='0' y='38px' width='100' height='1' fill='%23cccccc'/%3E%3C/svg%3E") left 0 top 0 #fff;
+  background-color: #fff;
+  grid-column: 2;
+  grid-row: 1;
+  padding-inline-end: 8px;
+  padding-inline-start: 4px;
+  padding-top: 5px;
+}
+.tox .tox-promotion-link {
+  align-items: unsafe center;
+  background-color: #E8F1F8;
+  border-radius: 5px;
+  color: #086BE6;
+  cursor: pointer;
+  display: flex;
+  font-size: 14px;
+  height: 26.6px;
+  padding: 4px 8px;
+  white-space: nowrap;
+}
+.tox .tox-promotion-link:hover {
+  background-color: #B4D7FF;
+}
+.tox .tox-promotion-link:focus {
+  background-color: #D9EDF7;
 }
 /* Deprecated. Remove in next major release */
 .tox .tox-mbtn {
@@ -2885,6 +2947,7 @@ body.tox-dialog__disable-scroll {
 .tox .tox-toolbar,
 .tox .tox-toolbar__primary,
 .tox .tox-toolbar__overflow {
+  background-attachment: local;
   background-color: #fff;
   background-image: repeating-linear-gradient(#cccccc 0px 1px, transparent 1px 39px);
   background-position: center top 39px;
@@ -2916,10 +2979,14 @@ body.tox-dialog__disable-scroll {
 .tox .tox-toolbar__overflow--shrinking {
   transition: opacity 0.3s ease, height 0.2s linear 0.1s, visibility 0s linear 0.3s;
 }
+.tox .tox-toolbar-overlord,
+.tox .tox-anchorbar {
+  grid-column: 1 / -1;
+}
 .tox .tox-menubar + .tox-toolbar,
 .tox .tox-menubar + .tox-toolbar-overlord {
   border-top: 1px solid #cccccc;
-  margin-top: 0;
+  margin-top: -1px;
   padding-bottom: 0px;
   padding-top: 0px;
 }
@@ -2948,6 +3015,7 @@ body.tox-dialog__disable-scroll {
   border: none;
   border-radius: 3px;
   box-shadow: 0 0 2px 0 rgba(34, 47, 62, 0.2), 0 4px 8px 0 rgba(34, 47, 62, 0.15);
+  overscroll-behavior: none;
   padding: 4px 0;
 }
 .tox-pop .tox-pop__dialog {
@@ -3033,6 +3101,47 @@ body.tox-dialog__disable-scroll {
   top: 50%;
   transform: translateY(-50%);
 }
+.tox .tox-view-wrap,
+.tox .tox-view-wrap__slot-container {
+  background-color: #fff;
+  display: flex;
+  flex: 1;
+  flex-direction: column;
+}
+.tox .tox-view {
+  display: flex;
+  flex: 1;
+  flex-direction: column;
+}
+.tox .tox-view__header {
+  align-items: center;
+  display: flex;
+  font-size: 16px;
+  justify-content: space-between;
+  padding: 8px 8px 0 8px;
+  position: relative;
+}
+.tox .tox-view__header-start,
+.tox .tox-view__header-end {
+  display: flex;
+}
+.tox .tox-view__pane {
+  height: 100%;
+  padding: 8px;
+  width: 100%;
+}
+.tox .tox-view__pane_panel {
+  border: 1px solid #cccccc;
+  border-radius: 3px;
+}
+.tox:not([dir=rtl]) .tox-view__header .tox-view__header-start > *,
+.tox:not([dir=rtl]) .tox-view__header .tox-view__header-end > * {
+  margin-left: 8px;
+}
+.tox[dir=rtl] .tox-view__header .tox-view__header-start > *,
+.tox[dir=rtl] .tox-view__header .tox-view__header-end > * {
+  margin-right: 8px;
+}
 .tox .tox-well {
   border: 1px solid #cccccc;
   border-radius: 3px;
@@ -3086,6 +3195,9 @@ body.tox-dialog__disable-scroll {
 .tox.tox-tinymce-inline .tox-editor-header {
   margin-bottom: -1px;
 }
+.tox.tox-tinymce-inline .tox-editor-container {
+  overflow: hidden;
+}
 .tox:not(.tox-tinymce-inline).tox-tinymce--toolbar-bottom .tox-editor-header {
   border-top: none;
   box-shadow: none;
@@ -3129,6 +3241,12 @@ body.tox-dialog__disable-scroll {
   border: 1px solid #cccccc;
   padding: 0;
 }
+.tox .tox-pop .tox-pop__dialog .tox-toolbar {
+  padding: 0;
+}
+.tox:not(.tox-tinymce-inline) .tox-editor-header:not(:first-child) .tox-menubar {
+  border-top: 1px solid #cccccc;
+}
 .tox:not(.tox-tinymce-inline) .tox-editor-header:not(:first-child) .tox-toolbar-overlord:first-child .tox-toolbar__primary,
 .tox:not(.tox-tinymce-inline) .tox-editor-header:not(:first-child) .tox-toolbar:first-child {
   border-top: 1px solid #cccccc;