aboutsummaryrefslogtreecommitdiff
path: root/less
diff options
context:
space:
mode:
authorJacob Thornton <[email protected]>2012-08-27 21:27:31 -0700
committerJacob Thornton <[email protected]>2012-08-27 21:27:31 -0700
commit215d92bacd0d912cd9e73e822d928eeb891bf518 (patch)
tree949c21b05d4b490f5c20ccfd8accdfa87aa70aa6 /less
parent4751a0a2745b8480371678281ee6a7f874aaf096 (diff)
parent7d412b1e14ea47884b5e3fd77fe0e7734f3cdd97 (diff)
downloadbootstrap-215d92bacd0d912cd9e73e822d928eeb891bf518.tar.xz
bootstrap-215d92bacd0d912cd9e73e822d928eeb891bf518.zip
Merge branch '2.1.1-wip' of github.com:twitter/bootstrap into 2.1.1-wip
Diffstat (limited to 'less')
-rw-r--r--less/mixins.less2
-rw-r--r--less/tables.less27
-rw-r--r--less/tests/css-tests.css72
-rw-r--r--less/tests/css-tests.html30
4 files changed, 125 insertions, 6 deletions
diff --git a/less/mixins.less b/less/mixins.less
index 785ac6c2e..0aba0be63 100644
--- a/less/mixins.less
+++ b/less/mixins.less
@@ -442,7 +442,7 @@
background-color: mix(@midColor, @endColor, 80%);
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(@startColor), color-stop(@colorStop, @midColor), to(@endColor));
background-image: -webkit-linear-gradient(@startColor, @midColor @colorStop, @endColor);
- background-image: -moz-linear-gradient(top, @startColor, @midColor @colorStop*100%, @endColor);
+ background-image: -moz-linear-gradient(top, @startColor, @midColor @colorStop, @endColor);
background-image: -o-linear-gradient(@startColor, @midColor @colorStop, @endColor);
background-image: linear-gradient(@startColor, @midColor @colorStop, @endColor);
background-repeat: no-repeat;
diff --git a/less/tables.less b/less/tables.less
index 181ad3645..9816d8973 100644
--- a/less/tables.less
+++ b/less/tables.less
@@ -208,21 +208,38 @@ table {
}
+
// TABLE BACKGROUNDS
// -----------------
// Exact selectors below required to override .table-striped
-.table {
- tbody tr.success td {
+.table tbody tr {
+ &.success td {
background-color: @successBackground;
}
- tbody tr.error td {
+ &.error td {
background-color: @errorBackground;
}
- tbody tr.warning td {
+ &.warning td {
background-color: @warningBackground;
}
- tbody tr.info td {
+ &.info td {
background-color: @infoBackground;
}
}
+
+// Hover states for .table-hover
+.table-hover tbody tr {
+ &.success:hover td {
+ background-color: darken(@successBackground, 5%);
+ }
+ &.error:hover td {
+ background-color: darken(@errorBackground, 5%);
+ }
+ &.warning:hover td {
+ background-color: darken(@warningBackground, 5%);
+ }
+ &.info:hover td {
+ background-color: darken(@infoBackground, 5%);
+ }
+}
diff --git a/less/tests/css-tests.css b/less/tests/css-tests.css
index 6001f53aa..9edaf69bf 100644
--- a/less/tests/css-tests.css
+++ b/less/tests/css-tests.css
@@ -65,3 +65,75 @@ body {
.fluid-grid .span1 {
background-color: #999;
}
+
+
+/* Gradients */
+
+[class^="gradient-"] {
+ width: 100%;
+ height: 400px;
+ margin: 20px 0;
+ -webkit-border-radius: 5px;
+ -moz-border-radius: 5px;
+ border-radius: 5px;
+}
+
+.gradient-horizontal {
+ background-color: #333333;
+ background-image: -moz-linear-gradient(left, #555555, #333333);
+ background-image: -webkit-gradient(linear, 0 0, 100% 0, from(#555555), to(#333333));
+ background-image: -webkit-linear-gradient(left, #555555, #333333);
+ background-image: -o-linear-gradient(left, #555555, #333333);
+ background-image: linear-gradient(to right, #555555, #333333);
+ background-repeat: repeat-x;
+ filter: progid:dximagetransform.microsoft.gradient(startColorstr='#ff555555', endColorstr='#ff333333', GradientType=1);
+}
+
+.gradient-vertical {
+ background-color: #474747;
+ background-image: -moz-linear-gradient(top, #555555, #333333);
+ background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#555555), to(#333333));
+ background-image: -webkit-linear-gradient(top, #555555, #333333);
+ background-image: -o-linear-gradient(top, #555555, #333333);
+ background-image: linear-gradient(to bottom, #555555, #333333);
+ background-repeat: repeat-x;
+ filter: progid:dximagetransform.microsoft.gradient(startColorstr='#ff555555', endColorstr='#ff333333', GradientType=0);
+}
+
+.gradient-directional {
+ background-color: #333333;
+ background-image: -moz-linear-gradient(45deg, #555555, #333333);
+ background-image: -webkit-linear-gradient(45deg, #555555, #333333);
+ background-image: -o-linear-gradient(45deg, #555555, #333333);
+ background-image: linear-gradient(45deg, #555555, #333333);
+ background-repeat: repeat-x;
+}
+
+.gradient-vertical-three {
+ background-color: #8940a5;
+ background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#00b3ee), color-stop(50%, #7a43b6), to(#c3325f));
+ background-image: -webkit-linear-gradient(#00b3ee, #7a43b6 50%, #c3325f);
+ background-image: -moz-linear-gradient(top, #00b3ee, #7a43b6 50%, #c3325f);
+ background-image: -o-linear-gradient(#00b3ee, #7a43b6 50%, #c3325f);
+ background-image: linear-gradient(#00b3ee, #7a43b6 50%, #c3325f);
+ background-repeat: no-repeat;
+ filter: progid:dximagetransform.microsoft.gradient(startColorstr='#ff00b3ee', endColorstr='#ffc3325f', GradientType=0);
+}
+
+.gradient-radial {
+ background-color: #333333;
+ background-image: -webkit-gradient(radial, center center, 0, center center, 460, from(#555555), to(#333333));
+ background-image: -webkit-radial-gradient(circle, #555555, #333333);
+ background-image: -moz-radial-gradient(circle, #555555, #333333);
+ background-image: -o-radial-gradient(circle, #555555, #333333);
+ background-repeat: no-repeat;
+}
+
+.gradient-striped {
+ background-color: #555555;
+ background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(0.25, rgba(255, 255, 255, 0.15)), color-stop(0.25, transparent), color-stop(0.5, transparent), color-stop(0.5, rgba(255, 255, 255, 0.15)), color-stop(0.75, rgba(255, 255, 255, 0.15)), color-stop(0.75, transparent), to(transparent));
+ background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
+ background-image: -moz-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
+ background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
+ background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
+} \ No newline at end of file
diff --git a/less/tests/css-tests.html b/less/tests/css-tests.html
index 1ab21f1bf..471514339 100644
--- a/less/tests/css-tests.html
+++ b/less/tests/css-tests.html
@@ -1179,6 +1179,36 @@
+<!-- Gradients
+================================================== -->
+
+<div class="page-header">
+ <h1>Gradients</h1>
+</div>
+
+<h4>Horizontal</h4>
+<div class="gradient-horizontal"></div>
+
+<h4>Vertical</h4>
+<div class="gradient-vertical"></div>
+
+<h4>Directional</h4>
+<div class="gradient-directional"></div>
+
+<h4>Three colors</h4>
+<div class="gradient-vertical-three"></div>
+
+<h4>Radial</h4>
+<div class="gradient-radial"></div>
+
+<h4>Striped</h4>
+<div class="gradient-striped"></div>
+
+
+
+
+
+
</div><!-- /container -->