@gooddata/sdk-ui-ext 10.17.0-alpha.0 → 10.17.0-alpha.2

package/styles/internal/css/config_panel.css

@@ -1,3 +1,585 @@
+/* BASICS */
+.CodeMirror {
+  /* Set height, width, borders, and global font properties here */
+  font-family: monospace;
+  height: 300px;
+  color: black;
+  direction: ltr;
+}
+
+/* PADDING */
+.CodeMirror-lines {
+  padding: 4px 0; /* Vertical padding around content */
+}
+
+.CodeMirror pre.CodeMirror-line,
+.CodeMirror pre.CodeMirror-line-like {
+  padding: 0 4px; /* Horizontal padding of content */
+}
+
+.CodeMirror-scrollbar-filler, .CodeMirror-gutter-filler {
+  background-color: white; /* The little square between H and V scrollbars */
+}
+
+/* GUTTER */
+.CodeMirror-gutters {
+  border-right: 1px solid #ddd;
+  background-color: #f7f7f7;
+  white-space: nowrap;
+}
+
+.CodeMirror-linenumber {
+  padding: 0 3px 0 5px;
+  min-width: 20px;
+  text-align: right;
+  color: #999;
+  white-space: nowrap;
+}
+
+.CodeMirror-guttermarker {
+  color: black;
+}
+
+.CodeMirror-guttermarker-subtle {
+  color: #999;
+}
+
+/* CURSOR */
+.CodeMirror-cursor {
+  border-left: 1px solid black;
+  border-right: none;
+  width: 0;
+}
+
+/* Shown when moving in bi-directional text */
+.CodeMirror div.CodeMirror-secondarycursor {
+  border-left: 1px solid silver;
+}
+
+.cm-fat-cursor .CodeMirror-cursor {
+  width: auto;
+  border: 0 !important;
+  background: #7e7;
+}
+
+.cm-fat-cursor div.CodeMirror-cursors {
+  z-index: 1;
+}
+
+.cm-fat-cursor .CodeMirror-line::selection,
+.cm-fat-cursor .CodeMirror-line > span::selection,
+.cm-fat-cursor .CodeMirror-line > span > span::selection {
+  background: transparent;
+}
+
+.cm-fat-cursor .CodeMirror-line::-moz-selection,
+.cm-fat-cursor .CodeMirror-line > span::-moz-selection,
+.cm-fat-cursor .CodeMirror-line > span > span::-moz-selection {
+  background: transparent;
+}
+
+.cm-fat-cursor {
+  caret-color: transparent;
+}
+
+@-moz-keyframes blink {
+  50% {
+    background-color: transparent;
+  }
+}
+@-webkit-keyframes blink {
+  50% {
+    background-color: transparent;
+  }
+}
+@keyframes blink {
+  50% {
+    background-color: transparent;
+  }
+}
+/* Can style cursor different in overwrite (non-insert) mode */
+.cm-tab {
+  display: inline-block;
+  text-decoration: inherit;
+}
+
+.CodeMirror-rulers {
+  position: absolute;
+  left: 0;
+  right: 0;
+  top: -50px;
+  bottom: 0;
+  overflow: hidden;
+}
+
+.CodeMirror-ruler {
+  border-left: 1px solid #ccc;
+  top: 0;
+  bottom: 0;
+  position: absolute;
+}
+
+/* DEFAULT THEME */
+.cm-s-default .cm-header {
+  color: blue;
+}
+
+.cm-s-default .cm-quote {
+  color: #090;
+}
+
+.cm-negative {
+  color: #d44;
+}
+
+.cm-positive {
+  color: #292;
+}
+
+.cm-header, .cm-strong {
+  font-weight: bold;
+}
+
+.cm-em {
+  font-style: italic;
+}
+
+.cm-link {
+  text-decoration: underline;
+}
+
+.cm-strikethrough {
+  text-decoration: line-through;
+}
+
+.cm-s-default .cm-keyword {
+  color: #708;
+}
+
+.cm-s-default .cm-atom {
+  color: #219;
+}
+
+.cm-s-default .cm-number {
+  color: #164;
+}
+
+.cm-s-default .cm-def {
+  color: #00f;
+}
+
+.cm-s-default .cm-variable-2 {
+  color: #05a;
+}
+
+.cm-s-default .cm-variable-3, .cm-s-default .cm-type {
+  color: #085;
+}
+
+.cm-s-default .cm-comment {
+  color: #a50;
+}
+
+.cm-s-default .cm-string {
+  color: #a11;
+}
+
+.cm-s-default .cm-string-2 {
+  color: #f50;
+}
+
+.cm-s-default .cm-meta {
+  color: #555;
+}
+
+.cm-s-default .cm-qualifier {
+  color: #555;
+}
+
+.cm-s-default .cm-builtin {
+  color: #30a;
+}
+
+.cm-s-default .cm-bracket {
+  color: #997;
+}
+
+.cm-s-default .cm-tag {
+  color: #170;
+}
+
+.cm-s-default .cm-attribute {
+  color: #00c;
+}
+
+.cm-s-default .cm-hr {
+  color: #999;
+}
+
+.cm-s-default .cm-link {
+  color: #00c;
+}
+
+.cm-s-default .cm-error {
+  color: #f00;
+}
+
+.cm-invalidchar {
+  color: #f00;
+}
+
+.CodeMirror-composing {
+  border-bottom: 2px solid;
+}
+
+/* Default styles for common addons */
+div.CodeMirror span.CodeMirror-matchingbracket {
+  color: #0b0;
+}
+
+div.CodeMirror span.CodeMirror-nonmatchingbracket {
+  color: #a22;
+}
+
+.CodeMirror-matchingtag {
+  background: rgba(255, 150, 0, 0.3);
+}
+
+.CodeMirror-activeline-background {
+  background: #e8f2ff;
+}
+
+/* STOP */
+/* The rest of this file contains styles related to the mechanics of
+   the editor. You probably shouldn't touch them. */
+.CodeMirror {
+  position: relative;
+  overflow: hidden;
+  background: white;
+}
+
+.CodeMirror-scroll {
+  overflow: scroll !important; /* Things will break if this is overridden */
+  /* 50px is the magic margin used to hide the element's real scrollbars */
+  /* See overflow: hidden in .CodeMirror */
+  margin-bottom: -50px;
+  margin-right: -50px;
+  padding-bottom: 50px;
+  height: 100%;
+  outline: none; /* Prevent dragging from highlighting the element */
+  position: relative;
+  z-index: 0;
+}
+
+.CodeMirror-sizer {
+  position: relative;
+  border-right: 50px solid transparent;
+}
+
+/* The fake, visible scrollbars. Used to force redraw during scrolling
+   before actual scrolling happens, thus preventing shaking and
+   flickering artifacts. */
+.CodeMirror-vscrollbar, .CodeMirror-hscrollbar, .CodeMirror-scrollbar-filler, .CodeMirror-gutter-filler {
+  position: absolute;
+  z-index: 6;
+  display: none;
+  outline: none;
+}
+
+.CodeMirror-vscrollbar {
+  right: 0;
+  top: 0;
+  overflow-x: hidden;
+  overflow-y: scroll;
+}
+
+.CodeMirror-hscrollbar {
+  bottom: 0;
+  left: 0;
+  overflow-y: hidden;
+  overflow-x: scroll;
+}
+
+.CodeMirror-scrollbar-filler {
+  right: 0;
+  bottom: 0;
+}
+
+.CodeMirror-gutter-filler {
+  left: 0;
+  bottom: 0;
+}
+
+.CodeMirror-gutters {
+  position: absolute;
+  left: 0;
+  top: 0;
+  min-height: 100%;
+  z-index: 3;
+}
+
+.CodeMirror-gutter {
+  white-space: normal;
+  height: 100%;
+  display: inline-block;
+  vertical-align: top;
+  margin-bottom: -50px;
+}
+
+.CodeMirror-gutter-wrapper {
+  position: absolute;
+  z-index: 4;
+  background: none !important;
+  border: none !important;
+}
+
+.CodeMirror-gutter-background {
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  z-index: 4;
+}
+
+.CodeMirror-gutter-elt {
+  position: absolute;
+  cursor: default;
+  z-index: 4;
+}
+
+.CodeMirror-gutter-wrapper ::selection {
+  background-color: transparent;
+}
+
+.CodeMirror-gutter-wrapper ::-moz-selection {
+  background-color: transparent;
+}
+
+.CodeMirror-lines {
+  cursor: text;
+  min-height: 1px; /* prevents collapsing before first draw */
+}
+
+.CodeMirror pre.CodeMirror-line,
+.CodeMirror pre.CodeMirror-line-like {
+  /* Reset some styles that the rest of the page might have set */
+  -moz-border-radius: 0;
+  -webkit-border-radius: 0;
+  border-radius: 0;
+  border-width: 0;
+  background: transparent;
+  font-family: inherit;
+  font-size: inherit;
+  margin: 0;
+  white-space: pre;
+  word-wrap: normal;
+  line-height: inherit;
+  color: inherit;
+  z-index: 2;
+  position: relative;
+  overflow: visible;
+  -webkit-tap-highlight-color: transparent;
+  -webkit-font-variant-ligatures: contextual;
+  font-variant-ligatures: contextual;
+}
+
+.CodeMirror-wrap pre.CodeMirror-line,
+.CodeMirror-wrap pre.CodeMirror-line-like {
+  word-wrap: break-word;
+  white-space: pre-wrap;
+  word-break: normal;
+}
+
+.CodeMirror-linebackground {
+  position: absolute;
+  left: 0;
+  right: 0;
+  top: 0;
+  bottom: 0;
+  z-index: 0;
+}
+
+.CodeMirror-linewidget {
+  position: relative;
+  z-index: 2;
+  padding: 0.1px; /* Force widget margins to stay inside of the container */
+}
+
+.CodeMirror-rtl pre {
+  direction: rtl;
+}
+
+.CodeMirror-code {
+  outline: none;
+}
+
+/* Force content-box sizing for the elements where we expect it */
+.CodeMirror-scroll,
+.CodeMirror-sizer,
+.CodeMirror-gutter,
+.CodeMirror-gutters,
+.CodeMirror-linenumber {
+  -moz-box-sizing: content-box;
+  box-sizing: content-box;
+}
+
+.CodeMirror-measure {
+  position: absolute;
+  width: 100%;
+  height: 0;
+  overflow: hidden;
+  visibility: hidden;
+}
+
+.CodeMirror-cursor {
+  position: absolute;
+  pointer-events: none;
+}
+
+.CodeMirror-measure pre {
+  position: static;
+}
+
+div.CodeMirror-cursors {
+  visibility: hidden;
+  position: relative;
+  z-index: 3;
+}
+
+div.CodeMirror-dragcursors {
+  visibility: visible;
+}
+
+.CodeMirror-focused div.CodeMirror-cursors {
+  visibility: visible;
+}
+
+.CodeMirror-selected {
+  background: #d9d9d9;
+}
+
+.CodeMirror-focused .CodeMirror-selected {
+  background: #d7d4f0;
+}
+
+.CodeMirror-crosshair {
+  cursor: crosshair;
+}
+
+.CodeMirror-line::selection, .CodeMirror-line > span::selection, .CodeMirror-line > span > span::selection {
+  background: #d7d4f0;
+}
+
+.CodeMirror-line::-moz-selection, .CodeMirror-line > span::-moz-selection, .CodeMirror-line > span > span::-moz-selection {
+  background: #d7d4f0;
+}
+
+.cm-searching {
+  background-color: #ffa;
+  background-color: rgba(255, 255, 0, 0.4);
+}
+
+/* Used to force a border model for a node */
+.cm-force-border {
+  padding-right: 0.1px;
+}
+
+@media print {
+  /* Hide the cursor when printing */
+  .CodeMirror div.CodeMirror-cursors {
+    visibility: hidden;
+  }
+}
+/* See issue #2901 */
+.cm-tab-wrap-hack:after {
+  content: "";
+}
+
+/* Help users use markselection to safely style text background */
+span.CodeMirror-selectedtext {
+  background: none;
+}
+
+/* The lint marker gutter */
+.CodeMirror-lint-markers {
+  width: 16px;
+}
+
+.CodeMirror-lint-tooltip {
+  background-color: #ffd;
+  border: 1px solid black;
+  border-radius: 4px 4px 4px 4px;
+  color: black;
+  font-family: monospace;
+  font-size: 10pt;
+  overflow: hidden;
+  padding: 2px 5px;
+  position: fixed;
+  white-space: pre;
+  white-space: pre-wrap;
+  z-index: 100;
+  max-width: 600px;
+  opacity: 0;
+  transition: opacity 0.4s;
+  -moz-transition: opacity 0.4s;
+  -webkit-transition: opacity 0.4s;
+  -o-transition: opacity 0.4s;
+  -ms-transition: opacity 0.4s;
+}
+
+.CodeMirror-lint-mark {
+  background-position: left bottom;
+  background-repeat: repeat-x;
+}
+
+.CodeMirror-lint-mark-warning {
+  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAADCAYAAAC09K7GAAAAAXNSR0IArs4c6QAAAAZiS0dEAP8A/wD/oL2nkwAAAAlwSFlzAAALEwAACxMBAJqcGAAAAAd0SU1FB9sJFhQXEbhTg7YAAAAZdEVYdENvbW1lbnQAQ3JlYXRlZCB3aXRoIEdJTVBXgQ4XAAAAMklEQVQI12NkgIIvJ3QXMjAwdDN+OaEbysDA4MPAwNDNwMCwiOHLCd1zX07o6kBVGQEAKBANtobskNMAAAAASUVORK5CYII=");
+}
+
+.CodeMirror-lint-mark-error {
+  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAADCAYAAAC09K7GAAAAAXNSR0IArs4c6QAAAAZiS0dEAP8A/wD/oL2nkwAAAAlwSFlzAAALEwAACxMBAJqcGAAAAAd0SU1FB9sJDw4cOCW1/KIAAAAZdEVYdENvbW1lbnQAQ3JlYXRlZCB3aXRoIEdJTVBXgQ4XAAAAHElEQVQI12NggIL/DAz/GdA5/xkY/qPKMDAwAADLZwf5rvm+LQAAAABJRU5ErkJggg==");
+}
+
+.CodeMirror-lint-marker {
+  background-position: center center;
+  background-repeat: no-repeat;
+  cursor: pointer;
+  display: inline-block;
+  height: 16px;
+  width: 16px;
+  vertical-align: middle;
+  position: relative;
+}
+
+.CodeMirror-lint-message {
+  padding-left: 18px;
+  background-position: top left;
+  background-repeat: no-repeat;
+}
+
+.CodeMirror-lint-marker-warning, .CodeMirror-lint-message-warning {
+  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAMAAAAoLQ9TAAAANlBMVEX/uwDvrwD/uwD/uwD/uwD/uwD/uwD/uwD/uwD6twD/uwAAAADurwD2tQD7uAD+ugAAAAD/uwDhmeTRAAAADHRSTlMJ8mN1EYcbmiixgACm7WbuAAAAVklEQVR42n3PUQqAIBBFUU1LLc3u/jdbOJoW1P08DA9Gba8+YWJ6gNJoNYIBzAA2chBth5kLmG9YUoG0NHAUwFXwO9LuBQL1giCQb8gC9Oro2vp5rncCIY8L8uEx5ZkAAAAASUVORK5CYII=");
+}
+
+.CodeMirror-lint-marker-error, .CodeMirror-lint-message-error {
+  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAMAAAAoLQ9TAAAAHlBMVEW7AAC7AACxAAC7AAC7AAAAAAC4AAC5AAD///+7AAAUdclpAAAABnRSTlMXnORSiwCK0ZKSAAAATUlEQVR42mWPOQ7AQAgDuQLx/z8csYRmPRIFIwRGnosRrpamvkKi0FTIiMASR3hhKW+hAN6/tIWhu9PDWiTGNEkTtIOucA5Oyr9ckPgAWm0GPBog6v4AAAAASUVORK5CYII=");
+}
+
+.CodeMirror-lint-marker-multiple {
+  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAcAAAAHCAMAAADzjKfhAAAACVBMVEUAAAAAAAC/v7914kyHAAAAAXRSTlMAQObYZgAAACNJREFUeNo1ioEJAAAIwmz/H90iFFSGJgFMe3gaLZ0od+9/AQZ0ADosbYraAAAAAElFTkSuQmCC");
+  background-repeat: no-repeat;
+  background-position: right bottom;
+  width: 100%;
+  height: 100%;
+}
+
+.CodeMirror-lint-line-error {
+  background-color: rgba(183, 76, 81, 0.08);
+}
+
+.CodeMirror-lint-line-warning {
+  background-color: rgba(255, 211, 0, 0.1);
+}
+
 .color-picker-wrapper {
   display: flex;
   justify-content: center;
@@ -254,4 +836,194 @@
   margin-top: 15px;
 }
 
