From 6eabb799bfad44def56b681e9f8586b9cfbfdf6e Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Mon, 5 Sep 2016 22:40:03 -0700 Subject: migration copy --- docs/migration.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'docs/migration.md') diff --git a/docs/migration.md b/docs/migration.md index 1fd28016a..cf02fea51 100644 --- a/docs/migration.md +++ b/docs/migration.md @@ -4,7 +4,7 @@ title: Migrating to v4 group: migration --- -Bootstrap 4 is a major rewrite of almost the entire project. The most notable changes are summarized immediately below, followed by more specific class and behavioral changes to relevant components. +Bootstrap 4 is a major rewrite of the entire project. The most notable changes are summarized below, followed by more specific changes to relevant components. {% callout info %} **Heads up!** This will be in flux as work on the v4 alphas progresses. Until then consider it incomplete, and we'd love pull requests to help keep it up to date. -- cgit v1.2.3 From 6d9ded83759b4fe34aa7e1c4d4f9425458e52e45 Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Sun, 4 Dec 2016 23:17:30 -0800 Subject: update migration docs --- docs/migration.md | 9 ++++++++- 1 file changed, 8 insertions(+), 1 deletion(-) (limited to 'docs/migration.md') diff --git a/docs/migration.md b/docs/migration.md index 9b6e006c7..212de6dfe 100644 --- a/docs/migration.md +++ b/docs/migration.md @@ -183,7 +183,14 @@ Dropped entirely for the new card component. ### Carousel -- Renamed `.item` to `.carousel-item`. +- Overhauled the entire component to simplify design and styling. We have fewer styles for you to override, new indicators, and new icons. +- All CSS has been un-nested and renamed, ensuring each class is prefixed with `.carousel-`. + - For carousel items, `.next`, `.prev`, `.left`, and `.right` are now `.carousel-item-next`, `.carousel-item-prev`, `.carousel-item-left`, and `.carousel-item-right`. + - `.item` is also now `.carousel-item`. + - For prev/next controls, `.right` and `.left` modifiers are now `.carousel-control-left` and `.carousel-control-left`. +- Removed all responsive styling, deferring to utilities (e.g., showing captions on certain viewports) and custom styles as needed. +- Removed image overrides for images in carousel items, deferring to utilities. +- Tweaked the Carousel example to include the new markup and styles. ### Utilities -- cgit v1.2.3 From 4ef547f4bb3d48a2ee17ccdb9c913e1f4f9c7fe3 Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Sun, 4 Dec 2016 23:19:54 -0800 Subject: drop the .carousel-control base class --- docs/migration.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'docs/migration.md') diff --git a/docs/migration.md b/docs/migration.md index 212de6dfe..c1b6435ca 100644 --- a/docs/migration.md +++ b/docs/migration.md @@ -187,7 +187,7 @@ Dropped entirely for the new card component. - All CSS has been un-nested and renamed, ensuring each class is prefixed with `.carousel-`. - For carousel items, `.next`, `.prev`, `.left`, and `.right` are now `.carousel-item-next`, `.carousel-item-prev`, `.carousel-item-left`, and `.carousel-item-right`. - `.item` is also now `.carousel-item`. - - For prev/next controls, `.right` and `.left` modifiers are now `.carousel-control-left` and `.carousel-control-left`. + - For prev/next controls, `.carousel-control.right` and `.carousel-control.left` are now `.carousel-control-left` and `.carousel-control-left`, meaning they no longer require a specific base class. - Removed all responsive styling, deferring to utilities (e.g., showing captions on certain viewports) and custom styles as needed. - Removed image overrides for images in carousel items, deferring to utilities. - Tweaked the Carousel example to include the new markup and styles. -- cgit v1.2.3 From e0edea0d1a69d51990cb8d8de41183e94331b3a2 Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Mon, 5 Dec 2016 20:37:22 -0800 Subject: typo --- docs/migration.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'docs/migration.md') diff --git a/docs/migration.md b/docs/migration.md index c1b6435ca..b6704a669 100644 --- a/docs/migration.md +++ b/docs/migration.md @@ -187,7 +187,7 @@ Dropped entirely for the new card component. - All CSS has been un-nested and renamed, ensuring each class is prefixed with `.carousel-`. - For carousel items, `.next`, `.prev`, `.left`, and `.right` are now `.carousel-item-next`, `.carousel-item-prev`, `.carousel-item-left`, and `.carousel-item-right`. - `.item` is also now `.carousel-item`. - - For prev/next controls, `.carousel-control.right` and `.carousel-control.left` are now `.carousel-control-left` and `.carousel-control-left`, meaning they no longer require a specific base class. + - For prev/next controls, `.carousel-control.right` and `.carousel-control.left` are now `.carousel-control-right` and `.carousel-control-left`, meaning they no longer require a specific base class. - Removed all responsive styling, deferring to utilities (e.g., showing captions on certain viewports) and custom styles as needed. - Removed image overrides for images in carousel items, deferring to utilities. - Tweaked the Carousel example to include the new markup and styles. -- cgit v1.2.3 From 8b538c8ad3c7f31bcb2025a223468dad4c684f75 Mon Sep 17 00:00:00 2001 From: Johann-S Date: Mon, 19 Dec 2016 09:37:27 +0100 Subject: Remove mention of popovers auto placement + add note to migration docs --- docs/migration.md | 4 ++++ 1 file changed, 4 insertions(+) (limited to 'docs/migration.md') diff --git a/docs/migration.md b/docs/migration.md index b6704a669..7a380ae27 100644 --- a/docs/migration.md +++ b/docs/migration.md @@ -181,6 +181,10 @@ Dropped entirely for the new card component. - Removed support for `auto` placement options. +### Popovers + +- Removed support for `auto` placement options. + ### Carousel - Overhauled the entire component to simplify design and styling. We have fewer styles for you to override, new indicators, and new icons. -- cgit v1.2.3 From 69a09520d8a4ce15bad8d34c579df13307595f5c Mon Sep 17 00:00:00 2001 From: Geoffrey Tisserand Date: Mon, 19 Dec 2016 20:35:02 -0800 Subject: Fix typo in migration docs: card-title is replacing panel-title (#21331) --- docs/migration.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'docs/migration.md') diff --git a/docs/migration.md b/docs/migration.md index 7a380ae27..487fa7c53 100644 --- a/docs/migration.md +++ b/docs/migration.md @@ -168,7 +168,7 @@ Dropped entirely for the new card component. - `.panel-default` removed and no replacement - `.panel-group` removed and no replacement. `.card-group` is not a replacement, it is different. - `.panel-heading` to `.card-header` -- `.panel-title` to `.card-header`. Depending on the desired look, you may also want to use [heading elements or classes]({{ site.baseurl }}/content/typography/#headings) (e.g. `

