0
0
mirror of https://github.com/twbs/bootstrap.git synced 2024-12-05 17:24:20 +01:00
Commit Graph

153 Commits

Author SHA1 Message Date
Mark Otto
c9cd3e4a08
v5: Make navbar active links consistent (#30831)
* Update navbar docs to put .active class on .nav-link

Fixes #30652 in v5.

* Remove two selectors from navbar nav that are either unused, or duplicative

Co-authored-by: XhmikosR <xhmikosr@gmail.com>
2020-05-20 15:56:42 +03:00
Martijn Cuppens
b531bda07c Improve gradients
- Use a semitransparent gradient from light to dark which works on any background-color
- Store the gradient as a custom property (--bs-gradient)
- Remove `.bg-gradient-*` variants in favour of `.bg-gradient` which works even when `$enable-gradients` are enabled
- Add gradients to navbar, active page links and badges when gradients are enabled
2020-05-15 15:03:12 +03:00
Martijn Cuppens
6dfe8e02d7
Fix text decorations (#30492)
Co-authored-by: XhmikosR <xhmikosr@gmail.com>
2020-03-31 21:42:38 +03:00
Martijn Cuppens
d9e83671ae Drop IE support from Sass 2020-03-18 20:59:27 +02:00
Cinnead
770d95ed02 Add transition and add box-shadow for navbar-toggler (#30038)
Co-authored-by: Martijn Cuppens <martijn.cuppens@gmail.com>
Co-authored-by: XhmikosR <xhmikosr@gmail.com>
2020-01-28 13:28:44 +01:00
Martijn Cuppens
6904afe36b Inherit flex-wrap to decrease generated css (#29951) 2020-01-07 22:32:46 +02:00
Martijn Cuppens
74e45ebc07 Navbar optimizations (#29864)
- Remove redundant `display: inline-block` from flex children
- Remove `line-height: inherit;` which is the default value of `line-height`
- Use flex shorthand
- Improve background shorthand
- Fix removed brand margin caused by requiring containers in navbars
2019-12-25 18:38:41 +02:00
Matias Puhakka
639c405c65 Remove redundant "Navbar divider" from "Contents" (#29601) 2019-10-28 15:19:03 +01:00
Mark Otto
9c7bc1a111
v5: Simplify navbars by requiring containers (#29339)
* v5: Simplify navbars by requiring containers

* Update migration docs for navbar
2019-10-27 20:26:52 -07:00
Mark Otto
d94148bf50
Responsive containers (follow-up to #29095) (#29118)
* Follow-up to #29095

This PR fixes the responsive containers that were added in #29095, originally stubbed out in #25631. Apologies to @browner12 for getting that wrong.

Fixes #25631.

* update navbar as well because we cannot reset all containers uniformly

* Update navbars example to include container-xl example to ensure containers match

* rewrite responsive containers docs, add table of max-widths

* Update container docs
- Move table up to the intro
- Remove the container example because it's actually hella confusing
- Update and link to grid example as a demo instead
2019-08-05 12:12:16 -07:00
Mark Otto
cd4768aa81 fix broken classes 2019-07-22 10:38:28 -07:00
Mark Otto
634344c003
v4/v5: Add responsive containers (#29095)
* create responsive containers

provide more flexibility and allow the user to determine when containers switch from fluid to fixed width.

* fix the base container code

this commit fixes the non-media portion of the generated CSS. I learned about the `@extends` directive and was able to put it to good use.

I create a new temporary map that contains all the main `$container-max-widths` and join it to our 2 special cases of 'xs' and 'fluid'.  Then we loop through that and, with the appropriate infixes, extend our placeholder

* formatting for style

forgot to run my tests before the last push, i think these are better.

* finish incomplete comment

* fix the responsive containers

using the `@extend` directive I was able to clean up this code

* fix responsive containers in the navbar

mostly we just look through all of our breakpoints so we can include all of the responsive container classes in the tweaks we have to do for the navbar (redeclaring flex properties, don't double up on padding, etc)

* Simplify container extends

* Simplify navbar containers

* Rearrange, add comments, ensure everything is nested in $enable-grid-classes

* Reduce new CSS by using attribute selector

We avoid using `@extend` whenever possible, and this is more readable

* Update _grid.scss

* Update _navbar.scss

* Add docs for responsive containers, redesign the container layout page

* Add to the Grid example
2019-07-21 17:38:36 -07:00
Martijn Cuppens
f6694b7440 Use escape-svg() function (#29077)
* Use escape-svg() function

* Update theming.md
2019-07-19 18:57:12 -07:00
Mark Otto
1d4d9f8d89 Drop all hover mixins
Previously deprecated in v4.x, this clears out the now unused Sass option and removes some unused mixins. Arguably we could remove more, but I like the hover-focus mixin and we make extensive use of it across the project.
2019-05-08 20:58:07 +03:00
Martijn Cuppens
0321fbf036
Remove floats from dropdown (#28690) 2019-05-02 20:37:10 +02:00
Martijn Cuppens
51375abca5
Responsive font size implementation (#23816) 2019-02-07 23:32:05 +01:00
Martijn Cuppens
48fe2c23d3 Space fixes (#27997) 2019-01-08 06:46:29 +02:00
Martijn Cuppens
e1b990fb90 Move hand cursor for buttons to reboot 2019-01-04 11:53:32 +02:00
Andres Galante
ed3c611949 creates variables for navbar brand colors #27187 2018-09-13 17:51:14 +03:00
Andrew
abb4868626 correct spelling errors (#26837) 2018-07-09 17:59:22 -07:00
ysds
14f712601e Add basic position to dropup/right/left and dropdown-menu-right (#25400) 2018-03-12 19:44:05 +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
Andres Galante
5f3856ce29 removes hardcoded value for nav-link padding 2017-12-30 20:58:25 -08:00
patrickhlauke
e3f9c463fc Opinionated: reintroduce cursor:pointer
Explicitly re-adds the "hand" `cursor:pointer` for non-disabled `.btn`, `.close`, `.navbar-toggler` elements, as well as forcing `page-link` pagination controls to always have the "hand" cursor (even if an author uses it on, say, `<button>` elements for a dynamically updating in-page pagination).

Controversial, as everybody jumped on the bandwagon following this article https://medium.com/simple-human/buttons-shouldnt-have-a-hand-cursor-b11e99ca374b - which does have its merits of course, but there are also counter-arguments like http://kizu.ru/en/issues/cursor-pointer/

And seeing the amount of issues we've seen following the change, and the potential complexity needed to consistently address the cursor issue (see https://github.com/twbs/bootstrap/issues/24156 where i explore how the cursor needs to be based on "intent", and how that's tough to determine), I'm favouring an opinionated take here of just reintroducing the `cursor:pointer`.
2017-12-27 16:28:10 -08:00
XhmikosR
34d745540d
Minor Sass consistency changes. (#24677)
* use `background-color` instead of the shorthand
* use `outline: 0` consistently
* fix transform order
* remove quotes from `SFMono-Regular`
2017-11-06 02:23:36 +02:00
Johann-S
b9c4a5cde2 Fix dropup in bottom navbar for all the breakpoints 2017-10-04 16:22:55 +02:00
Johann-S
a9e7abd29b Fix caret position for Dropdown in a bottom navbar 2017-10-04 10:32:32 +02:00
Johann-S
b6988714a1 Fix dropup in navbar 2017-10-04 10:32:32 +02:00
XhmikosR
7b766e1ad5 Switch to stylelint. (#23572) 2017-10-02 20:34:56 -07:00
Andres Galante
acf76a4513 fixes navbar-text link colors (#23702) 2017-10-02 10:11:11 -07:00
XhmikosR
5cec8e0de6 Minor Sass cleanup and consistency changes. (#23959) 2017-09-17 08:18:24 +03:00
Andres Galante
5becfa6fb1 fixes #23926 responsive state on navbar 2017-09-12 21:41:15 -03:00
Martijn Cuppens
0ccb1e8d9a Fix navbar IE (#23652) 2017-09-12 11:32:43 +03:00
Mark Otto
73040d4311 fix navbar alignment for never expand situations 2017-08-04 15:15:25 -07:00
Mark Otto
987ac632b5 given width: 100% is always on a container now and it's constrained by max-width, we can remove our navbar changes from #21722 and #22383 2017-08-04 15:14:24 -07:00
Mark Otto
36e482ed27 update navbars to rename .navbar-inverse to .navbar-dark, update all navbar examples and variables 2017-06-25 18:29:43 -07:00
Catalin Zalog
f640ec9662 Some .navbar .dropdown-menu optimisation (#22776) 2017-06-17 13:12:39 -07:00
Johann-S
af93db294b Reset Popper.js styles for Dropdowns in navbar 2017-06-17 13:12:39 -07:00
Patrick Yeo
f2829dd6ea Rename $navbar-*-toggler-bg to $navbar-*-toggler-icon-bg since it's placed on .navbar-toggler-icon (#22564) 2017-05-26 20:55:07 -07:00
Catalin Zalog
3706c88348 Fix (css): force .navbar .dropdown-menu positioning 2017-05-22 16:20:58 +02:00
Johann-S
ba2352c14e Force dropdown to be displayed in position static for navbar, to override Popper css 2017-05-16 14:48:12 +02:00
Patrick Yeo
dd0ce3e4b2 Rename variable $input-border-focus to $input-border-color-focus (#22413)
* Rename variable $input-border-focus to $input-border-color-focus
* Rename variables $pagination-hover-border, $pagination-active-border, $pagination-disabled-border to $pagination-hover-border-color, $pagination-active-border-color, $pagination-disabled-border-color, respectively
* Rename variables $state-*-border to $state-*-border-color, respectively
* Rename variables $alert-*-border to $alert-*-border-color
* Rename $list-group-active-border to $list-group-active-border-color
* Rename $table-inverse-border to $table-inverse-border-color
* Rename $btn-*-border to $btn-*-border-color
* Rename $navbar-*-toggler-border to $navbar-*-toggler-border-color
2017-04-16 15:45:10 -07:00
Mark Otto
2dfffbde89 Rename some .open to .show (#22389)
* no more outline overrides
* rename old .open to .show
2017-04-08 16:30:18 -07:00
Catalin Zalog
758503e9ae css: .navbar child's aligning
Vertical centering `.navbar` flex children's

Demo: http://jsbin.com/fibini
2017-04-08 12:38:37 -07:00
Catalin Zalog
8423e5c3e6 css: .navbar-expand .dropdown position
Set/reset `.dropdown` position when `.navbar-expand`.

Demo: http://jsbin.com/pojecuh
2017-04-08 12:36:28 -07:00
Catalin Zalog
e20d744bdf .navbar-toggler color
Change the .navbar-toggler to default contextual .navbar-*-color.

<iframe height='265' scrolling='no' title='Bootstrap - .navbar-toggler color' src='//codepen.io/zalog/embed/MJLZOE/?height=265&theme-id=light&default-tab=css,result&embed-version=2' frameborder='no' allowtransparency='true' allowfullscreen='true' style='width: 100%;'>See the Pen <a href='http://codepen.io/zalog/pen/MJLZOE/'>Bootstrap - .navbar-toggler color</a> by Catalin Zalog (<a href='http://codepen.io/zalog'>@zalog</a>) on <a href='http://codepen.io'>CodePen</a>.
</iframe>
2017-03-26 10:43:57 -07:00
Mark Otto
90c5f6230b rename from .navbar-toggleable to .navbar-expand to reflect mobile first approach everywhere else 2017-03-23 23:02:28 -07:00
Pierre-Denis Vanduynslager
17cb5bb674 Allow to customize navbar-brand font-size 2017-03-23 23:02:28 -07:00
Pierre-Denis Vanduynslager
a03aaf39df Harmonize navbar-brand, navbar-text and nav-link height 2017-03-23 23:02:28 -07:00
Mark Otto
09ba3de619 revamp the collapse behavior
instead of flex column, use wrap and an explicit flexbox break with flex-basis 100% on the navbar-collapse.

add some additional container styles for enabling flex behavior when content isn't immediate child of .navbar
2017-03-23 23:02:28 -07:00