rooty/Bootstrap
0
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2025-02-06 04:08:22 +01:00
Code Issues Actions Packages Releases Activity

shoutout to outline buttons

Browse Source
This commit is contained in:
Mark Otto 2015-08-09 22:48:48 -07:00
parent 91d236664d
commit 68e4d897ba
2 changed files with 19 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
docs/components/buttons.md
View File

@ -54,6 +54,19 @@ When using button classes on `<a>` elements that are used to trigger in-page fun
<input class="btn btn-primary" type="submit" value="Submit"> <input class="btn btn-primary" type="submit" value="Submit">
{% endexample %} {% endexample %}
## Outline buttons
In need of a button, but not the hefty background colors they bring? Add the `.btn-outline` modifier class to remove all background images and colors on any button.
{% example html %}
<button type="button" class="btn btn-primary btn-outline">Primary</button>
<button type="button" class="btn btn-secondary btn-outline">Secondary</button>
<button type="button" class="btn btn-success btn-outline">Success</button>
<button type="button" class="btn btn-warning btn-outline">Warning</button>
<button type="button" class="btn btn-danger btn-outline">Danger</button>
{% endexample %}
## Sizes ## Sizes
Fancy larger or smaller buttons? Add `.btn-lg`, `.btn-sm`, or `.btn-xs` for additional sizes. Fancy larger or smaller buttons? Add `.btn-lg`, `.btn-sm`, or `.btn-xs` for additional sizes.

6
scss/_buttons.scss
View File

@ -82,6 +82,12 @@ fieldset[disabled] a.btn {
@include button-variant($btn-danger-color, $btn-danger-bg, $btn-danger-border); @include button-variant($btn-danger-color, $btn-danger-bg, $btn-danger-border);
} }
// Remove all backgrounds
.btn-outline {
background-color: $body-bg;
background-image: transparent;
}
// //
// Link buttons // Link buttons