|
|
@@ -0,0 +1,41 @@
|
|
|
+// http://codepen.io/quickstep25/pen/BNOJXK
|
|
|
+// OPTIONAL WELL STYLES
|
|
|
+// VARS
|
|
|
+@state-primary-bg: darken(#428bca, 6.5%);
|
|
|
+@state-success-bg: #dff0d8;
|
|
|
+@state-info-bg: #d9edf7;
|
|
|
+@state-warning-bg: #fcf8e3;
|
|
|
+@state-danger-bg: #f2dede;
|
|
|
+// MIXINS - SHADOWS
|
|
|
+.box-shadow(@arguments: none) {
|
|
|
+ -webkit-box-shadow: @arguments;
|
|
|
+ -moz-box-shadow: @arguments;
|
|
|
+ box-shadow: @arguments;
|
|
|
+}
|
|
|
+// MIXINS - GRADIENT BACKGROUND
|
|
|
+.vertical(@start-color: #555; @end-color: #333; @start-percent: 0%; @end-percent: 100%) {
|
|
|
+ background: @start-color;
|
|
|
+ background-image: -moz-linear-gradient(left, @start-color @start-percent, @end-color @end-percent);
|
|
|
+ background-image: -webkit-linear-gradient(top, @start-color @start-percent, @end-color @end-percent);
|
|
|
+ background-image: -ms-linear-gradient(top, @start-color @start-percent, @end-color @end-percent);
|
|
|
+ background-image: -o-linear-gradient(top, @start-color @start-percent, @end-color @end-percent);
|
|
|
+ background-image: -webkit-gradient(linear, left top, left bottom, color-stop(@start-percent, @start-color), color-stop(@end-percent, @end-color));
|
|
|
+ background-image: linear-gradient(to bottom, @start-color @start-percent, @end-color @end-percent);
|
|
|
+}
|
|
|
+// MIXINS - BOOTSTRAP - WELL VARIANT OVERRIDE
|
|
|
+.well-variant(@state; @bg) {
|
|
|
+ .well.bg-@{state} {
|
|
|
+ color: darken(@bg, 65%);
|
|
|
+ background-color: @bg;
|
|
|
+ .vertical(@start-color: darken(@bg, 5%); @end-color: @bg);
|
|
|
+ border-color: darken(@bg, 10%);
|
|
|
+ @shadow: inset 0 1px 3px rgba(0,0,0,.05), 0 1px 0 rgba(255,255,255,.1);
|
|
|
+ .box-shadow(@shadow);
|
|
|
+ }
|
|
|
+}
|
|
|
+// WELLS - CONTEXTUAL BACKGROUNDS
|
|
|
+.well-variant(primary; @state-primary-bg);
|
|
|
+.well-variant(success; @state-success-bg);
|
|
|
+.well-variant(info; @state-info-bg);
|
|
|
+.well-variant(warning; @state-warning-bg);
|
|
|
+.well-variant(danger; @state-danger-bg);
|