Commit f380ca21 authored by Mark Otto's avatar Mark Otto
Browse files

Use .box-shadow() mixin so we can enable/disable them

parent ff4ff3bd
Showing with 30 additions and 33 deletions
+30 -33
......@@ -182,7 +182,6 @@
background-color: #c12e2a;
background-image: none;
}
.thumbnail,
.img-thumbnail {
-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .075);
box-shadow: 0 1px 2px rgba(0, 0, 0, .075);
......
File suppressed by a .gitattributes entry or the file's encoding is unsupported.
This diff is collapsed.
......@@ -3376,8 +3376,8 @@ select[multiple].input-group-sm > .input-group-btn > .btn {
margin-left: -.75rem;
border-top: 1px solid transparent;
border-bottom: 1px solid transparent;
-webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1), 0 1px 0 rgba(255, 255, 255, .1);
box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1), 0 1px 0 rgba(255, 255, 255, .1);
-webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 1px 0 rgba(255,255,255,.1);
box-shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 1px 0 rgba(255,255,255,.1);
}
@media (min-width: 48em) {
.navbar-form .form-group {
......@@ -4635,7 +4635,6 @@ button.close {
background-color: #fff;
-webkit-background-clip: padding-box;
background-clip: padding-box;
border: 1px solid #ccc;
border: 1px solid rgba(0, 0, 0, .2);
border-radius: .3rem;
-webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, .2);
......
File suppressed by a .gitattributes entry or the file's encoding is unsupported.
This diff is collapsed.
......@@ -182,7 +182,6 @@
background-color: #c12e2a;
background-image: none;
}
.thumbnail,
.img-thumbnail {
-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .075);
box-shadow: 0 1px 2px rgba(0, 0, 0, .075);
......
File suppressed by a .gitattributes entry or the file's encoding is unsupported.
This diff is collapsed.
......@@ -3376,8 +3376,8 @@ select[multiple].input-group-sm > .input-group-btn > .btn {
margin-left: -.75rem;
border-top: 1px solid transparent;
border-bottom: 1px solid transparent;
-webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1), 0 1px 0 rgba(255, 255, 255, .1);
box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1), 0 1px 0 rgba(255, 255, 255, .1);
-webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 1px 0 rgba(255,255,255,.1);
box-shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 1px 0 rgba(255,255,255,.1);
}
@media (min-width: 48em) {
.navbar-form .form-group {
......@@ -4635,7 +4635,6 @@ button.close {
background-color: #fff;
-webkit-background-clip: padding-box;
background-clip: padding-box;
border: 1px solid #ccc;
border: 1px solid rgba(0, 0, 0, .2);
border-radius: .3rem;
-webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, .2);
......
File suppressed by a .gitattributes entry or the file's encoding is unsupported.
This diff is collapsed.
......@@ -117,11 +117,11 @@
// The clickable button for toggling the menu
// Remove the gradient and set the same inset shadow as the :active state
.btn-group.open .dropdown-toggle {
box-shadow: inset 0 3px 5px rgba(0,0,0,.125);
.box-shadow(inset 0 3px 5px rgba(0,0,0,.125));
// Show no shadow for `.btn-link` since it has no other button styles.
&.btn-link {
box-shadow: none;
.box-shadow(none);
}
}
......
......@@ -39,7 +39,7 @@
&.active {
outline: 0;
background-image: none;
box-shadow: inset 0 3px 5px rgba(0,0,0,.125);
.box-shadow(inset 0 3px 5px rgba(0,0,0,.125));
}
&.disabled,
......@@ -48,7 +48,7 @@
cursor: not-allowed;
pointer-events: none; // Future-proof disabling of clicks
opacity: .65;
box-shadow: none;
.box-shadow(none);
}
}
......@@ -90,7 +90,7 @@
&[disabled],
fieldset[disabled] & {
background-color: transparent;
box-shadow: none;
.box-shadow(none);
}
&,
&:hover,
......
......@@ -17,7 +17,7 @@ code {
font-size: 90%;
color: @code-color;
background-color: @code-bg;
border-radius: @border-radius-base;
.border-radius(@border-radius-base);
}
// User input typically entered via keyboard
......@@ -26,13 +26,13 @@ kbd {
font-size: 90%;
color: @kbd-color;
background-color: @kbd-bg;
border-radius: @border-radius-small;
box-shadow: inset 0 -.1rem 0 rgba(0,0,0,.25);
.border-radius(@border-radius-small);
.box-shadow(inset 0 -.1rem 0 rgba(0,0,0,.25));
kbd {
padding: 0;
font-size: 100%;
box-shadow: none;
.box-shadow(none);
}
}
......
......@@ -44,7 +44,7 @@
background-color: @dropdown-bg;
border: 1px solid @dropdown-border;
.border-radius(@border-radius-base);
box-shadow: 0 6px 12px rgba(0,0,0,.175);
.box-shadow(0 6px 12px rgba(0,0,0,.175));
background-clip: padding-box;
// Dividers (basically an hr) within the dropdown
......
......@@ -123,7 +123,7 @@ output {
background-image: none; // Reset unusual Firefox-on-Android default style; see https://github.com/necolas/normalize.css/issues/214
border: 1px solid @input-border;
.border-radius(@input-border-radius);
box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
.box-shadow(inset 0 1px 1px rgba(0,0,0,.075));
transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
// Customize the `:focus` state to imitate native WebKit styles.
......
......@@ -5,8 +5,8 @@
border-radius: @radius;
}
.box-shadow(@shadow: 0 .1rem .2rem rgba(0,0,0,.1)) when (@enable-shadows = true) {
box-shadow: @shadow;
.box-shadow(@shadow) when (@enable-shadows = true) {
box-shadow: @arguments;
}
......
......@@ -20,10 +20,11 @@
// Set the border and box shadow on specific inputs to match
.form-control {
border-color: @border-color;
box-shadow: inset 0 1px 1px rgba(0,0,0,.075); // Redeclare so transitions work
.box-shadow(inset 0 1px 1px rgba(0,0,0,.075)); // Redeclare so transitions work
&:focus {
border-color: darken(@border-color, 10%);
box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 6px lighten(@border-color, 20%);
@shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 6px lighten(@border-color, 20%);
.box-shadow(@shadow);
}
}
// Set validation states also for addons
......@@ -51,12 +52,12 @@
//
// Example usage: change the default blue border and shadow to white for better
// contrast against a dark gray background.
.form-control-focus(@color: @input-border-focus) {
@color-rgba: rgba(red(@color), green(@color), blue(@color), .6);
.form-control-focus() {
&:focus {
border-color: @color;
border-color: @input-border-focus;
outline: 0;
box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px @color-rgba;
@shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px @input-box-shadow-focus;
.box-shadow(@shadow);
}
}
......
......@@ -53,7 +53,7 @@
background-color: @modal-content-bg;
border: 1px solid @modal-content-border-color;
.border-radius(@border-radius-large);
box-shadow: 0 3px 9px rgba(0,0,0,.5);
.box-shadow(0 3px 9px rgba(0,0,0,.5));
background-clip: padding-box;
// Remove focus outline from opened modal
outline: 0;
......@@ -137,7 +137,7 @@
margin: 30px auto;
}
.modal-content {
box-shadow: 0 5px 15px rgba(0,0,0,.5);
.box-shadow(0 5px 15px rgba(0,0,0,.5));
}
// Modal sizes
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment