forms.less 14.26 KiB
//
// Forms
// --------------------------------------------------
// GENERAL STYLES
// --------------
// Make all forms have space below them
form {
  margin: 0 0 @baseLineHeight;
fieldset {
  padding: 0;
  margin: 0;
  border: 0;
// Groups of fields with labels on top (legends)
legend {
  display: block;
  width: 100%;
  padding: 0;
  margin-bottom: @baseLineHeight;
  font-size: @baseFontSize * 1.5;
  line-height: @baseLineHeight * 2;
  color: @grayDark;
  border: 0;
  border-bottom: 1px solid #e5e5e5;
  // Small
  small {
    font-size: @baseLineHeight * .75;
    color: @grayLight;
// Set font for forms
label,
input,
button,
select,
textarea {
  #font > .shorthand(@baseFontSize,normal,@baseLineHeight); // Set size, weight, line-height here
input,
button,
select,
textarea {
  font-family: @baseFontFamily; // And only set font-family here for those that need it (note the missing label element)
// Identify controls by their labels
label {
  display: block;
  margin-bottom: 5px;
// Form controls
// -------------------------
// Shared size and type resets
select,
textarea,
input[type="text"],
input[type="password"],
input[type="datetime"],
input[type="datetime-local"],
input[type="date"],