@smui/form-field/bare.css

Svelte Material UI - Form Field

.mdc-form-field {
  display: inline-flex;
}
.mdc-form-field[hidden] {
  display: none;
}
.mdc-form-field {
  align-items: center;
  vertical-align: middle;
}
.mdc-form-field > label {
  /* @noflip */ /*rtl:ignore*/
  margin-left: 0;
  /* @noflip */ /*rtl:ignore*/
  margin-right: auto;
}
[dir=rtl] .mdc-form-field > label, .mdc-form-field > label[dir=rtl] {
  /*rtl:begin:ignore*/
  /* @noflip */ /*rtl:ignore*/
  margin-left: auto;
  /* @noflip */ /*rtl:ignore*/
  margin-right: 0;
  /*rtl:end:ignore*/
}

.mdc-form-field > label {
  /* @noflip */ /*rtl:ignore*/
  padding-left: 4px;
  /* @noflip */ /*rtl:ignore*/
  padding-right: 0;
}
[dir=rtl] .mdc-form-field > label, .mdc-form-field > label[dir=rtl] {
  /*rtl:begin:ignore*/
  /* @noflip */ /*rtl:ignore*/
  padding-left: 0;
  /* @noflip */ /*rtl:ignore*/
  padding-right: 4px;
  /*rtl:end:ignore*/
}

.mdc-form-field > label {
  order: 0;
}

.mdc-form-field--nowrap > label {
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

.mdc-form-field--align-end > label {
  /* @noflip */ /*rtl:ignore*/
  margin-left: auto;
  /* @noflip */ /*rtl:ignore*/
  margin-right: 0;
}
[dir=rtl] .mdc-form-field--align-end > label, .mdc-form-field--align-end > label[dir=rtl] {
  /*rtl:begin:ignore*/
  /* @noflip */ /*rtl:ignore*/
  margin-left: 0;
  /* @noflip */ /*rtl:ignore*/
  margin-right: auto;
  /*rtl:end:ignore*/
}

.mdc-form-field--align-end > label {
  /* @noflip */ /*rtl:ignore*/
  padding-left: 0;
  /* @noflip */ /*rtl:ignore*/
  padding-right: 4px;
}
[dir=rtl] .mdc-form-field--align-end > label, .mdc-form-field--align-end > label[dir=rtl] {
  /*rtl:begin:ignore*/
  /* @noflip */ /*rtl:ignore*/
  padding-left: 4px;
  /* @noflip */ /*rtl:ignore*/
  padding-right: 0;
  /*rtl:end:ignore*/
}

.mdc-form-field--align-end > label {
  order: -1;
}

.mdc-form-field--space-between {
  justify-content: space-between;
}
.mdc-form-field--space-between > label {
  margin: 0;
}
[dir=rtl] .mdc-form-field--space-between > label, .mdc-form-field--space-between > label[dir=rtl] {
  /*rtl:begin:ignore*/
  margin: 0;
  /*rtl:end:ignore*/
}

.mdc-form-field {
  font-family: Roboto, sans-serif;
  /* @alternate */
  font-family: var(--mdc-form-field-label-text-font, Roboto, sans-serif);
  line-height: 1.25rem;
  /* @alternate */
  line-height: var(--mdc-form-field-label-text-line-height, 1.25rem);
  font-size: 0.875rem;
  /* @alternate */
  font-size: var(--mdc-form-field-label-text-size, 0.875rem);
  font-weight: 400;
  /* @alternate */
  font-weight: var(--mdc-form-field-label-text-weight, 400);
  letter-spacing: 0.0178571429em;
  /* @alternate */
  letter-spacing: var(--mdc-form-field-label-text-tracking, 0.0178571429em);
  color: rgba(0, 0, 0, 0.87);
  /* @alternate */
  color: var(--mdc-form-field-label-text-color, var(--mdc-theme-text-primary-on-background, rgba(0, 0, 0, 0.87)));
}