Misago/uiframework/misago/css/misago/forms.less

//
// Form page
// --------------------------------------------------


//== Form container
//
//**
.form-panel {
  background: @form-panel-bg;
  border: 1px solid @form-panel-border;
  border-radius: @border-radius-large;
  box-shadow: 0px 0px 0px 3px @form-panel-shadow;

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


//== Form header
//
//**
.form-panel {
  .form-header {
    padding: @form-panel-padding;

    h1, h2 {
      margin: 0px;
    }

    h1 {
      font-size: @font-size-large * 1.6;
    }

    h2 {
      font-size: @font-size-large * 1.2;
    }

    p {
      margin: (@line-height-computed / 2) 0px 0px 0px;
    }
  }
}


//== Form body
//
//**
.form-panel {
  .form-body {
    fieldset, &.no-fieldsets {
      margin: 0px;
      padding-bottom: @line-height-computed * .25;

      legend {
        border-top: 1px solid @form-panel-border;
        border-bottom: 0px;
        padding: @form-panel-padding;
        padding-bottom: 0px;
        margin-bottom: @line-height-computed * .6;

        font-size: @font-size-large;
      }

      .form-group {
        margin-left: @form-panel-padding-horizontal;
        margin-right: @form-panel-padding-horizontal;
      }

      .help-block {
        color: @field-help-block-color;
        margin-bottom: 0px;
        padding-bottom: 0px;
      }
    }

    &.no-fieldsets {
      border-top: 1px solid @form-panel-border;
      padding: 0px;
      padding-top: @line-height-computed;
      padding-bottom: @line-height-computed * .25;
    }
  }
}


//== Form alerts
//
//**
.form-panel {
  .misago-alerts {
    margin: 0px @form-panel-padding-vertical;

    .alert.lead {
      font-size: @font-size-large;
    }
  }
}


//== Form footer
//
//**
.form-panel {
  .form-footer {
    background-color: @form-panel-footer-bg;
    border-radius: 0px 0px (@border-radius-large - 1px) (@border-radius-large - 1px);
    border-top: 1px solid @form-panel-border;
    padding: @form-panel-padding;

    &>.row>div {
      padding: 0px @padding-base-horizontal * 2;
    }

    a.extra, p.extra {
      margin-top: @line-height-computed;
    }

    a.extra {
      display: inline-block;
    }

    div.extra {
      margin-top: @line-height-computed + @form-panel-padding-vertical / 2;
    }
  }
}


/* Big displays */
@media (min-width: @screen-sm-min) {
  .form-panel {
    .form-footer {
      p.extra {
        display: inline-block;
      }

      a.extra, p.extra {
        margin-top: 0px;
        margin-bottom: 0px;
        margin-left: @padding-base-horizontal;
      }
    }
  }
}