privacyguides/privacyguides.org
1
0
Fork 0
mirror of https://github.com/privacyguides/privacyguides.org.git synced 2025-07-23 20:01:08 +00:00
Code Issues Activity

Update bootstrap

Browse Source
This commit is contained in:
Jonah Aragon
2020-04-28 16:14:23 -05:00
parent a48c4889bf
commit 3ebbd2728e
88 changed files with 439 additions and 277 deletions
Download Patch File Download Diff File Expand all files Collapse all files

40
_sass/bootstrap/_modal.scss Executable file → Normal file
View File

@@ -48,14 +48,19 @@
.modal.show & {
transform: $modal-show-transform;
}
// When trying to close, animate focus to scale
.modal.modal-static & {
transform: $modal-scale-transform;
}
}
.modal-dialog-scrollable {
display: flex; // IE10/11
max-height: calc(100% - #{$modal-dialog-margin * 2});
max-height: subtract(100%, $modal-dialog-margin * 2);
.modal-content {
max-height: calc(100vh - #{$modal-dialog-margin * 2}); // IE10/11
max-height: subtract(100vh, $modal-dialog-margin * 2); // IE10/11
overflow: hidden;
}
@@ -72,12 +77,12 @@
.modal-dialog-centered {
display: flex;
align-items: center;
min-height: calc(100% - #{$modal-dialog-margin * 2});
min-height: subtract(100%, $modal-dialog-margin * 2);
// Ensure `modal-dialog-centered` extends the full height of the view (IE10/11)
&::before {
display: block; // IE10
height: calc(100vh - #{$modal-dialog-margin * 2});
height: subtract(100vh, $modal-dialog-margin * 2);
content: "";
}
@@ -138,7 +143,7 @@
justify-content: space-between; // Put modal header elements (title and dismiss) on opposite ends
padding: $modal-header-padding;
border-bottom: $modal-header-border-width solid $modal-header-border-color;
@include border-top-radius($modal-content-border-radius);
@include border-top-radius($modal-content-inner-border-radius);
.close {
padding: $modal-header-padding;
@@ -158,7 +163,7 @@
.modal-body {
position: relative;
// Enable `flex-grow: 1` so that the body take up as much space as possible
// when should there be a fixed height on `.modal-dialog`.
// when there should be a fixed height on `.modal-dialog`.
flex: 1 1 auto;
padding: $modal-inner-padding;
}
@@ -166,15 +171,20 @@
// Footer (for actions)
.modal-footer {
display: flex;
flex-wrap: wrap;
align-items: center; // vertically center
justify-content: flex-end; // Right align buttons with flex property because text-align doesn't work on flex items
padding: $modal-inner-padding;
padding: $modal-inner-padding - $modal-footer-margin-between / 2;
border-top: $modal-footer-border-width solid $modal-footer-border-color;
@include border-bottom-radius($modal-content-border-radius);
@include border-bottom-radius($modal-content-inner-border-radius);
// Easily place margin between footer elements
> :not(:first-child) { margin-left: .25rem; }
> :not(:last-child) { margin-right: .25rem; }
// Place margin between footer elements
// This solution is far from ideal because of the universal selector usage,
// but is needed to fix https://github.com/twbs/bootstrap/issues/24800
// stylelint-disable-next-line selector-max-universal
> * {
margin: $modal-footer-margin-between / 2;
}
}
// Measure scrollbar width for padding body during modal show/hide
@@ -195,18 +205,18 @@
}
.modal-dialog-scrollable {
max-height: calc(100% - #{$modal-dialog-margin-y-sm-up * 2});
max-height: subtract(100%, $modal-dialog-margin-y-sm-up * 2);
.modal-content {
max-height: calc(100vh - #{$modal-dialog-margin-y-sm-up * 2});
max-height: subtract(100vh, $modal-dialog-margin-y-sm-up * 2);
}
}
.modal-dialog-centered {
min-height: calc(100% - #{$modal-dialog-margin-y-sm-up * 2});
min-height: subtract(100%, $modal-dialog-margin-y-sm-up * 2);
&::before {
height: calc(100vh - #{$modal-dialog-margin-y-sm-up * 2});
height: subtract(100vh, $modal-dialog-margin-y-sm-up * 2);
}
}