nowk
2/3/2012 - 8:07 PM

A basic reset/style base for formtastic

A basic reset/style base for formtastic

.formtastic {
  ol, ul {
    list-style-type: none;

    li {
      font-family: "Lucida Grande", Lucida, Verdana, sans-serif;
      margin-bottom: 10px;

      label {
        display: block;
        margin-bottom: 3px;
        font-size: 0.8em;

        abbr[title='required'] {
          color: red;
        }
      }

      input, textarea {
        font-family: "Lucida Grande", Lucida, Verdana, sans-serif;
        font-size: 0.8em;
        padding: 5px 7px;

        outline: 0;
      }

      select {
        font-size: 0.8em;
      }

      input, textarea {
        color: #757573;
      }

      input[type='checkbox'], input[type='radio'] {
        font-size: 1.2em;
      }

      .inline-errors {
        font-size: 0.7em;
        font-style: italic;
        font-weight: bold;
        color: red;
      }

      &.error {
        label {
          color: red;
        }
      }
    }
  }

  .button, footer {
    padding-top: 10px;
    border-top: 1px solid #aeaeae;
  }

  .errors {
    background-color: #ff762b;
    padding: 10px 10px 5px 10px;
    margin-bottom: 10px;

    li {
      font-size: 0.8em;
      margin-bottom: 5px;
    }
  }
}