fixes #3845: add .btn-link for transparent buttons styled as links

diff --git a/docs/assets/css/bootstrap.css b/docs/assets/css/bootstrap.css
index 65e0c870fd51869aa861aa3f4e2d9c73897a23ca..239de594a7a4192ba27f79a5ca1835d623461941 100644 (file)
--- 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 844b395778a8276855354fd567790fbb8c99cfe6..e2cb315fb104e2681b79e640415f0b55ba20e844 100644 (file)
--- 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 a6b545c1d9fb1b2ce077b200eed2bc3bc9154c2d..a23008dd1a0aef40b892113cad8f38f71c8b189e 100644 (file)
--- a/docs/base-css.html
+++ b/docs/base-css.html
@@ -712,12 +712,14 @@ For example, <code>section</code> should be wrapped as inline.
           </table>
         </div>
 <pre class="prettyprint linenums">
-&lt;tr class="success"&gt;
-  &lt;td&gt;1&lt;/td&gt;
-  &lt;td&gt;TB - Monthly&lt;/td&gt;
-  &lt;td&gt;01/04/2012&lt;/td&gt;
-  &lt;td&gt;Approved&lt;/td&gt;
-&lt;/tr&gt;
+...
+  &lt;tr class="success"&gt;
+    &lt;td&gt;1&lt;/td&gt;
+    &lt;td&gt;TB - Monthly&lt;/td&gt;
+    &lt;td&gt;01/04/2012&lt;/td&gt;
+    &lt;td&gt;Approved&lt;/td&gt;
+  &lt;/tr&gt;
+...
 </pre>
 
 
@@ -1423,6 +1425,11 @@ For example, &lt;code&gt;section&lt;/code&gt; should be wrapped as inline.
               <td><code>btn btn-inverse</code></td>
               <td>Alternate dark gray button, not tied to a semantic action or use</td>
             </tr>
+            <tr>
+              <td><button type="button" class="btn btn-link">Link</button></td>
+              <td><code>btn btn-link</code></td>
+              <td>Deemphasize a button by making it look like a link while maintaining button behavior</td>
+            </tr>
           </tbody>
         </table>
 

diff --git a/docs/templates/pages/base-css.mustache b/docs/templates/pages/base-css.mustache
index c150521cc4392ad39a567eb54d415c5381676e95..4819745913eca51cb4e3fe8fb24f450858da0059 100644 (file)
--- a/docs/templates/pages/base-css.mustache
+++ b/docs/templates/pages/base-css.mustache
@@ -1362,6 +1362,11 @@
               <td><code>btn btn-inverse</code></td>
               <td>{{_i}}Alternate dark gray button, not tied to a semantic action or use{{/i}}</td>
             </tr>
+            <tr>
+              <td><button type="button" class="btn btn-link">{{_i}}Link{{/i}}</button></td>
+              <td><code>btn btn-link</code></td>
+              <td>{{_i}}Deemphasize a button by making it look like a link while maintaining button behavior{{/i}}</td>
+            </tr>
           </tbody>
         </table>
 

diff --git a/less/buttons.less b/less/buttons.less
index b25d971805f58368f461aea6f19a3cbc4d53f821..8bdf34b20a832ff73e13e19ee1cdb238370d4032 100644 (file)
--- 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;
+}