mirrors/bootstrap
2
0
Fork 0
mirror of https://github.com/tenrok/bootstrap.git synced 2026-06-14 18:42:30 +03:00
Code Activity

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

Browse Source
This commit is contained in:
Mark Otto
2014-07-08 21:19:14 -07:00
parent ff4ff3bd06
commit f380ca21e2
25 changed files with 56 additions and 57 deletions
Download Patch File Download Diff File Expand all files Collapse all files
dist/css/bootstrap-theme.css
Vendored
-1
View File
@@ -182,7 +182,6 @@
background-color: #c12e2a; background-color: #c12e2a;
background-image: none; background-image: none;
} }
.thumbnail,
.img-thumbnail { .img-thumbnail {
-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .075); -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .075);
box-shadow: 0 1px 2px rgba(0, 0, 0, .075); box-shadow: 0 1px 2px rgba(0, 0, 0, .075);
dist/css/bootstrap-theme.css.map
Vendored
+1 -1
View File
File diff suppressed because one or more lines are too long
dist/css/bootstrap-theme.min.css
Vendored
+1 -1
View File
File diff suppressed because one or more lines are too long
dist/css/bootstrap.css
Vendored
+2 -3
View File
@@ -3376,8 +3376,8 @@ select[multiple].input-group-sm > .input-group-btn > .btn {
margin-left: -.75rem; margin-left: -.75rem;
border-top: 1px solid transparent; border-top: 1px solid transparent;
border-bottom: 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); -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); box-shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 1px 0 rgba(255,255,255,.1);
} }
@media (min-width: 48em) { @media (min-width: 48em) {
.navbar-form .form-group { .navbar-form .form-group {
@@ -4635,7 +4635,6 @@ button.close {
background-color: #fff; background-color: #fff;
-webkit-background-clip: padding-box; -webkit-background-clip: padding-box;
background-clip: padding-box; background-clip: padding-box;
border: 1px solid #ccc;
border: 1px solid rgba(0, 0, 0, .2); border: 1px solid rgba(0, 0, 0, .2);
border-radius: .3rem; border-radius: .3rem;
-webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, .2); -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, .2);
dist/css/bootstrap.css.map
Vendored
+1 -1
View File
File diff suppressed because one or more lines are too long
dist/css/bootstrap.min.css
Vendored
+1 -1
View File
File diff suppressed because one or more lines are too long
docs/dist/css/bootstrap-theme.css
Vendored
-1
View File
@@ -182,7 +182,6 @@
background-color: #c12e2a; background-color: #c12e2a;
background-image: none; background-image: none;
} }
.thumbnail,
.img-thumbnail { .img-thumbnail {
-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .075); -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .075);
box-shadow: 0 1px 2px rgba(0, 0, 0, .075); box-shadow: 0 1px 2px rgba(0, 0, 0, .075);
docs/dist/css/bootstrap-theme.css.map
Vendored
+1 -1
View File
File diff suppressed because one or more lines are too long
docs/dist/css/bootstrap-theme.min.css
Vendored
+1 -1
View File
File diff suppressed because one or more lines are too long
docs/dist/css/bootstrap.css
Vendored
+2 -3
View File
@@ -3376,8 +3376,8 @@ select[multiple].input-group-sm > .input-group-btn > .btn {
margin-left: -.75rem; margin-left: -.75rem;
border-top: 1px solid transparent; border-top: 1px solid transparent;
border-bottom: 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); -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); box-shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 1px 0 rgba(255,255,255,.1);
} }
@media (min-width: 48em) { @media (min-width: 48em) {
.navbar-form .form-group { .navbar-form .form-group {
@@ -4635,7 +4635,6 @@ button.close {
background-color: #fff; background-color: #fff;
-webkit-background-clip: padding-box; -webkit-background-clip: padding-box;
background-clip: padding-box; background-clip: padding-box;
border: 1px solid #ccc;
border: 1px solid rgba(0, 0, 0, .2); border: 1px solid rgba(0, 0, 0, .2);
border-radius: .3rem; border-radius: .3rem;
-webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, .2); -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, .2);
docs/dist/css/bootstrap.css.map
Vendored
+1 -1
View File
File diff suppressed because one or more lines are too long
docs/dist/css/bootstrap.min.css
Vendored
+1 -1
View File
File diff suppressed because one or more lines are too long
less/button-groups.less
+2 -2
View File
@@ -117,11 +117,11 @@
// The clickable button for toggling the menu // The clickable button for toggling the menu
// Remove the gradient and set the same inset shadow as the :active state // Remove the gradient and set the same inset shadow as the :active state
.btn-group.open .dropdown-toggle { .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. // Show no shadow for `.btn-link` since it has no other button styles.
&.btn-link { &.btn-link {
box-shadow: none; .box-shadow(none);
} }
} }
less/buttons.less
+3 -3
View File
@@ -39,7 +39,7 @@
&.active { &.active {
outline: 0; outline: 0;
background-image: none; 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, &.disabled,
@@ -48,7 +48,7 @@
cursor: not-allowed; cursor: not-allowed;
pointer-events: none; // Future-proof disabling of clicks pointer-events: none; // Future-proof disabling of clicks
opacity: .65; opacity: .65;
box-shadow: none; .box-shadow(none);
} }
} }
@@ -90,7 +90,7 @@
&[disabled], &[disabled],
fieldset[disabled] & { fieldset[disabled] & {
background-color: transparent; background-color: transparent;
box-shadow: none; .box-shadow(none);
} }
&, &,
&:hover, &:hover,
less/code.less
+4 -4
View File
@@ -17,7 +17,7 @@ code {
font-size: 90%; font-size: 90%;
color: @code-color; color: @code-color;
background-color: @code-bg; background-color: @code-bg;
border-radius: @border-radius-base; .border-radius(@border-radius-base);
} }
// User input typically entered via keyboard // User input typically entered via keyboard
@@ -26,13 +26,13 @@ kbd {
font-size: 90%; font-size: 90%;
color: @kbd-color; color: @kbd-color;
background-color: @kbd-bg; background-color: @kbd-bg;
border-radius: @border-radius-small; .border-radius(@border-radius-small);
box-shadow: inset 0 -.1rem 0 rgba(0,0,0,.25); .box-shadow(inset 0 -.1rem 0 rgba(0,0,0,.25));
kbd { kbd {
padding: 0; padding: 0;
font-size: 100%; font-size: 100%;
box-shadow: none; .box-shadow(none);
} }
} }
less/dropdowns.less
+1 -1
View File
@@ -44,7 +44,7 @@
background-color: @dropdown-bg; background-color: @dropdown-bg;
border: 1px solid @dropdown-border; border: 1px solid @dropdown-border;
.border-radius(@border-radius-base); .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; background-clip: padding-box;
// Dividers (basically an hr) within the dropdown // Dividers (basically an hr) within the dropdown
less/forms.less
+1 -1
View File
@@ -123,7 +123,7 @@ output {
background-image: none; // Reset unusual Firefox-on-Android default style; see https://github.com/necolas/normalize.css/issues/214 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: 1px solid @input-border;
.border-radius(@input-border-radius); .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; transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
// Customize the `:focus` state to imitate native WebKit styles. // Customize the `:focus` state to imitate native WebKit styles.
less/mixins.less
+2 -2
View File
@@ -5,8 +5,8 @@
border-radius: @radius; border-radius: @radius;
} }
.box-shadow(@shadow: 0 .1rem .2rem rgba(0,0,0,.1)) when (@enable-shadows = true) { .box-shadow(@shadow) when (@enable-shadows = true) {
box-shadow: @shadow; box-shadow: @arguments;
} }
less/mixins/forms.less
+7 -6
View File
@@ -20,10 +20,11 @@
// Set the border and box shadow on specific inputs to match // Set the border and box shadow on specific inputs to match
.form-control { .form-control {
border-color: @border-color; 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 { &:focus {
border-color: darken(@border-color, 10%); 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 // Set validation states also for addons
@@ -51,12 +52,12 @@
// //
// Example usage: change the default blue border and shadow to white for better // Example usage: change the default blue border and shadow to white for better
// contrast against a dark gray background. // contrast against a dark gray background.
.form-control-focus(@color: @input-border-focus) { .form-control-focus() {
@color-rgba: rgba(red(@color), green(@color), blue(@color), .6);
&:focus { &:focus {
border-color: @color; border-color: @input-border-focus;
outline: 0; 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);
} }
} }
less/modals.less
+2 -2
View File
@@ -53,7 +53,7 @@
background-color: @modal-content-bg; background-color: @modal-content-bg;
border: 1px solid @modal-content-border-color; border: 1px solid @modal-content-border-color;
.border-radius(@border-radius-large); .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; background-clip: padding-box;
// Remove focus outline from opened modal // Remove focus outline from opened modal
outline: 0; outline: 0;
@@ -137,7 +137,7 @@
margin: 30px auto; margin: 30px auto;
} }
.modal-content { .modal-content {
box-shadow: 0 5px 15px rgba(0,0,0,.5); .box-shadow(0 5px 15px rgba(0,0,0,.5));
} }
// Modal sizes // Modal sizes
less/navbar.less
+5 -5
View File
@@ -52,7 +52,7 @@
padding-right: @navbar-padding-horizontal; padding-right: @navbar-padding-horizontal;
padding-left: @navbar-padding-horizontal; padding-left: @navbar-padding-horizontal;
border-top: 1px solid transparent; border-top: 1px solid transparent;
box-shadow: inset 0 1px 0 rgba(255,255,255,.1); .box-shadow(inset 0 1px 0 rgba(255,255,255,.1));
&:extend(.clearfix all); &:extend(.clearfix all);
-webkit-overflow-scrolling: touch; -webkit-overflow-scrolling: touch;
@@ -63,7 +63,7 @@
@media (min-width: @grid-float-breakpoint) { @media (min-width: @grid-float-breakpoint) {
width: auto; width: auto;
border-top: 0; border-top: 0;
box-shadow: none; .box-shadow(none);
&.collapse { &.collapse {
display: block !important; display: block !important;
@@ -248,7 +248,7 @@
margin-top: 0; margin-top: 0;
background-color: transparent; background-color: transparent;
border: 0; border: 0;
box-shadow: none; .box-shadow(none);
> li > a, > li > a,
.dropdown-header { .dropdown-header {
padding: 5px 15px 5px 25px; padding: 5px 15px 5px 25px;
@@ -290,7 +290,7 @@
padding: 10px @navbar-padding-horizontal; padding: 10px @navbar-padding-horizontal;
border-top: 1px solid transparent; border-top: 1px solid transparent;
border-bottom: 1px solid transparent; border-bottom: 1px solid transparent;
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)");
// Mixin behavior for optimum display // Mixin behavior for optimum display
.form-inline(); .form-inline();
@@ -312,7 +312,7 @@
margin-right: 0; margin-right: 0;
padding-top: 0; padding-top: 0;
padding-bottom: 0; padding-bottom: 0;
box-shadow: none; .box-shadow(none);
} }
} }
less/popovers.less
+2 -3
View File
@@ -14,10 +14,9 @@
text-align: left; // Reset given new insertion method text-align: left; // Reset given new insertion method
background-color: @popover-bg; background-color: @popover-bg;
background-clip: padding-box; background-clip: padding-box;
border: 1px solid @popover-fallback-border-color;
border: 1px solid @popover-border-color; border: 1px solid @popover-border-color;
border-radius: @border-radius-large; .border-radius(@border-radius-large);
box-shadow: 0 5px 10px rgba(0,0,0,.2); .box-shadow(0 5px 10px rgba(0,0,0,.2));
// Overrides for proper insertion // Overrides for proper insertion
white-space: normal; white-space: normal;
less/progress-bars.less
+3 -3
View File
@@ -30,7 +30,7 @@
margin-bottom: @line-height-computed; margin-bottom: @line-height-computed;
background-color: @progress-bg; background-color: @progress-bg;
.border-radius(@border-radius-base); .border-radius(@border-radius-base);
box-shadow: inset 0 1px 2px rgba(0,0,0,.1); .box-shadow(inset 0 1px 2px rgba(0,0,0,.1));
} }
// Bar of progress // Bar of progress
@@ -43,7 +43,7 @@
color: @progress-bar-color; color: @progress-bar-color;
text-align: center; text-align: center;
background-color: @progress-bar-bg; background-color: @progress-bar-bg;
box-shadow: inset 0 -1px 0 rgba(0,0,0,.15); .box-shadow(inset 0 -1px 0 rgba(0,0,0,.15));
transition: width .6s ease; transition: width .6s ease;
} }
@@ -74,7 +74,7 @@
min-width: 30px; min-width: 30px;
background-color: transparent; background-color: transparent;
background-image: none; background-image: none;
box-shadow: none; .box-shadow(none);
} }
} }
less/theme.less
+11 -9
View File
@@ -19,12 +19,13 @@
.btn-warning, .btn-warning,
.btn-danger { .btn-danger {
text-shadow: 0 -1px 0 rgba(0,0,0,.2); text-shadow: 0 -1px 0 rgba(0,0,0,.2);
box-shadow: inset 0 1px 0 rgba(255,255,255,.15), 0 1px 1px rgba(0,0,0,.075); @shadow: inset 0 1px 0 rgba(255,255,255,.15), 0 1px 1px rgba(0,0,0,.075);
.box-shadow(@shadow);
// Reset the shadow // Reset the shadow
&:active, &:active,
&.active { &.active {
box-shadow: inset 0 3px 5px rgba(0,0,0,.125); .box-shadow(inset 0 3px 5px rgba(0,0,0,.125));
} }
} }
@@ -77,9 +78,8 @@
// Images // Images
// -------------------------------------------------- // --------------------------------------------------
.thumbnail,
.img-thumbnail { .img-thumbnail {
box-shadow: 0 1px 2px rgba(0,0,0,.075); .box-shadow(0 1px 2px rgba(0,0,0,.075));
} }
@@ -111,11 +111,12 @@
#gradient > .vertical(@start-color: lighten(@navbar-default-bg, 10%); @end-color: @navbar-default-bg); #gradient > .vertical(@start-color: lighten(@navbar-default-bg, 10%); @end-color: @navbar-default-bg);
.reset-filter(); // Remove gradient in IE<10 to fix bug where dropdowns don't get triggered .reset-filter(); // Remove gradient in IE<10 to fix bug where dropdowns don't get triggered
.border-radius(@navbar-border-radius); .border-radius(@navbar-border-radius);
box-shadow: inset 0 1px 0 rgba(255,255,255,.15), 0 1px 5px rgba(0,0,0,.075); @shadow: inset 0 1px 0 rgba(255,255,255,.15), 0 1px 5px rgba(0,0,0,.075);
.box-shadow(@shadow);
.navbar-nav > .active > a { .navbar-nav > .active > a {
#gradient > .vertical(@start-color: darken(@navbar-default-bg, 5%); @end-color: darken(@navbar-default-bg, 2%)); #gradient > .vertical(@start-color: darken(@navbar-default-bg, 5%); @end-color: darken(@navbar-default-bg, 2%));
box-shadow: inset 0 3px 9px rgba(0,0,0,.075); .box-shadow(inset 0 3px 9px rgba(0,0,0,.075));
} }
} }
.navbar-brand, .navbar-brand,
@@ -130,7 +131,7 @@
.navbar-nav > .active > a { .navbar-nav > .active > a {
#gradient > .vertical(@start-color: @navbar-inverse-bg; @end-color: lighten(@navbar-inverse-bg, 2.5%)); #gradient > .vertical(@start-color: @navbar-inverse-bg; @end-color: lighten(@navbar-inverse-bg, 2.5%));
box-shadow: inset 0 3px 9px rgba(0,0,0,.25); .box-shadow(inset 0 3px 9px rgba(0,0,0,.25));
} }
.navbar-brand, .navbar-brand,
@@ -155,7 +156,8 @@
// Common styles // Common styles
.alert { .alert {
text-shadow: 0 1px 0 rgba(255,255,255,.2); text-shadow: 0 1px 0 rgba(255,255,255,.2);
box-shadow: inset 0 1px 0 rgba(255,255,255,.25), 0 1px 2px rgba(0,0,0,.05); @shadow: inset 0 1px 0 rgba(255,255,255,.25), 0 1px 2px rgba(0,0,0,.05);
.box-shadow(@shadow);
} }
// Mixin for generating new styles // Mixin for generating new styles
@@ -206,7 +208,7 @@
.list-group { .list-group {
.border-radius(@border-radius-base); .border-radius(@border-radius-base);
box-shadow: 0 1px 2px rgba(0,0,0,.075); .box-shadow(0 1px 2px rgba(0,0,0,.075));
} }
.list-group-item.active, .list-group-item.active,
.list-group-item.active:hover, .list-group-item.active:hover,
less/variables.less
+1
View File
@@ -187,6 +187,7 @@
@input-border-radius: @border-radius-base; @input-border-radius: @border-radius-base;
//** Border color for inputs on focus //** Border color for inputs on focus
@input-border-focus: #66afe9; @input-border-focus: #66afe9;
@input-box-shadow-focus: rgba(102,175,233,.6);
//** Placeholder text color //** Placeholder text color
@input-color-placeholder: @gray-light; @input-color-placeholder: @gray-light;