wix-style-react/dist/src/FieldSet/components/StatusMessage/StatusMessage.st.css

wix-style-react

@st-import [ labelChildrenSpacingMap ] from '../../FieldSet.st.css';

:import {
  -st-from: '../../../Foundation/stylable/colors.st.css';
  -st-named: R10, Y10;
}

.root {
  -st-states: status(enum(error, warning)), labelPlacement(enum(top, left, right, none)), labelSize(enum(tiny, small));
  display: flex;
  gap: 3px;
  margin-top: 6px;
}

.root:labelPlacement(left) {
  order: 3;
  grid-column-start: 2;
  grid-column-end: 3;
}

.root:labelSize(tiny):labelPlacement(left) {
  padding-left: value(labelChildrenSpacingMap, tiny);
}

.root:labelSize(small):labelPlacement(left) {
  padding-left: value(labelChildrenSpacingMap, small);
}

.root:labelPlacement(right) {
  order: 3;
  grid-column-start: 1;
  grid-column-end: 3;
}

.root:status(error) .statusIcon {
  color: value(R10);
}

.root:status(warning) .statusIcon {
  color: value(Y10);
}

.root:labelSize(tiny) .statusIcon {
  height: 16px;
  overflow: hidden;
  display: flex;
  align-items: center;
}

/* st-namespace-reference="../../../../../src/FieldSet/components/StatusMessage/StatusMessage.st.css" */