diff --git a/docs/4.0/getting-started/introduction.md b/docs/4.0/getting-started/introduction.md
index ec3c4033c636b63c816ddc17dc09dfb385d20b73..604c3f525809fbf04e98850aa6b93a40c5359aec 100644
--- a/docs/4.0/getting-started/introduction.md
+++ b/docs/4.0/getting-started/introduction.md
@@ -4,9 +4,10 @@ title: Introduction
description: Get started with Bootstrap, the world's most popular framework for building responsive, mobile-first sites, with the Bootstrap CDN and a template starter page.
group: getting-started
redirect_from:
- - /docs/4.0/getting-started/
- - /docs/4.0/
- /docs/
+ - /docs/4.0/
+ - /docs/4.0/getting-started/
+ - /docs/getting-started/
toc: true
---
diff --git a/scss/_buttons.scss b/scss/_buttons.scss
index 16d879cd853269fe30866efa7522a1a086d99e09..749f96a7cc2af6a67680773281dc53ad2982a69e 100644
--- a/scss/_buttons.scss
+++ b/scss/_buttons.scss
@@ -28,7 +28,7 @@
// Disabled comes first so active can properly restyle
&.disabled,
&:disabled {
- opacity: .65;
+ opacity: $btn-disabled-opacity;
@include box-shadow(none);
}
diff --git a/scss/_nav.scss b/scss/_nav.scss
index 14e76c9acc48792a6083de6a03c200140e03c9cf..fc82161e3413142b17c0dd8342b0450a43786957 100644
--- a/scss/_nav.scss
+++ b/scss/_nav.scss
@@ -41,7 +41,7 @@
@include border-top-radius($nav-tabs-border-radius);
@include hover-focus {
- border-color: $nav-tabs-link-hover-border-color $nav-tabs-link-hover-border-color $nav-tabs-border-color;
+ border-color: $nav-tabs-link-hover-border-color;
}
&.disabled {
@@ -55,7 +55,7 @@
.nav-item.show .nav-link {
color: $nav-tabs-link-active-color;
background-color: $nav-tabs-link-active-bg;
- border-color: $nav-tabs-link-active-border-color $nav-tabs-link-active-border-color $nav-tabs-link-active-bg;
+ border-color: $nav-tabs-link-active-border-color;
}
.dropdown-menu {
diff --git a/scss/_progress.scss b/scss/_progress.scss
index efbb4403407d239763fa5013fa257eecc63d30c2..cd130c66efdbbc525feaa4e661c846a96e15c001 100644
--- a/scss/_progress.scss
+++ b/scss/_progress.scss
@@ -14,10 +14,12 @@
.progress-bar {
display: flex;
- align-items: center;
+ flex-direction: column;
justify-content: center;
color: $progress-bar-color;
+ text-align: center;
background-color: $progress-bar-bg;
+ @include transition($progress-bar-transition);
}
.progress-bar-striped {
diff --git a/scss/_tooltip.scss b/scss/_tooltip.scss
index 7b5db1cf2a5f2e97f5f1ca78bd593e028ab84ade..b03139c9117624b09e437b81290dc8e96bc064ab 100644
--- a/scss/_tooltip.scss
+++ b/scss/_tooltip.scss
@@ -34,7 +34,7 @@
}
.arrow::before {
- margin-left: -($tooltip-arrow-width - 2);
+ margin-left: -$tooltip-arrow-width;
content: "";
border-width: $tooltip-arrow-width $tooltip-arrow-width 0;
border-top-color: $tooltip-arrow-color;
@@ -47,7 +47,7 @@
}
.arrow::before {
- margin-top: -($tooltip-arrow-width - 2);
+ margin-top: -$tooltip-arrow-width;
content: "";
border-width: $tooltip-arrow-width $tooltip-arrow-width $tooltip-arrow-width 0;
border-right-color: $tooltip-arrow-color;
@@ -60,7 +60,7 @@
}
.arrow::before {
- margin-left: -($tooltip-arrow-width - 2);
+ margin-left: -$tooltip-arrow-width;
content: "";
border-width: 0 $tooltip-arrow-width $tooltip-arrow-width;
border-bottom-color: $tooltip-arrow-color;
@@ -74,7 +74,7 @@
.arrow::before {
right: 0;
- margin-top: -($tooltip-arrow-width - 2);
+ margin-top: -($tooltip-arrow-width);
content: "";
border-width: $tooltip-arrow-width 0 $tooltip-arrow-width $tooltip-arrow-width;
border-left-color: $tooltip-arrow-color;
diff --git a/scss/_variables.scss b/scss/_variables.scss
index a8e4392ab6ab4f8fff25f6a94e71a9fa52cbcc6e..99a5179a8119cbfa94d317d18a10b5635a24aa2c 100644
--- a/scss/_variables.scss
+++ b/scss/_variables.scss
@@ -280,7 +280,7 @@ $dt-font-weight: $font-weight-bold !default;
$kbd-box-shadow: inset 0 -.1rem 0 rgba($black, .25) !default;
$nested-kbd-font-weight: $font-weight-bold !default;
-$list-inline-padding: 5px !default;
+$list-inline-padding: .5rem !default;
$mark-bg: #fcf8e3 !default;
@@ -357,6 +357,7 @@ $btn-font-weight: $font-weight-normal !default;
$btn-box-shadow: inset 0 1px 0 rgba($white, .15), 0 1px 1px rgba($black, .075) !default;
$btn-focus-width: $input-btn-focus-width !default;
$btn-focus-box-shadow: $input-btn-focus-box-shadow !default;
+$btn-disabled-opacity: .65 !default;
$btn-active-box-shadow: inset 0 3px 5px rgba($black, .125) !default;
$btn-link-disabled-color: $gray-600 !default;
@@ -569,10 +570,10 @@ $nav-link-disabled-color: $gray-600 !default;
$nav-tabs-border-color: $gray-300 !default;
$nav-tabs-border-width: $border-width !default;
$nav-tabs-border-radius: $border-radius !default;
-$nav-tabs-link-hover-border-color: $gray-200 !default;
+$nav-tabs-link-hover-border-color: $gray-200 $gray-200 $nav-tabs-border-color !default;
$nav-tabs-link-active-color: $gray-700 !default;
$nav-tabs-link-active-bg: $body-bg !default;
-$nav-tabs-link-active-border-color: $gray-300 !default;
+$nav-tabs-link-active-border-color: $gray-300 $gray-300 $nav-tabs-link-active-bg !default;
$nav-pills-border-radius: $border-radius !default;
$nav-pills-link-active-color: $component-active-color !default;
@@ -665,18 +666,17 @@ $card-columns-margin: $card-spacer-y !default;
// Tooltips
-$tooltip-max-width: 200px !default;
-$tooltip-color: $white !default;
-$tooltip-bg: $black !default;
-$tooltip-opacity: .9 !default;
-$tooltip-padding-y: 3px !default;
-$tooltip-padding-x: 8px !default;
-$tooltip-margin: 0 !default;
-
-
-$tooltip-arrow-width: 5px !default;
-$tooltip-arrow-height: 5px !default;
-$tooltip-arrow-color: $tooltip-bg !default;
+$tooltip-max-width: 200px !default;
+$tooltip-color: $white !default;
+$tooltip-bg: $black !default;
+$tooltip-opacity: .9 !default;
+$tooltip-padding-y: .25rem !default;
+$tooltip-padding-x: .5rem !default;
+$tooltip-margin: 0 !default;
+
+$tooltip-arrow-width: .4rem !default;
+$tooltip-arrow-height: $tooltip-arrow-width !default;
+$tooltip-arrow-color: $tooltip-bg !default;
// Popovers
diff --git a/scss/mixins/_forms.scss b/scss/mixins/_forms.scss
index 6c171aae8cf0f0882f2368bc2bcc0c44e34d1bf9..cea803de338063cb76763f54ed7b3a29dfc6acaf 100644
--- a/scss/mixins/_forms.scss
+++ b/scss/mixins/_forms.scss
@@ -57,6 +57,7 @@
border-color: $color;
&:focus {
+ border-color: $color;
box-shadow: 0 0 0 $input-focus-width rgba($color, .25);
}