` elements.
+// 3. Prevent adjustments of font size after orientation changes in iOS.
+// 4. Change the default tap highlight to be completely transparent in iOS.
body {
margin: 0; // 1
@@ -50,82 +50,120 @@ body {
font-weight: $font-weight-base;
line-height: $line-height-base;
color: $body-color;
- text-align: left; // 3
+ text-align: $body-text-align;
background-color: $body-bg; // 2
-}
-
-// Future-proof rule: in browsers that support :focus-visible, suppress the focus outline
-// on elements that programmatically receive focus but wouldn't normally show a visible
-// focus outline. In general, this would mean that the outline is only applied if the
-// interaction that led to the element receiving programmatic focus was a keyboard interaction,
-// or the browser has somehow determined that the user is primarily a keyboard user and/or
-// wants focus outlines to always be presented.
-//
-// See https://developer.mozilla.org/en-US/docs/Web/CSS/:focus-visible
-// and https://developer.paciellogroup.com/blog/2018/03/focus-visible-and-backwards-compatibility/
-[tabindex="-1"]:focus:not(:focus-visible) {
- outline: 0 !important;
+ -webkit-text-size-adjust: 100%; // 3
+ -webkit-tap-highlight-color: rgba($black, 0); // 4
}
// Content grouping
//
-// 1. Add the correct box sizing in Firefox.
-// 2. Show the overflow in Edge and IE.
+// 1. Reset Firefox's gray color
+// 2. Set correct height and prevent the `size` attribute to make the `hr` look like an input field
hr {
- box-sizing: content-box; // 1
- height: 0; // 1
- overflow: visible; // 2
+ margin: $hr-margin-y 0;
+ color: $hr-color; // 1
+ background-color: currentColor;
+ border: 0;
+ opacity: $hr-opacity;
+}
+
+hr:not([size]) {
+ height: $hr-height; // 2
}
-//
// Typography
//
+// 1. Remove top margins from headings
+// By default, ``-`` all receive top and bottom margins. We nuke the top
+// margin for easier control within type scales as it avoids margin collapsing.
-// Remove top margins from headings
-//
-// By default, ``-`` all receive top and bottom margins. We nuke the top
-// margin for easier control within type scales as it avoids margin collapsing.
-// stylelint-disable-next-line selector-list-comma-newline-after
-h1, h2, h3, h4, h5, h6 {
- margin-top: 0;
+%heading {
+ margin-top: 0; // 1
margin-bottom: $headings-margin-bottom;
+ font-family: $headings-font-family;
+ font-style: $headings-font-style;
+ font-weight: $headings-font-weight;
+ line-height: $headings-line-height;
+ color: $headings-color;
+}
+
+h1 {
+ @extend %heading;
+ @include font-size($h1-font-size);
}
+h2 {
+ @extend %heading;
+ @include font-size($h2-font-size);
+}
+
+h3 {
+ @extend %heading;
+ @include font-size($h3-font-size);
+}
+
+h4 {
+ @extend %heading;
+ @include font-size($h4-font-size);
+}
+
+h5 {
+ @extend %heading;
+ @include font-size($h5-font-size);
+}
+
+h6 {
+ @extend %heading;
+ @include font-size($h6-font-size);
+}
+
+
// Reset margins on paragraphs
//
// Similarly, the top margin on ` `s get reset. However, we also reset the
// bottom margin to use `rem` units instead of `em`.
+
p {
margin-top: 0;
margin-bottom: $paragraph-margin-bottom;
}
+
// Abbreviations
//
-// 1. Duplicate behavior to the data-* attribute for our tooltip plugin
-// 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
+// 1. Duplicate behavior to the data-bs-* attribute for our tooltip plugin
+// 2. Add the correct text decoration in Chrome, Edge, Opera, and Safari.
// 3. Add explicit cursor to indicate changed behavior.
-// 4. Remove the bottom border in Firefox 39-.
-// 5. Prevent the text-decoration to be skipped.
+// 4. Prevent the text-decoration to be skipped.
abbr[title],
-abbr[data-original-title] { // 1
- text-decoration: underline; // 2
+abbr[data-bs-original-title] { // 1
text-decoration: underline dotted; // 2
cursor: help; // 3
- border-bottom: 0; // 4
- text-decoration-skip-ink: none; // 5
+ text-decoration-skip-ink: none; // 4
}
+
+// Address
+
address {
margin-bottom: 1rem;
font-style: normal;
line-height: inherit;
}
+
+// Lists
+
+ol,
+ul {
+ padding-left: 2rem;
+}
+
ol,
ul,
dl {
@@ -144,33 +182,57 @@ dt {
font-weight: $dt-font-weight;
}
+// 1. Undo browser default
+
dd {
margin-bottom: .5rem;
- margin-left: 0; // Undo browser default
+ margin-left: 0; // 1
}
+
+// Blockquote
+
blockquote {
margin: 0 0 1rem;
}
+
+// Strong
+//
+// Add the correct font weight in Chrome, Edge, and Safari
+
b,
strong {
- font-weight: $font-weight-bolder; // Add the correct font weight in Chrome, Edge, and Safari
+ font-weight: $font-weight-bolder;
}
+
+// Small
+//
+// Add the correct font size in all browsers
+
small {
- @include font-size(80%); // Add the correct font size in all browsers
+ @include font-size($small-font-size);
}
+
+// Mark
+
+mark {
+ padding: $mark-padding;
+ background-color: $mark-bg;
+}
+
+
+// Sub and Sup
//
// Prevent `sub` and `sup` elements from affecting the line height in
// all browsers.
-//
sub,
sup {
position: relative;
- @include font-size(75%);
+ @include font-size($sub-sup-font-size);
line-height: 0;
vertical-align: baseline;
}
@@ -179,16 +241,13 @@ sub { bottom: -.25em; }
sup { top: -.5em; }
-//
// Links
-//
a {
color: $link-color;
text-decoration: $link-decoration;
- background-color: transparent; // Remove the gray background on active links in IE 10.
- @include hover() {
+ &:hover {
color: $link-hover-color;
text-decoration: $link-hover-decoration;
}
@@ -200,82 +259,103 @@ a {
// See https://github.com/twbs/bootstrap/issues/19402
a:not([href]):not([class]) {
- color: inherit;
- text-decoration: none;
-
- @include hover() {
+ &,
+ &:hover {
color: inherit;
text-decoration: none;
}
}
-//
// Code
-//
pre,
code,
kbd,
samp {
- font-family: $font-family-monospace;
+ font-family: $font-family-code;
@include font-size(1em); // Correct the odd `em` font sizing in all browsers.
+ direction: ltr #{"/* rtl:ignore */"};
+ unicode-bidi: bidi-override;
}
+// 1. Remove browser default top margin
+// 2. Reset browser default of `1em` to use `rem`s
+// 3. Don't allow content to break outside
+
pre {
- // Remove browser default top margin
- margin-top: 0;
- // Reset browser default of `1em` to use `rem`s
- margin-bottom: 1rem;
- // Don't allow content to break outside
- overflow: auto;
- // Disable auto-hiding scrollbar in IE & legacy Edge to avoid overlap,
- // making it impossible to interact with the content
- -ms-overflow-style: scrollbar;
+ display: block;
+ margin-top: 0; // 1
+ margin-bottom: 1rem; // 2
+ overflow: auto; // 3
+ @include font-size($code-font-size);
+ color: $pre-color;
+
+ // Account for some code outputs that place code tags in pre tags
+ code {
+ @include font-size(inherit);
+ color: inherit;
+ word-break: normal;
+ }
+}
+
+code {
+ @include font-size($code-font-size);
+ color: $code-color;
+ word-wrap: break-word;
+
+ // Streamline the style when inside anchors to avoid broken underline and more
+ a > & {
+ color: inherit;
+ }
+}
+
+kbd {
+ padding: $kbd-padding-y $kbd-padding-x;
+ @include font-size($kbd-font-size);
+ color: $kbd-color;
+ background-color: $kbd-bg;
+ @include border-radius($border-radius-sm);
+
+ kbd {
+ padding: 0;
+ @include font-size(1em);
+ font-weight: $nested-kbd-font-weight;
+ }
}
-//
// Figures
//
+// Apply a consistent margin strategy (matches our type styles).
figure {
- // Apply a consistent margin strategy (matches our type styles).
margin: 0 0 1rem;
}
-//
// Images and content
-//
-
-img {
- vertical-align: middle;
- border-style: none; // Remove the border on images inside links in IE 10-.
-}
+img,
svg {
- // Workaround for the SVG overflow bug in IE10/11 is still required.
- // See https://github.com/twbs/bootstrap/issues/26878
- overflow: hidden;
vertical-align: middle;
}
-//
// Tables
//
+// Prevent double borders
table {
- border-collapse: collapse; // Prevent double borders
+ caption-side: bottom;
+ border-collapse: collapse;
}
caption {
- padding-top: $table-cell-padding;
- padding-bottom: $table-cell-padding;
+ padding-top: $table-cell-padding-y;
+ padding-bottom: $table-cell-padding-y;
color: $table-caption-color;
text-align: left;
- caption-side: bottom;
}
// 1. Removes font-weight bold by inheriting
@@ -288,20 +368,29 @@ th {
text-align: -webkit-match-parent; // 3
}
+thead,
+tbody,
+tfoot,
+tr,
+td,
+th {
+ border-color: inherit;
+ border-style: solid;
+ border-width: 0;
+}
+
-//
// Forms
//
+// 1. Allow labels to use `margin` for spacing.
label {
- // Allow labels to use `margin` for spacing.
- display: inline-block;
- margin-bottom: $label-margin-bottom;
+ display: inline-block; // 1
}
// Remove the default `border-radius` that macOS Chrome adds.
-//
-// Details at https://github.com/twbs/bootstrap/issues/24093
+// See https://github.com/twbs/bootstrap/issues/24093
+
button {
// stylelint-disable-next-line property-disallowed-list
border-radius: 0;
@@ -316,27 +405,24 @@ button:focus:not(:focus-visible) {
outline: 0;
}
+// 1. Remove the margin in Firefox and Safari
+
input,
button,
select,
optgroup,
textarea {
- margin: 0; // Remove the margin in Firefox and Safari
+ margin: 0; // 1
font-family: inherit;
@include font-size(inherit);
line-height: inherit;
}
-button,
-input {
- overflow: visible; // Show the overflow in Edge
-}
-
+// Remove the inheritance of text transform in Firefox
button,
select {
- text-transform: none; // Remove the inheritance of text transform in Firefox
+ text-transform: none;
}
-
// Set the cursor for non-`` buttons
//
// Details at https://github.com/twbs/bootstrap/pull/30562
@@ -344,141 +430,192 @@ select {
cursor: pointer;
}
-// Remove the inheritance of word-wrap in Safari.
-//
-// Details at https://github.com/twbs/bootstrap/issues/24990
select {
+ // Remove the inheritance of word-wrap in Safari.
+ // See https://github.com/twbs/bootstrap/issues/24990
word-wrap: normal;
+
+ // Undo the opacity change from Chrome
+ &:disabled {
+ opacity: 1;
+ }
}
+// Remove the dropdown arrow in Chrome from inputs built with datalists.
+// See https://stackoverflow.com/a/54997118
+
+[list]::-webkit-calendar-picker-indicator {
+ display: none;
+}
// 1. Prevent a WebKit bug where (2) destroys native `audio` and `video`
// controls in Android 4.
// 2. Correct the inability to style clickable types in iOS and Safari.
+// 3. Opinionated: add "hand" cursor to non-disabled button elements.
+
button,
[type="button"], // 1
[type="reset"],
[type="submit"] {
-webkit-appearance: button; // 2
-}
-// Opinionated: add "hand" cursor to non-disabled button elements.
-@if $enable-pointer-cursor-for-buttons {
- button,
- [type="button"],
- [type="reset"],
- [type="submit"] {
+ @if $enable-button-pointers {
&:not(:disabled) {
- cursor: pointer;
+ cursor: pointer; // 3
}
}
}
// Remove inner border and padding from Firefox, but don't restore the outline like Normalize.
-button::-moz-focus-inner,
-[type="button"]::-moz-focus-inner,
-[type="reset"]::-moz-focus-inner,
-[type="submit"]::-moz-focus-inner {
+
+::-moz-focus-inner {
padding: 0;
border-style: none;
}
-input[type="radio"],
-input[type="checkbox"] {
- box-sizing: border-box; // 1. Add the correct box sizing in IE 10-
- padding: 0; // 2. Remove the padding in IE 10-
-}
-
+// 1. Textareas should really only resize vertically so they don't break their (horizontal) containers.
textarea {
- overflow: auto; // Remove the default vertical scrollbar in IE.
- // Textareas should really only resize vertically so they don't break their (horizontal) containers.
- resize: vertical;
+ resize: vertical; // 1
}
+// 1. Browsers set a default `min-width: min-content;` on fieldsets,
+// unlike e.g. ``s, which have `min-width: 0;` by default.
+// So we reset that to ensure fieldsets behave more like a standard block element.
+// See https://github.com/twbs/bootstrap/issues/12359
+// and https://html.spec.whatwg.org/multipage/#the-fieldset-and-legend-elements
+// 2. Reset the default outline behavior of fieldsets so they don't affect page layout.
+
fieldset {
- // Browsers set a default `min-width: min-content;` on fieldsets,
- // unlike e.g. `
`s, which have `min-width: 0;` by default.
- // So we reset that to ensure fieldsets behave more like a standard block element.
- // See https://github.com/twbs/bootstrap/issues/12359
- // and https://html.spec.whatwg.org/multipage/#the-fieldset-and-legend-elements
- min-width: 0;
- // Reset the default outline behavior of fieldsets so they don't affect page layout.
- padding: 0;
- margin: 0;
- border: 0;
+ min-width: 0; // 1
+ padding: 0; // 2
+ margin: 0; // 2
+ border: 0; // 2
}
-// 1. Correct the text wrapping in Edge and IE.
-// 2. Correct the color inheritance from `fieldset` elements in IE.
+// 1. By using `float: left`, the legend will behave like a block element.
+// This way the border of a fieldset wraps around the legend if present.
+// 2. Fix wrapping bug.
+// See https://github.com/twbs/bootstrap/issues/29712
+
legend {
- display: block;
+ float: left; // 1
width: 100%;
- max-width: 100%; // 1
padding: 0;
- margin-bottom: .5rem;
- @include font-size(1.5rem);
+ margin-bottom: $legend-margin-bottom;
+ @include font-size($legend-font-size);
+ font-weight: $legend-font-weight;
line-height: inherit;
- color: inherit; // 2
- white-space: normal; // 1
+
+ + * {
+ clear: left; // 2
+ }
}
-progress {
- vertical-align: baseline; // Add the correct vertical alignment in Chrome, Firefox, and Opera.
+// Fix height of inputs with a type of datetime-local, date, month, week, or time
+// See https://github.com/twbs/bootstrap/issues/18842
+
+::-webkit-datetime-edit-fields-wrapper,
+::-webkit-datetime-edit-text,
+::-webkit-datetime-edit-minute,
+::-webkit-datetime-edit-hour-field,
+::-webkit-datetime-edit-day-field,
+::-webkit-datetime-edit-month-field,
+::-webkit-datetime-edit-year-field {
+ padding: 0;
}
-// Correct the cursor style of increment and decrement buttons in Chrome.
-[type="number"]::-webkit-inner-spin-button,
-[type="number"]::-webkit-outer-spin-button {
+::-webkit-inner-spin-button {
height: auto;
}
+// 1. Correct the outline style in Safari.
+// 2. This overrides the extra rounded corners on search inputs in iOS so that our
+// `.form-control` class can properly style them. Note that this cannot simply
+// be added to `.form-control` as it's not specific enough. For details, see
+// https://github.com/twbs/bootstrap/issues/11586.
+
[type="search"] {
- // This overrides the extra rounded corners on search inputs in iOS so that our
- // `.form-control` class can properly style them. Note that this cannot simply
- // be added to `.form-control` as it's not specific enough. For details, see
- // https://github.com/twbs/bootstrap/issues/11586.
- outline-offset: -2px; // 2. Correct the outline style in Safari.
- -webkit-appearance: none;
+ outline-offset: -2px; // 1
+ -webkit-appearance: textfield; // 2
}
-//
+// 1. A few input types should stay LTR
+// See https://rtlstyling.com/posts/rtl-styling#form-inputs
+// 2. RTL only output
+// See https://rtlcss.com/learn/usage-guide/control-directives/#raw
+
+/* rtl:raw:
+[type="tel"],
+[type="url"],
+[type="email"],
+[type="number"] {
+ direction: ltr;
+}
+*/
+
// Remove the inner padding in Chrome and Safari on macOS.
-//
-[type="search"]::-webkit-search-decoration {
+::-webkit-search-decoration {
-webkit-appearance: none;
}
-//
-// 1. Correct the inability to style clickable types in iOS and Safari.
-// 2. Change font properties to `inherit` in Safari.
-//
+// Remove padding around color pickers in webkit browsers
+
+::-webkit-color-swatch-wrapper {
+ padding: 0;
+}
+
+
+// Inherit font family and line height for file input buttons
+
+::file-selector-button {
+ font: inherit;
+}
+
+// 1. Change font properties to `inherit`
+// 2. Correct the inability to style clickable types in iOS and Safari.
::-webkit-file-upload-button {
- font: inherit; // 2
- -webkit-appearance: button; // 1
+ font: inherit; // 1
+ -webkit-appearance: button; // 2
}
-//
// Correct element displays
-//
output {
display: inline-block;
}
+// Remove border from iframe
+
+iframe {
+ border: 0;
+}
+
+// Summary
+//
+// 1. Add the correct display in all browsers
+
summary {
- display: list-item; // Add the correct display in all browsers
+ display: list-item; // 1
cursor: pointer;
}
-template {
- display: none; // Add the correct display in IE
+
+// Progress
+//
+// Add the correct vertical alignment in Chrome, Firefox, and Opera.
+
+progress {
+ vertical-align: baseline;
}
-// Always hide an element with the `hidden` HTML attribute (from PureCSS).
-// Needed for proper display in IE 10-.
+
+// Hidden attribute
+//
+// Always hide an element with the `hidden` HTML attribute.
+
[hidden] {
display: none !important;
}
diff --git a/oioioi/base/static/bootstrap/stylesheets/_root.scss b/oioioi/base/static/bootstrap/stylesheets/_root.scss
index ad550df3b..768d6343f 100644
--- a/oioioi/base/static/bootstrap/stylesheets/_root.scss
+++ b/oioioi/base/static/bootstrap/stylesheets/_root.scss
@@ -1,19 +1,16 @@
:root {
// Custom variable values only support SassScript inside `#{}`.
@each $color, $value in $colors {
- --#{$color}: #{$value};
+ --#{$variable-prefix}#{$color}: #{$value};
}
@each $color, $value in $theme-colors {
- --#{$color}: #{$value};
- }
-
- @each $bp, $value in $grid-breakpoints {
- --breakpoint-#{$bp}: #{$value};
+ --#{$variable-prefix}#{$color}: #{$value};
}
// Use `inspect` for lists so that quoted items keep the quotes.
// See https://github.com/sass/sass/issues/2383#issuecomment-336349172
- --font-family-sans-serif: #{inspect($font-family-sans-serif)};
- --font-family-monospace: #{inspect($font-family-monospace)};
+ --#{$variable-prefix}font-sans-serif: #{inspect($font-family-sans-serif)};
+ --#{$variable-prefix}font-monospace: #{inspect($font-family-monospace)};
+ --#{$variable-prefix}gradient: #{$gradient};
}
diff --git a/oioioi/base/static/bootstrap/stylesheets/_spinners.scss b/oioioi/base/static/bootstrap/stylesheets/_spinners.scss
index 98c0108e3..a4a2c77cf 100644
--- a/oioioi/base/static/bootstrap/stylesheets/_spinners.scss
+++ b/oioioi/base/static/bootstrap/stylesheets/_spinners.scss
@@ -2,9 +2,11 @@
// Rotating border
//
+// scss-docs-start spinner-border-keyframes
@keyframes spinner-border {
- to { transform: rotate(360deg); }
+ to { transform: rotate(360deg) #{"/* rtl:ignore */"}; }
}
+// scss-docs-end spinner-border-keyframes
.spinner-border {
display: inline-block;
@@ -15,7 +17,7 @@
border-right-color: transparent;
// stylelint-disable-next-line property-disallowed-list
border-radius: 50%;
- animation: .75s linear infinite spinner-border;
+ animation: $spinner-animation-speed linear infinite spinner-border;
}
.spinner-border-sm {
@@ -28,6 +30,7 @@
// Growing circle
//
+// scss-docs-start spinner-grow-keyframes
@keyframes spinner-grow {
0% {
transform: scale(0);
@@ -37,6 +40,7 @@
transform: none;
}
}
+// scss-docs-end spinner-grow-keyframes
.spinner-grow {
display: inline-block;
@@ -47,7 +51,7 @@
// stylelint-disable-next-line property-disallowed-list
border-radius: 50%;
opacity: 0;
- animation: .75s linear infinite spinner-grow;
+ animation: $spinner-animation-speed linear infinite spinner-grow;
}
.spinner-grow-sm {
@@ -55,11 +59,11 @@
height: $spinner-height-sm;
}
-@if $enable-prefers-reduced-motion-media-query {
+@if $enable-reduced-motion {
@media (prefers-reduced-motion: reduce) {
.spinner-border,
.spinner-grow {
- animation-duration: 1.5s;
+ animation-duration: $spinner-animation-speed * 2;
}
}
}
diff --git a/oioioi/base/static/bootstrap/stylesheets/_tables.scss b/oioioi/base/static/bootstrap/stylesheets/_tables.scss
index 5fd77a4eb..92556ba05 100644
--- a/oioioi/base/static/bootstrap/stylesheets/_tables.scss
+++ b/oioioi/base/static/bootstrap/stylesheets/_tables.scss
@@ -3,37 +3,65 @@
//
.table {
+ --#{$variable-prefix}table-bg: #{$table-bg};
+ --#{$variable-prefix}table-accent-bg: #{$table-accent-bg};
+ --#{$variable-prefix}table-striped-color: #{$table-striped-color};
+ --#{$variable-prefix}table-striped-bg: #{$table-striped-bg};
+ --#{$variable-prefix}table-active-color: #{$table-active-color};
+ --#{$variable-prefix}table-active-bg: #{$table-active-bg};
+ --#{$variable-prefix}table-hover-color: #{$table-hover-color};
+ --#{$variable-prefix}table-hover-bg: #{$table-hover-bg};
+
width: 100%;
margin-bottom: $spacer;
color: $table-color;
- background-color: $table-bg; // Reset for nesting within parents with `background-color`.
+ vertical-align: $table-cell-vertical-align;
+ border-color: $table-border-color;
+
+ // Target th & td
+ // We need the child combinator to prevent styles leaking to nested tables which doesn't have a `.table` class.
+ // We use the universal selectors here to simplify the selector (else we would need 6 different selectors).
+ // Another advantage is that this generates less code and makes the selector less specific making it easier to override.
+ // stylelint-disable-next-line selector-max-universal
+ > :not(caption) > * > * {
+ padding: $table-cell-padding-y $table-cell-padding-x;
+ background-color: var(--#{$variable-prefix}table-bg);
+ border-bottom-width: $table-border-width;
+ box-shadow: inset 0 0 0 9999px var(--#{$variable-prefix}table-accent-bg);
+ }
- th,
- td {
- padding: $table-cell-padding;
- vertical-align: top;
- border-top: $table-border-width solid $table-border-color;
+ > tbody {
+ vertical-align: inherit;
}
- thead th {
+ > thead {
vertical-align: bottom;
- border-bottom: (2 * $table-border-width) solid $table-border-color;
}
- tbody + tbody {
- border-top: (2 * $table-border-width) solid $table-border-color;
+ // Highlight border color between thead, tbody and tfoot.
+ > :not(:last-child) > :last-child > * {
+ border-bottom-color: $table-group-separator-color;
}
}
+//
+// Change placement of captions with a class
+//
+
+.caption-top {
+ caption-side: top;
+}
+
+
//
// Condensed table w/ half padding
//
.table-sm {
- th,
- td {
- padding: $table-cell-padding-sm;
+ // stylelint-disable-next-line selector-max-universal
+ > :not(caption) > * > * {
+ padding: $table-cell-padding-y-sm $table-cell-padding-x-sm;
}
}
@@ -41,29 +69,27 @@
// Border versions
//
// Add or remove borders all around the table and between all the columns.
+//
+// When borders are added on all sides of the cells, the corners can render odd when
+// these borders do not have the same color or if they are semi-transparent.
+// Therefor we add top and border bottoms to the `tr`s and left and right borders
+// to the `td`s or `th`s
.table-bordered {
- border: $table-border-width solid $table-border-color;
+ > :not(caption) > * {
+ border-width: $table-border-width 0;
- th,
- td {
- border: $table-border-width solid $table-border-color;
- }
-
- thead {
- th,
- td {
- border-bottom-width: 2 * $table-border-width;
+ // stylelint-disable-next-line selector-max-universal
+ > * {
+ border-width: 0 $table-border-width;
}
}
}
.table-borderless {
- th,
- td,
- thead th,
- tbody + tbody {
- border: 0;
+ // stylelint-disable-next-line selector-max-universal
+ > :not(caption) > * > * {
+ border-bottom-width: 0;
}
}
@@ -72,114 +98,54 @@
// Default zebra-stripe styles (alternating gray and transparent backgrounds)
.table-striped {
- tbody tr:nth-of-type(#{$table-striped-order}) {
- background-color: $table-accent-bg;
+ > tbody > tr:nth-of-type(#{$table-striped-order}) {
+ --#{$variable-prefix}table-accent-bg: var(--#{$variable-prefix}table-striped-bg);
+ color: var(--#{$variable-prefix}table-striped-color);
}
}
+// Active table
+//
+// The `.table-active` class can be added to highlight rows or cells
+
+.table-active {
+ --#{$variable-prefix}table-accent-bg: var(--#{$variable-prefix}table-active-bg);
+ color: var(--#{$variable-prefix}table-active-color);
+}
// Hover effect
//
// Placed here since it has to come after the potential zebra striping
.table-hover {
- tbody tr {
- @include hover() {
- color: $table-hover-color;
- background-color: $table-hover-bg;
- }
+ > tbody > tr:hover {
+ --#{$variable-prefix}table-accent-bg: var(--#{$variable-prefix}table-hover-bg);
+ color: var(--#{$variable-prefix}table-hover-color);
}
}
-// Table backgrounds
-//
-// Exact selectors below required to override `.table-striped` and prevent
-// inheritance to nested tables.
-
-@each $color, $value in $theme-colors {
- @include table-row-variant($color, theme-color-level($color, $table-bg-level), theme-color-level($color, $table-border-level));
-}
-
-@include table-row-variant(active, $table-active-bg);
-
-
-// Dark styles
+// Table variants
//
-// Same table markup, but inverted color scheme: dark background and light text.
-
-// stylelint-disable-next-line no-duplicate-selectors
-.table {
- .thead-dark {
- th {
- color: $table-dark-color;
- background-color: $table-dark-bg;
- border-color: $table-dark-border-color;
- }
- }
+// Table variants set the table cell backgrounds, border colors
+// and the colors of the striped, hovered & active tables
- .thead-light {
- th {
- color: $table-head-color;
- background-color: $table-head-bg;
- border-color: $table-border-color;
- }
- }
+@each $color, $value in $table-variants {
+ @include table-variant($color, $value);
}
-.table-dark {
- color: $table-dark-color;
- background-color: $table-dark-bg;
-
- th,
- td,
- thead th {
- border-color: $table-dark-border-color;
- }
-
- &.table-bordered {
- border: 0;
- }
-
- &.table-striped {
- tbody tr:nth-of-type(#{$table-striped-order}) {
- background-color: $table-dark-accent-bg;
- }
- }
-
- &.table-hover {
- tbody tr {
- @include hover() {
- color: $table-dark-hover-color;
- background-color: $table-dark-hover-bg;
- }
- }
- }
-}
-
-
// Responsive tables
//
// Generate series of `.table-responsive-*` classes for configuring the screen
// size of where your table will overflow.
-.table-responsive {
- @each $breakpoint in map-keys($grid-breakpoints) {
- $next: breakpoint-next($breakpoint, $grid-breakpoints);
- $infix: breakpoint-infix($next, $grid-breakpoints);
-
- &#{$infix} {
- @include media-breakpoint-down($breakpoint) {
- display: block;
- width: 100%;
- overflow-x: auto;
- -webkit-overflow-scrolling: touch;
-
- // Prevent double border on horizontal scroll due to use of `display: block;`
- > .table-bordered {
- border: 0;
- }
- }
+@each $breakpoint in map-keys($grid-breakpoints) {
+ $infix: breakpoint-infix($breakpoint, $grid-breakpoints);
+
+ @include media-breakpoint-down($breakpoint) {
+ .table-responsive#{$infix} {
+ overflow-x: auto;
+ -webkit-overflow-scrolling: touch;
}
}
}
diff --git a/oioioi/base/static/bootstrap/stylesheets/_toasts.scss b/oioioi/base/static/bootstrap/stylesheets/_toasts.scss
index f9ca8d91c..717aae576 100644
--- a/oioioi/base/static/bootstrap/stylesheets/_toasts.scss
+++ b/oioioi/base/static/bootstrap/stylesheets/_toasts.scss
@@ -1,32 +1,31 @@
.toast {
- // Prevents from shrinking in IE11, when in a flex container
- // See https://github.com/twbs/bootstrap/issues/28341
- flex-basis: $toast-max-width;
- max-width: $toast-max-width;
+ width: $toast-max-width;
+ max-width: 100%;
@include font-size($toast-font-size);
color: $toast-color;
+ pointer-events: auto;
background-color: $toast-background-color;
background-clip: padding-box;
border: $toast-border-width solid $toast-border-color;
box-shadow: $toast-box-shadow;
- opacity: 0;
@include border-radius($toast-border-radius);
- &:not(:last-child) {
- margin-bottom: $toast-padding-x;
+ &:not(.showing):not(.show) {
+ opacity: 0;
}
- &.showing {
- opacity: 1;
+ &.hide {
+ display: none;
}
+}
- &.show {
- display: block;
- opacity: 1;
- }
+.toast-container {
+ width: max-content;
+ max-width: 100%;
+ pointer-events: none;
- &.hide {
- display: none;
+ > :not(:last-child) {
+ margin-bottom: $toast-spacing;
}
}
@@ -39,8 +38,14 @@
background-clip: padding-box;
border-bottom: $toast-border-width solid $toast-header-border-color;
@include border-top-radius(subtract($toast-border-radius, $toast-border-width));
+
+ .btn-close {
+ margin-right: $toast-padding-x * -.5;
+ margin-left: $toast-padding-x;
+ }
}
.toast-body {
padding: $toast-padding-x; // apply to both vertical and horizontal
+ word-wrap: break-word;
}
diff --git a/oioioi/base/static/bootstrap/stylesheets/_tooltip.scss b/oioioi/base/static/bootstrap/stylesheets/_tooltip.scss
index 6771b4eb4..75ff07838 100644
--- a/oioioi/base/static/bootstrap/stylesheets/_tooltip.scss
+++ b/oioioi/base/static/bootstrap/stylesheets/_tooltip.scss
@@ -14,7 +14,7 @@
&.show { opacity: $tooltip-opacity; }
- .arrow {
+ .tooltip-arrow {
position: absolute;
display: block;
width: $tooltip-arrow-width;
@@ -32,27 +32,27 @@
.bs-tooltip-top {
padding: $tooltip-arrow-height 0;
- .arrow {
+ .tooltip-arrow {
bottom: 0;
&::before {
- top: 0;
+ top: -1px;
border-width: $tooltip-arrow-height ($tooltip-arrow-width * .5) 0;
border-top-color: $tooltip-arrow-color;
}
}
}
-.bs-tooltip-right {
+.bs-tooltip-end {
padding: 0 $tooltip-arrow-height;
- .arrow {
+ .tooltip-arrow {
left: 0;
width: $tooltip-arrow-height;
height: $tooltip-arrow-width;
&::before {
- right: 0;
+ right: -1px;
border-width: ($tooltip-arrow-width * .5) $tooltip-arrow-height ($tooltip-arrow-width * .5) 0;
border-right-color: $tooltip-arrow-color;
}
@@ -62,27 +62,27 @@
.bs-tooltip-bottom {
padding: $tooltip-arrow-height 0;
- .arrow {
+ .tooltip-arrow {
top: 0;
&::before {
- bottom: 0;
+ bottom: -1px;
border-width: 0 ($tooltip-arrow-width * .5) $tooltip-arrow-height;
border-bottom-color: $tooltip-arrow-color;
}
}
}
-.bs-tooltip-left {
+.bs-tooltip-start {
padding: 0 $tooltip-arrow-height;
- .arrow {
+ .tooltip-arrow {
right: 0;
width: $tooltip-arrow-height;
height: $tooltip-arrow-width;
&::before {
- left: 0;
+ left: -1px;
border-width: ($tooltip-arrow-width * .5) 0 ($tooltip-arrow-width * .5) $tooltip-arrow-height;
border-left-color: $tooltip-arrow-color;
}
@@ -90,17 +90,17 @@
}
.bs-tooltip-auto {
- &[x-placement^="top"] {
+ &[data-popper-placement^="top"] {
@extend .bs-tooltip-top;
}
- &[x-placement^="right"] {
- @extend .bs-tooltip-right;
+ &[data-popper-placement^="right"] {
+ @extend .bs-tooltip-end;
}
- &[x-placement^="bottom"] {
+ &[data-popper-placement^="bottom"] {
@extend .bs-tooltip-bottom;
}
- &[x-placement^="left"] {
- @extend .bs-tooltip-left;
+ &[data-popper-placement^="left"] {
+ @extend .bs-tooltip-start;
}
}
diff --git a/oioioi/base/static/bootstrap/stylesheets/_transitions.scss b/oioioi/base/static/bootstrap/stylesheets/_transitions.scss
index 40be4d918..2905df45c 100644
--- a/oioioi/base/static/bootstrap/stylesheets/_transitions.scss
+++ b/oioioi/base/static/bootstrap/stylesheets/_transitions.scss
@@ -6,6 +6,7 @@
}
}
+// scss-docs-start collapse-classes
.collapse {
&:not(.show) {
display: none;
@@ -13,8 +14,8 @@
}
.collapsing {
- position: relative;
height: 0;
overflow: hidden;
@include transition($transition-collapse);
}
+// scss-docs-end collapse-classes
diff --git a/oioioi/base/static/bootstrap/stylesheets/_type.scss b/oioioi/base/static/bootstrap/stylesheets/_type.scss
index 3112a734b..b2d524ca1 100644
--- a/oioioi/base/static/bootstrap/stylesheets/_type.scss
+++ b/oioioi/base/static/bootstrap/stylesheets/_type.scss
@@ -1,82 +1,56 @@
-// stylelint-disable selector-list-comma-newline-after
-
//
// Headings
//
-
-h1, h2, h3, h4, h5, h6,
-.h1, .h2, .h3, .h4, .h5, .h6 {
- margin-bottom: $headings-margin-bottom;
- font-family: $headings-font-family;
- font-weight: $headings-font-weight;
- line-height: $headings-line-height;
- color: $headings-color;
+.h1 {
+ @extend h1;
}
-h1, .h1 { @include font-size($h1-font-size); }
-h2, .h2 { @include font-size($h2-font-size); }
-h3, .h3 { @include font-size($h3-font-size); }
-h4, .h4 { @include font-size($h4-font-size); }
-h5, .h5 { @include font-size($h5-font-size); }
-h6, .h6 { @include font-size($h6-font-size); }
-
-.lead {
- @include font-size($lead-font-size);
- font-weight: $lead-font-weight;
+.h2 {
+ @extend h2;
}
-// Type display classes
-.display-1 {
- @include font-size($display1-size);
- font-weight: $display1-weight;
- line-height: $display-line-height;
+.h3 {
+ @extend h3;
}
-.display-2 {
- @include font-size($display2-size);
- font-weight: $display2-weight;
- line-height: $display-line-height;
+
+.h4 {
+ @extend h4;
}
-.display-3 {
- @include font-size($display3-size);
- font-weight: $display3-weight;
- line-height: $display-line-height;
+
+.h5 {
+ @extend h5;
}
-.display-4 {
- @include font-size($display4-size);
- font-weight: $display4-weight;
- line-height: $display-line-height;
+
+.h6 {
+ @extend h6;
}
-//
-// Horizontal rules
-//
-
-hr {
- margin-top: $hr-margin-y;
- margin-bottom: $hr-margin-y;
- border: 0;
- border-top: $hr-border-width solid $hr-border-color;
+.lead {
+ @include font-size($lead-font-size);
+ font-weight: $lead-font-weight;
}
+// Type display classes
+@each $display, $font-size in $display-font-sizes {
+ .display-#{$display} {
+ @include font-size($font-size);
+ font-weight: $display-font-weight;
+ line-height: $display-line-height;
+ }
+}
//
// Emphasis
//
-
-small,
.small {
- @include font-size($small-font-size);
- font-weight: $font-weight-normal;
+ @extend small;
}
-mark,
.mark {
- padding: $mark-padding;
- background-color: $mark-bg;
+ @extend mark;
}
-
//
// Lists
//
@@ -104,20 +78,25 @@ mark,
// Builds on `abbr`
.initialism {
- @include font-size(90%);
+ @include font-size($initialism-font-size);
text-transform: uppercase;
}
// Blockquotes
.blockquote {
- margin-bottom: $spacer;
+ margin-bottom: $blockquote-margin-y;
@include font-size($blockquote-font-size);
+
+ > :last-child {
+ margin-bottom: 0;
+ }
}
.blockquote-footer {
- display: block;
- @include font-size($blockquote-small-font-size);
- color: $blockquote-small-color;
+ margin-top: -$blockquote-margin-y;
+ margin-bottom: $blockquote-margin-y;
+ @include font-size($blockquote-footer-font-size);
+ color: $blockquote-footer-color;
&::before {
content: "\2014\00A0"; // em dash, nbsp
diff --git a/oioioi/base/static/bootstrap/stylesheets/_utilities.scss b/oioioi/base/static/bootstrap/stylesheets/_utilities.scss
index 10e31dd7e..3c927cf59 100644
--- a/oioioi/base/static/bootstrap/stylesheets/_utilities.scss
+++ b/oioioi/base/static/bootstrap/stylesheets/_utilities.scss
@@ -1,18 +1,594 @@
-@import "utilities/align";
-@import "utilities/background";
-@import "utilities/borders";
-@import "utilities/clearfix";
-@import "utilities/display";
-@import "utilities/embed";
-@import "utilities/flex";
-@import "utilities/float";
-@import "utilities/interactions";
-@import "utilities/overflow";
-@import "utilities/position";
-@import "utilities/screenreaders";
-@import "utilities/shadows";
-@import "utilities/sizing";
-@import "utilities/spacing";
-@import "utilities/stretched-link";
-@import "utilities/text";
-@import "utilities/visibility";
+// stylelint-disable indentation
+
+// Utilities
+
+$utilities: () !default;
+// stylelint-disable-next-line scss/dollar-variable-default
+$utilities: map-merge(
+ (
+ // scss-docs-start utils-vertical-align
+ "align": (
+ property: vertical-align,
+ class: align,
+ values: baseline top middle bottom text-bottom text-top
+ ),
+ // scss-docs-end utils-vertical-align
+ // scss-docs-start utils-float
+ "float": (
+ responsive: true,
+ property: float,
+ values: (
+ start: left,
+ end: right,
+ none: none,
+ )
+ ),
+ // scss-docs-end utils-float
+ // scss-docs-start utils-overflow
+ "overflow": (
+ property: overflow,
+ values: auto hidden visible scroll,
+ ),
+ // scss-docs-end utils-overflow
+ // scss-docs-start utils-display
+ "display": (
+ responsive: true,
+ print: true,
+ property: display,
+ class: d,
+ values: inline inline-block block grid table table-row table-cell flex inline-flex none
+ ),
+ // scss-docs-end utils-display
+ // scss-docs-start utils-shadow
+ "shadow": (
+ property: box-shadow,
+ class: shadow,
+ values: (
+ null: $box-shadow,
+ sm: $box-shadow-sm,
+ lg: $box-shadow-lg,
+ none: none,
+ )
+ ),
+ // scss-docs-end utils-shadow
+ // scss-docs-start utils-position
+ "position": (
+ property: position,
+ values: static relative absolute fixed sticky
+ ),
+ "top": (
+ property: top,
+ values: $position-values
+ ),
+ "bottom": (
+ property: bottom,
+ values: $position-values
+ ),
+ "start": (
+ property: left,
+ class: start,
+ values: $position-values
+ ),
+ "end": (
+ property: right,
+ class: end,
+ values: $position-values
+ ),
+ "translate-middle": (
+ property: transform,
+ class: translate-middle,
+ values: (
+ null: translate(-50%, -50%),
+ x: translateX(-50%),
+ y: translateY(-50%),
+ )
+ ),
+ // scss-docs-end utils-position
+ // scss-docs-start utils-borders
+ "border": (
+ property: border,
+ values: (
+ null: $border-width solid $border-color,
+ 0: 0,
+ )
+ ),
+ "border-top": (
+ property: border-top,
+ values: (
+ null: $border-width solid $border-color,
+ 0: 0,
+ )
+ ),
+ "border-end": (
+ property: border-right,
+ class: border-end,
+ values: (
+ null: $border-width solid $border-color,
+ 0: 0,
+ )
+ ),
+ "border-bottom": (
+ property: border-bottom,
+ values: (
+ null: $border-width solid $border-color,
+ 0: 0,
+ )
+ ),
+ "border-start": (
+ property: border-left,
+ class: border-start,
+ values: (
+ null: $border-width solid $border-color,
+ 0: 0,
+ )
+ ),
+ "border-color": (
+ property: border-color,
+ class: border,
+ values: map-merge($theme-colors, ("white": $white))
+ ),
+ "border-width": (
+ property: border-width,
+ class: border,
+ values: $border-widths
+ ),
+ // scss-docs-end utils-borders
+ // Sizing utilities
+ // scss-docs-start utils-sizing
+ "width": (
+ property: width,
+ class: w,
+ values: (
+ 25: 25%,
+ 50: 50%,
+ 75: 75%,
+ 100: 100%,
+ auto: auto
+ )
+ ),
+ "max-width": (
+ property: max-width,
+ class: mw,
+ values: (100: 100%)
+ ),
+ "viewport-width": (
+ property: width,
+ class: vw,
+ values: (100: 100vw)
+ ),
+ "min-viewport-width": (
+ property: min-width,
+ class: min-vw,
+ values: (100: 100vw)
+ ),
+ "height": (
+ property: height,
+ class: h,
+ values: (
+ 25: 25%,
+ 50: 50%,
+ 75: 75%,
+ 100: 100%,
+ auto: auto
+ )
+ ),
+ "max-height": (
+ property: max-height,
+ class: mh,
+ values: (100: 100%)
+ ),
+ "viewport-height": (
+ property: height,
+ class: vh,
+ values: (100: 100vh)
+ ),
+ "min-viewport-height": (
+ property: min-height,
+ class: min-vh,
+ values: (100: 100vh)
+ ),
+ // scss-docs-end utils-sizing
+ // Flex utilities
+ // scss-docs-start utils-flex
+ "flex": (
+ responsive: true,
+ property: flex,
+ values: (fill: 1 1 auto)
+ ),
+ "flex-direction": (
+ responsive: true,
+ property: flex-direction,
+ class: flex,
+ values: row column row-reverse column-reverse
+ ),
+ "flex-grow": (
+ responsive: true,
+ property: flex-grow,
+ class: flex,
+ values: (
+ grow-0: 0,
+ grow-1: 1,
+ )
+ ),
+ "flex-shrink": (
+ responsive: true,
+ property: flex-shrink,
+ class: flex,
+ values: (
+ shrink-0: 0,
+ shrink-1: 1,
+ )
+ ),
+ "flex-wrap": (
+ responsive: true,
+ property: flex-wrap,
+ class: flex,
+ values: wrap nowrap wrap-reverse
+ ),
+ "gap": (
+ responsive: true,
+ property: gap,
+ class: gap,
+ values: $spacers
+ ),
+ "justify-content": (
+ responsive: true,
+ property: justify-content,
+ values: (
+ start: flex-start,
+ end: flex-end,
+ center: center,
+ between: space-between,
+ around: space-around,
+ evenly: space-evenly,
+ )
+ ),
+ "align-items": (
+ responsive: true,
+ property: align-items,
+ values: (
+ start: flex-start,
+ end: flex-end,
+ center: center,
+ baseline: baseline,
+ stretch: stretch,
+ )
+ ),
+ "align-content": (
+ responsive: true,
+ property: align-content,
+ values: (
+ start: flex-start,
+ end: flex-end,
+ center: center,
+ between: space-between,
+ around: space-around,
+ stretch: stretch,
+ )
+ ),
+ "align-self": (
+ responsive: true,
+ property: align-self,
+ values: (
+ auto: auto,
+ start: flex-start,
+ end: flex-end,
+ center: center,
+ baseline: baseline,
+ stretch: stretch,
+ )
+ ),
+ "order": (
+ responsive: true,
+ property: order,
+ values: (
+ first: -1,
+ 0: 0,
+ 1: 1,
+ 2: 2,
+ 3: 3,
+ 4: 4,
+ 5: 5,
+ last: 6,
+ ),
+ ),
+ // scss-docs-end utils-flex
+ // Margin utilities
+ // scss-docs-start utils-spacing
+ "margin": (
+ responsive: true,
+ property: margin,
+ class: m,
+ values: map-merge($spacers, (auto: auto))
+ ),
+ "margin-x": (
+ responsive: true,
+ property: margin-right margin-left,
+ class: mx,
+ values: map-merge($spacers, (auto: auto))
+ ),
+ "margin-y": (
+ responsive: true,
+ property: margin-top margin-bottom,
+ class: my,
+ values: map-merge($spacers, (auto: auto))
+ ),
+ "margin-top": (
+ responsive: true,
+ property: margin-top,
+ class: mt,
+ values: map-merge($spacers, (auto: auto))
+ ),
+ "margin-end": (
+ responsive: true,
+ property: margin-right,
+ class: me,
+ values: map-merge($spacers, (auto: auto))
+ ),
+ "margin-bottom": (
+ responsive: true,
+ property: margin-bottom,
+ class: mb,
+ values: map-merge($spacers, (auto: auto))
+ ),
+ "margin-start": (
+ responsive: true,
+ property: margin-left,
+ class: ms,
+ values: map-merge($spacers, (auto: auto))
+ ),
+ // Negative margin utilities
+ "negative-margin": (
+ responsive: true,
+ property: margin,
+ class: m,
+ values: $negative-spacers
+ ),
+ "negative-margin-x": (
+ responsive: true,
+ property: margin-right margin-left,
+ class: mx,
+ values: $negative-spacers
+ ),
+ "negative-margin-y": (
+ responsive: true,
+ property: margin-top margin-bottom,
+ class: my,
+ values: $negative-spacers
+ ),
+ "negative-margin-top": (
+ responsive: true,
+ property: margin-top,
+ class: mt,
+ values: $negative-spacers
+ ),
+ "negative-margin-end": (
+ responsive: true,
+ property: margin-right,
+ class: me,
+ values: $negative-spacers
+ ),
+ "negative-margin-bottom": (
+ responsive: true,
+ property: margin-bottom,
+ class: mb,
+ values: $negative-spacers
+ ),
+ "negative-margin-start": (
+ responsive: true,
+ property: margin-left,
+ class: ms,
+ values: $negative-spacers
+ ),
+ // Padding utilities
+ "padding": (
+ responsive: true,
+ property: padding,
+ class: p,
+ values: $spacers
+ ),
+ "padding-x": (
+ responsive: true,
+ property: padding-right padding-left,
+ class: px,
+ values: $spacers
+ ),
+ "padding-y": (
+ responsive: true,
+ property: padding-top padding-bottom,
+ class: py,
+ values: $spacers
+ ),
+ "padding-top": (
+ responsive: true,
+ property: padding-top,
+ class: pt,
+ values: $spacers
+ ),
+ "padding-end": (
+ responsive: true,
+ property: padding-right,
+ class: pe,
+ values: $spacers
+ ),
+ "padding-bottom": (
+ responsive: true,
+ property: padding-bottom,
+ class: pb,
+ values: $spacers
+ ),
+ "padding-start": (
+ responsive: true,
+ property: padding-left,
+ class: ps,
+ values: $spacers
+ ),
+ // scss-docs-end utils-spacing
+ // Text
+ // scss-docs-start utils-text
+ "font-family": (
+ property: font-family,
+ class: font,
+ values: (monospace: var(--#{$variable-prefix}font-monospace))
+ ),
+ "font-size": (
+ rfs: true,
+ property: font-size,
+ class: fs,
+ values: $font-sizes
+ ),
+ "font-style": (
+ property: font-style,
+ class: fst,
+ values: italic normal
+ ),
+ "font-weight": (
+ property: font-weight,
+ class: fw,
+ values: (
+ light: $font-weight-light,
+ lighter: $font-weight-lighter,
+ normal: $font-weight-normal,
+ bold: $font-weight-bold,
+ bolder: $font-weight-bolder
+ )
+ ),
+ "line-height": (
+ property: line-height,
+ class: lh,
+ values: (
+ 1: 1,
+ sm: $line-height-sm,
+ base: $line-height-base,
+ lg: $line-height-lg,
+ )
+ ),
+ "text-align": (
+ responsive: true,
+ property: text-align,
+ class: text,
+ values: (
+ start: left,
+ end: right,
+ center: center,
+ )
+ ),
+ "text-decoration": (
+ property: text-decoration,
+ values: none underline line-through
+ ),
+ "text-transform": (
+ property: text-transform,
+ class: text,
+ values: lowercase uppercase capitalize
+ ),
+ "white-space": (
+ property: white-space,
+ class: text,
+ values: (
+ wrap: normal,
+ nowrap: nowrap,
+ )
+ ),
+ "word-wrap": (
+ property: word-wrap word-break,
+ class: text,
+ values: (break: break-word),
+ rtl: false
+ ),
+ // scss-docs-end utils-text
+ // scss-docs-start utils-color
+ "color": (
+ property: color,
+ class: text,
+ values: map-merge(
+ $theme-colors,
+ (
+ "white": $white,
+ "body": $body-color,
+ "muted": $text-muted,
+ "black-50": rgba($black, .5),
+ "white-50": rgba($white, .5),
+ "reset": inherit,
+ )
+ )
+ ),
+ // scss-docs-end utils-color
+ // scss-docs-start utils-bg-color
+ "background-color": (
+ property: background-color,
+ class: bg,
+ values: map-merge(
+ $theme-colors,
+ (
+ "body": $body-bg,
+ "white": $white,
+ "transparent": transparent
+ )
+ )
+ ),
+ // scss-docs-end utils-bg-color
+ "gradient": (
+ property: background-image,
+ class: bg,
+ values: (gradient: var(--#{$variable-prefix}gradient))
+ ),
+ // scss-docs-start utils-interaction
+ "user-select": (
+ property: user-select,
+ values: all auto none
+ ),
+ "pointer-events": (
+ property: pointer-events,
+ class: pe,
+ values: none auto,
+ ),
+ // scss-docs-end utils-interaction
+ // scss-docs-start utils-border-radius
+ "rounded": (
+ property: border-radius,
+ class: rounded,
+ values: (
+ null: $border-radius,
+ 0: 0,
+ 1: $border-radius-sm,
+ 2: $border-radius,
+ 3: $border-radius-lg,
+ circle: 50%,
+ pill: $border-radius-pill
+ )
+ ),
+ "rounded-top": (
+ property: border-top-left-radius border-top-right-radius,
+ class: rounded-top,
+ values: (null: $border-radius)
+ ),
+ "rounded-end": (
+ property: border-top-right-radius border-bottom-right-radius,
+ class: rounded-end,
+ values: (null: $border-radius)
+ ),
+ "rounded-bottom": (
+ property: border-bottom-right-radius border-bottom-left-radius,
+ class: rounded-bottom,
+ values: (null: $border-radius)
+ ),
+ "rounded-start": (
+ property: border-bottom-left-radius border-top-left-radius,
+ class: rounded-start,
+ values: (null: $border-radius)
+ ),
+ // scss-docs-end utils-border-radius
+ // scss-docs-start utils-visibility
+ "visibility": (
+ property: visibility,
+ class: null,
+ values: (
+ visible: visible,
+ invisible: hidden,
+ )
+ )
+ // scss-docs-end utils-visibility
+ ),
+ $utilities
+);
diff --git a/oioioi/base/static/bootstrap/stylesheets/_variables.scss b/oioioi/base/static/bootstrap/stylesheets/_variables.scss
index 7d8fb3b3b..69c2bcb33 100644
--- a/oioioi/base/static/bootstrap/stylesheets/_variables.scss
+++ b/oioioi/base/static/bootstrap/stylesheets/_variables.scss
@@ -5,6 +5,7 @@
// Color system
+// scss-docs-start gray-color-variables
$white: #fff !default;
$gray-100: #f8f9fa !default;
$gray-200: #e9ecef !default;
@@ -16,24 +17,26 @@ $gray-700: #495057 !default;
$gray-800: #343a40 !default;
$gray-900: #212529 !default;
$black: #000 !default;
+// scss-docs-end gray-color-variables
+
+// fusv-disable
+// scss-docs-start gray-colors-map
+$grays: (
+ "100": $gray-100,
+ "200": $gray-200,
+ "300": $gray-300,
+ "400": $gray-400,
+ "500": $gray-500,
+ "600": $gray-600,
+ "700": $gray-700,
+ "800": $gray-800,
+ "900": $gray-900
+) !default;
+// scss-docs-end gray-colors-map
+// fusv-enable
-$grays: () !default;
-$grays: map-merge(
- (
- "100": $gray-100,
- "200": $gray-200,
- "300": $gray-300,
- "400": $gray-400,
- "500": $gray-500,
- "600": $gray-600,
- "700": $gray-700,
- "800": $gray-800,
- "900": $gray-900
- ),
- $grays
-);
-
-$blue: #007bff !default;
+// scss-docs-start color-variables
+$blue: #0d6efd !default;
$indigo: #6610f2 !default;
$purple: #6f42c1 !default;
$pink: #e83e8c !default;
@@ -43,27 +46,27 @@ $yellow: #ffc107 !default;
$green: #28a745 !default;
$teal: #20c997 !default;
$cyan: #17a2b8 !default;
+// scss-docs-end color-variables
+
+// scss-docs-start colors-map
+$colors: (
+ "blue": $blue,
+ "indigo": $indigo,
+ "purple": $purple,
+ "pink": $pink,
+ "red": $red,
+ "orange": $orange,
+ "yellow": $yellow,
+ "green": $green,
+ "teal": $teal,
+ "cyan": $cyan,
+ "white": $white,
+ "gray": $gray-600,
+ "gray-dark": $gray-800
+) !default;
+// scss-docs-end colors-map
-$colors: () !default;
-$colors: map-merge(
- (
- "blue": $blue,
- "indigo": $indigo,
- "purple": $purple,
- "pink": $pink,
- "red": $red,
- "orange": $orange,
- "yellow": $yellow,
- "green": $green,
- "teal": $teal,
- "cyan": $cyan,
- "white": $white,
- "gray": $gray-600,
- "gray-dark": $gray-800
- ),
- $colors
-);
-
+// scss-docs-start theme-color-variables
$primary: $blue !default;
$secondary: $gray-600 !default;
$success: $green !default;
@@ -72,31 +75,130 @@ $warning: $yellow !default;
$danger: $red !default;
$light: $gray-100 !default;
$dark: $gray-800 !default;
-
-$theme-colors: () !default;
-$theme-colors: map-merge(
- (
- "primary": $primary,
- "secondary": $secondary,
- "success": $success,
- "info": $info,
- "warning": $warning,
- "danger": $danger,
- "light": $light,
- "dark": $dark
- ),
- $theme-colors
-);
-
-// Set a specific jump point for requesting color jumps
-$theme-color-interval: 8% !default;
-
-// The yiq lightness value that determines when the lightness of color changes from "dark" to "light". Acceptable values are between 0 and 255.
-$yiq-contrasted-threshold: 150 !default;
-
-// Customize the light and dark text colors for use in our YIQ color contrast function.
-$yiq-text-dark: $gray-900 !default;
-$yiq-text-light: $white !default;
+// scss-docs-end theme-color-variables
+
+// scss-docs-start theme-colors-map
+$theme-colors: (
+ "primary": $primary,
+ "secondary": $secondary,
+ "success": $success,
+ "info": $info,
+ "warning": $warning,
+ "danger": $danger,
+ "light": $light,
+ "dark": $dark
+) !default;
+// scss-docs-end theme-colors-map
+
+// The contrast ratio to reach against white, to determine if color changes from "light" to "dark". Acceptable values for WCAG 2.0 are 3, 4.5 and 7.
+// See https://www.w3.org/TR/WCAG20/#visual-audio-contrast-contrast
+$min-contrast-ratio: 4.5 !default;
+
+// Customize the light and dark text colors for use in our color contrast function.
+$color-contrast-dark: $black !default;
+$color-contrast-light: $white !default;
+
+// fusv-disable
+$blue-100: tint-color($blue, 80%) !default;
+$blue-200: tint-color($blue, 60%) !default;
+$blue-300: tint-color($blue, 40%) !default;
+$blue-400: tint-color($blue, 20%) !default;
+$blue-500: $blue !default;
+$blue-600: shade-color($blue, 20%) !default;
+$blue-700: shade-color($blue, 40%) !default;
+$blue-800: shade-color($blue, 60%) !default;
+$blue-900: shade-color($blue, 80%) !default;
+
+$indigo-100: tint-color($indigo, 80%) !default;
+$indigo-200: tint-color($indigo, 60%) !default;
+$indigo-300: tint-color($indigo, 40%) !default;
+$indigo-400: tint-color($indigo, 20%) !default;
+$indigo-500: $indigo !default;
+$indigo-600: shade-color($indigo, 20%) !default;
+$indigo-700: shade-color($indigo, 40%) !default;
+$indigo-800: shade-color($indigo, 60%) !default;
+$indigo-900: shade-color($indigo, 80%) !default;
+
+$purple-100: tint-color($purple, 80%) !default;
+$purple-200: tint-color($purple, 60%) !default;
+$purple-300: tint-color($purple, 40%) !default;
+$purple-400: tint-color($purple, 20%) !default;
+$purple-500: $purple !default;
+$purple-600: shade-color($purple, 20%) !default;
+$purple-700: shade-color($purple, 40%) !default;
+$purple-800: shade-color($purple, 60%) !default;
+$purple-900: shade-color($purple, 80%) !default;
+
+$pink-100: tint-color($pink, 80%) !default;
+$pink-200: tint-color($pink, 60%) !default;
+$pink-300: tint-color($pink, 40%) !default;
+$pink-400: tint-color($pink, 20%) !default;
+$pink-500: $pink !default;
+$pink-600: shade-color($pink, 20%) !default;
+$pink-700: shade-color($pink, 40%) !default;
+$pink-800: shade-color($pink, 60%) !default;
+$pink-900: shade-color($pink, 80%) !default;
+
+$red-100: tint-color($red, 80%) !default;
+$red-200: tint-color($red, 60%) !default;
+$red-300: tint-color($red, 40%) !default;
+$red-400: tint-color($red, 20%) !default;
+$red-500: $red !default;
+$red-600: shade-color($red, 20%) !default;
+$red-700: shade-color($red, 40%) !default;
+$red-800: shade-color($red, 60%) !default;
+$red-900: shade-color($red, 80%) !default;
+
+$orange-100: tint-color($orange, 80%) !default;
+$orange-200: tint-color($orange, 60%) !default;
+$orange-300: tint-color($orange, 40%) !default;
+$orange-400: tint-color($orange, 20%) !default;
+$orange-500: $orange !default;
+$orange-600: shade-color($orange, 20%) !default;
+$orange-700: shade-color($orange, 40%) !default;
+$orange-800: shade-color($orange, 60%) !default;
+$orange-900: shade-color($orange, 80%) !default;
+
+$yellow-100: tint-color($yellow, 80%) !default;
+$yellow-200: tint-color($yellow, 60%) !default;
+$yellow-300: tint-color($yellow, 40%) !default;
+$yellow-400: tint-color($yellow, 20%) !default;
+$yellow-500: $yellow !default;
+$yellow-600: shade-color($yellow, 20%) !default;
+$yellow-700: shade-color($yellow, 40%) !default;
+$yellow-800: shade-color($yellow, 60%) !default;
+$yellow-900: shade-color($yellow, 80%) !default;
+
+$green-100: tint-color($green, 80%) !default;
+$green-200: tint-color($green, 60%) !default;
+$green-300: tint-color($green, 40%) !default;
+$green-400: tint-color($green, 20%) !default;
+$green-500: $green !default;
+$green-600: shade-color($green, 20%) !default;
+$green-700: shade-color($green, 40%) !default;
+$green-800: shade-color($green, 60%) !default;
+$green-900: shade-color($green, 80%) !default;
+
+$teal-100: tint-color($teal, 80%) !default;
+$teal-200: tint-color($teal, 60%) !default;
+$teal-300: tint-color($teal, 40%) !default;
+$teal-400: tint-color($teal, 20%) !default;
+$teal-500: $teal !default;
+$teal-600: shade-color($teal, 20%) !default;
+$teal-700: shade-color($teal, 40%) !default;
+$teal-800: shade-color($teal, 60%) !default;
+$teal-900: shade-color($teal, 80%) !default;
+
+$cyan-100: tint-color($cyan, 80%) !default;
+$cyan-200: tint-color($cyan, 60%) !default;
+$cyan-300: tint-color($cyan, 40%) !default;
+$cyan-400: tint-color($cyan, 20%) !default;
+$cyan-500: $cyan !default;
+$cyan-600: shade-color($cyan, 20%) !default;
+$cyan-700: shade-color($cyan, 40%) !default;
+$cyan-800: shade-color($cyan, 60%) !default;
+$cyan-900: shade-color($cyan, 80%) !default;
+// fusv-enable
// Characters which are escaped by the escape-svg function
$escaped-characters: (
@@ -107,25 +209,36 @@ $escaped-characters: (
(")", "%29"),
) !default;
-
// Options
//
// Quickly modify global styling by enabling or disabling optional features.
-$enable-caret: true !default;
-$enable-rounded: true !default;
-$enable-shadows: false !default;
-$enable-gradients: false !default;
-$enable-transitions: true !default;
-$enable-prefers-reduced-motion-media-query: true !default;
-$enable-hover-media-query: false !default; // Deprecated, no longer affects any compiled CSS
-$enable-grid-classes: true !default;
-$enable-pointer-cursor-for-buttons: true !default;
-$enable-print-styles: true !default;
-$enable-responsive-font-sizes: false !default;
-$enable-validation-icons: true !default;
-$enable-deprecation-messages: true !default;
-
+$enable-caret: true !default;
+$enable-rounded: true !default;
+$enable-shadows: false !default;
+$enable-gradients: false !default;
+$enable-transitions: true !default;
+$enable-reduced-motion: true !default;
+$enable-smooth-scroll: true !default;
+$enable-grid-classes: true !default;
+$enable-button-pointers: true !default;
+$enable-rfs: false !default;
+$enable-validation-icons: true !default;
+$enable-negative-margins: true !default; // for compatibility with bootstrap v4
+$enable-deprecation-messages: true !default;
+$enable-important-utilities: true !default;
+
+// Prefix for :root CSS variables
+
+$variable-prefix: bs- !default;
+
+// Gradient
+//
+// The gradient which is added to components if `$enable-gradients` is `true`
+// This gradient is also added to elements with `.bg-gradient`
+// scss-docs-start variable-gradient
+$gradient: linear-gradient(180deg, rgba($white, .15), rgba($white, 0)) !default;
+// scss-docs-end variable-gradient
// Spacing
//
@@ -133,33 +246,34 @@ $enable-deprecation-messages: true !default;
// variables. Mostly focused on spacing.
// You can add more entries to the $spacers map, should you need more variation.
+// scss-docs-start spacer-variables-maps
$spacer: 1rem !default;
-$spacers: () !default;
-$spacers: map-merge(
- (
- 0: 0,
- 1: ($spacer * .25),
- 2: ($spacer * .5),
- 3: $spacer,
- 4: ($spacer * 1.5),
- 5: ($spacer * 3)
- ),
- $spacers
-);
-
-// This variable affects the `.h-*` and `.w-*` classes.
-$sizes: () !default;
-$sizes: map-merge(
- (
- 25: 25%,
- 50: 50%,
- 75: 75%,
- 100: 100%,
- auto: auto
- ),
- $sizes
-);
+$spacers: (
+ 0: 0,
+ 1: $spacer * .25,
+ 2: $spacer * .5,
+ 3: $spacer,
+ 4: $spacer * 1.5,
+ 5: $spacer * 3,
+) !default;
+
+$negative-spacers: if($enable-negative-margins, negativify-map($spacers), null) !default;
+// scss-docs-end spacer-variables-maps
+// Position
+//
+// Define the edge positioning anchors of the position utilities.
+
+// scss-docs-start position-map
+$position-values: (
+ 0: 0,
+ 25: 25%,
+ 50: 50%,
+ 75: 75%,
+ 100: 100%,
+ auto: auto
+) !default;
+// scss-docs-end position-map
// Body
//
@@ -167,17 +281,23 @@ $sizes: map-merge(
$body-bg: $white !default;
$body-color: $gray-900 !default;
+$body-text-align: null !default;
// Links
//
// Style anchor elements.
-$link-color: theme-color("primary") !default;
+$link-color: $primary !default;
$link-decoration: none !default;
+$link-shade-percentage: 20% !default;
$link-hover-color: darken($link-color, 15%) !default;
$link-hover-decoration: underline !default;
+
+$stretched-link-pseudo-element: after !default;
+$stretched-link-z-index: 1 !default;
// Darken percentage for links with `.text-*` class (e.g. `.text-success`)
+
$emphasized-link-hover-darken-percentage: 15% !default;
// Paragraphs
@@ -192,13 +312,15 @@ $paragraph-margin-bottom: 1rem !default;
// Define the minimum dimensions at which your layout will change,
// adapting to different screen sizes, for use in media queries.
+// scss-docs-start grid-breakpoints
$grid-breakpoints: (
xs: 0,
sm: 576px,
md: 768px,
lg: 992px,
- xl: 1200px
+ xl: 1200px,
) !default;
+// scss-docs-end grid-breakpoints
@include _assert-ascending($grid-breakpoints, "$grid-breakpoints");
@include _assert-starts-at-zero($grid-breakpoints, "$grid-breakpoints");
@@ -208,12 +330,14 @@ $grid-breakpoints: (
//
// Define the maximum width of `.container` for different screen sizes.
+// scss-docs-start container-max-widths
$container-max-widths: (
sm: 540px,
md: 720px,
lg: 960px,
- xl: 1140px
+ xl: 1140px,
) !default;
+// scss-docs-end container-max-widths
@include _assert-ascending($container-max-widths, "$container-max-widths");
@@ -226,62 +350,88 @@ $grid-columns: 12 !default;
$grid-gutter-width: 30px !default;
$grid-row-columns: 6 !default;
+$gutters: $spacers !default;
+
+// Container padding
+
+$container-padding-x: $grid-gutter-width * .5 !default;
+
// Components
//
// Define common padding and border radius sizes and more.
-$line-height-lg: 1.5 !default;
-$line-height-sm: 1.5 !default;
-
+// scss-docs-start border-variables
$border-width: 1px !default;
+$border-widths: (
+ 1: 1px,
+ 2: 2px,
+ 3: 3px,
+ 4: 4px,
+ 5: 5px
+) !default;
+
$border-color: $gray-300 !default;
+// scss-docs-end border-variables
+// scss-docs-start border-radius-variables
$border-radius: .25rem !default;
-$border-radius-lg: .3rem !default;
$border-radius-sm: .2rem !default;
+$border-radius-lg: .3rem !default;
+$border-radius-pill: 50rem !default;
+// scss-docs-end border-radius-variables
-$rounded-pill: 50rem !default;
-
-$box-shadow-sm: 0 .125rem .25rem rgba($black, .075) !default;
+// scss-docs-start box-shadow-variables
$box-shadow: 0 .5rem 1rem rgba($black, .15) !default;
+$box-shadow-sm: 0 .125rem .25rem rgba($black, .075) !default;
$box-shadow-lg: 0 1rem 3rem rgba($black, .175) !default;
+$box-shadow-inset: inset 0 1px 2px rgba($black, .075) !default;
+// scss-docs-end box-shadow-variables
$component-active-color: $white !default;
-$component-active-bg: theme-color("primary") !default;
+$component-active-bg: $primary !default;
+// scss-docs-start caret-variables
$caret-width: .3em !default;
$caret-vertical-align: $caret-width * .85 !default;
$caret-spacing: $caret-width * .85 !default;
+// scss-docs-end caret-variables
$transition-base: all .2s ease-in-out !default;
$transition-fade: opacity .15s linear !default;
+// scss-docs-start collapse-transition
$transition-collapse: height .35s ease !default;
-
-$embed-responsive-aspect-ratios: () !default;
-$embed-responsive-aspect-ratios: join(
- (
- (21 9),
- (16 9),
- (4 3),
- (1 1),
- ),
- $embed-responsive-aspect-ratios
-);
+// scss-docs-end collapse-transition
+
+// stylelint-disable function-disallowed-list
+// scss-docs-start aspect-ratios
+$aspect-ratios: (
+ "1x1": 100%,
+ "4x3": calc(3 / 4 * 100%),
+ "16x9": calc(9 / 16 * 100%),
+ "21x9": calc(9 / 21 * 100%)
+) !default;
+// scss-docs-end aspect-ratios
+// stylelint-enable function-disallowed-list
// Typography
//
// Font, line-height, and color for body text, headings, and more.
+// scss-docs-start font-variables
// stylelint-disable value-keyword-case
$font-family-sans-serif: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !default;
$font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace !default;
-$font-family-base: $font-family-sans-serif !default;
// stylelint-enable value-keyword-case
+$font-family-base: $font-family-sans-serif !default;
+$font-family-code: var(--#{$variable-prefix}font-monospace) !default;
+// $font-size-root affects the value of `rem`, which is used for as well font sizes, paddings, and margins
+// $font-size-base affects the font size of the body text
+$font-size-root: null !default;
$font-size-base: 1rem !default; // Assumes the browser default, typically `16px`
-$font-size-lg: $font-size-base * 1.25 !default;
$font-size-sm: $font-size-base * .875 !default;
+$font-size-lg: $font-size-base * 1.25 !default;
$font-weight-lighter: lighter !default;
$font-weight-light: 300 !default;
@@ -290,7 +440,10 @@ $font-weight-bold: 700 !default;
$font-weight-bolder: bolder !default;
$font-weight-base: $font-weight-normal !default;
+
$line-height-base: 1.5 !default;
+$line-height-sm: 1.5 !default;
+$line-height-lg: 1.5 !default;
$h1-font-size: $font-size-base * 2.5 !default;
$h2-font-size: $font-size-base * 2 !default;
@@ -298,37 +451,67 @@ $h3-font-size: $font-size-base * 1.75 !default;
$h4-font-size: $font-size-base * 1.5 !default;
$h5-font-size: $font-size-base * 1.25 !default;
$h6-font-size: $font-size-base !default;
+// scss-docs-end font-variables
+
+// scss-docs-start font-sizes
+$font-sizes: (
+ 1: $h1-font-size,
+ 2: $h2-font-size,
+ 3: $h3-font-size,
+ 4: $h4-font-size,
+ 5: $h5-font-size,
+ 6: $h6-font-size
+) !default;
+// scss-docs-end font-sizes
+// scss-docs-start headings-variables
$headings-margin-bottom: $spacer * .5 !default;
$headings-font-family: null !default;
+$headings-font-style: null !default;
$headings-font-weight: 500 !default;
$headings-line-height: 1.2 !default;
$headings-color: null !default;
+// scss-docs-end headings-variables
+
+// scss-docs-start display-headings
+$display-font-sizes: (
+ 1: 6rem,
+ 2: 5.5rem,
+ 3: 4.5rem,
+ 4: 3.5rem,
+ 5: 3rem,
+ 6: 2.5rem
+) !default;
-$display1-size: 6rem !default;
-$display2-size: 5.5rem !default;
-$display3-size: 4.5rem !default;
-$display4-size: 3.5rem !default;
-
-$display1-weight: 300 !default;
-$display2-weight: 300 !default;
-$display3-weight: 300 !default;
-$display4-weight: 300 !default;
-$display-line-height: $headings-line-height !default;
+$display-font-weight: 300 !default;
+$display-line-height: $headings-line-height !default;
+// scss-docs-end display-headings
+// scss-docs-start type-variables
$lead-font-size: $font-size-base * 1.25 !default;
$lead-font-weight: 300 !default;
$small-font-size: 80% !default;
+$sub-sup-font-size: .75em !default;
+
$text-muted: $gray-600 !default;
-$blockquote-small-color: $gray-600 !default;
-$blockquote-small-font-size: $small-font-size !default;
+$initialism-font-size: $small-font-size !default;
+
+$blockquote-margin-y: $spacer !default;
$blockquote-font-size: $font-size-base * 1.25 !default;
+$blockquote-footer-color: $gray-600 !default;
+$blockquote-footer-font-size: $small-font-size !default;
+
+$hr-margin-y: $spacer !default;
+$hr-color: inherit !default;
+$hr-height: $border-width !default;
+$hr-opacity: .25 !default;
-$hr-border-color: rgba($black, .1) !default;
-$hr-border-width: $border-width !default;
+$legend-margin-bottom: .5rem !default;
+$legend-font-size: 1.5rem !default;
+$legend-font-weight: null !default;
$mark-padding: .2em !default;
@@ -340,27 +523,44 @@ $nested-kbd-font-weight: $font-weight-bold !default;
$list-inline-padding: .5rem !default;
$mark-bg: #fcf8e3 !default;
-
-$hr-margin-y: $spacer !default;
+// scss-docs-end type-variables
// Tables
//
// Customizes the `.table` component with basic values, each used across all table variations.
-$table-cell-padding: .75rem !default;
-$table-cell-padding-sm: .3rem !default;
+// scss-docs-start table-variables
+$table-cell-padding-y: .75rem !default;
+$table-cell-padding-x: .75rem !default;
+$table-cell-padding-y-sm: .3rem !default;
+$table-cell-padding-x-sm: .3rem !default;
+
+$table-cell-vertical-align: top !default;
$table-color: $body-color !default;
-$table-bg: null !default;
-$table-accent-bg: rgba($black, .05) !default;
+$table-bg: transparent !default;
+$table-accent-bg: transparent !default;
+
+$table-th-font-weight: null !default;
+
+$table-striped-color: $table-color !default;
+$table-striped-bg-factor: .05 !default;
+$table-striped-bg: rgba($black, $table-striped-bg-factor) !default;
+
+$table-active-color: $table-color !default;
+$table-active-bg-factor: .1 !default;
+$table-active-bg: rgba($black, $table-active-bg-factor) !default;
+
$table-hover-color: $table-color !default;
-$table-hover-bg: rgba($black, .075) !default;
-$table-active-bg: $table-hover-bg !default;
+$table-hover-bg-factor: .075 !default;
+$table-hover-bg: rgba($black, $table-hover-bg-factor) !default;
+$table-border-factor: .1 !default;
$table-border-width: $border-width !default;
$table-border-color: $border-color !default;
+
$table-head-bg: $gray-200 !default;
$table-head-color: $gray-700 !default;
$table-th-font-weight: null !default;
@@ -371,46 +571,70 @@ $table-dark-accent-bg: rgba($white, .05) !default;
$table-dark-hover-color: $table-dark-color !default;
$table-dark-hover-bg: rgba($white, .075) !default;
$table-dark-border-color: lighten($table-dark-bg, 7.5%) !default;
-
$table-striped-order: odd !default;
+$table-group-separator-color: $gray-300 !default;
+
$table-caption-color: $text-muted !default;
+$table-bg-scale: -80% !default;
+// scss-docs-end table-variables
+
$table-bg-level: -9 !default;
$table-border-level: -6 !default;
+// scss-docs-start table-loop
+$table-variants: (
+ "primary": shift-color($primary, $table-bg-scale),
+ "secondary": shift-color($secondary, $table-bg-scale),
+ "success": shift-color($success, $table-bg-scale),
+ "info": shift-color($info, $table-bg-scale),
+ "warning": shift-color($warning, $table-bg-scale),
+ "danger": shift-color($danger, $table-bg-scale),
+ "light": $light,
+ "dark": $dark,
+) !default;
+// scss-docs-end table-loop
+
// Buttons + Forms
//
// Shared variables that are reassigned to `$input-` and `$btn-` specific variables.
+// scss-docs-start input-btn-variables
$input-btn-padding-y: .375rem !default;
$input-btn-padding-x: .75rem !default;
$input-btn-font-family: null !default;
$input-btn-font-size: $font-size-base !default;
$input-btn-line-height: $line-height-base !default;
-$input-btn-focus-width: .2rem !default;
-$input-btn-focus-color: rgba($component-active-bg, .25) !default;
-$input-btn-focus-box-shadow: 0 0 0 $input-btn-focus-width $input-btn-focus-color !default;
+$input-btn-focus-width: .2rem !default;
+$input-btn-focus-color-opacity: .25 !default;
+$input-btn-focus-color: rgba($component-active-bg, $input-btn-focus-color-opacity) !default;
+$input-btn-focus-blur: 0 !default;
+$input-btn-focus-box-shadow: 0 0 $input-btn-focus-blur $input-btn-focus-width $input-btn-focus-color !default;
$input-btn-padding-y-sm: .25rem !default;
$input-btn-padding-x-sm: .5rem !default;
$input-btn-font-size-sm: $font-size-sm !default;
$input-btn-line-height-sm: $line-height-sm !default;
+
$input-btn-padding-y-lg: .5rem !default;
$input-btn-padding-x-lg: 1rem !default;
$input-btn-font-size-lg: $font-size-lg !default;
$input-btn-line-height-lg: $line-height-lg !default;
+
$input-btn-border-width: $border-width !default;
+// scss-docs-end input-btn-variables
// Buttons
//
// For each of Bootstrap's buttons, define text, background, and border color.
+// scss-docs-start btn-variables
$btn-padding-y: $input-btn-padding-y !default;
$btn-padding-x: $input-btn-padding-x !default;
$btn-font-family: $input-btn-font-family !default;
@@ -423,11 +647,13 @@ $btn-padding-x-sm: $input-btn-padding-x-sm !default;
$btn-font-size-sm: $input-btn-font-size-sm !default;
$btn-line-height-sm: $input-btn-line-height-sm !default;
+
$btn-padding-y-lg: $input-btn-padding-y-lg !default;
$btn-padding-x-lg: $input-btn-padding-x-lg !default;
$btn-font-size-lg: $input-btn-font-size-lg !default;
$btn-line-height-lg: $input-btn-line-height-lg !default;
+
$btn-border-width: $input-btn-border-width !default;
$btn-font-weight: $font-weight-normal !default;
@@ -437,22 +663,49 @@ $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-color: $link-color !default;
+$btn-link-hover-color: $link-hover-color !default;
$btn-link-disabled-color: $gray-600 !default;
$btn-block-spacing-y: .5rem !default;
// Allows for customizing button radius independently from global border radius
$btn-border-radius: $border-radius !default;
-$btn-border-radius-lg: $border-radius-lg !default;
$btn-border-radius-sm: $border-radius-sm !default;
+$btn-border-radius-lg: $border-radius-lg !default;
$btn-transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out !default;
+$btn-hover-bg-shade-amount: 15% !default;
+$btn-hover-bg-tint-amount: 15% !default;
+$btn-hover-border-shade-amount: 20% !default;
+$btn-hover-border-tint-amount: 10% !default;
+$btn-active-bg-shade-amount: 20% !default;
+$btn-active-bg-tint-amount: 20% !default;
+$btn-active-border-shade-amount: 25% !default;
+$btn-active-border-tint-amount: 10% !default;
+// scss-docs-end btn-variables
-// Forms
-$label-margin-bottom: .5rem !default;
+// Forms
+// scss-docs-start form-text-variables
+$form-text-margin-top: .25rem !default;
+$form-text-font-size: $small-font-size !default;
+$form-text-font-style: null !default;
+$form-text-font-weight: null !default;
+$form-text-color: $text-muted !default;
+// scss-docs-end form-text-variables
+
+// scss-docs-start form-label-variables
+$form-label-margin-bottom: .5rem !default;
+$form-label-font-size: null !default;
+$form-label-font-style: null !default;
+$form-label-font-weight: null !default;
+$form-label-color: null !default;
+// scss-docs-end form-label-variables
+
+// scss-docs-start form-input-variables
$input-padding-y: $input-btn-padding-y !default;
$input-padding-x: $input-btn-padding-x !default;
$input-font-family: $input-btn-font-family !default;
@@ -472,6 +725,7 @@ $input-line-height-lg: $input-btn-line-height-lg !default;
$input-bg: $white !default;
$input-disabled-bg: $gray-200 !default;
+$input-disabled-border-color: null !default;
$input-color: $gray-700 !default;
$input-border-color: $gray-400 !default;
@@ -479,8 +733,8 @@ $input-border-width: $input-btn-border-width !default;
$input-box-shadow: inset 0 1px 1px rgba($black, .075) !default;
$input-border-radius: $border-radius !default;
-$input-border-radius-lg: $border-radius-lg !default;
$input-border-radius-sm: $border-radius-sm !default;
+$input-border-radius-lg: $border-radius-lg !default;
$input-focus-bg: $input-bg !default;
$input-focus-border-color: lighten($component-active-bg, 25%) !default;
@@ -502,199 +756,205 @@ $input-height-sm: add($input-line-height-sm * 1em, add($in
$input-height-lg: add($input-line-height-lg * 1em, add($input-padding-y-lg * 2, $input-height-border, false)) !default;
$input-transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out !default;
-
-$form-text-margin-top: .25rem !default;
-
-$form-check-input-gutter: 1.25rem !default;
-$form-check-input-margin-y: .3rem !default;
-$form-check-input-margin-x: .25rem !default;
-
-$form-check-inline-margin-x: .75rem !default;
-$form-check-inline-input-margin-x: .3125rem !default;
-
-$form-grid-gutter-width: 10px !default;
-$form-group-margin-bottom: 1rem !default;
-
+// scss-docs-end form-input-variables
+
+// scss-docs-start form-check-variables
+$form-check-input-width: 1em !default;
+$form-check-min-height: $font-size-base * $line-height-base !default;
+$form-check-padding-start: $form-check-input-width + .5em !default;
+$form-check-margin-bottom: .3em !default;
+$form-check-label-color: null !default;
+$form-check-label-cursor: null !default;
+$form-check-transition: null !default;
+
+$form-check-input-active-filter: brightness(90%) !default;
+
+$form-check-input-bg: $input-bg !default;
+$form-check-input-border: 1px solid rgba($black, .25) !default;
+$form-check-input-border-radius: .25em !default;
+$form-check-radio-border-radius: 50% !default;
+$form-check-input-focus-border: $input-focus-border-color !default;
+$form-check-input-focus-box-shadow: $input-btn-focus-box-shadow !default;
+
+$form-check-input-checked-color: $component-active-color !default;
+$form-check-input-checked-bg-color: $component-active-bg !default;
+$form-check-input-checked-border-color: $form-check-input-checked-bg-color !default;
+$form-check-input-checked-bg-image: url("data:image/svg+xml,
") !default;
+$form-check-radio-checked-bg-image: url("data:image/svg+xml,
") !default;
+
+$form-check-input-indeterminate-color: $component-active-color !default;
+$form-check-input-indeterminate-bg-color: $component-active-bg !default;
+$form-check-input-indeterminate-border-color: $form-check-input-indeterminate-bg-color !default;
+$form-check-input-indeterminate-bg-image: url("data:image/svg+xml,
") !default;
+
+$form-check-input-disabled-opacity: .5 !default;
+$form-check-label-disabled-opacity: $form-check-input-disabled-opacity !default;
+$form-check-btn-check-disabled-opacity: $btn-disabled-opacity !default;
+
+$form-check-inline-margin-end: 1rem !default;
+// scss-docs-end form-check-variables
+
+// scss-docs-start form-switch-variables
+$form-switch-color: rgba(0, 0, 0, .25) !default;
+$form-switch-width: 2em !default;
+$form-switch-padding-start: $form-switch-width + .5em !default;
+$form-switch-bg-image: url("data:image/svg+xml,
") !default;
+$form-switch-border-radius: $form-switch-width !default;
+$form-switch-transition: background-position .15s ease-in-out !default;
+
+$form-switch-focus-color: $input-focus-border-color !default;
+$form-switch-focus-bg-image: url("data:image/svg+xml,
") !default;
+
+$form-switch-checked-color: $component-active-color !default;
+$form-switch-checked-bg-image: url("data:image/svg+xml,
") !default;
+$form-switch-checked-bg-position: right center !default;
+// scss-docs-end form-switch-variables
+
+// scss-docs-start input-group-variables
+$input-group-addon-padding-y: $input-padding-y !default;
+$input-group-addon-padding-x: $input-padding-x !default;
+$input-group-addon-font-weight: $input-font-weight !default;
$input-group-addon-color: $input-color !default;
$input-group-addon-bg: $gray-200 !default;
$input-group-addon-border-color: $input-border-color !default;
-
-$custom-forms-transition: background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out !default;
-
-$custom-control-gutter: .5rem !default;
-$custom-control-spacer-x: 1rem !default;
-$custom-control-cursor: null !default;
-
-$custom-control-indicator-size: 1rem !default;
-$custom-control-indicator-bg: $input-bg !default;
-
-$custom-control-indicator-bg-size: 50% 50% !default;
-$custom-control-indicator-box-shadow: $input-box-shadow !default;
-$custom-control-indicator-border-color: $gray-500 !default;
-$custom-control-indicator-border-width: $input-border-width !default;
-
-$custom-control-label-color: null !default;
-
-$custom-control-indicator-disabled-bg: $input-disabled-bg !default;
-$custom-control-label-disabled-color: $gray-600 !default;
-
-$custom-control-indicator-checked-color: $component-active-color !default;
-$custom-control-indicator-checked-bg: $component-active-bg !default;
-$custom-control-indicator-checked-disabled-bg: rgba(theme-color("primary"), .5) !default;
-$custom-control-indicator-checked-box-shadow: null !default;
-$custom-control-indicator-checked-border-color: $custom-control-indicator-checked-bg !default;
-
-$custom-control-indicator-focus-box-shadow: $input-focus-box-shadow !default;
-$custom-control-indicator-focus-border-color: $input-focus-border-color !default;
-
-$custom-control-indicator-active-color: $component-active-color !default;
-$custom-control-indicator-active-bg: lighten($component-active-bg, 35%) !default;
-$custom-control-indicator-active-box-shadow: null !default;
-$custom-control-indicator-active-border-color: $custom-control-indicator-active-bg !default;
-
-$custom-checkbox-indicator-border-radius: $border-radius !default;
-$custom-checkbox-indicator-icon-checked: url("data:image/svg+xml,
") !default;
-
-$custom-checkbox-indicator-indeterminate-bg: $component-active-bg !default;
-$custom-checkbox-indicator-indeterminate-color: $custom-control-indicator-checked-color !default;
-$custom-checkbox-indicator-icon-indeterminate: url("data:image/svg+xml,
") !default;
-$custom-checkbox-indicator-indeterminate-box-shadow: null !default;
-$custom-checkbox-indicator-indeterminate-border-color: $custom-checkbox-indicator-indeterminate-bg !default;
-
-$custom-radio-indicator-border-radius: 50% !default;
-$custom-radio-indicator-icon-checked: url("data:image/svg+xml,
") !default;
-
-$custom-switch-width: $custom-control-indicator-size * 1.75 !default;
-$custom-switch-indicator-border-radius: $custom-control-indicator-size * .5 !default;
-$custom-switch-indicator-size: subtract($custom-control-indicator-size, $custom-control-indicator-border-width * 4) !default;
-
-$custom-select-padding-y: $input-padding-y !default;
-$custom-select-padding-x: $input-padding-x !default;
-$custom-select-font-family: $input-font-family !default;
-$custom-select-font-size: $input-font-size !default;
-$custom-select-height: $input-height !default;
-$custom-select-indicator-padding: 1rem !default; // Extra padding to account for the presence of the background-image based indicator
-$custom-select-font-weight: $input-font-weight !default;
-$custom-select-line-height: $input-line-height !default;
-$custom-select-color: $input-color !default;
-$custom-select-disabled-color: $gray-600 !default;
-$custom-select-bg: $input-bg !default;
-$custom-select-disabled-bg: $gray-200 !default;
-$custom-select-bg-size: 8px 10px !default; // In pixels because image dimensions
-$custom-select-indicator-color: $gray-800 !default;
-$custom-select-indicator: url("data:image/svg+xml,
") !default;
-$custom-select-background: escape-svg($custom-select-indicator) right $custom-select-padding-x center / $custom-select-bg-size no-repeat !default; // Used so we can have multiple background elements (e.g., arrow and feedback icon)
-
-$custom-select-feedback-icon-padding-right: add(1em * .75, (2 * $custom-select-padding-y * .75) + $custom-select-padding-x + $custom-select-indicator-padding) !default;
-$custom-select-feedback-icon-position: center right ($custom-select-padding-x + $custom-select-indicator-padding) !default;
-$custom-select-feedback-icon-size: $input-height-inner-half $input-height-inner-half !default;
-
-$custom-select-border-width: $input-border-width !default;
-$custom-select-border-color: $input-border-color !default;
-$custom-select-border-radius: $border-radius !default;
-$custom-select-box-shadow: inset 0 1px 2px rgba($black, .075) !default;
-
-$custom-select-focus-border-color: $input-focus-border-color !default;
-$custom-select-focus-width: $input-focus-width !default;
-$custom-select-focus-box-shadow: 0 0 0 $custom-select-focus-width $input-btn-focus-color !default;
-
-$custom-select-padding-y-sm: $input-padding-y-sm !default;
-$custom-select-padding-x-sm: $input-padding-x-sm !default;
-$custom-select-font-size-sm: $input-font-size-sm !default;
-$custom-select-height-sm: $input-height-sm !default;
-
-$custom-select-padding-y-lg: $input-padding-y-lg !default;
-$custom-select-padding-x-lg: $input-padding-x-lg !default;
-$custom-select-font-size-lg: $input-font-size-lg !default;
-$custom-select-height-lg: $input-height-lg !default;
-
-$custom-range-track-width: 100% !default;
-$custom-range-track-height: .5rem !default;
-$custom-range-track-cursor: pointer !default;
-$custom-range-track-bg: $gray-300 !default;
-$custom-range-track-border-radius: 1rem !default;
-$custom-range-track-box-shadow: inset 0 .25rem .25rem rgba($black, .1) !default;
-
-$custom-range-thumb-width: 1rem !default;
-$custom-range-thumb-height: $custom-range-thumb-width !default;
-$custom-range-thumb-bg: $component-active-bg !default;
-$custom-range-thumb-border: 0 !default;
-$custom-range-thumb-border-radius: 1rem !default;
-$custom-range-thumb-box-shadow: 0 .1rem .25rem rgba($black, .1) !default;
-$custom-range-thumb-focus-box-shadow: 0 0 0 1px $body-bg, $input-focus-box-shadow !default;
-$custom-range-thumb-focus-box-shadow-width: $input-focus-width !default; // For focus box shadow issue in IE/Edge
-$custom-range-thumb-active-bg: lighten($component-active-bg, 35%) !default;
-$custom-range-thumb-disabled-bg: $gray-500 !default;
-
-$custom-file-height: $input-height !default;
-$custom-file-height-inner: $input-height-inner !default;
-$custom-file-focus-border-color: $input-focus-border-color !default;
-$custom-file-focus-box-shadow: $input-focus-box-shadow !default;
-$custom-file-disabled-bg: $input-disabled-bg !default;
-
-$custom-file-padding-y: $input-padding-y !default;
-$custom-file-padding-x: $input-padding-x !default;
-$custom-file-line-height: $input-line-height !default;
-$custom-file-font-family: $input-font-family !default;
-$custom-file-font-weight: $input-font-weight !default;
-$custom-file-color: $input-color !default;
-$custom-file-bg: $input-bg !default;
-$custom-file-border-width: $input-border-width !default;
-$custom-file-border-color: $input-border-color !default;
-$custom-file-border-radius: $input-border-radius !default;
-$custom-file-box-shadow: $input-box-shadow !default;
-$custom-file-button-color: $custom-file-color !default;
-$custom-file-button-bg: $input-group-addon-bg !default;
-$custom-file-text: (
- en: "Browse"
-) !default;
-
+// scss-docs-end input-group-variables
+
+// scss-docs-start form-select-variables
+$form-select-padding-y: $input-padding-y !default;
+$form-select-padding-x: $input-padding-x !default;
+$form-select-font-family: $input-font-family !default;
+$form-select-font-size: $input-font-size !default;
+$form-select-indicator-padding: $form-select-padding-x * 3 !default; // Extra padding for background-image
+$form-select-font-weight: $input-font-weight !default;
+$form-select-line-height: $input-line-height !default;
+$form-select-color: $input-color !default;
+$form-select-bg: $input-bg !default;
+$form-select-disabled-color: null !default;
+$form-select-disabled-bg: $gray-200 !default;
+$form-select-disabled-border-color: $input-disabled-border-color !default;
+$form-select-bg-position: right $form-select-padding-x center !default;
+$form-select-bg-size: 16px 12px !default; // In pixels because image dimensions
+$form-select-indicator-color: $gray-800 !default;
+$form-select-indicator: url("data:image/svg+xml,
") !default;
+
+$form-select-feedback-icon-padding-end: $form-select-padding-x * 2.5 + $form-select-indicator-padding !default;
+$form-select-feedback-icon-position: center right $form-select-indicator-padding !default;
+$form-select-feedback-icon-size: $input-height-inner-half $input-height-inner-half !default;
+
+$form-select-border-width: $input-border-width !default;
+$form-select-border-color: $input-border-color !default;
+$form-select-border-radius: $border-radius !default;
+$form-select-box-shadow: $box-shadow-inset !default;
+
+$form-select-focus-border-color: $input-focus-border-color !default;
+$form-select-focus-width: $input-focus-width !default;
+$form-select-focus-box-shadow: 0 0 0 $form-select-focus-width $input-btn-focus-color !default;
+
+$form-select-padding-y-sm: $input-padding-y-sm !default;
+$form-select-padding-x-sm: $input-padding-x-sm !default;
+$form-select-font-size-sm: $input-font-size-sm !default;
+
+$form-select-padding-y-lg: $input-padding-y-lg !default;
+$form-select-padding-x-lg: $input-padding-x-lg !default;
+$form-select-font-size-lg: $input-font-size-lg !default;
+
+$form-select-transition: $input-transition !default;
+// scss-docs-end form-select-variables
+
+// scss-docs-start form-range-variables
+$form-range-track-width: 100% !default;
+$form-range-track-height: .5rem !default;
+$form-range-track-cursor: pointer !default;
+$form-range-track-bg: $gray-300 !default;
+$form-range-track-border-radius: 1rem !default;
+$form-range-track-box-shadow: $box-shadow-inset !default;
+
+$form-range-thumb-width: 1rem !default;
+$form-range-thumb-height: $form-range-thumb-width !default;
+$form-range-thumb-bg: $component-active-bg !default;
+$form-range-thumb-border: 0 !default;
+$form-range-thumb-border-radius: 1rem !default;
+$form-range-thumb-box-shadow: 0 .1rem .25rem rgba($black, .1) !default;
+$form-range-thumb-focus-box-shadow: 0 0 0 1px $body-bg, $input-focus-box-shadow !default;
+$form-range-thumb-focus-box-shadow-width: $input-focus-width !default; // For focus box shadow issue in Edge
+$form-range-thumb-active-bg: tint-color($component-active-bg, 70%) !default;
+$form-range-thumb-disabled-bg: $gray-500 !default;
+$form-range-thumb-transition: background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out !default;
+// scss-docs-end form-range-variables
+
+// scss-docs-start form-file-variables
+$form-file-button-color: $input-color !default;
+$form-file-button-bg: $input-group-addon-bg !default;
+$form-file-button-hover-bg: shade-color($form-file-button-bg, 5%) !default;
+// scss-docs-end form-file-variables
+
+// scss-docs-start form-floating-variables
+$form-floating-height: add(3.5rem, $input-height-border) !default;
+$form-floating-line-height: 1.25 !default;
+$form-floating-padding-x: $input-padding-x !default;
+$form-floating-padding-y: 1rem !default;
+$form-floating-input-padding-t: 1.625rem !default;
+$form-floating-input-padding-b: .625rem !default;
+$form-floating-label-opacity: .65 !default;
+$form-floating-label-transform: scale(.85) translateY(-.5rem) translateX(.15rem) !default;
+$form-floating-transition: opacity .1s ease-in-out, transform .1s ease-in-out !default;
+// scss-docs-end form-floating-variables
// Form validation
+// scss-docs-start form-feedback-variables
$form-feedback-margin-top: $form-text-margin-top !default;
$form-feedback-font-size: $small-font-size !default;
-$form-feedback-valid-color: theme-color("success") !default;
-$form-feedback-invalid-color: theme-color("danger") !default;
+$form-feedback-font-style: $form-text-font-style !default;
+$form-feedback-valid-color: $success !default;
+$form-feedback-invalid-color: $danger !default;
$form-feedback-icon-valid-color: $form-feedback-valid-color !default;
$form-feedback-icon-valid: url("data:image/svg+xml,
") !default;
$form-feedback-icon-invalid-color: $form-feedback-invalid-color !default;
$form-feedback-icon-invalid: url("data:image/svg+xml,
") !default;
+// scss-docs-end form-feedback-variables
-$form-validation-states: () !default;
-$form-validation-states: map-merge(
- (
- "valid": (
- "color": $form-feedback-valid-color,
- "icon": $form-feedback-icon-valid
- ),
- "invalid": (
- "color": $form-feedback-invalid-color,
- "icon": $form-feedback-icon-invalid
- ),
+// scss-docs-start form-validation-states
+$form-validation-states: (
+ "valid": (
+ "color": $form-feedback-valid-color,
+ "icon": $form-feedback-icon-valid
),
- $form-validation-states
-);
+ "invalid": (
+ "color": $form-feedback-invalid-color,
+ "icon": $form-feedback-icon-invalid
+ )
+) !default;
+// scss-docs-end form-validation-states
// Z-index master list
//
// Warning: Avoid customizing these values. They're used for a bird's eye view
// of components dependent on the z-axis and are designed to all work together.
+// scss-docs-start zindex-stack
$zindex-dropdown: 1000 !default;
$zindex-sticky: 1020 !default;
$zindex-fixed: 1030 !default;
$zindex-modal-backdrop: 1040 !default;
-$zindex-modal: 1050 !default;
-$zindex-popover: 1060 !default;
-$zindex-tooltip: 1070 !default;
+$zindex-offcanvas: 1050 !default;
+$zindex-modal: 1060 !default;
+$zindex-popover: 1070 !default;
+$zindex-tooltip: 1080 !default;
+// scss-docs-end zindex-stack
// Navs
+// scss-docs-start nav-variables
$nav-link-padding-y: .5rem !default;
$nav-link-padding-x: 1rem !default;
+$nav-link-font-size: null !default;
+$nav-link-font-weight: null !default;
+$nav-link-color: $link-color !default;
+$nav-link-hover-color: $link-hover-color !default;
+$nav-link-transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out !default;
$nav-link-disabled-color: $gray-600 !default;
$nav-tabs-border-color: $gray-300 !default;
@@ -708,13 +968,12 @@ $nav-tabs-link-active-border-color: $gray-300 $gray-300 $nav-tabs-link-active-bg
$nav-pills-border-radius: $border-radius !default;
$nav-pills-link-active-color: $component-active-color !default;
$nav-pills-link-active-bg: $component-active-bg !default;
-
-$nav-divider-color: $gray-200 !default;
-$nav-divider-margin-y: $spacer * .5 !default;
+// scss-docs-end nav-variables
// Navbar
+// scss-docs-start navbar-variables
$navbar-padding-y: $spacer * .5 !default;
$navbar-padding-x: $spacer !default;
@@ -725,14 +984,17 @@ $navbar-brand-font-size: $font-size-lg !default;
$nav-link-height: $font-size-base * $line-height-base + $nav-link-padding-y * 2 !default;
$navbar-brand-height: $navbar-brand-font-size * $line-height-base !default;
$navbar-brand-padding-y: ($nav-link-height - $navbar-brand-height) * .5 !default;
+$navbar-brand-margin-end: 1rem !default;
$navbar-toggler-padding-y: .25rem !default;
$navbar-toggler-padding-x: .75rem !default;
$navbar-toggler-font-size: $font-size-lg !default;
$navbar-toggler-border-radius: $btn-border-radius !default;
+$navbar-toggler-focus-width: $btn-focus-width !default;
+$navbar-toggler-transition: box-shadow .15s ease-in-out !default;
+// scss-docs-end navbar-variables
-$navbar-nav-scroll-max-height: 75vh !default;
-
+// scss-docs-start navbar-theme-variables
$navbar-dark-color: rgba($white, .5) !default;
$navbar-dark-hover-color: rgba($white, .75) !default;
$navbar-dark-active-color: $white !default;
@@ -751,12 +1013,14 @@ $navbar-light-brand-color: $navbar-light-active-color !default;
$navbar-light-brand-hover-color: $navbar-light-active-color !default;
$navbar-dark-brand-color: $navbar-dark-active-color !default;
$navbar-dark-brand-hover-color: $navbar-dark-active-color !default;
+// scss-docs-end navbar-theme-variables
// Dropdowns
//
// Dropdown menu container and contents.
+// scss-docs-start dropdown-variables
$dropdown-min-width: 10rem !default;
$dropdown-padding-x: 0 !default;
$dropdown-padding-y: .5rem !default;
@@ -769,7 +1033,7 @@ $dropdown-border-radius: $border-radius !default;
$dropdown-border-width: $border-width !default;
$dropdown-inner-border-radius: subtract($dropdown-border-radius, $dropdown-border-width) !default;
$dropdown-divider-bg: $gray-200 !default;
-$dropdown-divider-margin-y: $nav-divider-margin-y !default;
+$dropdown-divider-margin-y: $spacer * .5 !default;
$dropdown-box-shadow: 0 .5rem 1rem rgba($black, .175) !default;
$dropdown-link-color: $gray-900 !default;
@@ -786,23 +1050,43 @@ $dropdown-item-padding-x: 1.5rem !default;
$dropdown-header-color: $gray-600 !default;
$dropdown-header-padding: $dropdown-padding-y $dropdown-item-padding-x !default;
+// scss-docs-end dropdown-variables
+
+// scss-docs-start dropdown-dark-variables
+$dropdown-dark-color: $gray-300 !default;
+$dropdown-dark-bg: $gray-800 !default;
+$dropdown-dark-border-color: $dropdown-border-color !default;
+$dropdown-dark-divider-bg: $dropdown-divider-bg !default;
+$dropdown-dark-box-shadow: null !default;
+$dropdown-dark-link-color: $dropdown-dark-color !default;
+$dropdown-dark-link-hover-color: $white !default;
+$dropdown-dark-link-hover-bg: rgba($white, .15) !default;
+$dropdown-dark-link-active-color: $dropdown-link-active-color !default;
+$dropdown-dark-link-active-bg: $dropdown-link-active-bg !default;
+$dropdown-dark-link-disabled-color: $gray-500 !default;
+$dropdown-dark-header-color: $gray-500 !default;
+// scss-docs-end dropdown-dark-variables
// Pagination
+// scss-docs-start pagination-variables
$pagination-padding-y: .5rem !default;
$pagination-padding-x: .75rem !default;
$pagination-padding-y-sm: .25rem !default;
$pagination-padding-x-sm: .5rem !default;
$pagination-padding-y-lg: .75rem !default;
$pagination-padding-x-lg: 1.5rem !default;
-$pagination-line-height: 1.25 !default;
$pagination-color: $link-color !default;
$pagination-bg: $white !default;
$pagination-border-width: $border-width !default;
+$pagination-border-radius: $border-radius !default;
+$pagination-margin-start: -$pagination-border-width !default;
$pagination-border-color: $gray-300 !default;
+$pagination-focus-color: $link-hover-color !default;
+$pagination-focus-bg: $gray-200 !default;
$pagination-focus-box-shadow: $input-btn-focus-box-shadow !default;
$pagination-focus-outline: 0 !default;
@@ -818,43 +1102,73 @@ $pagination-disabled-color: $gray-600 !default;
$pagination-disabled-bg: $white !default;
$pagination-disabled-border-color: $gray-300 !default;
+$pagination-transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out !default;
+
$pagination-border-radius-sm: $border-radius-sm !default;
$pagination-border-radius-lg: $border-radius-lg !default;
-
-
-// Jumbotron
-
-$jumbotron-padding: 2rem !default;
-$jumbotron-color: null !default;
-$jumbotron-bg: $gray-200 !default;
+// scss-docs-end pagination-variables
// Cards
-$card-spacer-y: .75rem !default;
+// scss-docs-start card-variables
+$card-spacer-y: 1.25rem !default;
$card-spacer-x: 1.25rem !default;
+$card-title-spacer-y: $spacer * .5 !default;
$card-border-width: $border-width !default;
$card-border-radius: $border-radius !default;
$card-border-color: rgba($black, .125) !default;
$card-inner-border-radius: subtract($card-border-radius, $card-border-width) !default;
+$card-cap-padding-y: $card-spacer-y !default;
+$card-cap-padding-x: $card-spacer-x !default;
$card-cap-bg: rgba($black, .03) !default;
$card-cap-color: null !default;
$card-height: null !default;
$card-color: null !default;
$card-bg: $white !default;
-
-$card-img-overlay-padding: 1.25rem !default;
-
+$card-img-overlay-padding: $spacer!default;
$card-group-margin: $grid-gutter-width * .5 !default;
-$card-deck-margin: $card-group-margin !default;
-
-$card-columns-count: 3 !default;
-$card-columns-gap: 1.25rem !default;
-$card-columns-margin: $card-spacer-y !default;
-
+// scss-docs-end card-variables
+
+// Accordion
+
+// scss-docs-start accordion-variables
+$accordion-padding-y: 1rem !default;
+$accordion-padding-x: 1.25rem !default;
+$accordion-color: $body-color !default;
+$accordion-bg: $body-bg !default;
+$accordion-border-width: $border-width !default;
+$accordion-border-color: rgba($black, .125) !default;
+$accordion-border-radius: $border-radius !default;
+$accordion-inner-border-radius: subtract($accordion-border-radius, $accordion-border-width) !default;
+
+$accordion-body-padding-y: $accordion-padding-y !default;
+$accordion-body-padding-x: $accordion-padding-x !default;
+
+$accordion-button-padding-y: $accordion-padding-y !default;
+$accordion-button-padding-x: $accordion-padding-x !default;
+$accordion-button-color: $accordion-color !default;
+$accordion-button-bg: $accordion-bg !default;
+$accordion-transition: $btn-transition, border-radius .15s ease !default;
+$accordion-button-active-bg: tint-color($component-active-bg, 90%) !default;
+$accordion-button-active-color: shade-color($primary, 10%) !default;
+
+$accordion-button-focus-border-color: $input-focus-border-color !default;
+$accordion-button-focus-box-shadow: $btn-focus-box-shadow !default;
+
+$accordion-icon-width: 1.25rem !default;
+$accordion-icon-color: $accordion-color !default;
+$accordion-icon-active-color: $accordion-button-active-color !default;
+$accordion-icon-transition: transform .2s ease-in-out !default;
+$accordion-icon-transform: rotate(-180deg) !default;
+
+$accordion-button-icon: url("data:image/svg+xml,
") !default;
+$accordion-button-active-icon: url("data:image/svg+xml,
") !default;
+// scss-docs-end accordion-variables
// Tooltips
+// scss-docs-start tooltip-variables
$tooltip-font-size: $font-size-sm !default;
$tooltip-max-width: 200px !default;
$tooltip-color: $white !default;
@@ -868,18 +1182,22 @@ $tooltip-margin: 0 !default;
$tooltip-arrow-width: .8rem !default;
$tooltip-arrow-height: .4rem !default;
$tooltip-arrow-color: $tooltip-bg !default;
+// scss-docs-end tooltip-variables
// Form tooltips must come after regular tooltips
+// scss-docs-start tooltip-feedback-variables
$form-feedback-tooltip-padding-y: $tooltip-padding-y !default;
$form-feedback-tooltip-padding-x: $tooltip-padding-x !default;
$form-feedback-tooltip-font-size: $tooltip-font-size !default;
$form-feedback-tooltip-line-height: $line-height-base !default;
$form-feedback-tooltip-opacity: $tooltip-opacity !default;
$form-feedback-tooltip-border-radius: $tooltip-border-radius !default;
+// scss-docs-end tooltip-feedback-variables
// Popovers
+// scss-docs-start popover-variables
$popover-font-size: $font-size-sm !default;
$popover-bg: $white !default;
$popover-max-width: 276px !default;
@@ -903,10 +1221,12 @@ $popover-arrow-height: .5rem !default;
$popover-arrow-color: $popover-bg !default;
$popover-arrow-outer-color: fade-in($popover-border-color, .05) !default;
+// scss-docs-end popover-variables
// Toasts
+// scss-docs-start toast-variables
$toast-max-width: 350px !default;
$toast-padding-x: .75rem !default;
$toast-padding-y: .25rem !default;
@@ -917,35 +1237,31 @@ $toast-border-width: 1px !default;
$toast-border-color: rgba(0, 0, 0, .1) !default;
$toast-border-radius: .25rem !default;
$toast-box-shadow: 0 .25rem .75rem rgba($black, .1) !default;
+$toast-spacing: $container-padding-x !default;
$toast-header-color: $gray-600 !default;
$toast-header-background-color: rgba($white, .85) !default;
$toast-header-border-color: rgba(0, 0, 0, .05) !default;
+// scss-docs-end toast-variables
// Badges
-$badge-font-size: 75% !default;
+// scss-docs-start badge-variables
+$badge-font-size: .75% !default;
$badge-font-weight: $font-weight-bold !default;
+$badge-color: $white !default;
$badge-padding-y: .25em !default;
$badge-padding-x: .4em !default;
$badge-border-radius: $border-radius !default;
-
-$badge-transition: $btn-transition !default;
-$badge-focus-width: $input-btn-focus-width !default;
-
-$badge-pill-padding-x: .6em !default;
-// Use a higher than normal value to ensure completely rounded edges when
-// customizing padding or font-size on labels.
-$badge-pill-border-radius: 10rem !default;
+// scss-docs-end badge-variables
// Modals
-// Padding applied to the modal body
-$modal-inner-padding: 1rem !default;
+// scss-docs-start modal-variables
+$modal-inner-padding: $spacer !default;
-// Margin between elements in footer, must be lower than or equal to 2 * $modal-inner-padding
$modal-footer-margin-between: .5rem !default;
$modal-dialog-margin: .5rem !default;
@@ -968,52 +1284,58 @@ $modal-header-border-color: $border-color !default;
$modal-footer-border-color: $modal-header-border-color !default;
$modal-header-border-width: $modal-content-border-width !default;
$modal-footer-border-width: $modal-header-border-width !default;
-$modal-header-padding-y: 1rem !default;
-$modal-header-padding-x: 1rem !default;
+$modal-header-padding-y: $modal-inner-padding !default;
+$modal-header-padding-x: $modal-inner-padding !default;
$modal-header-padding: $modal-header-padding-y $modal-header-padding-x !default; // Keep this for backwards compatibility
-$modal-xl: 1140px !default;
-$modal-lg: 800px !default;
-$modal-md: 500px !default;
$modal-sm: 300px !default;
+$modal-md: 500px !default;
+$modal-lg: 800px !default;
+$modal-xl: 1140px !default;
$modal-fade-transform: translate(0, -50px) !default;
$modal-show-transform: none !default;
$modal-transition: transform .3s ease-out !default;
$modal-scale-transform: scale(1.02) !default;
+// scss-docs-end modal-variables
// Alerts
//
// Define alert colors, border radius, and padding.
+// scss-docs-start alert-variables
$alert-padding-y: .75rem !default;
$alert-padding-x: 1.25rem !default;
$alert-margin-bottom: 1rem !default;
$alert-border-radius: $border-radius !default;
$alert-link-font-weight: $font-weight-bold !default;
$alert-border-width: $border-width !default;
-
-$alert-bg-level: -10 !default;
-$alert-border-level: -9 !default;
-$alert-color-level: 6 !default;
+$alert-bg-scale: -80% !default;
+$alert-border-scale: -70% !default;
+$alert-color-scale: 40% !default;
+$alert-dismissible-padding-r: $alert-padding-x * 3 !default; // 3x covers width of x plus default padding on either side
+// scss-docs-end alert-variables
// Progress bars
+// scss-docs-start progress-variables
$progress-height: 1rem !default;
$progress-font-size: $font-size-base * .75 !default;
$progress-bg: $gray-200 !default;
$progress-border-radius: $border-radius !default;
$progress-box-shadow: inset 0 .1rem .1rem rgba($black, .1) !default;
$progress-bar-color: $white !default;
-$progress-bar-bg: theme-color("primary") !default;
+$progress-bar-bg: $primary !default;
$progress-bar-animation-timing: 1s linear infinite !default;
$progress-bar-transition: width .6s ease !default;
+// scss-docs-end progress-variables
// List group
+// scss-docs-start list-group-variables
$list-group-color: null !default;
$list-group-bg: $white !default;
$list-group-border-color: rgba($black, .125) !default;
@@ -1022,6 +1344,8 @@ $list-group-border-radius: $border-radius !default;
$list-group-item-padding-y: .75rem !default;
$list-group-item-padding-x: 1.25rem !default;
+$list-group-item-bg-scale: -80% !default;
+$list-group-item-color-scale: 40% !default;
$list-group-hover-bg: $gray-100 !default;
$list-group-active-color: $component-active-color !default;
@@ -1036,44 +1360,49 @@ $list-group-action-hover-color: $list-group-action-color !default;
$list-group-action-active-color: $body-color !default;
$list-group-action-active-bg: $gray-200 !default;
+// scss-docs-end list-group-variables
// Image thumbnails
+// scss-docs-start thumbnail-variables
$thumbnail-padding: .25rem !default;
$thumbnail-bg: $body-bg !default;
$thumbnail-border-width: $border-width !default;
$thumbnail-border-color: $gray-300 !default;
$thumbnail-border-radius: $border-radius !default;
$thumbnail-box-shadow: 0 1px 2px rgba($black, .075) !default;
+// scss-docs-end thumbnail-variables
// Figures
+// scss-docs-start figure-variables
$figure-caption-font-size: 90% !default;
$figure-caption-color: $gray-600 !default;
+// scss-docs-end figure-variables
// Breadcrumbs
+// scss-docs-start breadcrumb-variables
$breadcrumb-font-size: null !default;
$breadcrumb-padding-y: .75rem !default;
$breadcrumb-padding-x: 1rem !default;
-$breadcrumb-item-padding: .5rem !default;
-
+$breadcrumb-item-padding-x: .5rem !default;
$breadcrumb-margin-bottom: 1rem !default;
-
$breadcrumb-bg: $gray-200 !default;
$breadcrumb-divider-color: $gray-600 !default;
$breadcrumb-active-color: $gray-600 !default;
$breadcrumb-divider: quote("/") !default;
-
+$breadcrumb-divider-flipped: $breadcrumb-divider !default;
$breadcrumb-border-radius: $border-radius !default;
-
+// scss-docs-end breadcrumb-variables
// Carousel
+// scss-docs-start carousel-variables
$carousel-control-color: $white !default;
$carousel-control-width: 15% !default;
$carousel-control-opacity: .5 !default;
@@ -1084,11 +1413,15 @@ $carousel-indicator-width: 30px !default;
$carousel-indicator-height: 3px !default;
$carousel-indicator-hit-area-height: 10px !default;
$carousel-indicator-spacer: 3px !default;
+$carousel-indicator-opacity: .5 !default;
$carousel-indicator-active-bg: $white !default;
+$carousel-indicator-active-opacity: 1 !default;
$carousel-indicator-transition: opacity .6s ease !default;
$carousel-caption-width: 70% !default;
$carousel-caption-color: $white !default;
+$carousel-caption-padding-y: 1.25rem !default;
+$carousel-caption-spacer: 1.25rem !default;
$carousel-control-icon-width: 20px !default;
@@ -1098,26 +1431,60 @@ $carousel-control-next-icon-bg: url("data:image/svg+xml,
") !default;
+$btn-close-focus-shadow: $input-btn-focus-box-shadow !default;
+$btn-close-opacity: .5 !default;
+$btn-close-hover-opacity: .75 !default;
+$btn-close-focus-opacity: 1 !default;
+$btn-close-disabled-opacity: .25 !default;
+$btn-close-white-filter: invert(1) grayscale(100%) brightness(200%) !default;
+// scss-docs-end close-variables
+
+
+// Offcanvas
+
+// scss-docs-start offcanvas-variables
+$offcanvas-padding-y: $modal-inner-padding !default;
+$offcanvas-padding-x: $modal-inner-padding !default;
+$offcanvas-horizontal-width: 400px !default;
+$offcanvas-vertical-height: 30vh !default;
+$offcanvas-transition-duration: .3s !default;
+$offcanvas-border-color: $modal-content-border-color !default;
+$offcanvas-border-width: $modal-content-border-width !default;
+$offcanvas-title-line-height: $modal-title-line-height !default;
+$offcanvas-bg-color: $modal-content-bg !default;
+$offcanvas-color: $modal-content-color !default;
+$offcanvas-box-shadow: $modal-content-box-shadow-xs !default;
+// scss-docs-end offcanvas-variables
// Code
@@ -1131,18 +1498,3 @@ $kbd-color: $white !default;
$kbd-bg: $gray-900 !default;
$pre-color: $gray-900 !default;
-$pre-scrollable-max-height: 340px !default;
-
-
-// Utilities
-
-$displays: none, inline, inline-block, block, table, table-row, table-cell, flex, inline-flex !default;
-$overflows: auto, hidden !default;
-$positions: static, relative, absolute, fixed, sticky !default;
-$user-selects: all, auto, none !default;
-
-
-// Printing
-
-$print-page-size: a3 !default;
-$print-body-min-width: map-get($grid-breakpoints, "lg") !default;
diff --git a/oioioi/base/static/bootstrap/stylesheets/bootstrap-grid.scss b/oioioi/base/static/bootstrap/stylesheets/bootstrap-grid.scss
index 0de912bff..bcd8c19cf 100644
--- a/oioioi/base/static/bootstrap/stylesheets/bootstrap-grid.scss
+++ b/oioioi/base/static/bootstrap/stylesheets/bootstrap-grid.scss
@@ -1,30 +1,65 @@
/*!
- * Bootstrap Grid v4.6.1 (https://getbootstrap.com/)
+ * Bootstrap Grid v5.0.2 (https://getbootstrap.com/)
* Copyright 2011-2021 The Bootstrap Authors
* Copyright 2011-2021 Twitter, Inc.
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
*/
-html {
- box-sizing: border-box;
- -ms-overflow-style: scrollbar;
-}
-
-*,
-*::before,
-*::after {
- box-sizing: inherit;
-}
+$include-column-box-sizing: true !default;
@import "functions";
@import "variables";
-@import "mixins/deprecate";
+@import "mixins/lists";
@import "mixins/breakpoints";
-@import "mixins/grid-framework";
+@import "mixins/container";
@import "mixins/grid";
+@import "mixins/utilities";
+
+@import "vendor/rfs";
+@import "containers";
@import "grid";
-@import "utilities/display";
-@import "utilities/flex";
-@import "utilities/spacing";
+
+@import "utilities";
+// Only use the utilities we need
+// stylelint-disable-next-line scss/dollar-variable-default
+$utilities: map-get-multiple(
+ $utilities,
+ (
+ "display",
+ "order",
+ "flex",
+ "flex-direction",
+ "flex-grow",
+ "flex-shrink",
+ "flex-wrap",
+ "justify-content",
+ "align-items",
+ "align-content",
+ "align-self",
+ "margin",
+ "margin-x",
+ "margin-y",
+ "margin-top",
+ "margin-end",
+ "margin-bottom",
+ "margin-start",
+ "negative-margin",
+ "negative-margin-x",
+ "negative-margin-y",
+ "negative-margin-top",
+ "negative-margin-end",
+ "negative-margin-bottom",
+ "negative-margin-start",
+ "padding",
+ "padding-x",
+ "padding-y",
+ "padding-top",
+ "padding-end",
+ "padding-bottom",
+ "padding-start",
+ )
+);
+
+@import "utilities/api";
diff --git a/oioioi/base/static/bootstrap/stylesheets/bootstrap-reboot.scss b/oioioi/base/static/bootstrap/stylesheets/bootstrap-reboot.scss
index aed4e378c..72444f6c1 100644
--- a/oioioi/base/static/bootstrap/stylesheets/bootstrap-reboot.scss
+++ b/oioioi/base/static/bootstrap/stylesheets/bootstrap-reboot.scss
@@ -1,5 +1,5 @@
/*!
- * Bootstrap Reboot v4.6.1 (https://getbootstrap.com/)
+ * Bootstrap Reboot v5.0.2 (https://getbootstrap.com/)
* Copyright 2011-2021 The Bootstrap Authors
* Copyright 2011-2021 Twitter, Inc.
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
@@ -8,5 +8,8 @@
@import "functions";
@import "variables";
+// Prevent the usage of custom properties since we don't add them to `:root` in reboot
+$font-family-base: $font-family-sans-serif; // stylelint-disable-line scss/dollar-variable-default
+$font-family-code: $font-family-monospace; // stylelint-disable-line scss/dollar-variable-default
@import "mixins";
@import "reboot";
diff --git a/oioioi/base/static/bootstrap/stylesheets/bootstrap-utilities.scss b/oioioi/base/static/bootstrap/stylesheets/bootstrap-utilities.scss
new file mode 100644
index 000000000..ab2d0e701
--- /dev/null
+++ b/oioioi/base/static/bootstrap/stylesheets/bootstrap-utilities.scss
@@ -0,0 +1,18 @@
+/*!
+ * Bootstrap Utilities v5.0.2 (https://getbootstrap.com/)
+ * Copyright 2011-2021 The Bootstrap Authors
+ * Copyright 2011-2021 Twitter, Inc.
+ * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
+ */
+
+// Configuration
+@import "functions";
+@import "variables";
+@import "mixins";
+@import "utilities";
+
+// Helpers
+@import "helpers";
+
+// Utilities
+@import "utilities/api";
diff --git a/oioioi/base/static/bootstrap/stylesheets/bootstrap.scss b/oioioi/base/static/bootstrap/stylesheets/bootstrap.scss
index 60bb836f0..eb047a3f2 100644
--- a/oioioi/base/static/bootstrap/stylesheets/bootstrap.scss
+++ b/oioioi/base/static/bootstrap/stylesheets/bootstrap.scss
@@ -1,18 +1,23 @@
/*!
- * Bootstrap v4.6.1 (https://getbootstrap.com/)
+ * Bootstrap v5.0.2 (https://getbootstrap.com/)
* Copyright 2011-2021 The Bootstrap Authors
* Copyright 2011-2021 Twitter, Inc.
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
*/
+// scss-docs-start import-stack
+// Configuration
@import "functions";
@import "variables";
@import "mixins";
+@import "utilities";
+
+// Layout & components
@import "root";
@import "reboot";
@import "type";
@import "images";
-@import "code";
+@import "containers";
@import "grid";
@import "tables";
@import "forms";
@@ -20,18 +25,15 @@
@import "transitions";
@import "dropdown";
@import "button-group";
-@import "input-group";
-@import "custom-forms";
@import "nav";
@import "navbar";
@import "card";
+@import "accordion";
@import "breadcrumb";
@import "pagination";
@import "badge";
-@import "jumbotron";
@import "alert";
@import "progress";
-@import "media";
@import "list-group";
@import "close";
@import "toasts";
@@ -40,5 +42,11 @@
@import "popover";
@import "carousel";
@import "spinners";
-@import "utilities";
-@import "print";
+@import "offcanvas";
+
+// Helpers
+@import "helpers";
+
+// Utilities
+@import "utilities/api";
+// scss-docs-end import-stack
diff --git a/oioioi/base/static/bootstrap/stylesheets/forms/_floating-labels.scss b/oioioi/base/static/bootstrap/stylesheets/forms/_floating-labels.scss
new file mode 100644
index 000000000..2f4295480
--- /dev/null
+++ b/oioioi/base/static/bootstrap/stylesheets/forms/_floating-labels.scss
@@ -0,0 +1,63 @@
+.form-floating {
+ position: relative;
+
+ > .form-control,
+ > .form-select {
+ height: $form-floating-height;
+ line-height: $form-floating-line-height;
+ }
+
+ > label {
+ position: absolute;
+ top: 0;
+ left: 0;
+ height: 100%; // allow textareas
+ padding: $form-floating-padding-y $form-floating-padding-x;
+ pointer-events: none;
+ border: $input-border-width solid transparent; // Required for aligning label's text with the input as it affects inner box model
+ transform-origin: 0 0;
+ @include transition($form-floating-transition);
+ }
+
+ // stylelint-disable no-duplicate-selectors
+ > .form-control {
+ padding: $form-floating-padding-y $form-floating-padding-x;
+
+ &::placeholder {
+ color: transparent;
+ }
+
+ &:focus,
+ &:not(:placeholder-shown) {
+ padding-top: $form-floating-input-padding-t;
+ padding-bottom: $form-floating-input-padding-b;
+ }
+ // Duplicated because `:-webkit-autofill` invalidates other selectors when grouped
+ &:-webkit-autofill {
+ padding-top: $form-floating-input-padding-t;
+ padding-bottom: $form-floating-input-padding-b;
+ }
+ }
+
+ > .form-select {
+ padding-top: $form-floating-input-padding-t;
+ padding-bottom: $form-floating-input-padding-b;
+ }
+
+ > .form-control:focus,
+ > .form-control:not(:placeholder-shown),
+ > .form-select {
+ ~ label {
+ opacity: $form-floating-label-opacity;
+ transform: $form-floating-label-transform;
+ }
+ }
+ // Duplicated because `:-webkit-autofill` invalidates other selectors when grouped
+ > .form-control:-webkit-autofill {
+ ~ label {
+ opacity: $form-floating-label-opacity;
+ transform: $form-floating-label-transform;
+ }
+ }
+ // stylelint-enable no-duplicate-selectors
+}
diff --git a/oioioi/base/static/bootstrap/stylesheets/forms/_form-check.scss b/oioioi/base/static/bootstrap/stylesheets/forms/_form-check.scss
new file mode 100644
index 000000000..6321b4100
--- /dev/null
+++ b/oioioi/base/static/bootstrap/stylesheets/forms/_form-check.scss
@@ -0,0 +1,152 @@
+//
+// Check/radio
+//
+
+.form-check {
+ display: block;
+ min-height: $form-check-min-height;
+ padding-left: $form-check-padding-start;
+ margin-bottom: $form-check-margin-bottom;
+
+ .form-check-input {
+ float: left;
+ margin-left: $form-check-padding-start * -1;
+ }
+}
+
+.form-check-input {
+ width: $form-check-input-width;
+ height: $form-check-input-width;
+ margin-top: ($line-height-base - $form-check-input-width) * .5; // line-height minus check height
+ vertical-align: top;
+ background-color: $form-check-input-bg;
+ background-repeat: no-repeat;
+ background-position: center;
+ background-size: contain;
+ border: $form-check-input-border;
+ appearance: none;
+ color-adjust: exact; // Keep themed appearance for print
+ @include transition($form-check-transition);
+
+ &[type="checkbox"] {
+ @include border-radius($form-check-input-border-radius);
+ }
+
+ &[type="radio"] {
+ // stylelint-disable-next-line property-disallowed-list
+ border-radius: $form-check-radio-border-radius;
+ }
+
+ &:active {
+ filter: $form-check-input-active-filter;
+ }
+
+ &:focus {
+ border-color: $form-check-input-focus-border;
+ outline: 0;
+ box-shadow: $form-check-input-focus-box-shadow;
+ }
+
+ &:checked {
+ background-color: $form-check-input-checked-bg-color;
+ border-color: $form-check-input-checked-border-color;
+
+ &[type="checkbox"] {
+ @if $enable-gradients {
+ background-image: escape-svg($form-check-input-checked-bg-image), var(--#{$variable-prefix}gradient);
+ } @else {
+ background-image: escape-svg($form-check-input-checked-bg-image);
+ }
+ }
+
+ &[type="radio"] {
+ @if $enable-gradients {
+ background-image: escape-svg($form-check-radio-checked-bg-image), var(--#{$variable-prefix}gradient);
+ } @else {
+ background-image: escape-svg($form-check-radio-checked-bg-image);
+ }
+ }
+ }
+
+ &[type="checkbox"]:indeterminate {
+ background-color: $form-check-input-indeterminate-bg-color;
+ border-color: $form-check-input-indeterminate-border-color;
+
+ @if $enable-gradients {
+ background-image: escape-svg($form-check-input-indeterminate-bg-image), var(--#{$variable-prefix}gradient);
+ } @else {
+ background-image: escape-svg($form-check-input-indeterminate-bg-image);
+ }
+ }
+
+ &:disabled {
+ pointer-events: none;
+ filter: none;
+ opacity: $form-check-input-disabled-opacity;
+ }
+
+ // Use disabled attribute in addition of :disabled pseudo-class
+ // See: https://github.com/twbs/bootstrap/issues/28247
+ &[disabled],
+ &:disabled {
+ ~ .form-check-label {
+ opacity: $form-check-label-disabled-opacity;
+ }
+ }
+}
+
+.form-check-label {
+ color: $form-check-label-color;
+ cursor: $form-check-label-cursor;
+}
+
+//
+// Switch
+//
+
+.form-switch {
+ padding-left: $form-switch-padding-start;
+
+ .form-check-input {
+ width: $form-switch-width;
+ margin-left: $form-switch-padding-start * -1;
+ background-image: escape-svg($form-switch-bg-image);
+ background-position: left center;
+ @include border-radius($form-switch-border-radius);
+ @include transition($form-switch-transition);
+
+ &:focus {
+ background-image: escape-svg($form-switch-focus-bg-image);
+ }
+
+ &:checked {
+ background-position: $form-switch-checked-bg-position;
+
+ @if $enable-gradients {
+ background-image: escape-svg($form-switch-checked-bg-image), var(--#{$variable-prefix}gradient);
+ } @else {
+ background-image: escape-svg($form-switch-checked-bg-image);
+ }
+ }
+ }
+}
+
+.form-check-inline {
+ display: inline-block;
+ margin-right: $form-check-inline-margin-end;
+}
+
+.btn-check {
+ position: absolute;
+ clip: rect(0, 0, 0, 0);
+ pointer-events: none;
+
+ &[disabled],
+ &:disabled {
+ + .btn {
+ pointer-events: none;
+ filter: none;
+ opacity: $form-check-btn-check-disabled-opacity;
+ }
+ }
+}
diff --git a/oioioi/base/static/bootstrap/stylesheets/forms/_form-control.scss b/oioioi/base/static/bootstrap/stylesheets/forms/_form-control.scss
new file mode 100644
index 000000000..9728b91f3
--- /dev/null
+++ b/oioioi/base/static/bootstrap/stylesheets/forms/_form-control.scss
@@ -0,0 +1,219 @@
+//
+// General form controls (plus a few specific high-level interventions)
+//
+
+.form-control {
+ display: block;
+ width: 100%;
+ padding: $input-padding-y $input-padding-x;
+ font-family: $input-font-family;
+ @include font-size($input-font-size);
+ font-weight: $input-font-weight;
+ line-height: $input-line-height;
+ color: $input-color;
+ background-color: $input-bg;
+ background-clip: padding-box;
+ border: $input-border-width solid $input-border-color;
+ appearance: none; // Fix appearance for date inputs in Safari
+
+ // Note: This has no effect on
s in some browsers, due to the limited stylability of ``s in CSS.
+ @include border-radius($input-border-radius, 0);
+
+ @include box-shadow($input-box-shadow);
+ @include transition($input-transition);
+
+ &[type="file"] {
+ overflow: hidden; // prevent pseudo element button overlap
+
+ &:not(:disabled):not([readonly]) {
+ cursor: pointer;
+ }
+ }
+
+ // Customize the `:focus` state to imitate native WebKit styles.
+ &:focus {
+ color: $input-focus-color;
+ background-color: $input-focus-bg;
+ border-color: $input-focus-border-color;
+ outline: 0;
+ @if $enable-shadows {
+ @include box-shadow($input-box-shadow, $input-focus-box-shadow);
+ } @else {
+ // Avoid using mixin so we can pass custom focus shadow properly
+ box-shadow: $input-focus-box-shadow;
+ }
+ }
+
+ // Add some height to date inputs on iOS
+ // https://github.com/twbs/bootstrap/issues/23307
+ // TODO: we can remove this workaround once https://bugs.webkit.org/show_bug.cgi?id=198959 is resolved
+ &::-webkit-date-and-time-value {
+ // Multiply line-height by 1em if it has no unit
+ height: if(unit($input-line-height) == "", $input-line-height * 1em, $input-line-height);
+ }
+
+ // Placeholder
+ &::placeholder {
+ color: $input-placeholder-color;
+ // Override Firefox's unusual default opacity; see https://github.com/twbs/bootstrap/pull/11526.
+ opacity: 1;
+ }
+
+ // Disabled and read-only inputs
+ //
+ // HTML5 says that controls under a fieldset > legend:first-child won't be
+ // disabled if the fieldset is disabled. Due to implementation difficulty, we
+ // don't honor that edge case; we style them as disabled anyway.
+ &:disabled,
+ &[readonly] {
+ background-color: $input-disabled-bg;
+ border-color: $input-disabled-border-color;
+ // iOS fix for unreadable disabled content; see https://github.com/twbs/bootstrap/issues/11655.
+ opacity: 1;
+ }
+
+ // File input buttons theming
+ &::file-selector-button {
+ padding: $input-padding-y $input-padding-x;
+ margin: (-$input-padding-y) (-$input-padding-x);
+ margin-inline-end: $input-padding-x;
+ color: $form-file-button-color;
+ @include gradient-bg($form-file-button-bg);
+ pointer-events: none;
+ border-color: inherit;
+ border-style: solid;
+ border-width: 0;
+ border-inline-end-width: $input-border-width;
+ border-radius: 0; // stylelint-disable-line property-disallowed-list
+ @include transition($btn-transition);
+ }
+
+ &:hover:not(:disabled):not([readonly])::file-selector-button {
+ background-color: $form-file-button-hover-bg;
+ }
+
+ &::-webkit-file-upload-button {
+ padding: $input-padding-y $input-padding-x;
+ margin: (-$input-padding-y) (-$input-padding-x);
+ margin-inline-end: $input-padding-x;
+ color: $form-file-button-color;
+ @include gradient-bg($form-file-button-bg);
+ pointer-events: none;
+ border-color: inherit;
+ border-style: solid;
+ border-width: 0;
+ border-inline-end-width: $input-border-width;
+ border-radius: 0; // stylelint-disable-line property-disallowed-list
+ @include transition($btn-transition);
+ }
+
+ &:hover:not(:disabled):not([readonly])::-webkit-file-upload-button {
+ background-color: $form-file-button-hover-bg;
+ }
+}
+
+// Readonly controls as plain text
+//
+// Apply class to a readonly input to make it appear like regular plain
+// text (without any border, background color, focus indicator)
+
+.form-control-plaintext {
+ display: block;
+ width: 100%;
+ padding: $input-padding-y 0;
+ margin-bottom: 0; // match inputs if this class comes on inputs with default margins
+ line-height: $input-line-height;
+ color: $input-plaintext-color;
+ background-color: transparent;
+ border: solid transparent;
+ border-width: $input-border-width 0;
+
+ &.form-control-sm,
+ &.form-control-lg {
+ padding-right: 0;
+ padding-left: 0;
+ }
+}
+
+// Form control sizing
+//
+// Build on `.form-control` with modifier classes to decrease or increase the
+// height and font-size of form controls.
+//
+// Repeated in `_input_group.scss` to avoid Sass extend issues.
+
+.form-control-sm {
+ min-height: $input-height-sm;
+ padding: $input-padding-y-sm $input-padding-x-sm;
+ @include font-size($input-font-size-sm);
+ @include border-radius($input-border-radius-sm);
+
+ &::file-selector-button {
+ padding: $input-padding-y-sm $input-padding-x-sm;
+ margin: (-$input-padding-y-sm) (-$input-padding-x-sm);
+ margin-inline-end: $input-padding-x-sm;
+ }
+
+ &::-webkit-file-upload-button {
+ padding: $input-padding-y-sm $input-padding-x-sm;
+ margin: (-$input-padding-y-sm) (-$input-padding-x-sm);
+ margin-inline-end: $input-padding-x-sm;
+ }
+}
+
+.form-control-lg {
+ min-height: $input-height-lg;
+ padding: $input-padding-y-lg $input-padding-x-lg;
+ @include font-size($input-font-size-lg);
+ @include border-radius($input-border-radius-lg);
+
+ &::file-selector-button {
+ padding: $input-padding-y-lg $input-padding-x-lg;
+ margin: (-$input-padding-y-lg) (-$input-padding-x-lg);
+ margin-inline-end: $input-padding-x-lg;
+ }
+
+ &::-webkit-file-upload-button {
+ padding: $input-padding-y-lg $input-padding-x-lg;
+ margin: (-$input-padding-y-lg) (-$input-padding-x-lg);
+ margin-inline-end: $input-padding-x-lg;
+ }
+}
+
+// Make sure textareas don't shrink too much when resized
+// https://github.com/twbs/bootstrap/pull/29124
+// stylelint-disable selector-no-qualifying-type
+textarea {
+ &.form-control {
+ min-height: $input-height;
+ }
+
+ &.form-control-sm {
+ min-height: $input-height-sm;
+ }
+
+ &.form-control-lg {
+ min-height: $input-height-lg;
+ }
+}
+// stylelint-enable selector-no-qualifying-type
+
+.form-control-color {
+ max-width: 3rem;
+ height: auto; // Override fixed browser height
+ padding: $input-padding-y;
+
+ &:not(:disabled):not([readonly]) {
+ cursor: pointer;
+ }
+
+ &::-moz-color-swatch {
+ height: if(unit($input-line-height) == "", $input-line-height * 1em, $input-line-height);
+ @include border-radius($input-border-radius);
+ }
+
+ &::-webkit-color-swatch {
+ height: if(unit($input-line-height) == "", $input-line-height * 1em, $input-line-height);
+ @include border-radius($input-border-radius);
+ }
+}
diff --git a/oioioi/base/static/bootstrap/stylesheets/forms/_form-range.scss b/oioioi/base/static/bootstrap/stylesheets/forms/_form-range.scss
new file mode 100644
index 000000000..6de42132e
--- /dev/null
+++ b/oioioi/base/static/bootstrap/stylesheets/forms/_form-range.scss
@@ -0,0 +1,91 @@
+// Range
+//
+// Style range inputs the same across browsers. Vendor-specific rules for pseudo
+// elements cannot be mixed. As such, there are no shared styles for focus or
+// active states on prefixed selectors.
+
+.form-range {
+ width: 100%;
+ height: add($form-range-thumb-height, $form-range-thumb-focus-box-shadow-width * 2);
+ padding: 0; // Need to reset padding
+ background-color: transparent;
+ appearance: none;
+
+ &:focus {
+ outline: 0;
+
+ // Pseudo-elements must be split across multiple rulesets to have an effect.
+ // No box-shadow() mixin for focus accessibility.
+ &::-webkit-slider-thumb { box-shadow: $form-range-thumb-focus-box-shadow; }
+ &::-moz-range-thumb { box-shadow: $form-range-thumb-focus-box-shadow; }
+ }
+
+ &::-moz-focus-outer {
+ border: 0;
+ }
+
+ &::-webkit-slider-thumb {
+ width: $form-range-thumb-width;
+ height: $form-range-thumb-height;
+ margin-top: ($form-range-track-height - $form-range-thumb-height) * .5; // Webkit specific
+ @include gradient-bg($form-range-thumb-bg);
+ border: $form-range-thumb-border;
+ @include border-radius($form-range-thumb-border-radius);
+ @include box-shadow($form-range-thumb-box-shadow);
+ @include transition($form-range-thumb-transition);
+ appearance: none;
+
+ &:active {
+ @include gradient-bg($form-range-thumb-active-bg);
+ }
+ }
+
+ &::-webkit-slider-runnable-track {
+ width: $form-range-track-width;
+ height: $form-range-track-height;
+ color: transparent; // Why?
+ cursor: $form-range-track-cursor;
+ background-color: $form-range-track-bg;
+ border-color: transparent;
+ @include border-radius($form-range-track-border-radius);
+ @include box-shadow($form-range-track-box-shadow);
+ }
+
+ &::-moz-range-thumb {
+ width: $form-range-thumb-width;
+ height: $form-range-thumb-height;
+ @include gradient-bg($form-range-thumb-bg);
+ border: $form-range-thumb-border;
+ @include border-radius($form-range-thumb-border-radius);
+ @include box-shadow($form-range-thumb-box-shadow);
+ @include transition($form-range-thumb-transition);
+ appearance: none;
+
+ &:active {
+ @include gradient-bg($form-range-thumb-active-bg);
+ }
+ }
+
+ &::-moz-range-track {
+ width: $form-range-track-width;
+ height: $form-range-track-height;
+ color: transparent;
+ cursor: $form-range-track-cursor;
+ background-color: $form-range-track-bg;
+ border-color: transparent; // Firefox specific?
+ @include border-radius($form-range-track-border-radius);
+ @include box-shadow($form-range-track-box-shadow);
+ }
+
+ &:disabled {
+ pointer-events: none;
+
+ &::-webkit-slider-thumb {
+ background-color: $form-range-thumb-disabled-bg;
+ }
+
+ &::-moz-range-thumb {
+ background-color: $form-range-thumb-disabled-bg;
+ }
+ }
+}
diff --git a/oioioi/base/static/bootstrap/stylesheets/forms/_form-select.scss b/oioioi/base/static/bootstrap/stylesheets/forms/_form-select.scss
new file mode 100644
index 000000000..4506a979a
--- /dev/null
+++ b/oioioi/base/static/bootstrap/stylesheets/forms/_form-select.scss
@@ -0,0 +1,70 @@
+// Select
+//
+// Replaces the browser default select with a custom one, mostly pulled from
+// https://primer.github.io/.
+
+.form-select {
+ display: block;
+ width: 100%;
+ padding: $form-select-padding-y $form-select-indicator-padding $form-select-padding-y $form-select-padding-x;
+ // stylelint-disable-next-line property-no-vendor-prefix
+ -moz-padding-start: subtract($form-select-padding-x, 3px); // See https://github.com/twbs/bootstrap/issues/32636
+ font-family: $form-select-font-family;
+ @include font-size($form-select-font-size);
+ font-weight: $form-select-font-weight;
+ line-height: $form-select-line-height;
+ color: $form-select-color;
+ background-color: $form-select-bg;
+ background-image: escape-svg($form-select-indicator);
+ background-repeat: no-repeat;
+ background-position: $form-select-bg-position;
+ background-size: $form-select-bg-size;
+ border: $form-select-border-width solid $form-select-border-color;
+ @include border-radius($form-select-border-radius, 0);
+ @include box-shadow($form-select-box-shadow);
+ @include transition($form-select-transition);
+ appearance: none;
+
+ &:focus {
+ border-color: $form-select-focus-border-color;
+ outline: 0;
+ @if $enable-shadows {
+ @include box-shadow($form-select-box-shadow, $form-select-focus-box-shadow);
+ } @else {
+ // Avoid using mixin so we can pass custom focus shadow properly
+ box-shadow: $form-select-focus-box-shadow;
+ }
+ }
+
+ &[multiple],
+ &[size]:not([size="1"]) {
+ padding-right: $form-select-padding-x;
+ background-image: none;
+ }
+
+ &:disabled {
+ color: $form-select-disabled-color;
+ background-color: $form-select-disabled-bg;
+ border-color: $form-select-disabled-border-color;
+ }
+
+ // Remove outline from select box in FF
+ &:-moz-focusring {
+ color: transparent;
+ text-shadow: 0 0 0 $form-select-color;
+ }
+}
+
+.form-select-sm {
+ padding-top: $form-select-padding-y-sm;
+ padding-bottom: $form-select-padding-y-sm;
+ padding-left: $form-select-padding-x-sm;
+ @include font-size($form-select-font-size-sm);
+}
+
+.form-select-lg {
+ padding-top: $form-select-padding-y-lg;
+ padding-bottom: $form-select-padding-y-lg;
+ padding-left: $form-select-padding-x-lg;
+ @include font-size($form-select-font-size-lg);
+}
diff --git a/oioioi/base/static/bootstrap/stylesheets/forms/_form-text.scss b/oioioi/base/static/bootstrap/stylesheets/forms/_form-text.scss
new file mode 100644
index 000000000..f080d1a23
--- /dev/null
+++ b/oioioi/base/static/bootstrap/stylesheets/forms/_form-text.scss
@@ -0,0 +1,11 @@
+//
+// Form text
+//
+
+.form-text {
+ margin-top: $form-text-margin-top;
+ @include font-size($form-text-font-size);
+ font-style: $form-text-font-style;
+ font-weight: $form-text-font-weight;
+ color: $form-text-color;
+}
diff --git a/oioioi/base/static/bootstrap/stylesheets/forms/_input-group.scss b/oioioi/base/static/bootstrap/stylesheets/forms/_input-group.scss
new file mode 100644
index 000000000..140052936
--- /dev/null
+++ b/oioioi/base/static/bootstrap/stylesheets/forms/_input-group.scss
@@ -0,0 +1,121 @@
+//
+// Base styles
+//
+
+.input-group {
+ position: relative;
+ display: flex;
+ flex-wrap: wrap; // For form validation feedback
+ align-items: stretch;
+ width: 100%;
+
+ > .form-control,
+ > .form-select {
+ position: relative; // For focus state's z-index
+ flex: 1 1 auto;
+ width: 1%;
+ min-width: 0; // https://stackoverflow.com/questions/36247140/why-dont-flex-items-shrink-past-content-size
+ }
+
+ // Bring the "active" form control to the top of surrounding elements
+ > .form-control:focus,
+ > .form-select:focus {
+ z-index: 3;
+ }
+
+ // Ensure buttons are always above inputs for more visually pleasing borders.
+ // This isn't needed for `.input-group-text` since it shares the same border-color
+ // as our inputs.
+ .btn {
+ position: relative;
+ z-index: 2;
+
+ &:focus {
+ z-index: 3;
+ }
+ }
+}
+
+
+// Textual addons
+//
+// Serves as a catch-all element for any text or radio/checkbox input you wish
+// to prepend or append to an input.
+
+.input-group-text {
+ display: flex;
+ align-items: center;
+ padding: $input-group-addon-padding-y $input-group-addon-padding-x;
+ @include font-size($input-font-size); // Match inputs
+ font-weight: $input-group-addon-font-weight;
+ line-height: $input-line-height;
+ color: $input-group-addon-color;
+ text-align: center;
+ white-space: nowrap;
+ background-color: $input-group-addon-bg;
+ border: $input-border-width solid $input-group-addon-border-color;
+ @include border-radius($input-border-radius);
+}
+
+
+// Sizing
+//
+// Remix the default form control sizing classes into new ones for easier
+// manipulation.
+
+.input-group-lg > .form-control,
+.input-group-lg > .form-select,
+.input-group-lg > .input-group-text,
+.input-group-lg > .btn {
+ padding: $input-padding-y-lg $input-padding-x-lg;
+ @include font-size($input-font-size-lg);
+ @include border-radius($input-border-radius-lg);
+}
+
+.input-group-sm > .form-control,
+.input-group-sm > .form-select,
+.input-group-sm > .input-group-text,
+.input-group-sm > .btn {
+ padding: $input-padding-y-sm $input-padding-x-sm;
+ @include font-size($input-font-size-sm);
+ @include border-radius($input-border-radius-sm);
+}
+
+.input-group-lg > .form-select,
+.input-group-sm > .form-select {
+ padding-right: $form-select-padding-x + $form-select-indicator-padding;
+}
+
+
+// Rounded corners
+//
+// These rulesets must come after the sizing ones to properly override sm and lg
+// border-radius values when extending. They're more specific than we'd like
+// with the `.input-group >` part, but without it, we cannot override the sizing.
+
+// stylelint-disable-next-line no-duplicate-selectors
+.input-group {
+ &:not(.has-validation) {
+ > :not(:last-child):not(.dropdown-toggle):not(.dropdown-menu),
+ > .dropdown-toggle:nth-last-child(n + 3) {
+ @include border-end-radius(0);
+ }
+ }
+
+ &.has-validation {
+ > :nth-last-child(n + 3):not(.dropdown-toggle):not(.dropdown-menu),
+ > .dropdown-toggle:nth-last-child(n + 4) {
+ @include border-end-radius(0);
+ }
+ }
+
+ $validation-messages: "";
+ @each $state in map-keys($form-validation-states) {
+ $validation-messages: $validation-messages + ":not(." + unquote($state) + "-tooltip)" + ":not(." + unquote($state) + "-feedback)";
+ }
+
+ > :not(:first-child):not(.dropdown-menu)#{$validation-messages} {
+ margin-left: -$input-border-width;
+ @include border-start-radius(0);
+ }
+}
diff --git a/oioioi/base/static/bootstrap/stylesheets/forms/_labels.scss b/oioioi/base/static/bootstrap/stylesheets/forms/_labels.scss
new file mode 100644
index 000000000..39ecafcd2
--- /dev/null
+++ b/oioioi/base/static/bootstrap/stylesheets/forms/_labels.scss
@@ -0,0 +1,36 @@
+//
+// Labels
+//
+
+.form-label {
+ margin-bottom: $form-label-margin-bottom;
+ @include font-size($form-label-font-size);
+ font-style: $form-label-font-style;
+ font-weight: $form-label-font-weight;
+ color: $form-label-color;
+}
+
+// For use with horizontal and inline forms, when you need the label (or legend)
+// text to align with the form controls.
+.col-form-label {
+ padding-top: add($input-padding-y, $input-border-width);
+ padding-bottom: add($input-padding-y, $input-border-width);
+ margin-bottom: 0; // Override the `` default
+ @include font-size(inherit); // Override the `` default
+ font-style: $form-label-font-style;
+ font-weight: $form-label-font-weight;
+ line-height: $input-line-height;
+ color: $form-label-color;
+}
+
+.col-form-label-lg {
+ padding-top: add($input-padding-y-lg, $input-border-width);
+ padding-bottom: add($input-padding-y-lg, $input-border-width);
+ @include font-size($input-font-size-lg);
+}
+
+.col-form-label-sm {
+ padding-top: add($input-padding-y-sm, $input-border-width);
+ padding-bottom: add($input-padding-y-sm, $input-border-width);
+ @include font-size($input-font-size-sm);
+}
diff --git a/oioioi/base/static/bootstrap/stylesheets/forms/_validation.scss b/oioioi/base/static/bootstrap/stylesheets/forms/_validation.scss
new file mode 100644
index 000000000..c48123a71
--- /dev/null
+++ b/oioioi/base/static/bootstrap/stylesheets/forms/_validation.scss
@@ -0,0 +1,12 @@
+// Form validation
+//
+// Provide feedback to users when form field values are valid or invalid. Works
+// primarily for client-side validation via scoped `:invalid` and `:valid`
+// pseudo-classes but also includes `.is-invalid` and `.is-valid` classes for
+// server-side validation.
+
+// scss-docs-start form-validation-states-loop
+@each $state, $data in $form-validation-states {
+ @include form-validation-state($state, $data...);
+}
+// scss-docs-end form-validation-states-loop
diff --git a/oioioi/base/static/bootstrap/stylesheets/utilities/_clearfix.scss b/oioioi/base/static/bootstrap/stylesheets/helpers/_clearfix.scss
similarity index 100%
rename from oioioi/base/static/bootstrap/stylesheets/utilities/_clearfix.scss
rename to oioioi/base/static/bootstrap/stylesheets/helpers/_clearfix.scss
diff --git a/oioioi/base/static/bootstrap/stylesheets/helpers/_colored-links.scss b/oioioi/base/static/bootstrap/stylesheets/helpers/_colored-links.scss
new file mode 100644
index 000000000..8c167dedf
--- /dev/null
+++ b/oioioi/base/static/bootstrap/stylesheets/helpers/_colored-links.scss
@@ -0,0 +1,12 @@
+@each $color, $value in $theme-colors {
+ .link-#{$color} {
+ color: $value;
+
+ @if $link-shade-percentage != 0 {
+ &:hover,
+ &:focus {
+ color: if(color-contrast($value) == $color-contrast-light, shade-color($value, $link-shade-percentage), tint-color($value, $link-shade-percentage));
+ }
+ }
+ }
+}
diff --git a/oioioi/base/static/bootstrap/stylesheets/helpers/_position.scss b/oioioi/base/static/bootstrap/stylesheets/helpers/_position.scss
new file mode 100644
index 000000000..31851eb72
--- /dev/null
+++ b/oioioi/base/static/bootstrap/stylesheets/helpers/_position.scss
@@ -0,0 +1,30 @@
+// Shorthand
+
+.fixed-top {
+ position: fixed;
+ top: 0;
+ right: 0;
+ left: 0;
+ z-index: $zindex-fixed;
+}
+
+.fixed-bottom {
+ position: fixed;
+ right: 0;
+ bottom: 0;
+ left: 0;
+ z-index: $zindex-fixed;
+}
+
+// Responsive sticky top
+@each $breakpoint in map-keys($grid-breakpoints) {
+ @include media-breakpoint-up($breakpoint) {
+ $infix: breakpoint-infix($breakpoint, $grid-breakpoints);
+
+ .sticky#{$infix}-top {
+ position: sticky;
+ top: 0;
+ z-index: $zindex-sticky;
+ }
+ }
+}
diff --git a/oioioi/base/static/bootstrap/stylesheets/helpers/_ratio.scss b/oioioi/base/static/bootstrap/stylesheets/helpers/_ratio.scss
new file mode 100644
index 000000000..2390ee339
--- /dev/null
+++ b/oioioi/base/static/bootstrap/stylesheets/helpers/_ratio.scss
@@ -0,0 +1,26 @@
+// Credit: Nicolas Gallagher and SUIT CSS.
+
+.ratio {
+ position: relative;
+ width: 100%;
+
+ &::before {
+ display: block;
+ padding-top: var(--#{$variable-prefix}aspect-ratio);
+ content: "";
+ }
+
+ > * {
+ position: absolute;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+ }
+}
+
+@each $key, $ratio in $aspect-ratios {
+ .ratio-#{$key} {
+ --#{$variable-prefix}aspect-ratio: #{$ratio};
+ }
+}
diff --git a/oioioi/base/static/bootstrap/stylesheets/helpers/_stretched-link.scss b/oioioi/base/static/bootstrap/stylesheets/helpers/_stretched-link.scss
new file mode 100644
index 000000000..71a1c755a
--- /dev/null
+++ b/oioioi/base/static/bootstrap/stylesheets/helpers/_stretched-link.scss
@@ -0,0 +1,15 @@
+//
+// Stretched link
+//
+
+.stretched-link {
+ &::#{$stretched-link-pseudo-element} {
+ position: absolute;
+ top: 0;
+ right: 0;
+ bottom: 0;
+ left: 0;
+ z-index: $stretched-link-z-index;
+ content: "";
+ }
+}
diff --git a/oioioi/base/static/bootstrap/stylesheets/helpers/_text-truncation.scss b/oioioi/base/static/bootstrap/stylesheets/helpers/_text-truncation.scss
new file mode 100644
index 000000000..6421dac9a
--- /dev/null
+++ b/oioioi/base/static/bootstrap/stylesheets/helpers/_text-truncation.scss
@@ -0,0 +1,7 @@
+//
+// Text truncation
+//
+
+.text-truncate {
+ @include text-truncate();
+}
diff --git a/oioioi/base/static/bootstrap/stylesheets/helpers/_visually-hidden.scss b/oioioi/base/static/bootstrap/stylesheets/helpers/_visually-hidden.scss
new file mode 100644
index 000000000..4760ff03d
--- /dev/null
+++ b/oioioi/base/static/bootstrap/stylesheets/helpers/_visually-hidden.scss
@@ -0,0 +1,8 @@
+//
+// Visually hidden
+//
+
+.visually-hidden,
+.visually-hidden-focusable:not(:focus):not(:focus-within) {
+ @include visually-hidden();
+}
diff --git a/oioioi/base/static/bootstrap/stylesheets/mixins/_alert.scss b/oioioi/base/static/bootstrap/stylesheets/mixins/_alert.scss
index db5a7eb45..f3eb59511 100644
--- a/oioioi/base/static/bootstrap/stylesheets/mixins/_alert.scss
+++ b/oioioi/base/static/bootstrap/stylesheets/mixins/_alert.scss
@@ -1,13 +1,11 @@
+// scss-docs-start alert-variant-mixin
@mixin alert-variant($background, $border, $color) {
color: $color;
@include gradient-bg($background);
border-color: $border;
- hr {
- border-top-color: darken($border, 5%);
- }
-
.alert-link {
- color: darken($color, 10%);
+ color: shade-color($color, 20%);
}
}
+// scss-docs-end alert-variant-mixin
diff --git a/oioioi/base/static/bootstrap/stylesheets/mixins/_background-variant.scss b/oioioi/base/static/bootstrap/stylesheets/mixins/_background-variant.scss
deleted file mode 100644
index 80580189a..000000000
--- a/oioioi/base/static/bootstrap/stylesheets/mixins/_background-variant.scss
+++ /dev/null
@@ -1,23 +0,0 @@
-// stylelint-disable declaration-no-important
-
-// Contextual backgrounds
-
-@mixin bg-variant($parent, $color, $ignore-warning: false) {
- #{$parent} {
- background-color: $color !important;
- }
- a#{$parent},
- button#{$parent} {
- @include hover-focus() {
- background-color: darken($color, 10%) !important;
- }
- }
- @include deprecate("The `bg-variant` mixin", "v4.4.0", "v5", $ignore-warning);
-}
-
-@mixin bg-gradient-variant($parent, $color, $ignore-warning: false) {
- #{$parent} {
- background: $color linear-gradient(180deg, mix($body-bg, $color, 15%), $color) repeat-x !important;
- }
- @include deprecate("The `bg-gradient-variant` mixin", "v4.5.0", "v5", $ignore-warning);
-}
diff --git a/oioioi/base/static/bootstrap/stylesheets/mixins/_badge.scss b/oioioi/base/static/bootstrap/stylesheets/mixins/_badge.scss
deleted file mode 100644
index f1c499141..000000000
--- a/oioioi/base/static/bootstrap/stylesheets/mixins/_badge.scss
+++ /dev/null
@@ -1,17 +0,0 @@
-@mixin badge-variant($bg) {
- color: color-yiq($bg);
- background-color: $bg;
-
- @at-root a#{&} {
- @include hover-focus() {
- color: color-yiq($bg);
- background-color: darken($bg, 10%);
- }
-
- &:focus,
- &.focus {
- outline: 0;
- box-shadow: 0 0 0 $badge-focus-width rgba($bg, .5);
- }
- }
-}
diff --git a/oioioi/base/static/bootstrap/stylesheets/mixins/_border-radius.scss b/oioioi/base/static/bootstrap/stylesheets/mixins/_border-radius.scss
index 4fad91d67..616decbce 100644
--- a/oioioi/base/static/bootstrap/stylesheets/mixins/_border-radius.scss
+++ b/oioioi/base/static/bootstrap/stylesheets/mixins/_border-radius.scss
@@ -14,6 +14,7 @@
@return $return;
}
+// scss-docs-start border-radius-mixins
@mixin border-radius($radius: $border-radius, $fallback-border-radius: false) {
@if $enable-rounded {
border-radius: valid-radius($radius);
@@ -23,54 +24,55 @@
}
}
-@mixin border-top-radius($radius) {
+@mixin border-top-radius($radius: $border-radius) {
@if $enable-rounded {
border-top-left-radius: valid-radius($radius);
border-top-right-radius: valid-radius($radius);
}
}
-@mixin border-right-radius($radius) {
+@mixin border-end-radius($radius: $border-radius) {
@if $enable-rounded {
border-top-right-radius: valid-radius($radius);
border-bottom-right-radius: valid-radius($radius);
}
}
-@mixin border-bottom-radius($radius) {
+@mixin border-bottom-radius($radius: $border-radius) {
@if $enable-rounded {
border-bottom-right-radius: valid-radius($radius);
border-bottom-left-radius: valid-radius($radius);
}
}
-@mixin border-left-radius($radius) {
+@mixin border-start-radius($radius: $border-radius) {
@if $enable-rounded {
border-top-left-radius: valid-radius($radius);
border-bottom-left-radius: valid-radius($radius);
}
}
-@mixin border-top-left-radius($radius) {
+@mixin border-top-start-radius($radius: $border-radius) {
@if $enable-rounded {
border-top-left-radius: valid-radius($radius);
}
}
-@mixin border-top-right-radius($radius) {
+@mixin border-top-end-radius($radius: $border-radius) {
@if $enable-rounded {
border-top-right-radius: valid-radius($radius);
}
}
-@mixin border-bottom-right-radius($radius) {
+@mixin border-bottom-end-radius($radius: $border-radius) {
@if $enable-rounded {
border-bottom-right-radius: valid-radius($radius);
}
}
-@mixin border-bottom-left-radius($radius) {
+@mixin border-bottom-start-radius($radius: $border-radius) {
@if $enable-rounded {
border-bottom-left-radius: valid-radius($radius);
}
}
+// scss-docs-end border-radius-mixins
diff --git a/oioioi/base/static/bootstrap/stylesheets/mixins/_box-shadow.scss b/oioioi/base/static/bootstrap/stylesheets/mixins/_box-shadow.scss
index 0726d4359..4172541f3 100644
--- a/oioioi/base/static/bootstrap/stylesheets/mixins/_box-shadow.scss
+++ b/oioioi/base/static/bootstrap/stylesheets/mixins/_box-shadow.scss
@@ -2,17 +2,15 @@
@if $enable-shadows {
$result: ();
- @if (length($shadow) == 1) {
- // We can pass `@include box-shadow(none);`
- $result: $shadow;
- } @else {
- // Filter to avoid invalid properties for example `box-shadow: none, 1px 1px black;`
- @for $i from 1 through length($shadow) {
- @if nth($shadow, $i) != "none" {
- $result: append($result, nth($shadow, $i), "comma");
- }
+ @each $value in $shadow {
+ @if $value != null {
+ $result: append($result, $value, "comma");
+ }
+ @if $value == none and length($shadow) > 1 {
+ @warn "The keyword 'none' must be used as a single argument.";
}
}
+
@if (length($result) > 0) {
box-shadow: $result;
}
diff --git a/oioioi/base/static/bootstrap/stylesheets/mixins/_breakpoints.scss b/oioioi/base/static/bootstrap/stylesheets/mixins/_breakpoints.scss
index 23a5de96b..cdc8034eb 100644
--- a/oioioi/base/static/bootstrap/stylesheets/mixins/_breakpoints.scss
+++ b/oioioi/base/static/bootstrap/stylesheets/mixins/_breakpoints.scss
@@ -16,7 +16,10 @@
// md
@function breakpoint-next($name, $breakpoints: $grid-breakpoints, $breakpoint-names: map-keys($breakpoints)) {
$n: index($breakpoint-names, $name);
- @return if($n != null and $n < length($breakpoint-names), nth($breakpoint-names, $n + 1), null);
+ @if not $n {
+ @error "breakpoint `#{$name}` not found in `#{$breakpoints}`";
+ }
+ @return if($n < length($breakpoint-names), nth($breakpoint-names, $n + 1), null);
}
// Minimum breakpoint width. Null for the smallest (first) breakpoint.
@@ -28,18 +31,18 @@
@return if($min != 0, $min, null);
}
-// Maximum breakpoint width. Null for the largest (last) breakpoint.
-// The maximum value is calculated as the minimum of the next one less 0.02px
-// to work around the limitations of `min-` and `max-` prefixes and viewports with fractional widths.
+// Maximum breakpoint width.
+// The maximum value is reduced by 0.02px to work around the limitations of
+// `min-` and `max-` prefixes and viewports with fractional widths.
// See https://www.w3.org/TR/mediaqueries-4/#mq-min-max
// Uses 0.02px rather than 0.01px to work around a current rounding bug in Safari.
// See https://bugs.webkit.org/show_bug.cgi?id=178261
//
-// >> breakpoint-max(sm, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))
+// >> breakpoint-max(md, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))
// 767.98px
@function breakpoint-max($name, $breakpoints: $grid-breakpoints) {
- $next: breakpoint-next($name, $breakpoints);
- @return if($next, breakpoint-min($next, $breakpoints) - .02, null);
+ $max: map-get($breakpoints, $name);
+ @return if($max and $max > 0, $max - .02, null);
}
// Returns a blank string if smallest breakpoint, otherwise returns the name with a dash in front.
@@ -104,8 +107,9 @@
// No minimum for the smallest breakpoint, and no maximum for the largest one.
// Makes the @content apply only to the given breakpoint, not viewports any wider or narrower.
@mixin media-breakpoint-only($name, $breakpoints: $grid-breakpoints) {
- $min: breakpoint-min($name, $breakpoints);
- $max: breakpoint-max($name, $breakpoints);
+ $min: breakpoint-min($name, $breakpoints);
+ $next: breakpoint-next($name, $breakpoints);
+ $max: breakpoint-max($next);
@if $min != null and $max != null {
@media (min-width: $min) and (max-width: $max) {
@@ -116,7 +120,7 @@
@content;
}
} @else if $min == null {
- @include media-breakpoint-down($name, $breakpoints) {
+ @include media-breakpoint-down($next, $breakpoints) {
@content;
}
}
diff --git a/oioioi/base/static/bootstrap/stylesheets/mixins/_buttons.scss b/oioioi/base/static/bootstrap/stylesheets/mixins/_buttons.scss
index d6235aa27..b67499668 100644
--- a/oioioi/base/static/bootstrap/stylesheets/mixins/_buttons.scss
+++ b/oioioi/base/static/bootstrap/stylesheets/mixins/_buttons.scss
@@ -3,94 +3,110 @@
// Easily pump out default styles, as well as :hover, :focus, :active,
// and disabled options for all buttons
-@mixin button-variant($background, $border, $hover-background: darken($background, 7.5%), $hover-border: darken($border, 10%), $active-background: darken($background, 10%), $active-border: darken($border, 12.5%)) {
- color: color-yiq($background);
+// scss-docs-start btn-variant-mixin
+@mixin button-variant(
+ $background,
+ $border,
+ $color: color-contrast($background),
+ $hover-background: if($color == $color-contrast-light, shade-color($background, $btn-hover-bg-shade-amount), tint-color($background, $btn-hover-bg-tint-amount)),
+ $hover-border: if($color == $color-contrast-light, shade-color($border, $btn-hover-border-shade-amount), tint-color($border, $btn-hover-border-tint-amount)),
+ $hover-color: color-contrast($hover-background),
+ $active-background: if($color == $color-contrast-light, shade-color($background, $btn-active-bg-shade-amount), tint-color($background, $btn-active-bg-tint-amount)),
+ $active-border: if($color == $color-contrast-light, shade-color($border, $btn-active-border-shade-amount), tint-color($border, $btn-active-border-tint-amount)),
+ $active-color: color-contrast($active-background),
+ $disabled-background: $background,
+ $disabled-border: $border,
+ $disabled-color: color-contrast($disabled-background)
+) {
+ color: $color;
@include gradient-bg($background);
border-color: $border;
@include box-shadow($btn-box-shadow);
- @include hover() {
- color: color-yiq($hover-background);
+ &:hover {
+ color: $hover-color;
@include gradient-bg($hover-background);
border-color: $hover-border;
}
- &:focus,
- &.focus {
- color: color-yiq($hover-background);
+ .btn-check:focus + &,
+ &:focus {
+ color: $hover-color;
@include gradient-bg($hover-background);
border-color: $hover-border;
@if $enable-shadows {
- @include box-shadow($btn-box-shadow, 0 0 0 $btn-focus-width rgba(mix(color-yiq($background), $border, 15%), .5));
+ @include box-shadow($btn-box-shadow, 0 0 0 $btn-focus-width rgba(mix($color, $border, 15%), .5));
} @else {
// Avoid using mixin so we can pass custom focus shadow properly
- box-shadow: 0 0 0 $btn-focus-width rgba(mix(color-yiq($background), $border, 15%), .5);
- }
- }
-
- // Disabled comes first so active can properly restyle
- &.disabled,
- &:disabled {
- color: color-yiq($background);
- background-color: $background;
- border-color: $border;
- // Remove CSS gradients if they're enabled
- @if $enable-gradients {
- background-image: none;
+ box-shadow: 0 0 0 $btn-focus-width rgba(mix($color, $border, 15%), .5);
}
}
- &:not(:disabled):not(.disabled):active,
- &:not(:disabled):not(.disabled).active,
+ .btn-check:checked + &,
+ .btn-check:active + &,
+ &:active,
+ &.active,
.show > &.dropdown-toggle {
- color: color-yiq($active-background);
+ color: $active-color;
background-color: $active-background;
- @if $enable-gradients {
- background-image: none; // Remove the gradient for the pressed/active state
- }
+ // Remove CSS gradients if they're enabled
+ background-image: if($enable-gradients, none, null);
border-color: $active-border;
&:focus {
- @if $enable-shadows and $btn-active-box-shadow != none {
- @include box-shadow($btn-active-box-shadow, 0 0 0 $btn-focus-width rgba(mix(color-yiq($background), $border, 15%), .5));
+ @if $enable-shadows {
+ @include box-shadow($btn-active-box-shadow, 0 0 0 $btn-focus-width rgba(mix($color, $border, 15%), .5));
} @else {
// Avoid using mixin so we can pass custom focus shadow properly
- box-shadow: 0 0 0 $btn-focus-width rgba(mix(color-yiq($background), $border, 15%), .5);
+ box-shadow: 0 0 0 $btn-focus-width rgba(mix($color, $border, 15%), .5);
}
}
}
+
+ &:disabled,
+ &.disabled {
+ color: $disabled-color;
+ background-color: $disabled-background;
+ // Remove CSS gradients if they're enabled
+ background-image: if($enable-gradients, none, null);
+ border-color: $disabled-border;
+ }
}
+// scss-docs-end btn-variant-mixin
-@mixin button-outline-variant($color, $color-hover: color-yiq($color), $active-background: $color, $active-border: $color) {
+// scss-docs-start btn-outline-variant-mixin
+@mixin button-outline-variant(
+ $color,
+ $color-hover: color-contrast($color),
+ $active-background: $color,
+ $active-border: $color,
+ $active-color: color-contrast($active-background)
+) {
color: $color;
border-color: $color;
- @include hover() {
+ &:hover {
color: $color-hover;
background-color: $active-background;
border-color: $active-border;
}
- &:focus,
- &.focus {
+ .btn-check:focus + &,
+ &:focus {
box-shadow: 0 0 0 $btn-focus-width rgba($color, .5);
}
- &.disabled,
- &:disabled {
- color: $color;
- background-color: transparent;
- }
-
- &:not(:disabled):not(.disabled):active,
- &:not(:disabled):not(.disabled).active,
- .show > &.dropdown-toggle {
- color: color-yiq($active-background);
+ .btn-check:checked + &,
+ .btn-check:active + &,
+ &:active,
+ &.active,
+ &.dropdown-toggle.show {
+ color: $active-color;
background-color: $active-background;
border-color: $active-border;
&:focus {
- @if $enable-shadows and $btn-active-box-shadow != none {
+ @if $enable-shadows {
@include box-shadow($btn-active-box-shadow, 0 0 0 $btn-focus-width rgba($color, .5));
} @else {
// Avoid using mixin so we can pass custom focus shadow properly
@@ -98,13 +114,20 @@
}
}
}
+
+ &:disabled,
+ &.disabled {
+ color: $color;
+ background-color: transparent;
+ }
}
+// scss-docs-end btn-outline-variant-mixin
-// Button sizes
-@mixin button-size($padding-y, $padding-x, $font-size, $line-height, $border-radius) {
+// scss-docs-start btn-size-mixin
+@mixin button-size($padding-y, $padding-x, $font-size, $border-radius) {
padding: $padding-y $padding-x;
@include font-size($font-size);
- line-height: $line-height;
// Manually declare to provide an override to the browser default
@include border-radius($border-radius, 0);
}
+// scss-docs-end btn-size-mixin
diff --git a/oioioi/base/static/bootstrap/stylesheets/mixins/_caret.scss b/oioioi/base/static/bootstrap/stylesheets/mixins/_caret.scss
index 27466495b..4b0f0360b 100644
--- a/oioioi/base/static/bootstrap/stylesheets/mixins/_caret.scss
+++ b/oioioi/base/static/bootstrap/stylesheets/mixins/_caret.scss
@@ -1,25 +1,26 @@
-@mixin caret-down() {
+// scss-docs-start caret-mixins
+@mixin caret-down {
border-top: $caret-width solid;
border-right: $caret-width solid transparent;
border-bottom: 0;
border-left: $caret-width solid transparent;
}
-@mixin caret-up() {
+@mixin caret-up {
border-top: 0;
border-right: $caret-width solid transparent;
border-bottom: $caret-width solid;
border-left: $caret-width solid transparent;
}
-@mixin caret-right() {
+@mixin caret-end {
border-top: $caret-width solid transparent;
border-right: 0;
border-bottom: $caret-width solid transparent;
border-left: $caret-width solid;
}
-@mixin caret-left() {
+@mixin caret-start {
border-top: $caret-width solid transparent;
border-right: $caret-width solid;
border-bottom: $caret-width solid transparent;
@@ -36,12 +37,12 @@
@include caret-down();
} @else if $direction == up {
@include caret-up();
- } @else if $direction == right {
- @include caret-right();
+ } @else if $direction == end {
+ @include caret-end();
}
}
- @if $direction == left {
+ @if $direction == start {
&::after {
display: none;
}
@@ -51,7 +52,7 @@
margin-right: $caret-spacing;
vertical-align: $caret-vertical-align;
content: "";
- @include caret-left();
+ @include caret-start();
}
}
@@ -60,3 +61,4 @@
}
}
}
+// scss-docs-end caret-mixins
diff --git a/oioioi/base/static/bootstrap/stylesheets/mixins/_clearfix.scss b/oioioi/base/static/bootstrap/stylesheets/mixins/_clearfix.scss
index 11a977b73..ffc62bb28 100644
--- a/oioioi/base/static/bootstrap/stylesheets/mixins/_clearfix.scss
+++ b/oioioi/base/static/bootstrap/stylesheets/mixins/_clearfix.scss
@@ -1,3 +1,4 @@
+// scss-docs-start clearfix
@mixin clearfix() {
&::after {
display: block;
@@ -5,3 +6,4 @@
content: "";
}
}
+// scss-docs-end clearfix
diff --git a/oioioi/base/static/bootstrap/stylesheets/mixins/_color-scheme.scss b/oioioi/base/static/bootstrap/stylesheets/mixins/_color-scheme.scss
new file mode 100644
index 000000000..90497aa0a
--- /dev/null
+++ b/oioioi/base/static/bootstrap/stylesheets/mixins/_color-scheme.scss
@@ -0,0 +1,7 @@
+// scss-docs-start mixin-color-scheme
+@mixin color-scheme($name) {
+ @media (prefers-color-scheme: #{$name}) {
+ @content;
+ }
+}
+// scss-docs-end mixin-color-scheme
diff --git a/oioioi/base/static/bootstrap/stylesheets/mixins/_container.scss b/oioioi/base/static/bootstrap/stylesheets/mixins/_container.scss
new file mode 100644
index 000000000..ee6044d0d
--- /dev/null
+++ b/oioioi/base/static/bootstrap/stylesheets/mixins/_container.scss
@@ -0,0 +1,9 @@
+// Container mixins
+
+@mixin make-container($gutter: $container-padding-x) {
+ width: 100%;
+ padding-right: var(--#{$variable-prefix}gutter-x, #{$gutter});
+ padding-left: var(--#{$variable-prefix}gutter-x, #{$gutter});
+ margin-right: auto;
+ margin-left: auto;
+}
diff --git a/oioioi/base/static/bootstrap/stylesheets/mixins/_float.scss b/oioioi/base/static/bootstrap/stylesheets/mixins/_float.scss
deleted file mode 100644
index 6b376a258..000000000
--- a/oioioi/base/static/bootstrap/stylesheets/mixins/_float.scss
+++ /dev/null
@@ -1,14 +0,0 @@
-// stylelint-disable declaration-no-important
-
-@mixin float-left() {
- float: left !important;
- @include deprecate("The `float-left` mixin", "v4.3.0", "v5");
-}
-@mixin float-right() {
- float: right !important;
- @include deprecate("The `float-right` mixin", "v4.3.0", "v5");
-}
-@mixin float-none() {
- float: none !important;
- @include deprecate("The `float-none` mixin", "v4.3.0", "v5");
-}
diff --git a/oioioi/base/static/bootstrap/stylesheets/mixins/_forms.scss b/oioioi/base/static/bootstrap/stylesheets/mixins/_forms.scss
index b8847cc80..dc5bdb0b9 100644
--- a/oioioi/base/static/bootstrap/stylesheets/mixins/_forms.scss
+++ b/oioioi/base/static/bootstrap/stylesheets/mixins/_forms.scss
@@ -1,33 +1,7 @@
-// Form control focus state
-//
-// Generate a customized focus state and for any input with the specified color,
-// which defaults to the `$input-focus-border-color` variable.
-//
-// We highly encourage you to not customize the default value, but instead use
-// this to tweak colors on an as-needed basis. This aesthetic change is based on
-// WebKit's default styles, but applicable to a wider range of browsers. Its
-// usability and accessibility should be taken into account with any change.
-//
-// Example usage: change the default blue border and shadow to white for better
-// contrast against a dark gray background.
-@mixin form-control-focus($ignore-warning: false) {
- &:focus {
- color: $input-focus-color;
- background-color: $input-focus-bg;
- border-color: $input-focus-border-color;
- outline: 0;
- @if $enable-shadows {
- @include box-shadow($input-box-shadow, $input-focus-box-shadow);
- } @else {
- // Avoid using mixin so we can pass custom focus shadow properly
- box-shadow: $input-focus-box-shadow;
- }
- }
- @include deprecate("The `form-control-focus()` mixin", "v4.4.0", "v5", $ignore-warning);
-}
-
// This mixin uses an `if()` technique to be compatible with Dart Sass
// See https://github.com/sass/sass/issues/1873#issuecomment-152293725 for more details
+
+// scss-docs-start form-validation-mixins
@mixin form-validation-state-selector($state) {
@if ($state == "valid" or $state == "invalid") {
.was-validated #{if(&, "&", "")}:#{$state},
@@ -41,19 +15,26 @@
}
}
-@mixin form-validation-state($state, $color, $icon) {
+@mixin form-validation-state(
+ $state,
+ $color,
+ $icon,
+ $tooltip-color: color-contrast($color),
+ $tooltip-bg-color: rgba($color, $form-feedback-tooltip-opacity),
+ $focus-box-shadow: 0 0 $input-btn-focus-blur $input-focus-width rgba($color, $input-btn-focus-color-opacity)
+) {
.#{$state}-feedback {
display: none;
width: 100%;
margin-top: $form-feedback-margin-top;
@include font-size($form-feedback-font-size);
+ font-style: $form-feedback-font-style;
color: $color;
}
.#{$state}-tooltip {
position: absolute;
top: 100%;
- left: 0;
z-index: 5;
display: none;
max-width: 100%; // Contain to parent when possible
@@ -61,16 +42,9 @@
margin-top: .1rem;
@include font-size($form-feedback-tooltip-font-size);
line-height: $form-feedback-tooltip-line-height;
- color: color-yiq($color);
- background-color: rgba($color, $form-feedback-tooltip-opacity);
+ color: $tooltip-color;
+ background-color: $tooltip-bg-color;
@include border-radius($form-feedback-tooltip-border-radius);
-
- // See https://github.com/twbs/bootstrap/pull/31557
- // Align tooltip to form elements
- .form-row > .col > &,
- .form-row > [class*="col-"] > & {
- left: $form-grid-gutter-width * .5;
- }
}
@include form-validation-state-selector($state) {
@@ -85,7 +59,7 @@
border-color: $color;
@if $enable-validation-icons {
- padding-right: $input-height-inner !important; // stylelint-disable-line declaration-no-important
+ padding-right: $input-height-inner;
background-image: escape-svg($icon);
background-repeat: no-repeat;
background-position: right $input-height-inner-quarter center;
@@ -94,17 +68,7 @@
&:focus {
border-color: $color;
- box-shadow: 0 0 0 $input-focus-width rgba($color, .25);
- }
- }
- }
-
- // stylelint-disable-next-line selector-no-qualifying-type
- select.form-control {
- @include form-validation-state-selector($state) {
- @if $enable-validation-icons {
- padding-right: $input-padding-x * 4 !important; // stylelint-disable-line declaration-no-important
- background-position: right $input-padding-x * 2 center;
+ box-shadow: $focus-box-shadow;
}
}
}
@@ -119,77 +83,62 @@
}
}
- .custom-select {
+ .form-select {
@include form-validation-state-selector($state) {
border-color: $color;
@if $enable-validation-icons {
- padding-right: $custom-select-feedback-icon-padding-right !important; // stylelint-disable-line declaration-no-important
- background: $custom-select-background, $custom-select-bg escape-svg($icon) $custom-select-feedback-icon-position / $custom-select-feedback-icon-size no-repeat;
+ &:not([multiple]):not([size]),
+ &:not([multiple])[size="1"] {
+ padding-right: $form-select-feedback-icon-padding-end;
+ background-image: escape-svg($form-select-indicator), escape-svg($icon);
+ background-position: $form-select-bg-position, $form-select-feedback-icon-position;
+ background-size: $form-select-bg-size, $form-select-feedback-icon-size;
+ }
}
&:focus {
border-color: $color;
- box-shadow: 0 0 0 $input-focus-width rgba($color, .25);
+ box-shadow: $focus-box-shadow;
}
}
}
.form-check-input {
@include form-validation-state-selector($state) {
- ~ .form-check-label {
- color: $color;
- }
-
- ~ .#{$state}-feedback,
- ~ .#{$state}-tooltip {
- display: block;
- }
- }
- }
-
- .custom-control-input {
- @include form-validation-state-selector($state) {
- ~ .custom-control-label {
- color: $color;
-
- &::before {
- border-color: $color;
- }
- }
+ border-color: $color;
&:checked {
- ~ .custom-control-label::before {
- border-color: lighten($color, 10%);
- @include gradient-bg(lighten($color, 10%));
- }
+ background-color: $color;
}
&:focus {
- ~ .custom-control-label::before {
- box-shadow: 0 0 0 $input-focus-width rgba($color, .25);
- }
+ box-shadow: $focus-box-shadow;
+ }
- &:not(:checked) ~ .custom-control-label::before {
- border-color: $color;
- }
+ ~ .form-check-label {
+ color: $color;
}
}
}
+ .form-check-inline .form-check-input {
+ ~ .#{$state}-feedback {
+ margin-left: .5em;
+ }
+ }
- // custom file
- .custom-file-input {
+ .input-group .form-control,
+ .input-group .form-select {
@include form-validation-state-selector($state) {
- ~ .custom-file-label {
- border-color: $color;
+ @if $state == "valid" {
+ z-index: 1;
+ } @else if $state == "invalid" {
+ z-index: 2;
}
-
&:focus {
- ~ .custom-file-label {
- border-color: $color;
- box-shadow: 0 0 0 $input-focus-width rgba($color, .25);
- }
+ z-index: 3;
}
}
}
}
+// scss-docs-end form-validation-mixins
diff --git a/oioioi/base/static/bootstrap/stylesheets/mixins/_gradients.scss b/oioioi/base/static/bootstrap/stylesheets/mixins/_gradients.scss
index 88c4d64b7..44167d1b8 100644
--- a/oioioi/base/static/bootstrap/stylesheets/mixins/_gradients.scss
+++ b/oioioi/base/static/bootstrap/stylesheets/mixins/_gradients.scss
@@ -1,45 +1,47 @@
// Gradients
-@mixin gradient-bg($color) {
+// scss-docs-start gradient-bg-mixin
+@mixin gradient-bg($color: null) {
+ background-color: $color;
+
@if $enable-gradients {
- background: $color linear-gradient(180deg, mix($body-bg, $color, 15%), $color) repeat-x;
- } @else {
- background-color: $color;
+ background-image: var(--#{$variable-prefix}gradient);
}
}
+// scss-docs-end gradient-bg-mixin
+// scss-docs-start gradient-mixins
// Horizontal gradient, from left to right
//
// Creates two color stops, start and end, by specifying a color and position for each color stop.
@mixin gradient-x($start-color: $gray-700, $end-color: $gray-800, $start-percent: 0%, $end-percent: 100%) {
background-image: linear-gradient(to right, $start-color $start-percent, $end-color $end-percent);
- background-repeat: repeat-x;
}
// Vertical gradient, from top to bottom
//
// Creates two color stops, start and end, by specifying a color and position for each color stop.
-@mixin gradient-y($start-color: $gray-700, $end-color: $gray-800, $start-percent: 0%, $end-percent: 100%) {
+@mixin gradient-y($start-color: $gray-700, $end-color: $gray-800, $start-percent: null, $end-percent: null) {
background-image: linear-gradient(to bottom, $start-color $start-percent, $end-color $end-percent);
- background-repeat: repeat-x;
}
@mixin gradient-directional($start-color: $gray-700, $end-color: $gray-800, $deg: 45deg) {
background-image: linear-gradient($deg, $start-color, $end-color);
- background-repeat: repeat-x;
}
+
@mixin gradient-x-three-colors($start-color: $blue, $mid-color: $purple, $color-stop: 50%, $end-color: $red) {
background-image: linear-gradient(to right, $start-color, $mid-color $color-stop, $end-color);
- background-repeat: no-repeat;
}
+
@mixin gradient-y-three-colors($start-color: $blue, $mid-color: $purple, $color-stop: 50%, $end-color: $red) {
background-image: linear-gradient($start-color, $mid-color $color-stop, $end-color);
- background-repeat: no-repeat;
}
+
@mixin gradient-radial($inner-color: $gray-700, $outer-color: $gray-800) {
background-image: radial-gradient(circle, $inner-color, $outer-color);
- background-repeat: no-repeat;
}
+
@mixin gradient-striped($color: rgba($white, .15), $angle: 45deg) {
background-image: linear-gradient($angle, $color 25%, transparent 25%, transparent 50%, $color 50%, $color 75%, transparent 75%, transparent);
}
+// scss-docs-end gradient-mixins
diff --git a/oioioi/base/static/bootstrap/stylesheets/mixins/_grid-framework.scss b/oioioi/base/static/bootstrap/stylesheets/mixins/_grid-framework.scss
deleted file mode 100644
index ef3291753..000000000
--- a/oioioi/base/static/bootstrap/stylesheets/mixins/_grid-framework.scss
+++ /dev/null
@@ -1,80 +0,0 @@
-// Framework grid generation
-//
-// Used only by Bootstrap to generate the correct number of grid classes given
-// any value of `$grid-columns`.
-
-@mixin make-grid-columns($columns: $grid-columns, $gutter: $grid-gutter-width, $breakpoints: $grid-breakpoints) {
- // Common properties for all breakpoints
- %grid-column {
- position: relative;
- width: 100%;
- padding-right: $gutter * .5;
- padding-left: $gutter * .5;
- }
-
- @each $breakpoint in map-keys($breakpoints) {
- $infix: breakpoint-infix($breakpoint, $breakpoints);
-
- @if $columns > 0 {
- // Allow columns to stretch full width below their breakpoints
- @for $i from 1 through $columns {
- .col#{$infix}-#{$i} {
- @extend %grid-column;
- }
- }
- }
-
- .col#{$infix},
- .col#{$infix}-auto {
- @extend %grid-column;
- }
-
- @include media-breakpoint-up($breakpoint, $breakpoints) {
- // Provide basic `.col-{bp}` classes for equal-width flexbox columns
- .col#{$infix} {
- flex-basis: 0;
- flex-grow: 1;
- max-width: 100%;
- }
-
- @if $grid-row-columns > 0 {
- @for $i from 1 through $grid-row-columns {
- .row-cols#{$infix}-#{$i} {
- @include row-cols($i);
- }
- }
- }
-
- .col#{$infix}-auto {
- @include make-col-auto();
- }
-
- @if $columns > 0 {
- @for $i from 1 through $columns {
- .col#{$infix}-#{$i} {
- @include make-col($i, $columns);
- }
- }
- }
-
- .order#{$infix}-first { order: -1; }
-
- .order#{$infix}-last { order: $columns + 1; }
-
- @for $i from 0 through $columns {
- .order#{$infix}-#{$i} { order: $i; }
- }
-
- @if $columns > 0 {
- // `$columns - 1` because offsetting by the width of an entire row isn't possible
- @for $i from 0 through ($columns - 1) {
- @if not ($infix == "" and $i == 0) { // Avoid emitting useless .offset-0
- .offset#{$infix}-#{$i} {
- @include make-col-offset($i, $columns);
- }
- }
- }
- }
- }
- }
-}
diff --git a/oioioi/base/static/bootstrap/stylesheets/mixins/_grid.scss b/oioioi/base/static/bootstrap/stylesheets/mixins/_grid.scss
index 0eb09910d..ff6941c46 100644
--- a/oioioi/base/static/bootstrap/stylesheets/mixins/_grid.scss
+++ b/oioioi/base/static/bootstrap/stylesheets/mixins/_grid.scss
@@ -1,54 +1,45 @@
-/// Grid system
+// Grid system
//
// Generate semantic grid columns with these mixins.
-@mixin make-container($gutter: $grid-gutter-width) {
- width: 100%;
- padding-right: $gutter * .5;
- padding-left: $gutter * .5;
- margin-right: auto;
- margin-left: auto;
-}
-
@mixin make-row($gutter: $grid-gutter-width) {
+ --#{$variable-prefix}gutter-x: #{$gutter};
+ --#{$variable-prefix}gutter-y: 0;
display: flex;
flex-wrap: wrap;
- margin-right: -$gutter * .5;
- margin-left: -$gutter * .5;
-}
-
-// For each breakpoint, define the maximum width of the container in a media query
-@mixin make-container-max-widths($max-widths: $container-max-widths, $breakpoints: $grid-breakpoints) {
- @each $breakpoint, $container-max-width in $max-widths {
- @include media-breakpoint-up($breakpoint, $breakpoints) {
- max-width: $container-max-width;
- }
- }
- @include deprecate("The `make-container-max-widths` mixin", "v4.5.2", "v5");
+ margin-top: calc(var(--#{$variable-prefix}gutter-y) * -1); // stylelint-disable-line function-disallowed-list
+ margin-right: calc(var(--#{$variable-prefix}gutter-x) * -.5); // stylelint-disable-line function-disallowed-list
+ margin-left: calc(var(--#{$variable-prefix}gutter-x) * -.5); // stylelint-disable-line function-disallowed-list
}
@mixin make-col-ready($gutter: $grid-gutter-width) {
- position: relative;
+ // Add box sizing if only the grid is loaded
+ box-sizing: if(variable-exists(include-column-box-sizing) and $include-column-box-sizing, border-box, null);
// Prevent columns from becoming too narrow when at smaller grid tiers by
- // always setting `width: 100%;`. This works because we use `flex` values
+ // always setting `width: 100%;`. This works because we set the width
// later on to override this initial width.
+ flex-shrink: 0;
width: 100%;
- padding-right: $gutter * .5;
- padding-left: $gutter * .5;
+ max-width: 100%; // Prevent `.col-auto`, `.col` (& responsive variants) from breaking out the grid
+ padding-right: calc(var(--#{$variable-prefix}gutter-x) * .5); // stylelint-disable-line function-disallowed-list
+ padding-left: calc(var(--#{$variable-prefix}gutter-x) * .5); // stylelint-disable-line function-disallowed-list
+ margin-top: var(--#{$variable-prefix}gutter-y);
}
-@mixin make-col($size, $columns: $grid-columns) {
- flex: 0 0 percentage(divide($size, $columns));
- // Add a `max-width` to ensure content within each column does not blow out
- // the width of the column. Applies to IE10+ and Firefox. Chrome and Safari
- // do not appear to require this.
- max-width: percentage(divide($size, $columns));
+@mixin make-col($size: false, $columns: $grid-columns) {
+ @if $size {
+ flex: 0 0 auto;
+ width: percentage(divide($size, $columns));
+
+ } @else {
+ flex: 1 1 0;
+ max-width: 100%;
+ }
}
@mixin make-col-auto() {
flex: 0 0 auto;
width: auto;
- max-width: 100%; // Reset earlier grid tiers
}
@mixin make-col-offset($size, $columns: $grid-columns) {
@@ -63,7 +54,79 @@
// style grid.
@mixin row-cols($count) {
> * {
- flex: 0 0 divide(100%, $count);
- max-width: divide(100%, $count);
+ flex: 0 0 auto;
+ width: divide(100%, $count);
+ }
+}
+
+// Framework grid generation
+//
+// Used only by Bootstrap to generate the correct number of grid classes given
+// any value of `$grid-columns`.
+
+@mixin make-grid-columns($columns: $grid-columns, $gutter: $grid-gutter-width, $breakpoints: $grid-breakpoints) {
+ @each $breakpoint in map-keys($breakpoints) {
+ // .row-cols defaults must all appear before .col overrides so they can be overridden.
+ $infix: breakpoint-infix($breakpoint, $breakpoints);
+ @include media-breakpoint-up($breakpoint, $breakpoints) {
+ // Provide basic `.col-{bp}` classes for equal-width flexbox columns
+ .col#{$infix} {
+ flex: 1 0 0%; // Flexbugs #4: https://github.com/philipwalton/flexbugs#flexbug-4
+ }
+
+ .row-cols#{$infix}-auto > * {
+ @include make-col-auto();
+ }
+
+ @if $grid-row-columns > 0 {
+ @for $i from 1 through $grid-row-columns {
+ .row-cols#{$infix}-#{$i} {
+ @include row-cols($i);
+ }
+ }
+ }
+ }
+ }
+
+ @each $breakpoint in map-keys($breakpoints) {
+ $infix: breakpoint-infix($breakpoint, $breakpoints);
+
+ @include media-breakpoint-up($breakpoint, $breakpoints) {
+ .col#{$infix}-auto {
+ @include make-col-auto();
+ }
+
+ @if $columns > 0 {
+ @for $i from 1 through $columns {
+ .col#{$infix}-#{$i} {
+ @include make-col($i, $columns);
+ }
+ }
+
+ // `$columns - 1` because offsetting by the width of an entire row isn't possible
+ @for $i from 0 through ($columns - 1) {
+ @if not ($infix == "" and $i == 0) { // Avoid emitting useless .offset-0
+ .offset#{$infix}-#{$i} {
+ @include make-col-offset($i, $columns);
+ }
+ }
+ }
+ }
+
+ // Gutters
+ //
+ // Make use of `.g-*`, `.gx-*` or `.gy-*` utilities to change spacing between the columns.
+ @each $key, $value in $gutters {
+ .g#{$infix}-#{$key},
+ .gx#{$infix}-#{$key} {
+ --#{$variable-prefix}gutter-x: #{$value};
+ }
+
+ .g#{$infix}-#{$key},
+ .gy#{$infix}-#{$key} {
+ --#{$variable-prefix}gutter-y: #{$value};
+ }
+ }
+ }
}
}
diff --git a/oioioi/base/static/bootstrap/stylesheets/mixins/_hover.scss b/oioioi/base/static/bootstrap/stylesheets/mixins/_hover.scss
deleted file mode 100644
index 409f8244e..000000000
--- a/oioioi/base/static/bootstrap/stylesheets/mixins/_hover.scss
+++ /dev/null
@@ -1,37 +0,0 @@
-// Hover mixin and `$enable-hover-media-query` are deprecated.
-//
-// Originally added during our alphas and maintained during betas, this mixin was
-// designed to prevent `:hover` stickiness on iOS-an issue where hover styles
-// would persist after initial touch.
-//
-// For backward compatibility, we've kept these mixins and updated them to
-// always return their regular pseudo-classes instead of a shimmed media query.
-//
-// Issue: https://github.com/twbs/bootstrap/issues/25195
-
-@mixin hover() {
- &:hover { @content; }
-}
-
-@mixin hover-focus() {
- &:hover,
- &:focus {
- @content;
- }
-}
-
-@mixin plain-hover-focus() {
- &,
- &:hover,
- &:focus {
- @content;
- }
-}
-
-@mixin hover-focus-active() {
- &:hover,
- &:focus,
- &:active {
- @content;
- }
-}
diff --git a/oioioi/base/static/bootstrap/stylesheets/mixins/_image.scss b/oioioi/base/static/bootstrap/stylesheets/mixins/_image.scss
index 3aaa0d704..e1df779f8 100644
--- a/oioioi/base/static/bootstrap/stylesheets/mixins/_image.scss
+++ b/oioioi/base/static/bootstrap/stylesheets/mixins/_image.scss
@@ -7,30 +7,10 @@
//
// Keep images from scaling beyond the width of their parents.
-@mixin img-fluid() {
+@mixin img-fluid {
// Part 1: Set a maximum relative to the parent
max-width: 100%;
// Part 2: Override the height to auto, otherwise images will be stretched
// when setting a width and height attribute on the img element.
height: auto;
}
-
-
-// Retina image
-//
-// Short retina mixin for setting background-image and -size.
-
-@mixin img-retina($file-1x, $file-2x, $width-1x, $height-1x) {
- background-image: url($file-1x);
-
- // Autoprefixer takes care of adding -webkit-min-device-pixel-ratio and -o-min-device-pixel-ratio,
- // but doesn't convert dppx=>dpi.
- // There's no such thing as unprefixed min-device-pixel-ratio since it's nonstandard.
- // Compatibility info: https://caniuse.com/css-media-resolution
- @media only screen and (min-resolution: 192dpi), // IE9-11 don't support dppx
- only screen and (min-resolution: 2dppx) { // Standardized
- background-image: url($file-2x);
- background-size: $width-1x $height-1x;
- }
- @include deprecate("`img-retina()`", "v4.3.0", "v5");
-}
diff --git a/oioioi/base/static/bootstrap/stylesheets/mixins/_list-group.scss b/oioioi/base/static/bootstrap/stylesheets/mixins/_list-group.scss
index 0da353156..e55415f2b 100644
--- a/oioioi/base/static/bootstrap/stylesheets/mixins/_list-group.scss
+++ b/oioioi/base/static/bootstrap/stylesheets/mixins/_list-group.scss
@@ -1,14 +1,16 @@
// List Groups
+// scss-docs-start list-group-mixin
@mixin list-group-item-variant($state, $background, $color) {
.list-group-item-#{$state} {
color: $color;
background-color: $background;
&.list-group-item-action {
- @include hover-focus() {
+ &:hover,
+ &:focus {
color: $color;
- background-color: darken($background, 5%);
+ background-color: shade-color($background, 10%);
}
&.active {
@@ -19,3 +21,4 @@
}
}
}
+// scss-docs-end list-group-mixin
diff --git a/oioioi/base/static/bootstrap/stylesheets/mixins/_lists.scss b/oioioi/base/static/bootstrap/stylesheets/mixins/_lists.scss
index 251cb0733..251856266 100644
--- a/oioioi/base/static/bootstrap/stylesheets/mixins/_lists.scss
+++ b/oioioi/base/static/bootstrap/stylesheets/mixins/_lists.scss
@@ -1,7 +1,7 @@
// Lists
// Unstyled keeps list items block level, just removes default browser padding and list-style
-@mixin list-unstyled() {
+@mixin list-unstyled {
padding-left: 0;
list-style: none;
}
diff --git a/oioioi/base/static/bootstrap/stylesheets/mixins/_nav-divider.scss b/oioioi/base/static/bootstrap/stylesheets/mixins/_nav-divider.scss
deleted file mode 100644
index 3e0cceafe..000000000
--- a/oioioi/base/static/bootstrap/stylesheets/mixins/_nav-divider.scss
+++ /dev/null
@@ -1,11 +0,0 @@
-// Horizontal dividers
-//
-// Dividers (basically an hr) within dropdowns and nav lists
-
-@mixin nav-divider($color: $nav-divider-color, $margin-y: $nav-divider-margin-y, $ignore-warning: false) {
- height: 0;
- margin: $margin-y 0;
- overflow: hidden;
- border-top: 1px solid $color;
- @include deprecate("The `nav-divider()` mixin", "v4.4.0", "v5", $ignore-warning);
-}
diff --git a/oioioi/base/static/bootstrap/stylesheets/mixins/_pagination.scss b/oioioi/base/static/bootstrap/stylesheets/mixins/_pagination.scss
index af8e16d6a..3101b380d 100644
--- a/oioioi/base/static/bootstrap/stylesheets/mixins/_pagination.scss
+++ b/oioioi/base/static/bootstrap/stylesheets/mixins/_pagination.scss
@@ -1,22 +1,31 @@
// Pagination
-@mixin pagination-size($padding-y, $padding-x, $font-size, $line-height, $border-radius) {
+// scss-docs-start pagination-mixin
+@mixin pagination-size($padding-y, $padding-x, $font-size, $border-radius) {
.page-link {
padding: $padding-y $padding-x;
@include font-size($font-size);
- line-height: $line-height;
}
.page-item {
- &:first-child {
- .page-link {
- @include border-left-radius($border-radius);
+ @if $pagination-margin-start == (-$pagination-border-width) {
+ &:first-child {
+ .page-link {
+ @include border-start-radius($border-radius);
+ }
}
- }
- &:last-child {
+
+ &:last-child {
+ .page-link {
+ @include border-end-radius($border-radius);
+ }
+ }
+ } @else {
+ //Add border-radius to all pageLinks in case they have left margin
.page-link {
- @include border-right-radius($border-radius);
+ @include border-radius($border-radius);
}
}
}
}
+// scss-docs-end pagination-mixin
diff --git a/oioioi/base/static/bootstrap/stylesheets/mixins/_reset-text.scss b/oioioi/base/static/bootstrap/stylesheets/mixins/_reset-text.scss
index 15b4407a0..354f5648b 100644
--- a/oioioi/base/static/bootstrap/stylesheets/mixins/_reset-text.scss
+++ b/oioioi/base/static/bootstrap/stylesheets/mixins/_reset-text.scss
@@ -1,6 +1,6 @@
-@mixin reset-text() {
+@mixin reset-text {
font-family: $font-family-base;
- // We deliberately do NOT reset font-size or word-wrap.
+ // We deliberately do NOT reset font-size or overflow-wrap / word-wrap.
font-style: normal;
font-weight: $font-weight-normal;
line-height: $line-height-base;
diff --git a/oioioi/base/static/bootstrap/stylesheets/mixins/_screen-reader.scss b/oioioi/base/static/bootstrap/stylesheets/mixins/_screen-reader.scss
deleted file mode 100644
index 70b677e3f..000000000
--- a/oioioi/base/static/bootstrap/stylesheets/mixins/_screen-reader.scss
+++ /dev/null
@@ -1,34 +0,0 @@
-// Only display content to screen readers
-//
-// See: https://www.a11yproject.com/posts/2013-01-11-how-to-hide-content/
-// See: https://kittygiraudel.com/2016/10/13/css-hide-and-seek/
-
-@mixin sr-only() {
- position: absolute;
- width: 1px;
- height: 1px;
- padding: 0;
- margin: -1px; // Fix for https://github.com/twbs/bootstrap/issues/25686
- overflow: hidden;
- clip: rect(0, 0, 0, 0);
- white-space: nowrap;
- border: 0;
-}
-
-// Use in conjunction with .sr-only to only display content when it's focused.
-//
-// Useful for "Skip to main content" links; see https://www.w3.org/TR/2013/NOTE-WCAG20-TECHS-20130905/G1
-//
-// Credit: HTML5 Boilerplate
-
-@mixin sr-only-focusable() {
- &:active,
- &:focus {
- position: static;
- width: auto;
- height: auto;
- overflow: visible;
- clip: auto;
- white-space: normal;
- }
-}
diff --git a/oioioi/base/static/bootstrap/stylesheets/mixins/_size.scss b/oioioi/base/static/bootstrap/stylesheets/mixins/_size.scss
deleted file mode 100644
index 69e056d2c..000000000
--- a/oioioi/base/static/bootstrap/stylesheets/mixins/_size.scss
+++ /dev/null
@@ -1,7 +0,0 @@
-// Sizing shortcuts
-
-@mixin size($width, $height: $width) {
- width: $width;
- height: $height;
- @include deprecate("`size()`", "v4.3.0", "v5");
-}
diff --git a/oioioi/base/static/bootstrap/stylesheets/mixins/_table-row.scss b/oioioi/base/static/bootstrap/stylesheets/mixins/_table-row.scss
deleted file mode 100644
index 1ccde6b6c..000000000
--- a/oioioi/base/static/bootstrap/stylesheets/mixins/_table-row.scss
+++ /dev/null
@@ -1,39 +0,0 @@
-// Tables
-
-@mixin table-row-variant($state, $background, $border: null) {
- // Exact selectors below required to override `.table-striped` and prevent
- // inheritance to nested tables.
- .table-#{$state} {
- &,
- > th,
- > td {
- background-color: $background;
- }
-
- @if $border != null {
- th,
- td,
- thead th,
- tbody + tbody {
- border-color: $border;
- }
- }
- }
-
- // Hover states for `.table-hover`
- // Note: this is not available for cells or rows within `thead` or `tfoot`.
- .table-hover {
- $hover-background: darken($background, 5%);
-
- .table-#{$state} {
- @include hover() {
- background-color: $hover-background;
-
- > td,
- > th {
- background-color: $hover-background;
- }
- }
- }
- }
-}
diff --git a/oioioi/base/static/bootstrap/stylesheets/mixins/_table-variants.scss b/oioioi/base/static/bootstrap/stylesheets/mixins/_table-variants.scss
new file mode 100644
index 000000000..9fd0fb02a
--- /dev/null
+++ b/oioioi/base/static/bootstrap/stylesheets/mixins/_table-variants.scss
@@ -0,0 +1,21 @@
+// scss-docs-start table-variant
+@mixin table-variant($state, $background) {
+ .table-#{$state} {
+ $color: color-contrast(opaque($body-bg, $background));
+ $hover-bg: mix($color, $background, percentage($table-hover-bg-factor));
+ $striped-bg: mix($color, $background, percentage($table-striped-bg-factor));
+ $active-bg: mix($color, $background, percentage($table-active-bg-factor));
+
+ --#{$variable-prefix}table-bg: #{$background};
+ --#{$variable-prefix}table-striped-bg: #{$striped-bg};
+ --#{$variable-prefix}table-striped-color: #{color-contrast($striped-bg)};
+ --#{$variable-prefix}table-active-bg: #{$active-bg};
+ --#{$variable-prefix}table-active-color: #{color-contrast($active-bg)};
+ --#{$variable-prefix}table-hover-bg: #{$hover-bg};
+ --#{$variable-prefix}table-hover-color: #{color-contrast($hover-bg)};
+
+ color: $color;
+ border-color: mix($color, $background, percentage($table-border-factor));
+ }
+}
+// scss-docs-end table-variant
diff --git a/oioioi/base/static/bootstrap/stylesheets/mixins/_text-emphasis.scss b/oioioi/base/static/bootstrap/stylesheets/mixins/_text-emphasis.scss
deleted file mode 100644
index 5eb8a5515..000000000
--- a/oioioi/base/static/bootstrap/stylesheets/mixins/_text-emphasis.scss
+++ /dev/null
@@ -1,17 +0,0 @@
-// stylelint-disable declaration-no-important
-
-// Typography
-
-@mixin text-emphasis-variant($parent, $color, $ignore-warning: false) {
- #{$parent} {
- color: $color !important;
- }
- @if $emphasized-link-hover-darken-percentage != 0 {
- a#{$parent} {
- @include hover-focus() {
- color: darken($color, $emphasized-link-hover-darken-percentage) !important;
- }
- }
- }
- @include deprecate("`text-emphasis-variant()`", "v4.4.0", "v5", $ignore-warning);
-}
diff --git a/oioioi/base/static/bootstrap/stylesheets/mixins/_text-hide.scss b/oioioi/base/static/bootstrap/stylesheets/mixins/_text-hide.scss
deleted file mode 100644
index 3a923011e..000000000
--- a/oioioi/base/static/bootstrap/stylesheets/mixins/_text-hide.scss
+++ /dev/null
@@ -1,11 +0,0 @@
-// CSS image replacement
-@mixin text-hide($ignore-warning: false) {
- // stylelint-disable-next-line font-family-no-missing-generic-family-keyword
- font: 0/0 a;
- color: transparent;
- text-shadow: none;
- background-color: transparent;
- border: 0;
-
- @include deprecate("`text-hide()`", "v4.1.0", "v5", $ignore-warning);
-}
diff --git a/oioioi/base/static/bootstrap/stylesheets/mixins/_transition.scss b/oioioi/base/static/bootstrap/stylesheets/mixins/_transition.scss
index 54870bf6a..d437f6d8f 100644
--- a/oioioi/base/static/bootstrap/stylesheets/mixins/_transition.scss
+++ b/oioioi/base/static/bootstrap/stylesheets/mixins/_transition.scss
@@ -17,7 +17,7 @@
transition: $transition;
}
- @if $enable-prefers-reduced-motion-media-query and nth($transition, 1) != null and nth($transition, 1) != none {
+ @if $enable-reduced-motion and nth($transition, 1) != null and nth($transition, 1) != none {
@media (prefers-reduced-motion: reduce) {
transition: none;
}
diff --git a/oioioi/base/static/bootstrap/stylesheets/mixins/_utilities.scss b/oioioi/base/static/bootstrap/stylesheets/mixins/_utilities.scss
new file mode 100644
index 000000000..4d2370a0b
--- /dev/null
+++ b/oioioi/base/static/bootstrap/stylesheets/mixins/_utilities.scss
@@ -0,0 +1,68 @@
+// Utility generator
+// Used to generate utilities & print utilities
+@mixin generate-utility($utility, $infix, $is-rfs-media-query: false) {
+ $values: map-get($utility, values);
+
+ // If the values are a list or string, convert it into a map
+ @if type-of($values) == "string" or type-of(nth($values, 1)) != "list" {
+ $values: zip($values, $values);
+ }
+
+ @each $key, $value in $values {
+ $properties: map-get($utility, property);
+
+ // Multiple properties are possible, for example with vertical or horizontal margins or paddings
+ @if type-of($properties) == "string" {
+ $properties: append((), $properties);
+ }
+
+ // Use custom class if present
+ $property-class: if(map-has-key($utility, class), map-get($utility, class), nth($properties, 1));
+ $property-class: if($property-class == null, "", $property-class);
+
+ // State params to generate pseudo-classes
+ $state: if(map-has-key($utility, state), map-get($utility, state), ());
+
+ $infix: if($property-class == "" and str-slice($infix, 1, 1) == "-", str-slice($infix, 2), $infix);
+
+ // Don't prefix if value key is null (eg. with shadow class)
+ $property-class-modifier: if($key, if($property-class == "" and $infix == "", "", "-") + $key, "");
+
+ @if map-get($utility, rfs) {
+ // Inside the media query
+ @if $is-rfs-media-query {
+ $val: rfs-value($value);
+
+ // Do not render anything if fluid and non fluid values are the same
+ $value: if($val == rfs-fluid-value($value), null, $val);
+ }
+ @else {
+ $value: rfs-fluid-value($value);
+ }
+ }
+
+ $is-rtl: map-get($utility, rtl);
+
+ @if $value != null {
+ @if $is-rtl == false {
+ /* rtl:begin:remove */
+ }
+ .#{$property-class + $infix + $property-class-modifier} {
+ @each $property in $properties {
+ #{$property}: $value if($enable-important-utilities, !important, null);
+ }
+ }
+
+ @each $pseudo in $state {
+ .#{$property-class + $infix + $property-class-modifier}-#{$pseudo}:#{$pseudo} {
+ @each $property in $properties {
+ #{$property}: $value if($enable-important-utilities, !important, null);
+ }
+ }
+ }
+ @if $is-rtl == false {
+ /* rtl:end:remove */
+ }
+ }
+ }
+}
diff --git a/oioioi/base/static/bootstrap/stylesheets/mixins/_visibility.scss b/oioioi/base/static/bootstrap/stylesheets/mixins/_visibility.scss
deleted file mode 100644
index f17467311..000000000
--- a/oioioi/base/static/bootstrap/stylesheets/mixins/_visibility.scss
+++ /dev/null
@@ -1,8 +0,0 @@
-// stylelint-disable declaration-no-important
-
-// Visibility
-
-@mixin invisible($visibility) {
- visibility: $visibility !important;
- @include deprecate("`invisible()`", "v4.3.0", "v5");
-}
diff --git a/oioioi/base/static/bootstrap/stylesheets/mixins/_visually-hidden.scss b/oioioi/base/static/bootstrap/stylesheets/mixins/_visually-hidden.scss
new file mode 100644
index 000000000..ed7bc9c13
--- /dev/null
+++ b/oioioi/base/static/bootstrap/stylesheets/mixins/_visually-hidden.scss
@@ -0,0 +1,29 @@
+// stylelint-disable declaration-no-important
+
+// Hide content visually while keeping it accessible to assistive technologies
+//
+// See: https://www.a11yproject.com/posts/2013-01-11-how-to-hide-content/
+// See: https://hugogiraudel.com/2016/10/13/css-hide-and-seek/
+
+@mixin visually-hidden() {
+ position: absolute !important;
+ width: 1px !important;
+ height: 1px !important;
+ padding: 0 !important;
+ margin: -1px !important; // Fix for https://github.com/twbs/bootstrap/issues/25686
+ overflow: hidden !important;
+ clip: rect(0, 0, 0, 0) !important;
+ white-space: nowrap !important;
+ border: 0 !important;
+}
+
+// Use to only display content when it's focused, or one of its child elements is focused
+// (i.e. when focus is within the element/container that the class was applied to)
+//
+// Useful for "Skip to main content" links; see https://www.w3.org/TR/2013/NOTE-WCAG20-TECHS-20130905/G1
+
+@mixin visually-hidden-focusable() {
+ &:not(:focus):not(:focus-within) {
+ @include visually-hidden();
+ }
+}
diff --git a/oioioi/base/static/bootstrap/stylesheets/utilities/_align.scss b/oioioi/base/static/bootstrap/stylesheets/utilities/_align.scss
deleted file mode 100644
index 8b7df9f76..000000000
--- a/oioioi/base/static/bootstrap/stylesheets/utilities/_align.scss
+++ /dev/null
@@ -1,8 +0,0 @@
-// stylelint-disable declaration-no-important
-
-.align-baseline { vertical-align: baseline !important; } // Browser default
-.align-top { vertical-align: top !important; }
-.align-middle { vertical-align: middle !important; }
-.align-bottom { vertical-align: bottom !important; }
-.align-text-bottom { vertical-align: text-bottom !important; }
-.align-text-top { vertical-align: text-top !important; }
diff --git a/oioioi/base/static/bootstrap/stylesheets/utilities/_api.scss b/oioioi/base/static/bootstrap/stylesheets/utilities/_api.scss
new file mode 100644
index 000000000..62e1d398e
--- /dev/null
+++ b/oioioi/base/static/bootstrap/stylesheets/utilities/_api.scss
@@ -0,0 +1,47 @@
+// Loop over each breakpoint
+@each $breakpoint in map-keys($grid-breakpoints) {
+
+ // Generate media query if needed
+ @include media-breakpoint-up($breakpoint) {
+ $infix: breakpoint-infix($breakpoint, $grid-breakpoints);
+
+ // Loop over each utility property
+ @each $key, $utility in $utilities {
+ // The utility can be disabled with `false`, thus check if the utility is a map first
+ // Only proceed if responsive media queries are enabled or if it's the base media query
+ @if type-of($utility) == "map" and (map-get($utility, responsive) or $infix == "") {
+ @include generate-utility($utility, $infix);
+ }
+ }
+ }
+}
+
+// RFS rescaling
+@media (min-width: $rfs-mq-value) {
+ @each $breakpoint in map-keys($grid-breakpoints) {
+ $infix: breakpoint-infix($breakpoint, $grid-breakpoints);
+
+ @if (map-get($grid-breakpoints, $breakpoint) < $rfs-breakpoint) {
+ // Loop over each utility property
+ @each $key, $utility in $utilities {
+ // The utility can be disabled with `false`, thus check if the utility is a map first
+ // Only proceed if responsive media queries are enabled or if it's the base media query
+ @if type-of($utility) == "map" and map-get($utility, rfs) and (map-get($utility, responsive) or $infix == "") {
+ @include generate-utility($utility, $infix, true);
+ }
+ }
+ }
+ }
+}
+
+
+// Print utilities
+@media print {
+ @each $key, $utility in $utilities {
+ // The utility can be disabled with `false`, thus check if the utility is a map first
+ // Then check if the utility needs print styles
+ @if type-of($utility) == "map" and map-get($utility, print) == true {
+ @include generate-utility($utility, "-print");
+ }
+ }
+}
diff --git a/oioioi/base/static/bootstrap/stylesheets/utilities/_background.scss b/oioioi/base/static/bootstrap/stylesheets/utilities/_background.scss
deleted file mode 100644
index 3accbc4fd..000000000
--- a/oioioi/base/static/bootstrap/stylesheets/utilities/_background.scss
+++ /dev/null
@@ -1,19 +0,0 @@
-// stylelint-disable declaration-no-important
-
-@each $color, $value in $theme-colors {
- @include bg-variant(".bg-#{$color}", $value, true);
-}
-
-@if $enable-gradients {
- @each $color, $value in $theme-colors {
- @include bg-gradient-variant(".bg-gradient-#{$color}", $value, true);
- }
-}
-
-.bg-white {
- background-color: $white !important;
-}
-
-.bg-transparent {
- background-color: transparent !important;
-}
diff --git a/oioioi/base/static/bootstrap/stylesheets/utilities/_borders.scss b/oioioi/base/static/bootstrap/stylesheets/utilities/_borders.scss
deleted file mode 100644
index 205f3fc24..000000000
--- a/oioioi/base/static/bootstrap/stylesheets/utilities/_borders.scss
+++ /dev/null
@@ -1,75 +0,0 @@
-// stylelint-disable property-disallowed-list, declaration-no-important
-
-//
-// Border
-//
-
-.border { border: $border-width solid $border-color !important; }
-.border-top { border-top: $border-width solid $border-color !important; }
-.border-right { border-right: $border-width solid $border-color !important; }
-.border-bottom { border-bottom: $border-width solid $border-color !important; }
-.border-left { border-left: $border-width solid $border-color !important; }
-
-.border-0 { border: 0 !important; }
-.border-top-0 { border-top: 0 !important; }
-.border-right-0 { border-right: 0 !important; }
-.border-bottom-0 { border-bottom: 0 !important; }
-.border-left-0 { border-left: 0 !important; }
-
-@each $color, $value in $theme-colors {
- .border-#{$color} {
- border-color: $value !important;
- }
-}
-
-.border-white {
- border-color: $white !important;
-}
-
-//
-// Border-radius
-//
-
-.rounded-sm {
- border-radius: $border-radius-sm !important;
-}
-
-.rounded {
- border-radius: $border-radius !important;
-}
-
-.rounded-top {
- border-top-left-radius: $border-radius !important;
- border-top-right-radius: $border-radius !important;
-}
-
-.rounded-right {
- border-top-right-radius: $border-radius !important;
- border-bottom-right-radius: $border-radius !important;
-}
-
-.rounded-bottom {
- border-bottom-right-radius: $border-radius !important;
- border-bottom-left-radius: $border-radius !important;
-}
-
-.rounded-left {
- border-top-left-radius: $border-radius !important;
- border-bottom-left-radius: $border-radius !important;
-}
-
-.rounded-lg {
- border-radius: $border-radius-lg !important;
-}
-
-.rounded-circle {
- border-radius: 50% !important;
-}
-
-.rounded-pill {
- border-radius: $rounded-pill !important;
-}
-
-.rounded-0 {
- border-radius: 0 !important;
-}
diff --git a/oioioi/base/static/bootstrap/stylesheets/utilities/_display.scss b/oioioi/base/static/bootstrap/stylesheets/utilities/_display.scss
deleted file mode 100644
index 130367998..000000000
--- a/oioioi/base/static/bootstrap/stylesheets/utilities/_display.scss
+++ /dev/null
@@ -1,26 +0,0 @@
-// stylelint-disable declaration-no-important
-
-//
-// Utilities for common `display` values
-//
-
-@each $breakpoint in map-keys($grid-breakpoints) {
- @include media-breakpoint-up($breakpoint) {
- $infix: breakpoint-infix($breakpoint, $grid-breakpoints);
-
- @each $value in $displays {
- .d#{$infix}-#{$value} { display: $value !important; }
- }
- }
-}
-
-
-//
-// Utilities for toggling `display` in print
-//
-
-@media print {
- @each $value in $displays {
- .d-print-#{$value} { display: $value !important; }
- }
-}
diff --git a/oioioi/base/static/bootstrap/stylesheets/utilities/_embed.scss b/oioioi/base/static/bootstrap/stylesheets/utilities/_embed.scss
deleted file mode 100644
index e37465e40..000000000
--- a/oioioi/base/static/bootstrap/stylesheets/utilities/_embed.scss
+++ /dev/null
@@ -1,39 +0,0 @@
-// Credit: Nicolas Gallagher and SUIT CSS.
-
-.embed-responsive {
- position: relative;
- display: block;
- width: 100%;
- padding: 0;
- overflow: hidden;
-
- &::before {
- display: block;
- content: "";
- }
-
- .embed-responsive-item,
- iframe,
- embed,
- object,
- video {
- position: absolute;
- top: 0;
- bottom: 0;
- left: 0;
- width: 100%;
- height: 100%;
- border: 0;
- }
-}
-
-@each $embed-responsive-aspect-ratio in $embed-responsive-aspect-ratios {
- $embed-responsive-aspect-ratio-x: nth($embed-responsive-aspect-ratio, 1);
- $embed-responsive-aspect-ratio-y: nth($embed-responsive-aspect-ratio, 2);
-
- .embed-responsive-#{$embed-responsive-aspect-ratio-x}by#{$embed-responsive-aspect-ratio-y} {
- &::before {
- padding-top: percentage(divide($embed-responsive-aspect-ratio-y, $embed-responsive-aspect-ratio-x));
- }
- }
-}
diff --git a/oioioi/base/static/bootstrap/stylesheets/utilities/_flex.scss b/oioioi/base/static/bootstrap/stylesheets/utilities/_flex.scss
deleted file mode 100644
index 3d4266e0d..000000000
--- a/oioioi/base/static/bootstrap/stylesheets/utilities/_flex.scss
+++ /dev/null
@@ -1,51 +0,0 @@
-// stylelint-disable declaration-no-important
-
-// Flex variation
-//
-// Custom styles for additional flex alignment options.
-
-@each $breakpoint in map-keys($grid-breakpoints) {
- @include media-breakpoint-up($breakpoint) {
- $infix: breakpoint-infix($breakpoint, $grid-breakpoints);
-
- .flex#{$infix}-row { flex-direction: row !important; }
- .flex#{$infix}-column { flex-direction: column !important; }
- .flex#{$infix}-row-reverse { flex-direction: row-reverse !important; }
- .flex#{$infix}-column-reverse { flex-direction: column-reverse !important; }
-
- .flex#{$infix}-wrap { flex-wrap: wrap !important; }
- .flex#{$infix}-nowrap { flex-wrap: nowrap !important; }
- .flex#{$infix}-wrap-reverse { flex-wrap: wrap-reverse !important; }
- .flex#{$infix}-fill { flex: 1 1 auto !important; }
- .flex#{$infix}-grow-0 { flex-grow: 0 !important; }
- .flex#{$infix}-grow-1 { flex-grow: 1 !important; }
- .flex#{$infix}-shrink-0 { flex-shrink: 0 !important; }
- .flex#{$infix}-shrink-1 { flex-shrink: 1 !important; }
-
- .justify-content#{$infix}-start { justify-content: flex-start !important; }
- .justify-content#{$infix}-end { justify-content: flex-end !important; }
- .justify-content#{$infix}-center { justify-content: center !important; }
- .justify-content#{$infix}-between { justify-content: space-between !important; }
- .justify-content#{$infix}-around { justify-content: space-around !important; }
-
- .align-items#{$infix}-start { align-items: flex-start !important; }
- .align-items#{$infix}-end { align-items: flex-end !important; }
- .align-items#{$infix}-center { align-items: center !important; }
- .align-items#{$infix}-baseline { align-items: baseline !important; }
- .align-items#{$infix}-stretch { align-items: stretch !important; }
-
- .align-content#{$infix}-start { align-content: flex-start !important; }
- .align-content#{$infix}-end { align-content: flex-end !important; }
- .align-content#{$infix}-center { align-content: center !important; }
- .align-content#{$infix}-between { align-content: space-between !important; }
- .align-content#{$infix}-around { align-content: space-around !important; }
- .align-content#{$infix}-stretch { align-content: stretch !important; }
-
- .align-self#{$infix}-auto { align-self: auto !important; }
- .align-self#{$infix}-start { align-self: flex-start !important; }
- .align-self#{$infix}-end { align-self: flex-end !important; }
- .align-self#{$infix}-center { align-self: center !important; }
- .align-self#{$infix}-baseline { align-self: baseline !important; }
- .align-self#{$infix}-stretch { align-self: stretch !important; }
- }
-}
diff --git a/oioioi/base/static/bootstrap/stylesheets/utilities/_float.scss b/oioioi/base/static/bootstrap/stylesheets/utilities/_float.scss
deleted file mode 100644
index 54250844f..000000000
--- a/oioioi/base/static/bootstrap/stylesheets/utilities/_float.scss
+++ /dev/null
@@ -1,11 +0,0 @@
-// stylelint-disable declaration-no-important
-
-@each $breakpoint in map-keys($grid-breakpoints) {
- @include media-breakpoint-up($breakpoint) {
- $infix: breakpoint-infix($breakpoint, $grid-breakpoints);
-
- .float#{$infix}-left { float: left !important; }
- .float#{$infix}-right { float: right !important; }
- .float#{$infix}-none { float: none !important; }
- }
-}
diff --git a/oioioi/base/static/bootstrap/stylesheets/utilities/_interactions.scss b/oioioi/base/static/bootstrap/stylesheets/utilities/_interactions.scss
deleted file mode 100644
index cc75fc21b..000000000
--- a/oioioi/base/static/bootstrap/stylesheets/utilities/_interactions.scss
+++ /dev/null
@@ -1,5 +0,0 @@
-// stylelint-disable declaration-no-important
-
-@each $value in $user-selects {
- .user-select-#{$value} { user-select: $value !important; }
-}
diff --git a/oioioi/base/static/bootstrap/stylesheets/utilities/_overflow.scss b/oioioi/base/static/bootstrap/stylesheets/utilities/_overflow.scss
deleted file mode 100644
index 8326c3064..000000000
--- a/oioioi/base/static/bootstrap/stylesheets/utilities/_overflow.scss
+++ /dev/null
@@ -1,5 +0,0 @@
-// stylelint-disable declaration-no-important
-
-@each $value in $overflows {
- .overflow-#{$value} { overflow: $value !important; }
-}
diff --git a/oioioi/base/static/bootstrap/stylesheets/utilities/_position.scss b/oioioi/base/static/bootstrap/stylesheets/utilities/_position.scss
deleted file mode 100644
index cdf6c115f..000000000
--- a/oioioi/base/static/bootstrap/stylesheets/utilities/_position.scss
+++ /dev/null
@@ -1,32 +0,0 @@
-// stylelint-disable declaration-no-important
-
-// Common values
-@each $position in $positions {
- .position-#{$position} { position: $position !important; }
-}
-
-// Shorthand
-
-.fixed-top {
- position: fixed;
- top: 0;
- right: 0;
- left: 0;
- z-index: $zindex-fixed;
-}
-
-.fixed-bottom {
- position: fixed;
- right: 0;
- bottom: 0;
- left: 0;
- z-index: $zindex-fixed;
-}
-
-.sticky-top {
- @supports (position: sticky) {
- position: sticky;
- top: 0;
- z-index: $zindex-sticky;
- }
-}
diff --git a/oioioi/base/static/bootstrap/stylesheets/utilities/_screenreaders.scss b/oioioi/base/static/bootstrap/stylesheets/utilities/_screenreaders.scss
deleted file mode 100644
index 9f26fde03..000000000
--- a/oioioi/base/static/bootstrap/stylesheets/utilities/_screenreaders.scss
+++ /dev/null
@@ -1,11 +0,0 @@
-//
-// Screenreaders
-//
-
-.sr-only {
- @include sr-only();
-}
-
-.sr-only-focusable {
- @include sr-only-focusable();
-}
diff --git a/oioioi/base/static/bootstrap/stylesheets/utilities/_shadows.scss b/oioioi/base/static/bootstrap/stylesheets/utilities/_shadows.scss
deleted file mode 100644
index f5d03fcd5..000000000
--- a/oioioi/base/static/bootstrap/stylesheets/utilities/_shadows.scss
+++ /dev/null
@@ -1,6 +0,0 @@
-// stylelint-disable declaration-no-important
-
-.shadow-sm { box-shadow: $box-shadow-sm !important; }
-.shadow { box-shadow: $box-shadow !important; }
-.shadow-lg { box-shadow: $box-shadow-lg !important; }
-.shadow-none { box-shadow: none !important; }
diff --git a/oioioi/base/static/bootstrap/stylesheets/utilities/_sizing.scss b/oioioi/base/static/bootstrap/stylesheets/utilities/_sizing.scss
deleted file mode 100644
index f37648802..000000000
--- a/oioioi/base/static/bootstrap/stylesheets/utilities/_sizing.scss
+++ /dev/null
@@ -1,20 +0,0 @@
-// stylelint-disable declaration-no-important
-
-// Width and height
-
-@each $prop, $abbrev in (width: w, height: h) {
- @each $size, $length in $sizes {
- .#{$abbrev}-#{$size} { #{$prop}: $length !important; }
- }
-}
-
-.mw-100 { max-width: 100% !important; }
-.mh-100 { max-height: 100% !important; }
-
-// Viewport additional helpers
-
-.min-vw-100 { min-width: 100vw !important; }
-.min-vh-100 { min-height: 100vh !important; }
-
-.vw-100 { width: 100vw !important; }
-.vh-100 { height: 100vh !important; }
diff --git a/oioioi/base/static/bootstrap/stylesheets/utilities/_spacing.scss b/oioioi/base/static/bootstrap/stylesheets/utilities/_spacing.scss
deleted file mode 100644
index 3e98581a9..000000000
--- a/oioioi/base/static/bootstrap/stylesheets/utilities/_spacing.scss
+++ /dev/null
@@ -1,73 +0,0 @@
-// stylelint-disable declaration-no-important
-
-// Margin and Padding
-
-@each $breakpoint in map-keys($grid-breakpoints) {
- @include media-breakpoint-up($breakpoint) {
- $infix: breakpoint-infix($breakpoint, $grid-breakpoints);
-
- @each $prop, $abbrev in (margin: m, padding: p) {
- @each $size, $length in $spacers {
- .#{$abbrev}#{$infix}-#{$size} { #{$prop}: $length !important; }
- .#{$abbrev}t#{$infix}-#{$size},
- .#{$abbrev}y#{$infix}-#{$size} {
- #{$prop}-top: $length !important;
- }
- .#{$abbrev}r#{$infix}-#{$size},
- .#{$abbrev}x#{$infix}-#{$size} {
- #{$prop}-right: $length !important;
- }
- .#{$abbrev}b#{$infix}-#{$size},
- .#{$abbrev}y#{$infix}-#{$size} {
- #{$prop}-bottom: $length !important;
- }
- .#{$abbrev}l#{$infix}-#{$size},
- .#{$abbrev}x#{$infix}-#{$size} {
- #{$prop}-left: $length !important;
- }
- }
- }
-
- // Negative margins (e.g., where `.mb-n1` is negative version of `.mb-1`)
- @each $size, $length in $spacers {
- @if "#{$size}" != "0" {
- .m#{$infix}-n#{$size} { margin: -$length !important; }
- .mt#{$infix}-n#{$size},
- .my#{$infix}-n#{$size} {
- margin-top: -$length !important;
- }
- .mr#{$infix}-n#{$size},
- .mx#{$infix}-n#{$size} {
- margin-right: -$length !important;
- }
- .mb#{$infix}-n#{$size},
- .my#{$infix}-n#{$size} {
- margin-bottom: -$length !important;
- }
- .ml#{$infix}-n#{$size},
- .mx#{$infix}-n#{$size} {
- margin-left: -$length !important;
- }
- }
- }
-
- // Some special margin utils
- .m#{$infix}-auto { margin: auto !important; }
- .mt#{$infix}-auto,
- .my#{$infix}-auto {
- margin-top: auto !important;
- }
- .mr#{$infix}-auto,
- .mx#{$infix}-auto {
- margin-right: auto !important;
- }
- .mb#{$infix}-auto,
- .my#{$infix}-auto {
- margin-bottom: auto !important;
- }
- .ml#{$infix}-auto,
- .mx#{$infix}-auto {
- margin-left: auto !important;
- }
- }
-}
diff --git a/oioioi/base/static/bootstrap/stylesheets/utilities/_stretched-link.scss b/oioioi/base/static/bootstrap/stylesheets/utilities/_stretched-link.scss
deleted file mode 100644
index fb5066bf5..000000000
--- a/oioioi/base/static/bootstrap/stylesheets/utilities/_stretched-link.scss
+++ /dev/null
@@ -1,19 +0,0 @@
-//
-// Stretched link
-//
-
-.stretched-link {
- &::after {
- position: absolute;
- top: 0;
- right: 0;
- bottom: 0;
- left: 0;
- z-index: 1;
- // Just in case `pointer-events: none` is set on a parent
- pointer-events: auto;
- content: "";
- // IE10 bugfix, see https://stackoverflow.com/questions/16947967/ie10-hover-pseudo-class-doesnt-work-without-background-color
- background-color: rgba(0, 0, 0, 0);
- }
-}
diff --git a/oioioi/base/static/bootstrap/stylesheets/utilities/_text.scss b/oioioi/base/static/bootstrap/stylesheets/utilities/_text.scss
deleted file mode 100644
index 3a9f83edf..000000000
--- a/oioioi/base/static/bootstrap/stylesheets/utilities/_text.scss
+++ /dev/null
@@ -1,72 +0,0 @@
-// stylelint-disable declaration-no-important
-
-//
-// Text
-//
-
-.text-monospace { font-family: $font-family-monospace !important; }
-
-// Alignment
-
-.text-justify { text-align: justify !important; }
-.text-wrap { white-space: normal !important; }
-.text-nowrap { white-space: nowrap !important; }
-.text-truncate { @include text-truncate(); }
-
-// Responsive alignment
-
-@each $breakpoint in map-keys($grid-breakpoints) {
- @include media-breakpoint-up($breakpoint) {
- $infix: breakpoint-infix($breakpoint, $grid-breakpoints);
-
- .text#{$infix}-left { text-align: left !important; }
- .text#{$infix}-right { text-align: right !important; }
- .text#{$infix}-center { text-align: center !important; }
- }
-}
-
-// Transformation
-
-.text-lowercase { text-transform: lowercase !important; }
-.text-uppercase { text-transform: uppercase !important; }
-.text-capitalize { text-transform: capitalize !important; }
-
-// Weight and italics
-
-.font-weight-light { font-weight: $font-weight-light !important; }
-.font-weight-lighter { font-weight: $font-weight-lighter !important; }
-.font-weight-normal { font-weight: $font-weight-normal !important; }
-.font-weight-bold { font-weight: $font-weight-bold !important; }
-.font-weight-bolder { font-weight: $font-weight-bolder !important; }
-.font-italic { font-style: italic !important; }
-
-// Contextual colors
-
-.text-white { color: $white !important; }
-
-@each $color, $value in $theme-colors {
- @include text-emphasis-variant(".text-#{$color}", $value, true);
-}
-
-.text-body { color: $body-color !important; }
-.text-muted { color: $text-muted !important; }
-
-.text-black-50 { color: rgba($black, .5) !important; }
-.text-white-50 { color: rgba($white, .5) !important; }
-
-// Misc
-
-.text-hide {
- @include text-hide($ignore-warning: true);
-}
-
-.text-decoration-none { text-decoration: none !important; }
-
-.text-break {
- word-break: break-word !important; // Deprecated, but avoids issues with flex containers
- word-wrap: break-word !important; // Used instead of `overflow-wrap` for IE & Edge Legacy
-}
-
-// Reset
-
-.text-reset { color: inherit !important; }
diff --git a/oioioi/base/static/bootstrap/stylesheets/utilities/_visibility.scss b/oioioi/base/static/bootstrap/stylesheets/utilities/_visibility.scss
deleted file mode 100644
index 7756c3bfa..000000000
--- a/oioioi/base/static/bootstrap/stylesheets/utilities/_visibility.scss
+++ /dev/null
@@ -1,13 +0,0 @@
-// stylelint-disable declaration-no-important
-
-//
-// Visibility utilities
-//
-
-.visible {
- visibility: visible !important;
-}
-
-.invisible {
- visibility: hidden !important;
-}
diff --git a/oioioi/base/static/bootstrap/stylesheets/vendor/_rfs.scss b/oioioi/base/static/bootstrap/stylesheets/vendor/_rfs.scss
index e453f441e..7e9a6c7a8 100644
--- a/oioioi/base/static/bootstrap/stylesheets/vendor/_rfs.scss
+++ b/oioioi/base/static/bootstrap/stylesheets/vendor/_rfs.scss
@@ -2,21 +2,21 @@
// SCSS RFS mixin
//
-// Automated responsive font sizes
+// Automated responsive values for font sizes, paddings, margins and much more
//
-// Licensed under MIT (https://github.com/twbs/rfs/blob/v8.x/LICENSE)
+// Licensed under MIT (https://github.com/twbs/rfs/blob/main/LICENSE)
// Configuration
-// Base font size
-$rfs-base-font-size: 1.25rem !default;
-$rfs-font-size-unit: rem !default;
+// Base value
+$rfs-base-value: 1.25rem !default;
+$rfs-unit: rem !default;
-@if $rfs-font-size-unit != rem and $rfs-font-size-unit != px {
- @error "`#{$rfs-font-size-unit}` is not a valid unit for $rfs-font-size-unit. Use `px` or `rem`.";
+@if $rfs-unit != rem and $rfs-unit != px {
+ @error "`#{$rfs-unit}` is not a valid unit for $rfs-unit. Use `px` or `rem`.";
}
-// Breakpoint at where font-size starts decreasing if screen width is smaller
+// Breakpoint at where values start decreasing if screen width is smaller
$rfs-breakpoint: 1200px !default;
$rfs-breakpoint-unit: px !default;
@@ -24,16 +24,19 @@ $rfs-breakpoint-unit: px !default;
@error "`#{$rfs-breakpoint-unit}` is not a valid unit for $rfs-breakpoint-unit. Use `px`, `em` or `rem`.";
}
-// Resize font size based on screen height and width
+// Resize values based on screen height and width
$rfs-two-dimensional: false !default;
// Factor of decrease
$rfs-factor: 10 !default;
-@if type-of($rfs-factor) != "number" or $rfs-factor <= 1 {
+@if type-of($rfs-factor) != number or $rfs-factor <= 1 {
@error "`#{$rfs-factor}` is not a valid $rfs-factor, it must be greater than 1.";
}
+// Mode. Possibilities: "min-media-query", "max-media-query"
+$rfs-mode: min-media-query !default;
+
// Generate enable or disable classes. Possibilities: false, "enable" or "disable"
$rfs-class: false !default;
@@ -43,11 +46,11 @@ $rfs-rem-value: 16 !default;
// Safari iframe resize bug: https://github.com/twbs/rfs/issues/14
$rfs-safari-iframe-resize-bug-fix: false !default;
-// Disable RFS by setting $enable-responsive-font-sizes to false
-$enable-responsive-font-sizes: true !default;
+// Disable RFS by setting $enable-rfs to false
+$enable-rfs: true !default;
-// Cache $rfs-base-font-size unit
-$rfs-base-font-size-unit: unit($rfs-base-font-size);
+// Cache $rfs-base-value unit
+$rfs-base-value-unit: unit($rfs-base-value);
@function divide($dividend, $divisor, $precision: 10) {
$sign: if($dividend > 0 and $divisor > 0 or $dividend < 0 and $divisor < 0, 1, -1);
@@ -91,45 +94,64 @@ $rfs-base-font-size-unit: unit($rfs-base-font-size);
@return $result;
}
-// Remove px-unit from $rfs-base-font-size for calculations
-@if $rfs-base-font-size-unit == "px" {
- $rfs-base-font-size: divide($rfs-base-font-size, $rfs-base-font-size * 0 + 1);
+// Remove px-unit from $rfs-base-value for calculations
+@if $rfs-base-value-unit == px {
+ $rfs-base-value: divide($rfs-base-value, $rfs-base-value * 0 + 1);
}
-@else if $rfs-base-font-size-unit == "rem" {
- $rfs-base-font-size: divide($rfs-base-font-size, divide($rfs-base-font-size * 0 + 1, $rfs-rem-value));
+@else if $rfs-base-value-unit == rem {
+ $rfs-base-value: divide($rfs-base-value, divide($rfs-base-value * 0 + 1, $rfs-rem-value));
}
// Cache $rfs-breakpoint unit to prevent multiple calls
$rfs-breakpoint-unit-cache: unit($rfs-breakpoint);
// Remove unit from $rfs-breakpoint for calculations
-@if $rfs-breakpoint-unit-cache == "px" {
+@if $rfs-breakpoint-unit-cache == px {
$rfs-breakpoint: divide($rfs-breakpoint, $rfs-breakpoint * 0 + 1);
}
-@else if $rfs-breakpoint-unit-cache == "rem" or $rfs-breakpoint-unit-cache == "em" {
+@else if $rfs-breakpoint-unit-cache == rem or $rfs-breakpoint-unit-cache == "em" {
$rfs-breakpoint: divide($rfs-breakpoint, divide($rfs-breakpoint * 0 + 1, $rfs-rem-value));
}
-// Internal mixin that adds disable classes to the selector if needed.
-@mixin _rfs-disable-class {
- @if $rfs-class == "disable" {
- // Adding an extra class increases specificity, which prevents the media query to override the font size
- &,
- .disable-responsive-font-size &,
- &.disable-responsive-font-size {
- @content;
+// Calculate the media query value
+$rfs-mq-value: if($rfs-breakpoint-unit == px, #{$rfs-breakpoint}px, #{divide($rfs-breakpoint, $rfs-rem-value)}#{$rfs-breakpoint-unit});
+$rfs-mq-property-width: if($rfs-mode == max-media-query, max-width, min-width);
+$rfs-mq-property-height: if($rfs-mode == max-media-query, max-height, min-height);
+
+// Internal mixin used to determine which media query needs to be used
+@mixin _rfs-media-query {
+ @if $rfs-two-dimensional {
+ @if $rfs-mode == max-media-query {
+ @media (#{$rfs-mq-property-width}: #{$rfs-mq-value}), (#{$rfs-mq-property-height}: #{$rfs-mq-value}) {
+ @content;
+ }
+ }
+ @else {
+ @media (#{$rfs-mq-property-width}: #{$rfs-mq-value}) and (#{$rfs-mq-property-height}: #{$rfs-mq-value}) {
+ @content;
+ }
}
}
@else {
- @content;
+ @media (#{$rfs-mq-property-width}: #{$rfs-mq-value}) {
+ @content;
+ }
}
}
-// Internal mixin that adds enable classes to the selector if needed.
-@mixin _rfs-enable-class {
- @if $rfs-class == "enable" {
- .enable-responsive-font-size &,
- &.enable-responsive-font-size {
+// Internal mixin that adds disable classes to the selector if needed.
+@mixin _rfs-rule {
+ @if $rfs-class == disable and $rfs-mode == max-media-query {
+ // Adding an extra class increases specificity, which prevents the media query to override the property
+ &,
+ .disable-rfs &,
+ &.disable-rfs {
+ @content;
+ }
+ }
+ @else if $rfs-class == enable and $rfs-mode == min-media-query {
+ .enable-rfs &,
+ &.enable-rfs {
@content;
}
}
@@ -138,91 +160,195 @@ $rfs-breakpoint-unit-cache: unit($rfs-breakpoint);
}
}
-// Internal mixin used to determine which media query needs to be used
-@mixin _rfs-media-query($mq-value) {
- @if $rfs-two-dimensional {
- @media (max-width: #{$mq-value}), (max-height: #{$mq-value}) {
+// Internal mixin that adds enable classes to the selector if needed.
+@mixin _rfs-media-query-rule {
+
+ @if $rfs-class == enable {
+ @if $rfs-mode == min-media-query {
@content;
}
+
+ @include _rfs-media-query {
+ .enable-rfs &,
+ &.enable-rfs {
+ @content;
+ }
+ }
}
@else {
- @media (max-width: #{$mq-value}) {
+ @if $rfs-class == disable and $rfs-mode == min-media-query {
+ .disable-rfs &,
+ &.disable-rfs {
+ @content;
+ }
+ }
+ @include _rfs-media-query {
@content;
}
}
}
-// Responsive font size mixin
-@mixin rfs($fs, $important: false) {
- // Cache $fs unit
- $fs-unit: if(type-of($fs) == "number", unit($fs), false);
+// Helper function to get the formatted non-responsive value
+@function rfs-value($values) {
+ // Convert to list
+ $values: if(type-of($values) != list, ($values,), $values);
- // Add !important suffix if needed
- $rfs-suffix: if($important, " !important", "");
+ $val: '';
- // If $fs isn't a number (like inherit) or $fs has a unit (not px or rem, like 1.5em) or $ is 0, just print the value
- @if not $fs-unit or $fs-unit != "" and $fs-unit != "px" and $fs-unit != "rem" or $fs == 0 {
- font-size: #{$fs}#{$rfs-suffix};
- }
- @else {
- // Remove unit from $fs for calculations
- @if $fs-unit == "px" {
- $fs: divide($fs, $fs * 0 + 1);
+ // Loop over each value and calculate value
+ @each $value in $values {
+ @if $value == 0 {
+ $val: $val + ' 0';
}
- @else if $fs-unit == "rem" {
- $fs: divide($fs, divide($fs * 0 + 1, $rfs-rem-value));
+ @else {
+ // Cache $value unit
+ $unit: if(type-of($value) == "number", unit($value), false);
+
+ @if $unit == px {
+ // Convert to rem if needed
+ $val: $val + ' ' + if($rfs-unit == rem, #{divide($value, $value * 0 + $rfs-rem-value)}rem, $value);
+ }
+ @else if $unit == rem {
+ // Convert to px if needed
+ $val: $val + ' ' + if($rfs-unit == px, #{divide($value, $value * 0 + 1) * $rfs-rem-value}px, $value);
+ }
+ @else {
+ // If $value isn't a number (like inherit) or $value has a unit (not px or rem, like 1.5em) or $ is 0, just print the value
+ $val: $val + ' ' + $value;
+ }
}
+ }
- // Set default font size
- $rfs-static: if($rfs-font-size-unit == rem, #{divide($fs, $rfs-rem-value)}rem, #{$fs}px);
+ // Remove first space
+ @return unquote(str-slice($val, 2));
+}
+
+// Helper function to get the responsive value calculated by RFS
+@function rfs-fluid-value($values) {
+ // Convert to list
+ $values: if(type-of($values) != list, ($values,), $values);
+
+ $val: '';
- // Only add the media query if the font size is bigger than the minimum font size
- @if $fs <= $rfs-base-font-size or not $enable-responsive-font-sizes {
- font-size: #{$rfs-static}#{$rfs-suffix};
+ // Loop over each value and calculate value
+ @each $value in $values {
+ @if $value == 0 {
+ $val: $val + ' 0';
}
+
@else {
- // Calculate the minimum font size for $fs
- $fs-min: $rfs-base-font-size + divide($fs - $rfs-base-font-size, $rfs-factor);
+ // Cache $value unit
+ $unit: if(type-of($value) == "number", unit($value), false);
+
+ // If $value isn't a number (like inherit) or $value has a unit (not px or rem, like 1.5em) or $ is 0, just print the value
+ @if not $unit or $unit != px and $unit != rem {
+ $val: $val + ' ' + $value;
+ }
- // Calculate difference between $fs and the minimum font size
- $fs-diff: $fs - $fs-min;
+ @else {
+ // Remove unit from $value for calculations
+ $value: divide($value, $value * 0 + if($unit == px, 1, divide(1, $rfs-rem-value)));
- // Base font-size formatting
- $min-width: if($rfs-font-size-unit == rem, #{divide($fs-min, $rfs-rem-value)}rem, #{$fs-min}px);
+ // Only add the media query if the value is greater than the minimum value
+ @if abs($value) <= $rfs-base-value or not $enable-rfs {
+ $val: $val + ' ' + if($rfs-unit == rem, #{divide($value, $rfs-rem-value)}rem, #{$value}px);
+ }
+ @else {
+ // Calculate the minimum value
+ $value-min: $rfs-base-value + divide(abs($value) - $rfs-base-value, $rfs-factor);
- // Use `vmin` if two-dimensional is enabled
- $variable-unit: if($rfs-two-dimensional, vmin, vw);
+ // Calculate difference between $value and the minimum value
+ $value-diff: abs($value) - $value-min;
- // Calculate the variable width between 0 and $rfs-breakpoint
- $variable-width: #{divide($fs-diff * 100, $rfs-breakpoint)}#{$variable-unit};
+ // Base value formatting
+ $min-width: if($rfs-unit == rem, #{divide($value-min, $rfs-rem-value)}rem, #{$value-min}px);
- // Set the calculated font-size
- $rfs-fluid: calc(#{$min-width} + #{$variable-width}) #{$rfs-suffix};
+ // Use negative value if needed
+ $min-width: if($value < 0, -$min-width, $min-width);
- // Breakpoint formatting
- $mq-value: if($rfs-breakpoint-unit == px, #{$rfs-breakpoint}px, #{divide($rfs-breakpoint, $rfs-rem-value)}#{$rfs-breakpoint-unit});
+ // Use `vmin` if two-dimensional is enabled
+ $variable-unit: if($rfs-two-dimensional, vmin, vw);
- @include _rfs-disable-class {
- font-size: #{$rfs-static}#{$rfs-suffix};
- }
+ // Calculate the variable width between 0 and $rfs-breakpoint
+ $variable-width: #{divide($value-diff * 100, $rfs-breakpoint)}#{$variable-unit};
- @include _rfs-media-query($mq-value) {
- @include _rfs-enable-class {
- font-size: $rfs-fluid;
+ // Return the calculated value
+ $val: $val + ' calc(' + $min-width + if($value < 0, ' - ', ' + ') + $variable-width + ')';
}
+ }
+ }
+ }
+
+ // Remove first space
+ @return unquote(str-slice($val, 2));
+}
+
+// RFS mixin
+@mixin rfs($values, $property: font-size) {
+ @if $values != null {
+ $val: rfs-value($values);
+ $fluidVal: rfs-fluid-value($values);
+
+ // Do not print the media query if responsive & non-responsive values are the same
+ @if $val == $fluidVal {
+ #{$property}: $val;
+ }
+ @else {
+ @include _rfs-rule {
+ #{$property}: if($rfs-mode == max-media-query, $val, $fluidVal);
// Include safari iframe resize fix if needed
min-width: if($rfs-safari-iframe-resize-bug-fix, (0 * 1vw), null);
}
+
+ @include _rfs-media-query-rule {
+ #{$property}: if($rfs-mode == max-media-query, $fluidVal, $val);
+ }
}
}
}
-// The font-size & responsive-font-size mixins use RFS to rescale the font size
-@mixin font-size($fs, $important: false) {
- @include rfs($fs, $important);
+// Shorthand helper mixins
+@mixin font-size($value) {
+ @include rfs($value);
+}
+
+@mixin padding($value) {
+ @include rfs($value, padding);
+}
+
+@mixin padding-top($value) {
+ @include rfs($value, padding-top);
+}
+
+@mixin padding-right($value) {
+ @include rfs($value, padding-right);
+}
+
+@mixin padding-bottom($value) {
+ @include rfs($value, padding-bottom);
+}
+
+@mixin padding-left($value) {
+ @include rfs($value, padding-left);
+}
+
+@mixin margin($value) {
+ @include rfs($value, margin);
+}
+
+@mixin margin-top($value) {
+ @include rfs($value, margin-top);
+}
+
+@mixin margin-right($value) {
+ @include rfs($value, margin-right);
+}
+
+@mixin margin-bottom($value) {
+ @include rfs($value, margin-bottom);
}
-@mixin responsive-font-size($fs, $important: false) {
- @include rfs($fs, $important);
+@mixin margin-left($value) {
+ @include rfs($value, margin-left);
}
diff --git a/oioioi/base/static/js/bootstrap-async-collapsible.js b/oioioi/base/static/js/bootstrap-async-collapsible.js
index cc7b77bc1..7a88c081b 100644
--- a/oioioi/base/static/js/bootstrap-async-collapsible.js
+++ b/oioioi/base/static/js/bootstrap-async-collapsible.js
@@ -2,15 +2,15 @@ $(function(){
/*
Script for 'collapsibles' with asynchronously loadable data.
After first load everything behaves like in Bootstrap.
- Trigerrer: data-async-toggle="collapse" data-target="`JQuery selector`"
+ Trigerrer: data-async-toggle="collapse" data-bs-target="`JQuery selector`"
Dynamic collapsible: class="collapse" data-loadurl="http://url/with/html"
*/
$('body').on('click', '.btn[data-async-toggle=collapse]', function() {
var e = $(this);
//All buttons triggerring same location
- var s = $('.btn[data-async-toggle=collapse][data-target=' +
- e.data('target')+']');
+ var s = $('.btn[data-async-toggle=collapse][data-bs-target=' +
+ e.data('bs-target')+']');
s.each(function() {
var e = $(this);
e.removeAttr('data-async-toggle');
@@ -22,7 +22,7 @@ $(function(){
span.addClass('fa-solid fa-rotate-right');
});
- var t = $(e.data('target'));
+ var t = $(e.data('bs-target'));
t.load(t.data('loadurl'), function(response, status) {
if (status == "error") {
t.html('' + response +
@@ -32,7 +32,7 @@ $(function(){
s.each(function(){
var e = $(this);
var span = $('span', this);
- e.attr('data-toggle', 'collapse');
+ e.attr('data-bs-toggle', 'collapse');
e.toggleClass('loading disabled');
span.prop('class', e.data('prev-icon'));
});
diff --git a/oioioi/base/static/scss/_admin.scss b/oioioi/base/static/scss/_admin.scss
index 6d5cd9397..ab8892c14 100644
--- a/oioioi/base/static/scss/_admin.scss
+++ b/oioioi/base/static/scss/_admin.scss
@@ -32,7 +32,7 @@
}
input[type=file] {
- @extend .form-control-file;
+ @extend .form-control;
}
.datetime, .datetime span {
@@ -80,7 +80,7 @@
}
}
-@include media-breakpoint-down(xs) {
+@include media-breakpoint-down(sm) {
#changelist-search, #changelist-actions {
width: 100%;
}
diff --git a/oioioi/base/static/scss/_language-picker.scss b/oioioi/base/static/scss/_language-picker.scss
index 904629f27..d07e62b9a 100644
--- a/oioioi/base/static/scss/_language-picker.scss
+++ b/oioioi/base/static/scss/_language-picker.scss
@@ -4,5 +4,5 @@
font-weight: bold;
font-size: 18px;
margin: 0px 5px 0px 0px;
- color: theme-color("success");
+ color: $success;
}
diff --git a/oioioi/base/static/scss/_markdown-editor.scss b/oioioi/base/static/scss/_markdown-editor.scss
index 4c92db244..94b0fbac4 100644
--- a/oioioi/base/static/scss/_markdown-editor.scss
+++ b/oioioi/base/static/scss/_markdown-editor.scss
@@ -2,7 +2,7 @@ $markdown-editor-padding: 10px !default;
// Fixes markdown editor styles
-.form-group .md-editor > textarea,
+.mb-3 .md-editor > textarea,
.md-preview {
padding: $markdown-editor-padding;
}
diff --git a/oioioi/base/static/scss/_navbar.scss b/oioioi/base/static/scss/_navbar.scss
index 0ca10888e..ed17d0a5e 100644
--- a/oioioi/base/static/scss/_navbar.scss
+++ b/oioioi/base/static/scss/_navbar.scss
@@ -18,8 +18,8 @@ $oioioi-navbar-highlighted-color: #fff !default;
$oioioi-navbar-avatar-size: 25px !default;
// Special case navbar colors
-$oioioi-navbar-time-changed-background: darken(theme-color("primary"), 20) !default;
-$oioioi-navbar-user-changed-background: darken(theme-color("danger"), 20) !default;
+$oioioi-navbar-time-changed-background: darken($primary, 20) !default;
+$oioioi-navbar-user-changed-background: darken($danger, 20) !default;
// Breakpoint at which admin badges get shrunk to save some space
$oioioi-navbar-badge-lg-width: 80px !default;
@@ -166,7 +166,7 @@ body {
// Large screens
// * Badges get shrunk
-@include media-breakpoint-down(lg) {
+@include media-breakpoint-down(xl) {
.oioioi-navbar,
.oioioi-navbar > .oioioi-navbar__extra,
.oioioi-navbar__menu-uncollapsed {
@@ -183,7 +183,7 @@ body {
// * Contest picker max width decreases
// * Username and badges gets hidden (only icons)
// * Countdown text padding gets reduced to 0
-@include media-breakpoint-down(md) {
+@include media-breakpoint-down(lg) {
.oioioi-navbar {
> .oioioi-navbar__menu {
display: block;
@@ -229,7 +229,7 @@ body {
// Small screens
// * Navbar extras gets hidden
// * Dropdown menus gets 100% width
-@include media-breakpoint-down(sm) {
+@include media-breakpoint-down(md) {
.oioioi-navbar {
> .oioioi-navbar__extra {
display: none;
@@ -269,7 +269,7 @@ body {
// Extra-small screens
// * Username/login text gets hidden (only icon)
// * Navbar padding gets removed
-@include media-breakpoint-down(xs) {
+@include media-breakpoint-down(sm) {
.oioioi-navbar {
padding: 0;
> .oioioi-navbar__user .username {
diff --git a/oioioi/base/static/scss/_table.scss b/oioioi/base/static/scss/_table.scss
index 9854b0e46..93b16bedd 100644
--- a/oioioi/base/static/scss/_table.scss
+++ b/oioioi/base/static/scss/_table.scss
@@ -17,7 +17,7 @@ $oioioi-table-narrow-max-width: map-get($grid-breakpoints, "md") !default;
max-width: $oioioi-table-narrow-max-width;
}
-@include media-breakpoint-down(sm) {
+@include media-breakpoint-down(md) {
.table--narrow {
max-width: none;
}
diff --git a/oioioi/base/static/tempus-dominus/jQuery-provider.min.js b/oioioi/base/static/tempus-dominus/jQuery-provider.min.js
new file mode 100644
index 000000000..c2b0eadd2
--- /dev/null
+++ b/oioioi/base/static/tempus-dominus/jQuery-provider.min.js
@@ -0,0 +1,6 @@
+/*!
+ * Tempus Dominus v6.7.7 (https://getdatepicker.com/)
+ * Copyright 2013-2021 Jonathan Peterson
+ * Licensed under MIT (https://github.com/Eonasdan/tempus-dominus/blob/master/LICENSE)
+ */
+tempusDominus.jQueryInterface=function(e,t){return 1===this.length?tempusDominus.jQueryHandleThis(this,e,t):this.each((function(){tempusDominus.jQueryHandleThis(this,e,t)}))},tempusDominus.jQueryHandleThis=function(e,t,n){let s=$(e).data(tempusDominus.Namespace.dataKey);if("object"==typeof t&&(t=$.extend({},tempusDominus.DefaultOptions,t)),s||(s=new tempusDominus.TempusDominus($(e)[0],t),$(e).data(tempusDominus.Namespace.dataKey,s)),"string"==typeof t){if(void 0===s[t])throw new Error(`No method named "${t}"`);if(void 0===n)return s[t]();{"date"===t&&(s.isDateUpdateThroughDateOptionFromClientCode=!0);const e=s[t](n);return s.isDateUpdateThroughDateOptionFromClientCode=!1,e}}},tempusDominus.getSelectorFromElement=function(e){let t,n=e.data("target");return n||(n=e.attr("href")||"",n=/^#[a-z]/i.test(n)?n:null),t=$(n),0===t.length?e:(t.data(tempusDominus.Namespace.dataKey)||$.extend({},t.data(),$(this).data()),t)},$(document).on(`click${tempusDominus.Namespace.events.key}.data-api`,`[data-toggle="${tempusDominus.Namespace.dataKey}"]`,(function(){const e=$(this),t=tempusDominus.getSelectorFromElement(e),n=t.data(tempusDominus.Namespace.dataKey);0!==t.length&&(n._options.allowInputToggle&&e.is('input[data-toggle="datetimepicker"]')||tempusDominus.jQueryInterface.call(t,"toggle"))})).on(tempusDominus.Namespace.events.change,`.${tempusDominus.Namespace.NAME}-input`,(function(e){const t=tempusDominus.getSelectorFromElement($(this));0===t.length||e.isInit||tempusDominus.jQueryInterface.call(t,"_change",e)})).on(tempusDominus.Namespace.events.blur,`.${tempusDominus.Namespace.NAME}-input`,(function(e){const t=tempusDominus.getSelectorFromElement($(this)),n=t.data(tempusDominus.Namespace.dataKey);0!==t.length&&(n._options.debug||window.debug||tempusDominus.jQueryInterface.call(t,"hide",e))})).on(tempusDominus.Namespace.events.focus,`.${tempusDominus.Namespace.NAME}-input`,(function(e){const t=tempusDominus.getSelectorFromElement($(this)),n=t.data(tempusDominus.Namespace.dataKey);0!==t.length&&n._options.allowInputToggle&&tempusDominus.jQueryInterface.call(t,"show",e)}));const e="tempusDominus",t=$.fn[e];$.fn[e]=tempusDominus.jQueryInterface,$.fn[e].Constructor=tempusDominus.TempusDominus,$.fn[e].noConflict=function(){return $.fn[e]=t,tempusDominus.jQueryInterface};
diff --git a/oioioi/base/static/tempus-dominus/pl.js b/oioioi/base/static/tempus-dominus/pl.js
new file mode 100644
index 000000000..d0c3cbc40
--- /dev/null
+++ b/oioioi/base/static/tempus-dominus/pl.js
@@ -0,0 +1,47 @@
+/*!
+ * Tempus Dominus v6.7.7 (https://getdatepicker.com/)
+ * Copyright 2013-2023 Jonathan Peterson
+ * Licensed under MIT (https://github.com/Eonasdan/tempus-dominus/blob/master/LICENSE)
+ */
+(function(g,f){typeof exports==='object'&&typeof module!=='undefined'?f(exports):typeof define==='function'&&define.amd?define(['exports'],f):(g=typeof globalThis!=='undefined'?globalThis:g||self,f((g.tempusDominus=g.tempusDominus||{},g.tempusDominus.locales=g.tempusDominus.locales||{},g.tempusDominus.locales.pl={})));})(this,(function(exports){'use strict';const name = 'pl';
+const localization = {
+ today: 'Dzisiaj',
+ clear: 'Wyczyść',
+ close: 'Zamknij',
+ selectMonth: 'Wybierz miesiąc',
+ previousMonth: 'Poprzedni miesiąc',
+ nextMonth: 'Następny miesiąc',
+ selectYear: 'Wybierz rok',
+ previousYear: 'Poprzedni rok',
+ nextYear: 'Następny rok',
+ selectDecade: 'Wybierz dekadę',
+ previousDecade: 'Poprzednia dekada',
+ nextDecade: 'Następna dekada',
+ previousCentury: 'Poprzednie stulecie',
+ nextCentury: 'Następne stulecie',
+ pickHour: 'Wybierz godzinę',
+ incrementHour: 'Kolejna godzina',
+ decrementHour: 'Poprzednia godzina',
+ pickMinute: 'Wybierz minutę',
+ incrementMinute: 'Kolejna minuta',
+ decrementMinute: 'Poprzednia minuta',
+ pickSecond: 'Wybierz sekundę',
+ incrementSecond: 'Kolejna sekunda',
+ decrementSecond: 'Poprzednia sekunda',
+ toggleMeridiem: 'Przełącz porę dnia',
+ selectTime: 'Ustaw godzinę',
+ selectDate: 'Ustaw datę',
+ dayViewHeaderFormat: { month: 'long', year: '2-digit' },
+ locale: 'pl',
+ startOfTheWeek: 1,
+ dateFormats: {
+ LT: 'HH:mm',
+ LTS: 'HH:mm:ss',
+ L: 'dd.MM.yyyy',
+ LL: 'd MMMM yyyy',
+ LLL: 'd MMMM yyyy HH:mm',
+ LLLL: 'dddd, d MMMM yyyy HH:mm',
+ },
+ ordinal: (n) => `${n}.`,
+ format: 'L LT',
+};exports.localization=localization;exports.name=name;Object.defineProperty(exports,'__esModule',{value:true});}));
\ No newline at end of file
diff --git a/oioioi/base/static/tempus-dominus/tempus-dominus.min.css b/oioioi/base/static/tempus-dominus/tempus-dominus.min.css
new file mode 100644
index 000000000..062b95926
--- /dev/null
+++ b/oioioi/base/static/tempus-dominus/tempus-dominus.min.css
@@ -0,0 +1 @@
+.tempus-dominus-widget [data-action]:after,.visually-hidden{clip:rect(0,0,0,0)!important;border:0!important;height:1px!important;margin:-1px!important;overflow:hidden!important;padding:0!important;position:absolute!important;white-space:nowrap!important;width:1px!important}.tempus-dominus-widget{border-radius:4px;box-shadow:0 2px 4px -1px rgba(0,0,0,.2),0 4px 5px 0 rgba(0,0,0,.14),0 1px 10px 0 rgba(0,0,0,.12);display:none;list-style:none;padding:4px;width:19rem;z-index:9999}.tempus-dominus-widget.calendarWeeks{width:21rem}.tempus-dominus-widget.calendarWeeks .date-container-days{grid-auto-columns:12.5%;grid-template-areas:"a a a a a a a a"}.tempus-dominus-widget [data-action]{cursor:pointer}.tempus-dominus-widget [data-action]:after{content:attr(title)}.tempus-dominus-widget [data-action].disabled,.tempus-dominus-widget [data-action].disabled:hover{background:none;cursor:not-allowed}.tempus-dominus-widget .arrow{display:none}.tempus-dominus-widget.show{display:block}.tempus-dominus-widget.show.date-container{min-height:315px}.tempus-dominus-widget.show.time-container{min-height:217px}.tempus-dominus-widget .td-collapse:not(.show){display:none}.tempus-dominus-widget .td-collapsing{height:0;overflow:hidden;transition:height .35s ease}@media (min-width:576px){.tempus-dominus-widget.timepicker-sbs{width:38em}}@media (min-width:768px){.tempus-dominus-widget.timepicker-sbs{width:38em}}@media (min-width:992px){.tempus-dominus-widget.timepicker-sbs{width:38em}}.tempus-dominus-widget.timepicker-sbs .td-row{display:flex}.tempus-dominus-widget.timepicker-sbs .td-row .td-half{flex:0 0 auto;width:50%}.tempus-dominus-widget div[data-action]:active{box-shadow:none}.tempus-dominus-widget .timepicker-hour,.tempus-dominus-widget .timepicker-minute,.tempus-dominus-widget .timepicker-second{font-size:1.2em;font-weight:700;margin:0;width:54px}.tempus-dominus-widget button[data-action]{padding:6px}.tempus-dominus-widget .toggleMeridiem{height:38px;text-align:center}.tempus-dominus-widget .calendar-header{display:grid;font-weight:700;grid-template-areas:"a a a";margin-bottom:10px}.tempus-dominus-widget .calendar-header .next{padding-right:10px;text-align:right}.tempus-dominus-widget .calendar-header .previous{padding-left:10px;text-align:left}.tempus-dominus-widget .calendar-header .picker-switch{text-align:center}.tempus-dominus-widget .toolbar{display:grid;grid-auto-flow:column;grid-auto-rows:40px}.tempus-dominus-widget .toolbar div{align-items:center;border-radius:999px;box-sizing:border-box;display:flex;justify-content:center}.tempus-dominus-widget .date-container-days{display:grid;grid-auto-columns:14.2857142857%;grid-auto-rows:40px;grid-template-areas:"a a a a a a a"}.tempus-dominus-widget .date-container-days .range-in{background-color:#01419e!important;border:none;border-radius:0!important;box-shadow:-5px 0 0 #01419e,5px 0 0 #01419e}.tempus-dominus-widget .date-container-days .range-end{border-radius:0 50px 50px 0!important}.tempus-dominus-widget .date-container-days .range-start{border-radius:50px 0 0 50px!important}.tempus-dominus-widget .date-container-days .dow{align-items:center;justify-content:center;text-align:center}.tempus-dominus-widget .date-container-days .cw{align-items:center;cursor:default;display:flex;font-size:.8em;height:90%;justify-content:center;line-height:20px;width:90%}.tempus-dominus-widget .date-container-decades,.tempus-dominus-widget .date-container-months,.tempus-dominus-widget .date-container-years{display:grid;grid-auto-rows:calc(2.71429rem - 1.14286px);grid-template-areas:"a a a"}.tempus-dominus-widget .time-container-hour,.tempus-dominus-widget .time-container-minute,.tempus-dominus-widget .time-container-second{display:grid;grid-auto-rows:calc(2.71429rem - 1.14286px);grid-template-areas:"a a a a"}.tempus-dominus-widget .time-container-clock{display:grid;grid-auto-rows:calc(2.71429rem - 1.14286px)}.tempus-dominus-widget .time-container-clock .no-highlight{align-items:center;display:flex;height:90%;justify-content:center;width:90%}.tempus-dominus-widget .date-container-days div:not(.no-highlight),.tempus-dominus-widget .date-container-decades div:not(.no-highlight),.tempus-dominus-widget .date-container-months div:not(.no-highlight),.tempus-dominus-widget .date-container-years div:not(.no-highlight),.tempus-dominus-widget .time-container-clock div:not(.no-highlight),.tempus-dominus-widget .time-container-hour div:not(.no-highlight),.tempus-dominus-widget .time-container-minute div:not(.no-highlight),.tempus-dominus-widget .time-container-second div:not(.no-highlight){align-items:center;border-radius:999px;box-sizing:border-box;display:flex;height:90%;justify-content:center;width:90%}.tempus-dominus-widget .date-container-days div:not(.no-highlight).disabled,.tempus-dominus-widget .date-container-days div:not(.no-highlight).disabled:hover,.tempus-dominus-widget .date-container-decades div:not(.no-highlight).disabled,.tempus-dominus-widget .date-container-decades div:not(.no-highlight).disabled:hover,.tempus-dominus-widget .date-container-months div:not(.no-highlight).disabled,.tempus-dominus-widget .date-container-months div:not(.no-highlight).disabled:hover,.tempus-dominus-widget .date-container-years div:not(.no-highlight).disabled,.tempus-dominus-widget .date-container-years div:not(.no-highlight).disabled:hover,.tempus-dominus-widget .time-container-clock div:not(.no-highlight).disabled,.tempus-dominus-widget .time-container-clock div:not(.no-highlight).disabled:hover,.tempus-dominus-widget .time-container-hour div:not(.no-highlight).disabled,.tempus-dominus-widget .time-container-hour div:not(.no-highlight).disabled:hover,.tempus-dominus-widget .time-container-minute div:not(.no-highlight).disabled,.tempus-dominus-widget .time-container-minute div:not(.no-highlight).disabled:hover,.tempus-dominus-widget .time-container-second div:not(.no-highlight).disabled,.tempus-dominus-widget .time-container-second div:not(.no-highlight).disabled:hover{background:none;cursor:not-allowed}.tempus-dominus-widget .date-container-days div:not(.no-highlight).today,.tempus-dominus-widget .date-container-decades div:not(.no-highlight).today,.tempus-dominus-widget .date-container-months div:not(.no-highlight).today,.tempus-dominus-widget .date-container-years div:not(.no-highlight).today,.tempus-dominus-widget .time-container-clock div:not(.no-highlight).today,.tempus-dominus-widget .time-container-hour div:not(.no-highlight).today,.tempus-dominus-widget .time-container-minute div:not(.no-highlight).today,.tempus-dominus-widget .time-container-second div:not(.no-highlight).today{position:relative}.tempus-dominus-widget .date-container-days div:not(.no-highlight).today:before,.tempus-dominus-widget .date-container-decades div:not(.no-highlight).today:before,.tempus-dominus-widget .date-container-months div:not(.no-highlight).today:before,.tempus-dominus-widget .date-container-years div:not(.no-highlight).today:before,.tempus-dominus-widget .time-container-clock div:not(.no-highlight).today:before,.tempus-dominus-widget .time-container-hour div:not(.no-highlight).today:before,.tempus-dominus-widget .time-container-minute div:not(.no-highlight).today:before,.tempus-dominus-widget .time-container-second div:not(.no-highlight).today:before{border:solid transparent;border-width:0 0 7px 7px;bottom:6px;content:"";display:inline-block;position:absolute;right:6px}.tempus-dominus-widget .time-container{margin-bottom:.5rem}.tempus-dominus-widget button{border-radius:.25rem;cursor:pointer;display:inline-block;font-size:1rem;font-weight:400;line-height:1.5;padding:.375rem .75rem;text-align:center;text-decoration:none;transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;-webkit-user-select:none;-moz-user-select:none;user-select:none;vertical-align:middle}.tempus-dominus-widget.tempus-dominus-widget-readonly table td [data-action=decrementHours],.tempus-dominus-widget.tempus-dominus-widget-readonly table td [data-action=decrementMinutes],.tempus-dominus-widget.tempus-dominus-widget-readonly table td [data-action=decrementSeconds],.tempus-dominus-widget.tempus-dominus-widget-readonly table td [data-action=incrementHours],.tempus-dominus-widget.tempus-dominus-widget-readonly table td [data-action=incrementMinutes],.tempus-dominus-widget.tempus-dominus-widget-readonly table td [data-action=incrementSeconds],.tempus-dominus-widget.tempus-dominus-widget-readonly table td [data-action=showHours],.tempus-dominus-widget.tempus-dominus-widget-readonly table td [data-action=showMinutes],.tempus-dominus-widget.tempus-dominus-widget-readonly table td [data-action=showSeconds],.tempus-dominus-widget.tempus-dominus-widget-readonly table td [data-action=togglePeriod],.tempus-dominus-widget.tempus-dominus-widget-readonly table td.day,.tempus-dominus-widget.tempus-dominus-widget-readonly table td.hour,.tempus-dominus-widget.tempus-dominus-widget-readonly table td.minute,.tempus-dominus-widget.tempus-dominus-widget-readonly table td.second{cursor:default;pointer-events:none}.tempus-dominus-widget.tempus-dominus-widget-readonly table td [data-action=decrementHours]:hover,.tempus-dominus-widget.tempus-dominus-widget-readonly table td [data-action=decrementMinutes]:hover,.tempus-dominus-widget.tempus-dominus-widget-readonly table td [data-action=decrementSeconds]:hover,.tempus-dominus-widget.tempus-dominus-widget-readonly table td [data-action=incrementHours]:hover,.tempus-dominus-widget.tempus-dominus-widget-readonly table td [data-action=incrementMinutes]:hover,.tempus-dominus-widget.tempus-dominus-widget-readonly table td [data-action=incrementSeconds]:hover,.tempus-dominus-widget.tempus-dominus-widget-readonly table td [data-action=showHours]:hover,.tempus-dominus-widget.tempus-dominus-widget-readonly table td [data-action=showMinutes]:hover,.tempus-dominus-widget.tempus-dominus-widget-readonly table td [data-action=showSeconds]:hover,.tempus-dominus-widget.tempus-dominus-widget-readonly table td [data-action=togglePeriod]:hover,.tempus-dominus-widget.tempus-dominus-widget-readonly table td.day:hover,.tempus-dominus-widget.tempus-dominus-widget-readonly table td.hour:hover,.tempus-dominus-widget.tempus-dominus-widget-readonly table td.minute:hover,.tempus-dominus-widget.tempus-dominus-widget-readonly table td.second:hover{background:none}.tempus-dominus-widget.light{background-color:#fff;color:#000}.tempus-dominus-widget.light [data-action].disabled,.tempus-dominus-widget.light [data-action].disabled:hover{color:#6c757d}.tempus-dominus-widget.light .toolbar div:hover{background:#e9ecef}.tempus-dominus-widget.light .date-container-days .dow{color:rgba(0,0,0,.5)}.tempus-dominus-widget.light .date-container-days .cw{color:rgba(0,0,0,.38)}.tempus-dominus-widget.light .date-container-days div:not(.no-highlight):hover,.tempus-dominus-widget.light .date-container-decades div:not(.no-highlight):hover,.tempus-dominus-widget.light .date-container-months div:not(.no-highlight):hover,.tempus-dominus-widget.light .date-container-years div:not(.no-highlight):hover,.tempus-dominus-widget.light .time-container-clock div:not(.no-highlight):hover,.tempus-dominus-widget.light .time-container-hour div:not(.no-highlight):hover,.tempus-dominus-widget.light .time-container-minute div:not(.no-highlight):hover,.tempus-dominus-widget.light .time-container-second div:not(.no-highlight):hover{background:#e9ecef}.tempus-dominus-widget.light .date-container-days div.range-end:not(.no-highlight),.tempus-dominus-widget.light .date-container-days div.range-in:not(.no-highlight),.tempus-dominus-widget.light .date-container-days div.range-start:not(.no-highlight),.tempus-dominus-widget.light .date-container-days div:not(.no-highlight).active,.tempus-dominus-widget.light .date-container-decades div:not(.no-highlight).active,.tempus-dominus-widget.light .date-container-months div:not(.no-highlight).active,.tempus-dominus-widget.light .date-container-years div:not(.no-highlight).active,.tempus-dominus-widget.light .time-container-clock div:not(.no-highlight).active,.tempus-dominus-widget.light .time-container-hour div:not(.no-highlight).active,.tempus-dominus-widget.light .time-container-minute div:not(.no-highlight).active,.tempus-dominus-widget.light .time-container-second div:not(.no-highlight).active{background-color:#0d6efd;color:#fff;text-shadow:0 -1px 0 rgba(0,0,0,.25)}.tempus-dominus-widget.light .date-container-days .date-container-decades div.range-end:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-days .date-container-decades div.range-end:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-days .date-container-decades div.range-in:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-days .date-container-decades div.range-in:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-days .date-container-decades div.range-start:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-days .date-container-decades div.range-start:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-days .date-container-months div.range-end:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-days .date-container-months div.range-end:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-days .date-container-months div.range-in:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-days .date-container-months div.range-in:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-days .date-container-months div.range-start:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-days .date-container-months div.range-start:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-days .date-container-years div.range-end:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-days .date-container-years div.range-end:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-days .date-container-years div.range-in:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-days .date-container-years div.range-in:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-days .date-container-years div.range-start:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-days .date-container-years div.range-start:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-days .time-container-clock div.range-end:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-days .time-container-clock div.range-end:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-days .time-container-clock div.range-in:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-days .time-container-clock div.range-in:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-days .time-container-clock div.range-start:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-days .time-container-clock div.range-start:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-days .time-container-hour div.range-end:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-days .time-container-hour div.range-end:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-days .time-container-hour div.range-in:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-days .time-container-hour div.range-in:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-days .time-container-hour div.range-start:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-days .time-container-hour div.range-start:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-days .time-container-minute div.range-end:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-days .time-container-minute div.range-end:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-days .time-container-minute div.range-in:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-days .time-container-minute div.range-in:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-days .time-container-minute div.range-start:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-days .time-container-minute div.range-start:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-days .time-container-second div.range-end:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-days .time-container-second div.range-end:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-days .time-container-second div.range-in:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-days .time-container-second div.range-in:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-days .time-container-second div.range-start:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-days .time-container-second div.range-start:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-days div.range-end:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-days div.range-end:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-days div.range-in:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-days div.range-in:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-days div.range-start:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-days div.range-start:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-days div:not(.no-highlight).active.new,.tempus-dominus-widget.light .date-container-days div:not(.no-highlight).active.old,.tempus-dominus-widget.light .date-container-decades .date-container-days div.range-end:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-decades .date-container-days div.range-end:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-decades .date-container-days div.range-in:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-decades .date-container-days div.range-in:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-decades .date-container-days div.range-start:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-decades .date-container-days div.range-start:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-decades div:not(.no-highlight).active.new,.tempus-dominus-widget.light .date-container-decades div:not(.no-highlight).active.old,.tempus-dominus-widget.light .date-container-months .date-container-days div.range-end:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-months .date-container-days div.range-end:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-months .date-container-days div.range-in:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-months .date-container-days div.range-in:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-months .date-container-days div.range-start:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-months .date-container-days div.range-start:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-months div:not(.no-highlight).active.new,.tempus-dominus-widget.light .date-container-months div:not(.no-highlight).active.old,.tempus-dominus-widget.light .date-container-years .date-container-days div.range-end:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-years .date-container-days div.range-end:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-years .date-container-days div.range-in:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-years .date-container-days div.range-in:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-years .date-container-days div.range-start:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-years .date-container-days div.range-start:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-years div:not(.no-highlight).active.new,.tempus-dominus-widget.light .date-container-years div:not(.no-highlight).active.old,.tempus-dominus-widget.light .time-container-clock .date-container-days div.range-end:not(.no-highlight).new,.tempus-dominus-widget.light .time-container-clock .date-container-days div.range-end:not(.no-highlight).old,.tempus-dominus-widget.light .time-container-clock .date-container-days div.range-in:not(.no-highlight).new,.tempus-dominus-widget.light .time-container-clock .date-container-days div.range-in:not(.no-highlight).old,.tempus-dominus-widget.light .time-container-clock .date-container-days div.range-start:not(.no-highlight).new,.tempus-dominus-widget.light .time-container-clock .date-container-days div.range-start:not(.no-highlight).old,.tempus-dominus-widget.light .time-container-clock div:not(.no-highlight).active.new,.tempus-dominus-widget.light .time-container-clock div:not(.no-highlight).active.old,.tempus-dominus-widget.light .time-container-hour .date-container-days div.range-end:not(.no-highlight).new,.tempus-dominus-widget.light .time-container-hour .date-container-days div.range-end:not(.no-highlight).old,.tempus-dominus-widget.light .time-container-hour .date-container-days div.range-in:not(.no-highlight).new,.tempus-dominus-widget.light .time-container-hour .date-container-days div.range-in:not(.no-highlight).old,.tempus-dominus-widget.light .time-container-hour .date-container-days div.range-start:not(.no-highlight).new,.tempus-dominus-widget.light .time-container-hour .date-container-days div.range-start:not(.no-highlight).old,.tempus-dominus-widget.light .time-container-hour div:not(.no-highlight).active.new,.tempus-dominus-widget.light .time-container-hour div:not(.no-highlight).active.old,.tempus-dominus-widget.light .time-container-minute .date-container-days div.range-end:not(.no-highlight).new,.tempus-dominus-widget.light .time-container-minute .date-container-days div.range-end:not(.no-highlight).old,.tempus-dominus-widget.light .time-container-minute .date-container-days div.range-in:not(.no-highlight).new,.tempus-dominus-widget.light .time-container-minute .date-container-days div.range-in:not(.no-highlight).old,.tempus-dominus-widget.light .time-container-minute .date-container-days div.range-start:not(.no-highlight).new,.tempus-dominus-widget.light .time-container-minute .date-container-days div.range-start:not(.no-highlight).old,.tempus-dominus-widget.light .time-container-minute div:not(.no-highlight).active.new,.tempus-dominus-widget.light .time-container-minute div:not(.no-highlight).active.old,.tempus-dominus-widget.light .time-container-second .date-container-days div.range-end:not(.no-highlight).new,.tempus-dominus-widget.light .time-container-second .date-container-days div.range-end:not(.no-highlight).old,.tempus-dominus-widget.light .time-container-second .date-container-days div.range-in:not(.no-highlight).new,.tempus-dominus-widget.light .time-container-second .date-container-days div.range-in:not(.no-highlight).old,.tempus-dominus-widget.light .time-container-second .date-container-days div.range-start:not(.no-highlight).new,.tempus-dominus-widget.light .time-container-second .date-container-days div.range-start:not(.no-highlight).old,.tempus-dominus-widget.light .time-container-second div:not(.no-highlight).active.new,.tempus-dominus-widget.light .time-container-second div:not(.no-highlight).active.old{color:#fff}.tempus-dominus-widget.light .date-container-days div.range-end:not(.no-highlight).today:before,.tempus-dominus-widget.light .date-container-days div.range-in:not(.no-highlight).today:before,.tempus-dominus-widget.light .date-container-days div.range-start:not(.no-highlight).today:before,.tempus-dominus-widget.light .date-container-days div:not(.no-highlight).active.today:before,.tempus-dominus-widget.light .date-container-decades div:not(.no-highlight).active.today:before,.tempus-dominus-widget.light .date-container-months div:not(.no-highlight).active.today:before,.tempus-dominus-widget.light .date-container-years div:not(.no-highlight).active.today:before,.tempus-dominus-widget.light .time-container-clock div:not(.no-highlight).active.today:before,.tempus-dominus-widget.light .time-container-hour div:not(.no-highlight).active.today:before,.tempus-dominus-widget.light .time-container-minute div:not(.no-highlight).active.today:before,.tempus-dominus-widget.light .time-container-second div:not(.no-highlight).active.today:before{border-bottom-color:#fff}.tempus-dominus-widget.light .date-container-days div:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-days div:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-decades div:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-decades div:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-months div:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-months div:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-years div:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-years div:not(.no-highlight).old,.tempus-dominus-widget.light .time-container-clock div:not(.no-highlight).new,.tempus-dominus-widget.light .time-container-clock div:not(.no-highlight).old,.tempus-dominus-widget.light .time-container-hour div:not(.no-highlight).new,.tempus-dominus-widget.light .time-container-hour div:not(.no-highlight).old,.tempus-dominus-widget.light .time-container-minute div:not(.no-highlight).new,.tempus-dominus-widget.light .time-container-minute div:not(.no-highlight).old,.tempus-dominus-widget.light .time-container-second div:not(.no-highlight).new,.tempus-dominus-widget.light .time-container-second div:not(.no-highlight).old{color:rgba(0,0,0,.38)}.tempus-dominus-widget.light .date-container-days div:not(.no-highlight).disabled,.tempus-dominus-widget.light .date-container-days div:not(.no-highlight).disabled:hover,.tempus-dominus-widget.light .date-container-decades div:not(.no-highlight).disabled,.tempus-dominus-widget.light .date-container-decades div:not(.no-highlight).disabled:hover,.tempus-dominus-widget.light .date-container-months div:not(.no-highlight).disabled,.tempus-dominus-widget.light .date-container-months div:not(.no-highlight).disabled:hover,.tempus-dominus-widget.light .date-container-years div:not(.no-highlight).disabled,.tempus-dominus-widget.light .date-container-years div:not(.no-highlight).disabled:hover,.tempus-dominus-widget.light .time-container-clock div:not(.no-highlight).disabled,.tempus-dominus-widget.light .time-container-clock div:not(.no-highlight).disabled:hover,.tempus-dominus-widget.light .time-container-hour div:not(.no-highlight).disabled,.tempus-dominus-widget.light .time-container-hour div:not(.no-highlight).disabled:hover,.tempus-dominus-widget.light .time-container-minute div:not(.no-highlight).disabled,.tempus-dominus-widget.light .time-container-minute div:not(.no-highlight).disabled:hover,.tempus-dominus-widget.light .time-container-second div:not(.no-highlight).disabled,.tempus-dominus-widget.light .time-container-second div:not(.no-highlight).disabled:hover{color:#6c757d}.tempus-dominus-widget.light .date-container-days div:not(.no-highlight).today:before,.tempus-dominus-widget.light .date-container-decades div:not(.no-highlight).today:before,.tempus-dominus-widget.light .date-container-months div:not(.no-highlight).today:before,.tempus-dominus-widget.light .date-container-years div:not(.no-highlight).today:before,.tempus-dominus-widget.light .time-container-clock div:not(.no-highlight).today:before,.tempus-dominus-widget.light .time-container-hour div:not(.no-highlight).today:before,.tempus-dominus-widget.light .time-container-minute div:not(.no-highlight).today:before,.tempus-dominus-widget.light .time-container-second div:not(.no-highlight).today:before{border-bottom-color:#0d6efd;border-top-color:rgba(0,0,0,.2)}.tempus-dominus-widget.light button{background-color:#0d6efd;border-color:#0d6efd;color:#fff}.tempus-dominus-widget.dark{background-color:#1b1b1b;color:#e3e3e3}.tempus-dominus-widget.dark [data-action].disabled,.tempus-dominus-widget.dark [data-action].disabled:hover{color:#6c757d}.tempus-dominus-widget.dark .toolbar div:hover{background:#232627}.tempus-dominus-widget.dark .date-container-days .dow{color:hsla(36,10%,90%,.5)}.tempus-dominus-widget.dark .date-container-days .range-in{background-color:#0071c7!important;box-shadow:-5px 0 0 #0071c7,5px 0 0 #0071c7}.tempus-dominus-widget.dark .date-container-days .cw{color:hsla(36,10%,90%,.38)}.tempus-dominus-widget.dark .date-container-days div:not(.no-highlight):hover,.tempus-dominus-widget.dark .date-container-decades div:not(.no-highlight):hover,.tempus-dominus-widget.dark .date-container-months div:not(.no-highlight):hover,.tempus-dominus-widget.dark .date-container-years div:not(.no-highlight):hover,.tempus-dominus-widget.dark .time-container-clock div:not(.no-highlight):hover,.tempus-dominus-widget.dark .time-container-hour div:not(.no-highlight):hover,.tempus-dominus-widget.dark .time-container-minute div:not(.no-highlight):hover,.tempus-dominus-widget.dark .time-container-second div:not(.no-highlight):hover{background:#232627}.tempus-dominus-widget.dark .date-container-days div.range-end:not(.no-highlight),.tempus-dominus-widget.dark .date-container-days div.range-in:not(.no-highlight),.tempus-dominus-widget.dark .date-container-days div.range-start:not(.no-highlight),.tempus-dominus-widget.dark .date-container-days div:not(.no-highlight).active,.tempus-dominus-widget.dark .date-container-decades div:not(.no-highlight).active,.tempus-dominus-widget.dark .date-container-months div:not(.no-highlight).active,.tempus-dominus-widget.dark .date-container-years div:not(.no-highlight).active,.tempus-dominus-widget.dark .time-container-clock div:not(.no-highlight).active,.tempus-dominus-widget.dark .time-container-hour div:not(.no-highlight).active,.tempus-dominus-widget.dark .time-container-minute div:not(.no-highlight).active,.tempus-dominus-widget.dark .time-container-second div:not(.no-highlight).active{background-color:#4db2ff;color:#fff;text-shadow:0 -1px 0 hsla(36,10%,90%,.25)}.tempus-dominus-widget.dark .date-container-days .date-container-decades div.range-end:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-days .date-container-decades div.range-end:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-days .date-container-decades div.range-in:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-days .date-container-decades div.range-in:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-days .date-container-decades div.range-start:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-days .date-container-decades div.range-start:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-days .date-container-months div.range-end:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-days .date-container-months div.range-end:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-days .date-container-months div.range-in:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-days .date-container-months div.range-in:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-days .date-container-months div.range-start:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-days .date-container-months div.range-start:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-days .date-container-years div.range-end:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-days .date-container-years div.range-end:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-days .date-container-years div.range-in:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-days .date-container-years div.range-in:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-days .date-container-years div.range-start:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-days .date-container-years div.range-start:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-days .time-container-clock div.range-end:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-days .time-container-clock div.range-end:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-days .time-container-clock div.range-in:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-days .time-container-clock div.range-in:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-days .time-container-clock div.range-start:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-days .time-container-clock div.range-start:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-days .time-container-hour div.range-end:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-days .time-container-hour div.range-end:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-days .time-container-hour div.range-in:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-days .time-container-hour div.range-in:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-days .time-container-hour div.range-start:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-days .time-container-hour div.range-start:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-days .time-container-minute div.range-end:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-days .time-container-minute div.range-end:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-days .time-container-minute div.range-in:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-days .time-container-minute div.range-in:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-days .time-container-minute div.range-start:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-days .time-container-minute div.range-start:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-days .time-container-second div.range-end:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-days .time-container-second div.range-end:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-days .time-container-second div.range-in:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-days .time-container-second div.range-in:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-days .time-container-second div.range-start:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-days .time-container-second div.range-start:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-days div.range-end:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-days div.range-end:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-days div.range-in:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-days div.range-in:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-days div.range-start:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-days div.range-start:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-days div:not(.no-highlight).active.new,.tempus-dominus-widget.dark .date-container-days div:not(.no-highlight).active.old,.tempus-dominus-widget.dark .date-container-decades .date-container-days div.range-end:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-decades .date-container-days div.range-end:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-decades .date-container-days div.range-in:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-decades .date-container-days div.range-in:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-decades .date-container-days div.range-start:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-decades .date-container-days div.range-start:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-decades div:not(.no-highlight).active.new,.tempus-dominus-widget.dark .date-container-decades div:not(.no-highlight).active.old,.tempus-dominus-widget.dark .date-container-months .date-container-days div.range-end:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-months .date-container-days div.range-end:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-months .date-container-days div.range-in:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-months .date-container-days div.range-in:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-months .date-container-days div.range-start:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-months .date-container-days div.range-start:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-months div:not(.no-highlight).active.new,.tempus-dominus-widget.dark .date-container-months div:not(.no-highlight).active.old,.tempus-dominus-widget.dark .date-container-years .date-container-days div.range-end:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-years .date-container-days div.range-end:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-years .date-container-days div.range-in:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-years .date-container-days div.range-in:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-years .date-container-days div.range-start:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-years .date-container-days div.range-start:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-years div:not(.no-highlight).active.new,.tempus-dominus-widget.dark .date-container-years div:not(.no-highlight).active.old,.tempus-dominus-widget.dark .time-container-clock .date-container-days div.range-end:not(.no-highlight).new,.tempus-dominus-widget.dark .time-container-clock .date-container-days div.range-end:not(.no-highlight).old,.tempus-dominus-widget.dark .time-container-clock .date-container-days div.range-in:not(.no-highlight).new,.tempus-dominus-widget.dark .time-container-clock .date-container-days div.range-in:not(.no-highlight).old,.tempus-dominus-widget.dark .time-container-clock .date-container-days div.range-start:not(.no-highlight).new,.tempus-dominus-widget.dark .time-container-clock .date-container-days div.range-start:not(.no-highlight).old,.tempus-dominus-widget.dark .time-container-clock div:not(.no-highlight).active.new,.tempus-dominus-widget.dark .time-container-clock div:not(.no-highlight).active.old,.tempus-dominus-widget.dark .time-container-hour .date-container-days div.range-end:not(.no-highlight).new,.tempus-dominus-widget.dark .time-container-hour .date-container-days div.range-end:not(.no-highlight).old,.tempus-dominus-widget.dark .time-container-hour .date-container-days div.range-in:not(.no-highlight).new,.tempus-dominus-widget.dark .time-container-hour .date-container-days div.range-in:not(.no-highlight).old,.tempus-dominus-widget.dark .time-container-hour .date-container-days div.range-start:not(.no-highlight).new,.tempus-dominus-widget.dark .time-container-hour .date-container-days div.range-start:not(.no-highlight).old,.tempus-dominus-widget.dark .time-container-hour div:not(.no-highlight).active.new,.tempus-dominus-widget.dark .time-container-hour div:not(.no-highlight).active.old,.tempus-dominus-widget.dark .time-container-minute .date-container-days div.range-end:not(.no-highlight).new,.tempus-dominus-widget.dark .time-container-minute .date-container-days div.range-end:not(.no-highlight).old,.tempus-dominus-widget.dark .time-container-minute .date-container-days div.range-in:not(.no-highlight).new,.tempus-dominus-widget.dark .time-container-minute .date-container-days div.range-in:not(.no-highlight).old,.tempus-dominus-widget.dark .time-container-minute .date-container-days div.range-start:not(.no-highlight).new,.tempus-dominus-widget.dark .time-container-minute .date-container-days div.range-start:not(.no-highlight).old,.tempus-dominus-widget.dark .time-container-minute div:not(.no-highlight).active.new,.tempus-dominus-widget.dark .time-container-minute div:not(.no-highlight).active.old,.tempus-dominus-widget.dark .time-container-second .date-container-days div.range-end:not(.no-highlight).new,.tempus-dominus-widget.dark .time-container-second .date-container-days div.range-end:not(.no-highlight).old,.tempus-dominus-widget.dark .time-container-second .date-container-days div.range-in:not(.no-highlight).new,.tempus-dominus-widget.dark .time-container-second .date-container-days div.range-in:not(.no-highlight).old,.tempus-dominus-widget.dark .time-container-second .date-container-days div.range-start:not(.no-highlight).new,.tempus-dominus-widget.dark .time-container-second .date-container-days div.range-start:not(.no-highlight).old,.tempus-dominus-widget.dark .time-container-second div:not(.no-highlight).active.new,.tempus-dominus-widget.dark .time-container-second div:not(.no-highlight).active.old{color:#fff}.tempus-dominus-widget.dark .date-container-days div.range-end:not(.no-highlight).today:before,.tempus-dominus-widget.dark .date-container-days div.range-in:not(.no-highlight).today:before,.tempus-dominus-widget.dark .date-container-days div.range-start:not(.no-highlight).today:before,.tempus-dominus-widget.dark .date-container-days div:not(.no-highlight).active.today:before,.tempus-dominus-widget.dark .date-container-decades div:not(.no-highlight).active.today:before,.tempus-dominus-widget.dark .date-container-months div:not(.no-highlight).active.today:before,.tempus-dominus-widget.dark .date-container-years div:not(.no-highlight).active.today:before,.tempus-dominus-widget.dark .time-container-clock div:not(.no-highlight).active.today:before,.tempus-dominus-widget.dark .time-container-hour div:not(.no-highlight).active.today:before,.tempus-dominus-widget.dark .time-container-minute div:not(.no-highlight).active.today:before,.tempus-dominus-widget.dark .time-container-second div:not(.no-highlight).active.today:before{border-bottom-color:#1b1b1b}.tempus-dominus-widget.dark .date-container-days div:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-days div:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-decades div:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-decades div:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-months div:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-months div:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-years div:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-years div:not(.no-highlight).old,.tempus-dominus-widget.dark .time-container-clock div:not(.no-highlight).new,.tempus-dominus-widget.dark .time-container-clock div:not(.no-highlight).old,.tempus-dominus-widget.dark .time-container-hour div:not(.no-highlight).new,.tempus-dominus-widget.dark .time-container-hour div:not(.no-highlight).old,.tempus-dominus-widget.dark .time-container-minute div:not(.no-highlight).new,.tempus-dominus-widget.dark .time-container-minute div:not(.no-highlight).old,.tempus-dominus-widget.dark .time-container-second div:not(.no-highlight).new,.tempus-dominus-widget.dark .time-container-second div:not(.no-highlight).old{color:hsla(36,10%,90%,.38)}.tempus-dominus-widget.dark .date-container-days div:not(.no-highlight).disabled,.tempus-dominus-widget.dark .date-container-days div:not(.no-highlight).disabled:hover,.tempus-dominus-widget.dark .date-container-decades div:not(.no-highlight).disabled,.tempus-dominus-widget.dark .date-container-decades div:not(.no-highlight).disabled:hover,.tempus-dominus-widget.dark .date-container-months div:not(.no-highlight).disabled,.tempus-dominus-widget.dark .date-container-months div:not(.no-highlight).disabled:hover,.tempus-dominus-widget.dark .date-container-years div:not(.no-highlight).disabled,.tempus-dominus-widget.dark .date-container-years div:not(.no-highlight).disabled:hover,.tempus-dominus-widget.dark .time-container-clock div:not(.no-highlight).disabled,.tempus-dominus-widget.dark .time-container-clock div:not(.no-highlight).disabled:hover,.tempus-dominus-widget.dark .time-container-hour div:not(.no-highlight).disabled,.tempus-dominus-widget.dark .time-container-hour div:not(.no-highlight).disabled:hover,.tempus-dominus-widget.dark .time-container-minute div:not(.no-highlight).disabled,.tempus-dominus-widget.dark .time-container-minute div:not(.no-highlight).disabled:hover,.tempus-dominus-widget.dark .time-container-second div:not(.no-highlight).disabled,.tempus-dominus-widget.dark .time-container-second div:not(.no-highlight).disabled:hover{color:#6c757d}.tempus-dominus-widget.dark .date-container-days div:not(.no-highlight).today:before,.tempus-dominus-widget.dark .date-container-decades div:not(.no-highlight).today:before,.tempus-dominus-widget.dark .date-container-months div:not(.no-highlight).today:before,.tempus-dominus-widget.dark .date-container-years div:not(.no-highlight).today:before,.tempus-dominus-widget.dark .time-container-clock div:not(.no-highlight).today:before,.tempus-dominus-widget.dark .time-container-hour div:not(.no-highlight).today:before,.tempus-dominus-widget.dark .time-container-minute div:not(.no-highlight).today:before,.tempus-dominus-widget.dark .time-container-second div:not(.no-highlight).today:before{border-bottom-color:#4db2ff;border-top-color:hsla(36,10%,90%,.2)}.tempus-dominus-widget.dark button{background-color:#4db2ff;border-color:#4db2ff;color:#fff}
\ No newline at end of file
diff --git a/oioioi/base/static/tempus-dominus/tempus-dominus.min.js b/oioioi/base/static/tempus-dominus/tempus-dominus.min.js
new file mode 100644
index 000000000..560a708b3
--- /dev/null
+++ b/oioioi/base/static/tempus-dominus/tempus-dominus.min.js
@@ -0,0 +1,6 @@
+/*!
+ * Tempus Dominus v6.7.7 (https://getdatepicker.com/)
+ * Copyright 2013-2023 Jonathan Peterson
+ * Licensed under MIT (https://github.com/Eonasdan/tempus-dominus/blob/master/LICENSE)
+ */
+!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports):"function"==typeof define&&define.amd?define(["exports"],e):e((t="undefined"!=typeof globalThis?globalThis:t||self).tempusDominus={})}(this,(function(t){"use strict";class e extends Error{}const s="tempus-dominus";class i{}i.NAME=s,i.dataKey="td",i.events=new class{constructor(){this.key=".td",this.change=`change${this.key}`,this.update=`update${this.key}`,this.error=`error${this.key}`,this.show=`show${this.key}`,this.hide=`hide${this.key}`,this.blur=`blur${this.key}`,this.focus=`focus${this.key}`,this.keyup=`keyup${this.key}`,this.keydown=`keydown${this.key}`}},i.css=new class{constructor(){this.widget=`${s}-widget`,this.calendarHeader="calendar-header",this.switch="picker-switch",this.toolbar="toolbar",this.noHighlight="no-highlight",this.sideBySide="timepicker-sbs",this.previous="previous",this.next="next",this.disabled="disabled",this.old="old",this.new="new",this.active="active",this.dateContainer="date-container",this.decadesContainer=`${this.dateContainer}-decades`,this.decade="decade",this.yearsContainer=`${this.dateContainer}-years`,this.year="year",this.monthsContainer=`${this.dateContainer}-months`,this.month="month",this.daysContainer=`${this.dateContainer}-days`,this.day="day",this.calendarWeeks="cw",this.dayOfTheWeek="dow",this.today="today",this.weekend="weekend",this.rangeIn="range-in",this.rangeStart="range-start",this.rangeEnd="range-end",this.timeContainer="time-container",this.separator="separator",this.clockContainer=`${this.timeContainer}-clock`,this.hourContainer=`${this.timeContainer}-hour`,this.minuteContainer=`${this.timeContainer}-minute`,this.secondContainer=`${this.timeContainer}-second`,this.hour="hour",this.minute="minute",this.second="second",this.toggleMeridiem="toggleMeridiem",this.show="show",this.collapsing="td-collapsing",this.collapse="td-collapse",this.inline="inline",this.lightTheme="light",this.darkTheme="dark",this.isDarkPreferredQuery="(prefers-color-scheme: dark)"}},i.errorMessages=new class{constructor(){this.base="TD:",this.failedToSetInvalidDate="Failed to set invalid date",this.failedToParseInput="Failed parse input field"}unexpectedOption(t){const s=new e(`${this.base} Unexpected option: ${t} does not match a known option.`);throw s.code=1,s}unexpectedOptions(t){const s=new e(`${this.base}: ${t.join(", ")}`);throw s.code=1,s}unexpectedOptionValue(t,s,i){const o=new e(`${this.base} Unexpected option value: ${t} does not accept a value of "${s}". Valid values are: ${i.join(", ")}`);throw o.code=2,o}typeMismatch(t,s,i){const o=new e(`${this.base} Mismatch types: ${t} has a type of ${s} instead of the required ${i}`);throw o.code=3,o}numbersOutOfRange(t,s,i){const o=new e(`${this.base} ${t} expected an array of number between ${s} and ${i}.`);throw o.code=4,o}failedToParseDate(t,s,i=!1){const o=new e(`${this.base} Could not correctly parse "${s}" to a date for ${t}.`);if(o.code=5,!i)throw o;console.warn(o)}mustProvideElement(){const t=new e(`${this.base} No element was provided.`);throw t.code=6,t}subscribeMismatch(){const t=new e(`${this.base} The subscribed events does not match the number of callbacks`);throw t.code=7,t}conflictingConfiguration(t){const s=new e(`${this.base} A configuration value conflicts with another rule. ${t}`);throw s.code=8,s}customDateFormatError(t){const s=new e(`${this.base} Custom Date Format: ${t}`);throw s.code=9,s}dateString(){console.warn(`${this.base} Using a string for date options is not recommended unless you specify an ISO string or use the customDateFormat plugin.`)}deprecatedWarning(t,e){console.warn(`${this.base} Warning ${t} is deprecated and will be removed in a future version. ${e}`)}throwError(t){const s=new e(`${this.base} ${t}`);throw s.code=9,s}};var o,a={...{locale:"default",hourCycle:void 0,dateFormats:{LTS:"h:mm:ss T",LT:"h:mm T",L:"MM/dd/yyyy",LL:"MMMM d, yyyy",LLL:"MMMM d, yyyy h:mm T",LLLL:"dddd, MMMM d, yyyy h:mm T"},ordinal:t=>{const e=["th","st","nd","rd"],s=t%100;return`[${t}${e[(s-20)%10]||e[s]||e[0]}]`},format:"L LT"}};t.Unit=void 0,(o=t.Unit||(t.Unit={})).seconds="seconds",o.minutes="minutes",o.hours="hours",o.date="date",o.month="month",o.year="year";const n={month:"2-digit",day:"2-digit",year:"numeric",hour:"2-digit",minute:"2-digit",second:"2-digit"},r=t=>{switch(t){case"date":return{dateStyle:"short"};case"month":return{month:"numeric",year:"numeric"};case"year":return{year:"numeric"}}},d=t=>{if(!t)return"h12";const e={hour:"2-digit",minute:"2-digit",numberingSystem:"latn"},s=(new l).setLocalization({locale:t});s.hours=0;const i=s.parts(void 0,e).hour;if("12"===i)return"h12";if("24"===i)return"h24";s.hours=23;const o=s.parts(void 0,e).hour;return"00"===i&&"11"===o?"h11":"00"===i&&"23"===o?"h23":void console.warn(`couldn't determine hour cycle for ${t}. start: ${i}. end: ${o}`)};class l extends Date{constructor(){super(...arguments),this.localization=a,this.nonLeapLadder=[0,31,59,90,120,151,181,212,243,273,304,334],this.leapLadder=[0,31,60,91,121,152,182,213,244,274,305,335],this.dateTimeRegex=/(\[[^[\]]*])|y{1,4}|M{1,4}|d{1,4}|H{1,2}|h{1,2}|t|T|m{1,2}|s{1,2}|f{3}/g,this.formattingTokens=/(\[[^[\]]*])|([-_:/.,()\s]+)|(T|t|yyyy|yy?|MM?M?M?|Do|dd?|hh?|HH?|mm?|ss?)/g,this.match2=/\d\d/,this.match3=/\d{3}/,this.match4=/\d{4}/,this.match1to2=/\d\d?/,this.matchSigned=/[+-]?\d+/,this.matchOffset=/[+-]\d\d:?(\d\d)?|Z/,this.matchWord=/[^\d_:/,\-()\s]+/,this.zoneExpressions=[this.matchOffset,(t,e)=>{t.offset=this.offsetFromString(e)}],this.expressions={t:[this.matchWord,(t,e)=>{t.afternoon=this.meridiemMatch(e)}],T:[this.matchWord,(t,e)=>{t.afternoon=this.meridiemMatch(e)}],fff:[this.match3,(t,e)=>{t.milliseconds=+e}],s:[this.match1to2,this.addInput("seconds")],ss:[this.match1to2,this.addInput("seconds")],m:[this.match1to2,this.addInput("minutes")],mm:[this.match1to2,this.addInput("minutes")],H:[this.match1to2,this.addInput("hours")],h:[this.match1to2,this.addInput("hours")],HH:[this.match1to2,this.addInput("hours")],hh:[this.match1to2,this.addInput("hours")],d:[this.match1to2,this.addInput("day")],dd:[this.match2,this.addInput("day")],Do:[this.matchWord,(t,e)=>{if([t.day]=e.match(/\d+/),this.localization.ordinal)for(let s=1;s<=31;s+=1)this.localization.ordinal(s).replace(/[[\]]/g,"")===e&&(t.day=s)}],M:[this.match1to2,this.addInput("month")],MM:[this.match2,this.addInput("month")],MMM:[this.matchWord,(t,e)=>{const s=this.getAllMonths(),i=(this.getAllMonths("short")||s.map((t=>t.slice(0,3)))).indexOf(e)+1;if(i<1)throw new Error;t.month=i%12||i}],MMMM:[this.matchWord,(t,e)=>{const s=this.getAllMonths().indexOf(e)+1;if(s<1)throw new Error;t.month=s%12||s}],y:[this.matchSigned,this.addInput("year")],yy:[this.match2,(t,e)=>{t.year=this.parseTwoDigitYear(e)}],yyyy:[this.match4,this.addInput("year")]}}setLocale(t){return this.localization||(this.localization=a,this.localization.locale=t),this}setLocalization(t){return this.localization=t,this}static convert(t,e="default",s=undefined){if(!t)throw new Error("A date is required");return s||((s=a).locale=e),new l(t.getFullYear(),t.getMonth(),t.getDate(),t.getHours(),t.getMinutes(),t.getSeconds(),t.getMilliseconds()).setLocalization(s)}get clone(){return new l(this.year,this.month,this.date,this.hours,this.minutes,this.seconds,this.getMilliseconds()).setLocalization(this.localization)}static isValid(t){return void 0!==t&&"null"!==JSON.stringify(t)&&t.constructor.name===l.name}startOf(e,s=0){if(void 0===this[e])throw new Error(`Unit '${e}' is not valid`);switch(e){case"seconds":this.setMilliseconds(0);break;case"minutes":this.setSeconds(0,0);break;case"hours":this.setMinutes(0,0,0);break;case"date":this.setHours(0,0,0,0);break;case"weekDay":{if(this.startOf(t.Unit.date),this.weekDay===s)break;let e=this.weekDay;0!==s&&0===this.weekDay&&(e=8-s),this.manipulate(s-e,t.Unit.date);break}case"month":this.startOf(t.Unit.date),this.setDate(1);break;case"year":this.startOf(t.Unit.date),this.setMonth(0,1)}return this}endOf(e,s=0){if(void 0===this[e])throw new Error(`Unit '${e}' is not valid`);switch(e){case"seconds":this.setMilliseconds(999);break;case"minutes":this.setSeconds(59,999);break;case"hours":this.setMinutes(59,59,999);break;case"date":this.setHours(23,59,59,999);break;case"weekDay":{this.endOf(t.Unit.date);const e=6+s;if(this.weekDay===e)break;this.manipulate(e-this.weekDay,t.Unit.date);break}case"month":this.endOf(t.Unit.date),this.manipulate(1,t.Unit.month),this.setDate(0);break;case"year":this.endOf(t.Unit.date),this.setMonth(11,31)}return this}manipulate(t,e){if(void 0===this[e])throw new Error(`Unit '${e}' is not valid`);return this[e]+=t,this}isBefore(t,e){if(!l.isValid(t))return!1;if(!e)return this.valueOf()t.valueOf();if(void 0===this[e])throw new Error(`Unit '${e}' is not valid`);return this.clone.startOf(e).valueOf()>t.clone.startOf(e).valueOf()}isSame(t,e){if(!l.isValid(t))return!1;if(!e)return this.valueOf()===t.valueOf();if(void 0===this[e])throw new Error(`Unit '${e}' is not valid`);return t=l.convert(t),this.clone.startOf(e).valueOf()===t.startOf(e).valueOf()}isBetween(t,e,s,i="()"){if(!l.isValid(t)||!l.isValid(e))return!1;if(s&&void 0===this[s])throw new Error(`Unit '${s}' is not valid`);const o="("===i[0],a=")"===i[1],n=o?this.isAfter(t,s):!this.isBefore(t,s),r=a?this.isBefore(e,s):!this.isAfter(e,s);return n&&r}parts(t=this.localization.locale,e={dateStyle:"full",timeStyle:"long"}){const s={};return new Intl.DateTimeFormat(t,e).formatToParts(this).filter((t=>"literal"!==t.type)).forEach((t=>s[t.type]=t.value)),s}get seconds(){return this.getSeconds()}set seconds(t){this.setSeconds(t)}get secondsFormatted(){return this.parts(void 0,n).second}get minutes(){return this.getMinutes()}set minutes(t){this.setMinutes(t)}get minutesFormatted(){return this.parts(void 0,n).minute}get hours(){return this.getHours()}set hours(t){this.setHours(t)}getHoursFormatted(t="h12"){return this.parts(void 0,{...n,hourCycle:t}).hour}meridiem(t=this.localization.locale){return new Intl.DateTimeFormat(t,{hour:"numeric",hour12:!0}).formatToParts(this).find((t=>"dayPeriod"===t.type))?.value}get date(){return this.getDate()}set date(t){this.setDate(t)}get dateFormatted(){return this.parts(void 0,n).day}get weekDay(){return this.getDay()}get month(){return this.getMonth()}set month(t){const e=new Date(this.year,t+1);e.setDate(0);const s=e.getDate();this.date>s&&(this.date=s),this.setMonth(t)}get monthFormatted(){return this.parts(void 0,n).month}get year(){return this.getFullYear()}set year(t){this.setFullYear(t)}get week(){const t=this.computeOrdinal(),e=this.getUTCDay();let s=Math.floor((t-e+10)/7);return s<1?s=this.weeksInWeekYear():s>this.weeksInWeekYear()&&(s=1),s}weeksInWeekYear(){const t=(this.year+Math.floor(this.year/4)-Math.floor(this.year/100)+Math.floor(this.year/400))%7,e=this.year-1,s=(e+Math.floor(e/4)-Math.floor(e/100)+Math.floor(e/400))%7;return 4===t||3===s?53:52}get isLeapYear(){return this.year%4==0&&(this.year%100!=0||this.year%400==0)}computeOrdinal(){return this.date+(this.isLeapYear?this.leapLadder:this.nonLeapLadder)[this.month]}getAllMonths(t="long"){const e=new Intl.DateTimeFormat(this.localization.locale,{month:t}).format;return[...Array(12).keys()].map((t=>e(new Date(2021,t))))}replaceTokens(t,e){return t.replace(/(\[[^[\]]*])|(LTS?|l{1,4}|L{1,4})/g,((t,s,i)=>{const o=i&&i.toUpperCase();return s||e[o]||a.dateFormats[o]}))}parseTwoDigitYear(t){return(t=+t)+(t>68?1900:2e3)}offsetFromString(t){if(!t)return 0;if("Z"===t)return 0;const[e,s,i]=t.match(/([+-]|\d\d)/g),o=60*s+(+i||0);return 0===o?0:"+"===e?-o:o}zoneInformation(t,e){let s=t.parts(this.localization.locale,{timeZoneName:"longOffset"}).timeZoneName.replace("GMT","").replace(":","");const i=s.includes("-");return s=s.replace("-",""),"z"===e?s=s.substring(1,2):"zz"===e&&(s=s.substring(0,2)),`${i?"-":""}${s}`}addInput(t){return(e,s)=>{e[t]=+s}}meridiemMatch(t){const e=new Intl.DateTimeFormat(this.localization.locale,{hour:"numeric",hour12:!0}).formatToParts(new Date(2022,3,4,13)).find((t=>"dayPeriod"===t.type))?.value;return t.toLowerCase()===e.toLowerCase()}correctHours(t){const{afternoon:e}=t;if(void 0!==e){const{hours:s}=t;e?s<12&&(t.hours+=12):12===s&&(t.hours=0),delete t.afternoon}}makeParser(t){const e=(t=this.replaceTokens(t,this.localization.dateFormats)).match(this.formattingTokens),{length:s}=e;for(let t=0;t{const i={hours:0,minutes:0,seconds:0,milliseconds:0};for(let o=0,a=0;o-1)return new l(("X"===e.format?1e3:1)*+t);const i=s.makeParser(e.format),{year:o,month:a,day:n,hours:r,minutes:d,seconds:c,milliseconds:h,zone:p}=i(t),u=n||(o||a?1:s.getDate()),m=o||s.getFullYear();let y=0;return o&&!a||(y=a>0?a-1:s.getMonth()),p?new l(Date.UTC(m,y,u,r,d,c,h+60*p.offset*1e3)):new l(m,y,u,r,d,c,h)}catch(s){i.errorMessages.customDateFormatError(`Unable to parse provided input: ${t}, format: ${e.format}`)}}format(t,e=this.localization.locale){if(t&&"object"==typeof t)return new Intl.DateTimeFormat(e,t).format(this);const s=this.replaceTokens(t||this.localization.format||`${a.dateFormats.L}, ${a.dateFormats.LT}`,this.localization.dateFormats),i=t=>new Intl.DateTimeFormat(this.localization.locale,t).format(this);this.localization.hourCycle||(this.localization.hourCycle=d(this.localization.locale));const o=this.localization.hourCycle.startsWith("h1")?"h24":this.localization.hourCycle,n=this.localization.hourCycle.startsWith("h2")?"h12":this.localization.hourCycle,r={yy:i({year:"2-digit"}),yyyy:this.year,M:i({month:"numeric"}),MM:this.monthFormatted,MMM:this.getAllMonths("short")[this.getMonth()],MMMM:this.getAllMonths()[this.getMonth()],d:this.date,dd:this.dateFormatted,ddd:i({weekday:"short"}),dddd:i({weekday:"long"}),H:this.getHours(),HH:this.getHoursFormatted(o),h:this.hours>12?this.hours-12:this.hours,hh:this.getHoursFormatted(n),t:this.meridiem(),T:this.meridiem().toUpperCase(),m:this.minutes,mm:this.minutesFormatted,s:this.seconds,ss:this.secondsFormatted,fff:this.getMilliseconds()};return s.replace(this.dateTimeRegex,((t,e)=>e||r[t])).replace(/\[/g,"").replace(/]/g,"")}}class c{constructor(){this.cache=new Map}locate(t){const e=this.cache.get(t);if(e)return e;const s=new t;return this.cache.set(t,s),s}}let h;const p=[{name:"calendar",className:i.css.daysContainer,unit:t.Unit.month,step:1},{name:"months",className:i.css.monthsContainer,unit:t.Unit.year,step:1},{name:"years",className:i.css.yearsContainer,unit:t.Unit.year,step:10},{name:"decades",className:i.css.decadesContainer,unit:t.Unit.year,step:100}];class u{constructor(){this._currentCalendarViewMode=0,this._viewDate=new l,this.minimumCalendarViewMode=0,this.currentView="calendar"}get currentCalendarViewMode(){return this._currentCalendarViewMode}set currentCalendarViewMode(t){this._currentCalendarViewMode=t,this.currentView=p[t].name}get viewDate(){return this._viewDate}set viewDate(t){this._viewDate=t,this.options&&(this.options.viewDate=t)}refreshCurrentView(){this.currentView=p[this.currentCalendarViewMode].name}get isTwelveHour(){return["h12","h11"].includes(this.options.localization.hourCycle)}}class m{constructor(){this.optionsStore=h.locate(u)}isValid(e,s){if(!this._enabledDisabledDatesIsValid(s,e))return!1;if(s!==t.Unit.month&&s!==t.Unit.year&&this.optionsStore.options.restrictions.daysOfWeekDisabled?.length>0&&-1!==this.optionsStore.options.restrictions.daysOfWeekDisabled.indexOf(e.weekDay))return!1;if(!this._minMaxIsValid(s,e))return!1;if(s===t.Unit.hours||s===t.Unit.minutes||s===t.Unit.seconds){if(!this._enabledDisabledHoursIsValid(e))return!1;if(0!==this.optionsStore.options.restrictions.disabledTimeIntervals?.filter((t=>e.isBetween(t.from,t.to))).length)return!1}return!0}_enabledDisabledDatesIsValid(e,s){return e!==t.Unit.date||!(this.optionsStore.options.restrictions.disabledDates.length>0&&this._isInDisabledDates(s))&&!(this.optionsStore.options.restrictions.enabledDates.length>0&&!this._isInEnabledDates(s))}_isInDisabledDates(e){return!(!this.optionsStore.options.restrictions.disabledDates||0===this.optionsStore.options.restrictions.disabledDates.length)&&!!this.optionsStore.options.restrictions.disabledDates.find((s=>s.isSame(e,t.Unit.date)))}_isInEnabledDates(e){return!this.optionsStore.options.restrictions.enabledDates||0===this.optionsStore.options.restrictions.enabledDates.length||!!this.optionsStore.options.restrictions.enabledDates.find((s=>s.isSame(e,t.Unit.date)))}_minMaxIsValid(t,e){return(!this.optionsStore.options.restrictions.minDate||!e.isBefore(this.optionsStore.options.restrictions.minDate,t))&&(!this.optionsStore.options.restrictions.maxDate||!e.isAfter(this.optionsStore.options.restrictions.maxDate,t))}_enabledDisabledHoursIsValid(t){return!(this.optionsStore.options.restrictions.disabledHours.length>0&&this._isInDisabledHours(t))&&!(this.optionsStore.options.restrictions.enabledHours.length>0&&!this._isInEnabledHours(t))}_isInDisabledHours(t){if(!this.optionsStore.options.restrictions.disabledHours||0===this.optionsStore.options.restrictions.disabledHours.length)return!1;const e=t.hours;return this.optionsStore.options.restrictions.disabledHours.includes(e)}_isInEnabledHours(t){if(!this.optionsStore.options.restrictions.enabledHours||0===this.optionsStore.options.restrictions.enabledHours.length)return!0;const e=t.hours;return this.optionsStore.options.restrictions.enabledHours.includes(e)}dateRangeIsValid(e,s,i){if(!this.optionsStore.options.dateRange)return!0;if(2!==e.length&&1!==s)return!0;const o=e[0].clone;if(o.isSame(i,t.Unit.date))return!0;for(o.manipulate(1,t.Unit.date);!o.isSame(i,t.Unit.date);){if(!this.isValid(o,t.Unit.date))return!1;o.manipulate(1,t.Unit.date)}return!0}}class y{constructor(){this.subscribers=[]}subscribe(t){return this.subscribers.push(t),this.unsubscribe.bind(this,this.subscribers.length-1)}unsubscribe(t){this.subscribers.splice(t,1)}emit(t){this.subscribers.forEach((e=>{e(t)}))}destroy(){this.subscribers=null,this.subscribers=[]}}class g{constructor(){this.triggerEvent=new y,this.viewUpdate=new y,this.updateDisplay=new y,this.action=new y,this.updateViewDate=new y}destroy(){this.triggerEvent.destroy(),this.viewUpdate.destroy(),this.updateDisplay.destroy(),this.action.destroy(),this.updateViewDate.destroy()}}const v={clear:"Clear selection",close:"Close the picker",dateFormats:a.dateFormats,dayViewHeaderFormat:{month:"long",year:"2-digit"},decrementHour:"Decrement Hour",decrementMinute:"Decrement Minute",decrementSecond:"Decrement Second",format:a.format,hourCycle:a.hourCycle,incrementHour:"Increment Hour",incrementMinute:"Increment Minute",incrementSecond:"Increment Second",locale:a.locale,nextCentury:"Next Century",nextDecade:"Next Decade",nextMonth:"Next Month",nextYear:"Next Year",ordinal:a.ordinal,pickHour:"Pick Hour",pickMinute:"Pick Minute",pickSecond:"Pick Second",previousCentury:"Previous Century",previousDecade:"Previous Decade",previousMonth:"Previous Month",previousYear:"Previous Year",selectDate:"Select Date",selectDecade:"Select Decade",selectMonth:"Select Month",selectTime:"Select Time",selectYear:"Select Year",startOfTheWeek:0,today:"Go to today",toggleMeridiem:"Toggle Meridiem"},f={allowInputToggle:!1,container:void 0,dateRange:!1,debug:!1,defaultDate:void 0,display:{icons:{type:"icons",time:"fa-solid fa-clock",date:"fa-solid fa-calendar",up:"fa-solid fa-arrow-up",down:"fa-solid fa-arrow-down",previous:"fa-solid fa-chevron-left",next:"fa-solid fa-chevron-right",today:"fa-solid fa-calendar-check",clear:"fa-solid fa-trash",close:"fa-solid fa-xmark"},sideBySide:!1,calendarWeeks:!1,viewMode:"calendar",toolbarPlacement:"bottom",keepOpen:!1,buttons:{today:!1,clear:!1,close:!1},components:{calendar:!0,date:!0,month:!0,year:!0,decades:!0,clock:!0,hours:!0,minutes:!0,seconds:!1,useTwentyfourHour:void 0},inline:!1,theme:"auto",placement:"bottom"},keepInvalid:!1,localization:v,meta:{},multipleDates:!1,multipleDatesSeparator:"; ",promptTimeOnDateChange:!1,promptTimeOnDateChangeTransitionDelay:200,restrictions:{minDate:void 0,maxDate:void 0,disabledDates:[],enabledDates:[],daysOfWeekDisabled:[],disabledTimeIntervals:[],disabledHours:[],enabledHours:[]},stepping:1,useCurrent:!0,viewDate:new l},S={...v};function w(t,e){if(!t)return null;if(t.constructor.name===l.name)return t;if(t.constructor.name===Date.name)return l.convert(t);if("string"==typeof t){const s=l.fromString(t,e);return"null"===JSON.stringify(s)?null:s}return null}function b(t,e,s){"string"==typeof t&&"input"!==e&&i.errorMessages.dateString();const o=w(t,s);return o||i.errorMessages.failedToParseDate(e,t,"input"===e),o}function D(t,e,s,o){Array.isArray(e)||i.errorMessages.typeMismatch(t,s,"array of DateTime or Date");for(let s=0;s"number"!=typeof t))||i.errorMessages.typeMismatch(t,s,"array of numbers")}function k(t){return({value:e,providedType:s,localization:o})=>{const a=b(e,t,o);if(void 0!==a)return a.setLocalization(o),a;i.errorMessages.typeMismatch(t,s,"DateTime or Date")}}function C(t){const e=k(t);return t=>void 0===t.value?t.value:e(t)}function M(t,e,s){return({value:o,providedType:a})=>void 0===o?[]:(_(t,o,a),o.some((t=>ts))&&i.errorMessages.numbersOutOfRange(t,e,s),o)}function E(t){return M(t,0,23)}function T(t){return({value:e,providedType:s,localization:i})=>void 0===e?[]:(D(t,e,s,i),e)}function L(t){return({value:e,path:s})=>(t.includes(e)||i.errorMessages.unexpectedOptionValue(s.substring(1),e,t),e)}const U=Object.freeze({defaultDate:k("defaultDate"),viewDate:k("viewDate"),minDate:C("restrictions.minDate"),maxDate:C("restrictions.maxDate"),disabledHours:E("restrictions.disabledHours"),enabledHours:E("restrictions.enabledHours"),disabledDates:T("restrictions.disabledDates"),enabledDates:T("restrictions.enabledDates"),daysOfWeekDisabled:M("restrictions.daysOfWeekDisabled",0,6),disabledTimeIntervals:({key:t,value:e,providedType:s,localization:o})=>{if(void 0===e)return[];Array.isArray(e)||i.errorMessages.typeMismatch(t,s,"array of { from: DateTime|Date, to: DateTime|Date }");const a=e;for(let e=0;e{const n=`${t}[${e}].${s}`,r=a[e][s],d=b(r,n,o);d||i.errorMessages.typeMismatch(n,typeof r,"DateTime or Date"),d.setLocalization(o),a[e][s]=d}));return a},toolbarPlacement:L(["top","bottom","default"]),type:L(["icons","sprites"]),viewMode:L(["clock","calendar","months","years","decades"]),theme:L(["light","dark","auto"]),placement:L(["top","bottom"]),meta:({value:t})=>t,dayViewHeaderFormat:({value:t})=>t,container:({value:t,path:e})=>(t&&!(t instanceof HTMLElement||t instanceof Element||t?.appendChild)&&i.errorMessages.typeMismatch(e.substring(1),typeof t,"HTMLElement"),t),useTwentyfourHour:({value:t,path:e,providedType:s,defaultType:o})=>{if(i.errorMessages.deprecatedWarning("useTwentyfourHour",'Please use "options.localization.hourCycle" instead'),void 0===t||"boolean"===s)return t;i.errorMessages.typeMismatch(e,s,o)},hourCycle:L(["h11","h12","h23","h24"])}),A=({value:t,defaultType:e,providedType:s,path:o})=>{switch(e){case"boolean":return"true"===t||!0===t;case"number":return+t;case"string":return t.toString();case"object":return{};case"function":return t;default:i.errorMessages.typeMismatch(o,s,e)}};class V{static deepCopy(t){const e={};return Object.keys(t).forEach((s=>{const i=t[s];i instanceof l?e[s]=i.clone:i instanceof Date?e[s]=new Date(i.valueOf()):(e[s]=i,"object"!=typeof i||i instanceof HTMLElement||i instanceof Element||Array.isArray(i)||(e[s]=V.deepCopy(i)))})),e}static objectPath(t,e){return"."===t.charAt(0)&&(t=t.slice(1)),t?t.split(".").reduce(((t,e)=>V.isValue(t)||V.isValue(t[e])?t[e]:void 0),e):e}static spread(t,e,s,o=""){const a=V.objectPath(o,f),n=Object.keys(t).filter((t=>!Object.keys(a).includes(t)));if(n.length>0){const t=V.getFlattenDefaultOptions(),e=n.map((e=>{let s=`"${o}.${e}" in not a known option.`;const i=t.find((t=>t.includes(e)));return i&&(s+=` Did you mean "${i}"?`),s}));i.errorMessages.unexpectedOptions(e)}Object.keys(t).filter((t=>"__proto__"!==t&&"constructor"!==t)).forEach((i=>{"."===(o+=`.${i}`).charAt(0)&&(o=o.slice(1));const n=a[i],r=typeof t[i],d=typeof n,l=t[i];if(null==l)return e[i]=l,void(o=o.substring(0,o.lastIndexOf(`.${i}`)));"object"!=typeof n||Array.isArray(t[i])||n instanceof Date||V.ignoreProperties.includes(i)?e[i]=V.processKey(i,l,r,d,o,s):V.spread(t[i],e[i],s,o),o=o.substring(0,o.lastIndexOf(`.${i}`))}))}static processKey(t,e,s,i,o,a){return(U[(n={key:t,value:e,providedType:s,defaultType:i,path:o,localization:a}).key]||A)(n);var n}static _mergeOptions(t,e){const s=V.deepCopy(e),i="default"!==e.localization?.locale?e.localization:t?.localization||f.localization;return V.spread(t,s,i,""),s}static _dataToOptions(t,e){const s=JSON.parse(JSON.stringify(t.dataset));if(s?.tdTargetInput&&delete s.tdTargetInput,s?.tdTargetToggle&&delete s.tdTargetToggle,!s||0===Object.keys(s).length||s.constructor!==DOMStringMap)return e;const o={},a=t=>{const e={};return Object.keys(t).forEach((t=>{e[t.toLowerCase()]=t})),e},n=this.normalizeObject(a),r=a(e);return Object.keys(s).filter((t=>t.startsWith(i.dataKey))).map((t=>t.substring(2))).forEach((t=>{let i=r[t.toLowerCase()];if(t.includes("_")){const a=t.split("_");i=r[a[0].toLowerCase()],void 0!==i&&e[i].constructor===Object&&(o[i]=n(a,1,e[i],s[`td${t}`]))}else void 0!==i&&(o[i]=s[`td${t}`])})),this._mergeOptions(o,e)}static normalizeObject(t){const e=(s,i,o,a)=>{const n=t(o)[s[i].toLowerCase()],r={};return void 0===n||(o[n].constructor===Object?(i++,r[n]=e(s,i,o[n],a)):r[n]=a),r};return e}static _dateTypeCheck(t,e){return w(t,e)}static _typeCheckDateArray(t,e,s,i){return D(t,e,s,i)}static _typeCheckNumberArray(t,e,s){return _(t,e,s)}static dateConversion(t,e,s){return b(t,e,s)}static getFlattenDefaultOptions(){if(this._flattenDefaults)return this._flattenDefaults;const t=(e,s=[])=>Array.isArray(e)?[]:Object(e)===e?Object.entries(e).flatMap((([e,i])=>t(i,[...s,e]))):s.join(".");return this._flattenDefaults=t(f),this._flattenDefaults}static _validateConflicts(t){!t.display.sideBySide||t.display.components.clock&&(t.display.components.hours||t.display.components.minutes||t.display.components.seconds)||i.errorMessages.conflictingConfiguration("Cannot use side by side mode without the clock components"),t.restrictions.minDate&&t.restrictions.maxDate&&(t.restrictions.minDate.isAfter(t.restrictions.maxDate)&&i.errorMessages.conflictingConfiguration("minDate is after maxDate"),t.restrictions.maxDate.isBefore(t.restrictions.minDate)&&i.errorMessages.conflictingConfiguration("maxDate is before minDate")),t.multipleDates&&t.dateRange&&i.errorMessages.conflictingConfiguration('Cannot uss option "multipleDates" with "dateRange"')}}V.ignoreProperties=["meta","dayViewHeaderFormat","container","dateForms","ordinal"],V.isValue=t=>null!=t;class ${constructor(){this._dates=[],this.optionsStore=h.locate(u),this.validation=h.locate(m),this._eventEmitters=h.locate(g)}get picked(){return[...this._dates]}get lastPicked(){return this._dates[this.lastPickedIndex]?.clone}get lastPickedIndex(){return 0===this._dates.length?0:this._dates.length-1}formatInput(t){return t?(t.localization=this.optionsStore.options.localization,t.format()):""}parseInput(t){return V.dateConversion(t,"input",this.optionsStore.options.localization)}setFromInput(t,e){if(!t)return void this.setValue(void 0,e);const s=this.parseInput(t);s&&(s.setLocalization(this.optionsStore.options.localization),this.setValue(s,e))}add(t){this._dates.push(t)}isPicked(t,e){if(!l.isValid(t))return!1;if(!e)return void 0!==this._dates.find((e=>e.isSame(t)));const s=r(e),i=t.format(s);return void 0!==this._dates.map((t=>t.format(s))).find((t=>t===i))}pickedIndex(t,e){if(!l.isValid(t))return-1;if(!e)return this._dates.map((t=>t.valueOf())).indexOf(t.valueOf());const s=r(e),i=t.format(s);return this._dates.map((t=>t.format(s))).indexOf(i)}clear(){this.optionsStore.unset=!0,this._eventEmitters.triggerEvent.emit({type:i.events.change,date:void 0,oldDate:this.lastPicked,isClear:!0,isValid:!0}),this._dates=[],this.optionsStore.input&&(this.optionsStore.input.value=""),this._eventEmitters.updateDisplay.emit("all")}static getStartEndYear(t,e){const s=t/10,i=Math.floor(e/t)*t;return[i,i+9*s,Math.floor(e/s)*s]}updateInput(t){if(!this.optionsStore.input)return;let e=this.formatInput(t);(this.optionsStore.options.multipleDates||this.optionsStore.options.dateRange)&&(e=this._dates.map((t=>this.formatInput(t))).join(this.optionsStore.options.multipleDatesSeparator)),this.optionsStore.input.value!=e&&(this.optionsStore.input.value=e)}setValue(e,s){const o=void 0===s,a=!e&&o;let n=this.optionsStore.unset?null:this._dates[s]?.clone;if(!n&&!this.optionsStore.unset&&o&&a&&(n=this.lastPicked),e&&n?.isSame(e))return void this.updateInput(e);if(!e)return void this._setValueNull(a,s,n);s=s||0,e=e.clone,1!==this.optionsStore.options.stepping&&(e.minutes=Math.round(e.minutes/this.optionsStore.options.stepping)*this.optionsStore.options.stepping,e.startOf(t.Unit.minutes));const r=t=>{this._dates[s]=e,this._eventEmitters.updateViewDate.emit(e.clone),this.updateInput(e),this.optionsStore.unset=!1,this._eventEmitters.updateDisplay.emit("all"),this._eventEmitters.triggerEvent.emit({type:i.events.change,date:e,oldDate:n,isClear:a,isValid:t})};this.validation.isValid(e)&&this.validation.dateRangeIsValid(this.picked,s,e)?r(!0):(this.optionsStore.options.keepInvalid&&r(!1),this._eventEmitters.triggerEvent.emit({type:i.events.error,reason:i.errorMessages.failedToSetInvalidDate,date:e,oldDate:n}))}_setValueNull(t,e,s){!this.optionsStore.options.multipleDates||1===this._dates.length||t?(this.optionsStore.unset=!0,this._dates=[]):this._dates.splice(e,1),this.updateInput(),this._eventEmitters.triggerEvent.emit({type:i.events.change,date:void 0,oldDate:s,isClear:t,isValid:!0}),this._eventEmitters.updateDisplay.emit("all")}}var O;!function(t){t.next="next",t.previous="previous",t.changeCalendarView="changeCalendarView",t.selectMonth="selectMonth",t.selectYear="selectYear",t.selectDecade="selectDecade",t.selectDay="selectDay",t.selectHour="selectHour",t.selectMinute="selectMinute",t.selectSecond="selectSecond",t.incrementHours="incrementHours",t.incrementMinutes="incrementMinutes",t.incrementSeconds="incrementSeconds",t.decrementHours="decrementHours",t.decrementMinutes="decrementMinutes",t.decrementSeconds="decrementSeconds",t.toggleMeridiem="toggleMeridiem",t.togglePicker="togglePicker",t.showClock="showClock",t.showHours="showHours",t.showMinutes="showMinutes",t.showSeconds="showSeconds",t.clear="clear",t.close="close",t.today="today"}(O||(O={}));var z=O;class H{constructor(){this.optionsStore=h.locate(u),this.dates=h.locate($),this.validation=h.locate(m)}getPicker(){const t=document.createElement("div");if(t.classList.add(i.css.daysContainer),t.append(...this._daysOfTheWeek()),this.optionsStore.options.display.calendarWeeks){const e=document.createElement("div");e.classList.add(i.css.calendarWeeks,i.css.noHighlight),t.appendChild(e)}const{rangeHoverEvent:e,rangeHoverOutEvent:s}=this.handleMouseEvents(t);for(let o=0;o<42;o++){if(0!==o&&o%7==0&&this.optionsStore.options.display.calendarWeeks){const e=document.createElement("div");e.classList.add(i.css.calendarWeeks,i.css.noHighlight),t.appendChild(e)}const a=document.createElement("div");a.setAttribute("data-action",z.selectDay),t.appendChild(a),matchMedia("(hover: hover)").matches&&this.optionsStore.options.dateRange&&(a.addEventListener("mouseover",e),a.addEventListener("mouseout",s))}return t}_update(e,s){const o=e.getElementsByClassName(i.css.daysContainer)[0];this._updateCalendarView(o);const a=this.optionsStore.viewDate.clone.startOf(t.Unit.month).startOf("weekDay",this.optionsStore.options.localization.startOfTheWeek).manipulate(12,t.Unit.hours);this._handleCalendarWeeks(o,a.clone),o.querySelectorAll(`[data-action="${z.selectDay}"]`).forEach((e=>{const o=[];o.push(i.css.day),a.isBefore(this.optionsStore.viewDate,t.Unit.month)&&o.push(i.css.old),a.isAfter(this.optionsStore.viewDate,t.Unit.month)&&o.push(i.css.new),this.optionsStore.unset||this.optionsStore.options.dateRange||!this.dates.isPicked(a,t.Unit.date)||o.push(i.css.active),this.validation.isValid(a,t.Unit.date)||o.push(i.css.disabled),a.isSame(new l,t.Unit.date)&&o.push(i.css.today),0!==a.weekDay&&6!==a.weekDay||o.push(i.css.weekend),this._handleDateRange(a,o),s(t.Unit.date,a,o,e),e.classList.remove(...e.classList),e.classList.add(...o),e.setAttribute("data-value",this._dateToDataValue(a)),e.setAttribute("data-day",`${a.date}`),e.innerText=a.parts(void 0,{day:"numeric"}).day,a.manipulate(1,t.Unit.date)}))}_dateToDataValue(t){return l.isValid(t)?`${t.year}-${t.monthFormatted}-${t.dateFormatted}`:""}_handleDateRange(e,s){const o=this.dates.picked[0],a=this.dates.picked[1];this.optionsStore.options.dateRange&&(e.isBetween(o,a,t.Unit.date)&&s.push(i.css.rangeIn),e.isSame(o,t.Unit.date)&&s.push(i.css.rangeStart),e.isSame(a,t.Unit.date)&&s.push(i.css.rangeEnd))}handleMouseEvents(e){return{rangeHoverEvent:s=>{const o=s?.currentTarget;if(1!==this.dates.picked.length||o.classList.contains(i.css.disabled))return;const a=[...e.querySelectorAll(".day")],n=o.getAttribute("data-value"),r=l.fromString(n,{format:"yyyy-MM-dd"}),d=a.findIndex((t=>t.getAttribute("data-value")===n)),c=this.dates.picked[0],h=this.dates.picked[1],p=this._dateToDataValue(c),u=a.findIndex((t=>t.getAttribute("data-value")===p)),m=a[u];let y;r.isSame(c,t.Unit.date)||o.classList.remove(i.css.rangeStart),r.isSame(h,t.Unit.date)||o.classList.remove(i.css.rangeEnd),r.isBefore(c)?(o.classList.add(i.css.rangeStart),m?.classList.remove(i.css.rangeStart),m?.classList.add(i.css.rangeEnd),y=(t,e)=>e>d&&eeu),a.filter(y).forEach((t=>{t.classList.add(i.css.rangeIn)}))},rangeHoverOutEvent:s=>{const o=[...e.querySelectorAll(".day")];if(1===this.dates.picked.length&&o.forEach((t=>t.classList.remove(i.css.rangeIn))),1!==this.dates.picked.length)return;const a=s?.currentTarget,n=new l(a.getAttribute("data-value"));n.isSame(this.dates.picked[0],t.Unit.date)||a.classList.remove(i.css.rangeStart),n.isSame(this.dates.picked[1],t.Unit.date)||a.classList.remove(i.css.rangeEnd)}}}_updateCalendarView(e){if("calendar"!==this.optionsStore.currentView)return;const[s,o,a]=e.parentElement.getElementsByClassName(i.css.calendarHeader)[0].getElementsByTagName("div");o.setAttribute(i.css.daysContainer,this.optionsStore.viewDate.format(this.optionsStore.options.localization.dayViewHeaderFormat)),this.optionsStore.options.display.components.month?o.classList.remove(i.css.disabled):o.classList.add(i.css.disabled),this.validation.isValid(this.optionsStore.viewDate.clone.manipulate(-1,t.Unit.month),t.Unit.month)?s.classList.remove(i.css.disabled):s.classList.add(i.css.disabled),this.validation.isValid(this.optionsStore.viewDate.clone.manipulate(1,t.Unit.month),t.Unit.month)?a.classList.remove(i.css.disabled):a.classList.add(i.css.disabled)}_daysOfTheWeek(){const e=this.optionsStore.viewDate.clone.startOf("weekDay",this.optionsStore.options.localization.startOfTheWeek).startOf(t.Unit.date),s=[];if(document.createElement("div"),this.optionsStore.options.display.calendarWeeks){const t=document.createElement("div");t.classList.add(i.css.calendarWeeks,i.css.noHighlight),t.innerText="#",s.push(t)}for(let o=0;o<7;o++){const o=document.createElement("div");o.classList.add(i.css.dayOfTheWeek,i.css.noHighlight),o.innerText=e.format({weekday:"short"}),e.manipulate(1,t.Unit.date),s.push(o)}return s}_handleCalendarWeeks(e,s){[...e.querySelectorAll(`.${i.css.calendarWeeks}`)].filter((t=>"#"!==t.innerText)).forEach((e=>{e.innerText=`${s.week}`,s.manipulate(7,t.Unit.date)}))}}class x{constructor(){this.optionsStore=h.locate(u),this.dates=h.locate($),this.validation=h.locate(m)}getPicker(){const t=document.createElement("div");t.classList.add(i.css.monthsContainer);for(let e=0;e<12;e++){const e=document.createElement("div");e.setAttribute("data-action",z.selectMonth),t.appendChild(e)}return t}_update(e,s){const o=e.getElementsByClassName(i.css.monthsContainer)[0];if("months"===this.optionsStore.currentView){const[e,s,a]=o.parentElement.getElementsByClassName(i.css.calendarHeader)[0].getElementsByTagName("div");s.setAttribute(i.css.monthsContainer,this.optionsStore.viewDate.format({year:"numeric"})),this.optionsStore.options.display.components.year?s.classList.remove(i.css.disabled):s.classList.add(i.css.disabled),this.validation.isValid(this.optionsStore.viewDate.clone.manipulate(-1,t.Unit.year),t.Unit.year)?e.classList.remove(i.css.disabled):e.classList.add(i.css.disabled),this.validation.isValid(this.optionsStore.viewDate.clone.manipulate(1,t.Unit.year),t.Unit.year)?a.classList.remove(i.css.disabled):a.classList.add(i.css.disabled)}const a=this.optionsStore.viewDate.clone.startOf(t.Unit.year);o.querySelectorAll(`[data-action="${z.selectMonth}"]`).forEach(((e,o)=>{const n=[];n.push(i.css.month),!this.optionsStore.unset&&this.dates.isPicked(a,t.Unit.month)&&n.push(i.css.active),this.validation.isValid(a,t.Unit.month)||n.push(i.css.disabled),s(t.Unit.month,a,n,e),e.classList.remove(...e.classList),e.classList.add(...n),e.setAttribute("data-value",`${o}`),e.innerText=`${a.format({month:"short"})}`,a.manipulate(1,t.Unit.month)}))}}class I{constructor(){this.optionsStore=h.locate(u),this.dates=h.locate($),this.validation=h.locate(m)}getPicker(){const t=document.createElement("div");t.classList.add(i.css.yearsContainer);for(let e=0;e<12;e++){const e=document.createElement("div");e.setAttribute("data-action",z.selectYear),t.appendChild(e)}return t}_update(e,s){this._startYear=this.optionsStore.viewDate.clone.manipulate(-1,t.Unit.year),this._endYear=this.optionsStore.viewDate.clone.manipulate(10,t.Unit.year);const o=e.getElementsByClassName(i.css.yearsContainer)[0];if("years"===this.optionsStore.currentView){const[e,s,a]=o.parentElement.getElementsByClassName(i.css.calendarHeader)[0].getElementsByTagName("div");s.setAttribute(i.css.yearsContainer,`${this._startYear.format({year:"numeric"})}-${this._endYear.format({year:"numeric"})}`),this.optionsStore.options.display.components.decades?s.classList.remove(i.css.disabled):s.classList.add(i.css.disabled),this.validation.isValid(this._startYear,t.Unit.year)?e.classList.remove(i.css.disabled):e.classList.add(i.css.disabled),this.validation.isValid(this._endYear,t.Unit.year)?a.classList.remove(i.css.disabled):a.classList.add(i.css.disabled)}const a=this.optionsStore.viewDate.clone.startOf(t.Unit.year).manipulate(-1,t.Unit.year);o.querySelectorAll(`[data-action="${z.selectYear}"]`).forEach((e=>{const o=[];o.push(i.css.year),!this.optionsStore.unset&&this.dates.isPicked(a,t.Unit.year)&&o.push(i.css.active),this.validation.isValid(a,t.Unit.year)||o.push(i.css.disabled),s(t.Unit.year,a,o,e),e.classList.remove(...e.classList),e.classList.add(...o),e.setAttribute("data-value",`${a.year}`),e.innerText=a.format({year:"numeric"}),a.manipulate(1,t.Unit.year)}))}}class P{constructor(){this.optionsStore=h.locate(u),this.dates=h.locate($),this.validation=h.locate(m)}getPicker(){const t=document.createElement("div");t.classList.add(i.css.decadesContainer);for(let e=0;e<12;e++){const e=document.createElement("div");e.setAttribute("data-action",z.selectDecade),t.appendChild(e)}return t}_update(e,s){const[o,a]=$.getStartEndYear(100,this.optionsStore.viewDate.year);this._startDecade=this.optionsStore.viewDate.clone.startOf(t.Unit.year),this._startDecade.year=o,this._endDecade=this.optionsStore.viewDate.clone.startOf(t.Unit.year),this._endDecade.year=a;const n=e.getElementsByClassName(i.css.decadesContainer)[0],[r,d,l]=n.parentElement.getElementsByClassName(i.css.calendarHeader)[0].getElementsByTagName("div");"decades"===this.optionsStore.currentView&&(d.setAttribute(i.css.decadesContainer,`${this._startDecade.format({year:"numeric"})}-${this._endDecade.format({year:"numeric"})}`),this.validation.isValid(this._startDecade,t.Unit.year)?r.classList.remove(i.css.disabled):r.classList.add(i.css.disabled),this.validation.isValid(this._endDecade,t.Unit.year)?l.classList.remove(i.css.disabled):l.classList.add(i.css.disabled));const c=this.dates.picked.map((t=>t.year));n.querySelectorAll(`[data-action="${z.selectDecade}"]`).forEach(((e,o)=>{if(0===o)return e.classList.add(i.css.old),this._startDecade.year-10<0?(e.textContent=" ",r.classList.add(i.css.disabled),e.classList.add(i.css.disabled),void e.setAttribute("data-value","")):(e.innerText=this._startDecade.clone.manipulate(-10,t.Unit.year).format({year:"numeric"}),void e.setAttribute("data-value",`${this._startDecade.year}`));const a=[];a.push(i.css.decade);const n=this._startDecade.year,d=this._startDecade.year+9;!this.optionsStore.unset&&c.filter((t=>t>=n&&t<=d)).length>0&&a.push(i.css.active),s("decade",this._startDecade,a,e),e.classList.remove(...e.classList),e.classList.add(...a),e.setAttribute("data-value",`${this._startDecade.year}`),e.innerText=`${this._startDecade.format({year:"numeric"})}`,this._startDecade.manipulate(10,t.Unit.year)}))}}class N{constructor(){this._gridColumns="",this.optionsStore=h.locate(u),this.dates=h.locate($),this.validation=h.locate(m)}getPicker(t){const e=document.createElement("div");return e.classList.add(i.css.clockContainer),e.append(...this._grid(t)),e}_update(e){const s=e.getElementsByClassName(i.css.clockContainer)[0];let o=this.dates.lastPicked?.clone;if(!o&&this.optionsStore.options.useCurrent&&(o=this.optionsStore.viewDate.clone),s.querySelectorAll(".disabled").forEach((t=>t.classList.remove(i.css.disabled))),this.optionsStore.options.display.components.hours&&(this.validation.isValid(this.optionsStore.viewDate.clone.manipulate(1,t.Unit.hours),t.Unit.hours)||s.querySelector(`[data-action=${z.incrementHours}]`).classList.add(i.css.disabled),this.validation.isValid(this.optionsStore.viewDate.clone.manipulate(-1,t.Unit.hours),t.Unit.hours)||s.querySelector(`[data-action=${z.decrementHours}]`).classList.add(i.css.disabled),s.querySelector(`[data-time-component=${t.Unit.hours}]`).innerText=o?o.getHoursFormatted(this.optionsStore.options.localization.hourCycle):"--"),this.optionsStore.options.display.components.minutes&&(this.validation.isValid(this.optionsStore.viewDate.clone.manipulate(1,t.Unit.minutes),t.Unit.minutes)||s.querySelector(`[data-action=${z.incrementMinutes}]`).classList.add(i.css.disabled),this.validation.isValid(this.optionsStore.viewDate.clone.manipulate(-1,t.Unit.minutes),t.Unit.minutes)||s.querySelector(`[data-action=${z.decrementMinutes}]`).classList.add(i.css.disabled),s.querySelector(`[data-time-component=${t.Unit.minutes}]`).innerText=o?o.minutesFormatted:"--"),this.optionsStore.options.display.components.seconds&&(this.validation.isValid(this.optionsStore.viewDate.clone.manipulate(1,t.Unit.seconds),t.Unit.seconds)||s.querySelector(`[data-action=${z.incrementSeconds}]`).classList.add(i.css.disabled),this.validation.isValid(this.optionsStore.viewDate.clone.manipulate(-1,t.Unit.seconds),t.Unit.seconds)||s.querySelector(`[data-action=${z.decrementSeconds}]`).classList.add(i.css.disabled),s.querySelector(`[data-time-component=${t.Unit.seconds}]`).innerText=o?o.secondsFormatted:"--"),this.optionsStore.isTwelveHour){const e=s.querySelector(`[data-action=${z.toggleMeridiem}]`),a=(o||this.optionsStore.viewDate).clone;e.innerText=a.meridiem(),this.validation.isValid(a.manipulate(a.hours>=12?-12:12,t.Unit.hours))?e.classList.remove(i.css.disabled):e.classList.add(i.css.disabled)}s.style.gridTemplateAreas=`"${this._gridColumns}"`}_grid(e){this._gridColumns="";const s=[],o=[],a=[],n=document.createElement("div"),r=e(this.optionsStore.options.display.icons.up),d=e(this.optionsStore.options.display.icons.down);n.classList.add(i.css.separator,i.css.noHighlight);const l=n.cloneNode(!0);l.innerHTML=":";const c=(t=!1)=>t?l.cloneNode(!0):n.cloneNode(!0);if(this.optionsStore.options.display.components.hours){let e=document.createElement("div");e.setAttribute("title",this.optionsStore.options.localization.incrementHour),e.setAttribute("data-action",z.incrementHours),e.appendChild(r.cloneNode(!0)),s.push(e),e=document.createElement("div"),e.setAttribute("title",this.optionsStore.options.localization.pickHour),e.setAttribute("data-action",z.showHours),e.setAttribute("data-time-component",t.Unit.hours),o.push(e),e=document.createElement("div"),e.setAttribute("title",this.optionsStore.options.localization.decrementHour),e.setAttribute("data-action",z.decrementHours),e.appendChild(d.cloneNode(!0)),a.push(e),this._gridColumns+="a"}if(this.optionsStore.options.display.components.minutes){this._gridColumns+=" a",this.optionsStore.options.display.components.hours&&(s.push(c()),o.push(c(!0)),a.push(c()),this._gridColumns+=" a");let e=document.createElement("div");e.setAttribute("title",this.optionsStore.options.localization.incrementMinute),e.setAttribute("data-action",z.incrementMinutes),e.appendChild(r.cloneNode(!0)),s.push(e),e=document.createElement("div"),e.setAttribute("title",this.optionsStore.options.localization.pickMinute),e.setAttribute("data-action",z.showMinutes),e.setAttribute("data-time-component",t.Unit.minutes),o.push(e),e=document.createElement("div"),e.setAttribute("title",this.optionsStore.options.localization.decrementMinute),e.setAttribute("data-action",z.decrementMinutes),e.appendChild(d.cloneNode(!0)),a.push(e)}if(this.optionsStore.options.display.components.seconds){this._gridColumns+=" a",this.optionsStore.options.display.components.minutes&&(s.push(c()),o.push(c(!0)),a.push(c()),this._gridColumns+=" a");let e=document.createElement("div");e.setAttribute("title",this.optionsStore.options.localization.incrementSecond),e.setAttribute("data-action",z.incrementSeconds),e.appendChild(r.cloneNode(!0)),s.push(e),e=document.createElement("div"),e.setAttribute("title",this.optionsStore.options.localization.pickSecond),e.setAttribute("data-action",z.showSeconds),e.setAttribute("data-time-component",t.Unit.seconds),o.push(e),e=document.createElement("div"),e.setAttribute("title",this.optionsStore.options.localization.decrementSecond),e.setAttribute("data-action",z.decrementSeconds),e.appendChild(d.cloneNode(!0)),a.push(e)}if(this.optionsStore.isTwelveHour){this._gridColumns+=" a";let t=c();s.push(t);const e=document.createElement("button");e.setAttribute("title",this.optionsStore.options.localization.toggleMeridiem),e.setAttribute("data-action",z.toggleMeridiem),e.setAttribute("tabindex","-1"),i.css.toggleMeridiem.includes(",")?e.classList.add(...i.css.toggleMeridiem.split(",")):e.classList.add(i.css.toggleMeridiem),t=document.createElement("div"),t.classList.add(i.css.noHighlight),t.appendChild(e),o.push(t),t=c(),a.push(t)}return this._gridColumns=this._gridColumns.trim(),[...s,...o,...a]}}class F{constructor(){this.optionsStore=h.locate(u),this.validation=h.locate(m)}getPicker(){const t=document.createElement("div");t.classList.add(i.css.hourContainer);for(let e=0;e<(this.optionsStore.isTwelveHour?12:24);e++){const e=document.createElement("div");e.setAttribute("data-action",z.selectHour),t.appendChild(e)}return t}_update(e,s){const o=e.getElementsByClassName(i.css.hourContainer)[0],a=this.optionsStore.viewDate.clone.startOf(t.Unit.date);o.querySelectorAll(`[data-action="${z.selectHour}"]`).forEach((e=>{const o=[];o.push(i.css.hour),this.validation.isValid(a,t.Unit.hours)||o.push(i.css.disabled),s(t.Unit.hours,a,o,e),e.classList.remove(...e.classList),e.classList.add(...o),e.setAttribute("data-value",`${a.hours}`),e.innerText=a.getHoursFormatted(this.optionsStore.options.localization.hourCycle),a.manipulate(1,t.Unit.hours)}))}}class B{constructor(){this.optionsStore=h.locate(u),this.validation=h.locate(m)}getPicker(){const t=document.createElement("div");t.classList.add(i.css.minuteContainer);const e=1===this.optionsStore.options.stepping?5:this.optionsStore.options.stepping;for(let s=0;s<60/e;s++){const e=document.createElement("div");e.setAttribute("data-action",z.selectMinute),t.appendChild(e)}return t}_update(e,s){const o=e.getElementsByClassName(i.css.minuteContainer)[0],a=this.optionsStore.viewDate.clone.startOf(t.Unit.hours),n=1===this.optionsStore.options.stepping?5:this.optionsStore.options.stepping;o.querySelectorAll(`[data-action="${z.selectMinute}"]`).forEach((e=>{const o=[];o.push(i.css.minute),this.validation.isValid(a,t.Unit.minutes)||o.push(i.css.disabled),s(t.Unit.minutes,a,o,e),e.classList.remove(...e.classList),e.classList.add(...o),e.setAttribute("data-value",`${a.minutes}`),e.innerText=a.minutesFormatted,a.manipulate(n,t.Unit.minutes)}))}}class W{constructor(){this.optionsStore=h.locate(u),this.validation=h.locate(m)}getPicker(){const t=document.createElement("div");t.classList.add(i.css.secondContainer);for(let e=0;e<12;e++){const e=document.createElement("div");e.setAttribute("data-action",z.selectSecond),t.appendChild(e)}return t}_update(e,s){const o=e.getElementsByClassName(i.css.secondContainer)[0],a=this.optionsStore.viewDate.clone.startOf(t.Unit.minutes);o.querySelectorAll(`[data-action="${z.selectSecond}"]`).forEach((e=>{const o=[];o.push(i.css.second),this.validation.isValid(a,t.Unit.seconds)||o.push(i.css.disabled),s(t.Unit.seconds,a,o,e),e.classList.remove(...e.classList),e.classList.add(...o),e.setAttribute("data-value",`${a.seconds}`),e.innerText=a.secondsFormatted,a.manipulate(5,t.Unit.seconds)}))}}class q{static toggle(t){t.classList.contains(i.css.show)?this.hide(t):this.show(t)}static showImmediately(t){t.classList.remove(i.css.collapsing),t.classList.add(i.css.collapse,i.css.show),t.style.height=""}static show(t){if(t.classList.contains(i.css.collapsing)||t.classList.contains(i.css.show))return;t.style.height="0",t.classList.remove(i.css.collapse),t.classList.add(i.css.collapsing),setTimeout((()=>{q.showImmediately(t)}),this.getTransitionDurationFromElement(t)),t.style.height=`${t.scrollHeight}px`}static hideImmediately(t){t&&(t.classList.remove(i.css.collapsing,i.css.show),t.classList.add(i.css.collapse))}static hide(t){if(t.classList.contains(i.css.collapsing)||!t.classList.contains(i.css.show))return;t.style.height=`${t.getBoundingClientRect().height}px`;t.offsetHeight,t.classList.remove(i.css.collapse,i.css.show),t.classList.add(i.css.collapsing),t.style.height="",setTimeout((()=>{q.hideImmediately(t)}),this.getTransitionDurationFromElement(t))}}q.getTransitionDurationFromElement=t=>{if(!t)return 0;let{transitionDuration:e,transitionDelay:s}=window.getComputedStyle(t);const i=Number.parseFloat(e),o=Number.parseFloat(s);return i||o?(e=e.split(",")[0],s=s.split(",")[0],1e3*(Number.parseFloat(e)+Number.parseFloat(s))):0};class Y{constructor(){this._isVisible=!1,this._documentClickEvent=t=>{this.optionsStore.options.debug||window.debug||!this._isVisible||t.composedPath().includes(this.widget)||t.composedPath()?.includes(this.optionsStore.element)||this.hide()},this._actionsClickEvent=t=>{this._eventEmitters.action.emit({e:t})},this.optionsStore=h.locate(u),this.validation=h.locate(m),this.dates=h.locate($),this.dateDisplay=h.locate(H),this.monthDisplay=h.locate(x),this.yearDisplay=h.locate(I),this.decadeDisplay=h.locate(P),this.timeDisplay=h.locate(N),this.hourDisplay=h.locate(F),this.minuteDisplay=h.locate(B),this.secondDisplay=h.locate(W),this._eventEmitters=h.locate(g),this._widget=void 0,this._eventEmitters.updateDisplay.subscribe((t=>{this._update(t)}))}get widget(){return this._widget}get dateContainer(){return this.widget?.querySelector(`div.${i.css.dateContainer}`)}get timeContainer(){return this.widget?.querySelector(`div.${i.css.timeContainer}`)}get isVisible(){return this._isVisible}_update(e){if(this.widget)switch(e){case t.Unit.seconds:this.secondDisplay._update(this.widget,this.paint);break;case t.Unit.minutes:this.minuteDisplay._update(this.widget,this.paint);break;case t.Unit.hours:this.hourDisplay._update(this.widget,this.paint);break;case t.Unit.date:this.dateDisplay._update(this.widget,this.paint);break;case t.Unit.month:this.monthDisplay._update(this.widget,this.paint);break;case t.Unit.year:this.yearDisplay._update(this.widget,this.paint);break;case"clock":if(!this._hasTime)break;this.timeDisplay._update(this.widget),this._update(t.Unit.hours),this._update(t.Unit.minutes),this._update(t.Unit.seconds);break;case"calendar":this._update(t.Unit.date),this._update(t.Unit.year),this._update(t.Unit.month),this.decadeDisplay._update(this.widget,this.paint),this._updateCalendarHeader();break;case"all":this._hasTime&&this._update("clock"),this._hasDate&&this._update("calendar")}}paint(t,e,s,i){}show(){if(null==this.widget){if(this._showSetDefaultIfNeeded(),this._buildWidget(),this._updateTheme(),this._showSetupViewMode(),this.optionsStore.options.display.inline)this.optionsStore.element.appendChild(this.widget);else{const t=this.optionsStore.options?.container||document.body,e=this.optionsStore.options?.display?.placement||"bottom";t.appendChild(this.widget),this.createPopup(this.optionsStore.element,this.widget,{modifiers:[{name:"eventListeners",enabled:!0}],placement:"rtl"===document.documentElement.dir?`${e}-end`:`${e}-start`}).then()}"clock"==this.optionsStore.options.display.viewMode&&this._eventEmitters.action.emit({e:null,action:z.showClock}),this.widget.querySelectorAll("[data-action]").forEach((t=>t.addEventListener("click",this._actionsClickEvent))),this._hasTime&&this.optionsStore.options.display.sideBySide&&(this.timeDisplay._update(this.widget),this.widget.getElementsByClassName(i.css.clockContainer)[0].style.display="grid")}this.widget.classList.add(i.css.show),this.optionsStore.options.display.inline||(this.updatePopup(),document.addEventListener("click",this._documentClickEvent)),this._eventEmitters.triggerEvent.emit({type:i.events.show}),this._isVisible=!0}_showSetupViewMode(){const t=this._hasTime&&!this._hasDate;t?(this.optionsStore.currentView="clock",this._eventEmitters.action.emit({e:null,action:z.showClock})):this.optionsStore.currentCalendarViewMode||(this.optionsStore.currentCalendarViewMode=this.optionsStore.minimumCalendarViewMode),t||"clock"===this.optionsStore.options.display.viewMode||(this._hasTime&&(this.optionsStore.options.display.sideBySide?q.show(this.timeContainer):q.hideImmediately(this.timeContainer)),q.show(this.dateContainer)),this._hasDate&&this._showMode()}_showSetDefaultIfNeeded(){if(0==this.dates.picked.length){if(this.optionsStore.options.useCurrent&&!this.optionsStore.options.defaultDate){const e=(new l).setLocalization(this.optionsStore.options.localization);if(!this.optionsStore.options.keepInvalid){let s=0,i=1;for(this.optionsStore.options.restrictions.maxDate?.isBefore(e)&&(i=-1);!this.validation.isValid(e)&&s>31;)e.manipulate(i,t.Unit.date),s++}this.dates.setValue(e)}this.optionsStore.options.defaultDate&&this.dates.setValue(this.optionsStore.options.defaultDate)}}async createPopup(t,e,s){let i;if(window?.Popper)i=window?.Popper?.createPopper;else{const{createPopper:t}=await import("@popperjs/core");i=t}i&&(this._popperInstance=i(t,e,s))}updatePopup(){this._popperInstance?.update()}_showMode(t){if(!this.widget)return;if(t){const e=Math.max(this.optionsStore.minimumCalendarViewMode,Math.min(3,this.optionsStore.currentCalendarViewMode+t));if(this.optionsStore.currentCalendarViewMode==e)return;this.optionsStore.currentCalendarViewMode=e}this.widget.querySelectorAll(`.${i.css.dateContainer} > div:not(.${i.css.calendarHeader}), .${i.css.timeContainer} > div:not(.${i.css.clockContainer})`).forEach((t=>t.style.display="none"));const e=p[this.optionsStore.currentCalendarViewMode],s=this.widget.querySelector(`.${e.className}`);switch(e.className){case i.css.decadesContainer:this.decadeDisplay._update(this.widget,this.paint);break;case i.css.yearsContainer:this.yearDisplay._update(this.widget,this.paint);break;case i.css.monthsContainer:this.monthDisplay._update(this.widget,this.paint);break;case i.css.daysContainer:this.dateDisplay._update(this.widget,this.paint)}s.style.display="grid",this.optionsStore.options.display.sideBySide&&(this.widget.querySelectorAll(`.${i.css.clockContainer}`)[0].style.display="grid"),this._updateCalendarHeader(),this._eventEmitters.viewUpdate.emit()}_updateTheme(t){if(this.widget){if(t){if(this.optionsStore.options.display.theme===t)return;this.optionsStore.options.display.theme=t}this.widget.classList.remove("light","dark"),this.widget.classList.add(this._getThemeClass()),"auto"===this.optionsStore.options.display.theme?window.matchMedia(i.css.isDarkPreferredQuery).addEventListener("change",(()=>this._updateTheme())):window.matchMedia(i.css.isDarkPreferredQuery).removeEventListener("change",(()=>this._updateTheme()))}}_getThemeClass(){const t=this.optionsStore.options.display.theme||"auto",e=window.matchMedia&&window.matchMedia(i.css.isDarkPreferredQuery).matches;switch(t){case"light":return i.css.lightTheme;case"dark":return i.css.darkTheme;case"auto":return e?i.css.darkTheme:i.css.lightTheme}}_updateCalendarHeader(){if(!this._hasDate)return;const t=[...this.widget.querySelector(`.${i.css.dateContainer} div[style*="display: grid"]`).classList].find((t=>t.startsWith(i.css.dateContainer))),[e,s,o]=this.widget.getElementsByClassName(i.css.calendarHeader)[0].getElementsByTagName("div");switch(t){case i.css.decadesContainer:e.setAttribute("title",this.optionsStore.options.localization.previousCentury),s.setAttribute("title",""),o.setAttribute("title",this.optionsStore.options.localization.nextCentury);break;case i.css.yearsContainer:e.setAttribute("title",this.optionsStore.options.localization.previousDecade),s.setAttribute("title",this.optionsStore.options.localization.selectDecade),o.setAttribute("title",this.optionsStore.options.localization.nextDecade);break;case i.css.monthsContainer:e.setAttribute("title",this.optionsStore.options.localization.previousYear),s.setAttribute("title",this.optionsStore.options.localization.selectYear),o.setAttribute("title",this.optionsStore.options.localization.nextYear);break;case i.css.daysContainer:e.setAttribute("title",this.optionsStore.options.localization.previousMonth),s.setAttribute("title",this.optionsStore.options.localization.selectMonth),o.setAttribute("title",this.optionsStore.options.localization.nextMonth),s.setAttribute(t,this.optionsStore.viewDate.format(this.optionsStore.options.localization.dayViewHeaderFormat))}s.innerText=s.getAttribute(t)}hide(){this.widget&&this._isVisible&&(this.widget.classList.remove(i.css.show),this._isVisible&&(this._eventEmitters.triggerEvent.emit({type:i.events.hide,date:this.optionsStore.unset?null:this.dates.lastPicked?.clone}),this._isVisible=!1),document.removeEventListener("click",this._documentClickEvent))}toggle(){return this._isVisible?this.hide():this.show()}_dispose(){document.removeEventListener("click",this._documentClickEvent),this.widget&&(this.widget.querySelectorAll("[data-action]").forEach((t=>t.removeEventListener("click",this._actionsClickEvent))),this.widget.parentNode.removeChild(this.widget),this._widget=void 0)}_buildWidget(){const t=document.createElement("div");t.classList.add(i.css.widget);const e=document.createElement("div");e.classList.add(i.css.dateContainer),e.append(this.getHeadTemplate(),this.decadeDisplay.getPicker(),this.yearDisplay.getPicker(),this.monthDisplay.getPicker(),this.dateDisplay.getPicker());const s=document.createElement("div");s.classList.add(i.css.timeContainer),s.appendChild(this.timeDisplay.getPicker(this._iconTag.bind(this))),s.appendChild(this.hourDisplay.getPicker()),s.appendChild(this.minuteDisplay.getPicker()),s.appendChild(this.secondDisplay.getPicker());const o=document.createElement("div");if(o.classList.add(i.css.toolbar),o.append(...this.getToolbarElements()),this.optionsStore.options.display.inline&&t.classList.add(i.css.inline),this.optionsStore.options.display.calendarWeeks&&t.classList.add("calendarWeeks"),this.optionsStore.options.display.sideBySide&&this._hasDateAndTime)return void this._buildWidgetSideBySide(t,e,s,o);"top"===this.optionsStore.options.display.toolbarPlacement&&t.appendChild(o);const a=(e,s,o,a)=>{e&&(s&&(o.classList.add(i.css.collapse),a&&o.classList.add(i.css.show)),t.appendChild(o))};a(this._hasDate,this._hasTime,e,"clock"!==this.optionsStore.options.display.viewMode),a(this._hasTime,this._hasDate,s,"clock"===this.optionsStore.options.display.viewMode),"bottom"===this.optionsStore.options.display.toolbarPlacement&&t.appendChild(o);const n=document.createElement("div");n.classList.add("arrow"),n.setAttribute("data-popper-arrow",""),t.appendChild(n),this._widget=t}_buildWidgetSideBySide(t,e,s,o){t.classList.add(i.css.sideBySide),"top"===this.optionsStore.options.display.toolbarPlacement&&t.appendChild(o);const a=document.createElement("div");a.classList.add("td-row"),e.classList.add("td-half"),s.classList.add("td-half"),a.appendChild(e),a.appendChild(s),t.appendChild(a),"bottom"===this.optionsStore.options.display.toolbarPlacement&&t.appendChild(o),this._widget=t}get _hasTime(){return this.optionsStore.options.display.components.clock&&(this.optionsStore.options.display.components.hours||this.optionsStore.options.display.components.minutes||this.optionsStore.options.display.components.seconds)}get _hasDate(){return this.optionsStore.options.display.components.calendar&&(this.optionsStore.options.display.components.year||this.optionsStore.options.display.components.month||this.optionsStore.options.display.components.date)}get _hasDateAndTime(){return this._hasDate&&this._hasTime}getToolbarElements(){const t=[];if(this.optionsStore.options.display.buttons.today){const e=document.createElement("div");e.setAttribute("data-action",z.today),e.setAttribute("title",this.optionsStore.options.localization.today),e.appendChild(this._iconTag(this.optionsStore.options.display.icons.today)),t.push(e)}if(!this.optionsStore.options.display.sideBySide&&this._hasDate&&this._hasTime){let e,s;"clock"===this.optionsStore.options.display.viewMode?(e=this.optionsStore.options.localization.selectDate,s=this.optionsStore.options.display.icons.date):(e=this.optionsStore.options.localization.selectTime,s=this.optionsStore.options.display.icons.time);const i=document.createElement("div");i.setAttribute("data-action",z.togglePicker),i.setAttribute("title",e),i.appendChild(this._iconTag(s)),t.push(i)}if(this.optionsStore.options.display.buttons.clear){const e=document.createElement("div");e.setAttribute("data-action",z.clear),e.setAttribute("title",this.optionsStore.options.localization.clear),e.appendChild(this._iconTag(this.optionsStore.options.display.icons.clear)),t.push(e)}if(this.optionsStore.options.display.buttons.close){const e=document.createElement("div");e.setAttribute("data-action",z.close),e.setAttribute("title",this.optionsStore.options.localization.close),e.appendChild(this._iconTag(this.optionsStore.options.display.icons.close)),t.push(e)}return t}getHeadTemplate(){const t=document.createElement("div");t.classList.add(i.css.calendarHeader);const e=document.createElement("div");e.classList.add(i.css.previous),e.setAttribute("data-action",z.previous),e.appendChild(this._iconTag(this.optionsStore.options.display.icons.previous));const s=document.createElement("div");s.classList.add(i.css.switch),s.setAttribute("data-action",z.changeCalendarView);const o=document.createElement("div");return o.classList.add(i.css.next),o.setAttribute("data-action",z.next),o.appendChild(this._iconTag(this.optionsStore.options.display.icons.next)),t.append(e,s,o),t}_iconTag(t){if("sprites"===this.optionsStore.options.display.icons.type){const e=document.createElementNS("http://www.w3.org/2000/svg","svg"),s=document.createElementNS("http://www.w3.org/2000/svg","use");return s.setAttribute("xlink:href",t),s.setAttribute("href",t),e.appendChild(s),e}const e=document.createElement("i");return e.classList.add(...t.split(" ")),e}_rebuild(){const t=this._isVisible;this._dispose(),t&&this.show()}}class j{constructor(){this.optionsStore=h.locate(u),this.dates=h.locate($),this.validation=h.locate(m),this.display=h.locate(Y),this._eventEmitters=h.locate(g),this._eventEmitters.action.subscribe((t=>{this.do(t.e,t.action)}))}do(e,s){const o=e?.currentTarget;if(o?.classList?.contains(i.css.disabled))return;s=s||o?.dataset?.action;const a=(this.dates.lastPicked||this.optionsStore.viewDate).clone;switch(s){case z.next:case z.previous:this.handleNextPrevious(s);break;case z.changeCalendarView:this.display._showMode(1),this.display._updateCalendarHeader();break;case z.selectMonth:case z.selectYear:case z.selectDecade:this.handleSelectCalendarMode(s,o);break;case z.selectDay:this.handleSelectDay(o);break;case z.selectHour:{let t=+o.dataset.value;a.hours>=12&&this.optionsStore.isTwelveHour&&(t+=12),a.hours=t,this.dates.setValue(a,this.dates.lastPickedIndex),this.hideOrClock(e);break}case z.selectMinute:a.minutes=+o.dataset.value,this.dates.setValue(a,this.dates.lastPickedIndex),this.hideOrClock(e);break;case z.selectSecond:a.seconds=+o.dataset.value,this.dates.setValue(a,this.dates.lastPickedIndex),this.hideOrClock(e);break;case z.incrementHours:this.manipulateAndSet(a,t.Unit.hours);break;case z.incrementMinutes:this.manipulateAndSet(a,t.Unit.minutes,this.optionsStore.options.stepping);break;case z.incrementSeconds:this.manipulateAndSet(a,t.Unit.seconds);break;case z.decrementHours:this.manipulateAndSet(a,t.Unit.hours,-1);break;case z.decrementMinutes:this.manipulateAndSet(a,t.Unit.minutes,-1*this.optionsStore.options.stepping);break;case z.decrementSeconds:this.manipulateAndSet(a,t.Unit.seconds,-1);break;case z.toggleMeridiem:this.manipulateAndSet(a,t.Unit.hours,this.dates.lastPicked.hours>=12?-12:12);break;case z.togglePicker:this.handleToggle(o);break;case z.showClock:case z.showHours:case z.showMinutes:case z.showSeconds:this.optionsStore.options.display.sideBySide||"clock"===this.optionsStore.currentView||(q.hideImmediately(this.display.dateContainer),q.showImmediately(this.display.timeContainer)),this.handleShowClockContainers(s);break;case z.clear:this.dates.setValue(null),this.display._updateCalendarHeader();break;case z.close:this.display.hide();break;case z.today:{const e=(new l).setLocalization(this.optionsStore.options.localization);this._eventEmitters.updateViewDate.emit(e),this.validation.isValid(e,t.Unit.date)&&this.dates.setValue(e,this.dates.lastPickedIndex);break}}}handleShowClockContainers(e){if(!this.display._hasTime)return void i.errorMessages.throwError("Cannot show clock containers when time is disabled.");this.optionsStore.currentView="clock",this.display.widget.querySelectorAll(`.${i.css.timeContainer} > div`).forEach((t=>t.style.display="none"));let s="";switch(e){case z.showClock:s=i.css.clockContainer,this.display._update("clock");break;case z.showHours:s=i.css.hourContainer,this.display._update(t.Unit.hours);break;case z.showMinutes:s=i.css.minuteContainer,this.display._update(t.Unit.minutes);break;case z.showSeconds:s=i.css.secondContainer,this.display._update(t.Unit.seconds)}this.display.widget.getElementsByClassName(s)[0].style.display="grid"}handleNextPrevious(t){const{unit:e,step:s}=p[this.optionsStore.currentCalendarViewMode];t===z.next?this.optionsStore.viewDate.manipulate(s,e):this.optionsStore.viewDate.manipulate(-1*s,e),this._eventEmitters.viewUpdate.emit(),this.display._showMode()}hideOrClock(t){this.optionsStore.isTwelveHour||this.optionsStore.options.display.components.minutes||this.optionsStore.options.display.keepOpen||this.optionsStore.options.display.inline?this.do(t,z.showClock):this.display.hide()}manipulateAndSet(t,e,s=1){const i=t.manipulate(s,e);this.validation.isValid(i,e)&&this.dates.setValue(i,this.dates.lastPickedIndex)}handleSelectCalendarMode(t,e){const s=+e.dataset.value;switch(t){case z.selectMonth:this.optionsStore.viewDate.month=s;break;case z.selectYear:case z.selectDecade:this.optionsStore.viewDate.year=s}this.optionsStore.currentCalendarViewMode===this.optionsStore.minimumCalendarViewMode?(this.dates.setValue(this.optionsStore.viewDate,this.dates.lastPickedIndex),this.optionsStore.options.display.inline||this.display.hide()):this.display._showMode(-1)}handleToggle(t){t.getAttribute("title")===this.optionsStore.options.localization.selectDate?(t.setAttribute("title",this.optionsStore.options.localization.selectTime),t.innerHTML=this.display._iconTag(this.optionsStore.options.display.icons.time).outerHTML,this.display._updateCalendarHeader(),this.optionsStore.refreshCurrentView()):(t.setAttribute("title",this.optionsStore.options.localization.selectDate),t.innerHTML=this.display._iconTag(this.optionsStore.options.display.icons.date).outerHTML,this.display._hasTime&&(this.handleShowClockContainers(z.showClock),this.display._update("clock"))),this.display.widget.querySelectorAll(`.${i.css.dateContainer}, .${i.css.timeContainer}`).forEach((t=>q.toggle(t))),this._eventEmitters.viewUpdate.emit()}handleSelectDay(e){const s=this.optionsStore.viewDate.clone;e.classList.contains(i.css.old)&&s.manipulate(-1,t.Unit.month),e.classList.contains(i.css.new)&&s.manipulate(1,t.Unit.month),s.date=+e.dataset.day,this.optionsStore.options.dateRange?this.handleDateRange(s):this.optionsStore.options.multipleDates?this.handleMultiDate(s):this.dates.setValue(s,this.dates.lastPickedIndex),this.display._hasTime||this.optionsStore.options.display.keepOpen||this.optionsStore.options.display.inline||this.optionsStore.options.multipleDates||this.optionsStore.options.dateRange||this.display.hide()}handleMultiDate(e){let s=this.dates.pickedIndex(e,t.Unit.date);console.log(s),-1!==s?this.dates.setValue(null,s):(s=this.dates.lastPickedIndex+1,0===this.dates.picked.length&&(s=0),this.dates.setValue(e,s))}handleDateRange(t){switch(this.dates.picked.length){case 2:this.dates.clear();break;case 1:{const e=this.dates.picked[0];if(t.getTime()===e.getTime()){this.dates.clear();break}return t.isBefore(e)?(this.dates.setValue(t,0),void this.dates.setValue(e,1)):void this.dates.setValue(t,1)}}this.dates.setValue(t,0)}}class R{constructor(t,e={}){this._subscribers={},this._isDisabled=!1,this._inputChangeEvent=t=>{const e=t?.detail;if(e)return;const s=()=>{this.dates.lastPicked&&(this.optionsStore.viewDate=this.dates.lastPicked.clone)},i=this.optionsStore.input.value;if(this.optionsStore.options.multipleDates)try{const t=i.split(this.optionsStore.options.multipleDatesSeparator);for(let e=0;e{this.optionsStore.element?.disabled||this.optionsStore.input?.disabled||this.toggle()},h=new c,this._eventEmitters=h.locate(g),this.optionsStore=h.locate(u),this.display=h.locate(Y),this.dates=h.locate($),this.actions=h.locate(j),t||i.errorMessages.mustProvideElement(),this.optionsStore.element=t,this._initializeOptions(e,f,!0),this.optionsStore.viewDate.setLocalization(this.optionsStore.options.localization),this.optionsStore.unset=!0,this._initializeInput(),this._initializeToggle(),this.optionsStore.options.display.inline&&this.display.show(),this._eventEmitters.triggerEvent.subscribe((t=>{this._triggerEvent(t)})),this._eventEmitters.viewUpdate.subscribe((()=>{this._viewUpdate()})),this._eventEmitters.updateViewDate.subscribe((t=>{this.viewDate=t}))}get viewDate(){return this.optionsStore.viewDate}set viewDate(t){this.optionsStore.viewDate=t,this.optionsStore.viewDate.setLocalization(this.optionsStore.options.localization),this.display._update("clock"===this.optionsStore.currentView?"clock":"calendar")}updateOptions(t,e=!1){e?this._initializeOptions(t,f):this._initializeOptions(t,this.optionsStore.options),this.optionsStore.viewDate.setLocalization(this.optionsStore.options.localization),this.display._rebuild()}toggle(){this._isDisabled||this.display.toggle()}show(){this._isDisabled||this.display.show()}hide(){this.display.hide()}disable(){this._isDisabled=!0,this.optionsStore.input?.setAttribute("disabled","disabled"),this.display.hide()}enable(){this._isDisabled=!1,this.optionsStore.input?.removeAttribute("disabled")}clear(){this.optionsStore.input.value="",this.dates.clear()}subscribe(t,e){let s;"string"==typeof t&&(t=[t]),s=Array.isArray(e)?e:[e],t.length!==s.length&&i.errorMessages.subscribeMismatch();const o=[];for(let e=0;e{e(t)}))}_viewUpdate(){this._triggerEvent({type:i.events.update,viewDate:this.optionsStore.viewDate.clone})}_unsubscribe(t,e){this._subscribers[t].splice(e,1)}_initializeOptions(t,e,s=!1){let i=V.deepCopy(t);i=V._mergeOptions(i,e),s&&(i=V._dataToOptions(this.optionsStore.element,i)),V._validateConflicts(i),i.viewDate=i.viewDate.setLocalization(i.localization),this.optionsStore.viewDate.isSame(i.viewDate)||(this.optionsStore.viewDate=i.viewDate),i.display.components.year&&(this.optionsStore.minimumCalendarViewMode=2),i.display.components.month&&(this.optionsStore.minimumCalendarViewMode=1),i.display.components.date&&(this.optionsStore.minimumCalendarViewMode=0),this.optionsStore.currentCalendarViewMode=Math.max(this.optionsStore.minimumCalendarViewMode,this.optionsStore.currentCalendarViewMode),p[this.optionsStore.currentCalendarViewMode].name!==i.display.viewMode&&(this.optionsStore.currentCalendarViewMode=Math.max(p.findIndex((t=>t.name===i.display.viewMode)),this.optionsStore.minimumCalendarViewMode)),this.display?.isVisible&&this.display._update("all"),i.display.components.useTwentyfourHour&&void 0===i.localization.hourCycle?i.localization.hourCycle="h24":void 0===i.localization.hourCycle&&(i.localization.hourCycle=d(i.localization.locale)),this.optionsStore.options=i}_initializeInput(){if("INPUT"==this.optionsStore.element.tagName)this.optionsStore.input=this.optionsStore.element;else{const t=this.optionsStore.element.dataset.tdTargetInput;this.optionsStore.input=null==t||"nearest"==t?this.optionsStore.element.querySelector("input"):this.optionsStore.element.querySelector(t)}this.optionsStore.input&&(!this.optionsStore.input.value&&this.optionsStore.options.defaultDate&&(this.optionsStore.input.value=this.dates.formatInput(this.optionsStore.options.defaultDate)),this.optionsStore.input.addEventListener("change",this._inputChangeEvent),this.optionsStore.options.allowInputToggle&&this.optionsStore.input.addEventListener("click",this._toggleClickEvent),this.optionsStore.input.value&&this._inputChangeEvent())}_initializeToggle(){if(this.optionsStore.options.display.inline)return;let t=this.optionsStore.element.dataset.tdTargetToggle;"nearest"==t&&(t='[data-td-toggle="datetimepicker"]'),this._toggle=null==t?this.optionsStore.element:this.optionsStore.element.querySelector(t),this._toggle.addEventListener("click",this._toggleClickEvent)}_handleAfterChangeEvent(t){!this.optionsStore.options.promptTimeOnDateChange||this.optionsStore.options.multipleDates||this.optionsStore.options.display.inline||this.optionsStore.options.display.sideBySide||!this.display._hasTime||this.display.widget?.getElementsByClassName(i.css.show)[0].classList.contains(i.css.timeContainer)||!t.oldDate&&this.optionsStore.options.useCurrent||t.oldDate&&t.date?.isSame(t.oldDate)||(clearTimeout(this._currentPromptTimeTimeout),this._currentPromptTimeTimeout=setTimeout((()=>{this.display.widget&&this._eventEmitters.action.emit({e:{currentTarget:this.display.widget.querySelector(`.${i.css.switch}`)},action:z.togglePicker})}),this.optionsStore.options.promptTimeOnDateChangeTransitionDelay))}}const Q={},J=t=>{Q[t.name]||(Q[t.name]=t.localization)},K=t=>{const e=Q[t];e&&(f.localization=e)},Z=function(t,e=undefined){return t?(t.installed||(t(e,{TempusDominus:R,Dates:$,Display:Y,DateTime:l,Namespace:i},X),t.installed=!0),X):X},G="6.7.7",X={TempusDominus:R,extend:Z,loadLocale:J,locale:K,Namespace:i,DefaultOptions:f,DateTime:l,Unit:t.Unit,version:G,DefaultEnLocalization:S};t.DateTime=l,t.DefaultEnLocalization=S,t.DefaultOptions=f,t.Namespace=i,t.TempusDominus=R,t.extend=Z,t.loadLocale=J,t.locale=K,t.version=G,Object.defineProperty(t,"__esModule",{value:!0})}));
diff --git a/oioioi/base/templates/admin/actions.html b/oioioi/base/templates/admin/actions.html
index d5d104015..c4700bf9a 100644
--- a/oioioi/base/templates/admin/actions.html
+++ b/oioioi/base/templates/admin/actions.html
@@ -1,11 +1,11 @@
{% load i18n simple_filters %}
-