Skip to content
GitLab
Projects
Groups
Snippets
/
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in / Register
Toggle navigation
Menu
Open sidebar
Bootstrap
bootstrap
Commits
71310577
Commit
71310577
authored
12 years ago
by
Mark Otto
Browse files
Options
Download
Email Patches
Plain Diff
fixes
#3706
: add textColor and textShadow as options to .buttonBackground mixin
parent
a750551f
Changes
3
Hide whitespace changes
Inline
Side-by-side
Showing
3 changed files
docs/assets/css/bootstrap.css
+22
-16
docs/assets/css/bootstrap.css
less/buttons.less
+1
-20
less/buttons.less
less/mixins.less
+6
-3
less/mixins.less
with
29 additions
and
39 deletions
+29
-39
docs/assets/css/bootstrap.css
+
22
-
16
View file @
71310577
...
@@ -2820,6 +2820,7 @@ button.close {
...
@@ -2820,6 +2820,7 @@ button.close {
.btn.active
,
.btn.active
,
.btn.disabled
,
.btn.disabled
,
.btn
[
disabled
]
{
.btn
[
disabled
]
{
color
:
#333333
;
background-color
:
#e6e6e6
;
background-color
:
#e6e6e6
;
*
background-color
:
#d9d9d9
;
*
background-color
:
#d9d9d9
;
}
}
...
@@ -2905,22 +2906,6 @@ button.close {
...
@@ -2905,22 +2906,6 @@ button.close {
line-height
:
16px
;
line-height
:
16px
;
}
}
.btn-primary
,
.btn-primary
:hover
,
.btn-warning
,
.btn-warning
:hover
,
.btn-danger
,
.btn-danger
:hover
,
.btn-success
,
.btn-success
:hover
,
.btn-info
,
.btn-info
:hover
,
.btn-inverse
,
.btn-inverse
:hover
{
color
:
#ffffff
;
text-shadow
:
0
-1px
0
rgba
(
0
,
0
,
0
,
0.25
);
}
.btn-primary.active
,
.btn-primary.active
,
.btn-warning.active
,
.btn-warning.active
,
.btn-danger.active
,
.btn-danger.active
,
...
@@ -2936,6 +2921,8 @@ button.close {
...
@@ -2936,6 +2921,8 @@ button.close {
}
}
.btn-primary
{
.btn-primary
{
color
:
#ffffff
;
text-shadow
:
0
-1px
0
rgba
(
0
,
0
,
0
,
0.25
);
background-color
:
#006dcc
;
background-color
:
#006dcc
;
*
background-color
:
#0044cc
;
*
background-color
:
#0044cc
;
background-image
:
-webkit-gradient
(
linear
,
0
0
,
0
100%
,
from
(
#0088cc
),
to
(
#0044cc
));
background-image
:
-webkit-gradient
(
linear
,
0
0
,
0
100%
,
from
(
#0088cc
),
to
(
#0044cc
));
...
@@ -2955,6 +2942,7 @@ button.close {
...
@@ -2955,6 +2942,7 @@ button.close {
.btn-primary.active
,
.btn-primary.active
,
.btn-primary.disabled
,
.btn-primary.disabled
,
.btn-primary
[
disabled
]
{
.btn-primary
[
disabled
]
{
color
:
#ffffff
;
background-color
:
#0044cc
;
background-color
:
#0044cc
;
*
background-color
:
#003bb3
;
*
background-color
:
#003bb3
;
}
}
...
@@ -2965,6 +2953,8 @@ button.close {
...
@@ -2965,6 +2953,8 @@ button.close {
}
}
.btn-warning
{
.btn-warning
{
color
:
#ffffff
;
text-shadow
:
0
-1px
0
rgba
(
0
,
0
,
0
,
0.25
);
background-color
:
#faa732
;
background-color
:
#faa732
;
*
background-color
:
#f89406
;
*
background-color
:
#f89406
;
background-image
:
-webkit-gradient
(
linear
,
0
0
,
0
100%
,
from
(
#fbb450
),
to
(
#f89406
));
background-image
:
-webkit-gradient
(
linear
,
0
0
,
0
100%
,
from
(
#fbb450
),
to
(
#f89406
));
...
@@ -2984,6 +2974,7 @@ button.close {
...
@@ -2984,6 +2974,7 @@ button.close {
.btn-warning.active
,
.btn-warning.active
,
.btn-warning.disabled
,
.btn-warning.disabled
,
.btn-warning
[
disabled
]
{
.btn-warning
[
disabled
]
{
color
:
#ffffff
;
background-color
:
#f89406
;
background-color
:
#f89406
;
*
background-color
:
#df8505
;
*
background-color
:
#df8505
;
}
}
...
@@ -2994,6 +2985,8 @@ button.close {
...
@@ -2994,6 +2985,8 @@ button.close {
}
}
.btn-danger
{
.btn-danger
{
color
:
#ffffff
;
text-shadow
:
0
-1px
0
rgba
(
0
,
0
,
0
,
0.25
);
background-color
:
#da4f49
;
background-color
:
#da4f49
;
*
background-color
:
#bd362f
;
*
background-color
:
#bd362f
;
background-image
:
-webkit-gradient
(
linear
,
0
0
,
0
100%
,
from
(
#ee5f5b
),
to
(
#bd362f
));
background-image
:
-webkit-gradient
(
linear
,
0
0
,
0
100%
,
from
(
#ee5f5b
),
to
(
#bd362f
));
...
@@ -3013,6 +3006,7 @@ button.close {
...
@@ -3013,6 +3006,7 @@ button.close {
.btn-danger.active
,
.btn-danger.active
,
.btn-danger.disabled
,
.btn-danger.disabled
,
.btn-danger
[
disabled
]
{
.btn-danger
[
disabled
]
{
color
:
#ffffff
;
background-color
:
#bd362f
;
background-color
:
#bd362f
;
*
background-color
:
#a9302a
;
*
background-color
:
#a9302a
;
}
}
...
@@ -3023,6 +3017,8 @@ button.close {
...
@@ -3023,6 +3017,8 @@ button.close {
}
}
.btn-success
{
.btn-success
{
color
:
#ffffff
;
text-shadow
:
0
-1px
0
rgba
(
0
,
0
,
0
,
0.25
);
background-color
:
#5bb75b
;
background-color
:
#5bb75b
;
*
background-color
:
#51a351
;
*
background-color
:
#51a351
;
background-image
:
-webkit-gradient
(
linear
,
0
0
,
0
100%
,
from
(
#62c462
),
to
(
#51a351
));
background-image
:
-webkit-gradient
(
linear
,
0
0
,
0
100%
,
from
(
#62c462
),
to
(
#51a351
));
...
@@ -3042,6 +3038,7 @@ button.close {
...
@@ -3042,6 +3038,7 @@ button.close {
.btn-success.active
,
.btn-success.active
,
.btn-success.disabled
,
.btn-success.disabled
,
.btn-success
[
disabled
]
{
.btn-success
[
disabled
]
{
color
:
#ffffff
;
background-color
:
#51a351
;
background-color
:
#51a351
;
*
background-color
:
#499249
;
*
background-color
:
#499249
;
}
}
...
@@ -3052,6 +3049,8 @@ button.close {
...
@@ -3052,6 +3049,8 @@ button.close {
}
}
.btn-info
{
.btn-info
{
color
:
#ffffff
;
text-shadow
:
0
-1px
0
rgba
(
0
,
0
,
0
,
0.25
);
background-color
:
#49afcd
;
background-color
:
#49afcd
;
*
background-color
:
#2f96b4
;
*
background-color
:
#2f96b4
;
background-image
:
-webkit-gradient
(
linear
,
0
0
,
0
100%
,
from
(
#5bc0de
),
to
(
#2f96b4
));
background-image
:
-webkit-gradient
(
linear
,
0
0
,
0
100%
,
from
(
#5bc0de
),
to
(
#2f96b4
));
...
@@ -3071,6 +3070,7 @@ button.close {
...
@@ -3071,6 +3070,7 @@ button.close {
.btn-info.active
,
.btn-info.active
,
.btn-info.disabled
,
.btn-info.disabled
,
.btn-info
[
disabled
]
{
.btn-info
[
disabled
]
{
color
:
#ffffff
;
background-color
:
#2f96b4
;
background-color
:
#2f96b4
;
*
background-color
:
#2a85a0
;
*
background-color
:
#2a85a0
;
}
}
...
@@ -3081,6 +3081,8 @@ button.close {
...
@@ -3081,6 +3081,8 @@ button.close {
}
}
.btn-inverse
{
.btn-inverse
{
color
:
#ffffff
;
text-shadow
:
0
-1px
0
rgba
(
0
,
0
,
0
,
0.25
);
background-color
:
#363636
;
background-color
:
#363636
;
*
background-color
:
#222222
;
*
background-color
:
#222222
;
background-image
:
-webkit-gradient
(
linear
,
0
0
,
0
100%
,
from
(
#444444
),
to
(
#222222
));
background-image
:
-webkit-gradient
(
linear
,
0
0
,
0
100%
,
from
(
#444444
),
to
(
#222222
));
...
@@ -3100,6 +3102,7 @@ button.close {
...
@@ -3100,6 +3102,7 @@ button.close {
.btn-inverse.active
,
.btn-inverse.active
,
.btn-inverse.disabled
,
.btn-inverse.disabled
,
.btn-inverse
[
disabled
]
{
.btn-inverse
[
disabled
]
{
color
:
#ffffff
;
background-color
:
#222222
;
background-color
:
#222222
;
*
background-color
:
#151515
;
*
background-color
:
#151515
;
}
}
...
@@ -4101,6 +4104,8 @@ input[type="submit"].btn.btn-mini {
...
@@ -4101,6 +4104,8 @@ input[type="submit"].btn.btn-mini {
padding
:
7px
10px
;
padding
:
7px
10px
;
margin-right
:
5px
;
margin-right
:
5px
;
margin-left
:
5px
;
margin-left
:
5px
;
color
:
#ffffff
;
text-shadow
:
0
-1px
0
rgba
(
0
,
0
,
0
,
0.25
);
background-color
:
#0e0e0e
;
background-color
:
#0e0e0e
;
*
background-color
:
#040404
;
*
background-color
:
#040404
;
background-image
:
-webkit-gradient
(
linear
,
0
0
,
0
100%
,
from
(
#151515
),
to
(
#040404
));
background-image
:
-webkit-gradient
(
linear
,
0
0
,
0
100%
,
from
(
#151515
),
to
(
#040404
));
...
@@ -4123,6 +4128,7 @@ input[type="submit"].btn.btn-mini {
...
@@ -4123,6 +4128,7 @@ input[type="submit"].btn.btn-mini {
.navbar
.btn-navbar.active
,
.navbar
.btn-navbar.active
,
.navbar
.btn-navbar.disabled
,
.navbar
.btn-navbar.disabled
,
.navbar
.btn-navbar
[
disabled
]
{
.navbar
.btn-navbar
[
disabled
]
{
color
:
#ffffff
;
background-color
:
#040404
;
background-color
:
#040404
;
*
background-color
:
#000000
;
*
background-color
:
#000000
;
}
}
...
...
This diff is collapsed.
Click to expand it.
less/buttons.less
+
1
-
20
View file @
71310577
...
@@ -15,12 +15,10 @@
...
@@ -15,12 +15,10 @@
font-size: 13px;
font-size: 13px;
line-height: 20px;
line-height: 20px;
*line-height: 20px;
*line-height: 20px;
color: @grayDark;
text-align: center;
text-align: center;
text-shadow: 0 1px 1px rgba(255,255,255,.75);
vertical-align: middle;
vertical-align: middle;
cursor: pointer;
cursor: pointer;
.buttonBackground(@btnBackground, @btnBackgroundHighlight);
.buttonBackground(@btnBackground, @btnBackgroundHighlight
, @grayDark, 0 1px 1px rgba(255,255,255,.75)
);
border: 1px solid @btnBorder;
border: 1px solid @btnBorder;
*border: 0; // Remove the border to prevent IE7's black border on input:focus
*border: 0; // Remove the border to prevent IE7's black border on input:focus
border-bottom-color: darken(@btnBorder, 10%);
border-bottom-color: darken(@btnBorder, 10%);
...
@@ -105,23 +103,6 @@
...
@@ -105,23 +103,6 @@
// Alternate buttons
// Alternate buttons
// --------------------------------------------------
// --------------------------------------------------
// Set text color
// -------------------------
.btn-primary,
.btn-primary:hover,
.btn-warning,
.btn-warning:hover,
.btn-danger,
.btn-danger:hover,
.btn-success,
.btn-success:hover,
.btn-info,
.btn-info:hover,
.btn-inverse,
.btn-inverse:hover {
color: @white;
text-shadow: 0 -1px 0 rgba(0,0,0,.25);
}
// Provide *some* extra contrast for those who can get it
// Provide *some* extra contrast for those who can get it
.btn-primary.active,
.btn-primary.active,
.btn-warning.active,
.btn-warning.active,
...
...
This diff is collapsed.
Click to expand it.
less/mixins.less
+
6
-
3
View file @
71310577
...
@@ -389,7 +389,9 @@
...
@@ -389,7 +389,9 @@
}
}
// Gradient Bar Colors for buttons and alerts
// Gradient Bar Colors for buttons and alerts
.gradientBar(@primaryColor, @secondaryColor) {
.gradientBar(@primaryColor, @secondaryColor, @textColor: #fff, @textShadow: 0 -1px 0 rgba(0,0,0,.25)) {
color: @textColor;
text-shadow: @textShadow;
#gradient > .vertical(@primaryColor, @secondaryColor);
#gradient > .vertical(@primaryColor, @secondaryColor);
border-color: @secondaryColor @secondaryColor darken(@secondaryColor, 15%);
border-color: @secondaryColor @secondaryColor darken(@secondaryColor, 15%);
border-color: rgba(0,0,0,.1) rgba(0,0,0,.1) fadein(rgba(0,0,0,.1), 15%);
border-color: rgba(0,0,0,.1) rgba(0,0,0,.1) fadein(rgba(0,0,0,.1), 15%);
...
@@ -481,14 +483,15 @@
...
@@ -481,14 +483,15 @@
// Button backgrounds
// Button backgrounds
// ------------------
// ------------------
.buttonBackground(@startColor, @endColor) {
.buttonBackground(@startColor, @endColor
, @textColor: #fff, @textShadow: 0 -1px 0 rgba(0,0,0,.25)
) {
// gradientBar will set the background to a pleasing blend of these, to support IE<=9
// gradientBar will set the background to a pleasing blend of these, to support IE<=9
.gradientBar(@startColor, @endColor);
.gradientBar(@startColor, @endColor
, @textColor, @textShadow
);
*background-color: @endColor; /* Darken IE7 buttons by default so they stand out more given they won't have borders */
*background-color: @endColor; /* Darken IE7 buttons by default so they stand out more given they won't have borders */
.reset-filter();
.reset-filter();
// in these cases the gradient won't cover the background, so we override
// in these cases the gradient won't cover the background, so we override
&:hover, &:active, &.active, &.disabled, &[disabled] {
&:hover, &:active, &.active, &.disabled, &[disabled] {
color: @textColor;
background-color: @endColor;
background-color: @endColor;
*background-color: darken(@endColor, 5%);
*background-color: darken(@endColor, 5%);
}
}
...
...
This diff is collapsed.
Click to expand it.
Write
Preview
Supports
Markdown
0%
Try again
or
attach a new file
.
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment