Skip to content
GitLab
Commit c68019e5 authored by Mark Otto's avatar Mark Otto
Browse files

Merge pull request #18257 from twbs/border-width-vars 

Add more border width variables
parents 1f487f79 ca68331b
38 merge requests!28721Hot test,!27561Adds font-weight-medium to font weight classes,!26437merge,!26197V4 dev xmr,!20778V4 dev,!20539Allow multiple modals,!18988Blockquote border width,!20854Fixes 15534,!19272V4 dev xmr grunt html,!19581V4 fix popover,!20493V4 dev display,!20636Fix docs for heading sizes,!19824blockquote-center,!22547Finished a new translation for bootstrap,!19534Docs 17264,!19533Npm deps,!22143Fix selectable disabled toggle radio buttons,!19084V4 rhythm,!22598test,!18829Add prefix to carousel classes,!18581Check getting started files for broken links - Issue 18568,!20099V4.0.0 alpha.3,!18477add utility color-contrast function,!18864Feature/navbar toggler support color schemes,!19602V4 palettes arun,!19448New pull request for testing,!19358XXL grid size,!19825.blockquote-center,!25326Adjust examples,!23995Add back cursor: pointer for .btn-link,!23178Spinner,!19754Issue template,!19753Card img overlay padding,!19747Blockquote border width,!19580ExitStars,!18684Docs: change "Button" to "Go somewhere",!18661Docs: accessibility fix-up of collapsible content navbar, change site-wide main navbar,!17021v4
Hide whitespace changes
Inline Side-by-side
Showing
with 40 additions and 31 deletions
+40 -31
scss/_custom-forms.scss
+ 1
- 1
View file @ c68019e5
...@@ -138,7 +138,7 @@ ...@@ -138,7 +138,7 @@
background: #fff url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAUCAMAAACzvE1FAAAADFBMVEUzMzMzMzMzMzMzMzMKAG/3AAAAA3RSTlMAf4C/aSLHAAAAPElEQVR42q3NMQ4AIAgEQTn//2cLdRKppSGzBYwzVXvznNWs8C58CiussPJj8h6NwgorrKRdTvuV9v16Afn0AYFOB7aYAAAAAElFTkSuQmCC) no-repeat right .75rem center; background: #fff url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAUCAMAAACzvE1FAAAADFBMVEUzMzMzMzMzMzMzMzMKAG/3AAAAA3RSTlMAf4C/aSLHAAAAPElEQVR42q3NMQ4AIAgEQTn//2cLdRKppSGzBYwzVXvznNWs8C58CiussPJj8h6NwgorrKRdTvuV9v16Afn0AYFOB7aYAAAAAElFTkSuQmCC) no-repeat right .75rem center;
background-image: none \9; background-image: none \9;
background-size: 8px 10px; background-size: 8px 10px;
border: 1px solid $input-border; border: $input-border-width solid $input-border-color;
// Use vendor prefixes as `appearance` isn't part of the CSS spec. // Use vendor prefixes as `appearance` isn't part of the CSS spec.
-moz-appearance: none; -moz-appearance: none;
-webkit-appearance: none; -webkit-appearance: none;
......
scss/_dropdown.scss
+ 1
- 1
View file @ c68019e5
...@@ -51,7 +51,7 @@ ...@@ -51,7 +51,7 @@
list-style: none; list-style: none;
background-color: $dropdown-bg; background-color: $dropdown-bg;
background-clip: padding-box; background-clip: padding-box;
border: 1px solid $dropdown-border; border: $dropdown-border-width solid $dropdown-border-color;
@include border-radius($border-radius); @include border-radius($border-radius);
@include box-shadow(0 6px 12px rgba(0,0,0,.175)); @include box-shadow(0 6px 12px rgba(0,0,0,.175));
} }
......
scss/_forms.scss
+ 1
- 1
View file @ c68019e5
...@@ -14,7 +14,7 @@ ...@@ -14,7 +14,7 @@
background-color: $input-bg; background-color: $input-bg;
// Reset unusual Firefox-on-Android default style; see https://github.com/necolas/normalize.css/issues/214. // Reset unusual Firefox-on-Android default style; see https://github.com/necolas/normalize.css/issues/214.
background-image: none; background-image: none;
border: $border-width solid $input-border; border: $input-border-width solid $input-border-color;
// Note: This has no effect on <select>s in some browsers, due to the limited stylability of `<select>`s in CSS. // Note: This has no effect on <select>s in some browsers, due to the limited stylability of `<select>`s in CSS.
@include border-radius($input-border-radius); @include border-radius($input-border-radius);
@include box-shadow($input-box-shadow); @include box-shadow($input-box-shadow);
......
scss/_images.scss
+ 1
- 1
View file @ c68019e5
...@@ -19,7 +19,7 @@ ...@@ -19,7 +19,7 @@
padding: $thumbnail-padding; padding: $thumbnail-padding;
line-height: $line-height; line-height: $line-height;
background-color: $thumbnail-bg; background-color: $thumbnail-bg;
border: 1px solid $thumbnail-border; border: $thumbnail-border-width solid $thumbnail-border-color;
border-radius: $thumbnail-border-radius; border-radius: $thumbnail-border-radius;
transition: all .2s ease-in-out; transition: all .2s ease-in-out;
@include box-shadow(0 1px 2px rgba(0,0,0,.075)); @include box-shadow(0 1px 2px rgba(0,0,0,.075));
......
scss/_list-group.scss
+ 3
- 3
View file @ c68019e5
...@@ -18,9 +18,9 @@ ...@@ -18,9 +18,9 @@
display: block; display: block;
padding: .75rem 1.25rem; padding: .75rem 1.25rem;
// Place the border on the list items and negative margin up for better styling // Place the border on the list items and negative margin up for better styling
margin-bottom: -$border-width; margin-bottom: -$list-group-border-width;
background-color: $list-group-bg; background-color: $list-group-bg;
border: $border-width solid $list-group-border; border: $list-group-border-width solid $list-group-border-color;
// Round the first and last items // Round the first and last items
&:first-child { &:first-child {
...@@ -34,7 +34,7 @@ ...@@ -34,7 +34,7 @@
.list-group-flush { .list-group-flush {
.list-group-item { .list-group-item {
border-width: $border-width 0; border-width: $list-group-border-width 0;
border-radius: 0; border-radius: 0;
} }
} }
......
scss/_nav.scss
+ 1
- 1
View file @ c68019e5
...@@ -59,7 +59,7 @@ ...@@ -59,7 +59,7 @@
.nav-link { .nav-link {
display: block; display: block;
padding: $nav-link-padding; padding: $nav-link-padding;
border: 1px solid transparent; border: $nav-tabs-link-border-width solid transparent;
@include border-radius($border-radius $border-radius 0 0); @include border-radius($border-radius $border-radius 0 0);
@include hover-focus { @include hover-focus {
......
scss/_pager.scss
+ 1
- 1
View file @ c68019e5
...@@ -14,7 +14,7 @@ ...@@ -14,7 +14,7 @@
display: inline-block; display: inline-block;
padding: 5px 14px; padding: 5px 14px;
background-color: $pager-bg; background-color: $pager-bg;
border: 1px solid $pager-border; border: $pager-border-width solid $pager-border-color;
border-radius: $pager-border-radius; border-radius: $pager-border-radius;
} }
......
scss/_pagination.scss
+ 1
- 1
View file @ c68019e5
...@@ -18,7 +18,7 @@ ...@@ -18,7 +18,7 @@
color: $pagination-color; color: $pagination-color;
text-decoration: none; text-decoration: none;
background-color: $pagination-bg; background-color: $pagination-bg;
border: 1px solid $pagination-border; border: $pagination-border-width solid $pagination-border-color;
} }
&:first-child { &:first-child {
> a, > a,
......
scss/_popover.scss
+ 2
- 2
View file @ c68019e5
...@@ -12,7 +12,7 @@ ...@@ -12,7 +12,7 @@
font-size: $font-size-sm; font-size: $font-size-sm;
background-color: $popover-bg; background-color: $popover-bg;
background-clip: padding-box; background-clip: padding-box;
border: 1px solid $popover-border-color; border: $popover-border-width solid $popover-border-color;
@include border-radius($border-radius-lg); @include border-radius($border-radius-lg);
@include box-shadow(0 5px 10px rgba(0,0,0,.2)); @include box-shadow(0 5px 10px rgba(0,0,0,.2));
...@@ -107,7 +107,7 @@ ...@@ -107,7 +107,7 @@
margin: 0; // reset heading margin margin: 0; // reset heading margin
font-size: $font-size-base; font-size: $font-size-base;
background-color: $popover-title-bg; background-color: $popover-title-bg;
border-bottom: 1px solid darken($popover-title-bg, 5%); border-bottom: $popover-border-width solid darken($popover-title-bg, 5%);
@include border-radius(($border-radius-lg - 1) ($border-radius-lg - 1) 0 0); @include border-radius(($border-radius-lg - 1) ($border-radius-lg - 1) 0 0);
} }
......
scss/_tables.scss
+ 12
- 12
View file @ c68019e5
...@@ -12,16 +12,16 @@ ...@@ -12,16 +12,16 @@
padding: $table-cell-padding; padding: $table-cell-padding;
line-height: $line-height; line-height: $line-height;
vertical-align: top; vertical-align: top;
border-top: 1px solid $table-border-color; border-top: $table-border-width solid $table-border-color;
} }
thead th { thead th {
vertical-align: bottom; vertical-align: bottom;
border-bottom: 2px solid $table-border-color; border-bottom: (2 * $table-border-width) solid $table-border-color;
} }
tbody + tbody { tbody + tbody {
border-top: 2px solid $table-border-color; border-top: (2 * $table-border-width) solid $table-border-color;
} }
.table { .table {
...@@ -47,17 +47,17 @@ ...@@ -47,17 +47,17 @@
// Add borders all around the table and between all the columns. // Add borders all around the table and between all the columns.
.table-bordered { .table-bordered {
border: 1px solid $table-border-color; border: $table-border-width solid $table-border-color;
th, th,
td { td {
border: 1px solid $table-border-color; border: $table-border-width solid $table-border-color;
} }
thead { thead {
th, th,
td { td {
border-bottom-width: 2px; border-bottom-width: (2 * $table-border-width);
} }
} }
} }
...@@ -114,7 +114,7 @@ ...@@ -114,7 +114,7 @@
// TODO: find out if we need this still. // TODO: find out if we need this still.
// //
// border: 1px solid $table-border-color; // border: $table-border-width solid $table-border-color;
// -ms-overflow-style: -ms-autohiding-scrollbar; // See https://github.com/twbs/bootstrap/pull/10057 // -ms-overflow-style: -ms-autohiding-scrollbar; // See https://github.com/twbs/bootstrap/pull/10057
} }
...@@ -160,11 +160,11 @@ ...@@ -160,11 +160,11 @@
th, th,
td { td {
border-top: 1px solid $table-border-color; border-top: $table-border-width solid $table-border-color;
border-left: 1px solid $table-border-color; border-left: $table-border-width solid $table-border-color;
&:last-child { &:last-child {
border-right: 1px solid $table-border-color; border-right: $table-border-width solid $table-border-color;
} }
} }
...@@ -175,7 +175,7 @@ ...@@ -175,7 +175,7 @@
tr:last-child { tr:last-child {
th, th,
td { td {
border-bottom: 1px solid $table-border-color; border-bottom: $table-border-width solid $table-border-color;
} }
} }
} }
...@@ -187,7 +187,7 @@ ...@@ -187,7 +187,7 @@
th, th,
td { td {
display: block !important; display: block !important;
border: 1px solid $table-border-color; border: $table-border-width solid $table-border-color;
} }
} }
} }
scss/_variables.scss
+ 16
- 7
View file @ c68019e5
...@@ -207,6 +207,7 @@ $table-bg-accent: #f9f9f9 !default; ...@@ -207,6 +207,7 @@ $table-bg-accent: #f9f9f9 !default;
$table-bg-hover: #f5f5f5 !default; $table-bg-hover: #f5f5f5 !default;
$table-bg-active: $table-bg-hover !default; $table-bg-active: $table-bg-hover !default;
$table-border-width: $border-width !default;
$table-border-color: $gray-lighter !default; $table-border-color: $gray-lighter !default;
...@@ -265,7 +266,8 @@ $input-bg: #fff !default; ...@@ -265,7 +266,8 @@ $input-bg: #fff !default;
$input-bg-disabled: $gray-lighter !default; $input-bg-disabled: $gray-lighter !default;
$input-color: $gray !default; $input-color: $gray !default;
$input-border: #ccc !default; $input-border-color: #ccc !default;
$input-border-width: $border-width !default;
$input-box-shadow: inset 0 1px 1px rgba(0,0,0,.075) !default; $input-box-shadow: inset 0 1px 1px rgba(0,0,0,.075) !default;
$input-border-radius: $border-radius !default; $input-border-radius: $border-radius !default;
...@@ -290,7 +292,7 @@ $input-height-sm: (($font-size-sm * $line-height-sm) + ($input-pa ...@@ -290,7 +292,7 @@ $input-height-sm: (($font-size-sm * $line-height-sm) + ($input-pa
$form-group-margin-bottom: $spacer-y !default; $form-group-margin-bottom: $spacer-y !default;
$input-group-addon-bg: $gray-lighter !default; $input-group-addon-bg: $gray-lighter !default;
$input-group-addon-border-color: $input-border !default; $input-group-addon-border-color: $input-border-color !default;
$cursor-disabled: not-allowed !default; $cursor-disabled: not-allowed !default;
...@@ -305,7 +307,8 @@ $form-icon-danger: "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My ...@@ -305,7 +307,8 @@ $form-icon-danger: "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My
// Dropdown menu container and contents. // Dropdown menu container and contents.
$dropdown-bg: #fff !default; $dropdown-bg: #fff !default;
$dropdown-border: rgba(0,0,0,.15) !default; $dropdown-border-color: rgba(0,0,0,.15) !default;
$dropdown-border-width: $border-width !default;
$dropdown-divider-bg: #e5e5e5 !default; $dropdown-divider-bg: #e5e5e5 !default;
$dropdown-link-color: $gray-dark !default; $dropdown-link-color: $gray-dark !default;
...@@ -364,6 +367,7 @@ $nav-disabled-link-hover-color: $gray-light !default; ...@@ -364,6 +367,7 @@ $nav-disabled-link-hover-color: $gray-light !default;
$nav-tabs-border-color: #ddd !default; $nav-tabs-border-color: #ddd !default;
$nav-tabs-link-border-width: $border-width !default;
$nav-tabs-link-hover-border-color: $gray-lighter !default; $nav-tabs-link-hover-border-color: $gray-lighter !default;
$nav-tabs-active-link-hover-bg: $body-bg !default; $nav-tabs-active-link-hover-bg: $body-bg !default;
...@@ -390,7 +394,8 @@ $pagination-padding-y-lg: .75rem !default; ...@@ -390,7 +394,8 @@ $pagination-padding-y-lg: .75rem !default;
$pagination-color: $link-color !default; $pagination-color: $link-color !default;
$pagination-bg: #fff !default; $pagination-bg: #fff !default;
$pagination-border: #ddd !default; $pagination-border-width: $border-width !default;
$pagination-border-color: #ddd !default;
$pagination-hover-color: $link-hover-color !default; $pagination-hover-color: $link-hover-color !default;
$pagination-hover-bg: $gray-lighter !default; $pagination-hover-bg: $gray-lighter !default;
...@@ -408,7 +413,8 @@ $pagination-disabled-border: #ddd !default; ...@@ -408,7 +413,8 @@ $pagination-disabled-border: #ddd !default;
// Pager // Pager
$pager-bg: $pagination-bg !default; $pager-bg: $pagination-bg !default;
$pager-border: $pagination-border !default; $pager-border-width: $border-width !default;
$pager-border-color: $pagination-border-color !default;
$pager-border-radius: 15px !default; $pager-border-radius: 15px !default;
$pager-hover-bg: $pagination-hover-bg !default; $pager-hover-bg: $pagination-hover-bg !default;
...@@ -474,6 +480,7 @@ $tooltip-arrow-color: $tooltip-bg !default; ...@@ -474,6 +480,7 @@ $tooltip-arrow-color: $tooltip-bg !default;
$popover-bg: #fff !default; $popover-bg: #fff !default;
$popover-max-width: 276px !default; $popover-max-width: 276px !default;
$popover-border-width: $border-width !default;
$popover-border-color: rgba(0,0,0,.2) !default; $popover-border-color: rgba(0,0,0,.2) !default;
$popover-title-bg: darken($popover-bg, 3%) !default; $popover-title-bg: darken($popover-bg, 3%) !default;
...@@ -561,7 +568,8 @@ $progress-bar-info-bg: $brand-info !default; ...@@ -561,7 +568,8 @@ $progress-bar-info-bg: $brand-info !default;
// List group // List group
$list-group-bg: #fff !default; $list-group-bg: #fff !default;
$list-group-border: #ddd !default; $list-group-border-color: #ddd !default;
$list-group-border-width: $border-width !default;
$list-group-border-radius: $border-radius !default; $list-group-border-radius: $border-radius !default;
$list-group-hover-bg: #f5f5f5 !default; $list-group-hover-bg: #f5f5f5 !default;
...@@ -583,7 +591,8 @@ $list-group-link-heading-color: #333 !default; ...@@ -583,7 +591,8 @@ $list-group-link-heading-color: #333 !default;
$thumbnail-padding: .25rem !default; $thumbnail-padding: .25rem !default;
$thumbnail-bg: $body-bg !default; $thumbnail-bg: $body-bg !default;
$thumbnail-border: #ddd !default; $thumbnail-border-width: $border-width !default;
$thumbnail-border-color: #ddd !default;
$thumbnail-border-radius: $border-radius !default; $thumbnail-border-radius: $border-radius !default;
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment