Commit Graph

59 Commits

Author SHA1 Message Date
Martijn Cuppens 4d863effdb Backport #30512
Use `box-shadow` mixin for `.btn`
2020-04-13 21:12:29 +03:00
Martijn Cuppens 48e86c5796 Apply `at-mixin-argumentless-call-parentheses: always` stylelint rule for v4 mixins 2019-07-31 11:37:39 +03:00
Matěj Kříž 41eea9edc4 Fix buttons :focus state styles (#27890)
* Fix buttons :focus state styles

Buttons :hover and :focus state shares styles.
Buttons :focus text color on 'a.btn' is now consistent with others '.btn'.

* `:focus` styles should be in sync with `.focus`.

So shared styles with hover were copy to focus definition. Rather then using
`hover-focus` mixin which do not contain `.focus`.
2019-04-29 17:41:28 +03:00
Martijn Cuppens 51375abca5
Responsive font size implementation (#23816) 2019-02-07 23:32:05 +01:00
wojtask9 42bed436e8 take account 'none' for box-shadow (#27972) 2019-01-07 02:52:39 +02:00
Martijn Cuppens 39b14c9806 Blacklist border-radius property (use mixin instead) (#27900) 2018-12-23 09:11:11 +02:00
ysds 4a1090ac48 Ligthen/Darken Button focus shadow color 2018-11-04 20:58:00 +02:00
Doug Puchalski 59f1802e98 Outline button variant hover mixin (#27289)
The outline button variant mixin should use the hover mixin, as does the non-outline version.
2018-10-21 10:09:08 +03:00
Ian Walter 871a51a548 Fix #26372: disabled btn hover issue (#27407)
When gradients are enabled there is still a hover state on disabled
buttons since the hover rules apply to background-image and disabled
rules apply to background-color. This applies the logic already present
in dropdowns to buttons. This fix was originally proposed by @ysds.
2018-10-20 22:12:33 +03:00
Martijn Cuppens 3ef2db1e85 Move transparent background to .btn and remove background-image 2018-09-02 16:28:42 -07:00
Mark Otto a0936c326f Outline button hover color (#25339) 2018-01-18 01:45:25 +02:00
Patrick H. Lauke 1f490ec165
Consistently use `:disabled` rather than `[disabled]` selector (#25317)
Closes https://github.com/twbs/bootstrap/issues/25316
2018-01-15 20:51:01 +00:00
Patrick Yeo ffcbdb5a1c Mixin `button-outline-variant` should retain active box shadow when focused 2018-01-13 19:19:33 -08:00
Wolfgang Goedel 588227f97f Fixed color for disabled buttons (#25167) 2018-01-13 09:50:25 +02:00
Mark Otto 43c551e97d
Outline active focus (#25145)
* Base the outline button :active color on the background, fixing a contrast issue

* Only apply focus outline to active when it's focused
2017-12-30 20:55:35 -08:00
Mark Otto 1a4a94bfd9 apply same active/focus shadow styling to button variants 2017-12-27 17:56:28 -08:00
afholderman 7c10068c76 Darken outline hover color to match default button hover (#24150)
* Fix Issue #24144

Alter button-outline-variant mixin to darken hover and active background in same fashion as filled button.

* Fix Issue #24144

Filled button on hover should utilize the same color-yiq mixin so that theme buttons match

* default values, fix mixin
2017-11-24 16:42:40 -08:00
Mark Otto 63947ee94e
Add fallback border-radius to .btn (#24505)
Fixes #24503 by manually calling the border-radius instead of using the mixin.
2017-10-28 22:42:09 -07:00
Mark Otto af9df8c308 update new focus and shadow properties to use vars 2017-10-25 12:30:29 -07:00
Mark Otto 06641ca0b3 Gradients and shadows (#24429)
* Update the form focus mixin to use a manual `$enable-shadows` check so we can always ensure a focus state for accessibility and consistency

* - Add new `$input-btn-focus-width` and `$input-btn-focus-color` variables.

- Replace separate `$btn-focus-box-shadow` and `$input-focus-box-shadow`
variables with unified `$input-btn-focus-box-shadow` to match our
combined variables approach elsewhere.

* Put new focus width var to use in buttons mixins

* use new button input-box shadow var

* Add a new mixin for quickly adding linear gradient to components when $enable-gradients is set to true

* use correct var

* fix focus shadows in button mixins

* Add opt-in gradients to alerts, buttons, carousel, custom radios and checkboxes, custom file input, and dropdown items

* Generate .bg-gradient- utilities

* add headings to colors page and document bg-gradient utils

* update the button color for active status, check with yiq as it's done for basic state and hover state
2017-10-19 09:03:33 -07:00
Mark Otto 521aa875e7 fix functions, lighter colors on active 2017-10-19 00:13:38 -07:00
Mark Otto 9501ed8725 Merge branch 'btn-active' of https://github.com/andresgalante/bootstrap into andresgalante-btn-active 2017-10-19 00:11:36 -07:00
Gijs Boddeus 98778164e0 Merge branch 'v4-dev' into yiq-function-update 2017-10-15 11:55:02 +02:00
Prateek Goel de3973b5e7 Ensure active button styles are not applied to disabled buttons 2017-10-09 18:32:48 -04:00
Gijs Boddeus df6a8f7d81 revert 1db5082 2017-10-04 10:57:02 +02:00
Gijs Boddeus 1db5082c3f rearrange properties in _borders.scss mixins 2017-10-04 08:52:48 +02:00
gijsbotje cc092272ee modified the yiq to to an actual function
function only returns a value, not the attribute itself
updated every use of the former mixin to use the new function
2017-09-13 17:32:44 +02:00
Andres Galante 8e56145e45 changes active state color 2017-09-11 00:53:40 -03:00
Ben Hayward 6c402a6c7c Add correct button-variant mixin hover color (#23657) 2017-09-04 15:34:10 -07:00
Mark Otto cd22eb1da0 Button code cleanup (#22951)
* use a mixin there
* revamp .btn-link to match default and outline variants
* remove unnecessary properties
2017-08-13 14:55:28 -07:00
Mark Otto f282a88475 update comment 2017-07-01 23:25:28 -07:00
Mark Otto 4b6d2c0b3c put button active bg and border in the mixin params for more customization options 2017-07-01 23:25:28 -07:00
Mark Otto 1a23321fc0 Update _buttons.scss 2017-06-18 10:53:27 -07:00
Mark Otto 597e9f8618 remove - vars, update docs to generate from data yml files, update mixins, and generate card, button, bg, and color classes from the sass map 2017-06-18 02:57:16 -07:00
Mark Otto 01dbc4cc05 Bump up from 2px to 3px so it's consistent; also fix focus of inputs 2017-04-08 21:24:03 -07:00
Mark Otto 296c99020c Revamp button and input vars while fixing #21587 (#22287) 2017-03-28 09:28:27 -07:00
naicko 890c6041f3 Update scss mixins to comply with scss-linting rules (#22151)
* Fixed some linting issues

* Run npm tasks after scss cleanup

* Revert "Run npm tasks after scss cleanup"

This reverts commit 1103a0da68.

* Property sort order for grid

* Let's respest the property order in the mixins

* Respect property sort order in reboot file

* ::-ms-expand is a vendor-prefix, add it to the scss-lint disable

* Revert hover mixin comment

* Fixed missing mixin hover-focus
2017-03-18 13:06:05 -07:00
Mark Otto e38c3506e3 properly pass focus shadow should you enable shadows
don't implement for the outline style because outline buttons get no shadow by default
2016-12-28 15:12:04 -08:00
Mark Otto a9bee8b6c8 remove active styling from focus 2016-12-28 15:12:04 -08:00
Mark Otto 62c4cb29fb redo outlines
- removes original outline removal (hah)
- replaces it with an explicit `outline: 0` on `.btn`
- instead of replicating `:hover` for `:focus`, uses custom and themed `box-shadow` for an "outline"
- not mapped to the `$enable-shadows` variable because accessibility
2016-12-28 15:12:04 -08:00
Mark Otto 79cfc095df linting 2016-12-28 15:12:04 -08:00
Mark Otto 7aa2a52069 Redo button states
Trying to simplify our output here by revamping these selectors. We overcomplicated things by setting hover styles for nearly every state (disabled and active included), and we set them in the wrong order.

This commit does the following:

- Reorders states so disabled comes before active, thereby removing the need to set disabled-active styles.

- Removes all focus and hover styles from disabled states as those will naturally inherit from the default button state.

- Renamed `.open` to `.show` to fix dropdown toggle highlighting.

- Tweaked some indendation in the Sass.
2016-12-28 15:12:04 -08:00
Beau Smith 3df78ce11b Remove hard-coded value in button-outline-variant
Fixes #20609

PR #20641, another solution to this issue, hard-codes use of $body-color, which may not be the desired color for the text when hovering.
2016-09-16 13:02:52 -07:00
Patrick H. Lauke 9b8a4bc691 Add extra styles for focused/hovered active outline buttons 2016-02-15 12:58:16 +00:00
Mark Otto a16b2ef162 Remove line-height from the button size mixin too 2016-02-07 22:43:53 -08:00
Mark Otto ba37c37615 Redo line-height globally
- Rename -height to -height-base to match other vars
- Drop use of -height across the board and rely on it to be inherited
- Adjust padding of .dropdown-header to account for different line-height of h6 heading element (this needs refactoring for variables and rems also)
2016-02-03 19:45:13 -08:00
Chris Rebert a5b41e7254 Extract $btn-box-shadow variable 2016-01-16 20:23:37 -08:00
Chris Rebert ed3551415c Extract $btn-active-box-shadow variable & refactor accordingly
[skip sauce]
[skip validator]
2016-01-09 15:14:36 -08:00
Gleb Mazovetskiy f7b27a02ce Remove all uses of `selector &`
If we want to support namespaced import:

```scss
.twbs {
  @import 'bootstrap';
}
```

We cannot use `selector &`, see sass/sass#1817.

`fieldset[disabled] &` is not needed as we no longer support IE8.
2015-08-27 13:11:14 +01:00
Mark Otto 1f153b640d re-fix #16154 in v4-dev /cc #17101 2015-08-22 19:05:43 -07:00