Button

<!-- Default -->
<input type="submit" class="button" value="Submit">

<!-- A -->
<a class="button" href="/foo">Submit</a>

<!-- Button -->
<button class="button">
Submit
</button>

<!-- Default -->
<input type="submit" class="button" value="Submit">

<!-- A -->
<a class="button" href="/foo">Submit</a>

<!-- Button -->
<button class="button">
Submit
</button>
/* Default */
{
  "text": "Go!"
}

/* A */
{
  "text": "Go!"
}

/* Button */
{
  "text": "Go!"
}

  • Content:
    button::-moz-focus-inner {border:0;padding:0;margin:0;}
    
    .button {
      display: inline-block;
      border: none;
      background-color: transparent;
      border-radius: 2px;
      font-size: 93%;
      padding: 0;
      margin: 0;
      text-decoration: none;
      line-height: normal;
      color: #000;
      cursor: pointer;
    }
    
    .button.to-the-top {
      position: absolute;
      top: 28px;
      right: 24px;
    }
  • URL: /components/raw/button/button.scss
  • Filesystem Path: src/components/13-navigation/01-buttons/01-atoms/01-button/button.scss
  • Size: 365 Bytes

These are notes about my button.