`, `.h3`) or bold elements or classes (e.g. ``, ``, [`.font-weight-bold`]({{ site.baseurl }}/utilities/typography/#font-weight-and-italics)). Note that `.card-title`, while similarly named, produces a different look than `.panel-title`. +- `.panel-title` to `.card-title`. Depending on the desired look, you may also want to use [heading elements or classes]({{ site.baseurl }}/content/typography/#headings) (e.g. `

`, `.h3`) or bold elements or classes (e.g. ``, ``, [`.font-weight-bold`]({{ site.baseurl }}/utilities/typography/#font-weight-and-italics)). Note that `.card-title`, while similarly named, produces a different look than `.panel-title`. - `.panel-body` to `.card-block` - `.panel-footer` to `.card-footer` - `.panel-primary` to `.card-primary` and `.card-inverse` (or use `.bg-primary` on `.card-header`) -- cgit v1.2.3 From eb2e1102be0f4641ee3e5c4e7853360d5a04e3d8 Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Wed, 21 Dec 2016 20:26:17 -0800 Subject: Flexbox all the time (Drop IE9 support and remove $enable-flex option) (#21389) * remove the $enable-flex variable option * remove bootstrap-flex.css dist file and it's grunt task * remove the separate flex css file for docs; it's all the same now * remove flexbox docs (porting some to the main grid docs in next commit) * clean up few grid docs bits to simplify copy, start to mention flexbox * port relevant flexbox-grid.md content to grid.md - clean up mixins - update how it works section - bring over sizing and alignment sections * remove the $enable-flex from the options.md page * update lead paragraph to mention flexbox * update migration to mention loss of ie9 support * remove mention of flexbox dist file * clarify IE support * making a note * remove flexbox variant mentions from component docs - updates docs for media object, navs, list group, and cards to consolidate docs - no more need to callout flexbox variants since it's now the default * remove $enable-flex if/else from sass files * remove flex dist files * update scss lint property order to account for flex properties * linting * change to numberless classes for autosizing, wrap in highlighting div * bump gruntfile and postcss to ie10 * redo intro sections * rearrange * phew, redo hella grid docs - rearrange all the things - consolidate some bits * remove reference to flexbox mode * more border action for demo * Make some changes to the .card's in .card-deck's to ensure footers align to the bottom --- docs/migration.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) (limited to 'docs/migration.md') diff --git a/docs/migration.md b/docs/migration.md index 487fa7c53..d6f916ba5 100644 --- a/docs/migration.md +++ b/docs/migration.md @@ -16,7 +16,7 @@ Here are the big ticket items you'll want to be aware of when moving from v3 to ### Browser support -- Dropped IE8 and iOS 6 support. v4 is now only IE9+ and iOS 7+. For sites needing either of those, use v3. +- Dropped IE8, IE9, and iOS 6 support. v4 is now only IE10+ and iOS 7+. For sites needing either of those, use v3. - Added official support for Android v5.0 Lollipop's Browser and WebView. Earlier versions of the Android Browser and WebView remain only unofficially supported. ### Global changes @@ -29,7 +29,7 @@ Here are the big ticket items you'll want to be aware of when moving from v3 to ### Grid system -- Added support for flexbox (set `$enable-flex: true` and recompile) in the grid mixins and predefined classes. +- Added support for flexbox in the grid mixins and predefined classes. - As part of flexbox, included support for vertical and horizontal alignment classes. - Overhauled grid mixins to merge `make-col-span` into `make-col` for a singular mixin. - Added a new `sm` grid tier below `768px` for more granular control. We now have `xs`, `sm`, `md`, `lg`, and `xl`. This also means every tier has been bumped up one level (so `.col-md-6` in v3 is now `.col-lg-6` in v4). -- cgit v1.2.3 From f041fb737305732ac4a14f37cbd7c6ac2c2e2898 Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Wed, 21 Dec 2016 22:19:16 -0800 Subject: migrate some notes on over here --- docs/migration.md | 11 ++++++++++- 1 file changed, 10 insertions(+), 1 deletion(-) (limited to 'docs/migration.md') diff --git a/docs/migration.md b/docs/migration.md index d6f916ba5..0fa509638 100644 --- a/docs/migration.md +++ b/docs/migration.md @@ -141,7 +141,16 @@ New to Bootstrap 4 is the Reboot, a new stylesheet that builds on Normalize with ### Navbar -- Dropped the `.navbar-form` class entirely. It's no longer necessary. +The navbar has been entirely rewritten in flexbox with improved support for alignment, responsiveness, and customization. + +- Responsive navbar behaviors are now applied to the `.navbar` class via the **required** `.navbar-toggleable-{breakpoint}` where you choose where to collapse the navbar. Previously this was a Less variable modification and required recompiling. +- `.navbar-default` is now `.navbar-light`, though `.navbar-inverse` remains the same. **One of these is required on each navbar.** However, these classes no longer set `background-color`s; instead they essentiatlly only affect `color`. +- Navbars now require a background declaration of some kind. Choose from our background utilities (`.bg-*`) or set your own with the light/inverse classes above [for mad customization]({{ site.baseurl }}/components/navbar/#color-schemes). +- Given flexbox styles, navbars can now use flexbox utilities for easy alignment options. +- `.navbar-toggle` is now `.navbar-toggler` and has different styles and inner markup (no more three ``s). +- Dropped the `.navbar-form` class entirely. It's no longer necessary; instead, just use `.form-inline` and apply margin utilities as necessary. +- Navbars no longer include `margin-bottom` or `border-radius` by default. Use utilities as necessary. +- All examples featuring navbars have been updated to include new markup. ### Pagination -- cgit v1.2.3 From b5044765b79ddf4ff67f4cc94babfcd629ea7f9e Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Wed, 28 Dec 2016 15:09:51 -0800 Subject: update to migration docs --- docs/migration.md | 47 ++++++++++++++++------------------------------- 1 file changed, 16 insertions(+), 31 deletions(-) (limited to 'docs/migration.md') diff --git a/docs/migration.md b/docs/migration.md index 0fa509638..a01e85dd4 100644 --- a/docs/migration.md +++ b/docs/migration.md @@ -21,10 +21,11 @@ Here are the big ticket items you'll want to be aware of when moving from v3 to ### Global changes +- Flexbox is enabled by default. In general this means a move away from floats and more across our components. - Switched from [Less](http://lesscss.org/) to [Sass](http://sass-lang.com/) for our source CSS files. - Switched from `px` to `rem` as our primary CSS unit, though pixels are still used for media queries and grid behavior as viewports are not affected by type size. - Global font-size increased from `14px` to `16px`. -- Added a new grid tier for smaller devices at `576px` and below. +- Added a new grid tier for smaller devices at `576px` and below (our new `xs` tier). - Replaced the separate optional theme with configurable options via SCSS variables (e.g., `$enable-gradients: true`). ### Grid system @@ -96,6 +97,7 @@ New to Bootstrap 4 is the Reboot, a new stylesheet that builds on Normalize with - Dropped the `.form-horizontal` class requirement. - `.form-group` no longer applies styles from the `.row` via mixin, so `.row` is now required for horizontal grid layouts (e.g., `
`). - Added new `.form-control-label` class to vertically center labels with `.form-control`s. +- Added custom forms support (for checkboxes, radios, selects, and file inputs). ### Buttons @@ -106,8 +108,10 @@ New to Bootstrap 4 is the Reboot, a new stylesheet that builds on Normalize with ### Button group +- Rewrote component with flexbox. - Dropped the `.btn-group-xs` class entirely given removal of `.btn-xs`. -- Removed justified button groups as they were only available for `` elements and not `