Misago/emberapp/app/styles/misago/forms.less

//
// Forms
// --------------------------------------------------


// Add custom variables for extra customizability
.panel-form {
  background: @panel-form-bg;
  border: none;
  .shadow-2dp();

  .panel-variant(@panel-form-border;  @panel-form-heading-color; @panel-form-heading-bg; @panel-form-heading-border);

  .panel-heading {
    padding: @panel-form-heading-padding;
  }

  .panel-body {
    padding: @panel-form-body-padding;
  }

  .panel-footer {
    background: @panel-form-footer-bg;
    border-top-color: @panel-form-footer-border;
  }
}


// Panel well
.panel-form {
  .panel-body {
    .well {
      background: @panel-form-well-bg;
      border: 1px solid @panel-form-well-border;
      .box-shadow(none);

      .well-label {
        color: @panel-form-well-label;
      }
    }
  }
}


// Footer extra
.footer-extra {
  margin-top: @line-height-computed;
}


// Help-block
.form-group {
  .help-block {
    margin-bottom: 0px;
    padding: 0px;

    font-size: @font-size-small;

    &.errors {
      font-weight: bold;

      p {
        margin-bottom: @font-size-small / 2;
        padding: 0px;
      }

      &:last-child {
        margin-bottom: 0px;
      };
    }
  }
}


// Loading/error states
.panel-form {
  .panel-loader {
    padding: @line-height-computed * 1.5 0px;

    text-align: center;
  }

  .panel-error {
    padding: @line-height-computed 0px;

    text-align: center;

    .error-icon {
      padding-bottom: @line-height-computed;

      .material-icons {
        font-size: @font-size-large * 4;
      }
    }

    .error-message {
      font-size: @font-size-large;

      p {
        margin-bottom: 0px;
      }
    }
  }
}


// Fieldset
fieldset {
  legend {
    font-size: @font-size-base;
  }
}


// Inputs well, useful if there's one input + button
.well-form {
  background: @panel-form-bg;
  border-color: @panel-form-border;
  .shadow-2dp();

  form {
    margin: 0px;
    padding: 0px;
  }
}