+.gd-advanced-section.adi-bucket-configuration {
+  display: flex;
+  flex-direction: column;
+  gap: 10px;
+  padding: 0 0 15px 0;
+  align-items: center;
+}
+.gd-advanced-section.adi-bucket-configuration .gd-chart-override-value-preview {
+  width: 100%;
+  max-height: 150px;
+  overflow: hidden;
+  border-bottom: 1px solid var(--gd-palette-complementary-3, #dde4eb);
+  color: var(--gd-palette-complementary-1, #303442);
+}
+.gd-advanced-section.adi-bucket-configuration .gd-chart-override-value {
+  width: calc(100% - 26px);
+  padding: 13px;
+  margin: 0;
+  background: rgba(255, 255, 255, 0.6);
+  font-size: 11px;
+  white-space: pre-wrap;
+}
+.gd-advanced-section.adi-bucket-configuration .fade-out {
+  mask-image: linear-gradient(to bottom, black 50%, transparent 90%, transparent calc(100% - 1px), black 90%);
+}
+.gd-advanced-section.adi-bucket-configuration .gd-chart-override-no-value {
+  color: var(--gd-palette-complementary-6, #94a1ad);
+  font-size: 12px;
+  padding-top: 14px;
+}
+.gd-advanced-section.adi-bucket-configuration .gd-chart-override-link {
+  font-size: 12px;
+}
+
+.gd-icon-code {
+  background-image: url("~@gooddata/sdk-ui-ext/esm/internal/assets/icons/icon-code.svg");
+}
+
+.gd-advanced-customization-dialog {
+  display: flex;
+  flex-direction: column;
+  width: 600px;
+  height: inherit;
+  font-size: 12px;
+}
+.gd-advanced-customization-dialog .gd-advanced-customization-dialog__header {
+  display: flex;
+  justify-content: space-between;
+  padding: 10px 12px;
+  background-color: var(--gd-palette-complementary-2, #ebeff4);
+  border-bottom: 1px solid var(--gd-palette-complementary-3, #dde4eb);
+}
+.gd-advanced-customization-dialog .gd-advanced-customization-dialog__header > span {
+  color: var(--gd-palette-complementary-6, #94a1ad);
+  text-transform: uppercase;
+  font-size: 11px;
+  font-weight: bold;
+}
+.gd-advanced-customization-dialog .gd-advanced-customization-dialog__header .gd-button-link {
+  width: 12px;
+  height: 19px;
+  line-height: 12px;
+}
+.gd-advanced-customization-dialog .gd-advanced-customization-dialog__header .gd-button-link::before {
+  font-size: 12px;
+}
+.gd-advanced-customization-dialog .gd-advanced-customization-dialog__content {
+  display: flex;
+}
+.gd-advanced-customization-dialog .gd-advanced-customization-dialog__main {
+  width: 400px;
+  padding: 10px;
+}
+.gd-advanced-customization-dialog .gd-advanced-customization-dialog__snippets {
+  width: 200px;
+  max-height: 320px;
+  overflow: auto;
+  border-left: 1px solid var(--gd-palette-complementary-3, #dde4eb);
+  color: var(--gd-palette-complementary-8, #464e56);
+  padding: 0 5px;
+}
+.gd-advanced-customization-dialog .gd-advanced-customization-dialog__snippets--header {
+  display: flex;
+  align-items: center;
+  gap: 5px;
+  text-transform: uppercase;
+  font-weight: bold;
+  padding: 10px 5px;
+  color: var(--gd-palette-complementary-6, #94a1ad);
+  font-size: 10px;
+}
+.gd-advanced-customization-dialog .gd-advanced-customization-dialog__snippets--header .gd-advanced-customization-dialog__snippets--header__line {
+  flex-grow: 1;
+  border-top: 1px solid var(--gd-palette-complementary-3, #dde4eb);
+}
+.gd-advanced-customization-dialog .gd-advanced-customization-dialog__snippet--header {
+  text-transform: uppercase;
+  color: var(--gd-palette-complementary-6, #94a1ad);
+  padding: 5px;
+  font-size: 11px;
+}
+.gd-advanced-customization-dialog .gd-advanced-customization-dialog__snippet {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 5px;
+  cursor: pointer;
+  font-size: 12px;
+}
+.gd-advanced-customization-dialog .gd-advanced-customization-dialog__snippet .gd-advanced-customization-dialog__snippet__tooltip__trigger {
+  display: none;
+}
+.gd-advanced-customization-dialog .gd-advanced-customization-dialog__snippet:hover {
+  background: var(--gd-palette-complementary-2, #ebeff4);
+}
+.gd-advanced-customization-dialog .gd-advanced-customization-dialog__snippet:hover .gd-advanced-customization-dialog__snippet__tooltip__trigger {
+  display: block;
+}
+.gd-advanced-customization-dialog .gd-advanced-customization-dialog__footer {
+  display: flex;
+  justify-content: space-between;
+  padding: 10px;
+  border-top: 1px solid var(--gd-palette-complementary-3, #dde4eb);
+  text-align: right;
+}
+
+.gd-advanced-customization-dialog__snippet__tooltip {
+  padding: 10px;
+}
+
+.gd-advanced-customization-dialog__snippet__tooltip__header {
+  font-size: 14px;
+  margin-bottom: 10px;
+}
+
+.gd-advanced-customization-dialog__snippet__tooltip__body {
+  font-size: 12px;
+  color: var(--gd-palette-complementary-7, #6d7680);
+}
+
+.cm-s-gd-advanced-customization-dialog__theme.CodeMirror {
+  border: 1px solid var(--gd-palette-complementary-3, #dde4eb);
+  border-radius: 3px;
+}
+.cm-s-gd-advanced-customization-dialog__theme.CodeMirror .cm-keyword {
+  color: #7364cf;
+}
+.cm-s-gd-advanced-customization-dialog__theme.CodeMirror .cm-variable,
+.cm-s-gd-advanced-customization-dialog__theme.CodeMirror .cm-atom {
+  color: #7364cf;
+}
+.cm-s-gd-advanced-customization-dialog__theme.CodeMirror .cm-string,
+.cm-s-gd-advanced-customization-dialog__theme.CodeMirror .cm-meta {
+  color: #464e56;
+}
+.cm-s-gd-advanced-customization-dialog__theme.CodeMirror .cm-number {
+  color: #464e56;
+}
+.cm-s-gd-advanced-customization-dialog__theme.CodeMirror .cm-comment {
+  color: #94a1ad;
+  font-style: italic;
+}
+.cm-s-gd-advanced-customization-dialog__theme.CodeMirror .CodeMirror-gutters {
+  background: #fff;
+  border-right: 1px solid #ebeff4;
+}
+.cm-s-gd-advanced-customization-dialog__theme.CodeMirror .CodeMirror-lint-marker-error {
+  background-image: url("~@gooddata/sdk-ui-ext/esm/internal/assets/icons/icon-error.svg");
+  background-size: 12px 12px;
+}
+.cm-s-gd-advanced-customization-dialog__theme.CodeMirror .CodeMirror-line {
+  padding: 0 10px;
+}
+
+.gd-advanced-customization-dialog__theme.CodeMirror-lint-tooltip {
+  z-index: 6000;
+  border: 1px solid var(--gd-palette-complementary-3, #dde4eb);
+  background: white;
+  color: var(--gd-palette-complementary-8, #464e56);
+  padding: 10px;
+}
+.gd-advanced-customization-dialog__theme.CodeMirror-lint-tooltip .CodeMirror-lint-message {
+  padding-left: 25px;
+  background-position: top 4px left;
+}
+.gd-advanced-customization-dialog__theme.CodeMirror-lint-tooltip .CodeMirror-lint-message-error {
+  background-image: url("~@gooddata/sdk-ui-ext/esm/internal/assets/icons/icon-error.svg");
+  background-size: 12px 12px;
+}
+
 /*# sourceMappingURL=config_panel.css.map */