diff --git a/docs/assets/css/bootstrap.css b/docs/assets/css/bootstrap.css index 65e0c870fd..239de594a7 100644 --- a/docs/assets/css/bootstrap.css +++ b/docs/assets/css/bootstrap.css @@ -3175,6 +3175,26 @@ input[type="submit"].btn.btn-mini { *padding-bottom: 1px; } +.btn-link { + color: #0088cc; + cursor: pointer; + background-color: transparent; + background-image: none; + border-color: transparent; + -webkit-border-radius: 0; + -moz-border-radius: 0; + border-radius: 0; + -webkit-box-shadow: none; + -moz-box-shadow: none; + box-shadow: none; +} + +.btn-link:hover { + color: #005580; + text-decoration: underline; + background-color: transparent; +} + .btn-group { position: relative; *margin-left: .3em; diff --git a/docs/assets/css/docs.css b/docs/assets/css/docs.css index 844b395778..e2cb315fb1 100644 --- a/docs/assets/css/docs.css +++ b/docs/assets/css/docs.css @@ -93,7 +93,7 @@ hr.soften { padding: 40px 0; color: #fff; text-align: center; - text-shadow: 0 1px 5px rgba(0,0,0,.3), 0 0 30px rgba(0,0,0,.075); + text-shadow: 0 1px 3px rgba(0,0,0,.4), 0 0 30px rgba(0,0,0,.075); background: #020031; /* Old browsers */ background: -moz-linear-gradient(45deg, #020031 0%, #6d3353 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left bottom, right top, color-stop(0%,#020031), color-stop(100%,#6d3353)); /* Chrome,Safari4+ */ @@ -146,7 +146,7 @@ hr.soften { bottom: 0; left: 0; background: url(../img/bs-docs-masthead-pattern.png) repeat center center; - opacity: .5; + opacity: .3; } /* Masthead (docs home) diff --git a/docs/base-css.html b/docs/base-css.html index a6b545c1d9..a23008dd1a 100644 --- a/docs/base-css.html +++ b/docs/base-css.html @@ -712,12 +712,14 @@ For example, <code>section</code> should be wrapped as inline.
-<tr class="success">
-  <td>1</td>
-  <td>TB - Monthly</td>
-  <td>01/04/2012</td>
-  <td>Approved</td>
-</tr>
+...
+  <tr class="success">
+    <td>1</td>
+    <td>TB - Monthly</td>
+    <td>01/04/2012</td>
+    <td>Approved</td>
+  </tr>
+...
 
@@ -1423,6 +1425,11 @@ For example, <code>section</code> should be wrapped as inline. btn btn-inverse Alternate dark gray button, not tied to a semantic action or use + + + btn btn-link + Deemphasize a button by making it look like a link while maintaining button behavior + diff --git a/docs/templates/pages/base-css.mustache b/docs/templates/pages/base-css.mustache index c150521cc4..4819745913 100644 --- a/docs/templates/pages/base-css.mustache +++ b/docs/templates/pages/base-css.mustache @@ -1362,6 +1362,11 @@ btn btn-inverse {{_i}}Alternate dark gray button, not tied to a semantic action or use{{/i}} + + + btn btn-link + {{_i}}Deemphasize a button by making it look like a link while maintaining button behavior{{/i}} + diff --git a/less/buttons.less b/less/buttons.less index b25d971805..8bdf34b20a 100644 --- a/less/buttons.less +++ b/less/buttons.less @@ -173,3 +173,27 @@ input[type="submit"].btn { *padding-bottom: 1px; } } + + +// Link buttons +// -------------------------------------------------- + +// Make a button look and behave like a link +.btn-link { + background-color: transparent; + background-image: none; + border-color: transparent; + cursor: pointer; + color: @linkColor; + -webkit-border-radius: 0; + -moz-border-radius: 0; + border-radius: 0; + -webkit-box-shadow: none; + -moz-box-shadow: none; + box-shadow: none; +} +.btn-link:hover { + color: @linkColorHover; + text-decoration: underline; + background-color: transparent; +}