diff --git a/package.json b/package.json index 20e5645d..3f6c4ed0 100644 --- a/package.json +++ b/package.json @@ -14,7 +14,9 @@ "dev": "yarn start", "lint": "node generate_translations.js && tsc --noEmit && eslint --report-unused-disable-directives --ext .js,.ts,.tsx \"src/**\" && prettier --check \"src/**/*.{ts,tsx,js,css,scss}\"", "prepare": "husky install", - "start": "yarn build:dev --watch" + "start": "yarn build:dev --watch", + "themes:build": "sass src/assets/css/themes/:src/assets/css/themes", + "themes:watch": "sass --watch src/assets/css/themes/:src/assets/css/themes" }, "lint-staged": { "*.{ts,tsx,js}": [ @@ -101,7 +103,7 @@ "@types/toastify-js": "^1.11.1", "@typescript-eslint/eslint-plugin": "^5.59.5", "@typescript-eslint/parser": "^5.59.5", - "bootswatch": "^5.2.3", + "bootstrap-v4": "npm:bootstrap@^4.6.2", "eslint": "^8.40.0", "eslint-plugin-inferno": "^7.32.2", "eslint-plugin-prettier": "^4.2.1", diff --git a/src/assets/css/themes/_variables.darkly-red.scss b/src/assets/css/themes/_variables.darkly-red.scss new file mode 100644 index 00000000..c36cbb3d --- /dev/null +++ b/src/assets/css/themes/_variables.darkly-red.scss @@ -0,0 +1,108 @@ +$white: #fff; +$gray-100: #f8f9fa; +$gray-200: #ebebeb; +$gray-300: #dee2e6; +$gray-400: #ced4da; +$gray-500: #adb5bd; +$gray-600: #888; +$gray-700: #444; +$gray-800: #303030; +$gray-900: #222; +$black: #000; +$blue: #375a7f; +$indigo: #6610f2; +$purple: #6f42c1; +$pink: #e83e8c; +$red: #e74c3c; +$orange: #fd7e14; +$yellow: #f39c12; +$green: #00bc8c; +$teal: #20c997; +$cyan: #3498db; +$primary: $blue; +$secondary: #444; +$success: $green; +$info: $cyan; +$warning: $yellow; +$danger: $red; +$light: $gray-800; +$dark: $gray-300; +$yiq-contrasted-threshold: 175; +$body-bg: $gray-900; +$body-color: $gray-300; +$link-color: $red; +$font-family-sans-serif: "Lato", -apple-system, BlinkMacSystemFont, "Segoe UI", + Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", + "Segoe UI Emoji", "Segoe UI Symbol"; +$font-size-base: 0.9375rem; +$h1-font-size: 3rem; +$h2-font-size: 2.5rem; +$h3-font-size: 2rem; +$text-muted: $gray-600; +$table-accent-bg: $gray-800; +$table-border-color: $gray-700; +$input-border-color: $body-bg; +$input-group-addon-color: $gray-500; +$input-group-addon-bg: $gray-700; +$custom-file-color: $gray-500; +$custom-file-border-color: $body-bg; +$dropdown-bg: $gray-900; +$dropdown-border-color: $gray-700; +$dropdown-divider-bg: $gray-700; +$dropdown-link-color: $white; +$dropdown-link-hover-color: $white; +$dropdown-link-hover-bg: $primary; +$nav-link-padding-x: 2rem; +$nav-link-disabled-color: $gray-500; +$nav-tabs-border-color: $gray-700; +$nav-tabs-link-hover-border-color: $nav-tabs-border-color $nav-tabs-border-color + transparent; +$nav-tabs-link-active-color: $white; +$nav-tabs-link-active-border-color: $nav-tabs-border-color + $nav-tabs-border-color transparent; +$navbar-padding-y: 1rem; +$navbar-dark-color: rgba($white, 0.6); +$navbar-dark-hover-color: $white; +$navbar-light-color: rgba($white, 0.6); +$navbar-light-hover-color: $white; +$navbar-light-active-color: $white; +$navbar-light-toggler-border-color: rgba($gray-900, 0.1); +$pagination-color: $white; +$pagination-bg: $success; +$pagination-border-width: 0; +$pagination-border-color: transparent; +$pagination-hover-color: $white; +$pagination-hover-bg: lighten($success, 10%); +$pagination-hover-border-color: transparent; +$pagination-active-bg: $pagination-hover-bg; +$pagination-active-border-color: transparent; +$pagination-disabled-color: $white; +$pagination-disabled-bg: darken($success, 15%); +$pagination-disabled-border-color: transparent; +$jumbotron-bg: $gray-800; +$card-cap-bg: $gray-700; +$card-bg: $gray-800; +$popover-bg: $gray-800; +$popover-header-bg: $gray-700; +$toast-background-color: $gray-700; +$toast-header-background-color: $gray-800; +$modal-content-bg: $gray-800; +$modal-content-border-color: $gray-700; +$modal-header-border-color: $gray-700; +$progress-bg: $gray-700; +$list-group-bg: $gray-800; +$list-group-border-color: $gray-700; +$list-group-hover-bg: $gray-700; +$breadcrumb-bg: $gray-700; +$close-color: $white; +$close-text-shadow: none; +$pre-color: inherit; +$mark-bg: #333; +$custom-select-bg: $secondary; +$custom-select-color: $white; +$input-bg: $secondary; +$input-color: $white; +$input-disabled-bg: darken($secondary, 10%); +$light: $gray-800; +$navbar-light-brand-color: $white; +$navbar-light-brand-hover-color: $navbar-light-brand-color; diff --git a/src/assets/css/themes/_variables.darkly.scss b/src/assets/css/themes/_variables.darkly.scss index 668f5a62..608b4001 100644 --- a/src/assets/css/themes/_variables.darkly.scss +++ b/src/assets/css/themes/_variables.darkly.scss @@ -103,5 +103,5 @@ $input-bg: $secondary; $input-color: $white; $input-disabled-bg: darken($secondary, 10%); $light: $gray-800; -$navbar-light-brand-color: $navbar-dark-active-color; -$navbar-light-brand-hover-color: $navbar-dark-active-color; +$navbar-light-brand-color: $white; +$navbar-light-brand-hover-color: $navbar-light-brand-color; diff --git a/src/assets/css/themes/_variables.litely-red.scss b/src/assets/css/themes/_variables.litely-red.scss new file mode 100644 index 00000000..4cec067a --- /dev/null +++ b/src/assets/css/themes/_variables.litely-red.scss @@ -0,0 +1,47 @@ +$white: #fff; +$gray-100: #f8f9fa; +$gray-200: #e9ecef; +$gray-300: #dee2e6; +$gray-400: #ced4da; +$gray-500: #adb5bd; +$gray-600: #6c757d; +$gray-700: #495057; +$gray-800: #343a40; +$gray-900: #212529; +$black: #000; +$blue: #007bff; +$indigo: #6610f2; +$white: #ffffff; +$orange: #f1641e; +$cyan: #02bdc2; +$green: #00c853; +$primary: #f1641e; +$secondary: #c80000; +$info: $blue; +$body-color: $gray-700; +$link-color: $primary; +$red: #d8486a; +$border-radius: 0.5rem; +$border-radius-lg: 0.5rem; +$border-radius-sm: 1rem; +$font-family-sans-serif: -apple-system, BlinkMacSystemFont, "Droid Sans", + "Segoe UI", "Helvetica", Arial, sans-serif; +$headings-color: $gray-700; +$input-btn-focus-color: rgba($primary, 0.75); +$form-feedback-valid-color: $info; +$navbar-light-color: $gray-600; +$black: #222222; +$navbar-dark-toggler-border-color: rgba($black, 0.1); +$navbar-light-active-color: $gray-900; +$card-color: $gray-700; +$card-cap-color: $gray-700; +$info: $blue; +$body-bg: #fff; +$success: $indigo; +$danger: darken($primary, 24%); +$navbar-light-hover-color: $gray-900; +$card-bg: $gray-100; +$border-color: $gray-700; +$mark-bg: rgb(255, 252, 239); +$font-weight-bold: 600; +$rounded-pill: 0.25rem; diff --git a/src/assets/css/themes/_variables.litely.scss b/src/assets/css/themes/_variables.litely.scss index cfb12052..1f78cd28 100644 --- a/src/assets/css/themes/_variables.litely.scss +++ b/src/assets/css/themes/_variables.litely.scss @@ -1,11 +1,25 @@ +$white: #fff; +$gray-100: #f8f9fa; +$gray-200: #e9ecef; +$gray-300: #dee2e6; +$gray-400: #ced4da; +$gray-500: #adb5bd; +$gray-600: #6c757d; +$gray-700: #495057; +$gray-800: #343a40; +$gray-900: #212529; +$black: #000; +$blue: #007bff; +$indigo: #6610f2; $white: #ffffff; $orange: #f1641e; $cyan: #02bdc2; $green: #00c853; -$secondary: $green; -$body-color: $gray-700; -$link-color: theme-color("primary"); $primary: $orange; +$secondary: $green; +$info: $cyan; +$body-color: $gray-700; +$link-color: $primary; $red: #d8486a; $border-radius: 0.5rem; $border-radius-lg: 0.5rem; @@ -13,8 +27,8 @@ $border-radius-sm: 1rem; $font-family-sans-serif: -apple-system, BlinkMacSystemFont, "Droid Sans", "Segoe UI", "Helvetica", Arial, sans-serif; $headings-color: $gray-700; -$input-btn-focus-color: rgba($component-active-bg, 0.75); -$form-feedback-valid-color: theme-color("info"); +$input-btn-focus-color: rgba($primary, 0.75); +$form-feedback-valid-color: $info; $navbar-light-color: $gray-600; $black: #222222; $navbar-dark-toggler-border-color: rgba($black, 0.1); diff --git a/src/assets/css/themes/darkly-red.css b/src/assets/css/themes/darkly-red.css index d742f8c9..073c3258 100644 --- a/src/assets/css/themes/darkly-red.css +++ b/src/assets/css/themes/darkly-red.css @@ -1,3 +1,10 @@ +@charset "UTF-8"; +/*! + * Bootstrap v4.6.2 (https://getbootstrap.com/) + * Copyright 2011-2022 The Bootstrap Authors + * Copyright 2011-2022 Twitter, Inc. + * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE) + */ :root { --blue: #375a7f; --indigo: #6610f2; @@ -31,17 +38,20 @@ --font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; } + *, -::after, -::before { +*::before, +*::after { box-sizing: border-box; } + html { font-family: sans-serif; line-height: 1.15; -webkit-text-size-adjust: 100%; - -webkit-tap-highlight-color: transparent; + -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } + article, aside, figcaption, @@ -54,11 +64,12 @@ nav, section { display: block; } + body { margin: 0; - font-family: Lato, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, - "Helvetica Neue", Cantarell, Arial, sans-serif, "Apple Color Emoji", - "Segoe UI Emoji", "Segoe UI Symbol"; + font-family: "Lato", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, + "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", + "Segoe UI Symbol"; font-size: 0.9375rem; font-weight: 400; line-height: 1.5; @@ -66,14 +77,17 @@ body { text-align: left; background-color: #222; } + [tabindex="-1"]:focus:not(:focus-visible) { outline: 0 !important; } + hr { box-sizing: content-box; height: 0; overflow: visible; } + h1, h2, h3, @@ -83,52 +97,63 @@ h6 { margin-top: 0; margin-bottom: 0.5rem; } + p { margin-top: 0; margin-bottom: 1rem; } -abbr[data-original-title], -abbr[title] { + +abbr[title], +abbr[data-original-title] { text-decoration: underline; text-decoration: underline dotted; cursor: help; border-bottom: 0; text-decoration-skip-ink: none; } + address { margin-bottom: 1rem; font-style: normal; line-height: inherit; } -dl, + ol, -ul { +ul, +dl { margin-top: 0; margin-bottom: 1rem; } + ol ol, +ul ul, ol ul, -ul ol, -ul ul { +ul ol { margin-bottom: 0; } + dt { font-weight: 700; } + dd { margin-bottom: 0.5rem; margin-left: 0; } + blockquote { margin: 0 0 1rem; } + b, strong { font-weight: bolder; } + small { font-size: 80%; } + sub, sup { position: relative; @@ -136,57 +161,68 @@ sup { line-height: 0; vertical-align: baseline; } + sub { bottom: -0.25em; } + sup { top: -0.5em; } + a { color: #e74c3c; text-decoration: none; background-color: transparent; } a:hover { - color: #a62f22; + color: #bf2718; text-decoration: underline; } -a:not([href]) { + +a:not([href]):not([class]) { color: inherit; text-decoration: none; } -a:not([href]):hover { +a:not([href]):not([class]):hover { color: inherit; text-decoration: none; } + +pre, code, kbd, -pre, samp { font-family: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; font-size: 1em; } + pre { margin-top: 0; margin-bottom: 1rem; overflow: auto; -ms-overflow-style: scrollbar; } + figure { margin: 0 0 1rem; } + img { vertical-align: middle; border-style: none; } + svg { overflow: hidden; vertical-align: middle; } + table { border-collapse: collapse; } + caption { padding-top: 0.75rem; padding-bottom: 0.75rem; @@ -194,78 +230,94 @@ caption { text-align: left; caption-side: bottom; } + th { text-align: inherit; + text-align: -webkit-match-parent; } + label { display: inline-block; margin-bottom: 0.5rem; } + button { border-radius: 0; } -button:focus { - outline: 1px dotted; - outline: 5px auto -webkit-focus-ring-color; + +button:focus:not(:focus-visible) { + outline: 0; } -button, + input, -optgroup, +button, select, +optgroup, textarea { margin: 0; font-family: inherit; font-size: inherit; line-height: inherit; } + button, input { overflow: visible; } + button, select { text-transform: none; } + [role="button"] { cursor: pointer; } + select { word-wrap: normal; } + +button, [type="button"], [type="reset"], -[type="submit"], -button { +[type="submit"] { -webkit-appearance: button; } + +button:not(:disabled), [type="button"]:not(:disabled), [type="reset"]:not(:disabled), -[type="submit"]:not(:disabled), -button:not(:disabled) { +[type="submit"]:not(:disabled) { cursor: pointer; } + +button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, -[type="submit"]::-moz-focus-inner, -button::-moz-focus-inner { +[type="submit"]::-moz-focus-inner { padding: 0; border-style: none; } -input[type="checkbox"], -input[type="radio"] { + +input[type="radio"], +input[type="checkbox"] { box-sizing: border-box; padding: 0; } + textarea { overflow: auto; resize: vertical; } + fieldset { min-width: 0; padding: 0; margin: 0; border: 0; } + legend { display: block; width: 100%; @@ -277,151 +329,183 @@ legend { color: inherit; white-space: normal; } + progress { vertical-align: baseline; } + [type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button { height: auto; } + [type="search"] { outline-offset: -2px; -webkit-appearance: none; } + [type="search"]::-webkit-search-decoration { -webkit-appearance: none; } + ::-webkit-file-upload-button { font: inherit; -webkit-appearance: button; } + output { display: inline-block; } + summary { display: list-item; cursor: pointer; } + template { display: none; } + [hidden] { display: none !important; } -.h1, -.h2, -.h3, -.h4, -.h5, -.h6, + h1, h2, h3, h4, h5, -h6 { +h6, +.h1, +.h2, +.h3, +.h4, +.h5, +.h6 { margin-bottom: 0.5rem; font-weight: 500; line-height: 1.2; } -.h1, -h1 { + +h1, +.h1 { font-size: 3rem; } -.h2, -h2 { + +h2, +.h2 { font-size: 2.5rem; } -.h3, -h3 { + +h3, +.h3 { font-size: 2rem; } -.h4, -h4 { + +h4, +.h4 { font-size: 1.40625rem; } -.h5, -h5 { - font-size: 1.17188rem; + +h5, +.h5 { + font-size: 1.171875rem; } -.h6, -h6 { + +h6, +.h6 { font-size: 0.9375rem; } + .lead { - font-size: 1.17188rem; + font-size: 1.171875rem; font-weight: 300; } + .display-1 { font-size: 6rem; font-weight: 300; line-height: 1.2; } + .display-2 { font-size: 5.5rem; font-weight: 300; line-height: 1.2; } + .display-3 { font-size: 4.5rem; font-weight: 300; line-height: 1.2; } + .display-4 { font-size: 3.5rem; font-weight: 300; line-height: 1.2; } + hr { margin-top: 1rem; margin-bottom: 1rem; border: 0; border-top: 1px solid rgba(0, 0, 0, 0.1); } -.small, -small { - font-size: 80%; + +small, +.small { + font-size: 0.875em; font-weight: 400; } -.mark, -mark { + +mark, +.mark { padding: 0.2em; background-color: #333; } + .list-unstyled { padding-left: 0; list-style: none; } + .list-inline { padding-left: 0; list-style: none; } + .list-inline-item { display: inline-block; } .list-inline-item:not(:last-child) { margin-right: 0.5rem; } + .initialism { font-size: 90%; text-transform: uppercase; } + .blockquote { margin-bottom: 1rem; - font-size: 1.17188rem; + font-size: 1.171875rem; } + .blockquote-footer { display: block; - font-size: 80%; + font-size: 0.875em; color: #888; } .blockquote-footer::before { - content: "\2014\00A0"; + content: "— "; } + .img-fluid { max-width: 100%; height: auto; } + .img-thumbnail { padding: 0.25rem; background-color: #222; @@ -430,17 +514,21 @@ mark { max-width: 100%; height: auto; } + .figure { display: inline-block; } + .figure-img { margin-bottom: 0.5rem; line-height: 1; } + .figure-caption { font-size: 90%; color: #888; } + code { font-size: 87.5%; color: #e83e8c; @@ -449,6 +537,7 @@ code { a > code { color: inherit; } + kbd { padding: 0.2rem 0.4rem; font-size: 87.5%; @@ -461,6 +550,7 @@ kbd kbd { font-size: 100%; font-weight: 700; } + pre { display: block; font-size: 87.5%; @@ -471,75 +561,52 @@ pre code { color: inherit; word-break: normal; } + .pre-scrollable { max-height: 340px; overflow-y: scroll; } -.container { - width: 100%; - padding-right: 15px; - padding-left: 15px; - margin-right: auto; - margin-left: auto; -} -@media (min-width: 576px) { - .container { - max-width: 540px; - } -} -@media (min-width: 768px) { - .container { - max-width: 720px; - } -} -@media (min-width: 992px) { - .container { - max-width: 960px; - } -} -@media (min-width: 1200px) { - .container { - max-width: 1140px; - } -} + +.container, .container-fluid, +.container-xl, .container-lg, .container-md, -.container-sm, -.container-xl { +.container-sm { width: 100%; padding-right: 15px; padding-left: 15px; margin-right: auto; margin-left: auto; } + @media (min-width: 576px) { - .container, - .container-sm { + .container-sm, + .container { max-width: 540px; } } @media (min-width: 768px) { - .container, .container-md, - .container-sm { + .container-sm, + .container { max-width: 720px; } } @media (min-width: 992px) { - .container, - .container-lg, - .container-md, - .container-sm { - max-width: 960px; - } -} -@media (min-width: 1200px) { - .container, .container-lg, .container-md, .container-sm, - .container-xl { + .container { + max-width: 960px; + } +} +@media (min-width: 1200px) { + .container-xl, + .container-lg, + .container-md, + .container-sm, + .container { max-width: 1140px; } } @@ -549,6 +616,7 @@ pre code { margin-right: -15px; margin-left: -15px; } + .no-gutters { margin-right: 0; margin-left: 0; @@ -558,247 +626,293 @@ pre code { padding-right: 0; padding-left: 0; } -.col, -.col-1, -.col-10, -.col-11, -.col-12, -.col-2, -.col-3, -.col-4, -.col-5, -.col-6, -.col-7, -.col-8, -.col-9, -.col-auto, -.col-lg, -.col-lg-1, -.col-lg-10, -.col-lg-11, -.col-lg-12, -.col-lg-2, -.col-lg-3, -.col-lg-4, -.col-lg-5, -.col-lg-6, -.col-lg-7, -.col-lg-8, -.col-lg-9, -.col-lg-auto, -.col-md, -.col-md-1, -.col-md-10, -.col-md-11, -.col-md-12, -.col-md-2, -.col-md-3, -.col-md-4, -.col-md-5, -.col-md-6, -.col-md-7, -.col-md-8, -.col-md-9, -.col-md-auto, -.col-sm, -.col-sm-1, -.col-sm-10, -.col-sm-11, -.col-sm-12, -.col-sm-2, -.col-sm-3, -.col-sm-4, -.col-sm-5, -.col-sm-6, -.col-sm-7, -.col-sm-8, -.col-sm-9, -.col-sm-auto, + .col-xl, -.col-xl-1, -.col-xl-10, -.col-xl-11, +.col-xl-auto, .col-xl-12, -.col-xl-2, -.col-xl-3, -.col-xl-4, -.col-xl-5, -.col-xl-6, -.col-xl-7, -.col-xl-8, +.col-xl-11, +.col-xl-10, .col-xl-9, -.col-xl-auto { +.col-xl-8, +.col-xl-7, +.col-xl-6, +.col-xl-5, +.col-xl-4, +.col-xl-3, +.col-xl-2, +.col-xl-1, +.col-lg, +.col-lg-auto, +.col-lg-12, +.col-lg-11, +.col-lg-10, +.col-lg-9, +.col-lg-8, +.col-lg-7, +.col-lg-6, +.col-lg-5, +.col-lg-4, +.col-lg-3, +.col-lg-2, +.col-lg-1, +.col-md, +.col-md-auto, +.col-md-12, +.col-md-11, +.col-md-10, +.col-md-9, +.col-md-8, +.col-md-7, +.col-md-6, +.col-md-5, +.col-md-4, +.col-md-3, +.col-md-2, +.col-md-1, +.col-sm, +.col-sm-auto, +.col-sm-12, +.col-sm-11, +.col-sm-10, +.col-sm-9, +.col-sm-8, +.col-sm-7, +.col-sm-6, +.col-sm-5, +.col-sm-4, +.col-sm-3, +.col-sm-2, +.col-sm-1, +.col, +.col-auto, +.col-12, +.col-11, +.col-10, +.col-9, +.col-8, +.col-7, +.col-6, +.col-5, +.col-4, +.col-3, +.col-2, +.col-1 { position: relative; width: 100%; padding-right: 15px; padding-left: 15px; } + .col { flex-basis: 0; flex-grow: 1; - min-width: 0; max-width: 100%; } + .row-cols-1 > * { flex: 0 0 100%; max-width: 100%; } + .row-cols-2 > * { flex: 0 0 50%; max-width: 50%; } + .row-cols-3 > * { - flex: 0 0 33.33333%; - max-width: 33.33333%; + flex: 0 0 33.3333333333%; + max-width: 33.3333333333%; } + .row-cols-4 > * { flex: 0 0 25%; max-width: 25%; } + .row-cols-5 > * { flex: 0 0 20%; max-width: 20%; } + .row-cols-6 > * { - flex: 0 0 16.66667%; - max-width: 16.66667%; + flex: 0 0 16.6666666667%; + max-width: 16.6666666667%; } + .col-auto { flex: 0 0 auto; width: auto; max-width: 100%; } + .col-1 { - flex: 0 0 8.33333%; - max-width: 8.33333%; + flex: 0 0 8.33333333%; + max-width: 8.33333333%; } + .col-2 { - flex: 0 0 16.66667%; - max-width: 16.66667%; + flex: 0 0 16.66666667%; + max-width: 16.66666667%; } + .col-3 { flex: 0 0 25%; max-width: 25%; } + .col-4 { - flex: 0 0 33.33333%; - max-width: 33.33333%; + flex: 0 0 33.33333333%; + max-width: 33.33333333%; } + .col-5 { - flex: 0 0 41.66667%; - max-width: 41.66667%; + flex: 0 0 41.66666667%; + max-width: 41.66666667%; } + .col-6 { flex: 0 0 50%; max-width: 50%; } + .col-7 { - flex: 0 0 58.33333%; - max-width: 58.33333%; + flex: 0 0 58.33333333%; + max-width: 58.33333333%; } + .col-8 { - flex: 0 0 66.66667%; - max-width: 66.66667%; + flex: 0 0 66.66666667%; + max-width: 66.66666667%; } + .col-9 { flex: 0 0 75%; max-width: 75%; } + .col-10 { - flex: 0 0 83.33333%; - max-width: 83.33333%; + flex: 0 0 83.33333333%; + max-width: 83.33333333%; } + .col-11 { - flex: 0 0 91.66667%; - max-width: 91.66667%; + flex: 0 0 91.66666667%; + max-width: 91.66666667%; } + .col-12 { flex: 0 0 100%; max-width: 100%; } + .order-first { order: -1; } + .order-last { order: 13; } + .order-0 { order: 0; } + .order-1 { order: 1; } + .order-2 { order: 2; } + .order-3 { order: 3; } + .order-4 { order: 4; } + .order-5 { order: 5; } + .order-6 { order: 6; } + .order-7 { order: 7; } + .order-8 { order: 8; } + .order-9 { order: 9; } + .order-10 { order: 10; } + .order-11 { order: 11; } + .order-12 { order: 12; } + .offset-1 { - margin-left: 8.33333%; + margin-left: 8.33333333%; } + .offset-2 { - margin-left: 16.66667%; + margin-left: 16.66666667%; } + .offset-3 { margin-left: 25%; } + .offset-4 { - margin-left: 33.33333%; + margin-left: 33.33333333%; } + .offset-5 { - margin-left: 41.66667%; + margin-left: 41.66666667%; } + .offset-6 { margin-left: 50%; } + .offset-7 { - margin-left: 58.33333%; + margin-left: 58.33333333%; } + .offset-8 { - margin-left: 66.66667%; + margin-left: 66.66666667%; } + .offset-9 { margin-left: 75%; } + .offset-10 { - margin-left: 83.33333%; + margin-left: 83.33333333%; } + .offset-11 { - margin-left: 91.66667%; + margin-left: 91.66666667%; } + @media (min-width: 576px) { .col-sm { flex-basis: 0; flex-grow: 1; - min-width: 0; max-width: 100%; } .row-cols-sm-1 > * { @@ -810,8 +924,8 @@ pre code { max-width: 50%; } .row-cols-sm-3 > * { - flex: 0 0 33.33333%; - max-width: 33.33333%; + flex: 0 0 33.3333333333%; + max-width: 33.3333333333%; } .row-cols-sm-4 > * { flex: 0 0 25%; @@ -822,8 +936,8 @@ pre code { max-width: 20%; } .row-cols-sm-6 > * { - flex: 0 0 16.66667%; - max-width: 16.66667%; + flex: 0 0 16.6666666667%; + max-width: 16.6666666667%; } .col-sm-auto { flex: 0 0 auto; @@ -831,48 +945,48 @@ pre code { max-width: 100%; } .col-sm-1 { - flex: 0 0 8.33333%; - max-width: 8.33333%; + flex: 0 0 8.33333333%; + max-width: 8.33333333%; } .col-sm-2 { - flex: 0 0 16.66667%; - max-width: 16.66667%; + flex: 0 0 16.66666667%; + max-width: 16.66666667%; } .col-sm-3 { flex: 0 0 25%; max-width: 25%; } .col-sm-4 { - flex: 0 0 33.33333%; - max-width: 33.33333%; + flex: 0 0 33.33333333%; + max-width: 33.33333333%; } .col-sm-5 { - flex: 0 0 41.66667%; - max-width: 41.66667%; + flex: 0 0 41.66666667%; + max-width: 41.66666667%; } .col-sm-6 { flex: 0 0 50%; max-width: 50%; } .col-sm-7 { - flex: 0 0 58.33333%; - max-width: 58.33333%; + flex: 0 0 58.33333333%; + max-width: 58.33333333%; } .col-sm-8 { - flex: 0 0 66.66667%; - max-width: 66.66667%; + flex: 0 0 66.66666667%; + max-width: 66.66666667%; } .col-sm-9 { flex: 0 0 75%; max-width: 75%; } .col-sm-10 { - flex: 0 0 83.33333%; - max-width: 83.33333%; + flex: 0 0 83.33333333%; + max-width: 83.33333333%; } .col-sm-11 { - flex: 0 0 91.66667%; - max-width: 91.66667%; + flex: 0 0 91.66666667%; + max-width: 91.66666667%; } .col-sm-12 { flex: 0 0 100%; @@ -927,44 +1041,43 @@ pre code { margin-left: 0; } .offset-sm-1 { - margin-left: 8.33333%; + margin-left: 8.33333333%; } .offset-sm-2 { - margin-left: 16.66667%; + margin-left: 16.66666667%; } .offset-sm-3 { margin-left: 25%; } .offset-sm-4 { - margin-left: 33.33333%; + margin-left: 33.33333333%; } .offset-sm-5 { - margin-left: 41.66667%; + margin-left: 41.66666667%; } .offset-sm-6 { margin-left: 50%; } .offset-sm-7 { - margin-left: 58.33333%; + margin-left: 58.33333333%; } .offset-sm-8 { - margin-left: 66.66667%; + margin-left: 66.66666667%; } .offset-sm-9 { margin-left: 75%; } .offset-sm-10 { - margin-left: 83.33333%; + margin-left: 83.33333333%; } .offset-sm-11 { - margin-left: 91.66667%; + margin-left: 91.66666667%; } } @media (min-width: 768px) { .col-md { flex-basis: 0; flex-grow: 1; - min-width: 0; max-width: 100%; } .row-cols-md-1 > * { @@ -976,8 +1089,8 @@ pre code { max-width: 50%; } .row-cols-md-3 > * { - flex: 0 0 33.33333%; - max-width: 33.33333%; + flex: 0 0 33.3333333333%; + max-width: 33.3333333333%; } .row-cols-md-4 > * { flex: 0 0 25%; @@ -988,8 +1101,8 @@ pre code { max-width: 20%; } .row-cols-md-6 > * { - flex: 0 0 16.66667%; - max-width: 16.66667%; + flex: 0 0 16.6666666667%; + max-width: 16.6666666667%; } .col-md-auto { flex: 0 0 auto; @@ -997,48 +1110,48 @@ pre code { max-width: 100%; } .col-md-1 { - flex: 0 0 8.33333%; - max-width: 8.33333%; + flex: 0 0 8.33333333%; + max-width: 8.33333333%; } .col-md-2 { - flex: 0 0 16.66667%; - max-width: 16.66667%; + flex: 0 0 16.66666667%; + max-width: 16.66666667%; } .col-md-3 { flex: 0 0 25%; max-width: 25%; } .col-md-4 { - flex: 0 0 33.33333%; - max-width: 33.33333%; + flex: 0 0 33.33333333%; + max-width: 33.33333333%; } .col-md-5 { - flex: 0 0 41.66667%; - max-width: 41.66667%; + flex: 0 0 41.66666667%; + max-width: 41.66666667%; } .col-md-6 { flex: 0 0 50%; max-width: 50%; } .col-md-7 { - flex: 0 0 58.33333%; - max-width: 58.33333%; + flex: 0 0 58.33333333%; + max-width: 58.33333333%; } .col-md-8 { - flex: 0 0 66.66667%; - max-width: 66.66667%; + flex: 0 0 66.66666667%; + max-width: 66.66666667%; } .col-md-9 { flex: 0 0 75%; max-width: 75%; } .col-md-10 { - flex: 0 0 83.33333%; - max-width: 83.33333%; + flex: 0 0 83.33333333%; + max-width: 83.33333333%; } .col-md-11 { - flex: 0 0 91.66667%; - max-width: 91.66667%; + flex: 0 0 91.66666667%; + max-width: 91.66666667%; } .col-md-12 { flex: 0 0 100%; @@ -1093,44 +1206,43 @@ pre code { margin-left: 0; } .offset-md-1 { - margin-left: 8.33333%; + margin-left: 8.33333333%; } .offset-md-2 { - margin-left: 16.66667%; + margin-left: 16.66666667%; } .offset-md-3 { margin-left: 25%; } .offset-md-4 { - margin-left: 33.33333%; + margin-left: 33.33333333%; } .offset-md-5 { - margin-left: 41.66667%; + margin-left: 41.66666667%; } .offset-md-6 { margin-left: 50%; } .offset-md-7 { - margin-left: 58.33333%; + margin-left: 58.33333333%; } .offset-md-8 { - margin-left: 66.66667%; + margin-left: 66.66666667%; } .offset-md-9 { margin-left: 75%; } .offset-md-10 { - margin-left: 83.33333%; + margin-left: 83.33333333%; } .offset-md-11 { - margin-left: 91.66667%; + margin-left: 91.66666667%; } } @media (min-width: 992px) { .col-lg { flex-basis: 0; flex-grow: 1; - min-width: 0; max-width: 100%; } .row-cols-lg-1 > * { @@ -1142,8 +1254,8 @@ pre code { max-width: 50%; } .row-cols-lg-3 > * { - flex: 0 0 33.33333%; - max-width: 33.33333%; + flex: 0 0 33.3333333333%; + max-width: 33.3333333333%; } .row-cols-lg-4 > * { flex: 0 0 25%; @@ -1154,8 +1266,8 @@ pre code { max-width: 20%; } .row-cols-lg-6 > * { - flex: 0 0 16.66667%; - max-width: 16.66667%; + flex: 0 0 16.6666666667%; + max-width: 16.6666666667%; } .col-lg-auto { flex: 0 0 auto; @@ -1163,48 +1275,48 @@ pre code { max-width: 100%; } .col-lg-1 { - flex: 0 0 8.33333%; - max-width: 8.33333%; + flex: 0 0 8.33333333%; + max-width: 8.33333333%; } .col-lg-2 { - flex: 0 0 16.66667%; - max-width: 16.66667%; + flex: 0 0 16.66666667%; + max-width: 16.66666667%; } .col-lg-3 { flex: 0 0 25%; max-width: 25%; } .col-lg-4 { - flex: 0 0 33.33333%; - max-width: 33.33333%; + flex: 0 0 33.33333333%; + max-width: 33.33333333%; } .col-lg-5 { - flex: 0 0 41.66667%; - max-width: 41.66667%; + flex: 0 0 41.66666667%; + max-width: 41.66666667%; } .col-lg-6 { flex: 0 0 50%; max-width: 50%; } .col-lg-7 { - flex: 0 0 58.33333%; - max-width: 58.33333%; + flex: 0 0 58.33333333%; + max-width: 58.33333333%; } .col-lg-8 { - flex: 0 0 66.66667%; - max-width: 66.66667%; + flex: 0 0 66.66666667%; + max-width: 66.66666667%; } .col-lg-9 { flex: 0 0 75%; max-width: 75%; } .col-lg-10 { - flex: 0 0 83.33333%; - max-width: 83.33333%; + flex: 0 0 83.33333333%; + max-width: 83.33333333%; } .col-lg-11 { - flex: 0 0 91.66667%; - max-width: 91.66667%; + flex: 0 0 91.66666667%; + max-width: 91.66666667%; } .col-lg-12 { flex: 0 0 100%; @@ -1259,44 +1371,43 @@ pre code { margin-left: 0; } .offset-lg-1 { - margin-left: 8.33333%; + margin-left: 8.33333333%; } .offset-lg-2 { - margin-left: 16.66667%; + margin-left: 16.66666667%; } .offset-lg-3 { margin-left: 25%; } .offset-lg-4 { - margin-left: 33.33333%; + margin-left: 33.33333333%; } .offset-lg-5 { - margin-left: 41.66667%; + margin-left: 41.66666667%; } .offset-lg-6 { margin-left: 50%; } .offset-lg-7 { - margin-left: 58.33333%; + margin-left: 58.33333333%; } .offset-lg-8 { - margin-left: 66.66667%; + margin-left: 66.66666667%; } .offset-lg-9 { margin-left: 75%; } .offset-lg-10 { - margin-left: 83.33333%; + margin-left: 83.33333333%; } .offset-lg-11 { - margin-left: 91.66667%; + margin-left: 91.66666667%; } } @media (min-width: 1200px) { .col-xl { flex-basis: 0; flex-grow: 1; - min-width: 0; max-width: 100%; } .row-cols-xl-1 > * { @@ -1308,8 +1419,8 @@ pre code { max-width: 50%; } .row-cols-xl-3 > * { - flex: 0 0 33.33333%; - max-width: 33.33333%; + flex: 0 0 33.3333333333%; + max-width: 33.3333333333%; } .row-cols-xl-4 > * { flex: 0 0 25%; @@ -1320,8 +1431,8 @@ pre code { max-width: 20%; } .row-cols-xl-6 > * { - flex: 0 0 16.66667%; - max-width: 16.66667%; + flex: 0 0 16.6666666667%; + max-width: 16.6666666667%; } .col-xl-auto { flex: 0 0 auto; @@ -1329,48 +1440,48 @@ pre code { max-width: 100%; } .col-xl-1 { - flex: 0 0 8.33333%; - max-width: 8.33333%; + flex: 0 0 8.33333333%; + max-width: 8.33333333%; } .col-xl-2 { - flex: 0 0 16.66667%; - max-width: 16.66667%; + flex: 0 0 16.66666667%; + max-width: 16.66666667%; } .col-xl-3 { flex: 0 0 25%; max-width: 25%; } .col-xl-4 { - flex: 0 0 33.33333%; - max-width: 33.33333%; + flex: 0 0 33.33333333%; + max-width: 33.33333333%; } .col-xl-5 { - flex: 0 0 41.66667%; - max-width: 41.66667%; + flex: 0 0 41.66666667%; + max-width: 41.66666667%; } .col-xl-6 { flex: 0 0 50%; max-width: 50%; } .col-xl-7 { - flex: 0 0 58.33333%; - max-width: 58.33333%; + flex: 0 0 58.33333333%; + max-width: 58.33333333%; } .col-xl-8 { - flex: 0 0 66.66667%; - max-width: 66.66667%; + flex: 0 0 66.66666667%; + max-width: 66.66666667%; } .col-xl-9 { flex: 0 0 75%; max-width: 75%; } .col-xl-10 { - flex: 0 0 83.33333%; - max-width: 83.33333%; + flex: 0 0 83.33333333%; + max-width: 83.33333333%; } .col-xl-11 { - flex: 0 0 91.66667%; - max-width: 91.66667%; + flex: 0 0 91.66666667%; + max-width: 91.66666667%; } .col-xl-12 { flex: 0 0 100%; @@ -1425,37 +1536,37 @@ pre code { margin-left: 0; } .offset-xl-1 { - margin-left: 8.33333%; + margin-left: 8.33333333%; } .offset-xl-2 { - margin-left: 16.66667%; + margin-left: 16.66666667%; } .offset-xl-3 { margin-left: 25%; } .offset-xl-4 { - margin-left: 33.33333%; + margin-left: 33.33333333%; } .offset-xl-5 { - margin-left: 41.66667%; + margin-left: 41.66666667%; } .offset-xl-6 { margin-left: 50%; } .offset-xl-7 { - margin-left: 58.33333%; + margin-left: 58.33333333%; } .offset-xl-8 { - margin-left: 66.66667%; + margin-left: 66.66666667%; } .offset-xl-9 { margin-left: 75%; } .offset-xl-10 { - margin-left: 83.33333%; + margin-left: 83.33333333%; } .offset-xl-11 { - margin-left: 91.66667%; + margin-left: 91.66666667%; } } .table { @@ -1463,8 +1574,8 @@ pre code { margin-bottom: 1rem; color: #dee2e6; } -.table td, -.table th { +.table th, +.table td { padding: 0.75rem; vertical-align: top; border-top: 1px solid #444; @@ -1476,45 +1587,52 @@ pre code { .table tbody + tbody { border-top: 2px solid #444; } -.table-sm td, -.table-sm th { + +.table-sm th, +.table-sm td { padding: 0.3rem; } + .table-bordered { border: 1px solid #444; } -.table-bordered td, -.table-bordered th { +.table-bordered th, +.table-bordered td { border: 1px solid #444; } -.table-bordered thead td, -.table-bordered thead th { +.table-bordered thead th, +.table-bordered thead td { border-bottom-width: 2px; } -.table-borderless tbody + tbody, -.table-borderless td, + .table-borderless th, -.table-borderless thead th { +.table-borderless td, +.table-borderless thead th, +.table-borderless tbody + tbody { border: 0; } + .table-striped tbody tr:nth-of-type(odd) { background-color: #303030; } + .table-hover tbody tr:hover { color: #dee2e6; background-color: rgba(0, 0, 0, 0.075); } + .table-primary, -.table-primary > td, -.table-primary > th { +.table-primary > th, +.table-primary > td { background-color: #c7d1db; } -.table-primary tbody + tbody, -.table-primary td, .table-primary th, -.table-primary thead th { +.table-primary td, +.table-primary thead th, +.table-primary tbody + tbody { border-color: #97a9bc; } + .table-hover .table-primary:hover { background-color: #b7c4d1; } @@ -1522,17 +1640,19 @@ pre code { .table-hover .table-primary:hover > th { background-color: #b7c4d1; } + .table-secondary, -.table-secondary > td, -.table-secondary > th { +.table-secondary > th, +.table-secondary > td { background-color: #cbcbcb; } -.table-secondary tbody + tbody, -.table-secondary td, .table-secondary th, -.table-secondary thead th { +.table-secondary td, +.table-secondary thead th, +.table-secondary tbody + tbody { border-color: #9e9e9e; } + .table-hover .table-secondary:hover { background-color: #bebebe; } @@ -1540,17 +1660,19 @@ pre code { .table-hover .table-secondary:hover > th { background-color: #bebebe; } + .table-success, -.table-success > td, -.table-success > th { +.table-success > th, +.table-success > td { background-color: #b8ecdf; } -.table-success tbody + tbody, -.table-success td, .table-success th, -.table-success thead th { +.table-success td, +.table-success thead th, +.table-success tbody + tbody { border-color: #7adcc3; } + .table-hover .table-success:hover { background-color: #a4e7d6; } @@ -1558,17 +1680,19 @@ pre code { .table-hover .table-success:hover > th { background-color: #a4e7d6; } + .table-info, -.table-info > td, -.table-info > th { +.table-info > th, +.table-info > td { background-color: #c6e2f5; } -.table-info tbody + tbody, -.table-info td, .table-info th, -.table-info thead th { +.table-info td, +.table-info thead th, +.table-info tbody + tbody { border-color: #95c9ec; } + .table-hover .table-info:hover { background-color: #b0d7f1; } @@ -1576,17 +1700,19 @@ pre code { .table-hover .table-info:hover > th { background-color: #b0d7f1; } + .table-warning, -.table-warning > td, -.table-warning > th { +.table-warning > th, +.table-warning > td { background-color: #fce3bd; } -.table-warning tbody + tbody, -.table-warning td, .table-warning th, -.table-warning thead th { +.table-warning td, +.table-warning thead th, +.table-warning tbody + tbody { border-color: #f9cc84; } + .table-hover .table-warning:hover { background-color: #fbd9a5; } @@ -1594,17 +1720,19 @@ pre code { .table-hover .table-warning:hover > th { background-color: #fbd9a5; } + .table-danger, -.table-danger > td, -.table-danger > th { +.table-danger > th, +.table-danger > td { background-color: #f8cdc8; } -.table-danger tbody + tbody, -.table-danger td, .table-danger th, -.table-danger thead th { +.table-danger td, +.table-danger thead th, +.table-danger tbody + tbody { border-color: #f3a29a; } + .table-hover .table-danger:hover { background-color: #f5b8b1; } @@ -1612,17 +1740,19 @@ pre code { .table-hover .table-danger:hover > th { background-color: #f5b8b1; } + .table-light, -.table-light > td, -.table-light > th { +.table-light > th, +.table-light > td { background-color: #c5c5c5; } -.table-light tbody + tbody, -.table-light td, .table-light th, -.table-light thead th { +.table-light td, +.table-light thead th, +.table-light tbody + tbody { border-color: #939393; } + .table-hover .table-light:hover { background-color: #b8b8b8; } @@ -1630,17 +1760,19 @@ pre code { .table-hover .table-light:hover > th { background-color: #b8b8b8; } + .table-dark, -.table-dark > td, -.table-dark > th { +.table-dark > th, +.table-dark > td { background-color: #f6f7f8; } -.table-dark tbody + tbody, -.table-dark td, .table-dark th, -.table-dark thead th { +.table-dark td, +.table-dark thead th, +.table-dark tbody + tbody { border-color: #eef0f2; } + .table-hover .table-dark:hover { background-color: #e8eaed; } @@ -1648,11 +1780,13 @@ pre code { .table-hover .table-dark:hover > th { background-color: #e8eaed; } + .table-active, -.table-active > td, -.table-active > th { +.table-active > th, +.table-active > td { background-color: rgba(0, 0, 0, 0.075); } + .table-hover .table-active:hover { background-color: rgba(0, 0, 0, 0.075); } @@ -1660,6 +1794,7 @@ pre code { .table-hover .table-active:hover > th { background-color: rgba(0, 0, 0, 0.075); } + .table .thead-dark th { color: #fff; background-color: #303030; @@ -1670,12 +1805,13 @@ pre code { background-color: #ebebeb; border-color: #444; } + .table-dark { color: #fff; background-color: #303030; } -.table-dark td, .table-dark th, +.table-dark td, .table-dark thead th { border-color: #434343; } @@ -1689,6 +1825,7 @@ pre code { color: #fff; background-color: rgba(255, 255, 255, 0.075); } + @media (max-width: 575.98px) { .table-responsive-sm { display: block; @@ -1742,6 +1879,7 @@ pre code { .table-responsive > .table-bordered { border: 0; } + .form-control { display: block; width: 100%; @@ -1766,14 +1904,10 @@ pre code { background-color: transparent; border: 0; } -.form-control:-moz-focusring { - color: transparent; - text-shadow: 0 0 0 #fff; -} .form-control:focus { color: #fff; background-color: #444; - border-color: #c27373; + border-color: #739ac2; outline: 0; box-shadow: 0 0 0 0.2rem rgba(55, 90, 127, 0.25); } @@ -1786,21 +1920,29 @@ pre code { background-color: #2b2b2b; opacity: 1; } + input[type="date"].form-control, +input[type="time"].form-control, input[type="datetime-local"].form-control, -input[type="month"].form-control, -input[type="time"].form-control { +input[type="month"].form-control { appearance: none; } + +select.form-control:-moz-focusring { + color: transparent; + text-shadow: 0 0 0 #fff; +} select.form-control:focus::-ms-value { color: #fff; background-color: #444; } + .form-control-file, .form-control-range { display: block; width: 100%; } + .col-form-label { padding-top: calc(0.375rem + 1px); padding-bottom: calc(0.375rem + 1px); @@ -1808,18 +1950,21 @@ select.form-control:focus::-ms-value { font-size: inherit; line-height: 1.5; } + .col-form-label-lg { padding-top: calc(0.5rem + 1px); padding-bottom: calc(0.5rem + 1px); - font-size: 1.17188rem; + font-size: 1.171875rem; line-height: 1.5; } + .col-form-label-sm { padding-top: calc(0.25rem + 1px); padding-bottom: calc(0.25rem + 1px); - font-size: 0.82031rem; + font-size: 0.8203125rem; line-height: 1.5; } + .form-control-plaintext { display: block; width: 100%; @@ -1832,39 +1977,46 @@ select.form-control:focus::-ms-value { border: solid transparent; border-width: 1px 0; } -.form-control-plaintext.form-control-lg, -.form-control-plaintext.form-control-sm { +.form-control-plaintext.form-control-sm, +.form-control-plaintext.form-control-lg { padding-right: 0; padding-left: 0; } + .form-control-sm { height: calc(1.5em + 0.5rem + 2px); padding: 0.25rem 0.5rem; - font-size: 0.82031rem; + font-size: 0.8203125rem; line-height: 1.5; border-radius: 0.2rem; } + .form-control-lg { height: calc(1.5em + 1rem + 2px); padding: 0.5rem 1rem; - font-size: 1.17188rem; + font-size: 1.171875rem; line-height: 1.5; border-radius: 0.3rem; } -select.form-control[multiple], -select.form-control[size] { + +select.form-control[size], +select.form-control[multiple] { height: auto; } + textarea.form-control { height: auto; } + .form-group { margin-bottom: 1rem; } + .form-text { display: block; margin-top: 0.25rem; } + .form-row { display: flex; flex-wrap: wrap; @@ -1876,23 +2028,27 @@ textarea.form-control { padding-right: 5px; padding-left: 5px; } + .form-check { position: relative; display: block; padding-left: 1.25rem; } + .form-check-input { position: absolute; margin-top: 0.3rem; margin-left: -1.25rem; } -.form-check-input:disabled ~ .form-check-label, -.form-check-input[disabled] ~ .form-check-label { +.form-check-input[disabled] ~ .form-check-label, +.form-check-input:disabled ~ .form-check-label { color: #888; } + .form-check-label { margin-bottom: 0; } + .form-check-inline { display: inline-flex; align-items: center; @@ -1905,224 +2061,267 @@ textarea.form-control { margin-right: 0.3125rem; margin-left: 0; } + .valid-feedback { display: none; width: 100%; margin-top: 0.25rem; - font-size: 80%; + font-size: 0.875em; color: #00bc8c; } + .valid-tooltip { position: absolute; top: 100%; + left: 0; z-index: 5; display: none; max-width: 100%; padding: 0.25rem 0.5rem; margin-top: 0.1rem; - font-size: 0.82031rem; + font-size: 0.8203125rem; line-height: 1.5; color: #fff; background-color: rgba(0, 188, 140, 0.9); border-radius: 0.25rem; } -.is-valid ~ .valid-feedback, -.is-valid ~ .valid-tooltip, +.form-row > .col > .valid-tooltip, +.form-row > [class*="col-"] > .valid-tooltip { + left: 5px; +} + .was-validated :valid ~ .valid-feedback, -.was-validated :valid ~ .valid-tooltip { +.was-validated :valid ~ .valid-tooltip, +.is-valid ~ .valid-feedback, +.is-valid ~ .valid-tooltip { display: block; } -.form-control.is-valid, -.was-validated .form-control:valid { + +.was-validated .form-control:valid, +.form-control.is-valid { border-color: #00bc8c; - padding-right: calc(1.5em + 0.75rem); + padding-right: calc(1.5em + 0.75rem) !important; background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath fill='%2300bc8c' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e"); background-repeat: no-repeat; background-position: right calc(0.375em + 0.1875rem) center; background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem); } -.form-control.is-valid:focus, -.was-validated .form-control:valid:focus { +.was-validated .form-control:valid:focus, +.form-control.is-valid:focus { border-color: #00bc8c; box-shadow: 0 0 0 0.2rem rgba(0, 188, 140, 0.25); } + +.was-validated select.form-control:valid, +select.form-control.is-valid { + padding-right: 3rem !important; + background-position: right 1.5rem center; +} + .was-validated textarea.form-control:valid, textarea.form-control.is-valid { padding-right: calc(1.5em + 0.75rem); background-position: top calc(0.375em + 0.1875rem) right calc(0.375em + 0.1875rem); } -.custom-select.is-valid, -.was-validated .custom-select:valid { + +.was-validated .custom-select:valid, +.custom-select.is-valid { border-color: #00bc8c; - padding-right: calc(0.75em + 2.3125rem); + padding-right: calc(0.75em + 2.3125rem) !important; background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='4' height='5' viewBox='0 0 4 5'%3e%3cpath fill='%23303030' d='M2 0L0 2h4zm0 5L0 3h4z'/%3e%3c/svg%3e") - no-repeat right 0.75rem center/8px 10px, - url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath fill='%2300bc8c' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e") - #444 no-repeat center right 1.75rem / calc(0.75em + 0.375rem) - calc(0.75em + 0.375rem); + right 0.75rem center/8px 10px no-repeat, + #444 + url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath fill='%2300bc8c' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e") + center right 1.75rem / calc(0.75em + 0.375rem) calc(0.75em + 0.375rem) + no-repeat; } -.custom-select.is-valid:focus, -.was-validated .custom-select:valid:focus { +.was-validated .custom-select:valid:focus, +.custom-select.is-valid:focus { border-color: #00bc8c; box-shadow: 0 0 0 0.2rem rgba(0, 188, 140, 0.25); } -.form-check-input.is-valid ~ .form-check-label, -.was-validated .form-check-input:valid ~ .form-check-label { + +.was-validated .form-check-input:valid ~ .form-check-label, +.form-check-input.is-valid ~ .form-check-label { color: #00bc8c; } -.form-check-input.is-valid ~ .valid-feedback, -.form-check-input.is-valid ~ .valid-tooltip, .was-validated .form-check-input:valid ~ .valid-feedback, -.was-validated .form-check-input:valid ~ .valid-tooltip { +.was-validated .form-check-input:valid ~ .valid-tooltip, +.form-check-input.is-valid ~ .valid-feedback, +.form-check-input.is-valid ~ .valid-tooltip { display: block; } -.custom-control-input.is-valid ~ .custom-control-label, -.was-validated .custom-control-input:valid ~ .custom-control-label { + +.was-validated .custom-control-input:valid ~ .custom-control-label, +.custom-control-input.is-valid ~ .custom-control-label { color: #00bc8c; } -.custom-control-input.is-valid ~ .custom-control-label::before, -.was-validated .custom-control-input:valid ~ .custom-control-label::before { +.was-validated .custom-control-input:valid ~ .custom-control-label::before, +.custom-control-input.is-valid ~ .custom-control-label::before { border-color: #00bc8c; } -.custom-control-input.is-valid:checked ~ .custom-control-label::before, .was-validated .custom-control-input:valid:checked - ~ .custom-control-label::before { + ~ .custom-control-label::before, +.custom-control-input.is-valid:checked ~ .custom-control-label::before { border-color: #00efb2; background-color: #00efb2; } -.custom-control-input.is-valid:focus ~ .custom-control-label::before, .was-validated .custom-control-input:valid:focus - ~ .custom-control-label::before { + ~ .custom-control-label::before, +.custom-control-input.is-valid:focus ~ .custom-control-label::before { box-shadow: 0 0 0 0.2rem rgba(0, 188, 140, 0.25); } -.custom-control-input.is-valid:focus:not(:checked) - ~ .custom-control-label::before, .was-validated .custom-control-input:valid:focus:not(:checked) + ~ .custom-control-label::before, +.custom-control-input.is-valid:focus:not(:checked) ~ .custom-control-label::before { border-color: #00bc8c; } -.custom-file-input.is-valid ~ .custom-file-label, -.was-validated .custom-file-input:valid ~ .custom-file-label { + +.was-validated .custom-file-input:valid ~ .custom-file-label, +.custom-file-input.is-valid ~ .custom-file-label { border-color: #00bc8c; } -.custom-file-input.is-valid:focus ~ .custom-file-label, -.was-validated .custom-file-input:valid:focus ~ .custom-file-label { +.was-validated .custom-file-input:valid:focus ~ .custom-file-label, +.custom-file-input.is-valid:focus ~ .custom-file-label { border-color: #00bc8c; box-shadow: 0 0 0 0.2rem rgba(0, 188, 140, 0.25); } + .invalid-feedback { display: none; width: 100%; margin-top: 0.25rem; - font-size: 80%; + font-size: 0.875em; color: #e74c3c; } + .invalid-tooltip { position: absolute; top: 100%; + left: 0; z-index: 5; display: none; max-width: 100%; padding: 0.25rem 0.5rem; margin-top: 0.1rem; - font-size: 0.82031rem; + font-size: 0.8203125rem; line-height: 1.5; color: #fff; background-color: rgba(231, 76, 60, 0.9); border-radius: 0.25rem; } -.is-invalid ~ .invalid-feedback, -.is-invalid ~ .invalid-tooltip, +.form-row > .col > .invalid-tooltip, +.form-row > [class*="col-"] > .invalid-tooltip { + left: 5px; +} + .was-validated :invalid ~ .invalid-feedback, -.was-validated :invalid ~ .invalid-tooltip { +.was-validated :invalid ~ .invalid-tooltip, +.is-invalid ~ .invalid-feedback, +.is-invalid ~ .invalid-tooltip { display: block; } -.form-control.is-invalid, -.was-validated .form-control:invalid { + +.was-validated .form-control:invalid, +.form-control.is-invalid { border-color: #e74c3c; - padding-right: calc(1.5em + 0.75rem); + padding-right: calc(1.5em + 0.75rem) !important; background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23e74c3c' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23e74c3c' stroke='none'/%3e%3c/svg%3e"); background-repeat: no-repeat; background-position: right calc(0.375em + 0.1875rem) center; background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem); } -.form-control.is-invalid:focus, -.was-validated .form-control:invalid:focus { +.was-validated .form-control:invalid:focus, +.form-control.is-invalid:focus { border-color: #e74c3c; box-shadow: 0 0 0 0.2rem rgba(231, 76, 60, 0.25); } + +.was-validated select.form-control:invalid, +select.form-control.is-invalid { + padding-right: 3rem !important; + background-position: right 1.5rem center; +} + .was-validated textarea.form-control:invalid, textarea.form-control.is-invalid { padding-right: calc(1.5em + 0.75rem); background-position: top calc(0.375em + 0.1875rem) right calc(0.375em + 0.1875rem); } -.custom-select.is-invalid, -.was-validated .custom-select:invalid { + +.was-validated .custom-select:invalid, +.custom-select.is-invalid { border-color: #e74c3c; - padding-right: calc(0.75em + 2.3125rem); + padding-right: calc(0.75em + 2.3125rem) !important; background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='4' height='5' viewBox='0 0 4 5'%3e%3cpath fill='%23303030' d='M2 0L0 2h4zm0 5L0 3h4z'/%3e%3c/svg%3e") - no-repeat right 0.75rem center/8px 10px, - url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23e74c3c' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23e74c3c' stroke='none'/%3e%3c/svg%3e") - #444 no-repeat center right 1.75rem / calc(0.75em + 0.375rem) - calc(0.75em + 0.375rem); + right 0.75rem center/8px 10px no-repeat, + #444 + url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23e74c3c' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23e74c3c' stroke='none'/%3e%3c/svg%3e") + center right 1.75rem / calc(0.75em + 0.375rem) calc(0.75em + 0.375rem) + no-repeat; } -.custom-select.is-invalid:focus, -.was-validated .custom-select:invalid:focus { +.was-validated .custom-select:invalid:focus, +.custom-select.is-invalid:focus { border-color: #e74c3c; box-shadow: 0 0 0 0.2rem rgba(231, 76, 60, 0.25); } -.form-check-input.is-invalid ~ .form-check-label, -.was-validated .form-check-input:invalid ~ .form-check-label { + +.was-validated .form-check-input:invalid ~ .form-check-label, +.form-check-input.is-invalid ~ .form-check-label { color: #e74c3c; } -.form-check-input.is-invalid ~ .invalid-feedback, -.form-check-input.is-invalid ~ .invalid-tooltip, .was-validated .form-check-input:invalid ~ .invalid-feedback, -.was-validated .form-check-input:invalid ~ .invalid-tooltip { +.was-validated .form-check-input:invalid ~ .invalid-tooltip, +.form-check-input.is-invalid ~ .invalid-feedback, +.form-check-input.is-invalid ~ .invalid-tooltip { display: block; } -.custom-control-input.is-invalid ~ .custom-control-label, -.was-validated .custom-control-input:invalid ~ .custom-control-label { + +.was-validated .custom-control-input:invalid ~ .custom-control-label, +.custom-control-input.is-invalid ~ .custom-control-label { color: #e74c3c; } -.custom-control-input.is-invalid ~ .custom-control-label::before, -.was-validated .custom-control-input:invalid ~ .custom-control-label::before { +.was-validated .custom-control-input:invalid ~ .custom-control-label::before, +.custom-control-input.is-invalid ~ .custom-control-label::before { border-color: #e74c3c; } -.custom-control-input.is-invalid:checked ~ .custom-control-label::before, .was-validated .custom-control-input:invalid:checked - ~ .custom-control-label::before { + ~ .custom-control-label::before, +.custom-control-input.is-invalid:checked ~ .custom-control-label::before { border-color: #ed7669; background-color: #ed7669; } -.custom-control-input.is-invalid:focus ~ .custom-control-label::before, .was-validated .custom-control-input:invalid:focus - ~ .custom-control-label::before { + ~ .custom-control-label::before, +.custom-control-input.is-invalid:focus ~ .custom-control-label::before { box-shadow: 0 0 0 0.2rem rgba(231, 76, 60, 0.25); } -.custom-control-input.is-invalid:focus:not(:checked) - ~ .custom-control-label::before, .was-validated .custom-control-input:invalid:focus:not(:checked) + ~ .custom-control-label::before, +.custom-control-input.is-invalid:focus:not(:checked) ~ .custom-control-label::before { border-color: #e74c3c; } -.custom-file-input.is-invalid ~ .custom-file-label, -.was-validated .custom-file-input:invalid ~ .custom-file-label { + +.was-validated .custom-file-input:invalid ~ .custom-file-label, +.custom-file-input.is-invalid ~ .custom-file-label { border-color: #e74c3c; } -.custom-file-input.is-invalid:focus ~ .custom-file-label, -.was-validated .custom-file-input:invalid:focus ~ .custom-file-label { +.was-validated .custom-file-input:invalid:focus ~ .custom-file-label, +.custom-file-input.is-invalid:focus ~ .custom-file-label { border-color: #e74c3c; box-shadow: 0 0 0 0.2rem rgba(231, 76, 60, 0.25); } + .form-inline { display: flex; flex-flow: row wrap; @@ -2153,8 +2352,8 @@ textarea.form-control.is-invalid { .form-inline .form-control-plaintext { display: inline-block; } - .form-inline .custom-select, - .form-inline .input-group { + .form-inline .input-group, + .form-inline .custom-select { width: auto; } .form-inline .form-check { @@ -2179,6 +2378,7 @@ textarea.form-control.is-invalid { margin-bottom: 0; } } + .btn { display: inline-block; font-weight: 400; @@ -2204,8 +2404,8 @@ textarea.form-control.is-invalid { color: #dee2e6; text-decoration: none; } -.btn.focus, -.btn:focus { +.btn:focus, +.btn.focus { outline: 0; box-shadow: 0 0 0 0.2rem rgba(55, 90, 127, 0.25); } @@ -2220,6 +2420,7 @@ a.btn.disabled, fieldset:disabled a.btn { pointer-events: none; } + .btn-primary { color: #fff; background-color: #375a7f; @@ -2230,8 +2431,8 @@ fieldset:disabled a.btn { background-color: #2b4764; border-color: #28415b; } -.btn-primary.focus, -.btn-primary:focus { +.btn-primary:focus, +.btn-primary.focus { color: #fff; background-color: #2b4764; border-color: #28415b; @@ -2243,18 +2444,19 @@ fieldset:disabled a.btn { background-color: #375a7f; border-color: #375a7f; } -.btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active, +.btn-primary:not(:disabled):not(.disabled).active, .show > .btn-primary.dropdown-toggle { color: #fff; background-color: #28415b; border-color: #243a53; } -.btn-primary:not(:disabled):not(.disabled).active:focus, .btn-primary:not(:disabled):not(.disabled):active:focus, +.btn-primary:not(:disabled):not(.disabled).active:focus, .show > .btn-primary.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem rgba(85, 115, 146, 0.5); } + .btn-secondary { color: #fff; background-color: #444; @@ -2265,8 +2467,8 @@ fieldset:disabled a.btn { background-color: #313131; border-color: #2b2b2b; } -.btn-secondary.focus, -.btn-secondary:focus { +.btn-secondary:focus, +.btn-secondary.focus { color: #fff; background-color: #313131; border-color: #2b2b2b; @@ -2278,18 +2480,19 @@ fieldset:disabled a.btn { background-color: #444; border-color: #444; } -.btn-secondary:not(:disabled):not(.disabled).active, .btn-secondary:not(:disabled):not(.disabled):active, +.btn-secondary:not(:disabled):not(.disabled).active, .show > .btn-secondary.dropdown-toggle { color: #fff; background-color: #2b2b2b; border-color: #242424; } -.btn-secondary:not(:disabled):not(.disabled).active:focus, .btn-secondary:not(:disabled):not(.disabled):active:focus, +.btn-secondary:not(:disabled):not(.disabled).active:focus, .show > .btn-secondary.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem rgba(96, 96, 96, 0.5); } + .btn-success { color: #fff; background-color: #00bc8c; @@ -2300,8 +2503,8 @@ fieldset:disabled a.btn { background-color: #009670; border-color: #008966; } -.btn-success.focus, -.btn-success:focus { +.btn-success:focus, +.btn-success.focus { color: #fff; background-color: #009670; border-color: #008966; @@ -2313,18 +2516,19 @@ fieldset:disabled a.btn { background-color: #00bc8c; border-color: #00bc8c; } -.btn-success:not(:disabled):not(.disabled).active, .btn-success:not(:disabled):not(.disabled):active, +.btn-success:not(:disabled):not(.disabled).active, .show > .btn-success.dropdown-toggle { color: #fff; background-color: #008966; border-color: #007c5d; } -.btn-success:not(:disabled):not(.disabled).active:focus, .btn-success:not(:disabled):not(.disabled):active:focus, +.btn-success:not(:disabled):not(.disabled).active:focus, .show > .btn-success.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem rgba(38, 198, 157, 0.5); } + .btn-info { color: #fff; background-color: #3498db; @@ -2335,8 +2539,8 @@ fieldset:disabled a.btn { background-color: #2384c6; border-color: #217dbb; } -.btn-info.focus, -.btn-info:focus { +.btn-info:focus, +.btn-info.focus { color: #fff; background-color: #2384c6; border-color: #217dbb; @@ -2348,18 +2552,19 @@ fieldset:disabled a.btn { background-color: #3498db; border-color: #3498db; } -.btn-info:not(:disabled):not(.disabled).active, .btn-info:not(:disabled):not(.disabled):active, +.btn-info:not(:disabled):not(.disabled).active, .show > .btn-info.dropdown-toggle { color: #fff; background-color: #217dbb; border-color: #1f76b0; } -.btn-info:not(:disabled):not(.disabled).active:focus, .btn-info:not(:disabled):not(.disabled):active:focus, +.btn-info:not(:disabled):not(.disabled).active:focus, .show > .btn-info.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem rgba(82, 167, 224, 0.5); } + .btn-warning { color: #fff; background-color: #f39c12; @@ -2370,8 +2575,8 @@ fieldset:disabled a.btn { background-color: #d4860b; border-color: #c87f0a; } -.btn-warning.focus, -.btn-warning:focus { +.btn-warning:focus, +.btn-warning.focus { color: #fff; background-color: #d4860b; border-color: #c87f0a; @@ -2383,18 +2588,19 @@ fieldset:disabled a.btn { background-color: #f39c12; border-color: #f39c12; } -.btn-warning:not(:disabled):not(.disabled).active, .btn-warning:not(:disabled):not(.disabled):active, +.btn-warning:not(:disabled):not(.disabled).active, .show > .btn-warning.dropdown-toggle { color: #fff; background-color: #c87f0a; border-color: #bc770a; } -.btn-warning:not(:disabled):not(.disabled).active:focus, .btn-warning:not(:disabled):not(.disabled):active:focus, +.btn-warning:not(:disabled):not(.disabled).active:focus, .show > .btn-warning.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem rgba(245, 171, 54, 0.5); } + .btn-danger { color: #fff; background-color: #e74c3c; @@ -2405,8 +2611,8 @@ fieldset:disabled a.btn { background-color: #e12e1c; border-color: #d62c1a; } -.btn-danger.focus, -.btn-danger:focus { +.btn-danger:focus, +.btn-danger.focus { color: #fff; background-color: #e12e1c; border-color: #d62c1a; @@ -2418,18 +2624,19 @@ fieldset:disabled a.btn { background-color: #e74c3c; border-color: #e74c3c; } -.btn-danger:not(:disabled):not(.disabled).active, .btn-danger:not(:disabled):not(.disabled):active, +.btn-danger:not(:disabled):not(.disabled).active, .show > .btn-danger.dropdown-toggle { color: #fff; background-color: #d62c1a; border-color: #ca2a19; } -.btn-danger:not(:disabled):not(.disabled).active:focus, .btn-danger:not(:disabled):not(.disabled):active:focus, +.btn-danger:not(:disabled):not(.disabled).active:focus, .show > .btn-danger.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem rgba(235, 103, 89, 0.5); } + .btn-light { color: #fff; background-color: #303030; @@ -2440,8 +2647,8 @@ fieldset:disabled a.btn { background-color: #1d1d1d; border-color: #171717; } -.btn-light.focus, -.btn-light:focus { +.btn-light:focus, +.btn-light.focus { color: #fff; background-color: #1d1d1d; border-color: #171717; @@ -2453,18 +2660,19 @@ fieldset:disabled a.btn { background-color: #303030; border-color: #303030; } -.btn-light:not(:disabled):not(.disabled).active, .btn-light:not(:disabled):not(.disabled):active, +.btn-light:not(:disabled):not(.disabled).active, .show > .btn-light.dropdown-toggle { color: #fff; background-color: #171717; border-color: #101010; } -.btn-light:not(:disabled):not(.disabled).active:focus, .btn-light:not(:disabled):not(.disabled):active:focus, +.btn-light:not(:disabled):not(.disabled).active:focus, .show > .btn-light.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem rgba(79, 79, 79, 0.5); } + .btn-dark { color: #222; background-color: #dee2e6; @@ -2475,8 +2683,8 @@ fieldset:disabled a.btn { background-color: #c8cfd6; border-color: #c1c9d0; } -.btn-dark.focus, -.btn-dark:focus { +.btn-dark:focus, +.btn-dark.focus { color: #222; background-color: #c8cfd6; border-color: #c1c9d0; @@ -2488,18 +2696,19 @@ fieldset:disabled a.btn { background-color: #dee2e6; border-color: #dee2e6; } -.btn-dark:not(:disabled):not(.disabled).active, .btn-dark:not(:disabled):not(.disabled):active, +.btn-dark:not(:disabled):not(.disabled).active, .show > .btn-dark.dropdown-toggle { color: #222; background-color: #c1c9d0; border-color: #bac2cb; } -.btn-dark:not(:disabled):not(.disabled).active:focus, .btn-dark:not(:disabled):not(.disabled):active:focus, +.btn-dark:not(:disabled):not(.disabled).active:focus, .show > .btn-dark.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem rgba(194, 197, 201, 0.5); } + .btn-outline-primary { color: #375a7f; border-color: #375a7f; @@ -2509,8 +2718,8 @@ fieldset:disabled a.btn { background-color: #375a7f; border-color: #375a7f; } -.btn-outline-primary.focus, -.btn-outline-primary:focus { +.btn-outline-primary:focus, +.btn-outline-primary.focus { box-shadow: 0 0 0 0.2rem rgba(55, 90, 127, 0.5); } .btn-outline-primary.disabled, @@ -2518,18 +2727,19 @@ fieldset:disabled a.btn { color: #375a7f; background-color: transparent; } -.btn-outline-primary:not(:disabled):not(.disabled).active, .btn-outline-primary:not(:disabled):not(.disabled):active, +.btn-outline-primary:not(:disabled):not(.disabled).active, .show > .btn-outline-primary.dropdown-toggle { color: #fff; background-color: #375a7f; border-color: #375a7f; } -.btn-outline-primary:not(:disabled):not(.disabled).active:focus, .btn-outline-primary:not(:disabled):not(.disabled):active:focus, +.btn-outline-primary:not(:disabled):not(.disabled).active:focus, .show > .btn-outline-primary.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem rgba(55, 90, 127, 0.5); } + .btn-outline-secondary { color: #444; border-color: #444; @@ -2539,8 +2749,8 @@ fieldset:disabled a.btn { background-color: #444; border-color: #444; } -.btn-outline-secondary.focus, -.btn-outline-secondary:focus { +.btn-outline-secondary:focus, +.btn-outline-secondary.focus { box-shadow: 0 0 0 0.2rem rgba(68, 68, 68, 0.5); } .btn-outline-secondary.disabled, @@ -2548,18 +2758,19 @@ fieldset:disabled a.btn { color: #444; background-color: transparent; } -.btn-outline-secondary:not(:disabled):not(.disabled).active, .btn-outline-secondary:not(:disabled):not(.disabled):active, +.btn-outline-secondary:not(:disabled):not(.disabled).active, .show > .btn-outline-secondary.dropdown-toggle { color: #fff; background-color: #444; border-color: #444; } -.btn-outline-secondary:not(:disabled):not(.disabled).active:focus, .btn-outline-secondary:not(:disabled):not(.disabled):active:focus, +.btn-outline-secondary:not(:disabled):not(.disabled).active:focus, .show > .btn-outline-secondary.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem rgba(68, 68, 68, 0.5); } + .btn-outline-success { color: #00bc8c; border-color: #00bc8c; @@ -2569,8 +2780,8 @@ fieldset:disabled a.btn { background-color: #00bc8c; border-color: #00bc8c; } -.btn-outline-success.focus, -.btn-outline-success:focus { +.btn-outline-success:focus, +.btn-outline-success.focus { box-shadow: 0 0 0 0.2rem rgba(0, 188, 140, 0.5); } .btn-outline-success.disabled, @@ -2578,18 +2789,19 @@ fieldset:disabled a.btn { color: #00bc8c; background-color: transparent; } -.btn-outline-success:not(:disabled):not(.disabled).active, .btn-outline-success:not(:disabled):not(.disabled):active, +.btn-outline-success:not(:disabled):not(.disabled).active, .show > .btn-outline-success.dropdown-toggle { color: #fff; background-color: #00bc8c; border-color: #00bc8c; } -.btn-outline-success:not(:disabled):not(.disabled).active:focus, .btn-outline-success:not(:disabled):not(.disabled):active:focus, +.btn-outline-success:not(:disabled):not(.disabled).active:focus, .show > .btn-outline-success.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem rgba(0, 188, 140, 0.5); } + .btn-outline-info { color: #3498db; border-color: #3498db; @@ -2599,8 +2811,8 @@ fieldset:disabled a.btn { background-color: #3498db; border-color: #3498db; } -.btn-outline-info.focus, -.btn-outline-info:focus { +.btn-outline-info:focus, +.btn-outline-info.focus { box-shadow: 0 0 0 0.2rem rgba(52, 152, 219, 0.5); } .btn-outline-info.disabled, @@ -2608,18 +2820,19 @@ fieldset:disabled a.btn { color: #3498db; background-color: transparent; } -.btn-outline-info:not(:disabled):not(.disabled).active, .btn-outline-info:not(:disabled):not(.disabled):active, +.btn-outline-info:not(:disabled):not(.disabled).active, .show > .btn-outline-info.dropdown-toggle { color: #fff; background-color: #3498db; border-color: #3498db; } -.btn-outline-info:not(:disabled):not(.disabled).active:focus, .btn-outline-info:not(:disabled):not(.disabled):active:focus, +.btn-outline-info:not(:disabled):not(.disabled).active:focus, .show > .btn-outline-info.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem rgba(52, 152, 219, 0.5); } + .btn-outline-warning { color: #f39c12; border-color: #f39c12; @@ -2629,8 +2842,8 @@ fieldset:disabled a.btn { background-color: #f39c12; border-color: #f39c12; } -.btn-outline-warning.focus, -.btn-outline-warning:focus { +.btn-outline-warning:focus, +.btn-outline-warning.focus { box-shadow: 0 0 0 0.2rem rgba(243, 156, 18, 0.5); } .btn-outline-warning.disabled, @@ -2638,18 +2851,19 @@ fieldset:disabled a.btn { color: #f39c12; background-color: transparent; } -.btn-outline-warning:not(:disabled):not(.disabled).active, .btn-outline-warning:not(:disabled):not(.disabled):active, +.btn-outline-warning:not(:disabled):not(.disabled).active, .show > .btn-outline-warning.dropdown-toggle { color: #fff; background-color: #f39c12; border-color: #f39c12; } -.btn-outline-warning:not(:disabled):not(.disabled).active:focus, .btn-outline-warning:not(:disabled):not(.disabled):active:focus, +.btn-outline-warning:not(:disabled):not(.disabled).active:focus, .show > .btn-outline-warning.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem rgba(243, 156, 18, 0.5); } + .btn-outline-danger { color: #e74c3c; border-color: #e74c3c; @@ -2659,8 +2873,8 @@ fieldset:disabled a.btn { background-color: #e74c3c; border-color: #e74c3c; } -.btn-outline-danger.focus, -.btn-outline-danger:focus { +.btn-outline-danger:focus, +.btn-outline-danger.focus { box-shadow: 0 0 0 0.2rem rgba(231, 76, 60, 0.5); } .btn-outline-danger.disabled, @@ -2668,18 +2882,19 @@ fieldset:disabled a.btn { color: #e74c3c; background-color: transparent; } -.btn-outline-danger:not(:disabled):not(.disabled).active, .btn-outline-danger:not(:disabled):not(.disabled):active, +.btn-outline-danger:not(:disabled):not(.disabled).active, .show > .btn-outline-danger.dropdown-toggle { color: #fff; background-color: #e74c3c; border-color: #e74c3c; } -.btn-outline-danger:not(:disabled):not(.disabled).active:focus, .btn-outline-danger:not(:disabled):not(.disabled):active:focus, +.btn-outline-danger:not(:disabled):not(.disabled).active:focus, .show > .btn-outline-danger.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem rgba(231, 76, 60, 0.5); } + .btn-outline-light { color: #303030; border-color: #303030; @@ -2689,8 +2904,8 @@ fieldset:disabled a.btn { background-color: #303030; border-color: #303030; } -.btn-outline-light.focus, -.btn-outline-light:focus { +.btn-outline-light:focus, +.btn-outline-light.focus { box-shadow: 0 0 0 0.2rem rgba(48, 48, 48, 0.5); } .btn-outline-light.disabled, @@ -2698,18 +2913,19 @@ fieldset:disabled a.btn { color: #303030; background-color: transparent; } -.btn-outline-light:not(:disabled):not(.disabled).active, .btn-outline-light:not(:disabled):not(.disabled):active, +.btn-outline-light:not(:disabled):not(.disabled).active, .show > .btn-outline-light.dropdown-toggle { color: #fff; background-color: #303030; border-color: #303030; } -.btn-outline-light:not(:disabled):not(.disabled).active:focus, .btn-outline-light:not(:disabled):not(.disabled):active:focus, +.btn-outline-light:not(:disabled):not(.disabled).active:focus, .show > .btn-outline-light.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem rgba(48, 48, 48, 0.5); } + .btn-outline-dark { color: #dee2e6; border-color: #dee2e6; @@ -2719,8 +2935,8 @@ fieldset:disabled a.btn { background-color: #dee2e6; border-color: #dee2e6; } -.btn-outline-dark.focus, -.btn-outline-dark:focus { +.btn-outline-dark:focus, +.btn-outline-dark.focus { box-shadow: 0 0 0 0.2rem rgba(222, 226, 230, 0.5); } .btn-outline-dark.disabled, @@ -2728,50 +2944,54 @@ fieldset:disabled a.btn { color: #dee2e6; background-color: transparent; } -.btn-outline-dark:not(:disabled):not(.disabled).active, .btn-outline-dark:not(:disabled):not(.disabled):active, +.btn-outline-dark:not(:disabled):not(.disabled).active, .show > .btn-outline-dark.dropdown-toggle { color: #222; background-color: #dee2e6; border-color: #dee2e6; } -.btn-outline-dark:not(:disabled):not(.disabled).active:focus, .btn-outline-dark:not(:disabled):not(.disabled):active:focus, +.btn-outline-dark:not(:disabled):not(.disabled).active:focus, .show > .btn-outline-dark.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem rgba(222, 226, 230, 0.5); } + .btn-link { font-weight: 400; color: #e74c3c; text-decoration: none; } .btn-link:hover { - color: #a62f22; + color: #bf2718; text-decoration: underline; } -.btn-link.focus, -.btn-link:focus { +.btn-link:focus, +.btn-link.focus { text-decoration: underline; } -.btn-link.disabled, -.btn-link:disabled { +.btn-link:disabled, +.btn-link.disabled { color: #888; pointer-events: none; } -.btn-group-lg > .btn, -.btn-lg { + +.btn-lg, +.btn-group-lg > .btn { padding: 0.5rem 1rem; - font-size: 1.17188rem; + font-size: 1.171875rem; line-height: 1.5; border-radius: 0.3rem; } -.btn-group-sm > .btn, -.btn-sm { + +.btn-sm, +.btn-group-sm > .btn { padding: 0.25rem 0.5rem; - font-size: 0.82031rem; + font-size: 0.8203125rem; line-height: 1.5; border-radius: 0.2rem; } + .btn-block { display: block; width: 100%; @@ -2779,11 +2999,13 @@ fieldset:disabled a.btn { .btn-block + .btn-block { margin-top: 0.5rem; } -input[type="button"].btn-block, + +input[type="submit"].btn-block, input[type="reset"].btn-block, -input[type="submit"].btn-block { +input[type="button"].btn-block { width: 100%; } + .fade { transition: opacity 0.15s linear; } @@ -2795,9 +3017,11 @@ input[type="submit"].btn-block { .fade:not(.show) { opacity: 0; } + .collapse:not(.show) { display: none; } + .collapsing { position: relative; height: 0; @@ -2809,12 +3033,24 @@ input[type="submit"].btn-block { transition: none; } } -.dropdown, -.dropleft, +.collapsing.width { + width: 0; + height: auto; + transition: width 0.35s ease; +} +@media (prefers-reduced-motion: reduce) { + .collapsing.width { + transition: none; + } +} + +.dropup, .dropright, -.dropup { +.dropdown, +.dropleft { position: relative; } + .dropdown-toggle { white-space: nowrap; } @@ -2831,6 +3067,7 @@ input[type="submit"].btn-block { .dropdown-toggle:empty::after { margin-left: 0; } + .dropdown-menu { position: absolute; top: 100%; @@ -2850,14 +3087,17 @@ input[type="submit"].btn-block { border: 1px solid #444; border-radius: 0.25rem; } + .dropdown-menu-left { right: auto; left: 0; } + .dropdown-menu-right { right: 0; left: auto; } + @media (min-width: 576px) { .dropdown-menu-sm-left { right: auto; @@ -2917,6 +3157,7 @@ input[type="submit"].btn-block { .dropup .dropdown-toggle:empty::after { margin-left: 0; } + .dropright .dropdown-menu { top: 0; right: auto; @@ -2940,6 +3181,7 @@ input[type="submit"].btn-block { .dropright .dropdown-toggle::after { vertical-align: 0; } + .dropleft .dropdown-menu { top: 0; right: 100%; @@ -2971,19 +3213,22 @@ input[type="submit"].btn-block { .dropleft .dropdown-toggle::before { vertical-align: 0; } -.dropdown-menu[x-placement^="bottom"], -.dropdown-menu[x-placement^="left"], + +.dropdown-menu[x-placement^="top"], .dropdown-menu[x-placement^="right"], -.dropdown-menu[x-placement^="top"] { +.dropdown-menu[x-placement^="bottom"], +.dropdown-menu[x-placement^="left"] { right: auto; bottom: auto; } + .dropdown-divider { height: 0; margin: 0.5rem 0; overflow: hidden; border-top: 1px solid #444; } + .dropdown-item { display: block; width: 100%; @@ -2996,8 +3241,8 @@ input[type="submit"].btn-block { background-color: transparent; border: 0; } -.dropdown-item:focus, -.dropdown-item:hover { +.dropdown-item:hover, +.dropdown-item:focus { color: #fff; text-decoration: none; background-color: #375a7f; @@ -3010,49 +3255,54 @@ input[type="submit"].btn-block { } .dropdown-item.disabled, .dropdown-item:disabled { - color: #888; + color: #adb5bd; pointer-events: none; background-color: transparent; } + .dropdown-menu.show { display: block; } + .dropdown-header { display: block; padding: 0.5rem 1.5rem; margin-bottom: 0; - font-size: 0.82031rem; + font-size: 0.8203125rem; color: #888; white-space: nowrap; } + .dropdown-item-text { display: block; padding: 0.25rem 1.5rem; color: #fff; } + .btn-group, .btn-group-vertical { position: relative; display: inline-flex; vertical-align: middle; } -.btn-group-vertical > .btn, -.btn-group > .btn { +.btn-group > .btn, +.btn-group-vertical > .btn { position: relative; flex: 1 1 auto; } -.btn-group-vertical > .btn:hover, -.btn-group > .btn:hover { +.btn-group > .btn:hover, +.btn-group-vertical > .btn:hover { z-index: 1; } -.btn-group-vertical > .btn.active, -.btn-group-vertical > .btn:active, -.btn-group-vertical > .btn:focus, -.btn-group > .btn.active, +.btn-group > .btn:focus, .btn-group > .btn:active, -.btn-group > .btn:focus { +.btn-group > .btn.active, +.btn-group-vertical > .btn:focus, +.btn-group-vertical > .btn:active, +.btn-group-vertical > .btn.active { z-index: 1; } + .btn-toolbar { display: flex; flex-wrap: wrap; @@ -3061,42 +3311,47 @@ input[type="submit"].btn-block { .btn-toolbar .input-group { width: auto; } -.btn-group > .btn-group:not(:first-child), -.btn-group > .btn:not(:first-child) { + +.btn-group > .btn:not(:first-child), +.btn-group > .btn-group:not(:first-child) { margin-left: -1px; } -.btn-group > .btn-group:not(:last-child) > .btn, -.btn-group > .btn:not(:last-child):not(.dropdown-toggle) { +.btn-group > .btn:not(:last-child):not(.dropdown-toggle), +.btn-group > .btn-group:not(:last-child) > .btn { border-top-right-radius: 0; border-bottom-right-radius: 0; } -.btn-group > .btn-group:not(:first-child) > .btn, -.btn-group > .btn:not(:first-child) { +.btn-group > .btn:not(:first-child), +.btn-group > .btn-group:not(:first-child) > .btn { border-top-left-radius: 0; border-bottom-left-radius: 0; } + .dropdown-toggle-split { padding-right: 0.5625rem; padding-left: 0.5625rem; } .dropdown-toggle-split::after, -.dropright .dropdown-toggle-split::after, -.dropup .dropdown-toggle-split::after { +.dropup .dropdown-toggle-split::after, +.dropright .dropdown-toggle-split::after { margin-left: 0; } .dropleft .dropdown-toggle-split::before { margin-right: 0; } -.btn-group-sm > .btn + .dropdown-toggle-split, -.btn-sm + .dropdown-toggle-split { + +.btn-sm + .dropdown-toggle-split, +.btn-group-sm > .btn + .dropdown-toggle-split { padding-right: 0.375rem; padding-left: 0.375rem; } -.btn-group-lg > .btn + .dropdown-toggle-split, -.btn-lg + .dropdown-toggle-split { + +.btn-lg + .dropdown-toggle-split, +.btn-group-lg > .btn + .dropdown-toggle-split { padding-right: 0.75rem; padding-left: 0.75rem; } + .btn-group-vertical { flex-direction: column; align-items: flex-start; @@ -3106,32 +3361,34 @@ input[type="submit"].btn-block { .btn-group-vertical > .btn-group { width: 100%; } -.btn-group-vertical > .btn-group:not(:first-child), -.btn-group-vertical > .btn:not(:first-child) { +.btn-group-vertical > .btn:not(:first-child), +.btn-group-vertical > .btn-group:not(:first-child) { margin-top: -1px; } -.btn-group-vertical > .btn-group:not(:last-child) > .btn, -.btn-group-vertical > .btn:not(:last-child):not(.dropdown-toggle) { +.btn-group-vertical > .btn:not(:last-child):not(.dropdown-toggle), +.btn-group-vertical > .btn-group:not(:last-child) > .btn { border-bottom-right-radius: 0; border-bottom-left-radius: 0; } -.btn-group-vertical > .btn-group:not(:first-child) > .btn, -.btn-group-vertical > .btn:not(:first-child) { +.btn-group-vertical > .btn:not(:first-child), +.btn-group-vertical > .btn-group:not(:first-child) > .btn { border-top-left-radius: 0; border-top-right-radius: 0; } + .btn-group-toggle > .btn, .btn-group-toggle > .btn-group > .btn { margin-bottom: 0; } -.btn-group-toggle > .btn input[type="checkbox"], .btn-group-toggle > .btn input[type="radio"], -.btn-group-toggle > .btn-group > .btn input[type="checkbox"], -.btn-group-toggle > .btn-group > .btn input[type="radio"] { +.btn-group-toggle > .btn input[type="checkbox"], +.btn-group-toggle > .btn-group > .btn input[type="radio"], +.btn-group-toggle > .btn-group > .btn input[type="checkbox"] { position: absolute; clip: rect(0, 0, 0, 0); pointer-events: none; } + .input-group { position: relative; display: flex; @@ -3139,45 +3396,40 @@ input[type="submit"].btn-block { align-items: stretch; width: 100%; } -.input-group > .custom-file, -.input-group > .custom-select, .input-group > .form-control, -.input-group > .form-control-plaintext { +.input-group > .form-control-plaintext, +.input-group > .custom-select, +.input-group > .custom-file { position: relative; flex: 1 1 auto; width: 1%; min-width: 0; margin-bottom: 0; } -.input-group > .custom-file + .custom-file, -.input-group > .custom-file + .custom-select, -.input-group > .custom-file + .form-control, -.input-group > .custom-select + .custom-file, -.input-group > .custom-select + .custom-select, -.input-group > .custom-select + .form-control, -.input-group > .form-control + .custom-file, -.input-group > .form-control + .custom-select, .input-group > .form-control + .form-control, -.input-group > .form-control-plaintext + .custom-file, +.input-group > .form-control + .custom-select, +.input-group > .form-control + .custom-file, +.input-group > .form-control-plaintext + .form-control, .input-group > .form-control-plaintext + .custom-select, -.input-group > .form-control-plaintext + .form-control { +.input-group > .form-control-plaintext + .custom-file, +.input-group > .custom-select + .form-control, +.input-group > .custom-select + .custom-select, +.input-group > .custom-select + .custom-file, +.input-group > .custom-file + .form-control, +.input-group > .custom-file + .custom-select, +.input-group > .custom-file + .custom-file { margin-left: -1px; } -.input-group > .custom-file .custom-file-input:focus ~ .custom-file-label, +.input-group > .form-control:focus, .input-group > .custom-select:focus, -.input-group > .form-control:focus { +.input-group > .custom-file .custom-file-input:focus ~ .custom-file-label { z-index: 3; } .input-group > .custom-file .custom-file-input:focus { z-index: 4; } -.input-group > .custom-select:not(:last-child), -.input-group > .form-control:not(:last-child) { - border-top-right-radius: 0; - border-bottom-right-radius: 0; -} -.input-group > .custom-select:not(:first-child), -.input-group > .form-control:not(:first-child) { +.input-group > .form-control:not(:first-child), +.input-group > .custom-select:not(:first-child) { border-top-left-radius: 0; border-bottom-left-radius: 0; } @@ -3194,35 +3446,61 @@ input[type="submit"].btn-block { border-top-left-radius: 0; border-bottom-left-radius: 0; } -.input-group-append, -.input-group-prepend { +.input-group:not(.has-validation) > .form-control:not(:last-child), +.input-group:not(.has-validation) > .custom-select:not(:last-child), +.input-group:not(.has-validation) + > .custom-file:not(:last-child) + .custom-file-label, +.input-group:not(.has-validation) + > .custom-file:not(:last-child) + .custom-file-label::after { + border-top-right-radius: 0; + border-bottom-right-radius: 0; +} +.input-group.has-validation > .form-control:nth-last-child(n + 3), +.input-group.has-validation > .custom-select:nth-last-child(n + 3), +.input-group.has-validation + > .custom-file:nth-last-child(n + 3) + .custom-file-label, +.input-group.has-validation + > .custom-file:nth-last-child(n + 3) + .custom-file-label::after { + border-top-right-radius: 0; + border-bottom-right-radius: 0; +} + +.input-group-prepend, +.input-group-append { display: flex; } -.input-group-append .btn, -.input-group-prepend .btn { +.input-group-prepend .btn, +.input-group-append .btn { position: relative; z-index: 2; } -.input-group-append .btn:focus, -.input-group-prepend .btn:focus { +.input-group-prepend .btn:focus, +.input-group-append .btn:focus { z-index: 3; } -.input-group-append .btn + .btn, -.input-group-append .btn + .input-group-text, -.input-group-append .input-group-text + .btn, -.input-group-append .input-group-text + .input-group-text, .input-group-prepend .btn + .btn, .input-group-prepend .btn + .input-group-text, +.input-group-prepend .input-group-text + .input-group-text, .input-group-prepend .input-group-text + .btn, -.input-group-prepend .input-group-text + .input-group-text { +.input-group-append .btn + .btn, +.input-group-append .btn + .input-group-text, +.input-group-append .input-group-text + .input-group-text, +.input-group-append .input-group-text + .btn { margin-left: -1px; } + .input-group-prepend { margin-right: -1px; } + .input-group-append { margin-left: -1px; } + .input-group-text { display: flex; align-items: center; @@ -3238,84 +3516,102 @@ input[type="submit"].btn-block { border: 1px solid #222; border-radius: 0.25rem; } -.input-group-text input[type="checkbox"], -.input-group-text input[type="radio"] { +.input-group-text input[type="radio"], +.input-group-text input[type="checkbox"] { margin-top: 0; } -.input-group-lg > .custom-select, -.input-group-lg > .form-control:not(textarea) { + +.input-group-lg > .form-control:not(textarea), +.input-group-lg > .custom-select { height: calc(1.5em + 1rem + 2px); } -.input-group-lg > .custom-select, + .input-group-lg > .form-control, -.input-group-lg > .input-group-append > .btn, +.input-group-lg > .custom-select, +.input-group-lg > .input-group-prepend > .input-group-text, .input-group-lg > .input-group-append > .input-group-text, .input-group-lg > .input-group-prepend > .btn, -.input-group-lg > .input-group-prepend > .input-group-text { +.input-group-lg > .input-group-append > .btn { padding: 0.5rem 1rem; - font-size: 1.17188rem; + font-size: 1.171875rem; line-height: 1.5; border-radius: 0.3rem; } -.input-group-sm > .custom-select, -.input-group-sm > .form-control:not(textarea) { + +.input-group-sm > .form-control:not(textarea), +.input-group-sm > .custom-select { height: calc(1.5em + 0.5rem + 2px); } -.input-group-sm > .custom-select, + .input-group-sm > .form-control, -.input-group-sm > .input-group-append > .btn, +.input-group-sm > .custom-select, +.input-group-sm > .input-group-prepend > .input-group-text, .input-group-sm > .input-group-append > .input-group-text, .input-group-sm > .input-group-prepend > .btn, -.input-group-sm > .input-group-prepend > .input-group-text { +.input-group-sm > .input-group-append > .btn { padding: 0.25rem 0.5rem; - font-size: 0.82031rem; + font-size: 0.8203125rem; line-height: 1.5; border-radius: 0.2rem; } + .input-group-lg > .custom-select, .input-group-sm > .custom-select { padding-right: 1.75rem; } + +.input-group > .input-group-prepend > .btn, +.input-group > .input-group-prepend > .input-group-text, +.input-group:not(.has-validation) > .input-group-append:not(:last-child) > .btn, +.input-group:not(.has-validation) + > .input-group-append:not(:last-child) + > .input-group-text, +.input-group.has-validation > .input-group-append:nth-last-child(n + 3) > .btn, +.input-group.has-validation + > .input-group-append:nth-last-child(n + 3) + > .input-group-text, .input-group > .input-group-append:last-child > .btn:not(:last-child):not(.dropdown-toggle), .input-group > .input-group-append:last-child - > .input-group-text:not(:last-child), -.input-group > .input-group-append:not(:last-child) > .btn, -.input-group > .input-group-append:not(:last-child) > .input-group-text, -.input-group > .input-group-prepend > .btn, -.input-group > .input-group-prepend > .input-group-text { + > .input-group-text:not(:last-child) { border-top-right-radius: 0; border-bottom-right-radius: 0; } + .input-group > .input-group-append > .btn, .input-group > .input-group-append > .input-group-text, +.input-group > .input-group-prepend:not(:first-child) > .btn, +.input-group > .input-group-prepend:not(:first-child) > .input-group-text, .input-group > .input-group-prepend:first-child > .btn:not(:first-child), .input-group > .input-group-prepend:first-child - > .input-group-text:not(:first-child), -.input-group > .input-group-prepend:not(:first-child) > .btn, -.input-group > .input-group-prepend:not(:first-child) > .input-group-text { + > .input-group-text:not(:first-child) { border-top-left-radius: 0; border-bottom-left-radius: 0; } + .custom-control { position: relative; + z-index: 1; display: block; min-height: 1.40625rem; padding-left: 1.5rem; + print-color-adjust: exact; } + .custom-control-inline { display: inline-flex; margin-right: 1rem; } + .custom-control-input { position: absolute; left: 0; z-index: -1; width: 1rem; - height: 1.20312rem; + height: 1.203125rem; opacity: 0; } .custom-control-input:checked ~ .custom-control-label::before { @@ -3334,14 +3630,15 @@ input[type="submit"].btn-block { background-color: #97b3d2; border-color: #97b3d2; } -.custom-control-input:disabled ~ .custom-control-label, -.custom-control-input[disabled] ~ .custom-control-label { +.custom-control-input[disabled] ~ .custom-control-label, +.custom-control-input:disabled ~ .custom-control-label { color: #888; } -.custom-control-input:disabled ~ .custom-control-label::before, -.custom-control-input[disabled] ~ .custom-control-label::before { +.custom-control-input[disabled] ~ .custom-control-label::before, +.custom-control-input:disabled ~ .custom-control-label::before { background-color: #2b2b2b; } + .custom-control-label { position: relative; margin-bottom: 0; @@ -3349,7 +3646,7 @@ input[type="submit"].btn-block { } .custom-control-label::before { position: absolute; - top: 0.20312rem; + top: 0.203125rem; left: -1.5rem; display: block; width: 1rem; @@ -3357,18 +3654,19 @@ input[type="submit"].btn-block { pointer-events: none; content: ""; background-color: #444; - border: #adb5bd solid 1px; + border: 1px solid #adb5bd; } .custom-control-label::after { position: absolute; - top: 0.20312rem; + top: 0.203125rem; left: -1.5rem; display: block; width: 1rem; height: 1rem; content: ""; - background: no-repeat 50%/50% 50%; + background: 50%/50% 50% no-repeat; } + .custom-checkbox .custom-control-label::before { border-radius: 0.25rem; } @@ -3396,6 +3694,7 @@ input[type="submit"].btn-block { ~ .custom-control-label::before { background-color: rgba(55, 90, 127, 0.5); } + .custom-radio .custom-control-label::before { border-radius: 50%; } @@ -3407,6 +3706,7 @@ input[type="submit"].btn-block { ~ .custom-control-label::before { background-color: rgba(55, 90, 127, 0.5); } + .custom-switch { padding-left: 2.25rem; } @@ -3417,7 +3717,7 @@ input[type="submit"].btn-block { border-radius: 0.5rem; } .custom-switch .custom-control-label::after { - top: calc(0.20312rem + 2px); + top: calc(0.203125rem + 2px); left: calc(-2.25rem + 2px); width: calc(1rem - 4px); height: calc(1rem - 4px); @@ -3440,6 +3740,7 @@ input[type="submit"].btn-block { ~ .custom-control-label::before { background-color: rgba(55, 90, 127, 0.5); } + .custom-select { display: inline-block; width: 100%; @@ -3452,7 +3753,7 @@ input[type="submit"].btn-block { vertical-align: middle; background: #444 url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='4' height='5' viewBox='0 0 4 5'%3e%3cpath fill='%23303030' d='M2 0L0 2h4zm0 5L0 3h4z'/%3e%3c/svg%3e") - no-repeat right 0.75rem center/8px 10px; + right 0.75rem center/8px 10px no-repeat; border: 1px solid #222; border-radius: 0.25rem; appearance: none; @@ -3483,20 +3784,23 @@ input[type="submit"].btn-block { color: transparent; text-shadow: 0 0 0 #fff; } + .custom-select-sm { height: calc(1.5em + 0.5rem + 2px); padding-top: 0.25rem; padding-bottom: 0.25rem; padding-left: 0.5rem; - font-size: 0.82031rem; + font-size: 0.8203125rem; } + .custom-select-lg { height: calc(1.5em + 1rem + 2px); padding-top: 0.5rem; padding-bottom: 0.5rem; padding-left: 1rem; - font-size: 1.17188rem; + font-size: 1.171875rem; } + .custom-file { position: relative; display: inline-block; @@ -3504,20 +3808,22 @@ input[type="submit"].btn-block { height: calc(1.5em + 0.75rem + 2px); margin-bottom: 0; } + .custom-file-input { position: relative; z-index: 2; width: 100%; height: calc(1.5em + 0.75rem + 2px); margin: 0; + overflow: hidden; opacity: 0; } .custom-file-input:focus ~ .custom-file-label { border-color: #739ac2; box-shadow: 0 0 0 0.2rem rgba(55, 90, 127, 0.25); } -.custom-file-input:disabled ~ .custom-file-label, -.custom-file-input[disabled] ~ .custom-file-label { +.custom-file-input[disabled] ~ .custom-file-label, +.custom-file-input:disabled ~ .custom-file-label { background-color: #2b2b2b; } .custom-file-input:lang(en) ~ .custom-file-label::after { @@ -3526,6 +3832,7 @@ input[type="submit"].btn-block { .custom-file-input ~ .custom-file-label[data-browse]::after { content: attr(data-browse); } + .custom-file-label { position: absolute; top: 0; @@ -3534,6 +3841,7 @@ input[type="submit"].btn-block { z-index: 1; height: calc(1.5em + 0.75rem + 2px); padding: 0.375rem 0.75rem; + overflow: hidden; font-weight: 400; line-height: 1.5; color: #adb5bd; @@ -3557,6 +3865,7 @@ input[type="submit"].btn-block { border-left: inherit; border-radius: 0 0.25rem 0.25rem 0; } + .custom-range { width: 100%; height: 1.4rem; @@ -3688,6 +3997,7 @@ input[type="submit"].btn-block { .custom-range:disabled::-ms-thumb { background-color: #adb5bd; } + .custom-control-label::before, .custom-file-label, .custom-select { @@ -3701,6 +4011,7 @@ input[type="submit"].btn-block { transition: none; } } + .nav { display: flex; flex-wrap: wrap; @@ -3708,12 +4019,13 @@ input[type="submit"].btn-block { margin-bottom: 0; list-style: none; } + .nav-link { display: block; padding: 0.5rem 2rem; } -.nav-link:focus, -.nav-link:hover { +.nav-link:hover, +.nav-link:focus { text-decoration: none; } .nav-link.disabled { @@ -3721,19 +4033,20 @@ input[type="submit"].btn-block { pointer-events: none; cursor: default; } + .nav-tabs { border-bottom: 1px solid #444; } -.nav-tabs .nav-item { - margin-bottom: -1px; -} .nav-tabs .nav-link { + margin-bottom: -1px; + background-color: transparent; border: 1px solid transparent; border-top-left-radius: 0.25rem; border-top-right-radius: 0.25rem; } -.nav-tabs .nav-link:focus, -.nav-tabs .nav-link:hover { +.nav-tabs .nav-link:hover, +.nav-tabs .nav-link:focus { + isolation: isolate; border-color: #444 #444 transparent; } .nav-tabs .nav-link.disabled { @@ -3741,8 +4054,8 @@ input[type="submit"].btn-block { background-color: transparent; border-color: transparent; } -.nav-tabs .nav-item.show .nav-link, -.nav-tabs .nav-link.active { +.nav-tabs .nav-link.active, +.nav-tabs .nav-item.show .nav-link { color: #fff; background-color: #222; border-color: #444 #444 transparent; @@ -3752,7 +4065,10 @@ input[type="submit"].btn-block { border-top-left-radius: 0; border-top-right-radius: 0; } + .nav-pills .nav-link { + background: none; + border: 0; border-radius: 0.25rem; } .nav-pills .nav-link.active, @@ -3760,21 +4076,27 @@ input[type="submit"].btn-block { color: #fff; background-color: #375a7f; } + +.nav-fill > .nav-link, .nav-fill .nav-item { flex: 1 1 auto; text-align: center; } + +.nav-justified > .nav-link, .nav-justified .nav-item { flex-basis: 0; flex-grow: 1; text-align: center; } + .tab-content > .tab-pane { display: none; } .tab-content > .active { display: block; } + .navbar { position: relative; display: flex; @@ -3785,9 +4107,9 @@ input[type="submit"].btn-block { } .navbar .container, .navbar .container-fluid, -.navbar .container-lg, -.navbar .container-md, .navbar .container-sm, +.navbar .container-md, +.navbar .container-lg, .navbar .container-xl { display: flex; flex-wrap: wrap; @@ -3796,17 +4118,18 @@ input[type="submit"].btn-block { } .navbar-brand { display: inline-block; - padding-top: 0.32422rem; - padding-bottom: 0.32422rem; + padding-top: 0.32421875rem; + padding-bottom: 0.32421875rem; margin-right: 1rem; - font-size: 1.17188rem; + font-size: 1.171875rem; line-height: inherit; white-space: nowrap; } -.navbar-brand:focus, -.navbar-brand:hover { +.navbar-brand:hover, +.navbar-brand:focus { text-decoration: none; } + .navbar-nav { display: flex; flex-direction: column; @@ -3822,43 +4145,52 @@ input[type="submit"].btn-block { position: static; float: none; } + .navbar-text { display: inline-block; padding-top: 0.5rem; padding-bottom: 0.5rem; } + .navbar-collapse { flex-basis: 100%; flex-grow: 1; align-items: center; } + .navbar-toggler { padding: 0.25rem 0.75rem; - font-size: 1.17188rem; + font-size: 1.171875rem; line-height: 1; background-color: transparent; border: 1px solid transparent; border-radius: 0.25rem; } -.navbar-toggler:focus, -.navbar-toggler:hover { +.navbar-toggler:hover, +.navbar-toggler:focus { text-decoration: none; } + .navbar-toggler-icon { display: inline-block; width: 1.5em; height: 1.5em; vertical-align: middle; content: ""; - background: no-repeat center center; - background-size: 100% 100%; + background: 50%/100% 100% no-repeat; } + +.navbar-nav-scroll { + max-height: 75vh; + overflow-y: auto; +} + @media (max-width: 575.98px) { .navbar-expand-sm > .container, .navbar-expand-sm > .container-fluid, - .navbar-expand-sm > .container-lg, - .navbar-expand-sm > .container-md, .navbar-expand-sm > .container-sm, + .navbar-expand-sm > .container-md, + .navbar-expand-sm > .container-lg, .navbar-expand-sm > .container-xl { padding-right: 0; padding-left: 0; @@ -3881,12 +4213,15 @@ input[type="submit"].btn-block { } .navbar-expand-sm > .container, .navbar-expand-sm > .container-fluid, - .navbar-expand-sm > .container-lg, - .navbar-expand-sm > .container-md, .navbar-expand-sm > .container-sm, + .navbar-expand-sm > .container-md, + .navbar-expand-sm > .container-lg, .navbar-expand-sm > .container-xl { flex-wrap: nowrap; } + .navbar-expand-sm .navbar-nav-scroll { + overflow: visible; + } .navbar-expand-sm .navbar-collapse { display: flex !important; flex-basis: auto; @@ -3898,9 +4233,9 @@ input[type="submit"].btn-block { @media (max-width: 767.98px) { .navbar-expand-md > .container, .navbar-expand-md > .container-fluid, - .navbar-expand-md > .container-lg, - .navbar-expand-md > .container-md, .navbar-expand-md > .container-sm, + .navbar-expand-md > .container-md, + .navbar-expand-md > .container-lg, .navbar-expand-md > .container-xl { padding-right: 0; padding-left: 0; @@ -3923,12 +4258,15 @@ input[type="submit"].btn-block { } .navbar-expand-md > .container, .navbar-expand-md > .container-fluid, - .navbar-expand-md > .container-lg, - .navbar-expand-md > .container-md, .navbar-expand-md > .container-sm, + .navbar-expand-md > .container-md, + .navbar-expand-md > .container-lg, .navbar-expand-md > .container-xl { flex-wrap: nowrap; } + .navbar-expand-md .navbar-nav-scroll { + overflow: visible; + } .navbar-expand-md .navbar-collapse { display: flex !important; flex-basis: auto; @@ -3940,9 +4278,9 @@ input[type="submit"].btn-block { @media (max-width: 991.98px) { .navbar-expand-lg > .container, .navbar-expand-lg > .container-fluid, - .navbar-expand-lg > .container-lg, - .navbar-expand-lg > .container-md, .navbar-expand-lg > .container-sm, + .navbar-expand-lg > .container-md, + .navbar-expand-lg > .container-lg, .navbar-expand-lg > .container-xl { padding-right: 0; padding-left: 0; @@ -3965,12 +4303,15 @@ input[type="submit"].btn-block { } .navbar-expand-lg > .container, .navbar-expand-lg > .container-fluid, - .navbar-expand-lg > .container-lg, - .navbar-expand-lg > .container-md, .navbar-expand-lg > .container-sm, + .navbar-expand-lg > .container-md, + .navbar-expand-lg > .container-lg, .navbar-expand-lg > .container-xl { flex-wrap: nowrap; } + .navbar-expand-lg .navbar-nav-scroll { + overflow: visible; + } .navbar-expand-lg .navbar-collapse { display: flex !important; flex-basis: auto; @@ -3982,9 +4323,9 @@ input[type="submit"].btn-block { @media (max-width: 1199.98px) { .navbar-expand-xl > .container, .navbar-expand-xl > .container-fluid, - .navbar-expand-xl > .container-lg, - .navbar-expand-xl > .container-md, .navbar-expand-xl > .container-sm, + .navbar-expand-xl > .container-md, + .navbar-expand-xl > .container-lg, .navbar-expand-xl > .container-xl { padding-right: 0; padding-left: 0; @@ -4007,12 +4348,15 @@ input[type="submit"].btn-block { } .navbar-expand-xl > .container, .navbar-expand-xl > .container-fluid, - .navbar-expand-xl > .container-lg, - .navbar-expand-xl > .container-md, .navbar-expand-xl > .container-sm, + .navbar-expand-xl > .container-md, + .navbar-expand-xl > .container-lg, .navbar-expand-xl > .container-xl { flex-wrap: nowrap; } + .navbar-expand-xl .navbar-nav-scroll { + overflow: visible; + } .navbar-expand-xl .navbar-collapse { display: flex !important; flex-basis: auto; @@ -4027,9 +4371,9 @@ input[type="submit"].btn-block { } .navbar-expand > .container, .navbar-expand > .container-fluid, -.navbar-expand > .container-lg, -.navbar-expand > .container-md, .navbar-expand > .container-sm, +.navbar-expand > .container-md, +.navbar-expand > .container-lg, .navbar-expand > .container-xl { padding-right: 0; padding-left: 0; @@ -4046,12 +4390,15 @@ input[type="submit"].btn-block { } .navbar-expand > .container, .navbar-expand > .container-fluid, -.navbar-expand > .container-lg, -.navbar-expand > .container-md, .navbar-expand > .container-sm, +.navbar-expand > .container-md, +.navbar-expand > .container-lg, .navbar-expand > .container-xl { flex-wrap: nowrap; } +.navbar-expand .navbar-nav-scroll { + overflow: visible; +} .navbar-expand .navbar-collapse { display: flex !important; flex-basis: auto; @@ -4059,27 +4406,28 @@ input[type="submit"].btn-block { .navbar-expand .navbar-toggler { display: none; } + .navbar-light .navbar-brand { color: #fff; } -.navbar-light .navbar-brand:focus, -.navbar-light .navbar-brand:hover { +.navbar-light .navbar-brand:hover, +.navbar-light .navbar-brand:focus { color: #fff; } .navbar-light .navbar-nav .nav-link { color: rgba(255, 255, 255, 0.6); } -.navbar-light .navbar-nav .nav-link:focus, -.navbar-light .navbar-nav .nav-link:hover { +.navbar-light .navbar-nav .nav-link:hover, +.navbar-light .navbar-nav .nav-link:focus { color: #fff; } .navbar-light .navbar-nav .nav-link.disabled { color: rgba(0, 0, 0, 0.3); } +.navbar-light .navbar-nav .show > .nav-link, .navbar-light .navbar-nav .active > .nav-link, -.navbar-light .navbar-nav .nav-link.active, .navbar-light .navbar-nav .nav-link.show, -.navbar-light .navbar-nav .show > .nav-link { +.navbar-light .navbar-nav .nav-link.active { color: #fff; } .navbar-light .navbar-toggler { @@ -4095,31 +4443,32 @@ input[type="submit"].btn-block { .navbar-light .navbar-text a { color: #fff; } -.navbar-light .navbar-text a:focus, -.navbar-light .navbar-text a:hover { +.navbar-light .navbar-text a:hover, +.navbar-light .navbar-text a:focus { color: #fff; } + .navbar-dark .navbar-brand { color: #fff; } -.navbar-dark .navbar-brand:focus, -.navbar-dark .navbar-brand:hover { +.navbar-dark .navbar-brand:hover, +.navbar-dark .navbar-brand:focus { color: #fff; } .navbar-dark .navbar-nav .nav-link { color: rgba(255, 255, 255, 0.6); } -.navbar-dark .navbar-nav .nav-link:focus, -.navbar-dark .navbar-nav .nav-link:hover { +.navbar-dark .navbar-nav .nav-link:hover, +.navbar-dark .navbar-nav .nav-link:focus { color: #fff; } .navbar-dark .navbar-nav .nav-link.disabled { color: rgba(255, 255, 255, 0.25); } +.navbar-dark .navbar-nav .show > .nav-link, .navbar-dark .navbar-nav .active > .nav-link, -.navbar-dark .navbar-nav .nav-link.active, .navbar-dark .navbar-nav .nav-link.show, -.navbar-dark .navbar-nav .show > .nav-link { +.navbar-dark .navbar-nav .nav-link.active { color: #fff; } .navbar-dark .navbar-toggler { @@ -4135,10 +4484,11 @@ input[type="submit"].btn-block { .navbar-dark .navbar-text a { color: #fff; } -.navbar-dark .navbar-text a:focus, -.navbar-dark .navbar-text a:hover { +.navbar-dark .navbar-text a:hover, +.navbar-dark .navbar-text a:focus { color: #fff; } + .card { position: relative; display: flex; @@ -4168,27 +4518,37 @@ input[type="submit"].btn-block { border-bottom-right-radius: calc(0.25rem - 1px); border-bottom-left-radius: calc(0.25rem - 1px); } +.card > .card-header + .list-group, +.card > .list-group + .card-footer { + border-top: 0; +} + .card-body { flex: 1 1 auto; min-height: 1px; padding: 1.25rem; } + .card-title { margin-bottom: 0.75rem; } + .card-subtitle { margin-top: -0.375rem; margin-bottom: 0; } + .card-text:last-child { margin-bottom: 0; } + .card-link:hover { text-decoration: none; } .card-link + .card-link { margin-left: 1.25rem; } + .card-header { padding: 0.75rem 1.25rem; margin-bottom: 0; @@ -4198,9 +4558,7 @@ input[type="submit"].btn-block { .card-header:first-child { border-radius: calc(0.25rem - 1px) calc(0.25rem - 1px) 0 0; } -.card-header + .list-group .list-group-item:first-child { - border-top: 0; -} + .card-footer { padding: 0.75rem 1.25rem; background-color: #444; @@ -4209,16 +4567,19 @@ input[type="submit"].btn-block { .card-footer:last-child { border-radius: 0 0 calc(0.25rem - 1px) calc(0.25rem - 1px); } + .card-header-tabs { margin-right: -0.625rem; margin-bottom: -0.75rem; margin-left: -0.625rem; border-bottom: 0; } + .card-header-pills { margin-right: -0.625rem; margin-left: -0.625rem; } + .card-img-overlay { position: absolute; top: 0; @@ -4226,23 +4587,28 @@ input[type="submit"].btn-block { bottom: 0; left: 0; padding: 1.25rem; + border-radius: calc(0.25rem - 1px); } + .card-img, -.card-img-bottom, -.card-img-top { +.card-img-top, +.card-img-bottom { flex-shrink: 0; width: 100%; } + .card-img, .card-img-top { border-top-left-radius: calc(0.25rem - 1px); border-top-right-radius: calc(0.25rem - 1px); } + .card-img, .card-img-bottom { border-bottom-right-radius: calc(0.25rem - 1px); border-bottom-left-radius: calc(0.25rem - 1px); } + .card-deck .card { margin-bottom: 15px; } @@ -4260,6 +4626,7 @@ input[type="submit"].btn-block { margin-left: 15px; } } + .card-group > .card { margin-bottom: 15px; } @@ -4280,27 +4647,28 @@ input[type="submit"].btn-block { border-top-right-radius: 0; border-bottom-right-radius: 0; } - .card-group > .card:not(:last-child) .card-header, - .card-group > .card:not(:last-child) .card-img-top { + .card-group > .card:not(:last-child) .card-img-top, + .card-group > .card:not(:last-child) .card-header { border-top-right-radius: 0; } - .card-group > .card:not(:last-child) .card-footer, - .card-group > .card:not(:last-child) .card-img-bottom { + .card-group > .card:not(:last-child) .card-img-bottom, + .card-group > .card:not(:last-child) .card-footer { border-bottom-right-radius: 0; } .card-group > .card:not(:first-child) { border-top-left-radius: 0; border-bottom-left-radius: 0; } - .card-group > .card:not(:first-child) .card-header, - .card-group > .card:not(:first-child) .card-img-top { + .card-group > .card:not(:first-child) .card-img-top, + .card-group > .card:not(:first-child) .card-header { border-top-left-radius: 0; } - .card-group > .card:not(:first-child) .card-footer, - .card-group > .card:not(:first-child) .card-img-bottom { + .card-group > .card:not(:first-child) .card-img-bottom, + .card-group > .card:not(:first-child) .card-footer { border-bottom-left-radius: 0; } } + .card-columns .card { margin-bottom: 0.75rem; } @@ -4316,6 +4684,10 @@ input[type="submit"].btn-block { width: 100%; } } + +.accordion { + overflow-anchor: none; +} .accordion > .card { overflow: hidden; } @@ -4332,6 +4704,7 @@ input[type="submit"].btn-block { border-radius: 0; margin-bottom: -1px; } + .breadcrumb { display: flex; flex-wrap: wrap; @@ -4341,14 +4714,12 @@ input[type="submit"].btn-block { background-color: #444; border-radius: 0.25rem; } -.breadcrumb-item { - display: flex; -} + .breadcrumb-item + .breadcrumb-item { padding-left: 0.5rem; } .breadcrumb-item + .breadcrumb-item::before { - display: inline-block; + float: left; padding-right: 0.5rem; color: #888; content: "/"; @@ -4362,12 +4733,14 @@ input[type="submit"].btn-block { .breadcrumb-item.active { color: #888; } + .pagination { display: flex; padding-left: 0; list-style: none; border-radius: 0.25rem; } + .page-link { position: relative; display: block; @@ -4375,14 +4748,14 @@ input[type="submit"].btn-block { margin-left: 0; line-height: 1.25; color: #fff; - background-color: #e74c3c; + background-color: #00bc8c; border: 0 solid transparent; } .page-link:hover { z-index: 2; color: #fff; text-decoration: none; - background-color: #a62f22; + background-color: #00efb2; border-color: transparent; } .page-link:focus { @@ -4390,6 +4763,7 @@ input[type="submit"].btn-block { outline: 0; box-shadow: 0 0 0 0.2rem rgba(55, 90, 127, 0.25); } + .page-item:first-child .page-link { margin-left: 0; border-top-left-radius: 0.25rem; @@ -4412,9 +4786,10 @@ input[type="submit"].btn-block { background-color: #007053; border-color: transparent; } + .pagination-lg .page-link { padding: 0.75rem 1.5rem; - font-size: 1.17188rem; + font-size: 1.171875rem; line-height: 1.5; } .pagination-lg .page-item:first-child .page-link { @@ -4425,9 +4800,10 @@ input[type="submit"].btn-block { border-top-right-radius: 0.3rem; border-bottom-right-radius: 0.3rem; } + .pagination-sm .page-link { padding: 0.25rem 0.5rem; - font-size: 0.82031rem; + font-size: 0.8203125rem; line-height: 1.5; } .pagination-sm .page-item:first-child .page-link { @@ -4438,6 +4814,7 @@ input[type="submit"].btn-block { border-top-right-radius: 0.2rem; border-bottom-right-radius: 0.2rem; } + .badge { display: inline-block; padding: 0.25em 0.4em; @@ -4456,134 +4833,146 @@ input[type="submit"].btn-block { transition: none; } } -a.badge:focus, -a.badge:hover { +a.badge:hover, +a.badge:focus { text-decoration: none; } + .badge:empty { display: none; } + .btn .badge { position: relative; top: -1px; } + .badge-pill { padding-right: 0.6em; padding-left: 0.6em; border-radius: 10rem; } + .badge-primary { color: #fff; background-color: #375a7f; } -a.badge-primary:focus, -a.badge-primary:hover { +a.badge-primary:hover, +a.badge-primary:focus { color: #fff; background-color: #28415b; } -a.badge-primary.focus, -a.badge-primary:focus { +a.badge-primary:focus, +a.badge-primary.focus { outline: 0; box-shadow: 0 0 0 0.2rem rgba(55, 90, 127, 0.5); } + .badge-secondary { color: #fff; background-color: #444; } -a.badge-secondary:focus, -a.badge-secondary:hover { +a.badge-secondary:hover, +a.badge-secondary:focus { color: #fff; background-color: #2b2b2b; } -a.badge-secondary.focus, -a.badge-secondary:focus { +a.badge-secondary:focus, +a.badge-secondary.focus { outline: 0; box-shadow: 0 0 0 0.2rem rgba(68, 68, 68, 0.5); } + .badge-success { color: #fff; background-color: #00bc8c; } -a.badge-success:focus, -a.badge-success:hover { +a.badge-success:hover, +a.badge-success:focus { color: #fff; background-color: #008966; } -a.badge-success.focus, -a.badge-success:focus { +a.badge-success:focus, +a.badge-success.focus { outline: 0; box-shadow: 0 0 0 0.2rem rgba(0, 188, 140, 0.5); } + .badge-info { color: #fff; background-color: #3498db; } -a.badge-info:focus, -a.badge-info:hover { +a.badge-info:hover, +a.badge-info:focus { color: #fff; background-color: #217dbb; } -a.badge-info.focus, -a.badge-info:focus { +a.badge-info:focus, +a.badge-info.focus { outline: 0; box-shadow: 0 0 0 0.2rem rgba(52, 152, 219, 0.5); } + .badge-warning { color: #fff; background-color: #f39c12; } -a.badge-warning:focus, -a.badge-warning:hover { +a.badge-warning:hover, +a.badge-warning:focus { color: #fff; background-color: #c87f0a; } -a.badge-warning.focus, -a.badge-warning:focus { +a.badge-warning:focus, +a.badge-warning.focus { outline: 0; box-shadow: 0 0 0 0.2rem rgba(243, 156, 18, 0.5); } + .badge-danger { color: #fff; background-color: #e74c3c; } -a.badge-danger:focus, -a.badge-danger:hover { +a.badge-danger:hover, +a.badge-danger:focus { color: #fff; background-color: #d62c1a; } -a.badge-danger.focus, -a.badge-danger:focus { +a.badge-danger:focus, +a.badge-danger.focus { outline: 0; box-shadow: 0 0 0 0.2rem rgba(231, 76, 60, 0.5); } + .badge-light { color: #fff; background-color: #303030; } -a.badge-light:focus, -a.badge-light:hover { +a.badge-light:hover, +a.badge-light:focus { color: #fff; background-color: #171717; } -a.badge-light.focus, -a.badge-light:focus { +a.badge-light:focus, +a.badge-light.focus { outline: 0; box-shadow: 0 0 0 0.2rem rgba(48, 48, 48, 0.5); } + .badge-dark { color: #222; background-color: #dee2e6; } -a.badge-dark:focus, -a.badge-dark:hover { +a.badge-dark:hover, +a.badge-dark:focus { color: #222; background-color: #c1c9d0; } -a.badge-dark.focus, -a.badge-dark:focus { +a.badge-dark:focus, +a.badge-dark.focus { outline: 0; box-shadow: 0 0 0 0.2rem rgba(222, 226, 230, 0.5); } + .jumbotron { padding: 2rem 1rem; margin-bottom: 2rem; @@ -4595,11 +4984,13 @@ a.badge-dark:focus { padding: 4rem 2rem; } } + .jumbotron-fluid { padding-right: 0; padding-left: 0; border-radius: 0; } + .alert { position: relative; padding: 0.75rem 1.25rem; @@ -4607,12 +4998,15 @@ a.badge-dark:focus { border: 1px solid transparent; border-radius: 0.25rem; } + .alert-heading { color: inherit; } + .alert-link { font-weight: 700; } + .alert-dismissible { padding-right: 3.90625rem; } @@ -4620,9 +5014,11 @@ a.badge-dark:focus { position: absolute; top: 0; right: 0; + z-index: 2; padding: 0.75rem 1.25rem; color: inherit; } + .alert-primary { color: #1d2f42; background-color: #d7dee5; @@ -4634,6 +5030,7 @@ a.badge-dark:focus { .alert-primary .alert-link { color: #0d161f; } + .alert-secondary { color: #232323; background-color: #dadada; @@ -4645,6 +5042,7 @@ a.badge-dark:focus { .alert-secondary .alert-link { color: #0a0a0a; } + .alert-success { color: #006249; background-color: #ccf2e8; @@ -4656,6 +5054,7 @@ a.badge-dark:focus { .alert-success .alert-link { color: #002f23; } + .alert-info { color: #1b4f72; background-color: #d6eaf8; @@ -4667,6 +5066,7 @@ a.badge-dark:focus { .alert-info .alert-link { color: #113249; } + .alert-warning { color: #7e5109; background-color: #fdebd0; @@ -4678,6 +5078,7 @@ a.badge-dark:focus { .alert-warning .alert-link { color: #4e3206; } + .alert-danger { color: #78281f; background-color: #fadbd8; @@ -4689,6 +5090,7 @@ a.badge-dark:focus { .alert-danger .alert-link { color: #4f1a15; } + .alert-light { color: #191919; background-color: #d6d6d6; @@ -4698,8 +5100,9 @@ a.badge-dark:focus { border-top-color: #b8b8b8; } .alert-light .alert-link { - color: #000; + color: black; } + .alert-dark { color: #737678; background-color: #f8f9fa; @@ -4711,6 +5114,7 @@ a.badge-dark:focus { .alert-dark .alert-link { color: #5a5c5e; } + @keyframes progress-bar-stripes { from { background-position: 1rem 0; @@ -4724,10 +5128,11 @@ a.badge-dark:focus { height: 1rem; overflow: hidden; line-height: 0; - font-size: 0.70312rem; + font-size: 0.703125rem; background-color: #444; border-radius: 0.25rem; } + .progress-bar { display: flex; flex-direction: column; @@ -4744,6 +5149,7 @@ a.badge-dark:focus { transition: none; } } + .progress-bar-striped { background-image: linear-gradient( 45deg, @@ -4757,21 +5163,25 @@ a.badge-dark:focus { ); background-size: 1rem 1rem; } + .progress-bar-animated { - animation: progress-bar-stripes 1s linear infinite; + animation: 1s linear infinite progress-bar-stripes; } @media (prefers-reduced-motion: reduce) { .progress-bar-animated { animation: none; } } + .media { display: flex; align-items: flex-start; } + .media-body { flex: 1; } + .list-group { display: flex; flex-direction: column; @@ -4779,13 +5189,14 @@ a.badge-dark:focus { margin-bottom: 0; border-radius: 0.25rem; } + .list-group-item-action { width: 100%; color: #444; text-align: inherit; } -.list-group-item-action:focus, -.list-group-item-action:hover { +.list-group-item-action:hover, +.list-group-item-action:focus { z-index: 1; color: #444; text-decoration: none; @@ -4795,6 +5206,7 @@ a.badge-dark:focus { color: #dee2e6; background-color: #ebebeb; } + .list-group-item { position: relative; display: block; @@ -4829,6 +5241,7 @@ a.badge-dark:focus { margin-top: -1px; border-top-width: 1px; } + .list-group-horizontal { flex-direction: row; } @@ -4851,6 +5264,7 @@ a.badge-dark:focus { margin-left: -1px; border-left-width: 1px; } + @media (min-width: 576px) { .list-group-horizontal-sm { flex-direction: row; @@ -4956,12 +5370,13 @@ a.badge-dark:focus { .list-group-flush > .list-group-item:last-child { border-bottom-width: 0; } + .list-group-item-primary { color: #1d2f42; background-color: #c7d1db; } -.list-group-item-primary.list-group-item-action:focus, -.list-group-item-primary.list-group-item-action:hover { +.list-group-item-primary.list-group-item-action:hover, +.list-group-item-primary.list-group-item-action:focus { color: #1d2f42; background-color: #b7c4d1; } @@ -4970,12 +5385,13 @@ a.badge-dark:focus { background-color: #1d2f42; border-color: #1d2f42; } + .list-group-item-secondary { color: #232323; background-color: #cbcbcb; } -.list-group-item-secondary.list-group-item-action:focus, -.list-group-item-secondary.list-group-item-action:hover { +.list-group-item-secondary.list-group-item-action:hover, +.list-group-item-secondary.list-group-item-action:focus { color: #232323; background-color: #bebebe; } @@ -4984,12 +5400,13 @@ a.badge-dark:focus { background-color: #232323; border-color: #232323; } + .list-group-item-success { color: #006249; background-color: #b8ecdf; } -.list-group-item-success.list-group-item-action:focus, -.list-group-item-success.list-group-item-action:hover { +.list-group-item-success.list-group-item-action:hover, +.list-group-item-success.list-group-item-action:focus { color: #006249; background-color: #a4e7d6; } @@ -4998,12 +5415,13 @@ a.badge-dark:focus { background-color: #006249; border-color: #006249; } + .list-group-item-info { color: #1b4f72; background-color: #c6e2f5; } -.list-group-item-info.list-group-item-action:focus, -.list-group-item-info.list-group-item-action:hover { +.list-group-item-info.list-group-item-action:hover, +.list-group-item-info.list-group-item-action:focus { color: #1b4f72; background-color: #b0d7f1; } @@ -5012,12 +5430,13 @@ a.badge-dark:focus { background-color: #1b4f72; border-color: #1b4f72; } + .list-group-item-warning { color: #7e5109; background-color: #fce3bd; } -.list-group-item-warning.list-group-item-action:focus, -.list-group-item-warning.list-group-item-action:hover { +.list-group-item-warning.list-group-item-action:hover, +.list-group-item-warning.list-group-item-action:focus { color: #7e5109; background-color: #fbd9a5; } @@ -5026,12 +5445,13 @@ a.badge-dark:focus { background-color: #7e5109; border-color: #7e5109; } + .list-group-item-danger { color: #78281f; background-color: #f8cdc8; } -.list-group-item-danger.list-group-item-action:focus, -.list-group-item-danger.list-group-item-action:hover { +.list-group-item-danger.list-group-item-action:hover, +.list-group-item-danger.list-group-item-action:focus { color: #78281f; background-color: #f5b8b1; } @@ -5040,12 +5460,13 @@ a.badge-dark:focus { background-color: #78281f; border-color: #78281f; } + .list-group-item-light { color: #191919; background-color: #c5c5c5; } -.list-group-item-light.list-group-item-action:focus, -.list-group-item-light.list-group-item-action:hover { +.list-group-item-light.list-group-item-action:hover, +.list-group-item-light.list-group-item-action:focus { color: #191919; background-color: #b8b8b8; } @@ -5054,12 +5475,13 @@ a.badge-dark:focus { background-color: #191919; border-color: #191919; } + .list-group-item-dark { color: #737678; background-color: #f6f7f8; } -.list-group-item-dark.list-group-item-action:focus, -.list-group-item-dark.list-group-item-action:hover { +.list-group-item-dark.list-group-item-action:hover, +.list-group-item-dark.list-group-item-action:focus { color: #737678; background-color: #e8eaed; } @@ -5068,6 +5490,7 @@ a.badge-dark:focus { background-color: #737678; border-color: #737678; } + .close { float: right; font-size: 1.40625rem; @@ -5081,27 +5504,29 @@ a.badge-dark:focus { color: #fff; text-decoration: none; } -.close:not(:disabled):not(.disabled):focus, -.close:not(:disabled):not(.disabled):hover { +.close:not(:disabled):not(.disabled):hover, +.close:not(:disabled):not(.disabled):focus { opacity: 0.75; } + button.close { padding: 0; background-color: transparent; border: 0; } + a.close.disabled { pointer-events: none; } + .toast { + flex-basis: 350px; max-width: 350px; - overflow: hidden; font-size: 0.875rem; background-color: #444; background-clip: padding-box; border: 1px solid rgba(0, 0, 0, 0.1); box-shadow: 0 0.25rem 0.75rem rgba(0, 0, 0, 0.1); - backdrop-filter: blur(10px); opacity: 0; border-radius: 0.25rem; } @@ -5118,6 +5543,7 @@ a.close.disabled { .toast.hide { display: none; } + .toast-header { display: flex; align-items: center; @@ -5126,10 +5552,14 @@ a.close.disabled { background-color: #303030; background-clip: padding-box; border-bottom: 1px solid rgba(0, 0, 0, 0.05); + border-top-left-radius: calc(0.25rem - 1px); + border-top-right-radius: calc(0.25rem - 1px); } + .toast-body { padding: 0.75rem; } + .modal-open { overflow: hidden; } @@ -5137,6 +5567,7 @@ a.close.disabled { overflow-x: hidden; overflow-y: auto; } + .modal { position: fixed; top: 0; @@ -5148,6 +5579,7 @@ a.close.disabled { overflow: hidden; outline: 0; } + .modal-dialog { position: relative; width: auto; @@ -5169,6 +5601,7 @@ a.close.disabled { .modal.modal-static .modal-dialog { transform: scale(1.02); } + .modal-dialog-scrollable { display: flex; max-height: calc(100% - 1rem); @@ -5177,13 +5610,14 @@ a.close.disabled { max-height: calc(100vh - 1rem); overflow: hidden; } -.modal-dialog-scrollable .modal-footer, -.modal-dialog-scrollable .modal-header { +.modal-dialog-scrollable .modal-header, +.modal-dialog-scrollable .modal-footer { flex-shrink: 0; } .modal-dialog-scrollable .modal-body { overflow-y: auto; } + .modal-dialog-centered { display: flex; align-items: center; @@ -5206,6 +5640,7 @@ a.close.disabled { .modal-dialog-centered.modal-dialog-scrollable::before { content: none; } + .modal-content { position: relative; display: flex; @@ -5218,6 +5653,7 @@ a.close.disabled { border-radius: 0.3rem; outline: 0; } + .modal-backdrop { position: fixed; top: 0; @@ -5233,6 +5669,7 @@ a.close.disabled { .modal-backdrop.show { opacity: 0.5; } + .modal-header { display: flex; align-items: flex-start; @@ -5246,15 +5683,18 @@ a.close.disabled { padding: 1rem 1rem; margin: -1rem -1rem -1rem auto; } + .modal-title { margin-bottom: 0; line-height: 1.5; } + .modal-body { position: relative; flex: 1 1 auto; padding: 1rem; } + .modal-footer { display: flex; flex-wrap: wrap; @@ -5268,6 +5708,7 @@ a.close.disabled { .modal-footer > * { margin: 0.25rem; } + .modal-scrollbar-measure { position: absolute; top: -9999px; @@ -5275,6 +5716,7 @@ a.close.disabled { height: 50px; overflow: scroll; } + @media (min-width: 576px) { .modal-dialog { max-width: 500px; @@ -5313,7 +5755,7 @@ a.close.disabled { z-index: 1070; display: block; margin: 0; - font-family: Lato, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, + font-family: "Lato", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; font-style: normal; @@ -5326,10 +5768,10 @@ a.close.disabled { text-transform: none; letter-spacing: normal; word-break: normal; - word-spacing: normal; white-space: normal; + word-spacing: normal; line-break: auto; - font-size: 0.82031rem; + font-size: 0.8203125rem; word-wrap: break-word; opacity: 0; } @@ -5348,66 +5790,71 @@ a.close.disabled { border-color: transparent; border-style: solid; } -.bs-tooltip-auto[x-placement^="top"], -.bs-tooltip-top { + +.bs-tooltip-top, +.bs-tooltip-auto[x-placement^="top"] { padding: 0.4rem 0; } -.bs-tooltip-auto[x-placement^="top"] .arrow, -.bs-tooltip-top .arrow { +.bs-tooltip-top .arrow, +.bs-tooltip-auto[x-placement^="top"] .arrow { bottom: 0; } -.bs-tooltip-auto[x-placement^="top"] .arrow::before, -.bs-tooltip-top .arrow::before { +.bs-tooltip-top .arrow::before, +.bs-tooltip-auto[x-placement^="top"] .arrow::before { top: 0; border-width: 0.4rem 0.4rem 0; border-top-color: #000; } -.bs-tooltip-auto[x-placement^="right"], -.bs-tooltip-right { + +.bs-tooltip-right, +.bs-tooltip-auto[x-placement^="right"] { padding: 0 0.4rem; } -.bs-tooltip-auto[x-placement^="right"] .arrow, -.bs-tooltip-right .arrow { +.bs-tooltip-right .arrow, +.bs-tooltip-auto[x-placement^="right"] .arrow { left: 0; width: 0.4rem; height: 0.8rem; } -.bs-tooltip-auto[x-placement^="right"] .arrow::before, -.bs-tooltip-right .arrow::before { +.bs-tooltip-right .arrow::before, +.bs-tooltip-auto[x-placement^="right"] .arrow::before { right: 0; border-width: 0.4rem 0.4rem 0.4rem 0; border-right-color: #000; } -.bs-tooltip-auto[x-placement^="bottom"], -.bs-tooltip-bottom { + +.bs-tooltip-bottom, +.bs-tooltip-auto[x-placement^="bottom"] { padding: 0.4rem 0; } -.bs-tooltip-auto[x-placement^="bottom"] .arrow, -.bs-tooltip-bottom .arrow { +.bs-tooltip-bottom .arrow, +.bs-tooltip-auto[x-placement^="bottom"] .arrow { top: 0; } -.bs-tooltip-auto[x-placement^="bottom"] .arrow::before, -.bs-tooltip-bottom .arrow::before { +.bs-tooltip-bottom .arrow::before, +.bs-tooltip-auto[x-placement^="bottom"] .arrow::before { bottom: 0; border-width: 0 0.4rem 0.4rem; border-bottom-color: #000; } -.bs-tooltip-auto[x-placement^="left"], -.bs-tooltip-left { + +.bs-tooltip-left, +.bs-tooltip-auto[x-placement^="left"] { padding: 0 0.4rem; } -.bs-tooltip-auto[x-placement^="left"] .arrow, -.bs-tooltip-left .arrow { +.bs-tooltip-left .arrow, +.bs-tooltip-auto[x-placement^="left"] .arrow { right: 0; width: 0.4rem; height: 0.8rem; } -.bs-tooltip-auto[x-placement^="left"] .arrow::before, -.bs-tooltip-left .arrow::before { +.bs-tooltip-left .arrow::before, +.bs-tooltip-auto[x-placement^="left"] .arrow::before { left: 0; border-width: 0.4rem 0 0.4rem 0.4rem; border-left-color: #000; } + .tooltip-inner { max-width: 200px; padding: 0.25rem 0.5rem; @@ -5416,6 +5863,7 @@ a.close.disabled { background-color: #000; border-radius: 0.25rem; } + .popover { position: absolute; top: 0; @@ -5423,7 +5871,7 @@ a.close.disabled { z-index: 1060; display: block; max-width: 276px; - font-family: Lato, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, + font-family: "Lato", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; font-style: normal; @@ -5436,10 +5884,10 @@ a.close.disabled { text-transform: none; letter-spacing: normal; word-break: normal; - word-spacing: normal; white-space: normal; + word-spacing: normal; line-break: auto; - font-size: 0.82031rem; + font-size: 0.8203125rem; word-wrap: break-word; background-color: #303030; background-clip: padding-box; @@ -5453,79 +5901,82 @@ a.close.disabled { height: 0.5rem; margin: 0 0.3rem; } -.popover .arrow::after, -.popover .arrow::before { +.popover .arrow::before, +.popover .arrow::after { position: absolute; display: block; content: ""; border-color: transparent; border-style: solid; } -.bs-popover-auto[x-placement^="top"], -.bs-popover-top { + +.bs-popover-top, +.bs-popover-auto[x-placement^="top"] { margin-bottom: 0.5rem; } -.bs-popover-auto[x-placement^="top"] > .arrow, -.bs-popover-top > .arrow { +.bs-popover-top > .arrow, +.bs-popover-auto[x-placement^="top"] > .arrow { bottom: calc(-0.5rem - 1px); } -.bs-popover-auto[x-placement^="top"] > .arrow::before, -.bs-popover-top > .arrow::before { +.bs-popover-top > .arrow::before, +.bs-popover-auto[x-placement^="top"] > .arrow::before { bottom: 0; border-width: 0.5rem 0.5rem 0; border-top-color: rgba(0, 0, 0, 0.25); } -.bs-popover-auto[x-placement^="top"] > .arrow::after, -.bs-popover-top > .arrow::after { +.bs-popover-top > .arrow::after, +.bs-popover-auto[x-placement^="top"] > .arrow::after { bottom: 1px; border-width: 0.5rem 0.5rem 0; border-top-color: #303030; } -.bs-popover-auto[x-placement^="right"], -.bs-popover-right { + +.bs-popover-right, +.bs-popover-auto[x-placement^="right"] { margin-left: 0.5rem; } -.bs-popover-auto[x-placement^="right"] > .arrow, -.bs-popover-right > .arrow { +.bs-popover-right > .arrow, +.bs-popover-auto[x-placement^="right"] > .arrow { left: calc(-0.5rem - 1px); width: 0.5rem; height: 1rem; margin: 0.3rem 0; } -.bs-popover-auto[x-placement^="right"] > .arrow::before, -.bs-popover-right > .arrow::before { +.bs-popover-right > .arrow::before, +.bs-popover-auto[x-placement^="right"] > .arrow::before { left: 0; border-width: 0.5rem 0.5rem 0.5rem 0; border-right-color: rgba(0, 0, 0, 0.25); } -.bs-popover-auto[x-placement^="right"] > .arrow::after, -.bs-popover-right > .arrow::after { +.bs-popover-right > .arrow::after, +.bs-popover-auto[x-placement^="right"] > .arrow::after { left: 1px; border-width: 0.5rem 0.5rem 0.5rem 0; border-right-color: #303030; } -.bs-popover-auto[x-placement^="bottom"], -.bs-popover-bottom { + +.bs-popover-bottom, +.bs-popover-auto[x-placement^="bottom"] { margin-top: 0.5rem; } -.bs-popover-auto[x-placement^="bottom"] > .arrow, -.bs-popover-bottom > .arrow { +.bs-popover-bottom > .arrow, +.bs-popover-auto[x-placement^="bottom"] > .arrow { top: calc(-0.5rem - 1px); } -.bs-popover-auto[x-placement^="bottom"] > .arrow::before, -.bs-popover-bottom > .arrow::before { +.bs-popover-bottom > .arrow::before, +.bs-popover-auto[x-placement^="bottom"] > .arrow::before { top: 0; border-width: 0 0.5rem 0.5rem 0.5rem; border-bottom-color: rgba(0, 0, 0, 0.25); } -.bs-popover-auto[x-placement^="bottom"] > .arrow::after, -.bs-popover-bottom > .arrow::after { +.bs-popover-bottom > .arrow::after, +.bs-popover-auto[x-placement^="bottom"] > .arrow::after { top: 1px; border-width: 0 0.5rem 0.5rem 0.5rem; border-bottom-color: #303030; } -.bs-popover-auto[x-placement^="bottom"] .popover-header::before, -.bs-popover-bottom .popover-header::before { +.bs-popover-bottom .popover-header::before, +.bs-popover-auto[x-placement^="bottom"] .popover-header::before { position: absolute; top: 0; left: 50%; @@ -5535,29 +5986,31 @@ a.close.disabled { content: ""; border-bottom: 1px solid #444; } -.bs-popover-auto[x-placement^="left"], -.bs-popover-left { + +.bs-popover-left, +.bs-popover-auto[x-placement^="left"] { margin-right: 0.5rem; } -.bs-popover-auto[x-placement^="left"] > .arrow, -.bs-popover-left > .arrow { +.bs-popover-left > .arrow, +.bs-popover-auto[x-placement^="left"] > .arrow { right: calc(-0.5rem - 1px); width: 0.5rem; height: 1rem; margin: 0.3rem 0; } -.bs-popover-auto[x-placement^="left"] > .arrow::before, -.bs-popover-left > .arrow::before { +.bs-popover-left > .arrow::before, +.bs-popover-auto[x-placement^="left"] > .arrow::before { right: 0; border-width: 0.5rem 0 0.5rem 0.5rem; border-left-color: rgba(0, 0, 0, 0.25); } -.bs-popover-auto[x-placement^="left"] > .arrow::after, -.bs-popover-left > .arrow::after { +.bs-popover-left > .arrow::after, +.bs-popover-auto[x-placement^="left"] > .arrow::after { right: 1px; border-width: 0.5rem 0 0.5rem 0.5rem; border-left-color: #303030; } + .popover-header { padding: 0.5rem 0.75rem; margin-bottom: 0; @@ -5570,16 +6023,20 @@ a.close.disabled { .popover-header:empty { display: none; } + .popover-body { padding: 0.5rem 0.75rem; color: #dee2e6; } + .carousel { position: relative; } + .carousel.pointer-event { touch-action: pan-y; } + .carousel-inner { position: relative; width: 100%; @@ -5590,6 +6047,7 @@ a.close.disabled { clear: both; content: ""; } + .carousel-item { position: relative; display: none; @@ -5604,27 +6062,31 @@ a.close.disabled { transition: none; } } + +.carousel-item.active, .carousel-item-next, -.carousel-item-prev, -.carousel-item.active { +.carousel-item-prev { display: block; } -.active.carousel-item-right, -.carousel-item-next:not(.carousel-item-left) { + +.carousel-item-next:not(.carousel-item-left), +.active.carousel-item-right { transform: translateX(100%); } -.active.carousel-item-left, -.carousel-item-prev:not(.carousel-item-right) { + +.carousel-item-prev:not(.carousel-item-right), +.active.carousel-item-left { transform: translateX(-100%); } + .carousel-fade .carousel-item { opacity: 0; transition-property: opacity; transform: none; } +.carousel-fade .carousel-item.active, .carousel-fade .carousel-item-next.carousel-item-left, -.carousel-fade .carousel-item-prev.carousel-item-right, -.carousel-fade .carousel-item.active { +.carousel-fade .carousel-item-prev.carousel-item-right { z-index: 1; opacity: 1; } @@ -5640,8 +6102,9 @@ a.close.disabled { transition: none; } } -.carousel-control-next, -.carousel-control-prev { + +.carousel-control-prev, +.carousel-control-next { position: absolute; top: 0; bottom: 0; @@ -5650,45 +6113,54 @@ a.close.disabled { align-items: center; justify-content: center; width: 15%; + padding: 0; color: #fff; text-align: center; + background: none; + border: 0; opacity: 0.5; transition: opacity 0.15s ease; } @media (prefers-reduced-motion: reduce) { - .carousel-control-next, - .carousel-control-prev { + .carousel-control-prev, + .carousel-control-next { transition: none; } } -.carousel-control-next:focus, -.carousel-control-next:hover, +.carousel-control-prev:hover, .carousel-control-prev:focus, -.carousel-control-prev:hover { +.carousel-control-next:hover, +.carousel-control-next:focus { color: #fff; text-decoration: none; outline: 0; opacity: 0.9; } + .carousel-control-prev { left: 0; } + .carousel-control-next { right: 0; } -.carousel-control-next-icon, -.carousel-control-prev-icon { + +.carousel-control-prev-icon, +.carousel-control-next-icon { display: inline-block; width: 20px; height: 20px; - background: no-repeat 50%/100% 100%; + background: 50%/100% 100% no-repeat; } + .carousel-control-prev-icon { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath d='M5.25 0l-4 4 4 4 1.5-1.5L4.25 4l2.5-2.5L5.25 0z'/%3e%3c/svg%3e"); } + .carousel-control-next-icon { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath d='M2.75 0l-1.5 1.5L3.75 4l-2.5 2.5L2.75 8l4-4-4-4z'/%3e%3c/svg%3e"); } + .carousel-indicators { position: absolute; right: 0; @@ -5726,6 +6198,7 @@ a.close.disabled { .carousel-indicators .active { opacity: 1; } + .carousel-caption { position: absolute; right: 15%; @@ -5737,6 +6210,7 @@ a.close.disabled { color: #fff; text-align: center; } + @keyframes spinner-border { to { transform: rotate(360deg); @@ -5746,17 +6220,19 @@ a.close.disabled { display: inline-block; width: 2rem; height: 2rem; - vertical-align: text-bottom; - border: 0.25em solid currentColor; + vertical-align: -0.125em; + border: 0.25em solid currentcolor; border-right-color: transparent; border-radius: 50%; - animation: spinner-border 0.75s linear infinite; + animation: 0.75s linear infinite spinner-border; } + .spinner-border-sm { width: 1rem; height: 1rem; border-width: 0.2em; } + @keyframes spinner-grow { 0% { transform: scale(0); @@ -5770,235 +6246,306 @@ a.close.disabled { display: inline-block; width: 2rem; height: 2rem; - vertical-align: text-bottom; - background-color: currentColor; + vertical-align: -0.125em; + background-color: currentcolor; border-radius: 50%; opacity: 0; - animation: spinner-grow 0.75s linear infinite; + animation: 0.75s linear infinite spinner-grow; } + .spinner-grow-sm { width: 1rem; height: 1rem; } + +@media (prefers-reduced-motion: reduce) { + .spinner-border, + .spinner-grow { + animation-duration: 1.5s; + } +} .align-baseline { vertical-align: baseline !important; } + .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; } + .bg-primary { background-color: #375a7f !important; } -a.bg-primary:focus, + a.bg-primary:hover, -button.bg-primary:focus, -button.bg-primary:hover { +a.bg-primary:focus, +button.bg-primary:hover, +button.bg-primary:focus { background-color: #28415b !important; } + .bg-secondary { background-color: #444 !important; } -a.bg-secondary:focus, + a.bg-secondary:hover, -button.bg-secondary:focus, -button.bg-secondary:hover { +a.bg-secondary:focus, +button.bg-secondary:hover, +button.bg-secondary:focus { background-color: #2b2b2b !important; } + .bg-success { background-color: #00bc8c !important; } -a.bg-success:focus, + a.bg-success:hover, -button.bg-success:focus, -button.bg-success:hover { +a.bg-success:focus, +button.bg-success:hover, +button.bg-success:focus { background-color: #008966 !important; } + .bg-info { background-color: #3498db !important; } -a.bg-info:focus, + a.bg-info:hover, -button.bg-info:focus, -button.bg-info:hover { +a.bg-info:focus, +button.bg-info:hover, +button.bg-info:focus { background-color: #217dbb !important; } + .bg-warning { background-color: #f39c12 !important; } -a.bg-warning:focus, + a.bg-warning:hover, -button.bg-warning:focus, -button.bg-warning:hover { +a.bg-warning:focus, +button.bg-warning:hover, +button.bg-warning:focus { background-color: #c87f0a !important; } + .bg-danger { background-color: #e74c3c !important; } -a.bg-danger:focus, + a.bg-danger:hover, -button.bg-danger:focus, -button.bg-danger:hover { +a.bg-danger:focus, +button.bg-danger:hover, +button.bg-danger:focus { background-color: #d62c1a !important; } + .bg-light { background-color: #303030 !important; } -a.bg-light:focus, + a.bg-light:hover, -button.bg-light:focus, -button.bg-light:hover { +a.bg-light:focus, +button.bg-light:hover, +button.bg-light:focus { background-color: #171717 !important; } + .bg-dark { background-color: #dee2e6 !important; } -a.bg-dark:focus, + a.bg-dark:hover, -button.bg-dark:focus, -button.bg-dark:hover { +a.bg-dark:focus, +button.bg-dark:hover, +button.bg-dark:focus { background-color: #c1c9d0 !important; } + .bg-white { background-color: #fff !important; } + .bg-transparent { background-color: transparent !important; } + .border { border: 1px solid #dee2e6 !important; } + .border-top { border-top: 1px solid #dee2e6 !important; } + .border-right { border-right: 1px solid #dee2e6 !important; } + .border-bottom { border-bottom: 1px solid #dee2e6 !important; } + .border-left { border-left: 1px solid #dee2e6 !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; } + .border-primary { border-color: #375a7f !important; } + .border-secondary { border-color: #444 !important; } + .border-success { border-color: #00bc8c !important; } + .border-info { border-color: #3498db !important; } + .border-warning { border-color: #f39c12 !important; } + .border-danger { border-color: #e74c3c !important; } + .border-light { border-color: #303030 !important; } + .border-dark { border-color: #dee2e6 !important; } + .border-white { border-color: #fff !important; } + .rounded-sm { border-radius: 0.2rem !important; } + .rounded { border-radius: 0.25rem !important; } + .rounded-top { border-top-left-radius: 0.25rem !important; border-top-right-radius: 0.25rem !important; } + .rounded-right { border-top-right-radius: 0.25rem !important; border-bottom-right-radius: 0.25rem !important; } + .rounded-bottom { border-bottom-right-radius: 0.25rem !important; border-bottom-left-radius: 0.25rem !important; } + .rounded-left { border-top-left-radius: 0.25rem !important; border-bottom-left-radius: 0.25rem !important; } + .rounded-lg { border-radius: 0.3rem !important; } + .rounded-circle { border-radius: 50% !important; } + .rounded-pill { border-radius: 50rem !important; } + .rounded-0 { border-radius: 0 !important; } + .clearfix::after { display: block; clear: both; content: ""; } + .d-none { display: none !important; } + .d-inline { display: inline !important; } + .d-inline-block { display: inline-block !important; } + .d-block { display: block !important; } + .d-table { display: table !important; } + .d-table-row { display: table-row !important; } + .d-table-cell { display: table-cell !important; } + .d-flex { display: flex !important; } + .d-inline-flex { display: inline-flex !important; } + @media (min-width: 576px) { .d-sm-none { display: none !important; @@ -6156,8 +6703,8 @@ button.bg-dark:hover { content: ""; } .embed-responsive .embed-responsive-item, -.embed-responsive embed, .embed-responsive iframe, +.embed-responsive embed, .embed-responsive object, .embed-responsive video { position: absolute; @@ -6168,120 +6715,159 @@ button.bg-dark:hover { height: 100%; border: 0; } + .embed-responsive-21by9::before { - padding-top: 42.85714%; + padding-top: 42.85714286%; } + .embed-responsive-16by9::before { padding-top: 56.25%; } + .embed-responsive-4by3::before { padding-top: 75%; } + .embed-responsive-1by1::before { padding-top: 100%; } + .flex-row { flex-direction: row !important; } + .flex-column { flex-direction: column !important; } + .flex-row-reverse { flex-direction: row-reverse !important; } + .flex-column-reverse { flex-direction: column-reverse !important; } + .flex-wrap { flex-wrap: wrap !important; } + .flex-nowrap { flex-wrap: nowrap !important; } + .flex-wrap-reverse { flex-wrap: wrap-reverse !important; } + .flex-fill { flex: 1 1 auto !important; } + .flex-grow-0 { flex-grow: 0 !important; } + .flex-grow-1 { flex-grow: 1 !important; } + .flex-shrink-0 { flex-shrink: 0 !important; } + .flex-shrink-1 { flex-shrink: 1 !important; } + .justify-content-start { justify-content: flex-start !important; } + .justify-content-end { justify-content: flex-end !important; } + .justify-content-center { justify-content: center !important; } + .justify-content-between { justify-content: space-between !important; } + .justify-content-around { justify-content: space-around !important; } + .align-items-start { align-items: flex-start !important; } + .align-items-end { align-items: flex-end !important; } + .align-items-center { align-items: center !important; } + .align-items-baseline { align-items: baseline !important; } + .align-items-stretch { align-items: stretch !important; } + .align-content-start { align-content: flex-start !important; } + .align-content-end { align-content: flex-end !important; } + .align-content-center { align-content: center !important; } + .align-content-between { align-content: space-between !important; } + .align-content-around { align-content: space-around !important; } + .align-content-stretch { align-content: stretch !important; } + .align-self-auto { align-self: auto !important; } + .align-self-start { align-self: flex-start !important; } + .align-self-end { align-self: flex-end !important; } + .align-self-center { align-self: center !important; } + .align-self-baseline { align-self: baseline !important; } + .align-self-stretch { align-self: stretch !important; } + @media (min-width: 576px) { .flex-sm-row { flex-direction: row !important; @@ -6701,12 +7287,15 @@ button.bg-dark:hover { .float-left { float: left !important; } + .float-right { float: right !important; } + .float-none { float: none !important; } + @media (min-width: 576px) { .float-sm-left { float: left !important; @@ -6754,33 +7343,43 @@ button.bg-dark:hover { .user-select-all { user-select: all !important; } + .user-select-auto { user-select: auto !important; } + .user-select-none { user-select: none !important; } + .overflow-auto { overflow: auto !important; } + .overflow-hidden { overflow: hidden !important; } + .position-static { position: static !important; } + .position-relative { position: relative !important; } + .position-absolute { position: absolute !important; } + .position-fixed { position: fixed !important; } + .position-sticky { position: sticky !important; } + .fixed-top { position: fixed; top: 0; @@ -6788,6 +7387,7 @@ button.bg-dark:hover { left: 0; z-index: 1030; } + .fixed-bottom { position: fixed; right: 0; @@ -6795,6 +7395,7 @@ button.bg-dark:hover { left: 0; z-index: 1030; } + @supports (position: sticky) { .sticky-top { position: sticky; @@ -6802,6 +7403,7 @@ button.bg-dark:hover { z-index: 1020; } } + .sr-only { position: absolute; width: 1px; @@ -6813,6 +7415,7 @@ button.bg-dark:hover { white-space: nowrap; border: 0; } + .sr-only-focusable:active, .sr-only-focusable:focus { position: static; @@ -6822,408 +7425,519 @@ button.bg-dark:hover { clip: auto; white-space: normal; } + .shadow-sm { box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075) !important; } + .shadow { box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important; } + .shadow-lg { box-shadow: 0 1rem 3rem rgba(0, 0, 0, 0.175) !important; } + .shadow-none { box-shadow: none !important; } + .w-25 { width: 25% !important; } + .w-50 { width: 50% !important; } + .w-75 { width: 75% !important; } + .w-100 { width: 100% !important; } + .w-auto { width: auto !important; } + .h-25 { height: 25% !important; } + .h-50 { height: 50% !important; } + .h-75 { height: 75% !important; } + .h-100 { height: 100% !important; } + .h-auto { height: auto !important; } + .mw-100 { max-width: 100% !important; } + .mh-100 { max-height: 100% !important; } + .min-vw-100 { min-width: 100vw !important; } + .min-vh-100 { min-height: 100vh !important; } + .vw-100 { width: 100vw !important; } + .vh-100 { height: 100vh !important; } + .m-0 { margin: 0 !important; } + .mt-0, .my-0 { margin-top: 0 !important; } + .mr-0, .mx-0 { margin-right: 0 !important; } + .mb-0, .my-0 { margin-bottom: 0 !important; } + .ml-0, .mx-0 { margin-left: 0 !important; } + .m-1 { margin: 0.25rem !important; } + .mt-1, .my-1 { margin-top: 0.25rem !important; } + .mr-1, .mx-1 { margin-right: 0.25rem !important; } + .mb-1, .my-1 { margin-bottom: 0.25rem !important; } + .ml-1, .mx-1 { margin-left: 0.25rem !important; } + .m-2 { margin: 0.5rem !important; } + .mt-2, .my-2 { margin-top: 0.5rem !important; } + .mr-2, .mx-2 { margin-right: 0.5rem !important; } + .mb-2, .my-2 { margin-bottom: 0.5rem !important; } + .ml-2, .mx-2 { margin-left: 0.5rem !important; } + .m-3 { margin: 1rem !important; } + .mt-3, .my-3 { margin-top: 1rem !important; } + .mr-3, .mx-3 { margin-right: 1rem !important; } + .mb-3, .my-3 { margin-bottom: 1rem !important; } + .ml-3, .mx-3 { margin-left: 1rem !important; } + .m-4 { margin: 1.5rem !important; } + .mt-4, .my-4 { margin-top: 1.5rem !important; } + .mr-4, .mx-4 { margin-right: 1.5rem !important; } + .mb-4, .my-4 { margin-bottom: 1.5rem !important; } + .ml-4, .mx-4 { margin-left: 1.5rem !important; } + .m-5 { margin: 3rem !important; } + .mt-5, .my-5 { margin-top: 3rem !important; } + .mr-5, .mx-5 { margin-right: 3rem !important; } + .mb-5, .my-5 { margin-bottom: 3rem !important; } + .ml-5, .mx-5 { margin-left: 3rem !important; } + .p-0 { padding: 0 !important; } + .pt-0, .py-0 { padding-top: 0 !important; } + .pr-0, .px-0 { padding-right: 0 !important; } + .pb-0, .py-0 { padding-bottom: 0 !important; } + .pl-0, .px-0 { padding-left: 0 !important; } + .p-1 { padding: 0.25rem !important; } + .pt-1, .py-1 { padding-top: 0.25rem !important; } + .pr-1, .px-1 { padding-right: 0.25rem !important; } + .pb-1, .py-1 { padding-bottom: 0.25rem !important; } + .pl-1, .px-1 { padding-left: 0.25rem !important; } + .p-2 { padding: 0.5rem !important; } + .pt-2, .py-2 { padding-top: 0.5rem !important; } + .pr-2, .px-2 { padding-right: 0.5rem !important; } + .pb-2, .py-2 { padding-bottom: 0.5rem !important; } + .pl-2, .px-2 { padding-left: 0.5rem !important; } + .p-3 { padding: 1rem !important; } + .pt-3, .py-3 { padding-top: 1rem !important; } + .pr-3, .px-3 { padding-right: 1rem !important; } + .pb-3, .py-3 { padding-bottom: 1rem !important; } + .pl-3, .px-3 { padding-left: 1rem !important; } + .p-4 { padding: 1.5rem !important; } + .pt-4, .py-4 { padding-top: 1.5rem !important; } + .pr-4, .px-4 { padding-right: 1.5rem !important; } + .pb-4, .py-4 { padding-bottom: 1.5rem !important; } + .pl-4, .px-4 { padding-left: 1.5rem !important; } + .p-5 { padding: 3rem !important; } + .pt-5, .py-5 { padding-top: 3rem !important; } + .pr-5, .px-5 { padding-right: 3rem !important; } + .pb-5, .py-5 { padding-bottom: 3rem !important; } + .pl-5, .px-5 { padding-left: 3rem !important; } + .m-n1 { margin: -0.25rem !important; } + .mt-n1, .my-n1 { margin-top: -0.25rem !important; } + .mr-n1, .mx-n1 { margin-right: -0.25rem !important; } + .mb-n1, .my-n1 { margin-bottom: -0.25rem !important; } + .ml-n1, .mx-n1 { margin-left: -0.25rem !important; } + .m-n2 { margin: -0.5rem !important; } + .mt-n2, .my-n2 { margin-top: -0.5rem !important; } + .mr-n2, .mx-n2 { margin-right: -0.5rem !important; } + .mb-n2, .my-n2 { margin-bottom: -0.5rem !important; } + .ml-n2, .mx-n2 { margin-left: -0.5rem !important; } + .m-n3 { margin: -1rem !important; } + .mt-n3, .my-n3 { margin-top: -1rem !important; } + .mr-n3, .mx-n3 { margin-right: -1rem !important; } + .mb-n3, .my-n3 { margin-bottom: -1rem !important; } + .ml-n3, .mx-n3 { margin-left: -1rem !important; } + .m-n4 { margin: -1.5rem !important; } + .mt-n4, .my-n4 { margin-top: -1.5rem !important; } + .mr-n4, .mx-n4 { margin-right: -1.5rem !important; } + .mb-n4, .my-n4 { margin-bottom: -1.5rem !important; } + .ml-n4, .mx-n4 { margin-left: -1.5rem !important; } + .m-n5 { margin: -3rem !important; } + .mt-n5, .my-n5 { margin-top: -3rem !important; } + .mr-n5, .mx-n5 { margin-right: -3rem !important; } + .mb-n5, .my-n5 { margin-bottom: -3rem !important; } + .ml-n5, .mx-n5 { margin-left: -3rem !important; } + .m-auto { margin: auto !important; } + .mt-auto, .my-auto { margin-top: auto !important; } + .mr-auto, .mx-auto { margin-right: auto !important; } + .mb-auto, .my-auto { margin-bottom: auto !important; } + .ml-auto, .mx-auto { margin-left: auto !important; } + @media (min-width: 576px) { .m-sm-0 { margin: 0 !important; @@ -8611,33 +9325,42 @@ button.bg-dark:hover { content: ""; background-color: rgba(0, 0, 0, 0); } + .text-monospace { font-family: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace !important; } + .text-justify { text-align: justify !important; } + .text-wrap { white-space: normal !important; } + .text-nowrap { white-space: nowrap !important; } + .text-truncate { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } + .text-left { text-align: left !important; } + .text-right { text-align: right !important; } + .text-center { text-align: center !important; } + @media (min-width: 576px) { .text-sm-left { text-align: left !important; @@ -8685,101 +9408,131 @@ button.bg-dark:hover { .text-lowercase { text-transform: lowercase !important; } + .text-uppercase { text-transform: uppercase !important; } + .text-capitalize { text-transform: capitalize !important; } + .font-weight-light { font-weight: 300 !important; } + .font-weight-lighter { font-weight: lighter !important; } + .font-weight-normal { font-weight: 400 !important; } + .font-weight-bold { font-weight: 700 !important; } + .font-weight-bolder { font-weight: bolder !important; } + .font-italic { font-style: italic !important; } + .text-white { color: #fff !important; } + .text-primary { color: #375a7f !important; } -a.text-primary:focus, -a.text-primary:hover { + +a.text-primary:hover, +a.text-primary:focus { color: #20344a !important; } + .text-secondary { color: #444 !important; } -a.text-secondary:focus, -a.text-secondary:hover { + +a.text-secondary:hover, +a.text-secondary:focus { color: #1e1e1e !important; } + .text-success { color: #00bc8c !important; } -a.text-success:focus, -a.text-success:hover { + +a.text-success:hover, +a.text-success:focus { color: #007053 !important; } + .text-info { color: #3498db !important; } -a.text-info:focus, -a.text-info:hover { + +a.text-info:hover, +a.text-info:focus { color: #1d6fa5 !important; } + .text-warning { color: #f39c12 !important; } -a.text-warning:focus, -a.text-warning:hover { + +a.text-warning:hover, +a.text-warning:focus { color: #b06f09 !important; } + .text-danger { color: #e74c3c !important; } -a.text-danger:focus, -a.text-danger:hover { + +a.text-danger:hover, +a.text-danger:focus { color: #bf2718 !important; } + .text-light { color: #303030 !important; } -a.text-light:focus, -a.text-light:hover { + +a.text-light:hover, +a.text-light:focus { color: #0a0a0a !important; } + .text-dark { color: #dee2e6 !important; } -a.text-dark:focus, -a.text-dark:hover { + +a.text-dark:hover, +a.text-dark:focus { color: #b2bcc5 !important; } + .text-body { color: #dee2e6 !important; } + .text-muted { color: #888 !important; } + .text-black-50 { color: rgba(0, 0, 0, 0.5) !important; } + .text-white-50 { color: rgba(255, 255, 255, 0.5) !important; } + .text-hide { font: 0/0 a; color: transparent; @@ -8787,25 +9540,32 @@ a.text-dark:hover { background-color: transparent; border: 0; } + .text-decoration-none { text-decoration: none !important; } + .text-break { + word-break: break-word !important; word-wrap: break-word !important; } + .text-reset { color: inherit !important; } + .visible { visibility: visible !important; } + .invisible { visibility: hidden !important; } + @media print { *, - ::after, - ::before { + *::before, + *::after { text-shadow: none !important; box-shadow: none !important; } @@ -8818,21 +9578,18 @@ a.text-dark:hover { pre { white-space: pre-wrap !important; } - blockquote, - pre { + pre, + blockquote { border: 1px solid #adb5bd; page-break-inside: avoid; } - thead { - display: table-header-group; - } - img, - tr { + tr, + img { page-break-inside: avoid; } + p, h2, - h3, - p { + h3 { orphans: 3; widows: 3; } @@ -8862,17 +9619,17 @@ a.text-dark:hover { .table th { background-color: #fff !important; } - .table-bordered td, - .table-bordered th { + .table-bordered th, + .table-bordered td { border: 1px solid #dee2e6 !important; } .table-dark { color: inherit; } - .table-dark tbody + tbody, - .table-dark td, .table-dark th, - .table-dark thead th { + .table-dark td, + .table-dark thead th, + .table-dark tbody + tbody { border-color: #444; } .table .thead-dark th { @@ -8880,3 +9637,5 @@ a.text-dark:hover { border-color: #444; } } + +/*# sourceMappingURL=darkly-red.css.map */ diff --git a/src/assets/css/themes/darkly-red.scss b/src/assets/css/themes/darkly-red.scss new file mode 100644 index 00000000..f6dfb3df --- /dev/null +++ b/src/assets/css/themes/darkly-red.scss @@ -0,0 +1,2 @@ +@import "variables.darkly-red"; +@import "../../../../node_modules/bootstrap-v4/scss/bootstrap"; diff --git a/src/assets/css/themes/darkly.css b/src/assets/css/themes/darkly.css index 49399db2..25c71c2f 100644 --- a/src/assets/css/themes/darkly.css +++ b/src/assets/css/themes/darkly.css @@ -1,3 +1,10 @@ +@charset "UTF-8"; +/*! + * Bootstrap v4.6.2 (https://getbootstrap.com/) + * Copyright 2011-2022 The Bootstrap Authors + * Copyright 2011-2022 Twitter, Inc. + * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE) + */ :root { --blue: #375a7f; --indigo: #6610f2; @@ -27,22 +34,25 @@ --breakpoint-lg: 992px; --breakpoint-xl: 1200px; --font-family-sans-serif: "Lato", -apple-system, BlinkMacSystemFont, - "Segoe UI", Roboto, "Helvetica Neue", Cantarell, Arial, sans-serif, - "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; + "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", + "Segoe UI Emoji", "Segoe UI Symbol"; --font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; } + *, -::after, -::before { +*::before, +*::after { box-sizing: border-box; } + html { font-family: sans-serif; line-height: 1.15; -webkit-text-size-adjust: 100%; - -webkit-tap-highlight-color: transparent; + -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } + article, aside, figcaption, @@ -55,9 +65,10 @@ nav, section { display: block; } + body { margin: 0; - font-family: Lato, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, + font-family: "Lato", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; font-size: 0.9375rem; @@ -67,14 +78,17 @@ body { text-align: left; background-color: #222; } + [tabindex="-1"]:focus:not(:focus-visible) { outline: 0 !important; } + hr { box-sizing: content-box; height: 0; overflow: visible; } + h1, h2, h3, @@ -84,52 +98,63 @@ h6 { margin-top: 0; margin-bottom: 0.5rem; } + p { margin-top: 0; margin-bottom: 1rem; } -abbr[data-original-title], -abbr[title] { + +abbr[title], +abbr[data-original-title] { text-decoration: underline; text-decoration: underline dotted; cursor: help; border-bottom: 0; text-decoration-skip-ink: none; } + address { margin-bottom: 1rem; font-style: normal; line-height: inherit; } -dl, + ol, -ul { +ul, +dl { margin-top: 0; margin-bottom: 1rem; } + ol ol, +ul ul, ol ul, -ul ol, -ul ul { +ul ol { margin-bottom: 0; } + dt { font-weight: 700; } + dd { margin-bottom: 0.5rem; margin-left: 0; } + blockquote { margin: 0 0 1rem; } + b, strong { font-weight: bolder; } + small { font-size: 80%; } + sub, sup { position: relative; @@ -137,12 +162,15 @@ sup { line-height: 0; vertical-align: baseline; } + sub { bottom: -0.25em; } + sup { top: -0.5em; } + a { color: #00bc8c; text-decoration: none; @@ -152,42 +180,50 @@ a:hover { color: #007053; text-decoration: underline; } -a:not([href]) { + +a:not([href]):not([class]) { color: inherit; text-decoration: none; } -a:not([href]):hover { +a:not([href]):not([class]):hover { color: inherit; text-decoration: none; } + +pre, code, kbd, -pre, samp { font-family: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; font-size: 1em; } + pre { margin-top: 0; margin-bottom: 1rem; overflow: auto; -ms-overflow-style: scrollbar; } + figure { margin: 0 0 1rem; } + img { vertical-align: middle; border-style: none; } + svg { overflow: hidden; vertical-align: middle; } + table { border-collapse: collapse; } + caption { padding-top: 0.75rem; padding-bottom: 0.75rem; @@ -195,78 +231,94 @@ caption { text-align: left; caption-side: bottom; } + th { text-align: inherit; + text-align: -webkit-match-parent; } + label { display: inline-block; margin-bottom: 0.5rem; } + button { border-radius: 0; } -button:focus { - outline: 1px dotted; - outline: 5px auto -webkit-focus-ring-color; + +button:focus:not(:focus-visible) { + outline: 0; } -button, + input, -optgroup, +button, select, +optgroup, textarea { margin: 0; font-family: inherit; font-size: inherit; line-height: inherit; } + button, input { overflow: visible; } + button, select { text-transform: none; } + [role="button"] { cursor: pointer; } + select { word-wrap: normal; } + +button, [type="button"], [type="reset"], -[type="submit"], -button { +[type="submit"] { -webkit-appearance: button; } + +button:not(:disabled), [type="button"]:not(:disabled), [type="reset"]:not(:disabled), -[type="submit"]:not(:disabled), -button:not(:disabled) { +[type="submit"]:not(:disabled) { cursor: pointer; } + +button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, -[type="submit"]::-moz-focus-inner, -button::-moz-focus-inner { +[type="submit"]::-moz-focus-inner { padding: 0; border-style: none; } -input[type="checkbox"], -input[type="radio"] { + +input[type="radio"], +input[type="checkbox"] { box-sizing: border-box; padding: 0; } + textarea { overflow: auto; resize: vertical; } + fieldset { min-width: 0; padding: 0; margin: 0; border: 0; } + legend { display: block; width: 100%; @@ -278,151 +330,183 @@ legend { color: inherit; white-space: normal; } + progress { vertical-align: baseline; } + [type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button { height: auto; } + [type="search"] { outline-offset: -2px; -webkit-appearance: none; } + [type="search"]::-webkit-search-decoration { -webkit-appearance: none; } + ::-webkit-file-upload-button { font: inherit; -webkit-appearance: button; } + output { display: inline-block; } + summary { display: list-item; cursor: pointer; } + template { display: none; } + [hidden] { display: none !important; } -.h1, -.h2, -.h3, -.h4, -.h5, -.h6, + h1, h2, h3, h4, h5, -h6 { +h6, +.h1, +.h2, +.h3, +.h4, +.h5, +.h6 { margin-bottom: 0.5rem; font-weight: 500; line-height: 1.2; } -.h1, -h1 { + +h1, +.h1 { font-size: 3rem; } -.h2, -h2 { + +h2, +.h2 { font-size: 2.5rem; } -.h3, -h3 { + +h3, +.h3 { font-size: 2rem; } -.h4, -h4 { + +h4, +.h4 { font-size: 1.40625rem; } -.h5, -h5 { - font-size: 1.17188rem; + +h5, +.h5 { + font-size: 1.171875rem; } -.h6, -h6 { + +h6, +.h6 { font-size: 0.9375rem; } + .lead { - font-size: 1.17188rem; + font-size: 1.171875rem; font-weight: 300; } + .display-1 { font-size: 6rem; font-weight: 300; line-height: 1.2; } + .display-2 { font-size: 5.5rem; font-weight: 300; line-height: 1.2; } + .display-3 { font-size: 4.5rem; font-weight: 300; line-height: 1.2; } + .display-4 { font-size: 3.5rem; font-weight: 300; line-height: 1.2; } + hr { margin-top: 1rem; margin-bottom: 1rem; border: 0; border-top: 1px solid rgba(0, 0, 0, 0.1); } -.small, -small { - font-size: 80%; + +small, +.small { + font-size: 0.875em; font-weight: 400; } -.mark, -mark { + +mark, +.mark { padding: 0.2em; background-color: #333; } + .list-unstyled { padding-left: 0; list-style: none; } + .list-inline { padding-left: 0; list-style: none; } + .list-inline-item { display: inline-block; } .list-inline-item:not(:last-child) { margin-right: 0.5rem; } + .initialism { font-size: 90%; text-transform: uppercase; } + .blockquote { margin-bottom: 1rem; - font-size: 1.17188rem; + font-size: 1.171875rem; } + .blockquote-footer { display: block; - font-size: 80%; + font-size: 0.875em; color: #888; } .blockquote-footer::before { - content: "\2014\00A0"; + content: "— "; } + .img-fluid { max-width: 100%; height: auto; } + .img-thumbnail { padding: 0.25rem; background-color: #222; @@ -431,17 +515,21 @@ mark { max-width: 100%; height: auto; } + .figure { display: inline-block; } + .figure-img { margin-bottom: 0.5rem; line-height: 1; } + .figure-caption { font-size: 90%; color: #888; } + code { font-size: 87.5%; color: #e83e8c; @@ -450,6 +538,7 @@ code { a > code { color: inherit; } + kbd { padding: 0.2rem 0.4rem; font-size: 87.5%; @@ -462,6 +551,7 @@ kbd kbd { font-size: 100%; font-weight: 700; } + pre { display: block; font-size: 87.5%; @@ -472,75 +562,52 @@ pre code { color: inherit; word-break: normal; } + .pre-scrollable { max-height: 340px; overflow-y: scroll; } -.container { - width: 100%; - padding-right: 15px; - padding-left: 15px; - margin-right: auto; - margin-left: auto; -} -@media (min-width: 576px) { - .container { - max-width: 540px; - } -} -@media (min-width: 768px) { - .container { - max-width: 720px; - } -} -@media (min-width: 992px) { - .container { - max-width: 960px; - } -} -@media (min-width: 1200px) { - .container { - max-width: 1140px; - } -} + +.container, .container-fluid, +.container-xl, .container-lg, .container-md, -.container-sm, -.container-xl { +.container-sm { width: 100%; padding-right: 15px; padding-left: 15px; margin-right: auto; margin-left: auto; } + @media (min-width: 576px) { - .container, - .container-sm { + .container-sm, + .container { max-width: 540px; } } @media (min-width: 768px) { - .container, .container-md, - .container-sm { + .container-sm, + .container { max-width: 720px; } } @media (min-width: 992px) { - .container, - .container-lg, - .container-md, - .container-sm { - max-width: 960px; - } -} -@media (min-width: 1200px) { - .container, .container-lg, .container-md, .container-sm, - .container-xl { + .container { + max-width: 960px; + } +} +@media (min-width: 1200px) { + .container-xl, + .container-lg, + .container-md, + .container-sm, + .container { max-width: 1140px; } } @@ -550,6 +617,7 @@ pre code { margin-right: -15px; margin-left: -15px; } + .no-gutters { margin-right: 0; margin-left: 0; @@ -559,247 +627,293 @@ pre code { padding-right: 0; padding-left: 0; } -.col, -.col-1, -.col-10, -.col-11, -.col-12, -.col-2, -.col-3, -.col-4, -.col-5, -.col-6, -.col-7, -.col-8, -.col-9, -.col-auto, -.col-lg, -.col-lg-1, -.col-lg-10, -.col-lg-11, -.col-lg-12, -.col-lg-2, -.col-lg-3, -.col-lg-4, -.col-lg-5, -.col-lg-6, -.col-lg-7, -.col-lg-8, -.col-lg-9, -.col-lg-auto, -.col-md, -.col-md-1, -.col-md-10, -.col-md-11, -.col-md-12, -.col-md-2, -.col-md-3, -.col-md-4, -.col-md-5, -.col-md-6, -.col-md-7, -.col-md-8, -.col-md-9, -.col-md-auto, -.col-sm, -.col-sm-1, -.col-sm-10, -.col-sm-11, -.col-sm-12, -.col-sm-2, -.col-sm-3, -.col-sm-4, -.col-sm-5, -.col-sm-6, -.col-sm-7, -.col-sm-8, -.col-sm-9, -.col-sm-auto, + .col-xl, -.col-xl-1, -.col-xl-10, -.col-xl-11, +.col-xl-auto, .col-xl-12, -.col-xl-2, -.col-xl-3, -.col-xl-4, -.col-xl-5, -.col-xl-6, -.col-xl-7, -.col-xl-8, +.col-xl-11, +.col-xl-10, .col-xl-9, -.col-xl-auto { +.col-xl-8, +.col-xl-7, +.col-xl-6, +.col-xl-5, +.col-xl-4, +.col-xl-3, +.col-xl-2, +.col-xl-1, +.col-lg, +.col-lg-auto, +.col-lg-12, +.col-lg-11, +.col-lg-10, +.col-lg-9, +.col-lg-8, +.col-lg-7, +.col-lg-6, +.col-lg-5, +.col-lg-4, +.col-lg-3, +.col-lg-2, +.col-lg-1, +.col-md, +.col-md-auto, +.col-md-12, +.col-md-11, +.col-md-10, +.col-md-9, +.col-md-8, +.col-md-7, +.col-md-6, +.col-md-5, +.col-md-4, +.col-md-3, +.col-md-2, +.col-md-1, +.col-sm, +.col-sm-auto, +.col-sm-12, +.col-sm-11, +.col-sm-10, +.col-sm-9, +.col-sm-8, +.col-sm-7, +.col-sm-6, +.col-sm-5, +.col-sm-4, +.col-sm-3, +.col-sm-2, +.col-sm-1, +.col, +.col-auto, +.col-12, +.col-11, +.col-10, +.col-9, +.col-8, +.col-7, +.col-6, +.col-5, +.col-4, +.col-3, +.col-2, +.col-1 { position: relative; width: 100%; padding-right: 15px; padding-left: 15px; } + .col { flex-basis: 0; flex-grow: 1; - min-width: 0; max-width: 100%; } + .row-cols-1 > * { flex: 0 0 100%; max-width: 100%; } + .row-cols-2 > * { flex: 0 0 50%; max-width: 50%; } + .row-cols-3 > * { - flex: 0 0 33.33333%; - max-width: 33.33333%; + flex: 0 0 33.3333333333%; + max-width: 33.3333333333%; } + .row-cols-4 > * { flex: 0 0 25%; max-width: 25%; } + .row-cols-5 > * { flex: 0 0 20%; max-width: 20%; } + .row-cols-6 > * { - flex: 0 0 16.66667%; - max-width: 16.66667%; + flex: 0 0 16.6666666667%; + max-width: 16.6666666667%; } + .col-auto { flex: 0 0 auto; width: auto; max-width: 100%; } + .col-1 { - flex: 0 0 8.33333%; - max-width: 8.33333%; + flex: 0 0 8.33333333%; + max-width: 8.33333333%; } + .col-2 { - flex: 0 0 16.66667%; - max-width: 16.66667%; + flex: 0 0 16.66666667%; + max-width: 16.66666667%; } + .col-3 { flex: 0 0 25%; max-width: 25%; } + .col-4 { - flex: 0 0 33.33333%; - max-width: 33.33333%; + flex: 0 0 33.33333333%; + max-width: 33.33333333%; } + .col-5 { - flex: 0 0 41.66667%; - max-width: 41.66667%; + flex: 0 0 41.66666667%; + max-width: 41.66666667%; } + .col-6 { flex: 0 0 50%; max-width: 50%; } + .col-7 { - flex: 0 0 58.33333%; - max-width: 58.33333%; + flex: 0 0 58.33333333%; + max-width: 58.33333333%; } + .col-8 { - flex: 0 0 66.66667%; - max-width: 66.66667%; + flex: 0 0 66.66666667%; + max-width: 66.66666667%; } + .col-9 { flex: 0 0 75%; max-width: 75%; } + .col-10 { - flex: 0 0 83.33333%; - max-width: 83.33333%; + flex: 0 0 83.33333333%; + max-width: 83.33333333%; } + .col-11 { - flex: 0 0 91.66667%; - max-width: 91.66667%; + flex: 0 0 91.66666667%; + max-width: 91.66666667%; } + .col-12 { flex: 0 0 100%; max-width: 100%; } + .order-first { order: -1; } + .order-last { order: 13; } + .order-0 { order: 0; } + .order-1 { order: 1; } + .order-2 { order: 2; } + .order-3 { order: 3; } + .order-4 { order: 4; } + .order-5 { order: 5; } + .order-6 { order: 6; } + .order-7 { order: 7; } + .order-8 { order: 8; } + .order-9 { order: 9; } + .order-10 { order: 10; } + .order-11 { order: 11; } + .order-12 { order: 12; } + .offset-1 { - margin-left: 8.33333%; + margin-left: 8.33333333%; } + .offset-2 { - margin-left: 16.66667%; + margin-left: 16.66666667%; } + .offset-3 { margin-left: 25%; } + .offset-4 { - margin-left: 33.33333%; + margin-left: 33.33333333%; } + .offset-5 { - margin-left: 41.66667%; + margin-left: 41.66666667%; } + .offset-6 { margin-left: 50%; } + .offset-7 { - margin-left: 58.33333%; + margin-left: 58.33333333%; } + .offset-8 { - margin-left: 66.66667%; + margin-left: 66.66666667%; } + .offset-9 { margin-left: 75%; } + .offset-10 { - margin-left: 83.33333%; + margin-left: 83.33333333%; } + .offset-11 { - margin-left: 91.66667%; + margin-left: 91.66666667%; } + @media (min-width: 576px) { .col-sm { flex-basis: 0; flex-grow: 1; - min-width: 0; max-width: 100%; } .row-cols-sm-1 > * { @@ -811,8 +925,8 @@ pre code { max-width: 50%; } .row-cols-sm-3 > * { - flex: 0 0 33.33333%; - max-width: 33.33333%; + flex: 0 0 33.3333333333%; + max-width: 33.3333333333%; } .row-cols-sm-4 > * { flex: 0 0 25%; @@ -823,8 +937,8 @@ pre code { max-width: 20%; } .row-cols-sm-6 > * { - flex: 0 0 16.66667%; - max-width: 16.66667%; + flex: 0 0 16.6666666667%; + max-width: 16.6666666667%; } .col-sm-auto { flex: 0 0 auto; @@ -832,48 +946,48 @@ pre code { max-width: 100%; } .col-sm-1 { - flex: 0 0 8.33333%; - max-width: 8.33333%; + flex: 0 0 8.33333333%; + max-width: 8.33333333%; } .col-sm-2 { - flex: 0 0 16.66667%; - max-width: 16.66667%; + flex: 0 0 16.66666667%; + max-width: 16.66666667%; } .col-sm-3 { flex: 0 0 25%; max-width: 25%; } .col-sm-4 { - flex: 0 0 33.33333%; - max-width: 33.33333%; + flex: 0 0 33.33333333%; + max-width: 33.33333333%; } .col-sm-5 { - flex: 0 0 41.66667%; - max-width: 41.66667%; + flex: 0 0 41.66666667%; + max-width: 41.66666667%; } .col-sm-6 { flex: 0 0 50%; max-width: 50%; } .col-sm-7 { - flex: 0 0 58.33333%; - max-width: 58.33333%; + flex: 0 0 58.33333333%; + max-width: 58.33333333%; } .col-sm-8 { - flex: 0 0 66.66667%; - max-width: 66.66667%; + flex: 0 0 66.66666667%; + max-width: 66.66666667%; } .col-sm-9 { flex: 0 0 75%; max-width: 75%; } .col-sm-10 { - flex: 0 0 83.33333%; - max-width: 83.33333%; + flex: 0 0 83.33333333%; + max-width: 83.33333333%; } .col-sm-11 { - flex: 0 0 91.66667%; - max-width: 91.66667%; + flex: 0 0 91.66666667%; + max-width: 91.66666667%; } .col-sm-12 { flex: 0 0 100%; @@ -928,44 +1042,43 @@ pre code { margin-left: 0; } .offset-sm-1 { - margin-left: 8.33333%; + margin-left: 8.33333333%; } .offset-sm-2 { - margin-left: 16.66667%; + margin-left: 16.66666667%; } .offset-sm-3 { margin-left: 25%; } .offset-sm-4 { - margin-left: 33.33333%; + margin-left: 33.33333333%; } .offset-sm-5 { - margin-left: 41.66667%; + margin-left: 41.66666667%; } .offset-sm-6 { margin-left: 50%; } .offset-sm-7 { - margin-left: 58.33333%; + margin-left: 58.33333333%; } .offset-sm-8 { - margin-left: 66.66667%; + margin-left: 66.66666667%; } .offset-sm-9 { margin-left: 75%; } .offset-sm-10 { - margin-left: 83.33333%; + margin-left: 83.33333333%; } .offset-sm-11 { - margin-left: 91.66667%; + margin-left: 91.66666667%; } } @media (min-width: 768px) { .col-md { flex-basis: 0; flex-grow: 1; - min-width: 0; max-width: 100%; } .row-cols-md-1 > * { @@ -977,8 +1090,8 @@ pre code { max-width: 50%; } .row-cols-md-3 > * { - flex: 0 0 33.33333%; - max-width: 33.33333%; + flex: 0 0 33.3333333333%; + max-width: 33.3333333333%; } .row-cols-md-4 > * { flex: 0 0 25%; @@ -989,8 +1102,8 @@ pre code { max-width: 20%; } .row-cols-md-6 > * { - flex: 0 0 16.66667%; - max-width: 16.66667%; + flex: 0 0 16.6666666667%; + max-width: 16.6666666667%; } .col-md-auto { flex: 0 0 auto; @@ -998,48 +1111,48 @@ pre code { max-width: 100%; } .col-md-1 { - flex: 0 0 8.33333%; - max-width: 8.33333%; + flex: 0 0 8.33333333%; + max-width: 8.33333333%; } .col-md-2 { - flex: 0 0 16.66667%; - max-width: 16.66667%; + flex: 0 0 16.66666667%; + max-width: 16.66666667%; } .col-md-3 { flex: 0 0 25%; max-width: 25%; } .col-md-4 { - flex: 0 0 33.33333%; - max-width: 33.33333%; + flex: 0 0 33.33333333%; + max-width: 33.33333333%; } .col-md-5 { - flex: 0 0 41.66667%; - max-width: 41.66667%; + flex: 0 0 41.66666667%; + max-width: 41.66666667%; } .col-md-6 { flex: 0 0 50%; max-width: 50%; } .col-md-7 { - flex: 0 0 58.33333%; - max-width: 58.33333%; + flex: 0 0 58.33333333%; + max-width: 58.33333333%; } .col-md-8 { - flex: 0 0 66.66667%; - max-width: 66.66667%; + flex: 0 0 66.66666667%; + max-width: 66.66666667%; } .col-md-9 { flex: 0 0 75%; max-width: 75%; } .col-md-10 { - flex: 0 0 83.33333%; - max-width: 83.33333%; + flex: 0 0 83.33333333%; + max-width: 83.33333333%; } .col-md-11 { - flex: 0 0 91.66667%; - max-width: 91.66667%; + flex: 0 0 91.66666667%; + max-width: 91.66666667%; } .col-md-12 { flex: 0 0 100%; @@ -1094,44 +1207,43 @@ pre code { margin-left: 0; } .offset-md-1 { - margin-left: 8.33333%; + margin-left: 8.33333333%; } .offset-md-2 { - margin-left: 16.66667%; + margin-left: 16.66666667%; } .offset-md-3 { margin-left: 25%; } .offset-md-4 { - margin-left: 33.33333%; + margin-left: 33.33333333%; } .offset-md-5 { - margin-left: 41.66667%; + margin-left: 41.66666667%; } .offset-md-6 { margin-left: 50%; } .offset-md-7 { - margin-left: 58.33333%; + margin-left: 58.33333333%; } .offset-md-8 { - margin-left: 66.66667%; + margin-left: 66.66666667%; } .offset-md-9 { margin-left: 75%; } .offset-md-10 { - margin-left: 83.33333%; + margin-left: 83.33333333%; } .offset-md-11 { - margin-left: 91.66667%; + margin-left: 91.66666667%; } } @media (min-width: 992px) { .col-lg { flex-basis: 0; flex-grow: 1; - min-width: 0; max-width: 100%; } .row-cols-lg-1 > * { @@ -1143,8 +1255,8 @@ pre code { max-width: 50%; } .row-cols-lg-3 > * { - flex: 0 0 33.33333%; - max-width: 33.33333%; + flex: 0 0 33.3333333333%; + max-width: 33.3333333333%; } .row-cols-lg-4 > * { flex: 0 0 25%; @@ -1155,8 +1267,8 @@ pre code { max-width: 20%; } .row-cols-lg-6 > * { - flex: 0 0 16.66667%; - max-width: 16.66667%; + flex: 0 0 16.6666666667%; + max-width: 16.6666666667%; } .col-lg-auto { flex: 0 0 auto; @@ -1164,48 +1276,48 @@ pre code { max-width: 100%; } .col-lg-1 { - flex: 0 0 8.33333%; - max-width: 8.33333%; + flex: 0 0 8.33333333%; + max-width: 8.33333333%; } .col-lg-2 { - flex: 0 0 16.66667%; - max-width: 16.66667%; + flex: 0 0 16.66666667%; + max-width: 16.66666667%; } .col-lg-3 { flex: 0 0 25%; max-width: 25%; } .col-lg-4 { - flex: 0 0 33.33333%; - max-width: 33.33333%; + flex: 0 0 33.33333333%; + max-width: 33.33333333%; } .col-lg-5 { - flex: 0 0 41.66667%; - max-width: 41.66667%; + flex: 0 0 41.66666667%; + max-width: 41.66666667%; } .col-lg-6 { flex: 0 0 50%; max-width: 50%; } .col-lg-7 { - flex: 0 0 58.33333%; - max-width: 58.33333%; + flex: 0 0 58.33333333%; + max-width: 58.33333333%; } .col-lg-8 { - flex: 0 0 66.66667%; - max-width: 66.66667%; + flex: 0 0 66.66666667%; + max-width: 66.66666667%; } .col-lg-9 { flex: 0 0 75%; max-width: 75%; } .col-lg-10 { - flex: 0 0 83.33333%; - max-width: 83.33333%; + flex: 0 0 83.33333333%; + max-width: 83.33333333%; } .col-lg-11 { - flex: 0 0 91.66667%; - max-width: 91.66667%; + flex: 0 0 91.66666667%; + max-width: 91.66666667%; } .col-lg-12 { flex: 0 0 100%; @@ -1260,44 +1372,43 @@ pre code { margin-left: 0; } .offset-lg-1 { - margin-left: 8.33333%; + margin-left: 8.33333333%; } .offset-lg-2 { - margin-left: 16.66667%; + margin-left: 16.66666667%; } .offset-lg-3 { margin-left: 25%; } .offset-lg-4 { - margin-left: 33.33333%; + margin-left: 33.33333333%; } .offset-lg-5 { - margin-left: 41.66667%; + margin-left: 41.66666667%; } .offset-lg-6 { margin-left: 50%; } .offset-lg-7 { - margin-left: 58.33333%; + margin-left: 58.33333333%; } .offset-lg-8 { - margin-left: 66.66667%; + margin-left: 66.66666667%; } .offset-lg-9 { margin-left: 75%; } .offset-lg-10 { - margin-left: 83.33333%; + margin-left: 83.33333333%; } .offset-lg-11 { - margin-left: 91.66667%; + margin-left: 91.66666667%; } } @media (min-width: 1200px) { .col-xl { flex-basis: 0; flex-grow: 1; - min-width: 0; max-width: 100%; } .row-cols-xl-1 > * { @@ -1309,8 +1420,8 @@ pre code { max-width: 50%; } .row-cols-xl-3 > * { - flex: 0 0 33.33333%; - max-width: 33.33333%; + flex: 0 0 33.3333333333%; + max-width: 33.3333333333%; } .row-cols-xl-4 > * { flex: 0 0 25%; @@ -1321,8 +1432,8 @@ pre code { max-width: 20%; } .row-cols-xl-6 > * { - flex: 0 0 16.66667%; - max-width: 16.66667%; + flex: 0 0 16.6666666667%; + max-width: 16.6666666667%; } .col-xl-auto { flex: 0 0 auto; @@ -1330,48 +1441,48 @@ pre code { max-width: 100%; } .col-xl-1 { - flex: 0 0 8.33333%; - max-width: 8.33333%; + flex: 0 0 8.33333333%; + max-width: 8.33333333%; } .col-xl-2 { - flex: 0 0 16.66667%; - max-width: 16.66667%; + flex: 0 0 16.66666667%; + max-width: 16.66666667%; } .col-xl-3 { flex: 0 0 25%; max-width: 25%; } .col-xl-4 { - flex: 0 0 33.33333%; - max-width: 33.33333%; + flex: 0 0 33.33333333%; + max-width: 33.33333333%; } .col-xl-5 { - flex: 0 0 41.66667%; - max-width: 41.66667%; + flex: 0 0 41.66666667%; + max-width: 41.66666667%; } .col-xl-6 { flex: 0 0 50%; max-width: 50%; } .col-xl-7 { - flex: 0 0 58.33333%; - max-width: 58.33333%; + flex: 0 0 58.33333333%; + max-width: 58.33333333%; } .col-xl-8 { - flex: 0 0 66.66667%; - max-width: 66.66667%; + flex: 0 0 66.66666667%; + max-width: 66.66666667%; } .col-xl-9 { flex: 0 0 75%; max-width: 75%; } .col-xl-10 { - flex: 0 0 83.33333%; - max-width: 83.33333%; + flex: 0 0 83.33333333%; + max-width: 83.33333333%; } .col-xl-11 { - flex: 0 0 91.66667%; - max-width: 91.66667%; + flex: 0 0 91.66666667%; + max-width: 91.66666667%; } .col-xl-12 { flex: 0 0 100%; @@ -1426,37 +1537,37 @@ pre code { margin-left: 0; } .offset-xl-1 { - margin-left: 8.33333%; + margin-left: 8.33333333%; } .offset-xl-2 { - margin-left: 16.66667%; + margin-left: 16.66666667%; } .offset-xl-3 { margin-left: 25%; } .offset-xl-4 { - margin-left: 33.33333%; + margin-left: 33.33333333%; } .offset-xl-5 { - margin-left: 41.66667%; + margin-left: 41.66666667%; } .offset-xl-6 { margin-left: 50%; } .offset-xl-7 { - margin-left: 58.33333%; + margin-left: 58.33333333%; } .offset-xl-8 { - margin-left: 66.66667%; + margin-left: 66.66666667%; } .offset-xl-9 { margin-left: 75%; } .offset-xl-10 { - margin-left: 83.33333%; + margin-left: 83.33333333%; } .offset-xl-11 { - margin-left: 91.66667%; + margin-left: 91.66666667%; } } .table { @@ -1464,8 +1575,8 @@ pre code { margin-bottom: 1rem; color: #dee2e6; } -.table td, -.table th { +.table th, +.table td { padding: 0.75rem; vertical-align: top; border-top: 1px solid #444; @@ -1477,45 +1588,52 @@ pre code { .table tbody + tbody { border-top: 2px solid #444; } -.table-sm td, -.table-sm th { + +.table-sm th, +.table-sm td { padding: 0.3rem; } + .table-bordered { border: 1px solid #444; } -.table-bordered td, -.table-bordered th { +.table-bordered th, +.table-bordered td { border: 1px solid #444; } -.table-bordered thead td, -.table-bordered thead th { +.table-bordered thead th, +.table-bordered thead td { border-bottom-width: 2px; } -.table-borderless tbody + tbody, -.table-borderless td, + .table-borderless th, -.table-borderless thead th { +.table-borderless td, +.table-borderless thead th, +.table-borderless tbody + tbody { border: 0; } + .table-striped tbody tr:nth-of-type(odd) { background-color: #303030; } + .table-hover tbody tr:hover { color: #dee2e6; background-color: rgba(0, 0, 0, 0.075); } + .table-primary, -.table-primary > td, -.table-primary > th { +.table-primary > th, +.table-primary > td { background-color: #c7d1db; } -.table-primary tbody + tbody, -.table-primary td, .table-primary th, -.table-primary thead th { +.table-primary td, +.table-primary thead th, +.table-primary tbody + tbody { border-color: #97a9bc; } + .table-hover .table-primary:hover { background-color: #b7c4d1; } @@ -1523,17 +1641,19 @@ pre code { .table-hover .table-primary:hover > th { background-color: #b7c4d1; } + .table-secondary, -.table-secondary > td, -.table-secondary > th { +.table-secondary > th, +.table-secondary > td { background-color: #cbcbcb; } -.table-secondary tbody + tbody, -.table-secondary td, .table-secondary th, -.table-secondary thead th { +.table-secondary td, +.table-secondary thead th, +.table-secondary tbody + tbody { border-color: #9e9e9e; } + .table-hover .table-secondary:hover { background-color: #bebebe; } @@ -1541,17 +1661,19 @@ pre code { .table-hover .table-secondary:hover > th { background-color: #bebebe; } + .table-success, -.table-success > td, -.table-success > th { +.table-success > th, +.table-success > td { background-color: #b8ecdf; } -.table-success tbody + tbody, -.table-success td, .table-success th, -.table-success thead th { +.table-success td, +.table-success thead th, +.table-success tbody + tbody { border-color: #7adcc3; } + .table-hover .table-success:hover { background-color: #a4e7d6; } @@ -1559,17 +1681,19 @@ pre code { .table-hover .table-success:hover > th { background-color: #a4e7d6; } + .table-info, -.table-info > td, -.table-info > th { +.table-info > th, +.table-info > td { background-color: #c6e2f5; } -.table-info tbody + tbody, -.table-info td, .table-info th, -.table-info thead th { +.table-info td, +.table-info thead th, +.table-info tbody + tbody { border-color: #95c9ec; } + .table-hover .table-info:hover { background-color: #b0d7f1; } @@ -1577,17 +1701,19 @@ pre code { .table-hover .table-info:hover > th { background-color: #b0d7f1; } + .table-warning, -.table-warning > td, -.table-warning > th { +.table-warning > th, +.table-warning > td { background-color: #fce3bd; } -.table-warning tbody + tbody, -.table-warning td, .table-warning th, -.table-warning thead th { +.table-warning td, +.table-warning thead th, +.table-warning tbody + tbody { border-color: #f9cc84; } + .table-hover .table-warning:hover { background-color: #fbd9a5; } @@ -1595,17 +1721,19 @@ pre code { .table-hover .table-warning:hover > th { background-color: #fbd9a5; } + .table-danger, -.table-danger > td, -.table-danger > th { +.table-danger > th, +.table-danger > td { background-color: #f8cdc8; } -.table-danger tbody + tbody, -.table-danger td, .table-danger th, -.table-danger thead th { +.table-danger td, +.table-danger thead th, +.table-danger tbody + tbody { border-color: #f3a29a; } + .table-hover .table-danger:hover { background-color: #f5b8b1; } @@ -1613,17 +1741,19 @@ pre code { .table-hover .table-danger:hover > th { background-color: #f5b8b1; } + .table-light, -.table-light > td, -.table-light > th { +.table-light > th, +.table-light > td { background-color: #c5c5c5; } -.table-light tbody + tbody, -.table-light td, .table-light th, -.table-light thead th { +.table-light td, +.table-light thead th, +.table-light tbody + tbody { border-color: #939393; } + .table-hover .table-light:hover { background-color: #b8b8b8; } @@ -1631,17 +1761,19 @@ pre code { .table-hover .table-light:hover > th { background-color: #b8b8b8; } + .table-dark, -.table-dark > td, -.table-dark > th { +.table-dark > th, +.table-dark > td { background-color: #f6f7f8; } -.table-dark tbody + tbody, -.table-dark td, .table-dark th, -.table-dark thead th { +.table-dark td, +.table-dark thead th, +.table-dark tbody + tbody { border-color: #eef0f2; } + .table-hover .table-dark:hover { background-color: #e8eaed; } @@ -1649,11 +1781,13 @@ pre code { .table-hover .table-dark:hover > th { background-color: #e8eaed; } + .table-active, -.table-active > td, -.table-active > th { +.table-active > th, +.table-active > td { background-color: rgba(0, 0, 0, 0.075); } + .table-hover .table-active:hover { background-color: rgba(0, 0, 0, 0.075); } @@ -1661,6 +1795,7 @@ pre code { .table-hover .table-active:hover > th { background-color: rgba(0, 0, 0, 0.075); } + .table .thead-dark th { color: #fff; background-color: #303030; @@ -1671,12 +1806,13 @@ pre code { background-color: #ebebeb; border-color: #444; } + .table-dark { color: #fff; background-color: #303030; } -.table-dark td, .table-dark th, +.table-dark td, .table-dark thead th { border-color: #434343; } @@ -1690,6 +1826,7 @@ pre code { color: #fff; background-color: rgba(255, 255, 255, 0.075); } + @media (max-width: 575.98px) { .table-responsive-sm { display: block; @@ -1743,6 +1880,7 @@ pre code { .table-responsive > .table-bordered { border: 0; } + .form-control { display: block; width: 100%; @@ -1767,10 +1905,6 @@ pre code { background-color: transparent; border: 0; } -.form-control:-moz-focusring { - color: transparent; - text-shadow: 0 0 0 #fff; -} .form-control:focus { color: #fff; background-color: #444; @@ -1787,21 +1921,29 @@ pre code { background-color: #2b2b2b; opacity: 1; } + input[type="date"].form-control, +input[type="time"].form-control, input[type="datetime-local"].form-control, -input[type="month"].form-control, -input[type="time"].form-control { +input[type="month"].form-control { appearance: none; } + +select.form-control:-moz-focusring { + color: transparent; + text-shadow: 0 0 0 #fff; +} select.form-control:focus::-ms-value { color: #fff; background-color: #444; } + .form-control-file, .form-control-range { display: block; width: 100%; } + .col-form-label { padding-top: calc(0.375rem + 1px); padding-bottom: calc(0.375rem + 1px); @@ -1809,18 +1951,21 @@ select.form-control:focus::-ms-value { font-size: inherit; line-height: 1.5; } + .col-form-label-lg { padding-top: calc(0.5rem + 1px); padding-bottom: calc(0.5rem + 1px); - font-size: 1.17188rem; + font-size: 1.171875rem; line-height: 1.5; } + .col-form-label-sm { padding-top: calc(0.25rem + 1px); padding-bottom: calc(0.25rem + 1px); - font-size: 0.82031rem; + font-size: 0.8203125rem; line-height: 1.5; } + .form-control-plaintext { display: block; width: 100%; @@ -1833,39 +1978,46 @@ select.form-control:focus::-ms-value { border: solid transparent; border-width: 1px 0; } -.form-control-plaintext.form-control-lg, -.form-control-plaintext.form-control-sm { +.form-control-plaintext.form-control-sm, +.form-control-plaintext.form-control-lg { padding-right: 0; padding-left: 0; } + .form-control-sm { height: calc(1.5em + 0.5rem + 2px); padding: 0.25rem 0.5rem; - font-size: 0.82031rem; + font-size: 0.8203125rem; line-height: 1.5; border-radius: 0.2rem; } + .form-control-lg { height: calc(1.5em + 1rem + 2px); padding: 0.5rem 1rem; - font-size: 1.17188rem; + font-size: 1.171875rem; line-height: 1.5; border-radius: 0.3rem; } -select.form-control[multiple], -select.form-control[size] { + +select.form-control[size], +select.form-control[multiple] { height: auto; } + textarea.form-control { height: auto; } + .form-group { margin-bottom: 1rem; } + .form-text { display: block; margin-top: 0.25rem; } + .form-row { display: flex; flex-wrap: wrap; @@ -1877,23 +2029,27 @@ textarea.form-control { padding-right: 5px; padding-left: 5px; } + .form-check { position: relative; display: block; padding-left: 1.25rem; } + .form-check-input { position: absolute; margin-top: 0.3rem; margin-left: -1.25rem; } -.form-check-input:disabled ~ .form-check-label, -.form-check-input[disabled] ~ .form-check-label { +.form-check-input[disabled] ~ .form-check-label, +.form-check-input:disabled ~ .form-check-label { color: #888; } + .form-check-label { margin-bottom: 0; } + .form-check-inline { display: inline-flex; align-items: center; @@ -1906,224 +2062,267 @@ textarea.form-control { margin-right: 0.3125rem; margin-left: 0; } + .valid-feedback { display: none; width: 100%; margin-top: 0.25rem; - font-size: 80%; + font-size: 0.875em; color: #00bc8c; } + .valid-tooltip { position: absolute; top: 100%; + left: 0; z-index: 5; display: none; max-width: 100%; padding: 0.25rem 0.5rem; margin-top: 0.1rem; - font-size: 0.82031rem; + font-size: 0.8203125rem; line-height: 1.5; color: #fff; background-color: rgba(0, 188, 140, 0.9); border-radius: 0.25rem; } -.is-valid ~ .valid-feedback, -.is-valid ~ .valid-tooltip, +.form-row > .col > .valid-tooltip, +.form-row > [class*="col-"] > .valid-tooltip { + left: 5px; +} + .was-validated :valid ~ .valid-feedback, -.was-validated :valid ~ .valid-tooltip { +.was-validated :valid ~ .valid-tooltip, +.is-valid ~ .valid-feedback, +.is-valid ~ .valid-tooltip { display: block; } -.form-control.is-valid, -.was-validated .form-control:valid { + +.was-validated .form-control:valid, +.form-control.is-valid { border-color: #00bc8c; - padding-right: calc(1.5em + 0.75rem); + padding-right: calc(1.5em + 0.75rem) !important; background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath fill='%2300bc8c' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e"); background-repeat: no-repeat; background-position: right calc(0.375em + 0.1875rem) center; background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem); } -.form-control.is-valid:focus, -.was-validated .form-control:valid:focus { +.was-validated .form-control:valid:focus, +.form-control.is-valid:focus { border-color: #00bc8c; box-shadow: 0 0 0 0.2rem rgba(0, 188, 140, 0.25); } + +.was-validated select.form-control:valid, +select.form-control.is-valid { + padding-right: 3rem !important; + background-position: right 1.5rem center; +} + .was-validated textarea.form-control:valid, textarea.form-control.is-valid { padding-right: calc(1.5em + 0.75rem); background-position: top calc(0.375em + 0.1875rem) right calc(0.375em + 0.1875rem); } -.custom-select.is-valid, -.was-validated .custom-select:valid { + +.was-validated .custom-select:valid, +.custom-select.is-valid { border-color: #00bc8c; - padding-right: calc(0.75em + 2.3125rem); + padding-right: calc(0.75em + 2.3125rem) !important; background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='4' height='5' viewBox='0 0 4 5'%3e%3cpath fill='%23303030' d='M2 0L0 2h4zm0 5L0 3h4z'/%3e%3c/svg%3e") - no-repeat right 0.75rem center/8px 10px, - url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath fill='%2300bc8c' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e") - #444 no-repeat center right 1.75rem / calc(0.75em + 0.375rem) - calc(0.75em + 0.375rem); + right 0.75rem center/8px 10px no-repeat, + #444 + url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath fill='%2300bc8c' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e") + center right 1.75rem / calc(0.75em + 0.375rem) calc(0.75em + 0.375rem) + no-repeat; } -.custom-select.is-valid:focus, -.was-validated .custom-select:valid:focus { +.was-validated .custom-select:valid:focus, +.custom-select.is-valid:focus { border-color: #00bc8c; box-shadow: 0 0 0 0.2rem rgba(0, 188, 140, 0.25); } -.form-check-input.is-valid ~ .form-check-label, -.was-validated .form-check-input:valid ~ .form-check-label { + +.was-validated .form-check-input:valid ~ .form-check-label, +.form-check-input.is-valid ~ .form-check-label { color: #00bc8c; } -.form-check-input.is-valid ~ .valid-feedback, -.form-check-input.is-valid ~ .valid-tooltip, .was-validated .form-check-input:valid ~ .valid-feedback, -.was-validated .form-check-input:valid ~ .valid-tooltip { +.was-validated .form-check-input:valid ~ .valid-tooltip, +.form-check-input.is-valid ~ .valid-feedback, +.form-check-input.is-valid ~ .valid-tooltip { display: block; } -.custom-control-input.is-valid ~ .custom-control-label, -.was-validated .custom-control-input:valid ~ .custom-control-label { + +.was-validated .custom-control-input:valid ~ .custom-control-label, +.custom-control-input.is-valid ~ .custom-control-label { color: #00bc8c; } -.custom-control-input.is-valid ~ .custom-control-label::before, -.was-validated .custom-control-input:valid ~ .custom-control-label::before { +.was-validated .custom-control-input:valid ~ .custom-control-label::before, +.custom-control-input.is-valid ~ .custom-control-label::before { border-color: #00bc8c; } -.custom-control-input.is-valid:checked ~ .custom-control-label::before, .was-validated .custom-control-input:valid:checked - ~ .custom-control-label::before { + ~ .custom-control-label::before, +.custom-control-input.is-valid:checked ~ .custom-control-label::before { border-color: #00efb2; background-color: #00efb2; } -.custom-control-input.is-valid:focus ~ .custom-control-label::before, .was-validated .custom-control-input:valid:focus - ~ .custom-control-label::before { + ~ .custom-control-label::before, +.custom-control-input.is-valid:focus ~ .custom-control-label::before { box-shadow: 0 0 0 0.2rem rgba(0, 188, 140, 0.25); } -.custom-control-input.is-valid:focus:not(:checked) - ~ .custom-control-label::before, .was-validated .custom-control-input:valid:focus:not(:checked) + ~ .custom-control-label::before, +.custom-control-input.is-valid:focus:not(:checked) ~ .custom-control-label::before { border-color: #00bc8c; } -.custom-file-input.is-valid ~ .custom-file-label, -.was-validated .custom-file-input:valid ~ .custom-file-label { + +.was-validated .custom-file-input:valid ~ .custom-file-label, +.custom-file-input.is-valid ~ .custom-file-label { border-color: #00bc8c; } -.custom-file-input.is-valid:focus ~ .custom-file-label, -.was-validated .custom-file-input:valid:focus ~ .custom-file-label { +.was-validated .custom-file-input:valid:focus ~ .custom-file-label, +.custom-file-input.is-valid:focus ~ .custom-file-label { border-color: #00bc8c; box-shadow: 0 0 0 0.2rem rgba(0, 188, 140, 0.25); } + .invalid-feedback { display: none; width: 100%; margin-top: 0.25rem; - font-size: 80%; + font-size: 0.875em; color: #e74c3c; } + .invalid-tooltip { position: absolute; top: 100%; + left: 0; z-index: 5; display: none; max-width: 100%; padding: 0.25rem 0.5rem; margin-top: 0.1rem; - font-size: 0.82031rem; + font-size: 0.8203125rem; line-height: 1.5; color: #fff; background-color: rgba(231, 76, 60, 0.9); border-radius: 0.25rem; } -.is-invalid ~ .invalid-feedback, -.is-invalid ~ .invalid-tooltip, +.form-row > .col > .invalid-tooltip, +.form-row > [class*="col-"] > .invalid-tooltip { + left: 5px; +} + .was-validated :invalid ~ .invalid-feedback, -.was-validated :invalid ~ .invalid-tooltip { +.was-validated :invalid ~ .invalid-tooltip, +.is-invalid ~ .invalid-feedback, +.is-invalid ~ .invalid-tooltip { display: block; } -.form-control.is-invalid, -.was-validated .form-control:invalid { + +.was-validated .form-control:invalid, +.form-control.is-invalid { border-color: #e74c3c; - padding-right: calc(1.5em + 0.75rem); + padding-right: calc(1.5em + 0.75rem) !important; background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23e74c3c' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23e74c3c' stroke='none'/%3e%3c/svg%3e"); background-repeat: no-repeat; background-position: right calc(0.375em + 0.1875rem) center; background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem); } -.form-control.is-invalid:focus, -.was-validated .form-control:invalid:focus { +.was-validated .form-control:invalid:focus, +.form-control.is-invalid:focus { border-color: #e74c3c; box-shadow: 0 0 0 0.2rem rgba(231, 76, 60, 0.25); } + +.was-validated select.form-control:invalid, +select.form-control.is-invalid { + padding-right: 3rem !important; + background-position: right 1.5rem center; +} + .was-validated textarea.form-control:invalid, textarea.form-control.is-invalid { padding-right: calc(1.5em + 0.75rem); background-position: top calc(0.375em + 0.1875rem) right calc(0.375em + 0.1875rem); } -.custom-select.is-invalid, -.was-validated .custom-select:invalid { + +.was-validated .custom-select:invalid, +.custom-select.is-invalid { border-color: #e74c3c; - padding-right: calc(0.75em + 2.3125rem); + padding-right: calc(0.75em + 2.3125rem) !important; background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='4' height='5' viewBox='0 0 4 5'%3e%3cpath fill='%23303030' d='M2 0L0 2h4zm0 5L0 3h4z'/%3e%3c/svg%3e") - no-repeat right 0.75rem center/8px 10px, - url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23e74c3c' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23e74c3c' stroke='none'/%3e%3c/svg%3e") - #444 no-repeat center right 1.75rem / calc(0.75em + 0.375rem) - calc(0.75em + 0.375rem); + right 0.75rem center/8px 10px no-repeat, + #444 + url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23e74c3c' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23e74c3c' stroke='none'/%3e%3c/svg%3e") + center right 1.75rem / calc(0.75em + 0.375rem) calc(0.75em + 0.375rem) + no-repeat; } -.custom-select.is-invalid:focus, -.was-validated .custom-select:invalid:focus { +.was-validated .custom-select:invalid:focus, +.custom-select.is-invalid:focus { border-color: #e74c3c; box-shadow: 0 0 0 0.2rem rgba(231, 76, 60, 0.25); } -.form-check-input.is-invalid ~ .form-check-label, -.was-validated .form-check-input:invalid ~ .form-check-label { + +.was-validated .form-check-input:invalid ~ .form-check-label, +.form-check-input.is-invalid ~ .form-check-label { color: #e74c3c; } -.form-check-input.is-invalid ~ .invalid-feedback, -.form-check-input.is-invalid ~ .invalid-tooltip, .was-validated .form-check-input:invalid ~ .invalid-feedback, -.was-validated .form-check-input:invalid ~ .invalid-tooltip { +.was-validated .form-check-input:invalid ~ .invalid-tooltip, +.form-check-input.is-invalid ~ .invalid-feedback, +.form-check-input.is-invalid ~ .invalid-tooltip { display: block; } -.custom-control-input.is-invalid ~ .custom-control-label, -.was-validated .custom-control-input:invalid ~ .custom-control-label { + +.was-validated .custom-control-input:invalid ~ .custom-control-label, +.custom-control-input.is-invalid ~ .custom-control-label { color: #e74c3c; } -.custom-control-input.is-invalid ~ .custom-control-label::before, -.was-validated .custom-control-input:invalid ~ .custom-control-label::before { +.was-validated .custom-control-input:invalid ~ .custom-control-label::before, +.custom-control-input.is-invalid ~ .custom-control-label::before { border-color: #e74c3c; } -.custom-control-input.is-invalid:checked ~ .custom-control-label::before, .was-validated .custom-control-input:invalid:checked - ~ .custom-control-label::before { + ~ .custom-control-label::before, +.custom-control-input.is-invalid:checked ~ .custom-control-label::before { border-color: #ed7669; background-color: #ed7669; } -.custom-control-input.is-invalid:focus ~ .custom-control-label::before, .was-validated .custom-control-input:invalid:focus - ~ .custom-control-label::before { + ~ .custom-control-label::before, +.custom-control-input.is-invalid:focus ~ .custom-control-label::before { box-shadow: 0 0 0 0.2rem rgba(231, 76, 60, 0.25); } -.custom-control-input.is-invalid:focus:not(:checked) - ~ .custom-control-label::before, .was-validated .custom-control-input:invalid:focus:not(:checked) + ~ .custom-control-label::before, +.custom-control-input.is-invalid:focus:not(:checked) ~ .custom-control-label::before { border-color: #e74c3c; } -.custom-file-input.is-invalid ~ .custom-file-label, -.was-validated .custom-file-input:invalid ~ .custom-file-label { + +.was-validated .custom-file-input:invalid ~ .custom-file-label, +.custom-file-input.is-invalid ~ .custom-file-label { border-color: #e74c3c; } -.custom-file-input.is-invalid:focus ~ .custom-file-label, -.was-validated .custom-file-input:invalid:focus ~ .custom-file-label { +.was-validated .custom-file-input:invalid:focus ~ .custom-file-label, +.custom-file-input.is-invalid:focus ~ .custom-file-label { border-color: #e74c3c; box-shadow: 0 0 0 0.2rem rgba(231, 76, 60, 0.25); } + .form-inline { display: flex; flex-flow: row wrap; @@ -2154,8 +2353,8 @@ textarea.form-control.is-invalid { .form-inline .form-control-plaintext { display: inline-block; } - .form-inline .custom-select, - .form-inline .input-group { + .form-inline .input-group, + .form-inline .custom-select { width: auto; } .form-inline .form-check { @@ -2180,6 +2379,7 @@ textarea.form-control.is-invalid { margin-bottom: 0; } } + .btn { display: inline-block; font-weight: 400; @@ -2205,8 +2405,8 @@ textarea.form-control.is-invalid { color: #dee2e6; text-decoration: none; } -.btn.focus, -.btn:focus { +.btn:focus, +.btn.focus { outline: 0; box-shadow: 0 0 0 0.2rem rgba(55, 90, 127, 0.25); } @@ -2221,6 +2421,7 @@ a.btn.disabled, fieldset:disabled a.btn { pointer-events: none; } + .btn-primary { color: #fff; background-color: #375a7f; @@ -2231,8 +2432,8 @@ fieldset:disabled a.btn { background-color: #2b4764; border-color: #28415b; } -.btn-primary.focus, -.btn-primary:focus { +.btn-primary:focus, +.btn-primary.focus { color: #fff; background-color: #2b4764; border-color: #28415b; @@ -2244,18 +2445,19 @@ fieldset:disabled a.btn { background-color: #375a7f; border-color: #375a7f; } -.btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active, +.btn-primary:not(:disabled):not(.disabled).active, .show > .btn-primary.dropdown-toggle { color: #fff; background-color: #28415b; border-color: #243a53; } -.btn-primary:not(:disabled):not(.disabled).active:focus, .btn-primary:not(:disabled):not(.disabled):active:focus, +.btn-primary:not(:disabled):not(.disabled).active:focus, .show > .btn-primary.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem rgba(85, 115, 146, 0.5); } + .btn-secondary { color: #fff; background-color: #444; @@ -2266,8 +2468,8 @@ fieldset:disabled a.btn { background-color: #313131; border-color: #2b2b2b; } -.btn-secondary.focus, -.btn-secondary:focus { +.btn-secondary:focus, +.btn-secondary.focus { color: #fff; background-color: #313131; border-color: #2b2b2b; @@ -2279,18 +2481,19 @@ fieldset:disabled a.btn { background-color: #444; border-color: #444; } -.btn-secondary:not(:disabled):not(.disabled).active, .btn-secondary:not(:disabled):not(.disabled):active, +.btn-secondary:not(:disabled):not(.disabled).active, .show > .btn-secondary.dropdown-toggle { color: #fff; background-color: #2b2b2b; border-color: #242424; } -.btn-secondary:not(:disabled):not(.disabled).active:focus, .btn-secondary:not(:disabled):not(.disabled):active:focus, +.btn-secondary:not(:disabled):not(.disabled).active:focus, .show > .btn-secondary.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem rgba(96, 96, 96, 0.5); } + .btn-success { color: #fff; background-color: #00bc8c; @@ -2301,8 +2504,8 @@ fieldset:disabled a.btn { background-color: #009670; border-color: #008966; } -.btn-success.focus, -.btn-success:focus { +.btn-success:focus, +.btn-success.focus { color: #fff; background-color: #009670; border-color: #008966; @@ -2314,18 +2517,19 @@ fieldset:disabled a.btn { background-color: #00bc8c; border-color: #00bc8c; } -.btn-success:not(:disabled):not(.disabled).active, .btn-success:not(:disabled):not(.disabled):active, +.btn-success:not(:disabled):not(.disabled).active, .show > .btn-success.dropdown-toggle { color: #fff; background-color: #008966; border-color: #007c5d; } -.btn-success:not(:disabled):not(.disabled).active:focus, .btn-success:not(:disabled):not(.disabled):active:focus, +.btn-success:not(:disabled):not(.disabled).active:focus, .show > .btn-success.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem rgba(38, 198, 157, 0.5); } + .btn-info { color: #fff; background-color: #3498db; @@ -2336,8 +2540,8 @@ fieldset:disabled a.btn { background-color: #2384c6; border-color: #217dbb; } -.btn-info.focus, -.btn-info:focus { +.btn-info:focus, +.btn-info.focus { color: #fff; background-color: #2384c6; border-color: #217dbb; @@ -2349,18 +2553,19 @@ fieldset:disabled a.btn { background-color: #3498db; border-color: #3498db; } -.btn-info:not(:disabled):not(.disabled).active, .btn-info:not(:disabled):not(.disabled):active, +.btn-info:not(:disabled):not(.disabled).active, .show > .btn-info.dropdown-toggle { color: #fff; background-color: #217dbb; border-color: #1f76b0; } -.btn-info:not(:disabled):not(.disabled).active:focus, .btn-info:not(:disabled):not(.disabled):active:focus, +.btn-info:not(:disabled):not(.disabled).active:focus, .show > .btn-info.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem rgba(82, 167, 224, 0.5); } + .btn-warning { color: #fff; background-color: #f39c12; @@ -2371,8 +2576,8 @@ fieldset:disabled a.btn { background-color: #d4860b; border-color: #c87f0a; } -.btn-warning.focus, -.btn-warning:focus { +.btn-warning:focus, +.btn-warning.focus { color: #fff; background-color: #d4860b; border-color: #c87f0a; @@ -2384,18 +2589,19 @@ fieldset:disabled a.btn { background-color: #f39c12; border-color: #f39c12; } -.btn-warning:not(:disabled):not(.disabled).active, .btn-warning:not(:disabled):not(.disabled):active, +.btn-warning:not(:disabled):not(.disabled).active, .show > .btn-warning.dropdown-toggle { color: #fff; background-color: #c87f0a; border-color: #bc770a; } -.btn-warning:not(:disabled):not(.disabled).active:focus, .btn-warning:not(:disabled):not(.disabled):active:focus, +.btn-warning:not(:disabled):not(.disabled).active:focus, .show > .btn-warning.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem rgba(245, 171, 54, 0.5); } + .btn-danger { color: #fff; background-color: #e74c3c; @@ -2406,8 +2612,8 @@ fieldset:disabled a.btn { background-color: #e12e1c; border-color: #d62c1a; } -.btn-danger.focus, -.btn-danger:focus { +.btn-danger:focus, +.btn-danger.focus { color: #fff; background-color: #e12e1c; border-color: #d62c1a; @@ -2419,18 +2625,19 @@ fieldset:disabled a.btn { background-color: #e74c3c; border-color: #e74c3c; } -.btn-danger:not(:disabled):not(.disabled).active, .btn-danger:not(:disabled):not(.disabled):active, +.btn-danger:not(:disabled):not(.disabled).active, .show > .btn-danger.dropdown-toggle { color: #fff; background-color: #d62c1a; border-color: #ca2a19; } -.btn-danger:not(:disabled):not(.disabled).active:focus, .btn-danger:not(:disabled):not(.disabled):active:focus, +.btn-danger:not(:disabled):not(.disabled).active:focus, .show > .btn-danger.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem rgba(235, 103, 89, 0.5); } + .btn-light { color: #fff; background-color: #303030; @@ -2441,8 +2648,8 @@ fieldset:disabled a.btn { background-color: #1d1d1d; border-color: #171717; } -.btn-light.focus, -.btn-light:focus { +.btn-light:focus, +.btn-light.focus { color: #fff; background-color: #1d1d1d; border-color: #171717; @@ -2454,18 +2661,19 @@ fieldset:disabled a.btn { background-color: #303030; border-color: #303030; } -.btn-light:not(:disabled):not(.disabled).active, .btn-light:not(:disabled):not(.disabled):active, +.btn-light:not(:disabled):not(.disabled).active, .show > .btn-light.dropdown-toggle { color: #fff; background-color: #171717; border-color: #101010; } -.btn-light:not(:disabled):not(.disabled).active:focus, .btn-light:not(:disabled):not(.disabled):active:focus, +.btn-light:not(:disabled):not(.disabled).active:focus, .show > .btn-light.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem rgba(79, 79, 79, 0.5); } + .btn-dark { color: #222; background-color: #dee2e6; @@ -2476,8 +2684,8 @@ fieldset:disabled a.btn { background-color: #c8cfd6; border-color: #c1c9d0; } -.btn-dark.focus, -.btn-dark:focus { +.btn-dark:focus, +.btn-dark.focus { color: #222; background-color: #c8cfd6; border-color: #c1c9d0; @@ -2489,18 +2697,19 @@ fieldset:disabled a.btn { background-color: #dee2e6; border-color: #dee2e6; } -.btn-dark:not(:disabled):not(.disabled).active, .btn-dark:not(:disabled):not(.disabled):active, +.btn-dark:not(:disabled):not(.disabled).active, .show > .btn-dark.dropdown-toggle { color: #222; background-color: #c1c9d0; border-color: #bac2cb; } -.btn-dark:not(:disabled):not(.disabled).active:focus, .btn-dark:not(:disabled):not(.disabled):active:focus, +.btn-dark:not(:disabled):not(.disabled).active:focus, .show > .btn-dark.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem rgba(194, 197, 201, 0.5); } + .btn-outline-primary { color: #375a7f; border-color: #375a7f; @@ -2510,8 +2719,8 @@ fieldset:disabled a.btn { background-color: #375a7f; border-color: #375a7f; } -.btn-outline-primary.focus, -.btn-outline-primary:focus { +.btn-outline-primary:focus, +.btn-outline-primary.focus { box-shadow: 0 0 0 0.2rem rgba(55, 90, 127, 0.5); } .btn-outline-primary.disabled, @@ -2519,18 +2728,19 @@ fieldset:disabled a.btn { color: #375a7f; background-color: transparent; } -.btn-outline-primary:not(:disabled):not(.disabled).active, .btn-outline-primary:not(:disabled):not(.disabled):active, +.btn-outline-primary:not(:disabled):not(.disabled).active, .show > .btn-outline-primary.dropdown-toggle { color: #fff; background-color: #375a7f; border-color: #375a7f; } -.btn-outline-primary:not(:disabled):not(.disabled).active:focus, .btn-outline-primary:not(:disabled):not(.disabled):active:focus, +.btn-outline-primary:not(:disabled):not(.disabled).active:focus, .show > .btn-outline-primary.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem rgba(55, 90, 127, 0.5); } + .btn-outline-secondary { color: #444; border-color: #444; @@ -2540,8 +2750,8 @@ fieldset:disabled a.btn { background-color: #444; border-color: #444; } -.btn-outline-secondary.focus, -.btn-outline-secondary:focus { +.btn-outline-secondary:focus, +.btn-outline-secondary.focus { box-shadow: 0 0 0 0.2rem rgba(68, 68, 68, 0.5); } .btn-outline-secondary.disabled, @@ -2549,18 +2759,19 @@ fieldset:disabled a.btn { color: #444; background-color: transparent; } -.btn-outline-secondary:not(:disabled):not(.disabled).active, .btn-outline-secondary:not(:disabled):not(.disabled):active, +.btn-outline-secondary:not(:disabled):not(.disabled).active, .show > .btn-outline-secondary.dropdown-toggle { color: #fff; background-color: #444; border-color: #444; } -.btn-outline-secondary:not(:disabled):not(.disabled).active:focus, .btn-outline-secondary:not(:disabled):not(.disabled):active:focus, +.btn-outline-secondary:not(:disabled):not(.disabled).active:focus, .show > .btn-outline-secondary.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem rgba(68, 68, 68, 0.5); } + .btn-outline-success { color: #00bc8c; border-color: #00bc8c; @@ -2570,8 +2781,8 @@ fieldset:disabled a.btn { background-color: #00bc8c; border-color: #00bc8c; } -.btn-outline-success.focus, -.btn-outline-success:focus { +.btn-outline-success:focus, +.btn-outline-success.focus { box-shadow: 0 0 0 0.2rem rgba(0, 188, 140, 0.5); } .btn-outline-success.disabled, @@ -2579,18 +2790,19 @@ fieldset:disabled a.btn { color: #00bc8c; background-color: transparent; } -.btn-outline-success:not(:disabled):not(.disabled).active, .btn-outline-success:not(:disabled):not(.disabled):active, +.btn-outline-success:not(:disabled):not(.disabled).active, .show > .btn-outline-success.dropdown-toggle { color: #fff; background-color: #00bc8c; border-color: #00bc8c; } -.btn-outline-success:not(:disabled):not(.disabled).active:focus, .btn-outline-success:not(:disabled):not(.disabled):active:focus, +.btn-outline-success:not(:disabled):not(.disabled).active:focus, .show > .btn-outline-success.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem rgba(0, 188, 140, 0.5); } + .btn-outline-info { color: #3498db; border-color: #3498db; @@ -2600,8 +2812,8 @@ fieldset:disabled a.btn { background-color: #3498db; border-color: #3498db; } -.btn-outline-info.focus, -.btn-outline-info:focus { +.btn-outline-info:focus, +.btn-outline-info.focus { box-shadow: 0 0 0 0.2rem rgba(52, 152, 219, 0.5); } .btn-outline-info.disabled, @@ -2609,18 +2821,19 @@ fieldset:disabled a.btn { color: #3498db; background-color: transparent; } -.btn-outline-info:not(:disabled):not(.disabled).active, .btn-outline-info:not(:disabled):not(.disabled):active, +.btn-outline-info:not(:disabled):not(.disabled).active, .show > .btn-outline-info.dropdown-toggle { color: #fff; background-color: #3498db; border-color: #3498db; } -.btn-outline-info:not(:disabled):not(.disabled).active:focus, .btn-outline-info:not(:disabled):not(.disabled):active:focus, +.btn-outline-info:not(:disabled):not(.disabled).active:focus, .show > .btn-outline-info.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem rgba(52, 152, 219, 0.5); } + .btn-outline-warning { color: #f39c12; border-color: #f39c12; @@ -2630,8 +2843,8 @@ fieldset:disabled a.btn { background-color: #f39c12; border-color: #f39c12; } -.btn-outline-warning.focus, -.btn-outline-warning:focus { +.btn-outline-warning:focus, +.btn-outline-warning.focus { box-shadow: 0 0 0 0.2rem rgba(243, 156, 18, 0.5); } .btn-outline-warning.disabled, @@ -2639,18 +2852,19 @@ fieldset:disabled a.btn { color: #f39c12; background-color: transparent; } -.btn-outline-warning:not(:disabled):not(.disabled).active, .btn-outline-warning:not(:disabled):not(.disabled):active, +.btn-outline-warning:not(:disabled):not(.disabled).active, .show > .btn-outline-warning.dropdown-toggle { color: #fff; background-color: #f39c12; border-color: #f39c12; } -.btn-outline-warning:not(:disabled):not(.disabled).active:focus, .btn-outline-warning:not(:disabled):not(.disabled):active:focus, +.btn-outline-warning:not(:disabled):not(.disabled).active:focus, .show > .btn-outline-warning.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem rgba(243, 156, 18, 0.5); } + .btn-outline-danger { color: #e74c3c; border-color: #e74c3c; @@ -2660,8 +2874,8 @@ fieldset:disabled a.btn { background-color: #e74c3c; border-color: #e74c3c; } -.btn-outline-danger.focus, -.btn-outline-danger:focus { +.btn-outline-danger:focus, +.btn-outline-danger.focus { box-shadow: 0 0 0 0.2rem rgba(231, 76, 60, 0.5); } .btn-outline-danger.disabled, @@ -2669,18 +2883,19 @@ fieldset:disabled a.btn { color: #e74c3c; background-color: transparent; } -.btn-outline-danger:not(:disabled):not(.disabled).active, .btn-outline-danger:not(:disabled):not(.disabled):active, +.btn-outline-danger:not(:disabled):not(.disabled).active, .show > .btn-outline-danger.dropdown-toggle { color: #fff; background-color: #e74c3c; border-color: #e74c3c; } -.btn-outline-danger:not(:disabled):not(.disabled).active:focus, .btn-outline-danger:not(:disabled):not(.disabled):active:focus, +.btn-outline-danger:not(:disabled):not(.disabled).active:focus, .show > .btn-outline-danger.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem rgba(231, 76, 60, 0.5); } + .btn-outline-light { color: #303030; border-color: #303030; @@ -2690,8 +2905,8 @@ fieldset:disabled a.btn { background-color: #303030; border-color: #303030; } -.btn-outline-light.focus, -.btn-outline-light:focus { +.btn-outline-light:focus, +.btn-outline-light.focus { box-shadow: 0 0 0 0.2rem rgba(48, 48, 48, 0.5); } .btn-outline-light.disabled, @@ -2699,18 +2914,19 @@ fieldset:disabled a.btn { color: #303030; background-color: transparent; } -.btn-outline-light:not(:disabled):not(.disabled).active, .btn-outline-light:not(:disabled):not(.disabled):active, +.btn-outline-light:not(:disabled):not(.disabled).active, .show > .btn-outline-light.dropdown-toggle { color: #fff; background-color: #303030; border-color: #303030; } -.btn-outline-light:not(:disabled):not(.disabled).active:focus, .btn-outline-light:not(:disabled):not(.disabled):active:focus, +.btn-outline-light:not(:disabled):not(.disabled).active:focus, .show > .btn-outline-light.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem rgba(48, 48, 48, 0.5); } + .btn-outline-dark { color: #dee2e6; border-color: #dee2e6; @@ -2720,8 +2936,8 @@ fieldset:disabled a.btn { background-color: #dee2e6; border-color: #dee2e6; } -.btn-outline-dark.focus, -.btn-outline-dark:focus { +.btn-outline-dark:focus, +.btn-outline-dark.focus { box-shadow: 0 0 0 0.2rem rgba(222, 226, 230, 0.5); } .btn-outline-dark.disabled, @@ -2729,18 +2945,19 @@ fieldset:disabled a.btn { color: #dee2e6; background-color: transparent; } -.btn-outline-dark:not(:disabled):not(.disabled).active, .btn-outline-dark:not(:disabled):not(.disabled):active, +.btn-outline-dark:not(:disabled):not(.disabled).active, .show > .btn-outline-dark.dropdown-toggle { color: #222; background-color: #dee2e6; border-color: #dee2e6; } -.btn-outline-dark:not(:disabled):not(.disabled).active:focus, .btn-outline-dark:not(:disabled):not(.disabled):active:focus, +.btn-outline-dark:not(:disabled):not(.disabled).active:focus, .show > .btn-outline-dark.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem rgba(222, 226, 230, 0.5); } + .btn-link { font-weight: 400; color: #00bc8c; @@ -2750,29 +2967,32 @@ fieldset:disabled a.btn { color: #007053; text-decoration: underline; } -.btn-link.focus, -.btn-link:focus { +.btn-link:focus, +.btn-link.focus { text-decoration: underline; } -.btn-link.disabled, -.btn-link:disabled { +.btn-link:disabled, +.btn-link.disabled { color: #888; pointer-events: none; } -.btn-group-lg > .btn, -.btn-lg { + +.btn-lg, +.btn-group-lg > .btn { padding: 0.5rem 1rem; - font-size: 1.17188rem; + font-size: 1.171875rem; line-height: 1.5; border-radius: 0.3rem; } -.btn-group-sm > .btn, -.btn-sm { + +.btn-sm, +.btn-group-sm > .btn { padding: 0.25rem 0.5rem; - font-size: 0.82031rem; + font-size: 0.8203125rem; line-height: 1.5; border-radius: 0.2rem; } + .btn-block { display: block; width: 100%; @@ -2780,11 +3000,13 @@ fieldset:disabled a.btn { .btn-block + .btn-block { margin-top: 0.5rem; } -input[type="button"].btn-block, + +input[type="submit"].btn-block, input[type="reset"].btn-block, -input[type="submit"].btn-block { +input[type="button"].btn-block { width: 100%; } + .fade { transition: opacity 0.15s linear; } @@ -2796,9 +3018,11 @@ input[type="submit"].btn-block { .fade:not(.show) { opacity: 0; } + .collapse:not(.show) { display: none; } + .collapsing { position: relative; height: 0; @@ -2810,12 +3034,24 @@ input[type="submit"].btn-block { transition: none; } } -.dropdown, -.dropleft, +.collapsing.width { + width: 0; + height: auto; + transition: width 0.35s ease; +} +@media (prefers-reduced-motion: reduce) { + .collapsing.width { + transition: none; + } +} + +.dropup, .dropright, -.dropup { +.dropdown, +.dropleft { position: relative; } + .dropdown-toggle { white-space: nowrap; } @@ -2832,6 +3068,7 @@ input[type="submit"].btn-block { .dropdown-toggle:empty::after { margin-left: 0; } + .dropdown-menu { position: absolute; top: 100%; @@ -2851,14 +3088,17 @@ input[type="submit"].btn-block { border: 1px solid #444; border-radius: 0.25rem; } + .dropdown-menu-left { right: auto; left: 0; } + .dropdown-menu-right { right: 0; left: auto; } + @media (min-width: 576px) { .dropdown-menu-sm-left { right: auto; @@ -2918,6 +3158,7 @@ input[type="submit"].btn-block { .dropup .dropdown-toggle:empty::after { margin-left: 0; } + .dropright .dropdown-menu { top: 0; right: auto; @@ -2941,6 +3182,7 @@ input[type="submit"].btn-block { .dropright .dropdown-toggle::after { vertical-align: 0; } + .dropleft .dropdown-menu { top: 0; right: 100%; @@ -2972,19 +3214,22 @@ input[type="submit"].btn-block { .dropleft .dropdown-toggle::before { vertical-align: 0; } -.dropdown-menu[x-placement^="bottom"], -.dropdown-menu[x-placement^="left"], + +.dropdown-menu[x-placement^="top"], .dropdown-menu[x-placement^="right"], -.dropdown-menu[x-placement^="top"] { +.dropdown-menu[x-placement^="bottom"], +.dropdown-menu[x-placement^="left"] { right: auto; bottom: auto; } + .dropdown-divider { height: 0; margin: 0.5rem 0; overflow: hidden; border-top: 1px solid #444; } + .dropdown-item { display: block; width: 100%; @@ -2997,8 +3242,8 @@ input[type="submit"].btn-block { background-color: transparent; border: 0; } -.dropdown-item:focus, -.dropdown-item:hover { +.dropdown-item:hover, +.dropdown-item:focus { color: #fff; text-decoration: none; background-color: #375a7f; @@ -3011,49 +3256,54 @@ input[type="submit"].btn-block { } .dropdown-item.disabled, .dropdown-item:disabled { - color: #888; + color: #adb5bd; pointer-events: none; background-color: transparent; } + .dropdown-menu.show { display: block; } + .dropdown-header { display: block; padding: 0.5rem 1.5rem; margin-bottom: 0; - font-size: 0.82031rem; + font-size: 0.8203125rem; color: #888; white-space: nowrap; } + .dropdown-item-text { display: block; padding: 0.25rem 1.5rem; color: #fff; } + .btn-group, .btn-group-vertical { position: relative; display: inline-flex; vertical-align: middle; } -.btn-group-vertical > .btn, -.btn-group > .btn { +.btn-group > .btn, +.btn-group-vertical > .btn { position: relative; flex: 1 1 auto; } -.btn-group-vertical > .btn:hover, -.btn-group > .btn:hover { +.btn-group > .btn:hover, +.btn-group-vertical > .btn:hover { z-index: 1; } -.btn-group-vertical > .btn.active, -.btn-group-vertical > .btn:active, -.btn-group-vertical > .btn:focus, -.btn-group > .btn.active, +.btn-group > .btn:focus, .btn-group > .btn:active, -.btn-group > .btn:focus { +.btn-group > .btn.active, +.btn-group-vertical > .btn:focus, +.btn-group-vertical > .btn:active, +.btn-group-vertical > .btn.active { z-index: 1; } + .btn-toolbar { display: flex; flex-wrap: wrap; @@ -3062,42 +3312,47 @@ input[type="submit"].btn-block { .btn-toolbar .input-group { width: auto; } -.btn-group > .btn-group:not(:first-child), -.btn-group > .btn:not(:first-child) { + +.btn-group > .btn:not(:first-child), +.btn-group > .btn-group:not(:first-child) { margin-left: -1px; } -.btn-group > .btn-group:not(:last-child) > .btn, -.btn-group > .btn:not(:last-child):not(.dropdown-toggle) { +.btn-group > .btn:not(:last-child):not(.dropdown-toggle), +.btn-group > .btn-group:not(:last-child) > .btn { border-top-right-radius: 0; border-bottom-right-radius: 0; } -.btn-group > .btn-group:not(:first-child) > .btn, -.btn-group > .btn:not(:first-child) { +.btn-group > .btn:not(:first-child), +.btn-group > .btn-group:not(:first-child) > .btn { border-top-left-radius: 0; border-bottom-left-radius: 0; } + .dropdown-toggle-split { padding-right: 0.5625rem; padding-left: 0.5625rem; } .dropdown-toggle-split::after, -.dropright .dropdown-toggle-split::after, -.dropup .dropdown-toggle-split::after { +.dropup .dropdown-toggle-split::after, +.dropright .dropdown-toggle-split::after { margin-left: 0; } .dropleft .dropdown-toggle-split::before { margin-right: 0; } -.btn-group-sm > .btn + .dropdown-toggle-split, -.btn-sm + .dropdown-toggle-split { + +.btn-sm + .dropdown-toggle-split, +.btn-group-sm > .btn + .dropdown-toggle-split { padding-right: 0.375rem; padding-left: 0.375rem; } -.btn-group-lg > .btn + .dropdown-toggle-split, -.btn-lg + .dropdown-toggle-split { + +.btn-lg + .dropdown-toggle-split, +.btn-group-lg > .btn + .dropdown-toggle-split { padding-right: 0.75rem; padding-left: 0.75rem; } + .btn-group-vertical { flex-direction: column; align-items: flex-start; @@ -3107,32 +3362,34 @@ input[type="submit"].btn-block { .btn-group-vertical > .btn-group { width: 100%; } -.btn-group-vertical > .btn-group:not(:first-child), -.btn-group-vertical > .btn:not(:first-child) { +.btn-group-vertical > .btn:not(:first-child), +.btn-group-vertical > .btn-group:not(:first-child) { margin-top: -1px; } -.btn-group-vertical > .btn-group:not(:last-child) > .btn, -.btn-group-vertical > .btn:not(:last-child):not(.dropdown-toggle) { +.btn-group-vertical > .btn:not(:last-child):not(.dropdown-toggle), +.btn-group-vertical > .btn-group:not(:last-child) > .btn { border-bottom-right-radius: 0; border-bottom-left-radius: 0; } -.btn-group-vertical > .btn-group:not(:first-child) > .btn, -.btn-group-vertical > .btn:not(:first-child) { +.btn-group-vertical > .btn:not(:first-child), +.btn-group-vertical > .btn-group:not(:first-child) > .btn { border-top-left-radius: 0; border-top-right-radius: 0; } + .btn-group-toggle > .btn, .btn-group-toggle > .btn-group > .btn { margin-bottom: 0; } -.btn-group-toggle > .btn input[type="checkbox"], .btn-group-toggle > .btn input[type="radio"], -.btn-group-toggle > .btn-group > .btn input[type="checkbox"], -.btn-group-toggle > .btn-group > .btn input[type="radio"] { +.btn-group-toggle > .btn input[type="checkbox"], +.btn-group-toggle > .btn-group > .btn input[type="radio"], +.btn-group-toggle > .btn-group > .btn input[type="checkbox"] { position: absolute; clip: rect(0, 0, 0, 0); pointer-events: none; } + .input-group { position: relative; display: flex; @@ -3140,45 +3397,40 @@ input[type="submit"].btn-block { align-items: stretch; width: 100%; } -.input-group > .custom-file, -.input-group > .custom-select, .input-group > .form-control, -.input-group > .form-control-plaintext { +.input-group > .form-control-plaintext, +.input-group > .custom-select, +.input-group > .custom-file { position: relative; flex: 1 1 auto; width: 1%; min-width: 0; margin-bottom: 0; } -.input-group > .custom-file + .custom-file, -.input-group > .custom-file + .custom-select, -.input-group > .custom-file + .form-control, -.input-group > .custom-select + .custom-file, -.input-group > .custom-select + .custom-select, -.input-group > .custom-select + .form-control, -.input-group > .form-control + .custom-file, -.input-group > .form-control + .custom-select, .input-group > .form-control + .form-control, -.input-group > .form-control-plaintext + .custom-file, +.input-group > .form-control + .custom-select, +.input-group > .form-control + .custom-file, +.input-group > .form-control-plaintext + .form-control, .input-group > .form-control-plaintext + .custom-select, -.input-group > .form-control-plaintext + .form-control { +.input-group > .form-control-plaintext + .custom-file, +.input-group > .custom-select + .form-control, +.input-group > .custom-select + .custom-select, +.input-group > .custom-select + .custom-file, +.input-group > .custom-file + .form-control, +.input-group > .custom-file + .custom-select, +.input-group > .custom-file + .custom-file { margin-left: -1px; } -.input-group > .custom-file .custom-file-input:focus ~ .custom-file-label, +.input-group > .form-control:focus, .input-group > .custom-select:focus, -.input-group > .form-control:focus { +.input-group > .custom-file .custom-file-input:focus ~ .custom-file-label { z-index: 3; } .input-group > .custom-file .custom-file-input:focus { z-index: 4; } -.input-group > .custom-select:not(:last-child), -.input-group > .form-control:not(:last-child) { - border-top-right-radius: 0; - border-bottom-right-radius: 0; -} -.input-group > .custom-select:not(:first-child), -.input-group > .form-control:not(:first-child) { +.input-group > .form-control:not(:first-child), +.input-group > .custom-select:not(:first-child) { border-top-left-radius: 0; border-bottom-left-radius: 0; } @@ -3195,35 +3447,61 @@ input[type="submit"].btn-block { border-top-left-radius: 0; border-bottom-left-radius: 0; } -.input-group-append, -.input-group-prepend { +.input-group:not(.has-validation) > .form-control:not(:last-child), +.input-group:not(.has-validation) > .custom-select:not(:last-child), +.input-group:not(.has-validation) + > .custom-file:not(:last-child) + .custom-file-label, +.input-group:not(.has-validation) + > .custom-file:not(:last-child) + .custom-file-label::after { + border-top-right-radius: 0; + border-bottom-right-radius: 0; +} +.input-group.has-validation > .form-control:nth-last-child(n + 3), +.input-group.has-validation > .custom-select:nth-last-child(n + 3), +.input-group.has-validation + > .custom-file:nth-last-child(n + 3) + .custom-file-label, +.input-group.has-validation + > .custom-file:nth-last-child(n + 3) + .custom-file-label::after { + border-top-right-radius: 0; + border-bottom-right-radius: 0; +} + +.input-group-prepend, +.input-group-append { display: flex; } -.input-group-append .btn, -.input-group-prepend .btn { +.input-group-prepend .btn, +.input-group-append .btn { position: relative; z-index: 2; } -.input-group-append .btn:focus, -.input-group-prepend .btn:focus { +.input-group-prepend .btn:focus, +.input-group-append .btn:focus { z-index: 3; } -.input-group-append .btn + .btn, -.input-group-append .btn + .input-group-text, -.input-group-append .input-group-text + .btn, -.input-group-append .input-group-text + .input-group-text, .input-group-prepend .btn + .btn, .input-group-prepend .btn + .input-group-text, +.input-group-prepend .input-group-text + .input-group-text, .input-group-prepend .input-group-text + .btn, -.input-group-prepend .input-group-text + .input-group-text { +.input-group-append .btn + .btn, +.input-group-append .btn + .input-group-text, +.input-group-append .input-group-text + .input-group-text, +.input-group-append .input-group-text + .btn { margin-left: -1px; } + .input-group-prepend { margin-right: -1px; } + .input-group-append { margin-left: -1px; } + .input-group-text { display: flex; align-items: center; @@ -3239,84 +3517,102 @@ input[type="submit"].btn-block { border: 1px solid #222; border-radius: 0.25rem; } -.input-group-text input[type="checkbox"], -.input-group-text input[type="radio"] { +.input-group-text input[type="radio"], +.input-group-text input[type="checkbox"] { margin-top: 0; } -.input-group-lg > .custom-select, -.input-group-lg > .form-control:not(textarea) { + +.input-group-lg > .form-control:not(textarea), +.input-group-lg > .custom-select { height: calc(1.5em + 1rem + 2px); } -.input-group-lg > .custom-select, + .input-group-lg > .form-control, -.input-group-lg > .input-group-append > .btn, +.input-group-lg > .custom-select, +.input-group-lg > .input-group-prepend > .input-group-text, .input-group-lg > .input-group-append > .input-group-text, .input-group-lg > .input-group-prepend > .btn, -.input-group-lg > .input-group-prepend > .input-group-text { +.input-group-lg > .input-group-append > .btn { padding: 0.5rem 1rem; - font-size: 1.17188rem; + font-size: 1.171875rem; line-height: 1.5; border-radius: 0.3rem; } -.input-group-sm > .custom-select, -.input-group-sm > .form-control:not(textarea) { + +.input-group-sm > .form-control:not(textarea), +.input-group-sm > .custom-select { height: calc(1.5em + 0.5rem + 2px); } -.input-group-sm > .custom-select, + .input-group-sm > .form-control, -.input-group-sm > .input-group-append > .btn, +.input-group-sm > .custom-select, +.input-group-sm > .input-group-prepend > .input-group-text, .input-group-sm > .input-group-append > .input-group-text, .input-group-sm > .input-group-prepend > .btn, -.input-group-sm > .input-group-prepend > .input-group-text { +.input-group-sm > .input-group-append > .btn { padding: 0.25rem 0.5rem; - font-size: 0.82031rem; + font-size: 0.8203125rem; line-height: 1.5; border-radius: 0.2rem; } + .input-group-lg > .custom-select, .input-group-sm > .custom-select { padding-right: 1.75rem; } + +.input-group > .input-group-prepend > .btn, +.input-group > .input-group-prepend > .input-group-text, +.input-group:not(.has-validation) > .input-group-append:not(:last-child) > .btn, +.input-group:not(.has-validation) + > .input-group-append:not(:last-child) + > .input-group-text, +.input-group.has-validation > .input-group-append:nth-last-child(n + 3) > .btn, +.input-group.has-validation + > .input-group-append:nth-last-child(n + 3) + > .input-group-text, .input-group > .input-group-append:last-child > .btn:not(:last-child):not(.dropdown-toggle), .input-group > .input-group-append:last-child - > .input-group-text:not(:last-child), -.input-group > .input-group-append:not(:last-child) > .btn, -.input-group > .input-group-append:not(:last-child) > .input-group-text, -.input-group > .input-group-prepend > .btn, -.input-group > .input-group-prepend > .input-group-text { + > .input-group-text:not(:last-child) { border-top-right-radius: 0; border-bottom-right-radius: 0; } + .input-group > .input-group-append > .btn, .input-group > .input-group-append > .input-group-text, +.input-group > .input-group-prepend:not(:first-child) > .btn, +.input-group > .input-group-prepend:not(:first-child) > .input-group-text, .input-group > .input-group-prepend:first-child > .btn:not(:first-child), .input-group > .input-group-prepend:first-child - > .input-group-text:not(:first-child), -.input-group > .input-group-prepend:not(:first-child) > .btn, -.input-group > .input-group-prepend:not(:first-child) > .input-group-text { + > .input-group-text:not(:first-child) { border-top-left-radius: 0; border-bottom-left-radius: 0; } + .custom-control { position: relative; + z-index: 1; display: block; min-height: 1.40625rem; padding-left: 1.5rem; + print-color-adjust: exact; } + .custom-control-inline { display: inline-flex; margin-right: 1rem; } + .custom-control-input { position: absolute; left: 0; z-index: -1; width: 1rem; - height: 1.20312rem; + height: 1.203125rem; opacity: 0; } .custom-control-input:checked ~ .custom-control-label::before { @@ -3335,14 +3631,15 @@ input[type="submit"].btn-block { background-color: #97b3d2; border-color: #97b3d2; } -.custom-control-input:disabled ~ .custom-control-label, -.custom-control-input[disabled] ~ .custom-control-label { +.custom-control-input[disabled] ~ .custom-control-label, +.custom-control-input:disabled ~ .custom-control-label { color: #888; } -.custom-control-input:disabled ~ .custom-control-label::before, -.custom-control-input[disabled] ~ .custom-control-label::before { +.custom-control-input[disabled] ~ .custom-control-label::before, +.custom-control-input:disabled ~ .custom-control-label::before { background-color: #2b2b2b; } + .custom-control-label { position: relative; margin-bottom: 0; @@ -3350,7 +3647,7 @@ input[type="submit"].btn-block { } .custom-control-label::before { position: absolute; - top: 0.20312rem; + top: 0.203125rem; left: -1.5rem; display: block; width: 1rem; @@ -3358,18 +3655,19 @@ input[type="submit"].btn-block { pointer-events: none; content: ""; background-color: #444; - border: #adb5bd solid 1px; + border: 1px solid #adb5bd; } .custom-control-label::after { position: absolute; - top: 0.20312rem; + top: 0.203125rem; left: -1.5rem; display: block; width: 1rem; height: 1rem; content: ""; - background: no-repeat 50%/50% 50%; + background: 50%/50% 50% no-repeat; } + .custom-checkbox .custom-control-label::before { border-radius: 0.25rem; } @@ -3397,6 +3695,7 @@ input[type="submit"].btn-block { ~ .custom-control-label::before { background-color: rgba(55, 90, 127, 0.5); } + .custom-radio .custom-control-label::before { border-radius: 50%; } @@ -3408,6 +3707,7 @@ input[type="submit"].btn-block { ~ .custom-control-label::before { background-color: rgba(55, 90, 127, 0.5); } + .custom-switch { padding-left: 2.25rem; } @@ -3418,7 +3718,7 @@ input[type="submit"].btn-block { border-radius: 0.5rem; } .custom-switch .custom-control-label::after { - top: calc(0.20312rem + 2px); + top: calc(0.203125rem + 2px); left: calc(-2.25rem + 2px); width: calc(1rem - 4px); height: calc(1rem - 4px); @@ -3441,6 +3741,7 @@ input[type="submit"].btn-block { ~ .custom-control-label::before { background-color: rgba(55, 90, 127, 0.5); } + .custom-select { display: inline-block; width: 100%; @@ -3453,7 +3754,7 @@ input[type="submit"].btn-block { vertical-align: middle; background: #444 url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='4' height='5' viewBox='0 0 4 5'%3e%3cpath fill='%23303030' d='M2 0L0 2h4zm0 5L0 3h4z'/%3e%3c/svg%3e") - no-repeat right 0.75rem center/8px 10px; + right 0.75rem center/8px 10px no-repeat; border: 1px solid #222; border-radius: 0.25rem; appearance: none; @@ -3484,20 +3785,23 @@ input[type="submit"].btn-block { color: transparent; text-shadow: 0 0 0 #fff; } + .custom-select-sm { height: calc(1.5em + 0.5rem + 2px); padding-top: 0.25rem; padding-bottom: 0.25rem; padding-left: 0.5rem; - font-size: 0.82031rem; + font-size: 0.8203125rem; } + .custom-select-lg { height: calc(1.5em + 1rem + 2px); padding-top: 0.5rem; padding-bottom: 0.5rem; padding-left: 1rem; - font-size: 1.17188rem; + font-size: 1.171875rem; } + .custom-file { position: relative; display: inline-block; @@ -3505,20 +3809,22 @@ input[type="submit"].btn-block { height: calc(1.5em + 0.75rem + 2px); margin-bottom: 0; } + .custom-file-input { position: relative; z-index: 2; width: 100%; height: calc(1.5em + 0.75rem + 2px); margin: 0; + overflow: hidden; opacity: 0; } .custom-file-input:focus ~ .custom-file-label { border-color: #739ac2; box-shadow: 0 0 0 0.2rem rgba(55, 90, 127, 0.25); } -.custom-file-input:disabled ~ .custom-file-label, -.custom-file-input[disabled] ~ .custom-file-label { +.custom-file-input[disabled] ~ .custom-file-label, +.custom-file-input:disabled ~ .custom-file-label { background-color: #2b2b2b; } .custom-file-input:lang(en) ~ .custom-file-label::after { @@ -3527,6 +3833,7 @@ input[type="submit"].btn-block { .custom-file-input ~ .custom-file-label[data-browse]::after { content: attr(data-browse); } + .custom-file-label { position: absolute; top: 0; @@ -3535,6 +3842,7 @@ input[type="submit"].btn-block { z-index: 1; height: calc(1.5em + 0.75rem + 2px); padding: 0.375rem 0.75rem; + overflow: hidden; font-weight: 400; line-height: 1.5; color: #adb5bd; @@ -3558,6 +3866,7 @@ input[type="submit"].btn-block { border-left: inherit; border-radius: 0 0.25rem 0.25rem 0; } + .custom-range { width: 100%; height: 1.4rem; @@ -3689,6 +3998,7 @@ input[type="submit"].btn-block { .custom-range:disabled::-ms-thumb { background-color: #adb5bd; } + .custom-control-label::before, .custom-file-label, .custom-select { @@ -3702,6 +4012,7 @@ input[type="submit"].btn-block { transition: none; } } + .nav { display: flex; flex-wrap: wrap; @@ -3709,12 +4020,13 @@ input[type="submit"].btn-block { margin-bottom: 0; list-style: none; } + .nav-link { display: block; padding: 0.5rem 2rem; } -.nav-link:focus, -.nav-link:hover { +.nav-link:hover, +.nav-link:focus { text-decoration: none; } .nav-link.disabled { @@ -3722,19 +4034,20 @@ input[type="submit"].btn-block { pointer-events: none; cursor: default; } + .nav-tabs { border-bottom: 1px solid #444; } -.nav-tabs .nav-item { - margin-bottom: -1px; -} .nav-tabs .nav-link { + margin-bottom: -1px; + background-color: transparent; border: 1px solid transparent; border-top-left-radius: 0.25rem; border-top-right-radius: 0.25rem; } -.nav-tabs .nav-link:focus, -.nav-tabs .nav-link:hover { +.nav-tabs .nav-link:hover, +.nav-tabs .nav-link:focus { + isolation: isolate; border-color: #444 #444 transparent; } .nav-tabs .nav-link.disabled { @@ -3742,8 +4055,8 @@ input[type="submit"].btn-block { background-color: transparent; border-color: transparent; } -.nav-tabs .nav-item.show .nav-link, -.nav-tabs .nav-link.active { +.nav-tabs .nav-link.active, +.nav-tabs .nav-item.show .nav-link { color: #fff; background-color: #222; border-color: #444 #444 transparent; @@ -3753,7 +4066,10 @@ input[type="submit"].btn-block { border-top-left-radius: 0; border-top-right-radius: 0; } + .nav-pills .nav-link { + background: none; + border: 0; border-radius: 0.25rem; } .nav-pills .nav-link.active, @@ -3761,21 +4077,27 @@ input[type="submit"].btn-block { color: #fff; background-color: #375a7f; } + +.nav-fill > .nav-link, .nav-fill .nav-item { flex: 1 1 auto; text-align: center; } + +.nav-justified > .nav-link, .nav-justified .nav-item { flex-basis: 0; flex-grow: 1; text-align: center; } + .tab-content > .tab-pane { display: none; } .tab-content > .active { display: block; } + .navbar { position: relative; display: flex; @@ -3786,9 +4108,9 @@ input[type="submit"].btn-block { } .navbar .container, .navbar .container-fluid, -.navbar .container-lg, -.navbar .container-md, .navbar .container-sm, +.navbar .container-md, +.navbar .container-lg, .navbar .container-xl { display: flex; flex-wrap: wrap; @@ -3797,17 +4119,18 @@ input[type="submit"].btn-block { } .navbar-brand { display: inline-block; - padding-top: 0.32422rem; - padding-bottom: 0.32422rem; + padding-top: 0.32421875rem; + padding-bottom: 0.32421875rem; margin-right: 1rem; - font-size: 1.17188rem; + font-size: 1.171875rem; line-height: inherit; white-space: nowrap; } -.navbar-brand:focus, -.navbar-brand:hover { +.navbar-brand:hover, +.navbar-brand:focus { text-decoration: none; } + .navbar-nav { display: flex; flex-direction: column; @@ -3823,43 +4146,52 @@ input[type="submit"].btn-block { position: static; float: none; } + .navbar-text { display: inline-block; padding-top: 0.5rem; padding-bottom: 0.5rem; } + .navbar-collapse { flex-basis: 100%; flex-grow: 1; align-items: center; } + .navbar-toggler { padding: 0.25rem 0.75rem; - font-size: 1.17188rem; + font-size: 1.171875rem; line-height: 1; background-color: transparent; border: 1px solid transparent; border-radius: 0.25rem; } -.navbar-toggler:focus, -.navbar-toggler:hover { +.navbar-toggler:hover, +.navbar-toggler:focus { text-decoration: none; } + .navbar-toggler-icon { display: inline-block; width: 1.5em; height: 1.5em; vertical-align: middle; content: ""; - background: no-repeat center center; - background-size: 100% 100%; + background: 50%/100% 100% no-repeat; } + +.navbar-nav-scroll { + max-height: 75vh; + overflow-y: auto; +} + @media (max-width: 575.98px) { .navbar-expand-sm > .container, .navbar-expand-sm > .container-fluid, - .navbar-expand-sm > .container-lg, - .navbar-expand-sm > .container-md, .navbar-expand-sm > .container-sm, + .navbar-expand-sm > .container-md, + .navbar-expand-sm > .container-lg, .navbar-expand-sm > .container-xl { padding-right: 0; padding-left: 0; @@ -3882,12 +4214,15 @@ input[type="submit"].btn-block { } .navbar-expand-sm > .container, .navbar-expand-sm > .container-fluid, - .navbar-expand-sm > .container-lg, - .navbar-expand-sm > .container-md, .navbar-expand-sm > .container-sm, + .navbar-expand-sm > .container-md, + .navbar-expand-sm > .container-lg, .navbar-expand-sm > .container-xl { flex-wrap: nowrap; } + .navbar-expand-sm .navbar-nav-scroll { + overflow: visible; + } .navbar-expand-sm .navbar-collapse { display: flex !important; flex-basis: auto; @@ -3899,9 +4234,9 @@ input[type="submit"].btn-block { @media (max-width: 767.98px) { .navbar-expand-md > .container, .navbar-expand-md > .container-fluid, - .navbar-expand-md > .container-lg, - .navbar-expand-md > .container-md, .navbar-expand-md > .container-sm, + .navbar-expand-md > .container-md, + .navbar-expand-md > .container-lg, .navbar-expand-md > .container-xl { padding-right: 0; padding-left: 0; @@ -3924,12 +4259,15 @@ input[type="submit"].btn-block { } .navbar-expand-md > .container, .navbar-expand-md > .container-fluid, - .navbar-expand-md > .container-lg, - .navbar-expand-md > .container-md, .navbar-expand-md > .container-sm, + .navbar-expand-md > .container-md, + .navbar-expand-md > .container-lg, .navbar-expand-md > .container-xl { flex-wrap: nowrap; } + .navbar-expand-md .navbar-nav-scroll { + overflow: visible; + } .navbar-expand-md .navbar-collapse { display: flex !important; flex-basis: auto; @@ -3941,9 +4279,9 @@ input[type="submit"].btn-block { @media (max-width: 991.98px) { .navbar-expand-lg > .container, .navbar-expand-lg > .container-fluid, - .navbar-expand-lg > .container-lg, - .navbar-expand-lg > .container-md, .navbar-expand-lg > .container-sm, + .navbar-expand-lg > .container-md, + .navbar-expand-lg > .container-lg, .navbar-expand-lg > .container-xl { padding-right: 0; padding-left: 0; @@ -3966,12 +4304,15 @@ input[type="submit"].btn-block { } .navbar-expand-lg > .container, .navbar-expand-lg > .container-fluid, - .navbar-expand-lg > .container-lg, - .navbar-expand-lg > .container-md, .navbar-expand-lg > .container-sm, + .navbar-expand-lg > .container-md, + .navbar-expand-lg > .container-lg, .navbar-expand-lg > .container-xl { flex-wrap: nowrap; } + .navbar-expand-lg .navbar-nav-scroll { + overflow: visible; + } .navbar-expand-lg .navbar-collapse { display: flex !important; flex-basis: auto; @@ -3983,9 +4324,9 @@ input[type="submit"].btn-block { @media (max-width: 1199.98px) { .navbar-expand-xl > .container, .navbar-expand-xl > .container-fluid, - .navbar-expand-xl > .container-lg, - .navbar-expand-xl > .container-md, .navbar-expand-xl > .container-sm, + .navbar-expand-xl > .container-md, + .navbar-expand-xl > .container-lg, .navbar-expand-xl > .container-xl { padding-right: 0; padding-left: 0; @@ -4008,12 +4349,15 @@ input[type="submit"].btn-block { } .navbar-expand-xl > .container, .navbar-expand-xl > .container-fluid, - .navbar-expand-xl > .container-lg, - .navbar-expand-xl > .container-md, .navbar-expand-xl > .container-sm, + .navbar-expand-xl > .container-md, + .navbar-expand-xl > .container-lg, .navbar-expand-xl > .container-xl { flex-wrap: nowrap; } + .navbar-expand-xl .navbar-nav-scroll { + overflow: visible; + } .navbar-expand-xl .navbar-collapse { display: flex !important; flex-basis: auto; @@ -4028,9 +4372,9 @@ input[type="submit"].btn-block { } .navbar-expand > .container, .navbar-expand > .container-fluid, -.navbar-expand > .container-lg, -.navbar-expand > .container-md, .navbar-expand > .container-sm, +.navbar-expand > .container-md, +.navbar-expand > .container-lg, .navbar-expand > .container-xl { padding-right: 0; padding-left: 0; @@ -4047,12 +4391,15 @@ input[type="submit"].btn-block { } .navbar-expand > .container, .navbar-expand > .container-fluid, -.navbar-expand > .container-lg, -.navbar-expand > .container-md, .navbar-expand > .container-sm, +.navbar-expand > .container-md, +.navbar-expand > .container-lg, .navbar-expand > .container-xl { flex-wrap: nowrap; } +.navbar-expand .navbar-nav-scroll { + overflow: visible; +} .navbar-expand .navbar-collapse { display: flex !important; flex-basis: auto; @@ -4060,27 +4407,28 @@ input[type="submit"].btn-block { .navbar-expand .navbar-toggler { display: none; } + .navbar-light .navbar-brand { color: #fff; } -.navbar-light .navbar-brand:focus, -.navbar-light .navbar-brand:hover { +.navbar-light .navbar-brand:hover, +.navbar-light .navbar-brand:focus { color: #fff; } .navbar-light .navbar-nav .nav-link { color: rgba(255, 255, 255, 0.6); } -.navbar-light .navbar-nav .nav-link:focus, -.navbar-light .navbar-nav .nav-link:hover { +.navbar-light .navbar-nav .nav-link:hover, +.navbar-light .navbar-nav .nav-link:focus { color: #fff; } .navbar-light .navbar-nav .nav-link.disabled { color: rgba(0, 0, 0, 0.3); } +.navbar-light .navbar-nav .show > .nav-link, .navbar-light .navbar-nav .active > .nav-link, -.navbar-light .navbar-nav .nav-link.active, .navbar-light .navbar-nav .nav-link.show, -.navbar-light .navbar-nav .show > .nav-link { +.navbar-light .navbar-nav .nav-link.active { color: #fff; } .navbar-light .navbar-toggler { @@ -4096,31 +4444,32 @@ input[type="submit"].btn-block { .navbar-light .navbar-text a { color: #fff; } -.navbar-light .navbar-text a:focus, -.navbar-light .navbar-text a:hover { +.navbar-light .navbar-text a:hover, +.navbar-light .navbar-text a:focus { color: #fff; } + .navbar-dark .navbar-brand { color: #fff; } -.navbar-dark .navbar-brand:focus, -.navbar-dark .navbar-brand:hover { +.navbar-dark .navbar-brand:hover, +.navbar-dark .navbar-brand:focus { color: #fff; } .navbar-dark .navbar-nav .nav-link { color: rgba(255, 255, 255, 0.6); } -.navbar-dark .navbar-nav .nav-link:focus, -.navbar-dark .navbar-nav .nav-link:hover { +.navbar-dark .navbar-nav .nav-link:hover, +.navbar-dark .navbar-nav .nav-link:focus { color: #fff; } .navbar-dark .navbar-nav .nav-link.disabled { color: rgba(255, 255, 255, 0.25); } +.navbar-dark .navbar-nav .show > .nav-link, .navbar-dark .navbar-nav .active > .nav-link, -.navbar-dark .navbar-nav .nav-link.active, .navbar-dark .navbar-nav .nav-link.show, -.navbar-dark .navbar-nav .show > .nav-link { +.navbar-dark .navbar-nav .nav-link.active { color: #fff; } .navbar-dark .navbar-toggler { @@ -4136,10 +4485,11 @@ input[type="submit"].btn-block { .navbar-dark .navbar-text a { color: #fff; } -.navbar-dark .navbar-text a:focus, -.navbar-dark .navbar-text a:hover { +.navbar-dark .navbar-text a:hover, +.navbar-dark .navbar-text a:focus { color: #fff; } + .card { position: relative; display: flex; @@ -4169,27 +4519,37 @@ input[type="submit"].btn-block { border-bottom-right-radius: calc(0.25rem - 1px); border-bottom-left-radius: calc(0.25rem - 1px); } +.card > .card-header + .list-group, +.card > .list-group + .card-footer { + border-top: 0; +} + .card-body { flex: 1 1 auto; min-height: 1px; padding: 1.25rem; } + .card-title { margin-bottom: 0.75rem; } + .card-subtitle { margin-top: -0.375rem; margin-bottom: 0; } + .card-text:last-child { margin-bottom: 0; } + .card-link:hover { text-decoration: none; } .card-link + .card-link { margin-left: 1.25rem; } + .card-header { padding: 0.75rem 1.25rem; margin-bottom: 0; @@ -4199,9 +4559,7 @@ input[type="submit"].btn-block { .card-header:first-child { border-radius: calc(0.25rem - 1px) calc(0.25rem - 1px) 0 0; } -.card-header + .list-group .list-group-item:first-child { - border-top: 0; -} + .card-footer { padding: 0.75rem 1.25rem; background-color: #444; @@ -4210,16 +4568,19 @@ input[type="submit"].btn-block { .card-footer:last-child { border-radius: 0 0 calc(0.25rem - 1px) calc(0.25rem - 1px); } + .card-header-tabs { margin-right: -0.625rem; margin-bottom: -0.75rem; margin-left: -0.625rem; border-bottom: 0; } + .card-header-pills { margin-right: -0.625rem; margin-left: -0.625rem; } + .card-img-overlay { position: absolute; top: 0; @@ -4227,23 +4588,28 @@ input[type="submit"].btn-block { bottom: 0; left: 0; padding: 1.25rem; + border-radius: calc(0.25rem - 1px); } + .card-img, -.card-img-bottom, -.card-img-top { +.card-img-top, +.card-img-bottom { flex-shrink: 0; width: 100%; } + .card-img, .card-img-top { border-top-left-radius: calc(0.25rem - 1px); border-top-right-radius: calc(0.25rem - 1px); } + .card-img, .card-img-bottom { border-bottom-right-radius: calc(0.25rem - 1px); border-bottom-left-radius: calc(0.25rem - 1px); } + .card-deck .card { margin-bottom: 15px; } @@ -4261,6 +4627,7 @@ input[type="submit"].btn-block { margin-left: 15px; } } + .card-group > .card { margin-bottom: 15px; } @@ -4281,27 +4648,28 @@ input[type="submit"].btn-block { border-top-right-radius: 0; border-bottom-right-radius: 0; } - .card-group > .card:not(:last-child) .card-header, - .card-group > .card:not(:last-child) .card-img-top { + .card-group > .card:not(:last-child) .card-img-top, + .card-group > .card:not(:last-child) .card-header { border-top-right-radius: 0; } - .card-group > .card:not(:last-child) .card-footer, - .card-group > .card:not(:last-child) .card-img-bottom { + .card-group > .card:not(:last-child) .card-img-bottom, + .card-group > .card:not(:last-child) .card-footer { border-bottom-right-radius: 0; } .card-group > .card:not(:first-child) { border-top-left-radius: 0; border-bottom-left-radius: 0; } - .card-group > .card:not(:first-child) .card-header, - .card-group > .card:not(:first-child) .card-img-top { + .card-group > .card:not(:first-child) .card-img-top, + .card-group > .card:not(:first-child) .card-header { border-top-left-radius: 0; } - .card-group > .card:not(:first-child) .card-footer, - .card-group > .card:not(:first-child) .card-img-bottom { + .card-group > .card:not(:first-child) .card-img-bottom, + .card-group > .card:not(:first-child) .card-footer { border-bottom-left-radius: 0; } } + .card-columns .card { margin-bottom: 0.75rem; } @@ -4317,6 +4685,10 @@ input[type="submit"].btn-block { width: 100%; } } + +.accordion { + overflow-anchor: none; +} .accordion > .card { overflow: hidden; } @@ -4333,6 +4705,7 @@ input[type="submit"].btn-block { border-radius: 0; margin-bottom: -1px; } + .breadcrumb { display: flex; flex-wrap: wrap; @@ -4342,14 +4715,12 @@ input[type="submit"].btn-block { background-color: #444; border-radius: 0.25rem; } -.breadcrumb-item { - display: flex; -} + .breadcrumb-item + .breadcrumb-item { padding-left: 0.5rem; } .breadcrumb-item + .breadcrumb-item::before { - display: inline-block; + float: left; padding-right: 0.5rem; color: #888; content: "/"; @@ -4363,12 +4734,14 @@ input[type="submit"].btn-block { .breadcrumb-item.active { color: #888; } + .pagination { display: flex; padding-left: 0; list-style: none; border-radius: 0.25rem; } + .page-link { position: relative; display: block; @@ -4391,6 +4764,7 @@ input[type="submit"].btn-block { outline: 0; box-shadow: 0 0 0 0.2rem rgba(55, 90, 127, 0.25); } + .page-item:first-child .page-link { margin-left: 0; border-top-left-radius: 0.25rem; @@ -4413,9 +4787,10 @@ input[type="submit"].btn-block { background-color: #007053; border-color: transparent; } + .pagination-lg .page-link { padding: 0.75rem 1.5rem; - font-size: 1.17188rem; + font-size: 1.171875rem; line-height: 1.5; } .pagination-lg .page-item:first-child .page-link { @@ -4426,9 +4801,10 @@ input[type="submit"].btn-block { border-top-right-radius: 0.3rem; border-bottom-right-radius: 0.3rem; } + .pagination-sm .page-link { padding: 0.25rem 0.5rem; - font-size: 0.82031rem; + font-size: 0.8203125rem; line-height: 1.5; } .pagination-sm .page-item:first-child .page-link { @@ -4439,6 +4815,7 @@ input[type="submit"].btn-block { border-top-right-radius: 0.2rem; border-bottom-right-radius: 0.2rem; } + .badge { display: inline-block; padding: 0.25em 0.4em; @@ -4457,134 +4834,146 @@ input[type="submit"].btn-block { transition: none; } } -a.badge:focus, -a.badge:hover { +a.badge:hover, +a.badge:focus { text-decoration: none; } + .badge:empty { display: none; } + .btn .badge { position: relative; top: -1px; } + .badge-pill { padding-right: 0.6em; padding-left: 0.6em; border-radius: 10rem; } + .badge-primary { color: #fff; background-color: #375a7f; } -a.badge-primary:focus, -a.badge-primary:hover { +a.badge-primary:hover, +a.badge-primary:focus { color: #fff; background-color: #28415b; } -a.badge-primary.focus, -a.badge-primary:focus { +a.badge-primary:focus, +a.badge-primary.focus { outline: 0; box-shadow: 0 0 0 0.2rem rgba(55, 90, 127, 0.5); } + .badge-secondary { color: #fff; background-color: #444; } -a.badge-secondary:focus, -a.badge-secondary:hover { +a.badge-secondary:hover, +a.badge-secondary:focus { color: #fff; background-color: #2b2b2b; } -a.badge-secondary.focus, -a.badge-secondary:focus { +a.badge-secondary:focus, +a.badge-secondary.focus { outline: 0; box-shadow: 0 0 0 0.2rem rgba(68, 68, 68, 0.5); } + .badge-success { color: #fff; background-color: #00bc8c; } -a.badge-success:focus, -a.badge-success:hover { +a.badge-success:hover, +a.badge-success:focus { color: #fff; background-color: #008966; } -a.badge-success.focus, -a.badge-success:focus { +a.badge-success:focus, +a.badge-success.focus { outline: 0; box-shadow: 0 0 0 0.2rem rgba(0, 188, 140, 0.5); } + .badge-info { color: #fff; background-color: #3498db; } -a.badge-info:focus, -a.badge-info:hover { +a.badge-info:hover, +a.badge-info:focus { color: #fff; background-color: #217dbb; } -a.badge-info.focus, -a.badge-info:focus { +a.badge-info:focus, +a.badge-info.focus { outline: 0; box-shadow: 0 0 0 0.2rem rgba(52, 152, 219, 0.5); } + .badge-warning { color: #fff; background-color: #f39c12; } -a.badge-warning:focus, -a.badge-warning:hover { +a.badge-warning:hover, +a.badge-warning:focus { color: #fff; background-color: #c87f0a; } -a.badge-warning.focus, -a.badge-warning:focus { +a.badge-warning:focus, +a.badge-warning.focus { outline: 0; box-shadow: 0 0 0 0.2rem rgba(243, 156, 18, 0.5); } + .badge-danger { color: #fff; background-color: #e74c3c; } -a.badge-danger:focus, -a.badge-danger:hover { +a.badge-danger:hover, +a.badge-danger:focus { color: #fff; background-color: #d62c1a; } -a.badge-danger.focus, -a.badge-danger:focus { +a.badge-danger:focus, +a.badge-danger.focus { outline: 0; box-shadow: 0 0 0 0.2rem rgba(231, 76, 60, 0.5); } + .badge-light { color: #fff; background-color: #303030; } -a.badge-light:focus, -a.badge-light:hover { +a.badge-light:hover, +a.badge-light:focus { color: #fff; background-color: #171717; } -a.badge-light.focus, -a.badge-light:focus { +a.badge-light:focus, +a.badge-light.focus { outline: 0; box-shadow: 0 0 0 0.2rem rgba(48, 48, 48, 0.5); } + .badge-dark { color: #222; background-color: #dee2e6; } -a.badge-dark:focus, -a.badge-dark:hover { +a.badge-dark:hover, +a.badge-dark:focus { color: #222; background-color: #c1c9d0; } -a.badge-dark.focus, -a.badge-dark:focus { +a.badge-dark:focus, +a.badge-dark.focus { outline: 0; box-shadow: 0 0 0 0.2rem rgba(222, 226, 230, 0.5); } + .jumbotron { padding: 2rem 1rem; margin-bottom: 2rem; @@ -4596,11 +4985,13 @@ a.badge-dark:focus { padding: 4rem 2rem; } } + .jumbotron-fluid { padding-right: 0; padding-left: 0; border-radius: 0; } + .alert { position: relative; padding: 0.75rem 1.25rem; @@ -4608,12 +4999,15 @@ a.badge-dark:focus { border: 1px solid transparent; border-radius: 0.25rem; } + .alert-heading { color: inherit; } + .alert-link { font-weight: 700; } + .alert-dismissible { padding-right: 3.90625rem; } @@ -4621,9 +5015,11 @@ a.badge-dark:focus { position: absolute; top: 0; right: 0; + z-index: 2; padding: 0.75rem 1.25rem; color: inherit; } + .alert-primary { color: #1d2f42; background-color: #d7dee5; @@ -4635,6 +5031,7 @@ a.badge-dark:focus { .alert-primary .alert-link { color: #0d161f; } + .alert-secondary { color: #232323; background-color: #dadada; @@ -4646,6 +5043,7 @@ a.badge-dark:focus { .alert-secondary .alert-link { color: #0a0a0a; } + .alert-success { color: #006249; background-color: #ccf2e8; @@ -4657,6 +5055,7 @@ a.badge-dark:focus { .alert-success .alert-link { color: #002f23; } + .alert-info { color: #1b4f72; background-color: #d6eaf8; @@ -4668,6 +5067,7 @@ a.badge-dark:focus { .alert-info .alert-link { color: #113249; } + .alert-warning { color: #7e5109; background-color: #fdebd0; @@ -4679,6 +5079,7 @@ a.badge-dark:focus { .alert-warning .alert-link { color: #4e3206; } + .alert-danger { color: #78281f; background-color: #fadbd8; @@ -4690,6 +5091,7 @@ a.badge-dark:focus { .alert-danger .alert-link { color: #4f1a15; } + .alert-light { color: #191919; background-color: #d6d6d6; @@ -4699,8 +5101,9 @@ a.badge-dark:focus { border-top-color: #b8b8b8; } .alert-light .alert-link { - color: #000; + color: black; } + .alert-dark { color: #737678; background-color: #f8f9fa; @@ -4712,6 +5115,7 @@ a.badge-dark:focus { .alert-dark .alert-link { color: #5a5c5e; } + @keyframes progress-bar-stripes { from { background-position: 1rem 0; @@ -4725,10 +5129,11 @@ a.badge-dark:focus { height: 1rem; overflow: hidden; line-height: 0; - font-size: 0.70312rem; + font-size: 0.703125rem; background-color: #444; border-radius: 0.25rem; } + .progress-bar { display: flex; flex-direction: column; @@ -4745,6 +5150,7 @@ a.badge-dark:focus { transition: none; } } + .progress-bar-striped { background-image: linear-gradient( 45deg, @@ -4758,21 +5164,25 @@ a.badge-dark:focus { ); background-size: 1rem 1rem; } + .progress-bar-animated { - animation: progress-bar-stripes 1s linear infinite; + animation: 1s linear infinite progress-bar-stripes; } @media (prefers-reduced-motion: reduce) { .progress-bar-animated { animation: none; } } + .media { display: flex; align-items: flex-start; } + .media-body { flex: 1; } + .list-group { display: flex; flex-direction: column; @@ -4780,13 +5190,14 @@ a.badge-dark:focus { margin-bottom: 0; border-radius: 0.25rem; } + .list-group-item-action { width: 100%; color: #444; text-align: inherit; } -.list-group-item-action:focus, -.list-group-item-action:hover { +.list-group-item-action:hover, +.list-group-item-action:focus { z-index: 1; color: #444; text-decoration: none; @@ -4796,6 +5207,7 @@ a.badge-dark:focus { color: #dee2e6; background-color: #ebebeb; } + .list-group-item { position: relative; display: block; @@ -4830,6 +5242,7 @@ a.badge-dark:focus { margin-top: -1px; border-top-width: 1px; } + .list-group-horizontal { flex-direction: row; } @@ -4852,6 +5265,7 @@ a.badge-dark:focus { margin-left: -1px; border-left-width: 1px; } + @media (min-width: 576px) { .list-group-horizontal-sm { flex-direction: row; @@ -4957,12 +5371,13 @@ a.badge-dark:focus { .list-group-flush > .list-group-item:last-child { border-bottom-width: 0; } + .list-group-item-primary { color: #1d2f42; background-color: #c7d1db; } -.list-group-item-primary.list-group-item-action:focus, -.list-group-item-primary.list-group-item-action:hover { +.list-group-item-primary.list-group-item-action:hover, +.list-group-item-primary.list-group-item-action:focus { color: #1d2f42; background-color: #b7c4d1; } @@ -4971,12 +5386,13 @@ a.badge-dark:focus { background-color: #1d2f42; border-color: #1d2f42; } + .list-group-item-secondary { color: #232323; background-color: #cbcbcb; } -.list-group-item-secondary.list-group-item-action:focus, -.list-group-item-secondary.list-group-item-action:hover { +.list-group-item-secondary.list-group-item-action:hover, +.list-group-item-secondary.list-group-item-action:focus { color: #232323; background-color: #bebebe; } @@ -4985,12 +5401,13 @@ a.badge-dark:focus { background-color: #232323; border-color: #232323; } + .list-group-item-success { color: #006249; background-color: #b8ecdf; } -.list-group-item-success.list-group-item-action:focus, -.list-group-item-success.list-group-item-action:hover { +.list-group-item-success.list-group-item-action:hover, +.list-group-item-success.list-group-item-action:focus { color: #006249; background-color: #a4e7d6; } @@ -4999,12 +5416,13 @@ a.badge-dark:focus { background-color: #006249; border-color: #006249; } + .list-group-item-info { color: #1b4f72; background-color: #c6e2f5; } -.list-group-item-info.list-group-item-action:focus, -.list-group-item-info.list-group-item-action:hover { +.list-group-item-info.list-group-item-action:hover, +.list-group-item-info.list-group-item-action:focus { color: #1b4f72; background-color: #b0d7f1; } @@ -5013,12 +5431,13 @@ a.badge-dark:focus { background-color: #1b4f72; border-color: #1b4f72; } + .list-group-item-warning { color: #7e5109; background-color: #fce3bd; } -.list-group-item-warning.list-group-item-action:focus, -.list-group-item-warning.list-group-item-action:hover { +.list-group-item-warning.list-group-item-action:hover, +.list-group-item-warning.list-group-item-action:focus { color: #7e5109; background-color: #fbd9a5; } @@ -5027,12 +5446,13 @@ a.badge-dark:focus { background-color: #7e5109; border-color: #7e5109; } + .list-group-item-danger { color: #78281f; background-color: #f8cdc8; } -.list-group-item-danger.list-group-item-action:focus, -.list-group-item-danger.list-group-item-action:hover { +.list-group-item-danger.list-group-item-action:hover, +.list-group-item-danger.list-group-item-action:focus { color: #78281f; background-color: #f5b8b1; } @@ -5041,12 +5461,13 @@ a.badge-dark:focus { background-color: #78281f; border-color: #78281f; } + .list-group-item-light { color: #191919; background-color: #c5c5c5; } -.list-group-item-light.list-group-item-action:focus, -.list-group-item-light.list-group-item-action:hover { +.list-group-item-light.list-group-item-action:hover, +.list-group-item-light.list-group-item-action:focus { color: #191919; background-color: #b8b8b8; } @@ -5055,12 +5476,13 @@ a.badge-dark:focus { background-color: #191919; border-color: #191919; } + .list-group-item-dark { color: #737678; background-color: #f6f7f8; } -.list-group-item-dark.list-group-item-action:focus, -.list-group-item-dark.list-group-item-action:hover { +.list-group-item-dark.list-group-item-action:hover, +.list-group-item-dark.list-group-item-action:focus { color: #737678; background-color: #e8eaed; } @@ -5069,6 +5491,7 @@ a.badge-dark:focus { background-color: #737678; border-color: #737678; } + .close { float: right; font-size: 1.40625rem; @@ -5082,27 +5505,29 @@ a.badge-dark:focus { color: #fff; text-decoration: none; } -.close:not(:disabled):not(.disabled):focus, -.close:not(:disabled):not(.disabled):hover { +.close:not(:disabled):not(.disabled):hover, +.close:not(:disabled):not(.disabled):focus { opacity: 0.75; } + button.close { padding: 0; background-color: transparent; border: 0; } + a.close.disabled { pointer-events: none; } + .toast { + flex-basis: 350px; max-width: 350px; - overflow: hidden; font-size: 0.875rem; background-color: #444; background-clip: padding-box; border: 1px solid rgba(0, 0, 0, 0.1); box-shadow: 0 0.25rem 0.75rem rgba(0, 0, 0, 0.1); - backdrop-filter: blur(10px); opacity: 0; border-radius: 0.25rem; } @@ -5119,6 +5544,7 @@ a.close.disabled { .toast.hide { display: none; } + .toast-header { display: flex; align-items: center; @@ -5127,10 +5553,14 @@ a.close.disabled { background-color: #303030; background-clip: padding-box; border-bottom: 1px solid rgba(0, 0, 0, 0.05); + border-top-left-radius: calc(0.25rem - 1px); + border-top-right-radius: calc(0.25rem - 1px); } + .toast-body { padding: 0.75rem; } + .modal-open { overflow: hidden; } @@ -5138,6 +5568,7 @@ a.close.disabled { overflow-x: hidden; overflow-y: auto; } + .modal { position: fixed; top: 0; @@ -5149,6 +5580,7 @@ a.close.disabled { overflow: hidden; outline: 0; } + .modal-dialog { position: relative; width: auto; @@ -5170,6 +5602,7 @@ a.close.disabled { .modal.modal-static .modal-dialog { transform: scale(1.02); } + .modal-dialog-scrollable { display: flex; max-height: calc(100% - 1rem); @@ -5178,13 +5611,14 @@ a.close.disabled { max-height: calc(100vh - 1rem); overflow: hidden; } -.modal-dialog-scrollable .modal-footer, -.modal-dialog-scrollable .modal-header { +.modal-dialog-scrollable .modal-header, +.modal-dialog-scrollable .modal-footer { flex-shrink: 0; } .modal-dialog-scrollable .modal-body { overflow-y: auto; } + .modal-dialog-centered { display: flex; align-items: center; @@ -5207,6 +5641,7 @@ a.close.disabled { .modal-dialog-centered.modal-dialog-scrollable::before { content: none; } + .modal-content { position: relative; display: flex; @@ -5219,6 +5654,7 @@ a.close.disabled { border-radius: 0.3rem; outline: 0; } + .modal-backdrop { position: fixed; top: 0; @@ -5234,6 +5670,7 @@ a.close.disabled { .modal-backdrop.show { opacity: 0.5; } + .modal-header { display: flex; align-items: flex-start; @@ -5247,15 +5684,18 @@ a.close.disabled { padding: 1rem 1rem; margin: -1rem -1rem -1rem auto; } + .modal-title { margin-bottom: 0; line-height: 1.5; } + .modal-body { position: relative; flex: 1 1 auto; padding: 1rem; } + .modal-footer { display: flex; flex-wrap: wrap; @@ -5269,6 +5709,7 @@ a.close.disabled { .modal-footer > * { margin: 0.25rem; } + .modal-scrollbar-measure { position: absolute; top: -9999px; @@ -5276,6 +5717,7 @@ a.close.disabled { height: 50px; overflow: scroll; } + @media (min-width: 576px) { .modal-dialog { max-width: 500px; @@ -5314,7 +5756,7 @@ a.close.disabled { z-index: 1070; display: block; margin: 0; - font-family: Lato, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, + font-family: "Lato", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; font-style: normal; @@ -5327,10 +5769,10 @@ a.close.disabled { text-transform: none; letter-spacing: normal; word-break: normal; - word-spacing: normal; white-space: normal; + word-spacing: normal; line-break: auto; - font-size: 0.82031rem; + font-size: 0.8203125rem; word-wrap: break-word; opacity: 0; } @@ -5349,66 +5791,71 @@ a.close.disabled { border-color: transparent; border-style: solid; } -.bs-tooltip-auto[x-placement^="top"], -.bs-tooltip-top { + +.bs-tooltip-top, +.bs-tooltip-auto[x-placement^="top"] { padding: 0.4rem 0; } -.bs-tooltip-auto[x-placement^="top"] .arrow, -.bs-tooltip-top .arrow { +.bs-tooltip-top .arrow, +.bs-tooltip-auto[x-placement^="top"] .arrow { bottom: 0; } -.bs-tooltip-auto[x-placement^="top"] .arrow::before, -.bs-tooltip-top .arrow::before { +.bs-tooltip-top .arrow::before, +.bs-tooltip-auto[x-placement^="top"] .arrow::before { top: 0; border-width: 0.4rem 0.4rem 0; border-top-color: #000; } -.bs-tooltip-auto[x-placement^="right"], -.bs-tooltip-right { + +.bs-tooltip-right, +.bs-tooltip-auto[x-placement^="right"] { padding: 0 0.4rem; } -.bs-tooltip-auto[x-placement^="right"] .arrow, -.bs-tooltip-right .arrow { +.bs-tooltip-right .arrow, +.bs-tooltip-auto[x-placement^="right"] .arrow { left: 0; width: 0.4rem; height: 0.8rem; } -.bs-tooltip-auto[x-placement^="right"] .arrow::before, -.bs-tooltip-right .arrow::before { +.bs-tooltip-right .arrow::before, +.bs-tooltip-auto[x-placement^="right"] .arrow::before { right: 0; border-width: 0.4rem 0.4rem 0.4rem 0; border-right-color: #000; } -.bs-tooltip-auto[x-placement^="bottom"], -.bs-tooltip-bottom { + +.bs-tooltip-bottom, +.bs-tooltip-auto[x-placement^="bottom"] { padding: 0.4rem 0; } -.bs-tooltip-auto[x-placement^="bottom"] .arrow, -.bs-tooltip-bottom .arrow { +.bs-tooltip-bottom .arrow, +.bs-tooltip-auto[x-placement^="bottom"] .arrow { top: 0; } -.bs-tooltip-auto[x-placement^="bottom"] .arrow::before, -.bs-tooltip-bottom .arrow::before { +.bs-tooltip-bottom .arrow::before, +.bs-tooltip-auto[x-placement^="bottom"] .arrow::before { bottom: 0; border-width: 0 0.4rem 0.4rem; border-bottom-color: #000; } -.bs-tooltip-auto[x-placement^="left"], -.bs-tooltip-left { + +.bs-tooltip-left, +.bs-tooltip-auto[x-placement^="left"] { padding: 0 0.4rem; } -.bs-tooltip-auto[x-placement^="left"] .arrow, -.bs-tooltip-left .arrow { +.bs-tooltip-left .arrow, +.bs-tooltip-auto[x-placement^="left"] .arrow { right: 0; width: 0.4rem; height: 0.8rem; } -.bs-tooltip-auto[x-placement^="left"] .arrow::before, -.bs-tooltip-left .arrow::before { +.bs-tooltip-left .arrow::before, +.bs-tooltip-auto[x-placement^="left"] .arrow::before { left: 0; border-width: 0.4rem 0 0.4rem 0.4rem; border-left-color: #000; } + .tooltip-inner { max-width: 200px; padding: 0.25rem 0.5rem; @@ -5417,6 +5864,7 @@ a.close.disabled { background-color: #000; border-radius: 0.25rem; } + .popover { position: absolute; top: 0; @@ -5424,7 +5872,7 @@ a.close.disabled { z-index: 1060; display: block; max-width: 276px; - font-family: Lato, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, + font-family: "Lato", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; font-style: normal; @@ -5437,10 +5885,10 @@ a.close.disabled { text-transform: none; letter-spacing: normal; word-break: normal; - word-spacing: normal; white-space: normal; + word-spacing: normal; line-break: auto; - font-size: 0.82031rem; + font-size: 0.8203125rem; word-wrap: break-word; background-color: #303030; background-clip: padding-box; @@ -5454,79 +5902,82 @@ a.close.disabled { height: 0.5rem; margin: 0 0.3rem; } -.popover .arrow::after, -.popover .arrow::before { +.popover .arrow::before, +.popover .arrow::after { position: absolute; display: block; content: ""; border-color: transparent; border-style: solid; } -.bs-popover-auto[x-placement^="top"], -.bs-popover-top { + +.bs-popover-top, +.bs-popover-auto[x-placement^="top"] { margin-bottom: 0.5rem; } -.bs-popover-auto[x-placement^="top"] > .arrow, -.bs-popover-top > .arrow { +.bs-popover-top > .arrow, +.bs-popover-auto[x-placement^="top"] > .arrow { bottom: calc(-0.5rem - 1px); } -.bs-popover-auto[x-placement^="top"] > .arrow::before, -.bs-popover-top > .arrow::before { +.bs-popover-top > .arrow::before, +.bs-popover-auto[x-placement^="top"] > .arrow::before { bottom: 0; border-width: 0.5rem 0.5rem 0; border-top-color: rgba(0, 0, 0, 0.25); } -.bs-popover-auto[x-placement^="top"] > .arrow::after, -.bs-popover-top > .arrow::after { +.bs-popover-top > .arrow::after, +.bs-popover-auto[x-placement^="top"] > .arrow::after { bottom: 1px; border-width: 0.5rem 0.5rem 0; border-top-color: #303030; } -.bs-popover-auto[x-placement^="right"], -.bs-popover-right { + +.bs-popover-right, +.bs-popover-auto[x-placement^="right"] { margin-left: 0.5rem; } -.bs-popover-auto[x-placement^="right"] > .arrow, -.bs-popover-right > .arrow { +.bs-popover-right > .arrow, +.bs-popover-auto[x-placement^="right"] > .arrow { left: calc(-0.5rem - 1px); width: 0.5rem; height: 1rem; margin: 0.3rem 0; } -.bs-popover-auto[x-placement^="right"] > .arrow::before, -.bs-popover-right > .arrow::before { +.bs-popover-right > .arrow::before, +.bs-popover-auto[x-placement^="right"] > .arrow::before { left: 0; border-width: 0.5rem 0.5rem 0.5rem 0; border-right-color: rgba(0, 0, 0, 0.25); } -.bs-popover-auto[x-placement^="right"] > .arrow::after, -.bs-popover-right > .arrow::after { +.bs-popover-right > .arrow::after, +.bs-popover-auto[x-placement^="right"] > .arrow::after { left: 1px; border-width: 0.5rem 0.5rem 0.5rem 0; border-right-color: #303030; } -.bs-popover-auto[x-placement^="bottom"], -.bs-popover-bottom { + +.bs-popover-bottom, +.bs-popover-auto[x-placement^="bottom"] { margin-top: 0.5rem; } -.bs-popover-auto[x-placement^="bottom"] > .arrow, -.bs-popover-bottom > .arrow { +.bs-popover-bottom > .arrow, +.bs-popover-auto[x-placement^="bottom"] > .arrow { top: calc(-0.5rem - 1px); } -.bs-popover-auto[x-placement^="bottom"] > .arrow::before, -.bs-popover-bottom > .arrow::before { +.bs-popover-bottom > .arrow::before, +.bs-popover-auto[x-placement^="bottom"] > .arrow::before { top: 0; border-width: 0 0.5rem 0.5rem 0.5rem; border-bottom-color: rgba(0, 0, 0, 0.25); } -.bs-popover-auto[x-placement^="bottom"] > .arrow::after, -.bs-popover-bottom > .arrow::after { +.bs-popover-bottom > .arrow::after, +.bs-popover-auto[x-placement^="bottom"] > .arrow::after { top: 1px; border-width: 0 0.5rem 0.5rem 0.5rem; border-bottom-color: #303030; } -.bs-popover-auto[x-placement^="bottom"] .popover-header::before, -.bs-popover-bottom .popover-header::before { +.bs-popover-bottom .popover-header::before, +.bs-popover-auto[x-placement^="bottom"] .popover-header::before { position: absolute; top: 0; left: 50%; @@ -5536,29 +5987,31 @@ a.close.disabled { content: ""; border-bottom: 1px solid #444; } -.bs-popover-auto[x-placement^="left"], -.bs-popover-left { + +.bs-popover-left, +.bs-popover-auto[x-placement^="left"] { margin-right: 0.5rem; } -.bs-popover-auto[x-placement^="left"] > .arrow, -.bs-popover-left > .arrow { +.bs-popover-left > .arrow, +.bs-popover-auto[x-placement^="left"] > .arrow { right: calc(-0.5rem - 1px); width: 0.5rem; height: 1rem; margin: 0.3rem 0; } -.bs-popover-auto[x-placement^="left"] > .arrow::before, -.bs-popover-left > .arrow::before { +.bs-popover-left > .arrow::before, +.bs-popover-auto[x-placement^="left"] > .arrow::before { right: 0; border-width: 0.5rem 0 0.5rem 0.5rem; border-left-color: rgba(0, 0, 0, 0.25); } -.bs-popover-auto[x-placement^="left"] > .arrow::after, -.bs-popover-left > .arrow::after { +.bs-popover-left > .arrow::after, +.bs-popover-auto[x-placement^="left"] > .arrow::after { right: 1px; border-width: 0.5rem 0 0.5rem 0.5rem; border-left-color: #303030; } + .popover-header { padding: 0.5rem 0.75rem; margin-bottom: 0; @@ -5571,16 +6024,20 @@ a.close.disabled { .popover-header:empty { display: none; } + .popover-body { padding: 0.5rem 0.75rem; color: #dee2e6; } + .carousel { position: relative; } + .carousel.pointer-event { touch-action: pan-y; } + .carousel-inner { position: relative; width: 100%; @@ -5591,6 +6048,7 @@ a.close.disabled { clear: both; content: ""; } + .carousel-item { position: relative; display: none; @@ -5605,27 +6063,31 @@ a.close.disabled { transition: none; } } + +.carousel-item.active, .carousel-item-next, -.carousel-item-prev, -.carousel-item.active { +.carousel-item-prev { display: block; } -.active.carousel-item-right, -.carousel-item-next:not(.carousel-item-left) { + +.carousel-item-next:not(.carousel-item-left), +.active.carousel-item-right { transform: translateX(100%); } -.active.carousel-item-left, -.carousel-item-prev:not(.carousel-item-right) { + +.carousel-item-prev:not(.carousel-item-right), +.active.carousel-item-left { transform: translateX(-100%); } + .carousel-fade .carousel-item { opacity: 0; transition-property: opacity; transform: none; } +.carousel-fade .carousel-item.active, .carousel-fade .carousel-item-next.carousel-item-left, -.carousel-fade .carousel-item-prev.carousel-item-right, -.carousel-fade .carousel-item.active { +.carousel-fade .carousel-item-prev.carousel-item-right { z-index: 1; opacity: 1; } @@ -5641,8 +6103,9 @@ a.close.disabled { transition: none; } } -.carousel-control-next, -.carousel-control-prev { + +.carousel-control-prev, +.carousel-control-next { position: absolute; top: 0; bottom: 0; @@ -5651,45 +6114,54 @@ a.close.disabled { align-items: center; justify-content: center; width: 15%; + padding: 0; color: #fff; text-align: center; + background: none; + border: 0; opacity: 0.5; transition: opacity 0.15s ease; } @media (prefers-reduced-motion: reduce) { - .carousel-control-next, - .carousel-control-prev { + .carousel-control-prev, + .carousel-control-next { transition: none; } } -.carousel-control-next:focus, -.carousel-control-next:hover, +.carousel-control-prev:hover, .carousel-control-prev:focus, -.carousel-control-prev:hover { +.carousel-control-next:hover, +.carousel-control-next:focus { color: #fff; text-decoration: none; outline: 0; opacity: 0.9; } + .carousel-control-prev { left: 0; } + .carousel-control-next { right: 0; } -.carousel-control-next-icon, -.carousel-control-prev-icon { + +.carousel-control-prev-icon, +.carousel-control-next-icon { display: inline-block; width: 20px; height: 20px; - background: no-repeat 50%/100% 100%; + background: 50%/100% 100% no-repeat; } + .carousel-control-prev-icon { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath d='M5.25 0l-4 4 4 4 1.5-1.5L4.25 4l2.5-2.5L5.25 0z'/%3e%3c/svg%3e"); } + .carousel-control-next-icon { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath d='M2.75 0l-1.5 1.5L3.75 4l-2.5 2.5L2.75 8l4-4-4-4z'/%3e%3c/svg%3e"); } + .carousel-indicators { position: absolute; right: 0; @@ -5727,6 +6199,7 @@ a.close.disabled { .carousel-indicators .active { opacity: 1; } + .carousel-caption { position: absolute; right: 15%; @@ -5738,6 +6211,7 @@ a.close.disabled { color: #fff; text-align: center; } + @keyframes spinner-border { to { transform: rotate(360deg); @@ -5747,17 +6221,19 @@ a.close.disabled { display: inline-block; width: 2rem; height: 2rem; - vertical-align: text-bottom; - border: 0.25em solid currentColor; + vertical-align: -0.125em; + border: 0.25em solid currentcolor; border-right-color: transparent; border-radius: 50%; - animation: spinner-border 0.75s linear infinite; + animation: 0.75s linear infinite spinner-border; } + .spinner-border-sm { width: 1rem; height: 1rem; border-width: 0.2em; } + @keyframes spinner-grow { 0% { transform: scale(0); @@ -5771,235 +6247,306 @@ a.close.disabled { display: inline-block; width: 2rem; height: 2rem; - vertical-align: text-bottom; - background-color: currentColor; + vertical-align: -0.125em; + background-color: currentcolor; border-radius: 50%; opacity: 0; - animation: spinner-grow 0.75s linear infinite; + animation: 0.75s linear infinite spinner-grow; } + .spinner-grow-sm { width: 1rem; height: 1rem; } + +@media (prefers-reduced-motion: reduce) { + .spinner-border, + .spinner-grow { + animation-duration: 1.5s; + } +} .align-baseline { vertical-align: baseline !important; } + .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; } + .bg-primary { background-color: #375a7f !important; } -a.bg-primary:focus, + a.bg-primary:hover, -button.bg-primary:focus, -button.bg-primary:hover { +a.bg-primary:focus, +button.bg-primary:hover, +button.bg-primary:focus { background-color: #28415b !important; } + .bg-secondary { background-color: #444 !important; } -a.bg-secondary:focus, + a.bg-secondary:hover, -button.bg-secondary:focus, -button.bg-secondary:hover { +a.bg-secondary:focus, +button.bg-secondary:hover, +button.bg-secondary:focus { background-color: #2b2b2b !important; } + .bg-success { background-color: #00bc8c !important; } -a.bg-success:focus, + a.bg-success:hover, -button.bg-success:focus, -button.bg-success:hover { +a.bg-success:focus, +button.bg-success:hover, +button.bg-success:focus { background-color: #008966 !important; } + .bg-info { background-color: #3498db !important; } -a.bg-info:focus, + a.bg-info:hover, -button.bg-info:focus, -button.bg-info:hover { +a.bg-info:focus, +button.bg-info:hover, +button.bg-info:focus { background-color: #217dbb !important; } + .bg-warning { background-color: #f39c12 !important; } -a.bg-warning:focus, + a.bg-warning:hover, -button.bg-warning:focus, -button.bg-warning:hover { +a.bg-warning:focus, +button.bg-warning:hover, +button.bg-warning:focus { background-color: #c87f0a !important; } + .bg-danger { background-color: #e74c3c !important; } -a.bg-danger:focus, + a.bg-danger:hover, -button.bg-danger:focus, -button.bg-danger:hover { +a.bg-danger:focus, +button.bg-danger:hover, +button.bg-danger:focus { background-color: #d62c1a !important; } + .bg-light { background-color: #303030 !important; } -a.bg-light:focus, + a.bg-light:hover, -button.bg-light:focus, -button.bg-light:hover { +a.bg-light:focus, +button.bg-light:hover, +button.bg-light:focus { background-color: #171717 !important; } + .bg-dark { background-color: #dee2e6 !important; } -a.bg-dark:focus, + a.bg-dark:hover, -button.bg-dark:focus, -button.bg-dark:hover { +a.bg-dark:focus, +button.bg-dark:hover, +button.bg-dark:focus { background-color: #c1c9d0 !important; } + .bg-white { background-color: #fff !important; } + .bg-transparent { background-color: transparent !important; } + .border { border: 1px solid #dee2e6 !important; } + .border-top { border-top: 1px solid #dee2e6 !important; } + .border-right { border-right: 1px solid #dee2e6 !important; } + .border-bottom { border-bottom: 1px solid #dee2e6 !important; } + .border-left { border-left: 1px solid #dee2e6 !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; } + .border-primary { border-color: #375a7f !important; } + .border-secondary { border-color: #444 !important; } + .border-success { border-color: #00bc8c !important; } + .border-info { border-color: #3498db !important; } + .border-warning { border-color: #f39c12 !important; } + .border-danger { border-color: #e74c3c !important; } + .border-light { border-color: #303030 !important; } + .border-dark { border-color: #dee2e6 !important; } + .border-white { border-color: #fff !important; } + .rounded-sm { border-radius: 0.2rem !important; } + .rounded { border-radius: 0.25rem !important; } + .rounded-top { border-top-left-radius: 0.25rem !important; border-top-right-radius: 0.25rem !important; } + .rounded-right { border-top-right-radius: 0.25rem !important; border-bottom-right-radius: 0.25rem !important; } + .rounded-bottom { border-bottom-right-radius: 0.25rem !important; border-bottom-left-radius: 0.25rem !important; } + .rounded-left { border-top-left-radius: 0.25rem !important; border-bottom-left-radius: 0.25rem !important; } + .rounded-lg { border-radius: 0.3rem !important; } + .rounded-circle { border-radius: 50% !important; } + .rounded-pill { border-radius: 50rem !important; } + .rounded-0 { border-radius: 0 !important; } + .clearfix::after { display: block; clear: both; content: ""; } + .d-none { display: none !important; } + .d-inline { display: inline !important; } + .d-inline-block { display: inline-block !important; } + .d-block { display: block !important; } + .d-table { display: table !important; } + .d-table-row { display: table-row !important; } + .d-table-cell { display: table-cell !important; } + .d-flex { display: flex !important; } + .d-inline-flex { display: inline-flex !important; } + @media (min-width: 576px) { .d-sm-none { display: none !important; @@ -6157,8 +6704,8 @@ button.bg-dark:hover { content: ""; } .embed-responsive .embed-responsive-item, -.embed-responsive embed, .embed-responsive iframe, +.embed-responsive embed, .embed-responsive object, .embed-responsive video { position: absolute; @@ -6169,120 +6716,159 @@ button.bg-dark:hover { height: 100%; border: 0; } + .embed-responsive-21by9::before { - padding-top: 42.85714%; + padding-top: 42.85714286%; } + .embed-responsive-16by9::before { padding-top: 56.25%; } + .embed-responsive-4by3::before { padding-top: 75%; } + .embed-responsive-1by1::before { padding-top: 100%; } + .flex-row { flex-direction: row !important; } + .flex-column { flex-direction: column !important; } + .flex-row-reverse { flex-direction: row-reverse !important; } + .flex-column-reverse { flex-direction: column-reverse !important; } + .flex-wrap { flex-wrap: wrap !important; } + .flex-nowrap { flex-wrap: nowrap !important; } + .flex-wrap-reverse { flex-wrap: wrap-reverse !important; } + .flex-fill { flex: 1 1 auto !important; } + .flex-grow-0 { flex-grow: 0 !important; } + .flex-grow-1 { flex-grow: 1 !important; } + .flex-shrink-0 { flex-shrink: 0 !important; } + .flex-shrink-1 { flex-shrink: 1 !important; } + .justify-content-start { justify-content: flex-start !important; } + .justify-content-end { justify-content: flex-end !important; } + .justify-content-center { justify-content: center !important; } + .justify-content-between { justify-content: space-between !important; } + .justify-content-around { justify-content: space-around !important; } + .align-items-start { align-items: flex-start !important; } + .align-items-end { align-items: flex-end !important; } + .align-items-center { align-items: center !important; } + .align-items-baseline { align-items: baseline !important; } + .align-items-stretch { align-items: stretch !important; } + .align-content-start { align-content: flex-start !important; } + .align-content-end { align-content: flex-end !important; } + .align-content-center { align-content: center !important; } + .align-content-between { align-content: space-between !important; } + .align-content-around { align-content: space-around !important; } + .align-content-stretch { align-content: stretch !important; } + .align-self-auto { align-self: auto !important; } + .align-self-start { align-self: flex-start !important; } + .align-self-end { align-self: flex-end !important; } + .align-self-center { align-self: center !important; } + .align-self-baseline { align-self: baseline !important; } + .align-self-stretch { align-self: stretch !important; } + @media (min-width: 576px) { .flex-sm-row { flex-direction: row !important; @@ -6702,12 +7288,15 @@ button.bg-dark:hover { .float-left { float: left !important; } + .float-right { float: right !important; } + .float-none { float: none !important; } + @media (min-width: 576px) { .float-sm-left { float: left !important; @@ -6755,33 +7344,43 @@ button.bg-dark:hover { .user-select-all { user-select: all !important; } + .user-select-auto { user-select: auto !important; } + .user-select-none { user-select: none !important; } + .overflow-auto { overflow: auto !important; } + .overflow-hidden { overflow: hidden !important; } + .position-static { position: static !important; } + .position-relative { position: relative !important; } + .position-absolute { position: absolute !important; } + .position-fixed { position: fixed !important; } + .position-sticky { position: sticky !important; } + .fixed-top { position: fixed; top: 0; @@ -6789,6 +7388,7 @@ button.bg-dark:hover { left: 0; z-index: 1030; } + .fixed-bottom { position: fixed; right: 0; @@ -6796,6 +7396,7 @@ button.bg-dark:hover { left: 0; z-index: 1030; } + @supports (position: sticky) { .sticky-top { position: sticky; @@ -6803,6 +7404,7 @@ button.bg-dark:hover { z-index: 1020; } } + .sr-only { position: absolute; width: 1px; @@ -6814,6 +7416,7 @@ button.bg-dark:hover { white-space: nowrap; border: 0; } + .sr-only-focusable:active, .sr-only-focusable:focus { position: static; @@ -6823,408 +7426,519 @@ button.bg-dark:hover { clip: auto; white-space: normal; } + .shadow-sm { box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075) !important; } + .shadow { box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important; } + .shadow-lg { box-shadow: 0 1rem 3rem rgba(0, 0, 0, 0.175) !important; } + .shadow-none { box-shadow: none !important; } + .w-25 { width: 25% !important; } + .w-50 { width: 50% !important; } + .w-75 { width: 75% !important; } + .w-100 { width: 100% !important; } + .w-auto { width: auto !important; } + .h-25 { height: 25% !important; } + .h-50 { height: 50% !important; } + .h-75 { height: 75% !important; } + .h-100 { height: 100% !important; } + .h-auto { height: auto !important; } + .mw-100 { max-width: 100% !important; } + .mh-100 { max-height: 100% !important; } + .min-vw-100 { min-width: 100vw !important; } + .min-vh-100 { min-height: 100vh !important; } + .vw-100 { width: 100vw !important; } + .vh-100 { height: 100vh !important; } + .m-0 { margin: 0 !important; } + .mt-0, .my-0 { margin-top: 0 !important; } + .mr-0, .mx-0 { margin-right: 0 !important; } + .mb-0, .my-0 { margin-bottom: 0 !important; } + .ml-0, .mx-0 { margin-left: 0 !important; } + .m-1 { margin: 0.25rem !important; } + .mt-1, .my-1 { margin-top: 0.25rem !important; } + .mr-1, .mx-1 { margin-right: 0.25rem !important; } + .mb-1, .my-1 { margin-bottom: 0.25rem !important; } + .ml-1, .mx-1 { margin-left: 0.25rem !important; } + .m-2 { margin: 0.5rem !important; } + .mt-2, .my-2 { margin-top: 0.5rem !important; } + .mr-2, .mx-2 { margin-right: 0.5rem !important; } + .mb-2, .my-2 { margin-bottom: 0.5rem !important; } + .ml-2, .mx-2 { margin-left: 0.5rem !important; } + .m-3 { margin: 1rem !important; } + .mt-3, .my-3 { margin-top: 1rem !important; } + .mr-3, .mx-3 { margin-right: 1rem !important; } + .mb-3, .my-3 { margin-bottom: 1rem !important; } + .ml-3, .mx-3 { margin-left: 1rem !important; } + .m-4 { margin: 1.5rem !important; } + .mt-4, .my-4 { margin-top: 1.5rem !important; } + .mr-4, .mx-4 { margin-right: 1.5rem !important; } + .mb-4, .my-4 { margin-bottom: 1.5rem !important; } + .ml-4, .mx-4 { margin-left: 1.5rem !important; } + .m-5 { margin: 3rem !important; } + .mt-5, .my-5 { margin-top: 3rem !important; } + .mr-5, .mx-5 { margin-right: 3rem !important; } + .mb-5, .my-5 { margin-bottom: 3rem !important; } + .ml-5, .mx-5 { margin-left: 3rem !important; } + .p-0 { padding: 0 !important; } + .pt-0, .py-0 { padding-top: 0 !important; } + .pr-0, .px-0 { padding-right: 0 !important; } + .pb-0, .py-0 { padding-bottom: 0 !important; } + .pl-0, .px-0 { padding-left: 0 !important; } + .p-1 { padding: 0.25rem !important; } + .pt-1, .py-1 { padding-top: 0.25rem !important; } + .pr-1, .px-1 { padding-right: 0.25rem !important; } + .pb-1, .py-1 { padding-bottom: 0.25rem !important; } + .pl-1, .px-1 { padding-left: 0.25rem !important; } + .p-2 { padding: 0.5rem !important; } + .pt-2, .py-2 { padding-top: 0.5rem !important; } + .pr-2, .px-2 { padding-right: 0.5rem !important; } + .pb-2, .py-2 { padding-bottom: 0.5rem !important; } + .pl-2, .px-2 { padding-left: 0.5rem !important; } + .p-3 { padding: 1rem !important; } + .pt-3, .py-3 { padding-top: 1rem !important; } + .pr-3, .px-3 { padding-right: 1rem !important; } + .pb-3, .py-3 { padding-bottom: 1rem !important; } + .pl-3, .px-3 { padding-left: 1rem !important; } + .p-4 { padding: 1.5rem !important; } + .pt-4, .py-4 { padding-top: 1.5rem !important; } + .pr-4, .px-4 { padding-right: 1.5rem !important; } + .pb-4, .py-4 { padding-bottom: 1.5rem !important; } + .pl-4, .px-4 { padding-left: 1.5rem !important; } + .p-5 { padding: 3rem !important; } + .pt-5, .py-5 { padding-top: 3rem !important; } + .pr-5, .px-5 { padding-right: 3rem !important; } + .pb-5, .py-5 { padding-bottom: 3rem !important; } + .pl-5, .px-5 { padding-left: 3rem !important; } + .m-n1 { margin: -0.25rem !important; } + .mt-n1, .my-n1 { margin-top: -0.25rem !important; } + .mr-n1, .mx-n1 { margin-right: -0.25rem !important; } + .mb-n1, .my-n1 { margin-bottom: -0.25rem !important; } + .ml-n1, .mx-n1 { margin-left: -0.25rem !important; } + .m-n2 { margin: -0.5rem !important; } + .mt-n2, .my-n2 { margin-top: -0.5rem !important; } + .mr-n2, .mx-n2 { margin-right: -0.5rem !important; } + .mb-n2, .my-n2 { margin-bottom: -0.5rem !important; } + .ml-n2, .mx-n2 { margin-left: -0.5rem !important; } + .m-n3 { margin: -1rem !important; } + .mt-n3, .my-n3 { margin-top: -1rem !important; } + .mr-n3, .mx-n3 { margin-right: -1rem !important; } + .mb-n3, .my-n3 { margin-bottom: -1rem !important; } + .ml-n3, .mx-n3 { margin-left: -1rem !important; } + .m-n4 { margin: -1.5rem !important; } + .mt-n4, .my-n4 { margin-top: -1.5rem !important; } + .mr-n4, .mx-n4 { margin-right: -1.5rem !important; } + .mb-n4, .my-n4 { margin-bottom: -1.5rem !important; } + .ml-n4, .mx-n4 { margin-left: -1.5rem !important; } + .m-n5 { margin: -3rem !important; } + .mt-n5, .my-n5 { margin-top: -3rem !important; } + .mr-n5, .mx-n5 { margin-right: -3rem !important; } + .mb-n5, .my-n5 { margin-bottom: -3rem !important; } + .ml-n5, .mx-n5 { margin-left: -3rem !important; } + .m-auto { margin: auto !important; } + .mt-auto, .my-auto { margin-top: auto !important; } + .mr-auto, .mx-auto { margin-right: auto !important; } + .mb-auto, .my-auto { margin-bottom: auto !important; } + .ml-auto, .mx-auto { margin-left: auto !important; } + @media (min-width: 576px) { .m-sm-0 { margin: 0 !important; @@ -8612,33 +9326,42 @@ button.bg-dark:hover { content: ""; background-color: rgba(0, 0, 0, 0); } + .text-monospace { font-family: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace !important; } + .text-justify { text-align: justify !important; } + .text-wrap { white-space: normal !important; } + .text-nowrap { white-space: nowrap !important; } + .text-truncate { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } + .text-left { text-align: left !important; } + .text-right { text-align: right !important; } + .text-center { text-align: center !important; } + @media (min-width: 576px) { .text-sm-left { text-align: left !important; @@ -8686,101 +9409,131 @@ button.bg-dark:hover { .text-lowercase { text-transform: lowercase !important; } + .text-uppercase { text-transform: uppercase !important; } + .text-capitalize { text-transform: capitalize !important; } + .font-weight-light { font-weight: 300 !important; } + .font-weight-lighter { font-weight: lighter !important; } + .font-weight-normal { font-weight: 400 !important; } + .font-weight-bold { font-weight: 700 !important; } + .font-weight-bolder { font-weight: bolder !important; } + .font-italic { font-style: italic !important; } + .text-white { color: #fff !important; } + .text-primary { color: #375a7f !important; } -a.text-primary:focus, -a.text-primary:hover { + +a.text-primary:hover, +a.text-primary:focus { color: #20344a !important; } + .text-secondary { color: #444 !important; } -a.text-secondary:focus, -a.text-secondary:hover { + +a.text-secondary:hover, +a.text-secondary:focus { color: #1e1e1e !important; } + .text-success { color: #00bc8c !important; } -a.text-success:focus, -a.text-success:hover { + +a.text-success:hover, +a.text-success:focus { color: #007053 !important; } + .text-info { color: #3498db !important; } -a.text-info:focus, -a.text-info:hover { + +a.text-info:hover, +a.text-info:focus { color: #1d6fa5 !important; } + .text-warning { color: #f39c12 !important; } -a.text-warning:focus, -a.text-warning:hover { + +a.text-warning:hover, +a.text-warning:focus { color: #b06f09 !important; } + .text-danger { color: #e74c3c !important; } -a.text-danger:focus, -a.text-danger:hover { + +a.text-danger:hover, +a.text-danger:focus { color: #bf2718 !important; } + .text-light { color: #303030 !important; } -a.text-light:focus, -a.text-light:hover { + +a.text-light:hover, +a.text-light:focus { color: #0a0a0a !important; } + .text-dark { color: #dee2e6 !important; } -a.text-dark:focus, -a.text-dark:hover { + +a.text-dark:hover, +a.text-dark:focus { color: #b2bcc5 !important; } + .text-body { color: #dee2e6 !important; } + .text-muted { color: #888 !important; } + .text-black-50 { color: rgba(0, 0, 0, 0.5) !important; } + .text-white-50 { color: rgba(255, 255, 255, 0.5) !important; } + .text-hide { font: 0/0 a; color: transparent; @@ -8788,25 +9541,32 @@ a.text-dark:hover { background-color: transparent; border: 0; } + .text-decoration-none { text-decoration: none !important; } + .text-break { + word-break: break-word !important; word-wrap: break-word !important; } + .text-reset { color: inherit !important; } + .visible { visibility: visible !important; } + .invisible { visibility: hidden !important; } + @media print { *, - ::after, - ::before { + *::before, + *::after { text-shadow: none !important; box-shadow: none !important; } @@ -8819,21 +9579,18 @@ a.text-dark:hover { pre { white-space: pre-wrap !important; } - blockquote, - pre { + pre, + blockquote { border: 1px solid #adb5bd; page-break-inside: avoid; } - thead { - display: table-header-group; - } - img, - tr { + tr, + img { page-break-inside: avoid; } + p, h2, - h3, - p { + h3 { orphans: 3; widows: 3; } @@ -8863,17 +9620,17 @@ a.text-dark:hover { .table th { background-color: #fff !important; } - .table-bordered td, - .table-bordered th { + .table-bordered th, + .table-bordered td { border: 1px solid #dee2e6 !important; } .table-dark { color: inherit; } - .table-dark tbody + tbody, - .table-dark td, .table-dark th, - .table-dark thead th { + .table-dark td, + .table-dark thead th, + .table-dark tbody + tbody { border-color: #444; } .table .thead-dark th { @@ -8881,3 +9638,5 @@ a.text-dark:hover { border-color: #444; } } + +/*# sourceMappingURL=darkly.css.map */ diff --git a/src/assets/css/themes/darkly.scss b/src/assets/css/themes/darkly.scss new file mode 100644 index 00000000..ef808d56 --- /dev/null +++ b/src/assets/css/themes/darkly.scss @@ -0,0 +1,2 @@ +@import "variables.darkly"; +@import "../../../../node_modules/bootstrap-v4/scss/bootstrap"; diff --git a/src/assets/css/themes/litely-red.css b/src/assets/css/themes/litely-red.css index 8d74415c..9b51f26c 100644 --- a/src/assets/css/themes/litely-red.css +++ b/src/assets/css/themes/litely-red.css @@ -1,3 +1,10 @@ +@charset "UTF-8"; +/*! + * Bootstrap v4.6.2 (https://getbootstrap.com/) + * Copyright 2011-2022 The Bootstrap Authors + * Copyright 2011-2022 Twitter, Inc. + * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE) + */ :root { --blue: #007bff; --indigo: #6610f2; @@ -12,12 +19,12 @@ --white: #ffffff; --gray: #6c757d; --gray-dark: #343a40; - --primary: #d84848; - --secondary: #00c853; + --primary: #f1641e; + --secondary: #c80000; --success: #6610f2; --info: #007bff; --warning: #ffc107; - --danger: #873208; + --danger: #8c3409; --light: #f8f9fa; --dark: #343a40; --breakpoint-xs: 0; @@ -30,17 +37,20 @@ --font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; } + *, -::after, -::before { +*::before, +*::after { box-sizing: border-box; } + html { font-family: sans-serif; line-height: 1.15; -webkit-text-size-adjust: 100%; -webkit-tap-highlight-color: rgba(34, 34, 34, 0); } + article, aside, figcaption, @@ -53,10 +63,11 @@ nav, section { display: block; } + body { margin: 0; font-family: -apple-system, BlinkMacSystemFont, "Droid Sans", "Segoe UI", - Helvetica, Arial, sans-serif; + "Helvetica", Arial, sans-serif; font-size: 1rem; font-weight: 400; line-height: 1.5; @@ -64,14 +75,17 @@ body { text-align: left; background-color: #fff; } + [tabindex="-1"]:focus:not(:focus-visible) { outline: 0 !important; } + hr { box-sizing: content-box; height: 0; overflow: visible; } + h1, h2, h3, @@ -81,52 +95,63 @@ h6 { margin-top: 0; margin-bottom: 0.5rem; } + p { margin-top: 0; margin-bottom: 1rem; } -abbr[data-original-title], -abbr[title] { + +abbr[title], +abbr[data-original-title] { text-decoration: underline; text-decoration: underline dotted; cursor: help; border-bottom: 0; text-decoration-skip-ink: none; } + address { margin-bottom: 1rem; font-style: normal; line-height: inherit; } -dl, + ol, -ul { +ul, +dl { margin-top: 0; margin-bottom: 1rem; } + ol ol, +ul ul, ol ul, -ul ol, -ul ul { +ul ol { margin-bottom: 0; } + dt { font-weight: 600; } + dd { margin-bottom: 0.5rem; margin-left: 0; } + blockquote { margin: 0 0 1rem; } + b, strong { font-weight: bolder; } + small { font-size: 80%; } + sub, sup { position: relative; @@ -134,57 +159,68 @@ sup { line-height: 0; vertical-align: baseline; } + sub { bottom: -0.25em; } + sup { top: -0.5em; } + a { - color: #d84848; + color: #f1641e; text-decoration: none; background-color: transparent; } a:hover { - color: #b70b0b; + color: #b7440b; text-decoration: underline; } -a:not([href]) { + +a:not([href]):not([class]) { color: inherit; text-decoration: none; } -a:not([href]):hover { +a:not([href]):not([class]):hover { color: inherit; text-decoration: none; } + +pre, code, kbd, -pre, samp { font-family: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; font-size: 1em; } + pre { margin-top: 0; margin-bottom: 1rem; overflow: auto; -ms-overflow-style: scrollbar; } + figure { margin: 0 0 1rem; } + img { vertical-align: middle; border-style: none; } + svg { overflow: hidden; vertical-align: middle; } + table { border-collapse: collapse; } + caption { padding-top: 0.75rem; padding-bottom: 0.75rem; @@ -192,78 +228,94 @@ caption { text-align: left; caption-side: bottom; } + th { text-align: inherit; + text-align: -webkit-match-parent; } + label { display: inline-block; margin-bottom: 0.5rem; } + button { border-radius: 0; } -button:focus { - outline: 1px dotted; - outline: 5px auto -webkit-focus-ring-color; + +button:focus:not(:focus-visible) { + outline: 0; } -button, + input, -optgroup, +button, select, +optgroup, textarea { margin: 0; font-family: inherit; font-size: inherit; line-height: inherit; } + button, input { overflow: visible; } + button, select { text-transform: none; } + [role="button"] { cursor: pointer; } + select { word-wrap: normal; } + +button, [type="button"], [type="reset"], -[type="submit"], -button { +[type="submit"] { -webkit-appearance: button; } + +button:not(:disabled), [type="button"]:not(:disabled), [type="reset"]:not(:disabled), -[type="submit"]:not(:disabled), -button:not(:disabled) { +[type="submit"]:not(:disabled) { cursor: pointer; } + +button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, -[type="submit"]::-moz-focus-inner, -button::-moz-focus-inner { +[type="submit"]::-moz-focus-inner { padding: 0; border-style: none; } -input[type="checkbox"], -input[type="radio"] { + +input[type="radio"], +input[type="checkbox"] { box-sizing: border-box; padding: 0; } + textarea { overflow: auto; resize: vertical; } + fieldset { min-width: 0; padding: 0; margin: 0; border: 0; } + legend { display: block; width: 100%; @@ -275,152 +327,184 @@ legend { color: inherit; white-space: normal; } + progress { vertical-align: baseline; } + [type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button { height: auto; } + [type="search"] { outline-offset: -2px; -webkit-appearance: none; } + [type="search"]::-webkit-search-decoration { -webkit-appearance: none; } + ::-webkit-file-upload-button { font: inherit; -webkit-appearance: button; } + output { display: inline-block; } + summary { display: list-item; cursor: pointer; } + template { display: none; } + [hidden] { display: none !important; } -.h1, -.h2, -.h3, -.h4, -.h5, -.h6, + h1, h2, h3, h4, h5, -h6 { +h6, +.h1, +.h2, +.h3, +.h4, +.h5, +.h6 { margin-bottom: 0.5rem; font-weight: 500; line-height: 1.2; color: #495057; } -.h1, -h1 { + +h1, +.h1 { font-size: 2.5rem; } -.h2, -h2 { + +h2, +.h2 { font-size: 2rem; } -.h3, -h3 { + +h3, +.h3 { font-size: 1.75rem; } -.h4, -h4 { + +h4, +.h4 { font-size: 1.5rem; } -.h5, -h5 { + +h5, +.h5 { font-size: 1.25rem; } -.h6, -h6 { + +h6, +.h6 { font-size: 1rem; } + .lead { font-size: 1.25rem; font-weight: 300; } + .display-1 { font-size: 6rem; font-weight: 300; line-height: 1.2; } + .display-2 { font-size: 5.5rem; font-weight: 300; line-height: 1.2; } + .display-3 { font-size: 4.5rem; font-weight: 300; line-height: 1.2; } + .display-4 { font-size: 3.5rem; font-weight: 300; line-height: 1.2; } + hr { margin-top: 1rem; margin-bottom: 1rem; border: 0; border-top: 1px solid rgba(34, 34, 34, 0.1); } -.small, -small { - font-size: 80%; + +small, +.small { + font-size: 0.875em; font-weight: 400; } -.mark, -mark { + +mark, +.mark { padding: 0.2em; - background-color: #fffcef; + background-color: rgb(255, 252, 239); } + .list-unstyled { padding-left: 0; list-style: none; } + .list-inline { padding-left: 0; list-style: none; } + .list-inline-item { display: inline-block; } .list-inline-item:not(:last-child) { margin-right: 0.5rem; } + .initialism { font-size: 90%; text-transform: uppercase; } + .blockquote { margin-bottom: 1rem; font-size: 1.25rem; } + .blockquote-footer { display: block; - font-size: 80%; + font-size: 0.875em; color: #6c757d; } .blockquote-footer::before { - content: "\2014\00A0"; + content: "— "; } + .img-fluid { max-width: 100%; height: auto; } + .img-thumbnail { padding: 0.25rem; background-color: #fff; @@ -429,17 +513,21 @@ mark { max-width: 100%; height: auto; } + .figure { display: inline-block; } + .figure-img { margin-bottom: 0.5rem; line-height: 1; } + .figure-caption { font-size: 90%; color: #6c757d; } + code { font-size: 87.5%; color: #e83e8c; @@ -448,10 +536,11 @@ code { a > code { color: inherit; } + kbd { padding: 0.2rem 0.4rem; font-size: 87.5%; - color: #fff; + color: #ffffff; background-color: #212529; border-radius: 1rem; } @@ -460,6 +549,7 @@ kbd kbd { font-size: 100%; font-weight: 600; } + pre { display: block; font-size: 87.5%; @@ -470,75 +560,52 @@ pre code { color: inherit; word-break: normal; } + .pre-scrollable { max-height: 340px; overflow-y: scroll; } -.container { - width: 100%; - padding-right: 15px; - padding-left: 15px; - margin-right: auto; - margin-left: auto; -} -@media (min-width: 576px) { - .container { - max-width: 540px; - } -} -@media (min-width: 768px) { - .container { - max-width: 720px; - } -} -@media (min-width: 992px) { - .container { - max-width: 960px; - } -} -@media (min-width: 1200px) { - .container { - max-width: 1140px; - } -} + +.container, .container-fluid, +.container-xl, .container-lg, .container-md, -.container-sm, -.container-xl { +.container-sm { width: 100%; padding-right: 15px; padding-left: 15px; margin-right: auto; margin-left: auto; } + @media (min-width: 576px) { - .container, - .container-sm { + .container-sm, + .container { max-width: 540px; } } @media (min-width: 768px) { - .container, .container-md, - .container-sm { + .container-sm, + .container { max-width: 720px; } } @media (min-width: 992px) { - .container, - .container-lg, - .container-md, - .container-sm { - max-width: 960px; - } -} -@media (min-width: 1200px) { - .container, .container-lg, .container-md, .container-sm, - .container-xl { + .container { + max-width: 960px; + } +} +@media (min-width: 1200px) { + .container-xl, + .container-lg, + .container-md, + .container-sm, + .container { max-width: 1140px; } } @@ -548,6 +615,7 @@ pre code { margin-right: -15px; margin-left: -15px; } + .no-gutters { margin-right: 0; margin-left: 0; @@ -557,247 +625,293 @@ pre code { padding-right: 0; padding-left: 0; } -.col, -.col-1, -.col-10, -.col-11, -.col-12, -.col-2, -.col-3, -.col-4, -.col-5, -.col-6, -.col-7, -.col-8, -.col-9, -.col-auto, -.col-lg, -.col-lg-1, -.col-lg-10, -.col-lg-11, -.col-lg-12, -.col-lg-2, -.col-lg-3, -.col-lg-4, -.col-lg-5, -.col-lg-6, -.col-lg-7, -.col-lg-8, -.col-lg-9, -.col-lg-auto, -.col-md, -.col-md-1, -.col-md-10, -.col-md-11, -.col-md-12, -.col-md-2, -.col-md-3, -.col-md-4, -.col-md-5, -.col-md-6, -.col-md-7, -.col-md-8, -.col-md-9, -.col-md-auto, -.col-sm, -.col-sm-1, -.col-sm-10, -.col-sm-11, -.col-sm-12, -.col-sm-2, -.col-sm-3, -.col-sm-4, -.col-sm-5, -.col-sm-6, -.col-sm-7, -.col-sm-8, -.col-sm-9, -.col-sm-auto, + .col-xl, -.col-xl-1, -.col-xl-10, -.col-xl-11, +.col-xl-auto, .col-xl-12, -.col-xl-2, -.col-xl-3, -.col-xl-4, -.col-xl-5, -.col-xl-6, -.col-xl-7, -.col-xl-8, +.col-xl-11, +.col-xl-10, .col-xl-9, -.col-xl-auto { +.col-xl-8, +.col-xl-7, +.col-xl-6, +.col-xl-5, +.col-xl-4, +.col-xl-3, +.col-xl-2, +.col-xl-1, +.col-lg, +.col-lg-auto, +.col-lg-12, +.col-lg-11, +.col-lg-10, +.col-lg-9, +.col-lg-8, +.col-lg-7, +.col-lg-6, +.col-lg-5, +.col-lg-4, +.col-lg-3, +.col-lg-2, +.col-lg-1, +.col-md, +.col-md-auto, +.col-md-12, +.col-md-11, +.col-md-10, +.col-md-9, +.col-md-8, +.col-md-7, +.col-md-6, +.col-md-5, +.col-md-4, +.col-md-3, +.col-md-2, +.col-md-1, +.col-sm, +.col-sm-auto, +.col-sm-12, +.col-sm-11, +.col-sm-10, +.col-sm-9, +.col-sm-8, +.col-sm-7, +.col-sm-6, +.col-sm-5, +.col-sm-4, +.col-sm-3, +.col-sm-2, +.col-sm-1, +.col, +.col-auto, +.col-12, +.col-11, +.col-10, +.col-9, +.col-8, +.col-7, +.col-6, +.col-5, +.col-4, +.col-3, +.col-2, +.col-1 { position: relative; width: 100%; padding-right: 15px; padding-left: 15px; } + .col { flex-basis: 0; flex-grow: 1; - min-width: 0; max-width: 100%; } + .row-cols-1 > * { flex: 0 0 100%; max-width: 100%; } + .row-cols-2 > * { flex: 0 0 50%; max-width: 50%; } + .row-cols-3 > * { - flex: 0 0 33.33333%; - max-width: 33.33333%; + flex: 0 0 33.3333333333%; + max-width: 33.3333333333%; } + .row-cols-4 > * { flex: 0 0 25%; max-width: 25%; } + .row-cols-5 > * { flex: 0 0 20%; max-width: 20%; } + .row-cols-6 > * { - flex: 0 0 16.66667%; - max-width: 16.66667%; + flex: 0 0 16.6666666667%; + max-width: 16.6666666667%; } + .col-auto { flex: 0 0 auto; width: auto; max-width: 100%; } + .col-1 { - flex: 0 0 8.33333%; - max-width: 8.33333%; + flex: 0 0 8.33333333%; + max-width: 8.33333333%; } + .col-2 { - flex: 0 0 16.66667%; - max-width: 16.66667%; + flex: 0 0 16.66666667%; + max-width: 16.66666667%; } + .col-3 { flex: 0 0 25%; max-width: 25%; } + .col-4 { - flex: 0 0 33.33333%; - max-width: 33.33333%; + flex: 0 0 33.33333333%; + max-width: 33.33333333%; } + .col-5 { - flex: 0 0 41.66667%; - max-width: 41.66667%; + flex: 0 0 41.66666667%; + max-width: 41.66666667%; } + .col-6 { flex: 0 0 50%; max-width: 50%; } + .col-7 { - flex: 0 0 58.33333%; - max-width: 58.33333%; + flex: 0 0 58.33333333%; + max-width: 58.33333333%; } + .col-8 { - flex: 0 0 66.66667%; - max-width: 66.66667%; + flex: 0 0 66.66666667%; + max-width: 66.66666667%; } + .col-9 { flex: 0 0 75%; max-width: 75%; } + .col-10 { - flex: 0 0 83.33333%; - max-width: 83.33333%; + flex: 0 0 83.33333333%; + max-width: 83.33333333%; } + .col-11 { - flex: 0 0 91.66667%; - max-width: 91.66667%; + flex: 0 0 91.66666667%; + max-width: 91.66666667%; } + .col-12 { flex: 0 0 100%; max-width: 100%; } + .order-first { order: -1; } + .order-last { order: 13; } + .order-0 { order: 0; } + .order-1 { order: 1; } + .order-2 { order: 2; } + .order-3 { order: 3; } + .order-4 { order: 4; } + .order-5 { order: 5; } + .order-6 { order: 6; } + .order-7 { order: 7; } + .order-8 { order: 8; } + .order-9 { order: 9; } + .order-10 { order: 10; } + .order-11 { order: 11; } + .order-12 { order: 12; } + .offset-1 { - margin-left: 8.33333%; + margin-left: 8.33333333%; } + .offset-2 { - margin-left: 16.66667%; + margin-left: 16.66666667%; } + .offset-3 { margin-left: 25%; } + .offset-4 { - margin-left: 33.33333%; + margin-left: 33.33333333%; } + .offset-5 { - margin-left: 41.66667%; + margin-left: 41.66666667%; } + .offset-6 { margin-left: 50%; } + .offset-7 { - margin-left: 58.33333%; + margin-left: 58.33333333%; } + .offset-8 { - margin-left: 66.66667%; + margin-left: 66.66666667%; } + .offset-9 { margin-left: 75%; } + .offset-10 { - margin-left: 83.33333%; + margin-left: 83.33333333%; } + .offset-11 { - margin-left: 91.66667%; + margin-left: 91.66666667%; } + @media (min-width: 576px) { .col-sm { flex-basis: 0; flex-grow: 1; - min-width: 0; max-width: 100%; } .row-cols-sm-1 > * { @@ -809,8 +923,8 @@ pre code { max-width: 50%; } .row-cols-sm-3 > * { - flex: 0 0 33.33333%; - max-width: 33.33333%; + flex: 0 0 33.3333333333%; + max-width: 33.3333333333%; } .row-cols-sm-4 > * { flex: 0 0 25%; @@ -821,8 +935,8 @@ pre code { max-width: 20%; } .row-cols-sm-6 > * { - flex: 0 0 16.66667%; - max-width: 16.66667%; + flex: 0 0 16.6666666667%; + max-width: 16.6666666667%; } .col-sm-auto { flex: 0 0 auto; @@ -830,48 +944,48 @@ pre code { max-width: 100%; } .col-sm-1 { - flex: 0 0 8.33333%; - max-width: 8.33333%; + flex: 0 0 8.33333333%; + max-width: 8.33333333%; } .col-sm-2 { - flex: 0 0 16.66667%; - max-width: 16.66667%; + flex: 0 0 16.66666667%; + max-width: 16.66666667%; } .col-sm-3 { flex: 0 0 25%; max-width: 25%; } .col-sm-4 { - flex: 0 0 33.33333%; - max-width: 33.33333%; + flex: 0 0 33.33333333%; + max-width: 33.33333333%; } .col-sm-5 { - flex: 0 0 41.66667%; - max-width: 41.66667%; + flex: 0 0 41.66666667%; + max-width: 41.66666667%; } .col-sm-6 { flex: 0 0 50%; max-width: 50%; } .col-sm-7 { - flex: 0 0 58.33333%; - max-width: 58.33333%; + flex: 0 0 58.33333333%; + max-width: 58.33333333%; } .col-sm-8 { - flex: 0 0 66.66667%; - max-width: 66.66667%; + flex: 0 0 66.66666667%; + max-width: 66.66666667%; } .col-sm-9 { flex: 0 0 75%; max-width: 75%; } .col-sm-10 { - flex: 0 0 83.33333%; - max-width: 83.33333%; + flex: 0 0 83.33333333%; + max-width: 83.33333333%; } .col-sm-11 { - flex: 0 0 91.66667%; - max-width: 91.66667%; + flex: 0 0 91.66666667%; + max-width: 91.66666667%; } .col-sm-12 { flex: 0 0 100%; @@ -926,44 +1040,43 @@ pre code { margin-left: 0; } .offset-sm-1 { - margin-left: 8.33333%; + margin-left: 8.33333333%; } .offset-sm-2 { - margin-left: 16.66667%; + margin-left: 16.66666667%; } .offset-sm-3 { margin-left: 25%; } .offset-sm-4 { - margin-left: 33.33333%; + margin-left: 33.33333333%; } .offset-sm-5 { - margin-left: 41.66667%; + margin-left: 41.66666667%; } .offset-sm-6 { margin-left: 50%; } .offset-sm-7 { - margin-left: 58.33333%; + margin-left: 58.33333333%; } .offset-sm-8 { - margin-left: 66.66667%; + margin-left: 66.66666667%; } .offset-sm-9 { margin-left: 75%; } .offset-sm-10 { - margin-left: 83.33333%; + margin-left: 83.33333333%; } .offset-sm-11 { - margin-left: 91.66667%; + margin-left: 91.66666667%; } } @media (min-width: 768px) { .col-md { flex-basis: 0; flex-grow: 1; - min-width: 0; max-width: 100%; } .row-cols-md-1 > * { @@ -975,8 +1088,8 @@ pre code { max-width: 50%; } .row-cols-md-3 > * { - flex: 0 0 33.33333%; - max-width: 33.33333%; + flex: 0 0 33.3333333333%; + max-width: 33.3333333333%; } .row-cols-md-4 > * { flex: 0 0 25%; @@ -987,8 +1100,8 @@ pre code { max-width: 20%; } .row-cols-md-6 > * { - flex: 0 0 16.66667%; - max-width: 16.66667%; + flex: 0 0 16.6666666667%; + max-width: 16.6666666667%; } .col-md-auto { flex: 0 0 auto; @@ -996,48 +1109,48 @@ pre code { max-width: 100%; } .col-md-1 { - flex: 0 0 8.33333%; - max-width: 8.33333%; + flex: 0 0 8.33333333%; + max-width: 8.33333333%; } .col-md-2 { - flex: 0 0 16.66667%; - max-width: 16.66667%; + flex: 0 0 16.66666667%; + max-width: 16.66666667%; } .col-md-3 { flex: 0 0 25%; max-width: 25%; } .col-md-4 { - flex: 0 0 33.33333%; - max-width: 33.33333%; + flex: 0 0 33.33333333%; + max-width: 33.33333333%; } .col-md-5 { - flex: 0 0 41.66667%; - max-width: 41.66667%; + flex: 0 0 41.66666667%; + max-width: 41.66666667%; } .col-md-6 { flex: 0 0 50%; max-width: 50%; } .col-md-7 { - flex: 0 0 58.33333%; - max-width: 58.33333%; + flex: 0 0 58.33333333%; + max-width: 58.33333333%; } .col-md-8 { - flex: 0 0 66.66667%; - max-width: 66.66667%; + flex: 0 0 66.66666667%; + max-width: 66.66666667%; } .col-md-9 { flex: 0 0 75%; max-width: 75%; } .col-md-10 { - flex: 0 0 83.33333%; - max-width: 83.33333%; + flex: 0 0 83.33333333%; + max-width: 83.33333333%; } .col-md-11 { - flex: 0 0 91.66667%; - max-width: 91.66667%; + flex: 0 0 91.66666667%; + max-width: 91.66666667%; } .col-md-12 { flex: 0 0 100%; @@ -1092,44 +1205,43 @@ pre code { margin-left: 0; } .offset-md-1 { - margin-left: 8.33333%; + margin-left: 8.33333333%; } .offset-md-2 { - margin-left: 16.66667%; + margin-left: 16.66666667%; } .offset-md-3 { margin-left: 25%; } .offset-md-4 { - margin-left: 33.33333%; + margin-left: 33.33333333%; } .offset-md-5 { - margin-left: 41.66667%; + margin-left: 41.66666667%; } .offset-md-6 { margin-left: 50%; } .offset-md-7 { - margin-left: 58.33333%; + margin-left: 58.33333333%; } .offset-md-8 { - margin-left: 66.66667%; + margin-left: 66.66666667%; } .offset-md-9 { margin-left: 75%; } .offset-md-10 { - margin-left: 83.33333%; + margin-left: 83.33333333%; } .offset-md-11 { - margin-left: 91.66667%; + margin-left: 91.66666667%; } } @media (min-width: 992px) { .col-lg { flex-basis: 0; flex-grow: 1; - min-width: 0; max-width: 100%; } .row-cols-lg-1 > * { @@ -1141,8 +1253,8 @@ pre code { max-width: 50%; } .row-cols-lg-3 > * { - flex: 0 0 33.33333%; - max-width: 33.33333%; + flex: 0 0 33.3333333333%; + max-width: 33.3333333333%; } .row-cols-lg-4 > * { flex: 0 0 25%; @@ -1153,8 +1265,8 @@ pre code { max-width: 20%; } .row-cols-lg-6 > * { - flex: 0 0 16.66667%; - max-width: 16.66667%; + flex: 0 0 16.6666666667%; + max-width: 16.6666666667%; } .col-lg-auto { flex: 0 0 auto; @@ -1162,48 +1274,48 @@ pre code { max-width: 100%; } .col-lg-1 { - flex: 0 0 8.33333%; - max-width: 8.33333%; + flex: 0 0 8.33333333%; + max-width: 8.33333333%; } .col-lg-2 { - flex: 0 0 16.66667%; - max-width: 16.66667%; + flex: 0 0 16.66666667%; + max-width: 16.66666667%; } .col-lg-3 { flex: 0 0 25%; max-width: 25%; } .col-lg-4 { - flex: 0 0 33.33333%; - max-width: 33.33333%; + flex: 0 0 33.33333333%; + max-width: 33.33333333%; } .col-lg-5 { - flex: 0 0 41.66667%; - max-width: 41.66667%; + flex: 0 0 41.66666667%; + max-width: 41.66666667%; } .col-lg-6 { flex: 0 0 50%; max-width: 50%; } .col-lg-7 { - flex: 0 0 58.33333%; - max-width: 58.33333%; + flex: 0 0 58.33333333%; + max-width: 58.33333333%; } .col-lg-8 { - flex: 0 0 66.66667%; - max-width: 66.66667%; + flex: 0 0 66.66666667%; + max-width: 66.66666667%; } .col-lg-9 { flex: 0 0 75%; max-width: 75%; } .col-lg-10 { - flex: 0 0 83.33333%; - max-width: 83.33333%; + flex: 0 0 83.33333333%; + max-width: 83.33333333%; } .col-lg-11 { - flex: 0 0 91.66667%; - max-width: 91.66667%; + flex: 0 0 91.66666667%; + max-width: 91.66666667%; } .col-lg-12 { flex: 0 0 100%; @@ -1258,44 +1370,43 @@ pre code { margin-left: 0; } .offset-lg-1 { - margin-left: 8.33333%; + margin-left: 8.33333333%; } .offset-lg-2 { - margin-left: 16.66667%; + margin-left: 16.66666667%; } .offset-lg-3 { margin-left: 25%; } .offset-lg-4 { - margin-left: 33.33333%; + margin-left: 33.33333333%; } .offset-lg-5 { - margin-left: 41.66667%; + margin-left: 41.66666667%; } .offset-lg-6 { margin-left: 50%; } .offset-lg-7 { - margin-left: 58.33333%; + margin-left: 58.33333333%; } .offset-lg-8 { - margin-left: 66.66667%; + margin-left: 66.66666667%; } .offset-lg-9 { margin-left: 75%; } .offset-lg-10 { - margin-left: 83.33333%; + margin-left: 83.33333333%; } .offset-lg-11 { - margin-left: 91.66667%; + margin-left: 91.66666667%; } } @media (min-width: 1200px) { .col-xl { flex-basis: 0; flex-grow: 1; - min-width: 0; max-width: 100%; } .row-cols-xl-1 > * { @@ -1307,8 +1418,8 @@ pre code { max-width: 50%; } .row-cols-xl-3 > * { - flex: 0 0 33.33333%; - max-width: 33.33333%; + flex: 0 0 33.3333333333%; + max-width: 33.3333333333%; } .row-cols-xl-4 > * { flex: 0 0 25%; @@ -1319,8 +1430,8 @@ pre code { max-width: 20%; } .row-cols-xl-6 > * { - flex: 0 0 16.66667%; - max-width: 16.66667%; + flex: 0 0 16.6666666667%; + max-width: 16.6666666667%; } .col-xl-auto { flex: 0 0 auto; @@ -1328,48 +1439,48 @@ pre code { max-width: 100%; } .col-xl-1 { - flex: 0 0 8.33333%; - max-width: 8.33333%; + flex: 0 0 8.33333333%; + max-width: 8.33333333%; } .col-xl-2 { - flex: 0 0 16.66667%; - max-width: 16.66667%; + flex: 0 0 16.66666667%; + max-width: 16.66666667%; } .col-xl-3 { flex: 0 0 25%; max-width: 25%; } .col-xl-4 { - flex: 0 0 33.33333%; - max-width: 33.33333%; + flex: 0 0 33.33333333%; + max-width: 33.33333333%; } .col-xl-5 { - flex: 0 0 41.66667%; - max-width: 41.66667%; + flex: 0 0 41.66666667%; + max-width: 41.66666667%; } .col-xl-6 { flex: 0 0 50%; max-width: 50%; } .col-xl-7 { - flex: 0 0 58.33333%; - max-width: 58.33333%; + flex: 0 0 58.33333333%; + max-width: 58.33333333%; } .col-xl-8 { - flex: 0 0 66.66667%; - max-width: 66.66667%; + flex: 0 0 66.66666667%; + max-width: 66.66666667%; } .col-xl-9 { flex: 0 0 75%; max-width: 75%; } .col-xl-10 { - flex: 0 0 83.33333%; - max-width: 83.33333%; + flex: 0 0 83.33333333%; + max-width: 83.33333333%; } .col-xl-11 { - flex: 0 0 91.66667%; - max-width: 91.66667%; + flex: 0 0 91.66666667%; + max-width: 91.66666667%; } .col-xl-12 { flex: 0 0 100%; @@ -1424,37 +1535,37 @@ pre code { margin-left: 0; } .offset-xl-1 { - margin-left: 8.33333%; + margin-left: 8.33333333%; } .offset-xl-2 { - margin-left: 16.66667%; + margin-left: 16.66666667%; } .offset-xl-3 { margin-left: 25%; } .offset-xl-4 { - margin-left: 33.33333%; + margin-left: 33.33333333%; } .offset-xl-5 { - margin-left: 41.66667%; + margin-left: 41.66666667%; } .offset-xl-6 { margin-left: 50%; } .offset-xl-7 { - margin-left: 58.33333%; + margin-left: 58.33333333%; } .offset-xl-8 { - margin-left: 66.66667%; + margin-left: 66.66666667%; } .offset-xl-9 { margin-left: 75%; } .offset-xl-10 { - margin-left: 83.33333%; + margin-left: 83.33333333%; } .offset-xl-11 { - margin-left: 91.66667%; + margin-left: 91.66666667%; } } .table { @@ -1462,8 +1573,8 @@ pre code { margin-bottom: 1rem; color: #495057; } -.table td, -.table th { +.table th, +.table td { padding: 0.75rem; vertical-align: top; border-top: 1px solid #495057; @@ -1475,45 +1586,52 @@ pre code { .table tbody + tbody { border-top: 2px solid #495057; } -.table-sm td, -.table-sm th { + +.table-sm th, +.table-sm td { padding: 0.3rem; } + .table-bordered { border: 1px solid #495057; } -.table-bordered td, -.table-bordered th { +.table-bordered th, +.table-bordered td { border: 1px solid #495057; } -.table-bordered thead td, -.table-bordered thead th { +.table-bordered thead th, +.table-bordered thead td { border-bottom-width: 2px; } -.table-borderless tbody + tbody, -.table-borderless td, + .table-borderless th, -.table-borderless thead th { +.table-borderless td, +.table-borderless thead th, +.table-borderless tbody + tbody { border: 0; } + .table-striped tbody tr:nth-of-type(odd) { background-color: rgba(34, 34, 34, 0.05); } + .table-hover tbody tr:hover { color: #495057; background-color: rgba(34, 34, 34, 0.075); } + .table-primary, -.table-primary > td, -.table-primary > th { +.table-primary > th, +.table-primary > td { background-color: #fbd4c0; } -.table-primary tbody + tbody, -.table-primary td, .table-primary th, -.table-primary thead th { +.table-primary td, +.table-primary thead th, +.table-primary tbody + tbody { border-color: #f8ae8a; } + .table-hover .table-primary:hover { background-color: #f9c4a8; } @@ -1521,35 +1639,39 @@ pre code { .table-hover .table-primary:hover > th { background-color: #f9c4a8; } + .table-secondary, -.table-secondary > td, -.table-secondary > th { - background-color: #b8f0cf; +.table-secondary > th, +.table-secondary > td { + background-color: #f0b8b8; } -.table-secondary tbody + tbody, -.table-secondary td, .table-secondary th, -.table-secondary thead th { - border-color: #7ae2a6; +.table-secondary td, +.table-secondary thead th, +.table-secondary tbody + tbody { + border-color: #e27a7a; } + .table-hover .table-secondary:hover { - background-color: #a3ecc1; + background-color: #eca3a3; } .table-hover .table-secondary:hover > td, .table-hover .table-secondary:hover > th { - background-color: #a3ecc1; + background-color: #eca3a3; } + .table-success, -.table-success > td, -.table-success > th { +.table-success > th, +.table-success > td { background-color: #d4bcfb; } -.table-success tbody + tbody, -.table-success td, .table-success th, -.table-success thead th { +.table-success td, +.table-success thead th, +.table-success tbody + tbody { border-color: #af83f8; } + .table-hover .table-success:hover { background-color: #c5a4fa; } @@ -1557,17 +1679,19 @@ pre code { .table-hover .table-success:hover > th { background-color: #c5a4fa; } + .table-info, -.table-info > td, -.table-info > th { +.table-info > th, +.table-info > td { background-color: #b8daff; } -.table-info tbody + tbody, -.table-info td, .table-info th, -.table-info thead th { +.table-info td, +.table-info thead th, +.table-info tbody + tbody { border-color: #7abaff; } + .table-hover .table-info:hover { background-color: #9fcdff; } @@ -1575,17 +1699,19 @@ pre code { .table-hover .table-info:hover > th { background-color: #9fcdff; } + .table-warning, -.table-warning > td, -.table-warning > th { +.table-warning > th, +.table-warning > td { background-color: #ffeeba; } -.table-warning tbody + tbody, -.table-warning td, .table-warning th, -.table-warning thead th { +.table-warning td, +.table-warning thead th, +.table-warning tbody + tbody { border-color: #ffdf7e; } + .table-hover .table-warning:hover { background-color: #ffe8a1; } @@ -1593,35 +1719,39 @@ pre code { .table-hover .table-warning:hover > th { background-color: #ffe8a1; } + .table-danger, -.table-danger > td, -.table-danger > th { - background-color: #ddc6ba; +.table-danger > th, +.table-danger > td { + background-color: #dfc6ba; } -.table-danger tbody + tbody, -.table-danger td, .table-danger th, -.table-danger thead th { - border-color: #c1957f; +.table-danger td, +.table-danger thead th, +.table-danger tbody + tbody { + border-color: #c3957f; } + .table-hover .table-danger:hover { - background-color: #d5b8a9; + background-color: #d7b8a9; } .table-hover .table-danger:hover > td, .table-hover .table-danger:hover > th { - background-color: #d5b8a9; + background-color: #d7b8a9; } + .table-light, -.table-light > td, -.table-light > th { +.table-light > th, +.table-light > td { background-color: #fdfdfe; } -.table-light tbody + tbody, -.table-light td, .table-light th, -.table-light thead th { +.table-light td, +.table-light thead th, +.table-light tbody + tbody { border-color: #fbfcfc; } + .table-hover .table-light:hover { background-color: #ececf6; } @@ -1629,17 +1759,19 @@ pre code { .table-hover .table-light:hover > th { background-color: #ececf6; } + .table-dark, -.table-dark > td, -.table-dark > th { +.table-dark > th, +.table-dark > td { background-color: #c6c8ca; } -.table-dark tbody + tbody, -.table-dark td, .table-dark th, -.table-dark thead th { +.table-dark td, +.table-dark thead th, +.table-dark tbody + tbody { border-color: #95999c; } + .table-hover .table-dark:hover { background-color: #b9bbbe; } @@ -1647,11 +1779,13 @@ pre code { .table-hover .table-dark:hover > th { background-color: #b9bbbe; } + .table-active, -.table-active > td, -.table-active > th { +.table-active > th, +.table-active > td { background-color: rgba(34, 34, 34, 0.075); } + .table-hover .table-active:hover { background-color: rgba(21, 21, 21, 0.075); } @@ -1659,8 +1793,9 @@ pre code { .table-hover .table-active:hover > th { background-color: rgba(21, 21, 21, 0.075); } + .table .thead-dark th { - color: #fff; + color: #ffffff; background-color: #343a40; border-color: #454d55; } @@ -1669,12 +1804,13 @@ pre code { background-color: #e9ecef; border-color: #495057; } + .table-dark { - color: #fff; + color: #ffffff; background-color: #343a40; } -.table-dark td, .table-dark th, +.table-dark td, .table-dark thead th { border-color: #454d55; } @@ -1685,9 +1821,10 @@ pre code { background-color: rgba(255, 255, 255, 0.05); } .table-dark.table-hover tbody tr:hover { - color: #fff; + color: #ffffff; background-color: rgba(255, 255, 255, 0.075); } + @media (max-width: 575.98px) { .table-responsive-sm { display: block; @@ -1741,6 +1878,7 @@ pre code { .table-responsive > .table-bordered { border: 0; } + .form-control { display: block; width: 100%; @@ -1750,7 +1888,7 @@ pre code { font-weight: 400; line-height: 1.5; color: #495057; - background-color: #fff; + background-color: #ffffff; background-clip: padding-box; border: 1px solid #ced4da; border-radius: 0.5rem; @@ -1765,16 +1903,12 @@ pre code { background-color: transparent; border: 0; } -.form-control:-moz-focusring { - color: transparent; - text-shadow: 0 0 0 #495057; -} .form-control:focus { color: #495057; - background-color: #fff; - border-color: #f89696; + background-color: #ffffff; + border-color: #f8b796; outline: 0; - box-shadow: 0 0 0 0.2rem rgba(241, 30, 30, 0.75); + box-shadow: 0 0 0 0.2rem rgba(241, 100, 30, 0.75); } .form-control::placeholder { color: #6c757d; @@ -1785,21 +1919,29 @@ pre code { background-color: #e9ecef; opacity: 1; } + input[type="date"].form-control, +input[type="time"].form-control, input[type="datetime-local"].form-control, -input[type="month"].form-control, -input[type="time"].form-control { +input[type="month"].form-control { appearance: none; } + +select.form-control:-moz-focusring { + color: transparent; + text-shadow: 0 0 0 #495057; +} select.form-control:focus::-ms-value { color: #495057; - background-color: #fff; + background-color: #ffffff; } + .form-control-file, .form-control-range { display: block; width: 100%; } + .col-form-label { padding-top: calc(0.375rem + 1px); padding-bottom: calc(0.375rem + 1px); @@ -1807,18 +1949,21 @@ select.form-control:focus::-ms-value { font-size: inherit; line-height: 1.5; } + .col-form-label-lg { padding-top: calc(0.5rem + 1px); padding-bottom: calc(0.5rem + 1px); font-size: 1.25rem; line-height: 1.5; } + .col-form-label-sm { padding-top: calc(0.25rem + 1px); padding-bottom: calc(0.25rem + 1px); font-size: 0.875rem; line-height: 1.5; } + .form-control-plaintext { display: block; width: 100%; @@ -1831,11 +1976,12 @@ select.form-control:focus::-ms-value { border: solid transparent; border-width: 1px 0; } -.form-control-plaintext.form-control-lg, -.form-control-plaintext.form-control-sm { +.form-control-plaintext.form-control-sm, +.form-control-plaintext.form-control-lg { padding-right: 0; padding-left: 0; } + .form-control-sm { height: calc(1.5em + 0.5rem + 2px); padding: 0.25rem 0.5rem; @@ -1843,6 +1989,7 @@ select.form-control:focus::-ms-value { line-height: 1.5; border-radius: 1rem; } + .form-control-lg { height: calc(1.5em + 1rem + 2px); padding: 0.5rem 1rem; @@ -1850,20 +1997,25 @@ select.form-control:focus::-ms-value { line-height: 1.5; border-radius: 0.5rem; } -select.form-control[multiple], -select.form-control[size] { + +select.form-control[size], +select.form-control[multiple] { height: auto; } + textarea.form-control { height: auto; } + .form-group { margin-bottom: 1rem; } + .form-text { display: block; margin-top: 0.25rem; } + .form-row { display: flex; flex-wrap: wrap; @@ -1875,23 +2027,27 @@ textarea.form-control { padding-right: 5px; padding-left: 5px; } + .form-check { position: relative; display: block; padding-left: 1.25rem; } + .form-check-input { position: absolute; margin-top: 0.3rem; margin-left: -1.25rem; } -.form-check-input:disabled ~ .form-check-label, -.form-check-input[disabled] ~ .form-check-label { +.form-check-input[disabled] ~ .form-check-label, +.form-check-input:disabled ~ .form-check-label { color: #6c757d; } + .form-check-label { margin-bottom: 0; } + .form-check-inline { display: inline-flex; align-items: center; @@ -1904,16 +2060,19 @@ textarea.form-control { margin-right: 0.3125rem; margin-left: 0; } + .valid-feedback { display: none; width: 100%; margin-top: 0.25rem; - font-size: 80%; + font-size: 0.875em; color: #007bff; } + .valid-tooltip { position: absolute; top: 100%; + left: 0; z-index: 5; display: none; max-width: 100%; @@ -1921,108 +2080,129 @@ textarea.form-control { margin-top: 0.1rem; font-size: 0.875rem; line-height: 1.5; - color: #fff; + color: #ffffff; background-color: rgba(0, 123, 255, 0.9); border-radius: 0.5rem; } -.is-valid ~ .valid-feedback, -.is-valid ~ .valid-tooltip, +.form-row > .col > .valid-tooltip, +.form-row > [class*="col-"] > .valid-tooltip { + left: 5px; +} + .was-validated :valid ~ .valid-feedback, -.was-validated :valid ~ .valid-tooltip { +.was-validated :valid ~ .valid-tooltip, +.is-valid ~ .valid-feedback, +.is-valid ~ .valid-tooltip { display: block; } -.form-control.is-valid, -.was-validated .form-control:valid { + +.was-validated .form-control:valid, +.form-control.is-valid { border-color: #007bff; - padding-right: calc(1.5em + 0.75rem); + padding-right: calc(1.5em + 0.75rem) !important; background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath fill='%23007bff' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e"); background-repeat: no-repeat; background-position: right calc(0.375em + 0.1875rem) center; background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem); } -.form-control.is-valid:focus, -.was-validated .form-control:valid:focus { +.was-validated .form-control:valid:focus, +.form-control.is-valid:focus { border-color: #007bff; box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25); } + +.was-validated select.form-control:valid, +select.form-control.is-valid { + padding-right: 3rem !important; + background-position: right 1.5rem center; +} + .was-validated textarea.form-control:valid, textarea.form-control.is-valid { padding-right: calc(1.5em + 0.75rem); background-position: top calc(0.375em + 0.1875rem) right calc(0.375em + 0.1875rem); } -.custom-select.is-valid, -.was-validated .custom-select:valid { + +.was-validated .custom-select:valid, +.custom-select.is-valid { border-color: #007bff; - padding-right: calc(0.75em + 2.3125rem); + padding-right: calc(0.75em + 2.3125rem) !important; background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='4' height='5' viewBox='0 0 4 5'%3e%3cpath fill='%23343a40' d='M2 0L0 2h4zm0 5L0 3h4z'/%3e%3c/svg%3e") - no-repeat right 0.75rem center/8px 10px, - url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath fill='%23007bff' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e") - #fff no-repeat center right 1.75rem / calc(0.75em + 0.375rem) - calc(0.75em + 0.375rem); + right 0.75rem center/8px 10px no-repeat, + #ffffff + url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath fill='%23007bff' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e") + center right 1.75rem / calc(0.75em + 0.375rem) calc(0.75em + 0.375rem) + no-repeat; } -.custom-select.is-valid:focus, -.was-validated .custom-select:valid:focus { +.was-validated .custom-select:valid:focus, +.custom-select.is-valid:focus { border-color: #007bff; box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25); } -.form-check-input.is-valid ~ .form-check-label, -.was-validated .form-check-input:valid ~ .form-check-label { + +.was-validated .form-check-input:valid ~ .form-check-label, +.form-check-input.is-valid ~ .form-check-label { color: #007bff; } -.form-check-input.is-valid ~ .valid-feedback, -.form-check-input.is-valid ~ .valid-tooltip, .was-validated .form-check-input:valid ~ .valid-feedback, -.was-validated .form-check-input:valid ~ .valid-tooltip { +.was-validated .form-check-input:valid ~ .valid-tooltip, +.form-check-input.is-valid ~ .valid-feedback, +.form-check-input.is-valid ~ .valid-tooltip { display: block; } -.custom-control-input.is-valid ~ .custom-control-label, -.was-validated .custom-control-input:valid ~ .custom-control-label { + +.was-validated .custom-control-input:valid ~ .custom-control-label, +.custom-control-input.is-valid ~ .custom-control-label { color: #007bff; } -.custom-control-input.is-valid ~ .custom-control-label::before, -.was-validated .custom-control-input:valid ~ .custom-control-label::before { +.was-validated .custom-control-input:valid ~ .custom-control-label::before, +.custom-control-input.is-valid ~ .custom-control-label::before { border-color: #007bff; } -.custom-control-input.is-valid:checked ~ .custom-control-label::before, .was-validated .custom-control-input:valid:checked - ~ .custom-control-label::before { + ~ .custom-control-label::before, +.custom-control-input.is-valid:checked ~ .custom-control-label::before { border-color: #3395ff; background-color: #3395ff; } -.custom-control-input.is-valid:focus ~ .custom-control-label::before, .was-validated .custom-control-input:valid:focus - ~ .custom-control-label::before { + ~ .custom-control-label::before, +.custom-control-input.is-valid:focus ~ .custom-control-label::before { box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25); } -.custom-control-input.is-valid:focus:not(:checked) - ~ .custom-control-label::before, .was-validated .custom-control-input:valid:focus:not(:checked) + ~ .custom-control-label::before, +.custom-control-input.is-valid:focus:not(:checked) ~ .custom-control-label::before { border-color: #007bff; } -.custom-file-input.is-valid ~ .custom-file-label, -.was-validated .custom-file-input:valid ~ .custom-file-label { + +.was-validated .custom-file-input:valid ~ .custom-file-label, +.custom-file-input.is-valid ~ .custom-file-label { border-color: #007bff; } -.custom-file-input.is-valid:focus ~ .custom-file-label, -.was-validated .custom-file-input:valid:focus ~ .custom-file-label { +.was-validated .custom-file-input:valid:focus ~ .custom-file-label, +.custom-file-input.is-valid:focus ~ .custom-file-label { border-color: #007bff; box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25); } + .invalid-feedback { display: none; width: 100%; margin-top: 0.25rem; - font-size: 80%; - color: #873208; + font-size: 0.875em; + color: #8c3409; } + .invalid-tooltip { position: absolute; top: 100%; + left: 0; z-index: 5; display: none; max-width: 100%; @@ -2030,98 +2210,117 @@ textarea.form-control.is-valid { margin-top: 0.1rem; font-size: 0.875rem; line-height: 1.5; - color: #fff; - background-color: rgba(135, 50, 8, 0.9); + color: #ffffff; + background-color: rgba(140, 52, 9, 0.9); border-radius: 0.5rem; } -.is-invalid ~ .invalid-feedback, -.is-invalid ~ .invalid-tooltip, +.form-row > .col > .invalid-tooltip, +.form-row > [class*="col-"] > .invalid-tooltip { + left: 5px; +} + .was-validated :invalid ~ .invalid-feedback, -.was-validated :invalid ~ .invalid-tooltip { +.was-validated :invalid ~ .invalid-tooltip, +.is-invalid ~ .invalid-feedback, +.is-invalid ~ .invalid-tooltip { display: block; } -.form-control.is-invalid, -.was-validated .form-control:invalid { - border-color: #873208; - padding-right: calc(1.5em + 0.75rem); - background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23873208' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23873208' stroke='none'/%3e%3c/svg%3e"); + +.was-validated .form-control:invalid, +.form-control.is-invalid { + border-color: #8c3409; + padding-right: calc(1.5em + 0.75rem) !important; + background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%238c3409' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%238c3409' stroke='none'/%3e%3c/svg%3e"); background-repeat: no-repeat; background-position: right calc(0.375em + 0.1875rem) center; background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem); } -.form-control.is-invalid:focus, -.was-validated .form-control:invalid:focus { - border-color: #873208; - box-shadow: 0 0 0 0.2rem rgba(135, 50, 8, 0.25); +.was-validated .form-control:invalid:focus, +.form-control.is-invalid:focus { + border-color: #8c3409; + box-shadow: 0 0 0 0.2rem rgba(140, 52, 9, 0.25); } + +.was-validated select.form-control:invalid, +select.form-control.is-invalid { + padding-right: 3rem !important; + background-position: right 1.5rem center; +} + .was-validated textarea.form-control:invalid, textarea.form-control.is-invalid { padding-right: calc(1.5em + 0.75rem); background-position: top calc(0.375em + 0.1875rem) right calc(0.375em + 0.1875rem); } -.custom-select.is-invalid, -.was-validated .custom-select:invalid { - border-color: #873208; - padding-right: calc(0.75em + 2.3125rem); + +.was-validated .custom-select:invalid, +.custom-select.is-invalid { + border-color: #8c3409; + padding-right: calc(0.75em + 2.3125rem) !important; background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='4' height='5' viewBox='0 0 4 5'%3e%3cpath fill='%23343a40' d='M2 0L0 2h4zm0 5L0 3h4z'/%3e%3c/svg%3e") - no-repeat right 0.75rem center/8px 10px, - url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23873208' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23873208' stroke='none'/%3e%3c/svg%3e") - #fff no-repeat center right 1.75rem / calc(0.75em + 0.375rem) - calc(0.75em + 0.375rem); + right 0.75rem center/8px 10px no-repeat, + #ffffff + url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%238c3409' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%238c3409' stroke='none'/%3e%3c/svg%3e") + center right 1.75rem / calc(0.75em + 0.375rem) calc(0.75em + 0.375rem) + no-repeat; } -.custom-select.is-invalid:focus, -.was-validated .custom-select:invalid:focus { - border-color: #873208; - box-shadow: 0 0 0 0.2rem rgba(135, 50, 8, 0.25); +.was-validated .custom-select:invalid:focus, +.custom-select.is-invalid:focus { + border-color: #8c3409; + box-shadow: 0 0 0 0.2rem rgba(140, 52, 9, 0.25); } -.form-check-input.is-invalid ~ .form-check-label, -.was-validated .form-check-input:invalid ~ .form-check-label { - color: #873208; + +.was-validated .form-check-input:invalid ~ .form-check-label, +.form-check-input.is-invalid ~ .form-check-label { + color: #8c3409; } -.form-check-input.is-invalid ~ .invalid-feedback, -.form-check-input.is-invalid ~ .invalid-tooltip, .was-validated .form-check-input:invalid ~ .invalid-feedback, -.was-validated .form-check-input:invalid ~ .invalid-tooltip { +.was-validated .form-check-input:invalid ~ .invalid-tooltip, +.form-check-input.is-invalid ~ .invalid-feedback, +.form-check-input.is-invalid ~ .invalid-tooltip { display: block; } -.custom-control-input.is-invalid ~ .custom-control-label, -.was-validated .custom-control-input:invalid ~ .custom-control-label { - color: #873208; + +.was-validated .custom-control-input:invalid ~ .custom-control-label, +.custom-control-input.is-invalid ~ .custom-control-label { + color: #8c3409; } -.custom-control-input.is-invalid ~ .custom-control-label::before, -.was-validated .custom-control-input:invalid ~ .custom-control-label::before { - border-color: #873208; +.was-validated .custom-control-input:invalid ~ .custom-control-label::before, +.custom-control-input.is-invalid ~ .custom-control-label::before { + border-color: #8c3409; } -.custom-control-input.is-invalid:checked ~ .custom-control-label::before, .was-validated .custom-control-input:invalid:checked - ~ .custom-control-label::before { - border-color: #b7440b; - background-color: #b7440b; + ~ .custom-control-label::before, +.custom-control-input.is-invalid:checked ~ .custom-control-label::before { + border-color: #bc460c; + background-color: #bc460c; } -.custom-control-input.is-invalid:focus ~ .custom-control-label::before, .was-validated .custom-control-input:invalid:focus - ~ .custom-control-label::before { - box-shadow: 0 0 0 0.2rem rgba(135, 50, 8, 0.25); -} -.custom-control-input.is-invalid:focus:not(:checked) ~ .custom-control-label::before, +.custom-control-input.is-invalid:focus ~ .custom-control-label::before { + box-shadow: 0 0 0 0.2rem rgba(140, 52, 9, 0.25); +} .was-validated .custom-control-input:invalid:focus:not(:checked) + ~ .custom-control-label::before, +.custom-control-input.is-invalid:focus:not(:checked) ~ .custom-control-label::before { - border-color: #873208; + border-color: #8c3409; } -.custom-file-input.is-invalid ~ .custom-file-label, -.was-validated .custom-file-input:invalid ~ .custom-file-label { - border-color: #873208; + +.was-validated .custom-file-input:invalid ~ .custom-file-label, +.custom-file-input.is-invalid ~ .custom-file-label { + border-color: #8c3409; } -.custom-file-input.is-invalid:focus ~ .custom-file-label, -.was-validated .custom-file-input:invalid:focus ~ .custom-file-label { - border-color: #873208; - box-shadow: 0 0 0 0.2rem rgba(135, 50, 8, 0.25); +.was-validated .custom-file-input:invalid:focus ~ .custom-file-label, +.custom-file-input.is-invalid:focus ~ .custom-file-label { + border-color: #8c3409; + box-shadow: 0 0 0 0.2rem rgba(140, 52, 9, 0.25); } + .form-inline { display: flex; flex-flow: row wrap; @@ -2152,8 +2351,8 @@ textarea.form-control.is-invalid { .form-inline .form-control-plaintext { display: inline-block; } - .form-inline .custom-select, - .form-inline .input-group { + .form-inline .input-group, + .form-inline .custom-select { width: auto; } .form-inline .form-check { @@ -2178,6 +2377,7 @@ textarea.form-control.is-invalid { margin-bottom: 0; } } + .btn { display: inline-block; font-weight: 400; @@ -2203,10 +2403,10 @@ textarea.form-control.is-invalid { color: #495057; text-decoration: none; } -.btn.focus, -.btn:focus { +.btn:focus, +.btn.focus { outline: 0; - box-shadow: 0 0 0 0.2rem rgba(241, 30, 30, 0.75); + box-shadow: 0 0 0 0.2rem rgba(241, 100, 30, 0.75); } .btn.disabled, .btn:disabled { @@ -2219,146 +2419,151 @@ a.btn.disabled, fieldset:disabled a.btn { pointer-events: none; } + .btn-primary { - color: #fff; + color: #ffffff; background-color: #f1641e; border-color: #f1641e; } .btn-primary:hover { - color: #fff; + color: #ffffff; background-color: #db520e; border-color: #cf4d0d; } -.btn-primary.focus, -.btn-primary:focus { - color: #fff; +.btn-primary:focus, +.btn-primary.focus { + color: #ffffff; background-color: #db520e; border-color: #cf4d0d; box-shadow: 0 0 0 0.2rem rgba(243, 123, 64, 0.5); } .btn-primary.disabled, .btn-primary:disabled { - color: #fff; + color: #ffffff; background-color: #f1641e; border-color: #f1641e; } -.btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active, +.btn-primary:not(:disabled):not(.disabled).active, .show > .btn-primary.dropdown-toggle { - color: #fff; + color: #ffffff; background-color: #cf4d0d; border-color: #c3490c; } -.btn-primary:not(:disabled):not(.disabled).active:focus, .btn-primary:not(:disabled):not(.disabled):active:focus, +.btn-primary:not(:disabled):not(.disabled).active:focus, .show > .btn-primary.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem rgba(243, 123, 64, 0.5); } + .btn-secondary { - color: #fff; + color: #ffffff; background-color: #c80000; border-color: #c80000; } .btn-secondary:hover { - color: #fff; + color: #ffffff; background-color: #a20000; border-color: #950000; } -.btn-secondary.focus, -.btn-secondary:focus { - color: #fff; - background-color: #00a243; - border-color: #00953e; - box-shadow: 0 0 0 0.2rem rgba(38, 208, 109, 0.5); +.btn-secondary:focus, +.btn-secondary.focus { + color: #ffffff; + background-color: #a20000; + border-color: #950000; + box-shadow: 0 0 0 0.2rem rgba(208, 38, 38, 0.5); } .btn-secondary.disabled, .btn-secondary:disabled { - color: #fff; + color: #ffffff; background-color: #c80000; border-color: #c80000; } -.btn-secondary:not(:disabled):not(.disabled).active, .btn-secondary:not(:disabled):not(.disabled):active, +.btn-secondary:not(:disabled):not(.disabled).active, .show > .btn-secondary.dropdown-toggle { - color: #fff; - background-color: #00953e; - border-color: #008839; + color: #ffffff; + background-color: #950000; + border-color: #880000; } -.btn-secondary:not(:disabled):not(.disabled).active:focus, .btn-secondary:not(:disabled):not(.disabled):active:focus, +.btn-secondary:not(:disabled):not(.disabled).active:focus, .show > .btn-secondary.dropdown-toggle:focus { - box-shadow: 0 0 0 0.2rem rgba(38, 208, 109, 0.5); + box-shadow: 0 0 0 0.2rem rgba(208, 38, 38, 0.5); } + .btn-success { - color: #fff; + color: #ffffff; background-color: #6610f2; border-color: #6610f2; } .btn-success:hover { - color: #fff; + color: #ffffff; background-color: #560bd0; border-color: #510bc4; } -.btn-success.focus, -.btn-success:focus { - color: #fff; +.btn-success:focus, +.btn-success.focus { + color: #ffffff; background-color: #560bd0; border-color: #510bc4; box-shadow: 0 0 0 0.2rem rgba(125, 52, 244, 0.5); } .btn-success.disabled, .btn-success:disabled { - color: #fff; + color: #ffffff; background-color: #6610f2; border-color: #6610f2; } -.btn-success:not(:disabled):not(.disabled).active, .btn-success:not(:disabled):not(.disabled):active, +.btn-success:not(:disabled):not(.disabled).active, .show > .btn-success.dropdown-toggle { - color: #fff; + color: #ffffff; background-color: #510bc4; border-color: #4c0ab8; } -.btn-success:not(:disabled):not(.disabled).active:focus, .btn-success:not(:disabled):not(.disabled):active:focus, +.btn-success:not(:disabled):not(.disabled).active:focus, .show > .btn-success.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem rgba(125, 52, 244, 0.5); } + .btn-info { - color: #fff; + color: #ffffff; background-color: #007bff; border-color: #007bff; } .btn-info:hover { - color: #fff; + color: #ffffff; background-color: #0069d9; border-color: #0062cc; } -.btn-info.focus, -.btn-info:focus { - color: #fff; +.btn-info:focus, +.btn-info.focus { + color: #ffffff; background-color: #0069d9; border-color: #0062cc; box-shadow: 0 0 0 0.2rem rgba(38, 143, 255, 0.5); } .btn-info.disabled, .btn-info:disabled { - color: #fff; + color: #ffffff; background-color: #007bff; border-color: #007bff; } -.btn-info:not(:disabled):not(.disabled).active, .btn-info:not(:disabled):not(.disabled):active, +.btn-info:not(:disabled):not(.disabled).active, .show > .btn-info.dropdown-toggle { - color: #fff; + color: #ffffff; background-color: #0062cc; border-color: #005cbf; } -.btn-info:not(:disabled):not(.disabled).active:focus, .btn-info:not(:disabled):not(.disabled):active:focus, +.btn-info:not(:disabled):not(.disabled).active:focus, .show > .btn-info.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem rgba(38, 143, 255, 0.5); } + .btn-warning { color: #212529; background-color: #ffc107; @@ -2369,8 +2574,8 @@ fieldset:disabled a.btn { background-color: #e0a800; border-color: #d39e00; } -.btn-warning.focus, -.btn-warning:focus { +.btn-warning:focus, +.btn-warning.focus { color: #212529; background-color: #e0a800; border-color: #d39e00; @@ -2382,53 +2587,55 @@ fieldset:disabled a.btn { background-color: #ffc107; border-color: #ffc107; } -.btn-warning:not(:disabled):not(.disabled).active, .btn-warning:not(:disabled):not(.disabled):active, +.btn-warning:not(:disabled):not(.disabled).active, .show > .btn-warning.dropdown-toggle { color: #212529; background-color: #d39e00; border-color: #c69500; } -.btn-warning:not(:disabled):not(.disabled).active:focus, .btn-warning:not(:disabled):not(.disabled):active:focus, +.btn-warning:not(:disabled):not(.disabled).active:focus, .show > .btn-warning.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem rgba(222, 170, 12, 0.5); } + .btn-danger { - color: #fff; - background-color: #873208; - border-color: #873208; + color: #ffffff; + background-color: #8c3409; + border-color: #8c3409; } .btn-danger:hover { - color: #fff; - background-color: #632506; - border-color: #572105; + color: #ffffff; + background-color: #682706; + border-color: #5c2206; } -.btn-danger.focus, -.btn-danger:focus { - color: #fff; - background-color: #632506; - border-color: #572105; - box-shadow: 0 0 0 0.2rem rgba(153, 81, 45, 0.5); +.btn-danger:focus, +.btn-danger.focus { + color: #ffffff; + background-color: #682706; + border-color: #5c2206; + box-shadow: 0 0 0 0.2rem rgba(157, 82, 46, 0.5); } .btn-danger.disabled, .btn-danger:disabled { - color: #fff; - background-color: #873208; - border-color: #873208; + color: #ffffff; + background-color: #8c3409; + border-color: #8c3409; } -.btn-danger:not(:disabled):not(.disabled).active, .btn-danger:not(:disabled):not(.disabled):active, +.btn-danger:not(:disabled):not(.disabled).active, .show > .btn-danger.dropdown-toggle { - color: #fff; - background-color: #572105; - border-color: #4b1c05; + color: #ffffff; + background-color: #5c2206; + border-color: #501e05; } -.btn-danger:not(:disabled):not(.disabled).active:focus, .btn-danger:not(:disabled):not(.disabled):active:focus, +.btn-danger:not(:disabled):not(.disabled).active:focus, .show > .btn-danger.dropdown-toggle:focus { - box-shadow: 0 0 0 0.2rem rgba(153, 81, 45, 0.5); + box-shadow: 0 0 0 0.2rem rgba(157, 82, 46, 0.5); } + .btn-light { color: #212529; background-color: #f8f9fa; @@ -2439,8 +2646,8 @@ fieldset:disabled a.btn { background-color: #e2e6ea; border-color: #dae0e5; } -.btn-light.focus, -.btn-light:focus { +.btn-light:focus, +.btn-light.focus { color: #212529; background-color: #e2e6ea; border-color: #dae0e5; @@ -2452,64 +2659,66 @@ fieldset:disabled a.btn { background-color: #f8f9fa; border-color: #f8f9fa; } -.btn-light:not(:disabled):not(.disabled).active, .btn-light:not(:disabled):not(.disabled):active, +.btn-light:not(:disabled):not(.disabled).active, .show > .btn-light.dropdown-toggle { color: #212529; background-color: #dae0e5; border-color: #d3d9df; } -.btn-light:not(:disabled):not(.disabled).active:focus, .btn-light:not(:disabled):not(.disabled):active:focus, +.btn-light:not(:disabled):not(.disabled).active:focus, .show > .btn-light.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem rgba(216, 217, 219, 0.5); } + .btn-dark { - color: #fff; + color: #ffffff; background-color: #343a40; border-color: #343a40; } .btn-dark:hover { - color: #fff; + color: #ffffff; background-color: #23272b; border-color: #1d2124; } -.btn-dark.focus, -.btn-dark:focus { - color: #fff; +.btn-dark:focus, +.btn-dark.focus { + color: #ffffff; background-color: #23272b; border-color: #1d2124; box-shadow: 0 0 0 0.2rem rgba(82, 88, 93, 0.5); } .btn-dark.disabled, .btn-dark:disabled { - color: #fff; + color: #ffffff; background-color: #343a40; border-color: #343a40; } -.btn-dark:not(:disabled):not(.disabled).active, .btn-dark:not(:disabled):not(.disabled):active, +.btn-dark:not(:disabled):not(.disabled).active, .show > .btn-dark.dropdown-toggle { - color: #fff; + color: #ffffff; background-color: #1d2124; border-color: #171a1d; } -.btn-dark:not(:disabled):not(.disabled).active:focus, .btn-dark:not(:disabled):not(.disabled):active:focus, +.btn-dark:not(:disabled):not(.disabled).active:focus, .show > .btn-dark.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem rgba(82, 88, 93, 0.5); } + .btn-outline-primary { color: #f1641e; border-color: #f1641e; } .btn-outline-primary:hover { - color: #fff; + color: #ffffff; background-color: #f1641e; border-color: #f1641e; } -.btn-outline-primary.focus, -.btn-outline-primary:focus { +.btn-outline-primary:focus, +.btn-outline-primary.focus { box-shadow: 0 0 0 0.2rem rgba(241, 100, 30, 0.5); } .btn-outline-primary.disabled, @@ -2517,59 +2726,61 @@ fieldset:disabled a.btn { color: #f1641e; background-color: transparent; } -.btn-outline-primary:not(:disabled):not(.disabled).active, .btn-outline-primary:not(:disabled):not(.disabled):active, +.btn-outline-primary:not(:disabled):not(.disabled).active, .show > .btn-outline-primary.dropdown-toggle { - color: #fff; + color: #ffffff; background-color: #f1641e; border-color: #f1641e; } -.btn-outline-primary:not(:disabled):not(.disabled).active:focus, .btn-outline-primary:not(:disabled):not(.disabled):active:focus, +.btn-outline-primary:not(:disabled):not(.disabled).active:focus, .show > .btn-outline-primary.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem rgba(241, 100, 30, 0.5); } + .btn-outline-secondary { color: #c80000; border-color: #c80000; } .btn-outline-secondary:hover { - color: #fff; + color: #ffffff; background-color: #c80000; border-color: #c80000; } -.btn-outline-secondary.focus, -.btn-outline-secondary:focus { - box-shadow: 0 0 0 0.2rem rgba(0, 200, 83, 0.5); +.btn-outline-secondary:focus, +.btn-outline-secondary.focus { + box-shadow: 0 0 0 0.2rem rgba(200, 0, 0, 0.5); } .btn-outline-secondary.disabled, .btn-outline-secondary:disabled { color: #c80000; background-color: transparent; } -.btn-outline-secondary:not(:disabled):not(.disabled).active, .btn-outline-secondary:not(:disabled):not(.disabled):active, +.btn-outline-secondary:not(:disabled):not(.disabled).active, .show > .btn-outline-secondary.dropdown-toggle { - color: #fff; + color: #ffffff; background-color: #c80000; border-color: #c80000; } -.btn-outline-secondary:not(:disabled):not(.disabled).active:focus, .btn-outline-secondary:not(:disabled):not(.disabled):active:focus, +.btn-outline-secondary:not(:disabled):not(.disabled).active:focus, .show > .btn-outline-secondary.dropdown-toggle:focus { - box-shadow: 0 0 0 0.2rem rgba(0, 200, 83, 0.5); + box-shadow: 0 0 0 0.2rem rgba(200, 0, 0, 0.5); } + .btn-outline-success { color: #6610f2; border-color: #6610f2; } .btn-outline-success:hover { - color: #fff; + color: #ffffff; background-color: #6610f2; border-color: #6610f2; } -.btn-outline-success.focus, -.btn-outline-success:focus { +.btn-outline-success:focus, +.btn-outline-success.focus { box-shadow: 0 0 0 0.2rem rgba(102, 16, 242, 0.5); } .btn-outline-success.disabled, @@ -2577,29 +2788,30 @@ fieldset:disabled a.btn { color: #6610f2; background-color: transparent; } -.btn-outline-success:not(:disabled):not(.disabled).active, .btn-outline-success:not(:disabled):not(.disabled):active, +.btn-outline-success:not(:disabled):not(.disabled).active, .show > .btn-outline-success.dropdown-toggle { - color: #fff; + color: #ffffff; background-color: #6610f2; border-color: #6610f2; } -.btn-outline-success:not(:disabled):not(.disabled).active:focus, .btn-outline-success:not(:disabled):not(.disabled):active:focus, +.btn-outline-success:not(:disabled):not(.disabled).active:focus, .show > .btn-outline-success.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem rgba(102, 16, 242, 0.5); } + .btn-outline-info { color: #007bff; border-color: #007bff; } .btn-outline-info:hover { - color: #fff; + color: #ffffff; background-color: #007bff; border-color: #007bff; } -.btn-outline-info.focus, -.btn-outline-info:focus { +.btn-outline-info:focus, +.btn-outline-info.focus { box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.5); } .btn-outline-info.disabled, @@ -2607,18 +2819,19 @@ fieldset:disabled a.btn { color: #007bff; background-color: transparent; } -.btn-outline-info:not(:disabled):not(.disabled).active, .btn-outline-info:not(:disabled):not(.disabled):active, +.btn-outline-info:not(:disabled):not(.disabled).active, .show > .btn-outline-info.dropdown-toggle { - color: #fff; + color: #ffffff; background-color: #007bff; border-color: #007bff; } -.btn-outline-info:not(:disabled):not(.disabled).active:focus, .btn-outline-info:not(:disabled):not(.disabled):active:focus, +.btn-outline-info:not(:disabled):not(.disabled).active:focus, .show > .btn-outline-info.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.5); } + .btn-outline-warning { color: #ffc107; border-color: #ffc107; @@ -2628,8 +2841,8 @@ fieldset:disabled a.btn { background-color: #ffc107; border-color: #ffc107; } -.btn-outline-warning.focus, -.btn-outline-warning:focus { +.btn-outline-warning:focus, +.btn-outline-warning.focus { box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); } .btn-outline-warning.disabled, @@ -2637,48 +2850,50 @@ fieldset:disabled a.btn { color: #ffc107; background-color: transparent; } -.btn-outline-warning:not(:disabled):not(.disabled).active, .btn-outline-warning:not(:disabled):not(.disabled):active, +.btn-outline-warning:not(:disabled):not(.disabled).active, .show > .btn-outline-warning.dropdown-toggle { color: #212529; background-color: #ffc107; border-color: #ffc107; } -.btn-outline-warning:not(:disabled):not(.disabled).active:focus, .btn-outline-warning:not(:disabled):not(.disabled):active:focus, +.btn-outline-warning:not(:disabled):not(.disabled).active:focus, .show > .btn-outline-warning.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); } + .btn-outline-danger { - color: #873208; - border-color: #873208; + color: #8c3409; + border-color: #8c3409; } .btn-outline-danger:hover { - color: #fff; - background-color: #873208; - border-color: #873208; + color: #ffffff; + background-color: #8c3409; + border-color: #8c3409; } -.btn-outline-danger.focus, -.btn-outline-danger:focus { - box-shadow: 0 0 0 0.2rem rgba(135, 50, 8, 0.5); +.btn-outline-danger:focus, +.btn-outline-danger.focus { + box-shadow: 0 0 0 0.2rem rgba(140, 52, 9, 0.5); } .btn-outline-danger.disabled, .btn-outline-danger:disabled { - color: #873208; + color: #8c3409; background-color: transparent; } -.btn-outline-danger:not(:disabled):not(.disabled).active, .btn-outline-danger:not(:disabled):not(.disabled):active, +.btn-outline-danger:not(:disabled):not(.disabled).active, .show > .btn-outline-danger.dropdown-toggle { - color: #fff; - background-color: #873208; - border-color: #873208; + color: #ffffff; + background-color: #8c3409; + border-color: #8c3409; } -.btn-outline-danger:not(:disabled):not(.disabled).active:focus, .btn-outline-danger:not(:disabled):not(.disabled):active:focus, +.btn-outline-danger:not(:disabled):not(.disabled).active:focus, .show > .btn-outline-danger.dropdown-toggle:focus { - box-shadow: 0 0 0 0.2rem rgba(135, 50, 8, 0.5); + box-shadow: 0 0 0 0.2rem rgba(140, 52, 9, 0.5); } + .btn-outline-light { color: #f8f9fa; border-color: #f8f9fa; @@ -2688,8 +2903,8 @@ fieldset:disabled a.btn { background-color: #f8f9fa; border-color: #f8f9fa; } -.btn-outline-light.focus, -.btn-outline-light:focus { +.btn-outline-light:focus, +.btn-outline-light.focus { box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); } .btn-outline-light.disabled, @@ -2697,29 +2912,30 @@ fieldset:disabled a.btn { color: #f8f9fa; background-color: transparent; } -.btn-outline-light:not(:disabled):not(.disabled).active, .btn-outline-light:not(:disabled):not(.disabled):active, +.btn-outline-light:not(:disabled):not(.disabled).active, .show > .btn-outline-light.dropdown-toggle { color: #212529; background-color: #f8f9fa; border-color: #f8f9fa; } -.btn-outline-light:not(:disabled):not(.disabled).active:focus, .btn-outline-light:not(:disabled):not(.disabled):active:focus, +.btn-outline-light:not(:disabled):not(.disabled).active:focus, .show > .btn-outline-light.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); } + .btn-outline-dark { color: #343a40; border-color: #343a40; } .btn-outline-dark:hover { - color: #fff; + color: #ffffff; background-color: #343a40; border-color: #343a40; } -.btn-outline-dark.focus, -.btn-outline-dark:focus { +.btn-outline-dark:focus, +.btn-outline-dark.focus { box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); } .btn-outline-dark.disabled, @@ -2727,18 +2943,19 @@ fieldset:disabled a.btn { color: #343a40; background-color: transparent; } -.btn-outline-dark:not(:disabled):not(.disabled).active, .btn-outline-dark:not(:disabled):not(.disabled):active, +.btn-outline-dark:not(:disabled):not(.disabled).active, .show > .btn-outline-dark.dropdown-toggle { - color: #fff; + color: #ffffff; background-color: #343a40; border-color: #343a40; } -.btn-outline-dark:not(:disabled):not(.disabled).active:focus, .btn-outline-dark:not(:disabled):not(.disabled):active:focus, +.btn-outline-dark:not(:disabled):not(.disabled).active:focus, .show > .btn-outline-dark.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); } + .btn-link { font-weight: 400; color: #f1641e; @@ -2748,29 +2965,32 @@ fieldset:disabled a.btn { color: #b7440b; text-decoration: underline; } -.btn-link.focus, -.btn-link:focus { +.btn-link:focus, +.btn-link.focus { text-decoration: underline; } -.btn-link.disabled, -.btn-link:disabled { +.btn-link:disabled, +.btn-link.disabled { color: #6c757d; pointer-events: none; } -.btn-group-lg > .btn, -.btn-lg { + +.btn-lg, +.btn-group-lg > .btn { padding: 0.5rem 1rem; font-size: 1.25rem; line-height: 1.5; border-radius: 0.5rem; } -.btn-group-sm > .btn, -.btn-sm { + +.btn-sm, +.btn-group-sm > .btn { padding: 0.25rem 0.5rem; font-size: 0.875rem; line-height: 1.5; border-radius: 1rem; } + .btn-block { display: block; width: 100%; @@ -2778,11 +2998,13 @@ fieldset:disabled a.btn { .btn-block + .btn-block { margin-top: 0.5rem; } -input[type="button"].btn-block, + +input[type="submit"].btn-block, input[type="reset"].btn-block, -input[type="submit"].btn-block { +input[type="button"].btn-block { width: 100%; } + .fade { transition: opacity 0.15s linear; } @@ -2794,9 +3016,11 @@ input[type="submit"].btn-block { .fade:not(.show) { opacity: 0; } + .collapse:not(.show) { display: none; } + .collapsing { position: relative; height: 0; @@ -2808,12 +3032,24 @@ input[type="submit"].btn-block { transition: none; } } -.dropdown, -.dropleft, +.collapsing.width { + width: 0; + height: auto; + transition: width 0.35s ease; +} +@media (prefers-reduced-motion: reduce) { + .collapsing.width { + transition: none; + } +} + +.dropup, .dropright, -.dropup { +.dropdown, +.dropleft { position: relative; } + .dropdown-toggle { white-space: nowrap; } @@ -2830,6 +3066,7 @@ input[type="submit"].btn-block { .dropdown-toggle:empty::after { margin-left: 0; } + .dropdown-menu { position: absolute; top: 100%; @@ -2844,19 +3081,22 @@ input[type="submit"].btn-block { color: #495057; text-align: left; list-style: none; - background-color: #fff; + background-color: #ffffff; background-clip: padding-box; border: 1px solid rgba(34, 34, 34, 0.15); border-radius: 0.5rem; } + .dropdown-menu-left { right: auto; left: 0; } + .dropdown-menu-right { right: 0; left: auto; } + @media (min-width: 576px) { .dropdown-menu-sm-left { right: auto; @@ -2916,6 +3156,7 @@ input[type="submit"].btn-block { .dropup .dropdown-toggle:empty::after { margin-left: 0; } + .dropright .dropdown-menu { top: 0; right: auto; @@ -2939,6 +3180,7 @@ input[type="submit"].btn-block { .dropright .dropdown-toggle::after { vertical-align: 0; } + .dropleft .dropdown-menu { top: 0; right: 100%; @@ -2970,19 +3212,22 @@ input[type="submit"].btn-block { .dropleft .dropdown-toggle::before { vertical-align: 0; } -.dropdown-menu[x-placement^="bottom"], -.dropdown-menu[x-placement^="left"], + +.dropdown-menu[x-placement^="top"], .dropdown-menu[x-placement^="right"], -.dropdown-menu[x-placement^="top"] { +.dropdown-menu[x-placement^="bottom"], +.dropdown-menu[x-placement^="left"] { right: auto; bottom: auto; } + .dropdown-divider { height: 0; margin: 0.5rem 0; overflow: hidden; border-top: 1px solid #e9ecef; } + .dropdown-item { display: block; width: 100%; @@ -2995,27 +3240,29 @@ input[type="submit"].btn-block { background-color: transparent; border: 0; } -.dropdown-item:focus, -.dropdown-item:hover { +.dropdown-item:hover, +.dropdown-item:focus { color: #16181b; text-decoration: none; - background-color: #f8f9fa; + background-color: #e9ecef; } .dropdown-item.active, .dropdown-item:active { - color: #fff; + color: #ffffff; text-decoration: none; background-color: #f1641e; } .dropdown-item.disabled, .dropdown-item:disabled { - color: #6c757d; + color: #adb5bd; pointer-events: none; background-color: transparent; } + .dropdown-menu.show { display: block; } + .dropdown-header { display: block; padding: 0.5rem 1.5rem; @@ -3024,34 +3271,37 @@ input[type="submit"].btn-block { color: #6c757d; white-space: nowrap; } + .dropdown-item-text { display: block; padding: 0.25rem 1.5rem; color: #212529; } + .btn-group, .btn-group-vertical { position: relative; display: inline-flex; vertical-align: middle; } -.btn-group-vertical > .btn, -.btn-group > .btn { +.btn-group > .btn, +.btn-group-vertical > .btn { position: relative; flex: 1 1 auto; } -.btn-group-vertical > .btn:hover, -.btn-group > .btn:hover { +.btn-group > .btn:hover, +.btn-group-vertical > .btn:hover { z-index: 1; } -.btn-group-vertical > .btn.active, -.btn-group-vertical > .btn:active, -.btn-group-vertical > .btn:focus, -.btn-group > .btn.active, +.btn-group > .btn:focus, .btn-group > .btn:active, -.btn-group > .btn:focus { +.btn-group > .btn.active, +.btn-group-vertical > .btn:focus, +.btn-group-vertical > .btn:active, +.btn-group-vertical > .btn.active { z-index: 1; } + .btn-toolbar { display: flex; flex-wrap: wrap; @@ -3060,42 +3310,47 @@ input[type="submit"].btn-block { .btn-toolbar .input-group { width: auto; } -.btn-group > .btn-group:not(:first-child), -.btn-group > .btn:not(:first-child) { + +.btn-group > .btn:not(:first-child), +.btn-group > .btn-group:not(:first-child) { margin-left: -1px; } -.btn-group > .btn-group:not(:last-child) > .btn, -.btn-group > .btn:not(:last-child):not(.dropdown-toggle) { +.btn-group > .btn:not(:last-child):not(.dropdown-toggle), +.btn-group > .btn-group:not(:last-child) > .btn { border-top-right-radius: 0; border-bottom-right-radius: 0; } -.btn-group > .btn-group:not(:first-child) > .btn, -.btn-group > .btn:not(:first-child) { +.btn-group > .btn:not(:first-child), +.btn-group > .btn-group:not(:first-child) > .btn { border-top-left-radius: 0; border-bottom-left-radius: 0; } + .dropdown-toggle-split { padding-right: 0.5625rem; padding-left: 0.5625rem; } .dropdown-toggle-split::after, -.dropright .dropdown-toggle-split::after, -.dropup .dropdown-toggle-split::after { +.dropup .dropdown-toggle-split::after, +.dropright .dropdown-toggle-split::after { margin-left: 0; } .dropleft .dropdown-toggle-split::before { margin-right: 0; } -.btn-group-sm > .btn + .dropdown-toggle-split, -.btn-sm + .dropdown-toggle-split { + +.btn-sm + .dropdown-toggle-split, +.btn-group-sm > .btn + .dropdown-toggle-split { padding-right: 0.375rem; padding-left: 0.375rem; } -.btn-group-lg > .btn + .dropdown-toggle-split, -.btn-lg + .dropdown-toggle-split { + +.btn-lg + .dropdown-toggle-split, +.btn-group-lg > .btn + .dropdown-toggle-split { padding-right: 0.75rem; padding-left: 0.75rem; } + .btn-group-vertical { flex-direction: column; align-items: flex-start; @@ -3105,32 +3360,34 @@ input[type="submit"].btn-block { .btn-group-vertical > .btn-group { width: 100%; } -.btn-group-vertical > .btn-group:not(:first-child), -.btn-group-vertical > .btn:not(:first-child) { +.btn-group-vertical > .btn:not(:first-child), +.btn-group-vertical > .btn-group:not(:first-child) { margin-top: -1px; } -.btn-group-vertical > .btn-group:not(:last-child) > .btn, -.btn-group-vertical > .btn:not(:last-child):not(.dropdown-toggle) { +.btn-group-vertical > .btn:not(:last-child):not(.dropdown-toggle), +.btn-group-vertical > .btn-group:not(:last-child) > .btn { border-bottom-right-radius: 0; border-bottom-left-radius: 0; } -.btn-group-vertical > .btn-group:not(:first-child) > .btn, -.btn-group-vertical > .btn:not(:first-child) { +.btn-group-vertical > .btn:not(:first-child), +.btn-group-vertical > .btn-group:not(:first-child) > .btn { border-top-left-radius: 0; border-top-right-radius: 0; } + .btn-group-toggle > .btn, .btn-group-toggle > .btn-group > .btn { margin-bottom: 0; } -.btn-group-toggle > .btn input[type="checkbox"], .btn-group-toggle > .btn input[type="radio"], -.btn-group-toggle > .btn-group > .btn input[type="checkbox"], -.btn-group-toggle > .btn-group > .btn input[type="radio"] { +.btn-group-toggle > .btn input[type="checkbox"], +.btn-group-toggle > .btn-group > .btn input[type="radio"], +.btn-group-toggle > .btn-group > .btn input[type="checkbox"] { position: absolute; clip: rect(0, 0, 0, 0); pointer-events: none; } + .input-group { position: relative; display: flex; @@ -3138,45 +3395,40 @@ input[type="submit"].btn-block { align-items: stretch; width: 100%; } -.input-group > .custom-file, -.input-group > .custom-select, .input-group > .form-control, -.input-group > .form-control-plaintext { +.input-group > .form-control-plaintext, +.input-group > .custom-select, +.input-group > .custom-file { position: relative; flex: 1 1 auto; width: 1%; min-width: 0; margin-bottom: 0; } -.input-group > .custom-file + .custom-file, -.input-group > .custom-file + .custom-select, -.input-group > .custom-file + .form-control, -.input-group > .custom-select + .custom-file, -.input-group > .custom-select + .custom-select, -.input-group > .custom-select + .form-control, -.input-group > .form-control + .custom-file, -.input-group > .form-control + .custom-select, .input-group > .form-control + .form-control, -.input-group > .form-control-plaintext + .custom-file, +.input-group > .form-control + .custom-select, +.input-group > .form-control + .custom-file, +.input-group > .form-control-plaintext + .form-control, .input-group > .form-control-plaintext + .custom-select, -.input-group > .form-control-plaintext + .form-control { +.input-group > .form-control-plaintext + .custom-file, +.input-group > .custom-select + .form-control, +.input-group > .custom-select + .custom-select, +.input-group > .custom-select + .custom-file, +.input-group > .custom-file + .form-control, +.input-group > .custom-file + .custom-select, +.input-group > .custom-file + .custom-file { margin-left: -1px; } -.input-group > .custom-file .custom-file-input:focus ~ .custom-file-label, +.input-group > .form-control:focus, .input-group > .custom-select:focus, -.input-group > .form-control:focus { +.input-group > .custom-file .custom-file-input:focus ~ .custom-file-label { z-index: 3; } .input-group > .custom-file .custom-file-input:focus { z-index: 4; } -.input-group > .custom-select:not(:last-child), -.input-group > .form-control:not(:last-child) { - border-top-right-radius: 0; - border-bottom-right-radius: 0; -} -.input-group > .custom-select:not(:first-child), -.input-group > .form-control:not(:first-child) { +.input-group > .form-control:not(:first-child), +.input-group > .custom-select:not(:first-child) { border-top-left-radius: 0; border-bottom-left-radius: 0; } @@ -3193,35 +3445,61 @@ input[type="submit"].btn-block { border-top-left-radius: 0; border-bottom-left-radius: 0; } -.input-group-append, -.input-group-prepend { +.input-group:not(.has-validation) > .form-control:not(:last-child), +.input-group:not(.has-validation) > .custom-select:not(:last-child), +.input-group:not(.has-validation) + > .custom-file:not(:last-child) + .custom-file-label, +.input-group:not(.has-validation) + > .custom-file:not(:last-child) + .custom-file-label::after { + border-top-right-radius: 0; + border-bottom-right-radius: 0; +} +.input-group.has-validation > .form-control:nth-last-child(n + 3), +.input-group.has-validation > .custom-select:nth-last-child(n + 3), +.input-group.has-validation + > .custom-file:nth-last-child(n + 3) + .custom-file-label, +.input-group.has-validation + > .custom-file:nth-last-child(n + 3) + .custom-file-label::after { + border-top-right-radius: 0; + border-bottom-right-radius: 0; +} + +.input-group-prepend, +.input-group-append { display: flex; } -.input-group-append .btn, -.input-group-prepend .btn { +.input-group-prepend .btn, +.input-group-append .btn { position: relative; z-index: 2; } -.input-group-append .btn:focus, -.input-group-prepend .btn:focus { +.input-group-prepend .btn:focus, +.input-group-append .btn:focus { z-index: 3; } -.input-group-append .btn + .btn, -.input-group-append .btn + .input-group-text, -.input-group-append .input-group-text + .btn, -.input-group-append .input-group-text + .input-group-text, .input-group-prepend .btn + .btn, .input-group-prepend .btn + .input-group-text, +.input-group-prepend .input-group-text + .input-group-text, .input-group-prepend .input-group-text + .btn, -.input-group-prepend .input-group-text + .input-group-text { +.input-group-append .btn + .btn, +.input-group-append .btn + .input-group-text, +.input-group-append .input-group-text + .input-group-text, +.input-group-append .input-group-text + .btn { margin-left: -1px; } + .input-group-prepend { margin-right: -1px; } + .input-group-append { margin-left: -1px; } + .input-group-text { display: flex; align-items: center; @@ -3237,78 +3515,96 @@ input[type="submit"].btn-block { border: 1px solid #ced4da; border-radius: 0.5rem; } -.input-group-text input[type="checkbox"], -.input-group-text input[type="radio"] { +.input-group-text input[type="radio"], +.input-group-text input[type="checkbox"] { margin-top: 0; } -.input-group-lg > .custom-select, -.input-group-lg > .form-control:not(textarea) { + +.input-group-lg > .form-control:not(textarea), +.input-group-lg > .custom-select { height: calc(1.5em + 1rem + 2px); } -.input-group-lg > .custom-select, + .input-group-lg > .form-control, -.input-group-lg > .input-group-append > .btn, +.input-group-lg > .custom-select, +.input-group-lg > .input-group-prepend > .input-group-text, .input-group-lg > .input-group-append > .input-group-text, .input-group-lg > .input-group-prepend > .btn, -.input-group-lg > .input-group-prepend > .input-group-text { +.input-group-lg > .input-group-append > .btn { padding: 0.5rem 1rem; font-size: 1.25rem; line-height: 1.5; border-radius: 0.5rem; } -.input-group-sm > .custom-select, -.input-group-sm > .form-control:not(textarea) { + +.input-group-sm > .form-control:not(textarea), +.input-group-sm > .custom-select { height: calc(1.5em + 0.5rem + 2px); } -.input-group-sm > .custom-select, + .input-group-sm > .form-control, -.input-group-sm > .input-group-append > .btn, +.input-group-sm > .custom-select, +.input-group-sm > .input-group-prepend > .input-group-text, .input-group-sm > .input-group-append > .input-group-text, .input-group-sm > .input-group-prepend > .btn, -.input-group-sm > .input-group-prepend > .input-group-text { +.input-group-sm > .input-group-append > .btn { padding: 0.25rem 0.5rem; font-size: 0.875rem; line-height: 1.5; border-radius: 1rem; } + .input-group-lg > .custom-select, .input-group-sm > .custom-select { padding-right: 1.75rem; } + +.input-group > .input-group-prepend > .btn, +.input-group > .input-group-prepend > .input-group-text, +.input-group:not(.has-validation) > .input-group-append:not(:last-child) > .btn, +.input-group:not(.has-validation) + > .input-group-append:not(:last-child) + > .input-group-text, +.input-group.has-validation > .input-group-append:nth-last-child(n + 3) > .btn, +.input-group.has-validation + > .input-group-append:nth-last-child(n + 3) + > .input-group-text, .input-group > .input-group-append:last-child > .btn:not(:last-child):not(.dropdown-toggle), .input-group > .input-group-append:last-child - > .input-group-text:not(:last-child), -.input-group > .input-group-append:not(:last-child) > .btn, -.input-group > .input-group-append:not(:last-child) > .input-group-text, -.input-group > .input-group-prepend > .btn, -.input-group > .input-group-prepend > .input-group-text { + > .input-group-text:not(:last-child) { border-top-right-radius: 0; border-bottom-right-radius: 0; } + .input-group > .input-group-append > .btn, .input-group > .input-group-append > .input-group-text, +.input-group > .input-group-prepend:not(:first-child) > .btn, +.input-group > .input-group-prepend:not(:first-child) > .input-group-text, .input-group > .input-group-prepend:first-child > .btn:not(:first-child), .input-group > .input-group-prepend:first-child - > .input-group-text:not(:first-child), -.input-group > .input-group-prepend:not(:first-child) > .btn, -.input-group > .input-group-prepend:not(:first-child) > .input-group-text { + > .input-group-text:not(:first-child) { border-top-left-radius: 0; border-bottom-left-radius: 0; } + .custom-control { position: relative; + z-index: 1; display: block; min-height: 1.5rem; padding-left: 1.5rem; + print-color-adjust: exact; } + .custom-control-inline { display: inline-flex; margin-right: 1rem; } + .custom-control-input { position: absolute; left: 0; @@ -3318,29 +3614,30 @@ input[type="submit"].btn-block { opacity: 0; } .custom-control-input:checked ~ .custom-control-label::before { - color: #fff; + color: #ffffff; border-color: #f1641e; background-color: #f1641e; } .custom-control-input:focus ~ .custom-control-label::before { - box-shadow: 0 0 0 0.2rem rgba(241, 30, 30, 0.75); + box-shadow: 0 0 0 0.2rem rgba(241, 100, 30, 0.75); } .custom-control-input:focus:not(:checked) ~ .custom-control-label::before { - border-color: #f89696; + border-color: #f8b796; } .custom-control-input:not(:disabled):active ~ .custom-control-label::before { - color: #fff; + color: #ffffff; background-color: #fbd8c6; border-color: #fbd8c6; } -.custom-control-input:disabled ~ .custom-control-label, -.custom-control-input[disabled] ~ .custom-control-label { +.custom-control-input[disabled] ~ .custom-control-label, +.custom-control-input:disabled ~ .custom-control-label { color: #6c757d; } -.custom-control-input:disabled ~ .custom-control-label::before, -.custom-control-input[disabled] ~ .custom-control-label::before { +.custom-control-input[disabled] ~ .custom-control-label::before, +.custom-control-input:disabled ~ .custom-control-label::before { background-color: #e9ecef; } + .custom-control-label { position: relative; margin-bottom: 0; @@ -3355,8 +3652,8 @@ input[type="submit"].btn-block { height: 1rem; pointer-events: none; content: ""; - background-color: #fff; - border: #adb5bd solid 1px; + background-color: #ffffff; + border: 1px solid #adb5bd; } .custom-control-label::after { position: absolute; @@ -3366,8 +3663,9 @@ input[type="submit"].btn-block { width: 1rem; height: 1rem; content: ""; - background: no-repeat 50%/50% 50%; + background: 50%/50% 50% no-repeat; } + .custom-checkbox .custom-control-label::before { border-radius: 0.5rem; } @@ -3395,6 +3693,7 @@ input[type="submit"].btn-block { ~ .custom-control-label::before { background-color: rgba(241, 100, 30, 0.5); } + .custom-radio .custom-control-label::before { border-radius: 50%; } @@ -3406,6 +3705,7 @@ input[type="submit"].btn-block { ~ .custom-control-label::before { background-color: rgba(241, 100, 30, 0.5); } + .custom-switch { padding-left: 2.25rem; } @@ -3431,7 +3731,7 @@ input[type="submit"].btn-block { } } .custom-switch .custom-control-input:checked ~ .custom-control-label::after { - background-color: #fff; + background-color: #ffffff; transform: translateX(0.75rem); } .custom-switch @@ -3439,6 +3739,7 @@ input[type="submit"].btn-block { ~ .custom-control-label::before { background-color: rgba(241, 100, 30, 0.5); } + .custom-select { display: inline-block; width: 100%; @@ -3449,21 +3750,21 @@ input[type="submit"].btn-block { line-height: 1.5; color: #495057; vertical-align: middle; - background: #fff + background: #ffffff url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='4' height='5' viewBox='0 0 4 5'%3e%3cpath fill='%23343a40' d='M2 0L0 2h4zm0 5L0 3h4z'/%3e%3c/svg%3e") - no-repeat right 0.75rem center/8px 10px; + right 0.75rem center/8px 10px no-repeat; border: 1px solid #ced4da; border-radius: 0.5rem; appearance: none; } .custom-select:focus { - border-color: #f89696; + border-color: #f8b796; outline: 0; - box-shadow: 0 0 0 0.2rem rgba(241, 30, 30, 0.75); + box-shadow: 0 0 0 0.2rem rgba(241, 100, 30, 0.75); } .custom-select:focus::-ms-value { color: #495057; - background-color: #fff; + background-color: #ffffff; } .custom-select[multiple], .custom-select[size]:not([size="1"]) { @@ -3482,6 +3783,7 @@ input[type="submit"].btn-block { color: transparent; text-shadow: 0 0 0 #495057; } + .custom-select-sm { height: calc(1.5em + 0.5rem + 2px); padding-top: 0.25rem; @@ -3489,6 +3791,7 @@ input[type="submit"].btn-block { padding-left: 0.5rem; font-size: 0.875rem; } + .custom-select-lg { height: calc(1.5em + 1rem + 2px); padding-top: 0.5rem; @@ -3496,6 +3799,7 @@ input[type="submit"].btn-block { padding-left: 1rem; font-size: 1.25rem; } + .custom-file { position: relative; display: inline-block; @@ -3503,20 +3807,22 @@ input[type="submit"].btn-block { height: calc(1.5em + 0.75rem + 2px); margin-bottom: 0; } + .custom-file-input { position: relative; z-index: 2; width: 100%; height: calc(1.5em + 0.75rem + 2px); margin: 0; + overflow: hidden; opacity: 0; } .custom-file-input:focus ~ .custom-file-label { - border-color: #f89696; - box-shadow: 0 0 0 0.2rem rgba(241, 30, 30, 0.75); + border-color: #f8b796; + box-shadow: 0 0 0 0.2rem rgba(241, 100, 30, 0.75); } -.custom-file-input:disabled ~ .custom-file-label, -.custom-file-input[disabled] ~ .custom-file-label { +.custom-file-input[disabled] ~ .custom-file-label, +.custom-file-input:disabled ~ .custom-file-label { background-color: #e9ecef; } .custom-file-input:lang(en) ~ .custom-file-label::after { @@ -3525,6 +3831,7 @@ input[type="submit"].btn-block { .custom-file-input ~ .custom-file-label[data-browse]::after { content: attr(data-browse); } + .custom-file-label { position: absolute; top: 0; @@ -3533,10 +3840,11 @@ input[type="submit"].btn-block { z-index: 1; height: calc(1.5em + 0.75rem + 2px); padding: 0.375rem 0.75rem; + overflow: hidden; font-weight: 400; line-height: 1.5; color: #495057; - background-color: #fff; + background-color: #ffffff; border: 1px solid #ced4da; border-radius: 0.5rem; } @@ -3556,6 +3864,7 @@ input[type="submit"].btn-block { border-left: inherit; border-radius: 0 0.5rem 0.5rem 0; } + .custom-range { width: 100%; height: 1.4rem; @@ -3567,13 +3876,13 @@ input[type="submit"].btn-block { outline: 0; } .custom-range:focus::-webkit-slider-thumb { - box-shadow: 0 0 0 1px #fff, 0 0 0 0.2rem rgba(241, 30, 30, 0.75); + box-shadow: 0 0 0 1px #fff, 0 0 0 0.2rem rgba(241, 100, 30, 0.75); } .custom-range:focus::-moz-range-thumb { - box-shadow: 0 0 0 1px #fff, 0 0 0 0.2rem rgba(241, 30, 30, 0.75); + box-shadow: 0 0 0 1px #fff, 0 0 0 0.2rem rgba(241, 100, 30, 0.75); } .custom-range:focus::-ms-thumb { - box-shadow: 0 0 0 1px #fff, 0 0 0 0.2rem rgba(241, 30, 30, 0.75); + box-shadow: 0 0 0 1px #fff, 0 0 0 0.2rem rgba(241, 100, 30, 0.75); } .custom-range::-moz-focus-outer { border: 0; @@ -3687,6 +3996,7 @@ input[type="submit"].btn-block { .custom-range:disabled::-ms-thumb { background-color: #adb5bd; } + .custom-control-label::before, .custom-file-label, .custom-select { @@ -3700,6 +4010,7 @@ input[type="submit"].btn-block { transition: none; } } + .nav { display: flex; flex-wrap: wrap; @@ -3707,12 +4018,13 @@ input[type="submit"].btn-block { margin-bottom: 0; list-style: none; } + .nav-link { display: block; padding: 0.5rem 1rem; } -.nav-link:focus, -.nav-link:hover { +.nav-link:hover, +.nav-link:focus { text-decoration: none; } .nav-link.disabled { @@ -3720,19 +4032,20 @@ input[type="submit"].btn-block { pointer-events: none; cursor: default; } + .nav-tabs { border-bottom: 1px solid #dee2e6; } -.nav-tabs .nav-item { - margin-bottom: -1px; -} .nav-tabs .nav-link { + margin-bottom: -1px; + background-color: transparent; border: 1px solid transparent; border-top-left-radius: 0.5rem; border-top-right-radius: 0.5rem; } -.nav-tabs .nav-link:focus, -.nav-tabs .nav-link:hover { +.nav-tabs .nav-link:hover, +.nav-tabs .nav-link:focus { + isolation: isolate; border-color: #e9ecef #e9ecef #dee2e6; } .nav-tabs .nav-link.disabled { @@ -3740,8 +4053,8 @@ input[type="submit"].btn-block { background-color: transparent; border-color: transparent; } -.nav-tabs .nav-item.show .nav-link, -.nav-tabs .nav-link.active { +.nav-tabs .nav-link.active, +.nav-tabs .nav-item.show .nav-link { color: #495057; background-color: #fff; border-color: #dee2e6 #dee2e6 #fff; @@ -3751,29 +4064,38 @@ input[type="submit"].btn-block { border-top-left-radius: 0; border-top-right-radius: 0; } + .nav-pills .nav-link { + background: none; + border: 0; border-radius: 0.5rem; } .nav-pills .nav-link.active, .nav-pills .show > .nav-link { - color: #fff; + color: #ffffff; background-color: #f1641e; } + +.nav-fill > .nav-link, .nav-fill .nav-item { flex: 1 1 auto; text-align: center; } + +.nav-justified > .nav-link, .nav-justified .nav-item { flex-basis: 0; flex-grow: 1; text-align: center; } + .tab-content > .tab-pane { display: none; } .tab-content > .active { display: block; } + .navbar { position: relative; display: flex; @@ -3784,9 +4106,9 @@ input[type="submit"].btn-block { } .navbar .container, .navbar .container-fluid, -.navbar .container-lg, -.navbar .container-md, .navbar .container-sm, +.navbar .container-md, +.navbar .container-lg, .navbar .container-xl { display: flex; flex-wrap: wrap; @@ -3802,10 +4124,11 @@ input[type="submit"].btn-block { line-height: inherit; white-space: nowrap; } -.navbar-brand:focus, -.navbar-brand:hover { +.navbar-brand:hover, +.navbar-brand:focus { text-decoration: none; } + .navbar-nav { display: flex; flex-direction: column; @@ -3821,16 +4144,19 @@ input[type="submit"].btn-block { position: static; float: none; } + .navbar-text { display: inline-block; padding-top: 0.5rem; padding-bottom: 0.5rem; } + .navbar-collapse { flex-basis: 100%; flex-grow: 1; align-items: center; } + .navbar-toggler { padding: 0.25rem 0.75rem; font-size: 1.25rem; @@ -3839,25 +4165,31 @@ input[type="submit"].btn-block { border: 1px solid transparent; border-radius: 0.5rem; } -.navbar-toggler:focus, -.navbar-toggler:hover { +.navbar-toggler:hover, +.navbar-toggler:focus { text-decoration: none; } + .navbar-toggler-icon { display: inline-block; width: 1.5em; height: 1.5em; vertical-align: middle; content: ""; - background: no-repeat center center; - background-size: 100% 100%; + background: 50%/100% 100% no-repeat; } + +.navbar-nav-scroll { + max-height: 75vh; + overflow-y: auto; +} + @media (max-width: 575.98px) { .navbar-expand-sm > .container, .navbar-expand-sm > .container-fluid, - .navbar-expand-sm > .container-lg, - .navbar-expand-sm > .container-md, .navbar-expand-sm > .container-sm, + .navbar-expand-sm > .container-md, + .navbar-expand-sm > .container-lg, .navbar-expand-sm > .container-xl { padding-right: 0; padding-left: 0; @@ -3880,12 +4212,15 @@ input[type="submit"].btn-block { } .navbar-expand-sm > .container, .navbar-expand-sm > .container-fluid, - .navbar-expand-sm > .container-lg, - .navbar-expand-sm > .container-md, .navbar-expand-sm > .container-sm, + .navbar-expand-sm > .container-md, + .navbar-expand-sm > .container-lg, .navbar-expand-sm > .container-xl { flex-wrap: nowrap; } + .navbar-expand-sm .navbar-nav-scroll { + overflow: visible; + } .navbar-expand-sm .navbar-collapse { display: flex !important; flex-basis: auto; @@ -3897,9 +4232,9 @@ input[type="submit"].btn-block { @media (max-width: 767.98px) { .navbar-expand-md > .container, .navbar-expand-md > .container-fluid, - .navbar-expand-md > .container-lg, - .navbar-expand-md > .container-md, .navbar-expand-md > .container-sm, + .navbar-expand-md > .container-md, + .navbar-expand-md > .container-lg, .navbar-expand-md > .container-xl { padding-right: 0; padding-left: 0; @@ -3922,12 +4257,15 @@ input[type="submit"].btn-block { } .navbar-expand-md > .container, .navbar-expand-md > .container-fluid, - .navbar-expand-md > .container-lg, - .navbar-expand-md > .container-md, .navbar-expand-md > .container-sm, + .navbar-expand-md > .container-md, + .navbar-expand-md > .container-lg, .navbar-expand-md > .container-xl { flex-wrap: nowrap; } + .navbar-expand-md .navbar-nav-scroll { + overflow: visible; + } .navbar-expand-md .navbar-collapse { display: flex !important; flex-basis: auto; @@ -3939,9 +4277,9 @@ input[type="submit"].btn-block { @media (max-width: 991.98px) { .navbar-expand-lg > .container, .navbar-expand-lg > .container-fluid, - .navbar-expand-lg > .container-lg, - .navbar-expand-lg > .container-md, .navbar-expand-lg > .container-sm, + .navbar-expand-lg > .container-md, + .navbar-expand-lg > .container-lg, .navbar-expand-lg > .container-xl { padding-right: 0; padding-left: 0; @@ -3964,12 +4302,15 @@ input[type="submit"].btn-block { } .navbar-expand-lg > .container, .navbar-expand-lg > .container-fluid, - .navbar-expand-lg > .container-lg, - .navbar-expand-lg > .container-md, .navbar-expand-lg > .container-sm, + .navbar-expand-lg > .container-md, + .navbar-expand-lg > .container-lg, .navbar-expand-lg > .container-xl { flex-wrap: nowrap; } + .navbar-expand-lg .navbar-nav-scroll { + overflow: visible; + } .navbar-expand-lg .navbar-collapse { display: flex !important; flex-basis: auto; @@ -3981,9 +4322,9 @@ input[type="submit"].btn-block { @media (max-width: 1199.98px) { .navbar-expand-xl > .container, .navbar-expand-xl > .container-fluid, - .navbar-expand-xl > .container-lg, - .navbar-expand-xl > .container-md, .navbar-expand-xl > .container-sm, + .navbar-expand-xl > .container-md, + .navbar-expand-xl > .container-lg, .navbar-expand-xl > .container-xl { padding-right: 0; padding-left: 0; @@ -4006,12 +4347,15 @@ input[type="submit"].btn-block { } .navbar-expand-xl > .container, .navbar-expand-xl > .container-fluid, - .navbar-expand-xl > .container-lg, - .navbar-expand-xl > .container-md, .navbar-expand-xl > .container-sm, + .navbar-expand-xl > .container-md, + .navbar-expand-xl > .container-lg, .navbar-expand-xl > .container-xl { flex-wrap: nowrap; } + .navbar-expand-xl .navbar-nav-scroll { + overflow: visible; + } .navbar-expand-xl .navbar-collapse { display: flex !important; flex-basis: auto; @@ -4026,9 +4370,9 @@ input[type="submit"].btn-block { } .navbar-expand > .container, .navbar-expand > .container-fluid, -.navbar-expand > .container-lg, -.navbar-expand > .container-md, .navbar-expand > .container-sm, +.navbar-expand > .container-md, +.navbar-expand > .container-lg, .navbar-expand > .container-xl { padding-right: 0; padding-left: 0; @@ -4045,12 +4389,15 @@ input[type="submit"].btn-block { } .navbar-expand > .container, .navbar-expand > .container-fluid, -.navbar-expand > .container-lg, -.navbar-expand > .container-md, .navbar-expand > .container-sm, +.navbar-expand > .container-md, +.navbar-expand > .container-lg, .navbar-expand > .container-xl { flex-wrap: nowrap; } +.navbar-expand .navbar-nav-scroll { + overflow: visible; +} .navbar-expand .navbar-collapse { display: flex !important; flex-basis: auto; @@ -4058,27 +4405,28 @@ input[type="submit"].btn-block { .navbar-expand .navbar-toggler { display: none; } + .navbar-light .navbar-brand { color: #212529; } -.navbar-light .navbar-brand:focus, -.navbar-light .navbar-brand:hover { +.navbar-light .navbar-brand:hover, +.navbar-light .navbar-brand:focus { color: #212529; } .navbar-light .navbar-nav .nav-link { color: #6c757d; } -.navbar-light .navbar-nav .nav-link:focus, -.navbar-light .navbar-nav .nav-link:hover { +.navbar-light .navbar-nav .nav-link:hover, +.navbar-light .navbar-nav .nav-link:focus { color: #212529; } .navbar-light .navbar-nav .nav-link.disabled { color: rgba(34, 34, 34, 0.3); } +.navbar-light .navbar-nav .show > .nav-link, .navbar-light .navbar-nav .active > .nav-link, -.navbar-light .navbar-nav .nav-link.active, .navbar-light .navbar-nav .nav-link.show, -.navbar-light .navbar-nav .show > .nav-link { +.navbar-light .navbar-nav .nav-link.active { color: #212529; } .navbar-light .navbar-toggler { @@ -4094,32 +4442,33 @@ input[type="submit"].btn-block { .navbar-light .navbar-text a { color: #212529; } -.navbar-light .navbar-text a:focus, -.navbar-light .navbar-text a:hover { +.navbar-light .navbar-text a:hover, +.navbar-light .navbar-text a:focus { color: #212529; } + .navbar-dark .navbar-brand { - color: #fff; + color: #ffffff; } -.navbar-dark .navbar-brand:focus, -.navbar-dark .navbar-brand:hover { - color: #fff; +.navbar-dark .navbar-brand:hover, +.navbar-dark .navbar-brand:focus { + color: #ffffff; } .navbar-dark .navbar-nav .nav-link { color: rgba(255, 255, 255, 0.5); } -.navbar-dark .navbar-nav .nav-link:focus, -.navbar-dark .navbar-nav .nav-link:hover { +.navbar-dark .navbar-nav .nav-link:hover, +.navbar-dark .navbar-nav .nav-link:focus { color: rgba(255, 255, 255, 0.75); } .navbar-dark .navbar-nav .nav-link.disabled { color: rgba(255, 255, 255, 0.25); } +.navbar-dark .navbar-nav .show > .nav-link, .navbar-dark .navbar-nav .active > .nav-link, -.navbar-dark .navbar-nav .nav-link.active, .navbar-dark .navbar-nav .nav-link.show, -.navbar-dark .navbar-nav .show > .nav-link { - color: #fff; +.navbar-dark .navbar-nav .nav-link.active { + color: #ffffff; } .navbar-dark .navbar-toggler { color: rgba(255, 255, 255, 0.5); @@ -4132,12 +4481,13 @@ input[type="submit"].btn-block { color: rgba(255, 255, 255, 0.5); } .navbar-dark .navbar-text a { - color: #fff; + color: #ffffff; } -.navbar-dark .navbar-text a:focus, -.navbar-dark .navbar-text a:hover { - color: #fff; +.navbar-dark .navbar-text a:hover, +.navbar-dark .navbar-text a:focus { + color: #ffffff; } + .card { position: relative; display: flex; @@ -4167,28 +4517,38 @@ input[type="submit"].btn-block { border-bottom-right-radius: calc(0.5rem - 1px); border-bottom-left-radius: calc(0.5rem - 1px); } +.card > .card-header + .list-group, +.card > .list-group + .card-footer { + border-top: 0; +} + .card-body { flex: 1 1 auto; min-height: 1px; padding: 1.25rem; color: #495057; } + .card-title { margin-bottom: 0.75rem; } + .card-subtitle { margin-top: -0.375rem; margin-bottom: 0; } + .card-text:last-child { margin-bottom: 0; } + .card-link:hover { text-decoration: none; } .card-link + .card-link { margin-left: 1.25rem; } + .card-header { padding: 0.75rem 1.25rem; margin-bottom: 0; @@ -4199,9 +4559,7 @@ input[type="submit"].btn-block { .card-header:first-child { border-radius: calc(0.5rem - 1px) calc(0.5rem - 1px) 0 0; } -.card-header + .list-group .list-group-item:first-child { - border-top: 0; -} + .card-footer { padding: 0.75rem 1.25rem; color: #495057; @@ -4211,16 +4569,19 @@ input[type="submit"].btn-block { .card-footer:last-child { border-radius: 0 0 calc(0.5rem - 1px) calc(0.5rem - 1px); } + .card-header-tabs { margin-right: -0.625rem; margin-bottom: -0.75rem; margin-left: -0.625rem; border-bottom: 0; } + .card-header-pills { margin-right: -0.625rem; margin-left: -0.625rem; } + .card-img-overlay { position: absolute; top: 0; @@ -4228,23 +4589,28 @@ input[type="submit"].btn-block { bottom: 0; left: 0; padding: 1.25rem; + border-radius: calc(0.5rem - 1px); } + .card-img, -.card-img-bottom, -.card-img-top { +.card-img-top, +.card-img-bottom { flex-shrink: 0; width: 100%; } + .card-img, .card-img-top { border-top-left-radius: calc(0.5rem - 1px); border-top-right-radius: calc(0.5rem - 1px); } + .card-img, .card-img-bottom { border-bottom-right-radius: calc(0.5rem - 1px); border-bottom-left-radius: calc(0.5rem - 1px); } + .card-deck .card { margin-bottom: 15px; } @@ -4262,6 +4628,7 @@ input[type="submit"].btn-block { margin-left: 15px; } } + .card-group > .card { margin-bottom: 15px; } @@ -4282,27 +4649,28 @@ input[type="submit"].btn-block { border-top-right-radius: 0; border-bottom-right-radius: 0; } - .card-group > .card:not(:last-child) .card-header, - .card-group > .card:not(:last-child) .card-img-top { + .card-group > .card:not(:last-child) .card-img-top, + .card-group > .card:not(:last-child) .card-header { border-top-right-radius: 0; } - .card-group > .card:not(:last-child) .card-footer, - .card-group > .card:not(:last-child) .card-img-bottom { + .card-group > .card:not(:last-child) .card-img-bottom, + .card-group > .card:not(:last-child) .card-footer { border-bottom-right-radius: 0; } .card-group > .card:not(:first-child) { border-top-left-radius: 0; border-bottom-left-radius: 0; } - .card-group > .card:not(:first-child) .card-header, - .card-group > .card:not(:first-child) .card-img-top { + .card-group > .card:not(:first-child) .card-img-top, + .card-group > .card:not(:first-child) .card-header { border-top-left-radius: 0; } - .card-group > .card:not(:first-child) .card-footer, - .card-group > .card:not(:first-child) .card-img-bottom { + .card-group > .card:not(:first-child) .card-img-bottom, + .card-group > .card:not(:first-child) .card-footer { border-bottom-left-radius: 0; } } + .card-columns .card { margin-bottom: 0.75rem; } @@ -4318,6 +4686,10 @@ input[type="submit"].btn-block { width: 100%; } } + +.accordion { + overflow-anchor: none; +} .accordion > .card { overflow: hidden; } @@ -4334,6 +4706,7 @@ input[type="submit"].btn-block { border-radius: 0; margin-bottom: -1px; } + .breadcrumb { display: flex; flex-wrap: wrap; @@ -4343,14 +4716,12 @@ input[type="submit"].btn-block { background-color: #e9ecef; border-radius: 0.5rem; } -.breadcrumb-item { - display: flex; -} + .breadcrumb-item + .breadcrumb-item { padding-left: 0.5rem; } .breadcrumb-item + .breadcrumb-item::before { - display: inline-block; + float: left; padding-right: 0.5rem; color: #6c757d; content: "/"; @@ -4364,12 +4735,14 @@ input[type="submit"].btn-block { .breadcrumb-item.active { color: #6c757d; } + .pagination { display: flex; padding-left: 0; list-style: none; border-radius: 0.5rem; } + .page-link { position: relative; display: block; @@ -4377,7 +4750,7 @@ input[type="submit"].btn-block { margin-left: -1px; line-height: 1.25; color: #f1641e; - background-color: #fff; + background-color: #ffffff; border: 1px solid #dee2e6; } .page-link:hover { @@ -4390,8 +4763,9 @@ input[type="submit"].btn-block { .page-link:focus { z-index: 3; outline: 0; - box-shadow: 0 0 0 0.2rem rgba(241, 30, 30, 0.75); + box-shadow: 0 0 0 0.2rem rgba(241, 100, 30, 0.75); } + .page-item:first-child .page-link { margin-left: 0; border-top-left-radius: 0.5rem; @@ -4403,7 +4777,7 @@ input[type="submit"].btn-block { } .page-item.active .page-link { z-index: 3; - color: #fff; + color: #ffffff; background-color: #f1641e; border-color: #f1641e; } @@ -4411,9 +4785,10 @@ input[type="submit"].btn-block { color: #6c757d; pointer-events: none; cursor: auto; - background-color: #fff; + background-color: #ffffff; border-color: #dee2e6; } + .pagination-lg .page-link { padding: 0.75rem 1.5rem; font-size: 1.25rem; @@ -4427,6 +4802,7 @@ input[type="submit"].btn-block { border-top-right-radius: 0.5rem; border-bottom-right-radius: 0.5rem; } + .pagination-sm .page-link { padding: 0.25rem 0.5rem; font-size: 0.875rem; @@ -4440,6 +4816,7 @@ input[type="submit"].btn-block { border-top-right-radius: 1rem; border-bottom-right-radius: 1rem; } + .badge { display: inline-block; padding: 0.25em 0.4em; @@ -4458,134 +4835,146 @@ input[type="submit"].btn-block { transition: none; } } -a.badge:focus, -a.badge:hover { +a.badge:hover, +a.badge:focus { text-decoration: none; } + .badge:empty { display: none; } + .btn .badge { position: relative; top: -1px; } + .badge-pill { padding-right: 0.6em; padding-left: 0.6em; border-radius: 10rem; } + .badge-primary { - color: #fff; + color: #ffffff; background-color: #f1641e; } -a.badge-primary:focus, -a.badge-primary:hover { - color: #fff; +a.badge-primary:hover, +a.badge-primary:focus { + color: #ffffff; background-color: #cf4d0d; } -a.badge-primary.focus, -a.badge-primary:focus { +a.badge-primary:focus, +a.badge-primary.focus { outline: 0; box-shadow: 0 0 0 0.2rem rgba(241, 100, 30, 0.5); } + .badge-secondary { - color: #fff; + color: #ffffff; background-color: #c80000; } -a.badge-secondary:focus, -a.badge-secondary:hover { - color: #fff; - background-color: #00953e; -} -a.badge-secondary.focus, +a.badge-secondary:hover, a.badge-secondary:focus { - outline: 0; - box-shadow: 0 0 0 0.2rem rgba(0, 200, 83, 0.5); + color: #ffffff; + background-color: #950000; } +a.badge-secondary:focus, +a.badge-secondary.focus { + outline: 0; + box-shadow: 0 0 0 0.2rem rgba(200, 0, 0, 0.5); +} + .badge-success { - color: #fff; + color: #ffffff; background-color: #6610f2; } -a.badge-success:focus, -a.badge-success:hover { - color: #fff; +a.badge-success:hover, +a.badge-success:focus { + color: #ffffff; background-color: #510bc4; } -a.badge-success.focus, -a.badge-success:focus { +a.badge-success:focus, +a.badge-success.focus { outline: 0; box-shadow: 0 0 0 0.2rem rgba(102, 16, 242, 0.5); } + .badge-info { - color: #fff; + color: #ffffff; background-color: #007bff; } -a.badge-info:focus, -a.badge-info:hover { - color: #fff; +a.badge-info:hover, +a.badge-info:focus { + color: #ffffff; background-color: #0062cc; } -a.badge-info.focus, -a.badge-info:focus { +a.badge-info:focus, +a.badge-info.focus { outline: 0; box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.5); } + .badge-warning { color: #212529; background-color: #ffc107; } -a.badge-warning:focus, -a.badge-warning:hover { +a.badge-warning:hover, +a.badge-warning:focus { color: #212529; background-color: #d39e00; } -a.badge-warning.focus, -a.badge-warning:focus { +a.badge-warning:focus, +a.badge-warning.focus { outline: 0; box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); } + .badge-danger { - color: #fff; - background-color: #873208; + color: #ffffff; + background-color: #8c3409; +} +a.badge-danger:hover, +a.badge-danger:focus { + color: #ffffff; + background-color: #5c2206; } a.badge-danger:focus, -a.badge-danger:hover { - color: #fff; - background-color: #572105; -} -a.badge-danger.focus, -a.badge-danger:focus { +a.badge-danger.focus { outline: 0; - box-shadow: 0 0 0 0.2rem rgba(135, 50, 8, 0.5); + box-shadow: 0 0 0 0.2rem rgba(140, 52, 9, 0.5); } + .badge-light { color: #212529; background-color: #f8f9fa; } -a.badge-light:focus, -a.badge-light:hover { +a.badge-light:hover, +a.badge-light:focus { color: #212529; background-color: #dae0e5; } -a.badge-light.focus, -a.badge-light:focus { +a.badge-light:focus, +a.badge-light.focus { outline: 0; box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); } + .badge-dark { - color: #fff; + color: #ffffff; background-color: #343a40; } -a.badge-dark:focus, -a.badge-dark:hover { - color: #fff; +a.badge-dark:hover, +a.badge-dark:focus { + color: #ffffff; background-color: #1d2124; } -a.badge-dark.focus, -a.badge-dark:focus { +a.badge-dark:focus, +a.badge-dark.focus { outline: 0; box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); } + .jumbotron { padding: 2rem 1rem; margin-bottom: 2rem; @@ -4597,11 +4986,13 @@ a.badge-dark:focus { padding: 4rem 2rem; } } + .jumbotron-fluid { padding-right: 0; padding-left: 0; border-radius: 0; } + .alert { position: relative; padding: 0.75rem 1.25rem; @@ -4609,12 +5000,15 @@ a.badge-dark:focus { border: 1px solid transparent; border-radius: 0.5rem; } + .alert-heading { color: inherit; } + .alert-link { font-weight: 600; } + .alert-dismissible { padding-right: 4rem; } @@ -4622,9 +5016,11 @@ a.badge-dark:focus { position: absolute; top: 0; right: 0; + z-index: 2; padding: 0.75rem 1.25rem; color: inherit; } + .alert-primary { color: #8e4420; background-color: #fce0d2; @@ -4636,17 +5032,19 @@ a.badge-dark:focus { .alert-primary .alert-link { color: #643017; } + .alert-secondary { - color: #10783b; - background-color: #ccf4dd; - border-color: #b8f0cf; + color: #781010; + background-color: #f4cccc; + border-color: #f0b8b8; } .alert-secondary hr { - border-top-color: #a3ecc1; + border-top-color: #eca3a3; } .alert-secondary .alert-link { - color: #0a4b25; + color: #4b0a0a; } + .alert-success { color: #45198e; background-color: #e0cffc; @@ -4658,6 +5056,7 @@ a.badge-dark:focus { .alert-success .alert-link { color: #301163; } + .alert-info { color: #105095; background-color: #cce5ff; @@ -4669,6 +5068,7 @@ a.badge-dark:focus { .alert-info .alert-link { color: #0b3767; } + .alert-warning { color: #957514; background-color: #fff3cd; @@ -4680,17 +5080,19 @@ a.badge-dark:focus { .alert-warning .alert-link { color: #68520e; } + .alert-danger { - color: #572b15; - background-color: #e7d6ce; - border-color: #ddc6ba; + color: #592b15; + background-color: #e8d6ce; + border-color: #dfc6ba; } .alert-danger hr { - border-top-color: #d5b8a9; + border-top-color: #d7b8a9; } .alert-danger .alert-link { - color: #2e170b; + color: #30170b; } + .alert-light { color: #919292; background-color: #fefefe; @@ -4702,6 +5104,7 @@ a.badge-dark:focus { .alert-light .alert-link { color: #777979; } + .alert-dark { color: #2b2e32; background-color: #d6d8d9; @@ -4713,6 +5116,7 @@ a.badge-dark:focus { .alert-dark .alert-link { color: #131517; } + @keyframes progress-bar-stripes { from { background-position: 1rem 0; @@ -4730,12 +5134,13 @@ a.badge-dark:focus { background-color: #e9ecef; border-radius: 0.5rem; } + .progress-bar { display: flex; flex-direction: column; justify-content: center; overflow: hidden; - color: #fff; + color: #ffffff; text-align: center; white-space: nowrap; background-color: #f1641e; @@ -4746,6 +5151,7 @@ a.badge-dark:focus { transition: none; } } + .progress-bar-striped { background-image: linear-gradient( 45deg, @@ -4759,21 +5165,25 @@ a.badge-dark:focus { ); background-size: 1rem 1rem; } + .progress-bar-animated { - animation: progress-bar-stripes 1s linear infinite; + animation: 1s linear infinite progress-bar-stripes; } @media (prefers-reduced-motion: reduce) { .progress-bar-animated { animation: none; } } + .media { display: flex; align-items: flex-start; } + .media-body { flex: 1; } + .list-group { display: flex; flex-direction: column; @@ -4781,13 +5191,14 @@ a.badge-dark:focus { margin-bottom: 0; border-radius: 0.5rem; } + .list-group-item-action { width: 100%; color: #495057; text-align: inherit; } -.list-group-item-action:focus, -.list-group-item-action:hover { +.list-group-item-action:hover, +.list-group-item-action:focus { z-index: 1; color: #495057; text-decoration: none; @@ -4797,11 +5208,12 @@ a.badge-dark:focus { color: #495057; background-color: #e9ecef; } + .list-group-item { position: relative; display: block; padding: 0.75rem 1.25rem; - background-color: #fff; + background-color: #ffffff; border: 1px solid rgba(34, 34, 34, 0.125); } .list-group-item:first-child { @@ -4816,11 +5228,11 @@ a.badge-dark:focus { .list-group-item:disabled { color: #6c757d; pointer-events: none; - background-color: #fff; + background-color: #ffffff; } .list-group-item.active { z-index: 2; - color: #fff; + color: #ffffff; background-color: #f1641e; border-color: #f1641e; } @@ -4831,6 +5243,7 @@ a.badge-dark:focus { margin-top: -1px; border-top-width: 1px; } + .list-group-horizontal { flex-direction: row; } @@ -4853,6 +5266,7 @@ a.badge-dark:focus { margin-left: -1px; border-left-width: 1px; } + @media (min-width: 576px) { .list-group-horizontal-sm { flex-direction: row; @@ -4958,152 +5372,163 @@ a.badge-dark:focus { .list-group-flush > .list-group-item:last-child { border-bottom-width: 0; } + .list-group-item-primary { color: #8e4420; background-color: #fbd4c0; } -.list-group-item-primary.list-group-item-action:focus, -.list-group-item-primary.list-group-item-action:hover { +.list-group-item-primary.list-group-item-action:hover, +.list-group-item-primary.list-group-item-action:focus { color: #8e4420; background-color: #f9c4a8; } .list-group-item-primary.list-group-item-action.active { - color: #fff; + color: #ffffff; background-color: #8e4420; border-color: #8e4420; } + .list-group-item-secondary { - color: #10783b; - background-color: #b8f0cf; + color: #781010; + background-color: #f0b8b8; } -.list-group-item-secondary.list-group-item-action:focus, -.list-group-item-secondary.list-group-item-action:hover { - color: #10783b; - background-color: #a3ecc1; +.list-group-item-secondary.list-group-item-action:hover, +.list-group-item-secondary.list-group-item-action:focus { + color: #781010; + background-color: #eca3a3; } .list-group-item-secondary.list-group-item-action.active { - color: #fff; - background-color: #10783b; - border-color: #10783b; + color: #ffffff; + background-color: #781010; + border-color: #781010; } + .list-group-item-success { color: #45198e; background-color: #d4bcfb; } -.list-group-item-success.list-group-item-action:focus, -.list-group-item-success.list-group-item-action:hover { +.list-group-item-success.list-group-item-action:hover, +.list-group-item-success.list-group-item-action:focus { color: #45198e; background-color: #c5a4fa; } .list-group-item-success.list-group-item-action.active { - color: #fff; + color: #ffffff; background-color: #45198e; border-color: #45198e; } + .list-group-item-info { color: #105095; background-color: #b8daff; } -.list-group-item-info.list-group-item-action:focus, -.list-group-item-info.list-group-item-action:hover { +.list-group-item-info.list-group-item-action:hover, +.list-group-item-info.list-group-item-action:focus { color: #105095; background-color: #9fcdff; } .list-group-item-info.list-group-item-action.active { - color: #fff; + color: #ffffff; background-color: #105095; border-color: #105095; } + .list-group-item-warning { color: #957514; background-color: #ffeeba; } -.list-group-item-warning.list-group-item-action:focus, -.list-group-item-warning.list-group-item-action:hover { +.list-group-item-warning.list-group-item-action:hover, +.list-group-item-warning.list-group-item-action:focus { color: #957514; background-color: #ffe8a1; } .list-group-item-warning.list-group-item-action.active { - color: #fff; + color: #ffffff; background-color: #957514; border-color: #957514; } + .list-group-item-danger { - color: #572b15; - background-color: #ddc6ba; + color: #592b15; + background-color: #dfc6ba; } -.list-group-item-danger.list-group-item-action:focus, -.list-group-item-danger.list-group-item-action:hover { - color: #572b15; - background-color: #d5b8a9; +.list-group-item-danger.list-group-item-action:hover, +.list-group-item-danger.list-group-item-action:focus { + color: #592b15; + background-color: #d7b8a9; } .list-group-item-danger.list-group-item-action.active { - color: #fff; - background-color: #572b15; - border-color: #572b15; + color: #ffffff; + background-color: #592b15; + border-color: #592b15; } + .list-group-item-light { color: #919292; background-color: #fdfdfe; } -.list-group-item-light.list-group-item-action:focus, -.list-group-item-light.list-group-item-action:hover { +.list-group-item-light.list-group-item-action:hover, +.list-group-item-light.list-group-item-action:focus { color: #919292; background-color: #ececf6; } .list-group-item-light.list-group-item-action.active { - color: #fff; + color: #ffffff; background-color: #919292; border-color: #919292; } + .list-group-item-dark { color: #2b2e32; background-color: #c6c8ca; } -.list-group-item-dark.list-group-item-action:focus, -.list-group-item-dark.list-group-item-action:hover { +.list-group-item-dark.list-group-item-action:hover, +.list-group-item-dark.list-group-item-action:focus { color: #2b2e32; background-color: #b9bbbe; } .list-group-item-dark.list-group-item-action.active { - color: #fff; + color: #ffffff; background-color: #2b2e32; border-color: #2b2e32; } + .close { float: right; font-size: 1.5rem; font-weight: 600; line-height: 1; - color: #222; - text-shadow: 0 1px 0 #fff; + color: #222222; + text-shadow: 0 1px 0 #ffffff; opacity: 0.5; } .close:hover { - color: #222; + color: #222222; text-decoration: none; } -.close:not(:disabled):not(.disabled):focus, -.close:not(:disabled):not(.disabled):hover { +.close:not(:disabled):not(.disabled):hover, +.close:not(:disabled):not(.disabled):focus { opacity: 0.75; } + button.close { padding: 0; background-color: transparent; border: 0; } + a.close.disabled { pointer-events: none; } + .toast { + flex-basis: 350px; max-width: 350px; - overflow: hidden; font-size: 0.875rem; background-color: rgba(255, 255, 255, 0.85); background-clip: padding-box; border: 1px solid rgba(0, 0, 0, 0.1); box-shadow: 0 0.25rem 0.75rem rgba(34, 34, 34, 0.1); - backdrop-filter: blur(10px); opacity: 0; border-radius: 0.25rem; } @@ -5120,6 +5545,7 @@ a.close.disabled { .toast.hide { display: none; } + .toast-header { display: flex; align-items: center; @@ -5128,10 +5554,14 @@ a.close.disabled { background-color: rgba(255, 255, 255, 0.85); background-clip: padding-box; border-bottom: 1px solid rgba(0, 0, 0, 0.05); + border-top-left-radius: calc(0.25rem - 1px); + border-top-right-radius: calc(0.25rem - 1px); } + .toast-body { padding: 0.75rem; } + .modal-open { overflow: hidden; } @@ -5139,6 +5569,7 @@ a.close.disabled { overflow-x: hidden; overflow-y: auto; } + .modal { position: fixed; top: 0; @@ -5150,6 +5581,7 @@ a.close.disabled { overflow: hidden; outline: 0; } + .modal-dialog { position: relative; width: auto; @@ -5171,6 +5603,7 @@ a.close.disabled { .modal.modal-static .modal-dialog { transform: scale(1.02); } + .modal-dialog-scrollable { display: flex; max-height: calc(100% - 1rem); @@ -5179,13 +5612,14 @@ a.close.disabled { max-height: calc(100vh - 1rem); overflow: hidden; } -.modal-dialog-scrollable .modal-footer, -.modal-dialog-scrollable .modal-header { +.modal-dialog-scrollable .modal-header, +.modal-dialog-scrollable .modal-footer { flex-shrink: 0; } .modal-dialog-scrollable .modal-body { overflow-y: auto; } + .modal-dialog-centered { display: flex; align-items: center; @@ -5208,18 +5642,20 @@ a.close.disabled { .modal-dialog-centered.modal-dialog-scrollable::before { content: none; } + .modal-content { position: relative; display: flex; flex-direction: column; width: 100%; pointer-events: auto; - background-color: #fff; + background-color: #ffffff; background-clip: padding-box; border: 1px solid rgba(34, 34, 34, 0.2); border-radius: 0.5rem; outline: 0; } + .modal-backdrop { position: fixed; top: 0; @@ -5227,7 +5663,7 @@ a.close.disabled { z-index: 1040; width: 100vw; height: 100vh; - background-color: #222; + background-color: #222222; } .modal-backdrop.fade { opacity: 0; @@ -5235,6 +5671,7 @@ a.close.disabled { .modal-backdrop.show { opacity: 0.5; } + .modal-header { display: flex; align-items: flex-start; @@ -5248,15 +5685,18 @@ a.close.disabled { padding: 1rem 1rem; margin: -1rem -1rem -1rem auto; } + .modal-title { margin-bottom: 0; line-height: 1.5; } + .modal-body { position: relative; flex: 1 1 auto; padding: 1rem; } + .modal-footer { display: flex; flex-wrap: wrap; @@ -5270,6 +5710,7 @@ a.close.disabled { .modal-footer > * { margin: 0.25rem; } + .modal-scrollbar-measure { position: absolute; top: -9999px; @@ -5277,6 +5718,7 @@ a.close.disabled { height: 50px; overflow: scroll; } + @media (min-width: 576px) { .modal-dialog { max-width: 500px; @@ -5316,7 +5758,7 @@ a.close.disabled { display: block; margin: 0; font-family: -apple-system, BlinkMacSystemFont, "Droid Sans", "Segoe UI", - Helvetica, Arial, sans-serif; + "Helvetica", Arial, sans-serif; font-style: normal; font-weight: 400; line-height: 1.5; @@ -5327,8 +5769,8 @@ a.close.disabled { text-transform: none; letter-spacing: normal; word-break: normal; - word-spacing: normal; white-space: normal; + word-spacing: normal; line-break: auto; font-size: 0.875rem; word-wrap: break-word; @@ -5349,74 +5791,80 @@ a.close.disabled { border-color: transparent; border-style: solid; } -.bs-tooltip-auto[x-placement^="top"], -.bs-tooltip-top { + +.bs-tooltip-top, +.bs-tooltip-auto[x-placement^="top"] { padding: 0.4rem 0; } -.bs-tooltip-auto[x-placement^="top"] .arrow, -.bs-tooltip-top .arrow { +.bs-tooltip-top .arrow, +.bs-tooltip-auto[x-placement^="top"] .arrow { bottom: 0; } -.bs-tooltip-auto[x-placement^="top"] .arrow::before, -.bs-tooltip-top .arrow::before { +.bs-tooltip-top .arrow::before, +.bs-tooltip-auto[x-placement^="top"] .arrow::before { top: 0; border-width: 0.4rem 0.4rem 0; - border-top-color: #222; + border-top-color: #222222; } -.bs-tooltip-auto[x-placement^="right"], -.bs-tooltip-right { + +.bs-tooltip-right, +.bs-tooltip-auto[x-placement^="right"] { padding: 0 0.4rem; } -.bs-tooltip-auto[x-placement^="right"] .arrow, -.bs-tooltip-right .arrow { +.bs-tooltip-right .arrow, +.bs-tooltip-auto[x-placement^="right"] .arrow { left: 0; width: 0.4rem; height: 0.8rem; } -.bs-tooltip-auto[x-placement^="right"] .arrow::before, -.bs-tooltip-right .arrow::before { +.bs-tooltip-right .arrow::before, +.bs-tooltip-auto[x-placement^="right"] .arrow::before { right: 0; border-width: 0.4rem 0.4rem 0.4rem 0; - border-right-color: #222; + border-right-color: #222222; } -.bs-tooltip-auto[x-placement^="bottom"], -.bs-tooltip-bottom { + +.bs-tooltip-bottom, +.bs-tooltip-auto[x-placement^="bottom"] { padding: 0.4rem 0; } -.bs-tooltip-auto[x-placement^="bottom"] .arrow, -.bs-tooltip-bottom .arrow { +.bs-tooltip-bottom .arrow, +.bs-tooltip-auto[x-placement^="bottom"] .arrow { top: 0; } -.bs-tooltip-auto[x-placement^="bottom"] .arrow::before, -.bs-tooltip-bottom .arrow::before { +.bs-tooltip-bottom .arrow::before, +.bs-tooltip-auto[x-placement^="bottom"] .arrow::before { bottom: 0; border-width: 0 0.4rem 0.4rem; - border-bottom-color: #222; + border-bottom-color: #222222; } -.bs-tooltip-auto[x-placement^="left"], -.bs-tooltip-left { + +.bs-tooltip-left, +.bs-tooltip-auto[x-placement^="left"] { padding: 0 0.4rem; } -.bs-tooltip-auto[x-placement^="left"] .arrow, -.bs-tooltip-left .arrow { +.bs-tooltip-left .arrow, +.bs-tooltip-auto[x-placement^="left"] .arrow { right: 0; width: 0.4rem; height: 0.8rem; } -.bs-tooltip-auto[x-placement^="left"] .arrow::before, -.bs-tooltip-left .arrow::before { +.bs-tooltip-left .arrow::before, +.bs-tooltip-auto[x-placement^="left"] .arrow::before { left: 0; border-width: 0.4rem 0 0.4rem 0.4rem; - border-left-color: #222; + border-left-color: #222222; } + .tooltip-inner { max-width: 200px; padding: 0.25rem 0.5rem; - color: #fff; + color: #ffffff; text-align: center; - background-color: #222; + background-color: #222222; border-radius: 0.5rem; } + .popover { position: absolute; top: 0; @@ -5425,7 +5873,7 @@ a.close.disabled { display: block; max-width: 276px; font-family: -apple-system, BlinkMacSystemFont, "Droid Sans", "Segoe UI", - Helvetica, Arial, sans-serif; + "Helvetica", Arial, sans-serif; font-style: normal; font-weight: 400; line-height: 1.5; @@ -5436,12 +5884,12 @@ a.close.disabled { text-transform: none; letter-spacing: normal; word-break: normal; - word-spacing: normal; white-space: normal; + word-spacing: normal; line-break: auto; font-size: 0.875rem; word-wrap: break-word; - background-color: #fff; + background-color: #ffffff; background-clip: padding-box; border: 1px solid rgba(34, 34, 34, 0.2); border-radius: 0.5rem; @@ -5453,79 +5901,82 @@ a.close.disabled { height: 0.5rem; margin: 0 0.5rem; } -.popover .arrow::after, -.popover .arrow::before { +.popover .arrow::before, +.popover .arrow::after { position: absolute; display: block; content: ""; border-color: transparent; border-style: solid; } -.bs-popover-auto[x-placement^="top"], -.bs-popover-top { + +.bs-popover-top, +.bs-popover-auto[x-placement^="top"] { margin-bottom: 0.5rem; } -.bs-popover-auto[x-placement^="top"] > .arrow, -.bs-popover-top > .arrow { +.bs-popover-top > .arrow, +.bs-popover-auto[x-placement^="top"] > .arrow { bottom: calc(-0.5rem - 1px); } -.bs-popover-auto[x-placement^="top"] > .arrow::before, -.bs-popover-top > .arrow::before { +.bs-popover-top > .arrow::before, +.bs-popover-auto[x-placement^="top"] > .arrow::before { bottom: 0; border-width: 0.5rem 0.5rem 0; border-top-color: rgba(34, 34, 34, 0.25); } -.bs-popover-auto[x-placement^="top"] > .arrow::after, -.bs-popover-top > .arrow::after { +.bs-popover-top > .arrow::after, +.bs-popover-auto[x-placement^="top"] > .arrow::after { bottom: 1px; border-width: 0.5rem 0.5rem 0; - border-top-color: #fff; + border-top-color: #ffffff; } -.bs-popover-auto[x-placement^="right"], -.bs-popover-right { + +.bs-popover-right, +.bs-popover-auto[x-placement^="right"] { margin-left: 0.5rem; } -.bs-popover-auto[x-placement^="right"] > .arrow, -.bs-popover-right > .arrow { +.bs-popover-right > .arrow, +.bs-popover-auto[x-placement^="right"] > .arrow { left: calc(-0.5rem - 1px); width: 0.5rem; height: 1rem; margin: 0.5rem 0; } -.bs-popover-auto[x-placement^="right"] > .arrow::before, -.bs-popover-right > .arrow::before { +.bs-popover-right > .arrow::before, +.bs-popover-auto[x-placement^="right"] > .arrow::before { left: 0; border-width: 0.5rem 0.5rem 0.5rem 0; border-right-color: rgba(34, 34, 34, 0.25); } -.bs-popover-auto[x-placement^="right"] > .arrow::after, -.bs-popover-right > .arrow::after { +.bs-popover-right > .arrow::after, +.bs-popover-auto[x-placement^="right"] > .arrow::after { left: 1px; border-width: 0.5rem 0.5rem 0.5rem 0; - border-right-color: #fff; + border-right-color: #ffffff; } -.bs-popover-auto[x-placement^="bottom"], -.bs-popover-bottom { + +.bs-popover-bottom, +.bs-popover-auto[x-placement^="bottom"] { margin-top: 0.5rem; } -.bs-popover-auto[x-placement^="bottom"] > .arrow, -.bs-popover-bottom > .arrow { +.bs-popover-bottom > .arrow, +.bs-popover-auto[x-placement^="bottom"] > .arrow { top: calc(-0.5rem - 1px); } -.bs-popover-auto[x-placement^="bottom"] > .arrow::before, -.bs-popover-bottom > .arrow::before { +.bs-popover-bottom > .arrow::before, +.bs-popover-auto[x-placement^="bottom"] > .arrow::before { top: 0; border-width: 0 0.5rem 0.5rem 0.5rem; border-bottom-color: rgba(34, 34, 34, 0.25); } -.bs-popover-auto[x-placement^="bottom"] > .arrow::after, -.bs-popover-bottom > .arrow::after { +.bs-popover-bottom > .arrow::after, +.bs-popover-auto[x-placement^="bottom"] > .arrow::after { top: 1px; border-width: 0 0.5rem 0.5rem 0.5rem; - border-bottom-color: #fff; + border-bottom-color: #ffffff; } -.bs-popover-auto[x-placement^="bottom"] .popover-header::before, -.bs-popover-bottom .popover-header::before { +.bs-popover-bottom .popover-header::before, +.bs-popover-auto[x-placement^="bottom"] .popover-header::before { position: absolute; top: 0; left: 50%; @@ -5535,29 +5986,31 @@ a.close.disabled { content: ""; border-bottom: 1px solid #f7f7f7; } -.bs-popover-auto[x-placement^="left"], -.bs-popover-left { + +.bs-popover-left, +.bs-popover-auto[x-placement^="left"] { margin-right: 0.5rem; } -.bs-popover-auto[x-placement^="left"] > .arrow, -.bs-popover-left > .arrow { +.bs-popover-left > .arrow, +.bs-popover-auto[x-placement^="left"] > .arrow { right: calc(-0.5rem - 1px); width: 0.5rem; height: 1rem; margin: 0.5rem 0; } -.bs-popover-auto[x-placement^="left"] > .arrow::before, -.bs-popover-left > .arrow::before { +.bs-popover-left > .arrow::before, +.bs-popover-auto[x-placement^="left"] > .arrow::before { right: 0; border-width: 0.5rem 0 0.5rem 0.5rem; border-left-color: rgba(34, 34, 34, 0.25); } -.bs-popover-auto[x-placement^="left"] > .arrow::after, -.bs-popover-left > .arrow::after { +.bs-popover-left > .arrow::after, +.bs-popover-auto[x-placement^="left"] > .arrow::after { right: 1px; border-width: 0.5rem 0 0.5rem 0.5rem; - border-left-color: #fff; + border-left-color: #ffffff; } + .popover-header { padding: 0.5rem 0.75rem; margin-bottom: 0; @@ -5571,16 +6024,20 @@ a.close.disabled { .popover-header:empty { display: none; } + .popover-body { padding: 0.5rem 0.75rem; color: #495057; } + .carousel { position: relative; } + .carousel.pointer-event { touch-action: pan-y; } + .carousel-inner { position: relative; width: 100%; @@ -5591,6 +6048,7 @@ a.close.disabled { clear: both; content: ""; } + .carousel-item { position: relative; display: none; @@ -5605,27 +6063,31 @@ a.close.disabled { transition: none; } } + +.carousel-item.active, .carousel-item-next, -.carousel-item-prev, -.carousel-item.active { +.carousel-item-prev { display: block; } -.active.carousel-item-right, -.carousel-item-next:not(.carousel-item-left) { + +.carousel-item-next:not(.carousel-item-left), +.active.carousel-item-right { transform: translateX(100%); } -.active.carousel-item-left, -.carousel-item-prev:not(.carousel-item-right) { + +.carousel-item-prev:not(.carousel-item-right), +.active.carousel-item-left { transform: translateX(-100%); } + .carousel-fade .carousel-item { opacity: 0; transition-property: opacity; transform: none; } +.carousel-fade .carousel-item.active, .carousel-fade .carousel-item-next.carousel-item-left, -.carousel-fade .carousel-item-prev.carousel-item-right, -.carousel-fade .carousel-item.active { +.carousel-fade .carousel-item-prev.carousel-item-right { z-index: 1; opacity: 1; } @@ -5641,8 +6103,9 @@ a.close.disabled { transition: none; } } -.carousel-control-next, -.carousel-control-prev { + +.carousel-control-prev, +.carousel-control-next { position: absolute; top: 0; bottom: 0; @@ -5651,45 +6114,54 @@ a.close.disabled { align-items: center; justify-content: center; width: 15%; - color: #fff; + padding: 0; + color: #ffffff; text-align: center; + background: none; + border: 0; opacity: 0.5; transition: opacity 0.15s ease; } @media (prefers-reduced-motion: reduce) { - .carousel-control-next, - .carousel-control-prev { + .carousel-control-prev, + .carousel-control-next { transition: none; } } -.carousel-control-next:focus, -.carousel-control-next:hover, +.carousel-control-prev:hover, .carousel-control-prev:focus, -.carousel-control-prev:hover { - color: #fff; +.carousel-control-next:hover, +.carousel-control-next:focus { + color: #ffffff; text-decoration: none; outline: 0; opacity: 0.9; } + .carousel-control-prev { left: 0; } + .carousel-control-next { right: 0; } -.carousel-control-next-icon, -.carousel-control-prev-icon { + +.carousel-control-prev-icon, +.carousel-control-next-icon { display: inline-block; width: 20px; height: 20px; - background: no-repeat 50%/100% 100%; + background: 50%/100% 100% no-repeat; } + .carousel-control-prev-icon { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23ffffff' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath d='M5.25 0l-4 4 4 4 1.5-1.5L4.25 4l2.5-2.5L5.25 0z'/%3e%3c/svg%3e"); } + .carousel-control-next-icon { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23ffffff' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath d='M2.75 0l-1.5 1.5L3.75 4l-2.5 2.5L2.75 8l4-4-4-4z'/%3e%3c/svg%3e"); } + .carousel-indicators { position: absolute; right: 0; @@ -5712,7 +6184,7 @@ a.close.disabled { margin-left: 3px; text-indent: -999px; cursor: pointer; - background-color: #fff; + background-color: #ffffff; background-clip: padding-box; border-top: 10px solid transparent; border-bottom: 10px solid transparent; @@ -5727,6 +6199,7 @@ a.close.disabled { .carousel-indicators .active { opacity: 1; } + .carousel-caption { position: absolute; right: 15%; @@ -5735,9 +6208,10 @@ a.close.disabled { z-index: 10; padding-top: 20px; padding-bottom: 20px; - color: #fff; + color: #ffffff; text-align: center; } + @keyframes spinner-border { to { transform: rotate(360deg); @@ -5747,17 +6221,19 @@ a.close.disabled { display: inline-block; width: 2rem; height: 2rem; - vertical-align: text-bottom; - border: 0.25em solid currentColor; + vertical-align: -0.125em; + border: 0.25em solid currentcolor; border-right-color: transparent; border-radius: 50%; - animation: spinner-border 0.75s linear infinite; + animation: 0.75s linear infinite spinner-border; } + .spinner-border-sm { width: 1rem; height: 1rem; border-width: 0.2em; } + @keyframes spinner-grow { 0% { transform: scale(0); @@ -5771,235 +6247,306 @@ a.close.disabled { display: inline-block; width: 2rem; height: 2rem; - vertical-align: text-bottom; - background-color: currentColor; + vertical-align: -0.125em; + background-color: currentcolor; border-radius: 50%; opacity: 0; - animation: spinner-grow 0.75s linear infinite; + animation: 0.75s linear infinite spinner-grow; } + .spinner-grow-sm { width: 1rem; height: 1rem; } + +@media (prefers-reduced-motion: reduce) { + .spinner-border, + .spinner-grow { + animation-duration: 1.5s; + } +} .align-baseline { vertical-align: baseline !important; } + .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; } + .bg-primary { background-color: #f1641e !important; } -a.bg-primary:focus, + a.bg-primary:hover, -button.bg-primary:focus, -button.bg-primary:hover { +a.bg-primary:focus, +button.bg-primary:hover, +button.bg-primary:focus { background-color: #cf4d0d !important; } + .bg-secondary { - background-color: #00c853 !important; + background-color: #c80000 !important; } -a.bg-secondary:focus, + a.bg-secondary:hover, -button.bg-secondary:focus, -button.bg-secondary:hover { - background-color: #00953e !important; +a.bg-secondary:focus, +button.bg-secondary:hover, +button.bg-secondary:focus { + background-color: #950000 !important; } + .bg-success { background-color: #6610f2 !important; } -a.bg-success:focus, + a.bg-success:hover, -button.bg-success:focus, -button.bg-success:hover { +a.bg-success:focus, +button.bg-success:hover, +button.bg-success:focus { background-color: #510bc4 !important; } + .bg-info { background-color: #007bff !important; } -a.bg-info:focus, + a.bg-info:hover, -button.bg-info:focus, -button.bg-info:hover { +a.bg-info:focus, +button.bg-info:hover, +button.bg-info:focus { background-color: #0062cc !important; } + .bg-warning { background-color: #ffc107 !important; } -a.bg-warning:focus, + a.bg-warning:hover, -button.bg-warning:focus, -button.bg-warning:hover { +a.bg-warning:focus, +button.bg-warning:hover, +button.bg-warning:focus { background-color: #d39e00 !important; } + .bg-danger { - background-color: #873208 !important; + background-color: #8c3409 !important; } -a.bg-danger:focus, + a.bg-danger:hover, -button.bg-danger:focus, -button.bg-danger:hover { - background-color: #572105 !important; +a.bg-danger:focus, +button.bg-danger:hover, +button.bg-danger:focus { + background-color: #5c2206 !important; } + .bg-light { background-color: #f8f9fa !important; } -a.bg-light:focus, + a.bg-light:hover, -button.bg-light:focus, -button.bg-light:hover { +a.bg-light:focus, +button.bg-light:hover, +button.bg-light:focus { background-color: #dae0e5 !important; } + .bg-dark { background-color: #343a40 !important; } -a.bg-dark:focus, + a.bg-dark:hover, -button.bg-dark:focus, -button.bg-dark:hover { +a.bg-dark:focus, +button.bg-dark:hover, +button.bg-dark:focus { background-color: #1d2124 !important; } + .bg-white { - background-color: #fff !important; + background-color: #ffffff !important; } + .bg-transparent { background-color: transparent !important; } + .border { border: 1px solid #495057 !important; } + .border-top { border-top: 1px solid #495057 !important; } + .border-right { border-right: 1px solid #495057 !important; } + .border-bottom { border-bottom: 1px solid #495057 !important; } + .border-left { border-left: 1px solid #495057 !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; } + .border-primary { border-color: #f1641e !important; } + .border-secondary { border-color: #c80000 !important; } + .border-success { border-color: #6610f2 !important; } + .border-info { border-color: #007bff !important; } + .border-warning { border-color: #ffc107 !important; } + .border-danger { - border-color: #873208 !important; + border-color: #8c3409 !important; } + .border-light { border-color: #f8f9fa !important; } + .border-dark { border-color: #343a40 !important; } + .border-white { - border-color: #fff !important; + border-color: #ffffff !important; } + .rounded-sm { border-radius: 1rem !important; } + .rounded { border-radius: 0.5rem !important; } + .rounded-top { border-top-left-radius: 0.5rem !important; border-top-right-radius: 0.5rem !important; } + .rounded-right { border-top-right-radius: 0.5rem !important; border-bottom-right-radius: 0.5rem !important; } + .rounded-bottom { border-bottom-right-radius: 0.5rem !important; border-bottom-left-radius: 0.5rem !important; } + .rounded-left { border-top-left-radius: 0.5rem !important; border-bottom-left-radius: 0.5rem !important; } + .rounded-lg { border-radius: 0.5rem !important; } + .rounded-circle { border-radius: 50% !important; } + .rounded-pill { border-radius: 0.25rem !important; } + .rounded-0 { border-radius: 0 !important; } + .clearfix::after { display: block; clear: both; content: ""; } + .d-none { display: none !important; } + .d-inline { display: inline !important; } + .d-inline-block { display: inline-block !important; } + .d-block { display: block !important; } + .d-table { display: table !important; } + .d-table-row { display: table-row !important; } + .d-table-cell { display: table-cell !important; } + .d-flex { display: flex !important; } + .d-inline-flex { display: inline-flex !important; } + @media (min-width: 576px) { .d-sm-none { display: none !important; @@ -6157,8 +6704,8 @@ button.bg-dark:hover { content: ""; } .embed-responsive .embed-responsive-item, -.embed-responsive embed, .embed-responsive iframe, +.embed-responsive embed, .embed-responsive object, .embed-responsive video { position: absolute; @@ -6169,120 +6716,159 @@ button.bg-dark:hover { height: 100%; border: 0; } + .embed-responsive-21by9::before { - padding-top: 42.85714%; + padding-top: 42.85714286%; } + .embed-responsive-16by9::before { padding-top: 56.25%; } + .embed-responsive-4by3::before { padding-top: 75%; } + .embed-responsive-1by1::before { padding-top: 100%; } + .flex-row { flex-direction: row !important; } + .flex-column { flex-direction: column !important; } + .flex-row-reverse { flex-direction: row-reverse !important; } + .flex-column-reverse { flex-direction: column-reverse !important; } + .flex-wrap { flex-wrap: wrap !important; } + .flex-nowrap { flex-wrap: nowrap !important; } + .flex-wrap-reverse { flex-wrap: wrap-reverse !important; } + .flex-fill { flex: 1 1 auto !important; } + .flex-grow-0 { flex-grow: 0 !important; } + .flex-grow-1 { flex-grow: 1 !important; } + .flex-shrink-0 { flex-shrink: 0 !important; } + .flex-shrink-1 { flex-shrink: 1 !important; } + .justify-content-start { justify-content: flex-start !important; } + .justify-content-end { justify-content: flex-end !important; } + .justify-content-center { justify-content: center !important; } + .justify-content-between { justify-content: space-between !important; } + .justify-content-around { justify-content: space-around !important; } + .align-items-start { align-items: flex-start !important; } + .align-items-end { align-items: flex-end !important; } + .align-items-center { align-items: center !important; } + .align-items-baseline { align-items: baseline !important; } + .align-items-stretch { align-items: stretch !important; } + .align-content-start { align-content: flex-start !important; } + .align-content-end { align-content: flex-end !important; } + .align-content-center { align-content: center !important; } + .align-content-between { align-content: space-between !important; } + .align-content-around { align-content: space-around !important; } + .align-content-stretch { align-content: stretch !important; } + .align-self-auto { align-self: auto !important; } + .align-self-start { align-self: flex-start !important; } + .align-self-end { align-self: flex-end !important; } + .align-self-center { align-self: center !important; } + .align-self-baseline { align-self: baseline !important; } + .align-self-stretch { align-self: stretch !important; } + @media (min-width: 576px) { .flex-sm-row { flex-direction: row !important; @@ -6702,12 +7288,15 @@ button.bg-dark:hover { .float-left { float: left !important; } + .float-right { float: right !important; } + .float-none { float: none !important; } + @media (min-width: 576px) { .float-sm-left { float: left !important; @@ -6755,33 +7344,43 @@ button.bg-dark:hover { .user-select-all { user-select: all !important; } + .user-select-auto { user-select: auto !important; } + .user-select-none { user-select: none !important; } + .overflow-auto { overflow: auto !important; } + .overflow-hidden { overflow: hidden !important; } + .position-static { position: static !important; } + .position-relative { position: relative !important; } + .position-absolute { position: absolute !important; } + .position-fixed { position: fixed !important; } + .position-sticky { position: sticky !important; } + .fixed-top { position: fixed; top: 0; @@ -6789,6 +7388,7 @@ button.bg-dark:hover { left: 0; z-index: 1030; } + .fixed-bottom { position: fixed; right: 0; @@ -6796,6 +7396,7 @@ button.bg-dark:hover { left: 0; z-index: 1030; } + @supports (position: sticky) { .sticky-top { position: sticky; @@ -6803,6 +7404,7 @@ button.bg-dark:hover { z-index: 1020; } } + .sr-only { position: absolute; width: 1px; @@ -6814,6 +7416,7 @@ button.bg-dark:hover { white-space: nowrap; border: 0; } + .sr-only-focusable:active, .sr-only-focusable:focus { position: static; @@ -6823,408 +7426,519 @@ button.bg-dark:hover { clip: auto; white-space: normal; } + .shadow-sm { box-shadow: 0 0.125rem 0.25rem rgba(34, 34, 34, 0.075) !important; } + .shadow { box-shadow: 0 0.5rem 1rem rgba(34, 34, 34, 0.15) !important; } + .shadow-lg { box-shadow: 0 1rem 3rem rgba(34, 34, 34, 0.175) !important; } + .shadow-none { box-shadow: none !important; } + .w-25 { width: 25% !important; } + .w-50 { width: 50% !important; } + .w-75 { width: 75% !important; } + .w-100 { width: 100% !important; } + .w-auto { width: auto !important; } + .h-25 { height: 25% !important; } + .h-50 { height: 50% !important; } + .h-75 { height: 75% !important; } + .h-100 { height: 100% !important; } + .h-auto { height: auto !important; } + .mw-100 { max-width: 100% !important; } + .mh-100 { max-height: 100% !important; } + .min-vw-100 { min-width: 100vw !important; } + .min-vh-100 { min-height: 100vh !important; } + .vw-100 { width: 100vw !important; } + .vh-100 { height: 100vh !important; } + .m-0 { margin: 0 !important; } + .mt-0, .my-0 { margin-top: 0 !important; } + .mr-0, .mx-0 { margin-right: 0 !important; } + .mb-0, .my-0 { margin-bottom: 0 !important; } + .ml-0, .mx-0 { margin-left: 0 !important; } + .m-1 { margin: 0.25rem !important; } + .mt-1, .my-1 { margin-top: 0.25rem !important; } + .mr-1, .mx-1 { margin-right: 0.25rem !important; } + .mb-1, .my-1 { margin-bottom: 0.25rem !important; } + .ml-1, .mx-1 { margin-left: 0.25rem !important; } + .m-2 { margin: 0.5rem !important; } + .mt-2, .my-2 { margin-top: 0.5rem !important; } + .mr-2, .mx-2 { margin-right: 0.5rem !important; } + .mb-2, .my-2 { margin-bottom: 0.5rem !important; } + .ml-2, .mx-2 { margin-left: 0.5rem !important; } + .m-3 { margin: 1rem !important; } + .mt-3, .my-3 { margin-top: 1rem !important; } + .mr-3, .mx-3 { margin-right: 1rem !important; } + .mb-3, .my-3 { margin-bottom: 1rem !important; } + .ml-3, .mx-3 { margin-left: 1rem !important; } + .m-4 { margin: 1.5rem !important; } + .mt-4, .my-4 { margin-top: 1.5rem !important; } + .mr-4, .mx-4 { margin-right: 1.5rem !important; } + .mb-4, .my-4 { margin-bottom: 1.5rem !important; } + .ml-4, .mx-4 { margin-left: 1.5rem !important; } + .m-5 { margin: 3rem !important; } + .mt-5, .my-5 { margin-top: 3rem !important; } + .mr-5, .mx-5 { margin-right: 3rem !important; } + .mb-5, .my-5 { margin-bottom: 3rem !important; } + .ml-5, .mx-5 { margin-left: 3rem !important; } + .p-0 { padding: 0 !important; } + .pt-0, .py-0 { padding-top: 0 !important; } + .pr-0, .px-0 { padding-right: 0 !important; } + .pb-0, .py-0 { padding-bottom: 0 !important; } + .pl-0, .px-0 { padding-left: 0 !important; } + .p-1 { padding: 0.25rem !important; } + .pt-1, .py-1 { padding-top: 0.25rem !important; } + .pr-1, .px-1 { padding-right: 0.25rem !important; } + .pb-1, .py-1 { padding-bottom: 0.25rem !important; } + .pl-1, .px-1 { padding-left: 0.25rem !important; } + .p-2 { padding: 0.5rem !important; } + .pt-2, .py-2 { padding-top: 0.5rem !important; } + .pr-2, .px-2 { padding-right: 0.5rem !important; } + .pb-2, .py-2 { padding-bottom: 0.5rem !important; } + .pl-2, .px-2 { padding-left: 0.5rem !important; } + .p-3 { padding: 1rem !important; } + .pt-3, .py-3 { padding-top: 1rem !important; } + .pr-3, .px-3 { padding-right: 1rem !important; } + .pb-3, .py-3 { padding-bottom: 1rem !important; } + .pl-3, .px-3 { padding-left: 1rem !important; } + .p-4 { padding: 1.5rem !important; } + .pt-4, .py-4 { padding-top: 1.5rem !important; } + .pr-4, .px-4 { padding-right: 1.5rem !important; } + .pb-4, .py-4 { padding-bottom: 1.5rem !important; } + .pl-4, .px-4 { padding-left: 1.5rem !important; } + .p-5 { padding: 3rem !important; } + .pt-5, .py-5 { padding-top: 3rem !important; } + .pr-5, .px-5 { padding-right: 3rem !important; } + .pb-5, .py-5 { padding-bottom: 3rem !important; } + .pl-5, .px-5 { padding-left: 3rem !important; } + .m-n1 { margin: -0.25rem !important; } + .mt-n1, .my-n1 { margin-top: -0.25rem !important; } + .mr-n1, .mx-n1 { margin-right: -0.25rem !important; } + .mb-n1, .my-n1 { margin-bottom: -0.25rem !important; } + .ml-n1, .mx-n1 { margin-left: -0.25rem !important; } + .m-n2 { margin: -0.5rem !important; } + .mt-n2, .my-n2 { margin-top: -0.5rem !important; } + .mr-n2, .mx-n2 { margin-right: -0.5rem !important; } + .mb-n2, .my-n2 { margin-bottom: -0.5rem !important; } + .ml-n2, .mx-n2 { margin-left: -0.5rem !important; } + .m-n3 { margin: -1rem !important; } + .mt-n3, .my-n3 { margin-top: -1rem !important; } + .mr-n3, .mx-n3 { margin-right: -1rem !important; } + .mb-n3, .my-n3 { margin-bottom: -1rem !important; } + .ml-n3, .mx-n3 { margin-left: -1rem !important; } + .m-n4 { margin: -1.5rem !important; } + .mt-n4, .my-n4 { margin-top: -1.5rem !important; } + .mr-n4, .mx-n4 { margin-right: -1.5rem !important; } + .mb-n4, .my-n4 { margin-bottom: -1.5rem !important; } + .ml-n4, .mx-n4 { margin-left: -1.5rem !important; } + .m-n5 { margin: -3rem !important; } + .mt-n5, .my-n5 { margin-top: -3rem !important; } + .mr-n5, .mx-n5 { margin-right: -3rem !important; } + .mb-n5, .my-n5 { margin-bottom: -3rem !important; } + .ml-n5, .mx-n5 { margin-left: -3rem !important; } + .m-auto { margin: auto !important; } + .mt-auto, .my-auto { margin-top: auto !important; } + .mr-auto, .mx-auto { margin-right: auto !important; } + .mb-auto, .my-auto { margin-bottom: auto !important; } + .ml-auto, .mx-auto { margin-left: auto !important; } + @media (min-width: 576px) { .m-sm-0 { margin: 0 !important; @@ -8612,33 +9326,42 @@ button.bg-dark:hover { content: ""; background-color: rgba(0, 0, 0, 0); } + .text-monospace { font-family: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace !important; } + .text-justify { text-align: justify !important; } + .text-wrap { white-space: normal !important; } + .text-nowrap { white-space: nowrap !important; } + .text-truncate { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } + .text-left { text-align: left !important; } + .text-right { text-align: right !important; } + .text-center { text-align: center !important; } + @media (min-width: 576px) { .text-sm-left { text-align: left !important; @@ -8686,101 +9409,131 @@ button.bg-dark:hover { .text-lowercase { text-transform: lowercase !important; } + .text-uppercase { text-transform: uppercase !important; } + .text-capitalize { text-transform: capitalize !important; } + .font-weight-light { font-weight: 300 !important; } + .font-weight-lighter { font-weight: lighter !important; } + .font-weight-normal { font-weight: 400 !important; } + .font-weight-bold { font-weight: 600 !important; } + .font-weight-bolder { font-weight: bolder !important; } + .font-italic { font-style: italic !important; } + .text-white { - color: #fff !important; + color: #ffffff !important; } + .text-primary { color: #f1641e !important; } -a.text-primary:focus, -a.text-primary:hover { + +a.text-primary:hover, +a.text-primary:focus { color: #b7440b !important; } + .text-secondary { - color: #00c853 !important; + color: #c80000 !important; } -a.text-secondary:focus, -a.text-secondary:hover { - color: #007c33 !important; + +a.text-secondary:hover, +a.text-secondary:focus { + color: #7c0000 !important; } + .text-success { color: #6610f2 !important; } -a.text-success:focus, -a.text-success:hover { + +a.text-success:hover, +a.text-success:focus { color: #4709ac !important; } + .text-info { color: #007bff !important; } -a.text-info:focus, -a.text-info:hover { + +a.text-info:hover, +a.text-info:focus { color: #0056b3 !important; } + .text-warning { color: #ffc107 !important; } -a.text-warning:focus, -a.text-warning:hover { + +a.text-warning:hover, +a.text-warning:focus { color: #ba8b00 !important; } + .text-danger { - color: #873208 !important; + color: #8c3409 !important; } -a.text-danger:focus, -a.text-danger:hover { - color: #3f1804 !important; + +a.text-danger:hover, +a.text-danger:focus { + color: #441904 !important; } + .text-light { color: #f8f9fa !important; } -a.text-light:focus, -a.text-light:hover { + +a.text-light:hover, +a.text-light:focus { color: #cbd3da !important; } + .text-dark { color: #343a40 !important; } -a.text-dark:focus, -a.text-dark:hover { + +a.text-dark:hover, +a.text-dark:focus { color: #121416 !important; } + .text-body { color: #495057 !important; } + .text-muted { color: #6c757d !important; } + .text-black-50 { color: rgba(34, 34, 34, 0.5) !important; } + .text-white-50 { color: rgba(255, 255, 255, 0.5) !important; } + .text-hide { font: 0/0 a; color: transparent; @@ -8788,25 +9541,32 @@ a.text-dark:hover { background-color: transparent; border: 0; } + .text-decoration-none { text-decoration: none !important; } + .text-break { + word-break: break-word !important; word-wrap: break-word !important; } + .text-reset { color: inherit !important; } + .visible { visibility: visible !important; } + .invisible { visibility: hidden !important; } + @media print { *, - ::after, - ::before { + *::before, + *::after { text-shadow: none !important; box-shadow: none !important; } @@ -8819,21 +9579,18 @@ a.text-dark:hover { pre { white-space: pre-wrap !important; } - blockquote, - pre { + pre, + blockquote { border: 1px solid #adb5bd; page-break-inside: avoid; } - thead { - display: table-header-group; - } - img, - tr { + tr, + img { page-break-inside: avoid; } + p, h2, - h3, - p { + h3 { orphans: 3; widows: 3; } @@ -8854,26 +9611,26 @@ a.text-dark:hover { display: none; } .badge { - border: 1px solid #222; + border: 1px solid #222222; } .table { border-collapse: collapse !important; } .table td, .table th { - background-color: #fff !important; + background-color: #ffffff !important; } - .table-bordered td, - .table-bordered th { + .table-bordered th, + .table-bordered td { border: 1px solid #dee2e6 !important; } .table-dark { color: inherit; } - .table-dark tbody + tbody, - .table-dark td, .table-dark th, - .table-dark thead th { + .table-dark td, + .table-dark thead th, + .table-dark tbody + tbody { border-color: #495057; } .table .thead-dark th { @@ -8881,3 +9638,5 @@ a.text-dark:hover { border-color: #495057; } } + +/*# sourceMappingURL=litely-red.css.map */ diff --git a/src/assets/css/themes/litely-red.scss b/src/assets/css/themes/litely-red.scss new file mode 100644 index 00000000..388d70bd --- /dev/null +++ b/src/assets/css/themes/litely-red.scss @@ -0,0 +1,2 @@ +@import "variables.litely-red"; +@import "../../../../node_modules/bootstrap-v4/scss/bootstrap"; diff --git a/src/assets/css/themes/litely.css b/src/assets/css/themes/litely.css index f9d2b2d3..61dfd38e 100644 --- a/src/assets/css/themes/litely.css +++ b/src/assets/css/themes/litely.css @@ -1,3 +1,10 @@ +@charset "UTF-8"; +/*! + * Bootstrap v4.6.2 (https://getbootstrap.com/) + * Copyright 2011-2022 The Bootstrap Authors + * Copyright 2011-2022 Twitter, Inc. + * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE) + */ :root { --blue: #007bff; --indigo: #6610f2; @@ -31,17 +38,20 @@ --font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; } + *, -::after, -::before { +*::before, +*::after { box-sizing: border-box; } + html { font-family: sans-serif; line-height: 1.15; -webkit-text-size-adjust: 100%; -webkit-tap-highlight-color: rgba(34, 34, 34, 0); } + article, aside, figcaption, @@ -54,10 +64,11 @@ nav, section { display: block; } + body { margin: 0; font-family: -apple-system, BlinkMacSystemFont, "Droid Sans", "Segoe UI", - Helvetica, Arial, sans-serif; + "Helvetica", Arial, sans-serif; font-size: 1rem; font-weight: 400; line-height: 1.5; @@ -65,14 +76,17 @@ body { text-align: left; background-color: #fff; } + [tabindex="-1"]:focus:not(:focus-visible) { outline: 0 !important; } + hr { box-sizing: content-box; height: 0; overflow: visible; } + h1, h2, h3, @@ -82,52 +96,63 @@ h6 { margin-top: 0; margin-bottom: 0.5rem; } + p { margin-top: 0; margin-bottom: 1rem; } -abbr[data-original-title], -abbr[title] { + +abbr[title], +abbr[data-original-title] { text-decoration: underline; text-decoration: underline dotted; cursor: help; border-bottom: 0; text-decoration-skip-ink: none; } + address { margin-bottom: 1rem; font-style: normal; line-height: inherit; } -dl, + ol, -ul { +ul, +dl { margin-top: 0; margin-bottom: 1rem; } + ol ol, +ul ul, ol ul, -ul ol, -ul ul { +ul ol { margin-bottom: 0; } + dt { font-weight: 600; } + dd { margin-bottom: 0.5rem; margin-left: 0; } + blockquote { margin: 0 0 1rem; } + b, strong { font-weight: bolder; } + small { font-size: 80%; } + sub, sup { position: relative; @@ -135,12 +160,15 @@ sup { line-height: 0; vertical-align: baseline; } + sub { bottom: -0.25em; } + sup { top: -0.5em; } + a { color: #f1641e; text-decoration: none; @@ -150,42 +178,50 @@ a:hover { color: #b7440b; text-decoration: underline; } -a:not([href]) { + +a:not([href]):not([class]) { color: inherit; text-decoration: none; } -a:not([href]):hover { +a:not([href]):not([class]):hover { color: inherit; text-decoration: none; } + +pre, code, kbd, -pre, samp { font-family: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; font-size: 1em; } + pre { margin-top: 0; margin-bottom: 1rem; overflow: auto; -ms-overflow-style: scrollbar; } + figure { margin: 0 0 1rem; } + img { vertical-align: middle; border-style: none; } + svg { overflow: hidden; vertical-align: middle; } + table { border-collapse: collapse; } + caption { padding-top: 0.75rem; padding-bottom: 0.75rem; @@ -193,78 +229,94 @@ caption { text-align: left; caption-side: bottom; } + th { text-align: inherit; + text-align: -webkit-match-parent; } + label { display: inline-block; margin-bottom: 0.5rem; } + button { border-radius: 0; } -button:focus { - outline: 1px dotted; - outline: 5px auto -webkit-focus-ring-color; + +button:focus:not(:focus-visible) { + outline: 0; } -button, + input, -optgroup, +button, select, +optgroup, textarea { margin: 0; font-family: inherit; font-size: inherit; line-height: inherit; } + button, input { overflow: visible; } + button, select { text-transform: none; } + [role="button"] { cursor: pointer; } + select { word-wrap: normal; } + +button, [type="button"], [type="reset"], -[type="submit"], -button { +[type="submit"] { -webkit-appearance: button; } + +button:not(:disabled), [type="button"]:not(:disabled), [type="reset"]:not(:disabled), -[type="submit"]:not(:disabled), -button:not(:disabled) { +[type="submit"]:not(:disabled) { cursor: pointer; } + +button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, -[type="submit"]::-moz-focus-inner, -button::-moz-focus-inner { +[type="submit"]::-moz-focus-inner { padding: 0; border-style: none; } -input[type="checkbox"], -input[type="radio"] { + +input[type="radio"], +input[type="checkbox"] { box-sizing: border-box; padding: 0; } + textarea { overflow: auto; resize: vertical; } + fieldset { min-width: 0; padding: 0; margin: 0; border: 0; } + legend { display: block; width: 100%; @@ -276,152 +328,184 @@ legend { color: inherit; white-space: normal; } + progress { vertical-align: baseline; } + [type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button { height: auto; } + [type="search"] { outline-offset: -2px; -webkit-appearance: none; } + [type="search"]::-webkit-search-decoration { -webkit-appearance: none; } + ::-webkit-file-upload-button { font: inherit; -webkit-appearance: button; } + output { display: inline-block; } + summary { display: list-item; cursor: pointer; } + template { display: none; } + [hidden] { display: none !important; } -.h1, -.h2, -.h3, -.h4, -.h5, -.h6, + h1, h2, h3, h4, h5, -h6 { +h6, +.h1, +.h2, +.h3, +.h4, +.h5, +.h6 { margin-bottom: 0.5rem; font-weight: 500; line-height: 1.2; color: #495057; } -.h1, -h1 { + +h1, +.h1 { font-size: 2.5rem; } -.h2, -h2 { + +h2, +.h2 { font-size: 2rem; } -.h3, -h3 { + +h3, +.h3 { font-size: 1.75rem; } -.h4, -h4 { + +h4, +.h4 { font-size: 1.5rem; } -.h5, -h5 { + +h5, +.h5 { font-size: 1.25rem; } -.h6, -h6 { + +h6, +.h6 { font-size: 1rem; } + .lead { font-size: 1.25rem; font-weight: 300; } + .display-1 { font-size: 6rem; font-weight: 300; line-height: 1.2; } + .display-2 { font-size: 5.5rem; font-weight: 300; line-height: 1.2; } + .display-3 { font-size: 4.5rem; font-weight: 300; line-height: 1.2; } + .display-4 { font-size: 3.5rem; font-weight: 300; line-height: 1.2; } + hr { margin-top: 1rem; margin-bottom: 1rem; border: 0; border-top: 1px solid rgba(34, 34, 34, 0.1); } -.small, -small { - font-size: 80%; + +small, +.small { + font-size: 0.875em; font-weight: 400; } -.mark, -mark { + +mark, +.mark { padding: 0.2em; - background-color: #fffcef; + background-color: rgb(255, 252, 239); } + .list-unstyled { padding-left: 0; list-style: none; } + .list-inline { padding-left: 0; list-style: none; } + .list-inline-item { display: inline-block; } .list-inline-item:not(:last-child) { margin-right: 0.5rem; } + .initialism { font-size: 90%; text-transform: uppercase; } + .blockquote { margin-bottom: 1rem; font-size: 1.25rem; } + .blockquote-footer { display: block; - font-size: 80%; + font-size: 0.875em; color: #6c757d; } .blockquote-footer::before { - content: "\2014\00A0"; + content: "— "; } + .img-fluid { max-width: 100%; height: auto; } + .img-thumbnail { padding: 0.25rem; background-color: #fff; @@ -430,17 +514,21 @@ mark { max-width: 100%; height: auto; } + .figure { display: inline-block; } + .figure-img { margin-bottom: 0.5rem; line-height: 1; } + .figure-caption { font-size: 90%; color: #6c757d; } + code { font-size: 87.5%; color: #e83e8c; @@ -449,10 +537,11 @@ code { a > code { color: inherit; } + kbd { padding: 0.2rem 0.4rem; font-size: 87.5%; - color: #fff; + color: #ffffff; background-color: #212529; border-radius: 1rem; } @@ -461,6 +550,7 @@ kbd kbd { font-size: 100%; font-weight: 600; } + pre { display: block; font-size: 87.5%; @@ -471,75 +561,52 @@ pre code { color: inherit; word-break: normal; } + .pre-scrollable { max-height: 340px; overflow-y: scroll; } -.container { - width: 100%; - padding-right: 15px; - padding-left: 15px; - margin-right: auto; - margin-left: auto; -} -@media (min-width: 576px) { - .container { - max-width: 540px; - } -} -@media (min-width: 768px) { - .container { - max-width: 720px; - } -} -@media (min-width: 992px) { - .container { - max-width: 960px; - } -} -@media (min-width: 1200px) { - .container { - max-width: 1140px; - } -} + +.container, .container-fluid, +.container-xl, .container-lg, .container-md, -.container-sm, -.container-xl { +.container-sm { width: 100%; padding-right: 15px; padding-left: 15px; margin-right: auto; margin-left: auto; } + @media (min-width: 576px) { - .container, - .container-sm { + .container-sm, + .container { max-width: 540px; } } @media (min-width: 768px) { - .container, .container-md, - .container-sm { + .container-sm, + .container { max-width: 720px; } } @media (min-width: 992px) { - .container, - .container-lg, - .container-md, - .container-sm { - max-width: 960px; - } -} -@media (min-width: 1200px) { - .container, .container-lg, .container-md, .container-sm, - .container-xl { + .container { + max-width: 960px; + } +} +@media (min-width: 1200px) { + .container-xl, + .container-lg, + .container-md, + .container-sm, + .container { max-width: 1140px; } } @@ -549,6 +616,7 @@ pre code { margin-right: -15px; margin-left: -15px; } + .no-gutters { margin-right: 0; margin-left: 0; @@ -558,247 +626,293 @@ pre code { padding-right: 0; padding-left: 0; } -.col, -.col-1, -.col-10, -.col-11, -.col-12, -.col-2, -.col-3, -.col-4, -.col-5, -.col-6, -.col-7, -.col-8, -.col-9, -.col-auto, -.col-lg, -.col-lg-1, -.col-lg-10, -.col-lg-11, -.col-lg-12, -.col-lg-2, -.col-lg-3, -.col-lg-4, -.col-lg-5, -.col-lg-6, -.col-lg-7, -.col-lg-8, -.col-lg-9, -.col-lg-auto, -.col-md, -.col-md-1, -.col-md-10, -.col-md-11, -.col-md-12, -.col-md-2, -.col-md-3, -.col-md-4, -.col-md-5, -.col-md-6, -.col-md-7, -.col-md-8, -.col-md-9, -.col-md-auto, -.col-sm, -.col-sm-1, -.col-sm-10, -.col-sm-11, -.col-sm-12, -.col-sm-2, -.col-sm-3, -.col-sm-4, -.col-sm-5, -.col-sm-6, -.col-sm-7, -.col-sm-8, -.col-sm-9, -.col-sm-auto, + .col-xl, -.col-xl-1, -.col-xl-10, -.col-xl-11, +.col-xl-auto, .col-xl-12, -.col-xl-2, -.col-xl-3, -.col-xl-4, -.col-xl-5, -.col-xl-6, -.col-xl-7, -.col-xl-8, +.col-xl-11, +.col-xl-10, .col-xl-9, -.col-xl-auto { +.col-xl-8, +.col-xl-7, +.col-xl-6, +.col-xl-5, +.col-xl-4, +.col-xl-3, +.col-xl-2, +.col-xl-1, +.col-lg, +.col-lg-auto, +.col-lg-12, +.col-lg-11, +.col-lg-10, +.col-lg-9, +.col-lg-8, +.col-lg-7, +.col-lg-6, +.col-lg-5, +.col-lg-4, +.col-lg-3, +.col-lg-2, +.col-lg-1, +.col-md, +.col-md-auto, +.col-md-12, +.col-md-11, +.col-md-10, +.col-md-9, +.col-md-8, +.col-md-7, +.col-md-6, +.col-md-5, +.col-md-4, +.col-md-3, +.col-md-2, +.col-md-1, +.col-sm, +.col-sm-auto, +.col-sm-12, +.col-sm-11, +.col-sm-10, +.col-sm-9, +.col-sm-8, +.col-sm-7, +.col-sm-6, +.col-sm-5, +.col-sm-4, +.col-sm-3, +.col-sm-2, +.col-sm-1, +.col, +.col-auto, +.col-12, +.col-11, +.col-10, +.col-9, +.col-8, +.col-7, +.col-6, +.col-5, +.col-4, +.col-3, +.col-2, +.col-1 { position: relative; width: 100%; padding-right: 15px; padding-left: 15px; } + .col { flex-basis: 0; flex-grow: 1; - min-width: 0; max-width: 100%; } + .row-cols-1 > * { flex: 0 0 100%; max-width: 100%; } + .row-cols-2 > * { flex: 0 0 50%; max-width: 50%; } + .row-cols-3 > * { - flex: 0 0 33.33333%; - max-width: 33.33333%; + flex: 0 0 33.3333333333%; + max-width: 33.3333333333%; } + .row-cols-4 > * { flex: 0 0 25%; max-width: 25%; } + .row-cols-5 > * { flex: 0 0 20%; max-width: 20%; } + .row-cols-6 > * { - flex: 0 0 16.66667%; - max-width: 16.66667%; + flex: 0 0 16.6666666667%; + max-width: 16.6666666667%; } + .col-auto { flex: 0 0 auto; width: auto; max-width: 100%; } + .col-1 { - flex: 0 0 8.33333%; - max-width: 8.33333%; + flex: 0 0 8.33333333%; + max-width: 8.33333333%; } + .col-2 { - flex: 0 0 16.66667%; - max-width: 16.66667%; + flex: 0 0 16.66666667%; + max-width: 16.66666667%; } + .col-3 { flex: 0 0 25%; max-width: 25%; } + .col-4 { - flex: 0 0 33.33333%; - max-width: 33.33333%; + flex: 0 0 33.33333333%; + max-width: 33.33333333%; } + .col-5 { - flex: 0 0 41.66667%; - max-width: 41.66667%; + flex: 0 0 41.66666667%; + max-width: 41.66666667%; } + .col-6 { flex: 0 0 50%; max-width: 50%; } + .col-7 { - flex: 0 0 58.33333%; - max-width: 58.33333%; + flex: 0 0 58.33333333%; + max-width: 58.33333333%; } + .col-8 { - flex: 0 0 66.66667%; - max-width: 66.66667%; + flex: 0 0 66.66666667%; + max-width: 66.66666667%; } + .col-9 { flex: 0 0 75%; max-width: 75%; } + .col-10 { - flex: 0 0 83.33333%; - max-width: 83.33333%; + flex: 0 0 83.33333333%; + max-width: 83.33333333%; } + .col-11 { - flex: 0 0 91.66667%; - max-width: 91.66667%; + flex: 0 0 91.66666667%; + max-width: 91.66666667%; } + .col-12 { flex: 0 0 100%; max-width: 100%; } + .order-first { order: -1; } + .order-last { order: 13; } + .order-0 { order: 0; } + .order-1 { order: 1; } + .order-2 { order: 2; } + .order-3 { order: 3; } + .order-4 { order: 4; } + .order-5 { order: 5; } + .order-6 { order: 6; } + .order-7 { order: 7; } + .order-8 { order: 8; } + .order-9 { order: 9; } + .order-10 { order: 10; } + .order-11 { order: 11; } + .order-12 { order: 12; } + .offset-1 { - margin-left: 8.33333%; + margin-left: 8.33333333%; } + .offset-2 { - margin-left: 16.66667%; + margin-left: 16.66666667%; } + .offset-3 { margin-left: 25%; } + .offset-4 { - margin-left: 33.33333%; + margin-left: 33.33333333%; } + .offset-5 { - margin-left: 41.66667%; + margin-left: 41.66666667%; } + .offset-6 { margin-left: 50%; } + .offset-7 { - margin-left: 58.33333%; + margin-left: 58.33333333%; } + .offset-8 { - margin-left: 66.66667%; + margin-left: 66.66666667%; } + .offset-9 { margin-left: 75%; } + .offset-10 { - margin-left: 83.33333%; + margin-left: 83.33333333%; } + .offset-11 { - margin-left: 91.66667%; + margin-left: 91.66666667%; } + @media (min-width: 576px) { .col-sm { flex-basis: 0; flex-grow: 1; - min-width: 0; max-width: 100%; } .row-cols-sm-1 > * { @@ -810,8 +924,8 @@ pre code { max-width: 50%; } .row-cols-sm-3 > * { - flex: 0 0 33.33333%; - max-width: 33.33333%; + flex: 0 0 33.3333333333%; + max-width: 33.3333333333%; } .row-cols-sm-4 > * { flex: 0 0 25%; @@ -822,8 +936,8 @@ pre code { max-width: 20%; } .row-cols-sm-6 > * { - flex: 0 0 16.66667%; - max-width: 16.66667%; + flex: 0 0 16.6666666667%; + max-width: 16.6666666667%; } .col-sm-auto { flex: 0 0 auto; @@ -831,48 +945,48 @@ pre code { max-width: 100%; } .col-sm-1 { - flex: 0 0 8.33333%; - max-width: 8.33333%; + flex: 0 0 8.33333333%; + max-width: 8.33333333%; } .col-sm-2 { - flex: 0 0 16.66667%; - max-width: 16.66667%; + flex: 0 0 16.66666667%; + max-width: 16.66666667%; } .col-sm-3 { flex: 0 0 25%; max-width: 25%; } .col-sm-4 { - flex: 0 0 33.33333%; - max-width: 33.33333%; + flex: 0 0 33.33333333%; + max-width: 33.33333333%; } .col-sm-5 { - flex: 0 0 41.66667%; - max-width: 41.66667%; + flex: 0 0 41.66666667%; + max-width: 41.66666667%; } .col-sm-6 { flex: 0 0 50%; max-width: 50%; } .col-sm-7 { - flex: 0 0 58.33333%; - max-width: 58.33333%; + flex: 0 0 58.33333333%; + max-width: 58.33333333%; } .col-sm-8 { - flex: 0 0 66.66667%; - max-width: 66.66667%; + flex: 0 0 66.66666667%; + max-width: 66.66666667%; } .col-sm-9 { flex: 0 0 75%; max-width: 75%; } .col-sm-10 { - flex: 0 0 83.33333%; - max-width: 83.33333%; + flex: 0 0 83.33333333%; + max-width: 83.33333333%; } .col-sm-11 { - flex: 0 0 91.66667%; - max-width: 91.66667%; + flex: 0 0 91.66666667%; + max-width: 91.66666667%; } .col-sm-12 { flex: 0 0 100%; @@ -927,44 +1041,43 @@ pre code { margin-left: 0; } .offset-sm-1 { - margin-left: 8.33333%; + margin-left: 8.33333333%; } .offset-sm-2 { - margin-left: 16.66667%; + margin-left: 16.66666667%; } .offset-sm-3 { margin-left: 25%; } .offset-sm-4 { - margin-left: 33.33333%; + margin-left: 33.33333333%; } .offset-sm-5 { - margin-left: 41.66667%; + margin-left: 41.66666667%; } .offset-sm-6 { margin-left: 50%; } .offset-sm-7 { - margin-left: 58.33333%; + margin-left: 58.33333333%; } .offset-sm-8 { - margin-left: 66.66667%; + margin-left: 66.66666667%; } .offset-sm-9 { margin-left: 75%; } .offset-sm-10 { - margin-left: 83.33333%; + margin-left: 83.33333333%; } .offset-sm-11 { - margin-left: 91.66667%; + margin-left: 91.66666667%; } } @media (min-width: 768px) { .col-md { flex-basis: 0; flex-grow: 1; - min-width: 0; max-width: 100%; } .row-cols-md-1 > * { @@ -976,8 +1089,8 @@ pre code { max-width: 50%; } .row-cols-md-3 > * { - flex: 0 0 33.33333%; - max-width: 33.33333%; + flex: 0 0 33.3333333333%; + max-width: 33.3333333333%; } .row-cols-md-4 > * { flex: 0 0 25%; @@ -988,8 +1101,8 @@ pre code { max-width: 20%; } .row-cols-md-6 > * { - flex: 0 0 16.66667%; - max-width: 16.66667%; + flex: 0 0 16.6666666667%; + max-width: 16.6666666667%; } .col-md-auto { flex: 0 0 auto; @@ -997,48 +1110,48 @@ pre code { max-width: 100%; } .col-md-1 { - flex: 0 0 8.33333%; - max-width: 8.33333%; + flex: 0 0 8.33333333%; + max-width: 8.33333333%; } .col-md-2 { - flex: 0 0 16.66667%; - max-width: 16.66667%; + flex: 0 0 16.66666667%; + max-width: 16.66666667%; } .col-md-3 { flex: 0 0 25%; max-width: 25%; } .col-md-4 { - flex: 0 0 33.33333%; - max-width: 33.33333%; + flex: 0 0 33.33333333%; + max-width: 33.33333333%; } .col-md-5 { - flex: 0 0 41.66667%; - max-width: 41.66667%; + flex: 0 0 41.66666667%; + max-width: 41.66666667%; } .col-md-6 { flex: 0 0 50%; max-width: 50%; } .col-md-7 { - flex: 0 0 58.33333%; - max-width: 58.33333%; + flex: 0 0 58.33333333%; + max-width: 58.33333333%; } .col-md-8 { - flex: 0 0 66.66667%; - max-width: 66.66667%; + flex: 0 0 66.66666667%; + max-width: 66.66666667%; } .col-md-9 { flex: 0 0 75%; max-width: 75%; } .col-md-10 { - flex: 0 0 83.33333%; - max-width: 83.33333%; + flex: 0 0 83.33333333%; + max-width: 83.33333333%; } .col-md-11 { - flex: 0 0 91.66667%; - max-width: 91.66667%; + flex: 0 0 91.66666667%; + max-width: 91.66666667%; } .col-md-12 { flex: 0 0 100%; @@ -1093,44 +1206,43 @@ pre code { margin-left: 0; } .offset-md-1 { - margin-left: 8.33333%; + margin-left: 8.33333333%; } .offset-md-2 { - margin-left: 16.66667%; + margin-left: 16.66666667%; } .offset-md-3 { margin-left: 25%; } .offset-md-4 { - margin-left: 33.33333%; + margin-left: 33.33333333%; } .offset-md-5 { - margin-left: 41.66667%; + margin-left: 41.66666667%; } .offset-md-6 { margin-left: 50%; } .offset-md-7 { - margin-left: 58.33333%; + margin-left: 58.33333333%; } .offset-md-8 { - margin-left: 66.66667%; + margin-left: 66.66666667%; } .offset-md-9 { margin-left: 75%; } .offset-md-10 { - margin-left: 83.33333%; + margin-left: 83.33333333%; } .offset-md-11 { - margin-left: 91.66667%; + margin-left: 91.66666667%; } } @media (min-width: 992px) { .col-lg { flex-basis: 0; flex-grow: 1; - min-width: 0; max-width: 100%; } .row-cols-lg-1 > * { @@ -1142,8 +1254,8 @@ pre code { max-width: 50%; } .row-cols-lg-3 > * { - flex: 0 0 33.33333%; - max-width: 33.33333%; + flex: 0 0 33.3333333333%; + max-width: 33.3333333333%; } .row-cols-lg-4 > * { flex: 0 0 25%; @@ -1154,8 +1266,8 @@ pre code { max-width: 20%; } .row-cols-lg-6 > * { - flex: 0 0 16.66667%; - max-width: 16.66667%; + flex: 0 0 16.6666666667%; + max-width: 16.6666666667%; } .col-lg-auto { flex: 0 0 auto; @@ -1163,48 +1275,48 @@ pre code { max-width: 100%; } .col-lg-1 { - flex: 0 0 8.33333%; - max-width: 8.33333%; + flex: 0 0 8.33333333%; + max-width: 8.33333333%; } .col-lg-2 { - flex: 0 0 16.66667%; - max-width: 16.66667%; + flex: 0 0 16.66666667%; + max-width: 16.66666667%; } .col-lg-3 { flex: 0 0 25%; max-width: 25%; } .col-lg-4 { - flex: 0 0 33.33333%; - max-width: 33.33333%; + flex: 0 0 33.33333333%; + max-width: 33.33333333%; } .col-lg-5 { - flex: 0 0 41.66667%; - max-width: 41.66667%; + flex: 0 0 41.66666667%; + max-width: 41.66666667%; } .col-lg-6 { flex: 0 0 50%; max-width: 50%; } .col-lg-7 { - flex: 0 0 58.33333%; - max-width: 58.33333%; + flex: 0 0 58.33333333%; + max-width: 58.33333333%; } .col-lg-8 { - flex: 0 0 66.66667%; - max-width: 66.66667%; + flex: 0 0 66.66666667%; + max-width: 66.66666667%; } .col-lg-9 { flex: 0 0 75%; max-width: 75%; } .col-lg-10 { - flex: 0 0 83.33333%; - max-width: 83.33333%; + flex: 0 0 83.33333333%; + max-width: 83.33333333%; } .col-lg-11 { - flex: 0 0 91.66667%; - max-width: 91.66667%; + flex: 0 0 91.66666667%; + max-width: 91.66666667%; } .col-lg-12 { flex: 0 0 100%; @@ -1259,44 +1371,43 @@ pre code { margin-left: 0; } .offset-lg-1 { - margin-left: 8.33333%; + margin-left: 8.33333333%; } .offset-lg-2 { - margin-left: 16.66667%; + margin-left: 16.66666667%; } .offset-lg-3 { margin-left: 25%; } .offset-lg-4 { - margin-left: 33.33333%; + margin-left: 33.33333333%; } .offset-lg-5 { - margin-left: 41.66667%; + margin-left: 41.66666667%; } .offset-lg-6 { margin-left: 50%; } .offset-lg-7 { - margin-left: 58.33333%; + margin-left: 58.33333333%; } .offset-lg-8 { - margin-left: 66.66667%; + margin-left: 66.66666667%; } .offset-lg-9 { margin-left: 75%; } .offset-lg-10 { - margin-left: 83.33333%; + margin-left: 83.33333333%; } .offset-lg-11 { - margin-left: 91.66667%; + margin-left: 91.66666667%; } } @media (min-width: 1200px) { .col-xl { flex-basis: 0; flex-grow: 1; - min-width: 0; max-width: 100%; } .row-cols-xl-1 > * { @@ -1308,8 +1419,8 @@ pre code { max-width: 50%; } .row-cols-xl-3 > * { - flex: 0 0 33.33333%; - max-width: 33.33333%; + flex: 0 0 33.3333333333%; + max-width: 33.3333333333%; } .row-cols-xl-4 > * { flex: 0 0 25%; @@ -1320,8 +1431,8 @@ pre code { max-width: 20%; } .row-cols-xl-6 > * { - flex: 0 0 16.66667%; - max-width: 16.66667%; + flex: 0 0 16.6666666667%; + max-width: 16.6666666667%; } .col-xl-auto { flex: 0 0 auto; @@ -1329,48 +1440,48 @@ pre code { max-width: 100%; } .col-xl-1 { - flex: 0 0 8.33333%; - max-width: 8.33333%; + flex: 0 0 8.33333333%; + max-width: 8.33333333%; } .col-xl-2 { - flex: 0 0 16.66667%; - max-width: 16.66667%; + flex: 0 0 16.66666667%; + max-width: 16.66666667%; } .col-xl-3 { flex: 0 0 25%; max-width: 25%; } .col-xl-4 { - flex: 0 0 33.33333%; - max-width: 33.33333%; + flex: 0 0 33.33333333%; + max-width: 33.33333333%; } .col-xl-5 { - flex: 0 0 41.66667%; - max-width: 41.66667%; + flex: 0 0 41.66666667%; + max-width: 41.66666667%; } .col-xl-6 { flex: 0 0 50%; max-width: 50%; } .col-xl-7 { - flex: 0 0 58.33333%; - max-width: 58.33333%; + flex: 0 0 58.33333333%; + max-width: 58.33333333%; } .col-xl-8 { - flex: 0 0 66.66667%; - max-width: 66.66667%; + flex: 0 0 66.66666667%; + max-width: 66.66666667%; } .col-xl-9 { flex: 0 0 75%; max-width: 75%; } .col-xl-10 { - flex: 0 0 83.33333%; - max-width: 83.33333%; + flex: 0 0 83.33333333%; + max-width: 83.33333333%; } .col-xl-11 { - flex: 0 0 91.66667%; - max-width: 91.66667%; + flex: 0 0 91.66666667%; + max-width: 91.66666667%; } .col-xl-12 { flex: 0 0 100%; @@ -1425,37 +1536,37 @@ pre code { margin-left: 0; } .offset-xl-1 { - margin-left: 8.33333%; + margin-left: 8.33333333%; } .offset-xl-2 { - margin-left: 16.66667%; + margin-left: 16.66666667%; } .offset-xl-3 { margin-left: 25%; } .offset-xl-4 { - margin-left: 33.33333%; + margin-left: 33.33333333%; } .offset-xl-5 { - margin-left: 41.66667%; + margin-left: 41.66666667%; } .offset-xl-6 { margin-left: 50%; } .offset-xl-7 { - margin-left: 58.33333%; + margin-left: 58.33333333%; } .offset-xl-8 { - margin-left: 66.66667%; + margin-left: 66.66666667%; } .offset-xl-9 { margin-left: 75%; } .offset-xl-10 { - margin-left: 83.33333%; + margin-left: 83.33333333%; } .offset-xl-11 { - margin-left: 91.66667%; + margin-left: 91.66666667%; } } .table { @@ -1463,8 +1574,8 @@ pre code { margin-bottom: 1rem; color: #495057; } -.table td, -.table th { +.table th, +.table td { padding: 0.75rem; vertical-align: top; border-top: 1px solid #495057; @@ -1476,45 +1587,52 @@ pre code { .table tbody + tbody { border-top: 2px solid #495057; } -.table-sm td, -.table-sm th { + +.table-sm th, +.table-sm td { padding: 0.3rem; } + .table-bordered { border: 1px solid #495057; } -.table-bordered td, -.table-bordered th { +.table-bordered th, +.table-bordered td { border: 1px solid #495057; } -.table-bordered thead td, -.table-bordered thead th { +.table-bordered thead th, +.table-bordered thead td { border-bottom-width: 2px; } -.table-borderless tbody + tbody, -.table-borderless td, + .table-borderless th, -.table-borderless thead th { +.table-borderless td, +.table-borderless thead th, +.table-borderless tbody + tbody { border: 0; } + .table-striped tbody tr:nth-of-type(odd) { background-color: rgba(34, 34, 34, 0.05); } + .table-hover tbody tr:hover { color: #495057; background-color: rgba(34, 34, 34, 0.075); } + .table-primary, -.table-primary > td, -.table-primary > th { +.table-primary > th, +.table-primary > td { background-color: #fbd4c0; } -.table-primary tbody + tbody, -.table-primary td, .table-primary th, -.table-primary thead th { +.table-primary td, +.table-primary thead th, +.table-primary tbody + tbody { border-color: #f8ae8a; } + .table-hover .table-primary:hover { background-color: #f9c4a8; } @@ -1522,17 +1640,19 @@ pre code { .table-hover .table-primary:hover > th { background-color: #f9c4a8; } + .table-secondary, -.table-secondary > td, -.table-secondary > th { +.table-secondary > th, +.table-secondary > td { background-color: #b8f0cf; } -.table-secondary tbody + tbody, -.table-secondary td, .table-secondary th, -.table-secondary thead th { +.table-secondary td, +.table-secondary thead th, +.table-secondary tbody + tbody { border-color: #7ae2a6; } + .table-hover .table-secondary:hover { background-color: #a3ecc1; } @@ -1540,17 +1660,19 @@ pre code { .table-hover .table-secondary:hover > th { background-color: #a3ecc1; } + .table-success, -.table-success > td, -.table-success > th { +.table-success > th, +.table-success > td { background-color: #d4bcfb; } -.table-success tbody + tbody, -.table-success td, .table-success th, -.table-success thead th { +.table-success td, +.table-success thead th, +.table-success tbody + tbody { border-color: #af83f8; } + .table-hover .table-success:hover { background-color: #c5a4fa; } @@ -1558,17 +1680,19 @@ pre code { .table-hover .table-success:hover > th { background-color: #c5a4fa; } + .table-info, -.table-info > td, -.table-info > th { +.table-info > th, +.table-info > td { background-color: #b8daff; } -.table-info tbody + tbody, -.table-info td, .table-info th, -.table-info thead th { +.table-info td, +.table-info thead th, +.table-info tbody + tbody { border-color: #7abaff; } + .table-hover .table-info:hover { background-color: #9fcdff; } @@ -1576,17 +1700,19 @@ pre code { .table-hover .table-info:hover > th { background-color: #9fcdff; } + .table-warning, -.table-warning > td, -.table-warning > th { +.table-warning > th, +.table-warning > td { background-color: #ffeeba; } -.table-warning tbody + tbody, -.table-warning td, .table-warning th, -.table-warning thead th { +.table-warning td, +.table-warning thead th, +.table-warning tbody + tbody { border-color: #ffdf7e; } + .table-hover .table-warning:hover { background-color: #ffe8a1; } @@ -1594,17 +1720,19 @@ pre code { .table-hover .table-warning:hover > th { background-color: #ffe8a1; } + .table-danger, -.table-danger > td, -.table-danger > th { +.table-danger > th, +.table-danger > td { background-color: #ddc6ba; } -.table-danger tbody + tbody, -.table-danger td, .table-danger th, -.table-danger thead th { - border-color: #c1957f; +.table-danger td, +.table-danger thead th, +.table-danger tbody + tbody { + border-color: #c1947f; } + .table-hover .table-danger:hover { background-color: #d5b8a9; } @@ -1612,17 +1740,19 @@ pre code { .table-hover .table-danger:hover > th { background-color: #d5b8a9; } + .table-light, -.table-light > td, -.table-light > th { +.table-light > th, +.table-light > td { background-color: #fdfdfe; } -.table-light tbody + tbody, -.table-light td, .table-light th, -.table-light thead th { +.table-light td, +.table-light thead th, +.table-light tbody + tbody { border-color: #fbfcfc; } + .table-hover .table-light:hover { background-color: #ececf6; } @@ -1630,17 +1760,19 @@ pre code { .table-hover .table-light:hover > th { background-color: #ececf6; } + .table-dark, -.table-dark > td, -.table-dark > th { +.table-dark > th, +.table-dark > td { background-color: #c6c8ca; } -.table-dark tbody + tbody, -.table-dark td, .table-dark th, -.table-dark thead th { +.table-dark td, +.table-dark thead th, +.table-dark tbody + tbody { border-color: #95999c; } + .table-hover .table-dark:hover { background-color: #b9bbbe; } @@ -1648,11 +1780,13 @@ pre code { .table-hover .table-dark:hover > th { background-color: #b9bbbe; } + .table-active, -.table-active > td, -.table-active > th { +.table-active > th, +.table-active > td { background-color: rgba(34, 34, 34, 0.075); } + .table-hover .table-active:hover { background-color: rgba(21, 21, 21, 0.075); } @@ -1660,8 +1794,9 @@ pre code { .table-hover .table-active:hover > th { background-color: rgba(21, 21, 21, 0.075); } + .table .thead-dark th { - color: #fff; + color: #ffffff; background-color: #343a40; border-color: #454d55; } @@ -1670,12 +1805,13 @@ pre code { background-color: #e9ecef; border-color: #495057; } + .table-dark { - color: #fff; + color: #ffffff; background-color: #343a40; } -.table-dark td, .table-dark th, +.table-dark td, .table-dark thead th { border-color: #454d55; } @@ -1686,9 +1822,10 @@ pre code { background-color: rgba(255, 255, 255, 0.05); } .table-dark.table-hover tbody tr:hover { - color: #fff; + color: #ffffff; background-color: rgba(255, 255, 255, 0.075); } + @media (max-width: 575.98px) { .table-responsive-sm { display: block; @@ -1742,6 +1879,7 @@ pre code { .table-responsive > .table-bordered { border: 0; } + .form-control { display: block; width: 100%; @@ -1751,7 +1889,7 @@ pre code { font-weight: 400; line-height: 1.5; color: #495057; - background-color: #fff; + background-color: #ffffff; background-clip: padding-box; border: 1px solid #ced4da; border-radius: 0.5rem; @@ -1766,13 +1904,9 @@ pre code { background-color: transparent; border: 0; } -.form-control:-moz-focusring { - color: transparent; - text-shadow: 0 0 0 #495057; -} .form-control:focus { color: #495057; - background-color: #fff; + background-color: #ffffff; border-color: #f8b796; outline: 0; box-shadow: 0 0 0 0.2rem rgba(241, 100, 30, 0.75); @@ -1786,21 +1920,29 @@ pre code { background-color: #e9ecef; opacity: 1; } + input[type="date"].form-control, +input[type="time"].form-control, input[type="datetime-local"].form-control, -input[type="month"].form-control, -input[type="time"].form-control { +input[type="month"].form-control { appearance: none; } + +select.form-control:-moz-focusring { + color: transparent; + text-shadow: 0 0 0 #495057; +} select.form-control:focus::-ms-value { color: #495057; - background-color: #fff; + background-color: #ffffff; } + .form-control-file, .form-control-range { display: block; width: 100%; } + .col-form-label { padding-top: calc(0.375rem + 1px); padding-bottom: calc(0.375rem + 1px); @@ -1808,18 +1950,21 @@ select.form-control:focus::-ms-value { font-size: inherit; line-height: 1.5; } + .col-form-label-lg { padding-top: calc(0.5rem + 1px); padding-bottom: calc(0.5rem + 1px); font-size: 1.25rem; line-height: 1.5; } + .col-form-label-sm { padding-top: calc(0.25rem + 1px); padding-bottom: calc(0.25rem + 1px); font-size: 0.875rem; line-height: 1.5; } + .form-control-plaintext { display: block; width: 100%; @@ -1832,11 +1977,12 @@ select.form-control:focus::-ms-value { border: solid transparent; border-width: 1px 0; } -.form-control-plaintext.form-control-lg, -.form-control-plaintext.form-control-sm { +.form-control-plaintext.form-control-sm, +.form-control-plaintext.form-control-lg { padding-right: 0; padding-left: 0; } + .form-control-sm { height: calc(1.5em + 0.5rem + 2px); padding: 0.25rem 0.5rem; @@ -1844,6 +1990,7 @@ select.form-control:focus::-ms-value { line-height: 1.5; border-radius: 1rem; } + .form-control-lg { height: calc(1.5em + 1rem + 2px); padding: 0.5rem 1rem; @@ -1851,20 +1998,25 @@ select.form-control:focus::-ms-value { line-height: 1.5; border-radius: 0.5rem; } -select.form-control[multiple], -select.form-control[size] { + +select.form-control[size], +select.form-control[multiple] { height: auto; } + textarea.form-control { height: auto; } + .form-group { margin-bottom: 1rem; } + .form-text { display: block; margin-top: 0.25rem; } + .form-row { display: flex; flex-wrap: wrap; @@ -1876,23 +2028,27 @@ textarea.form-control { padding-right: 5px; padding-left: 5px; } + .form-check { position: relative; display: block; padding-left: 1.25rem; } + .form-check-input { position: absolute; margin-top: 0.3rem; margin-left: -1.25rem; } -.form-check-input:disabled ~ .form-check-label, -.form-check-input[disabled] ~ .form-check-label { +.form-check-input[disabled] ~ .form-check-label, +.form-check-input:disabled ~ .form-check-label { color: #6c757d; } + .form-check-label { margin-bottom: 0; } + .form-check-inline { display: inline-flex; align-items: center; @@ -1905,16 +2061,19 @@ textarea.form-control { margin-right: 0.3125rem; margin-left: 0; } + .valid-feedback { display: none; width: 100%; margin-top: 0.25rem; - font-size: 80%; - color: #007bff; + font-size: 0.875em; + color: #02bdc2; } + .valid-tooltip { position: absolute; top: 100%; + left: 0; z-index: 5; display: none; max-width: 100%; @@ -1922,108 +2081,129 @@ textarea.form-control { margin-top: 0.1rem; font-size: 0.875rem; line-height: 1.5; - color: #fff; - background-color: rgba(0, 123, 255, 0.9); + color: #ffffff; + background-color: rgba(2, 189, 194, 0.9); border-radius: 0.5rem; } -.is-valid ~ .valid-feedback, -.is-valid ~ .valid-tooltip, +.form-row > .col > .valid-tooltip, +.form-row > [class*="col-"] > .valid-tooltip { + left: 5px; +} + .was-validated :valid ~ .valid-feedback, -.was-validated :valid ~ .valid-tooltip { +.was-validated :valid ~ .valid-tooltip, +.is-valid ~ .valid-feedback, +.is-valid ~ .valid-tooltip { display: block; } -.form-control.is-valid, -.was-validated .form-control:valid { - border-color: #007bff; - padding-right: calc(1.5em + 0.75rem); - background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath fill='%23007bff' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e"); + +.was-validated .form-control:valid, +.form-control.is-valid { + border-color: #02bdc2; + padding-right: calc(1.5em + 0.75rem) !important; + background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath fill='%2302bdc2' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e"); background-repeat: no-repeat; background-position: right calc(0.375em + 0.1875rem) center; background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem); } -.form-control.is-valid:focus, -.was-validated .form-control:valid:focus { - border-color: #007bff; - box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25); +.was-validated .form-control:valid:focus, +.form-control.is-valid:focus { + border-color: #02bdc2; + box-shadow: 0 0 0 0.2rem rgba(2, 189, 194, 0.25); } + +.was-validated select.form-control:valid, +select.form-control.is-valid { + padding-right: 3rem !important; + background-position: right 1.5rem center; +} + .was-validated textarea.form-control:valid, textarea.form-control.is-valid { padding-right: calc(1.5em + 0.75rem); background-position: top calc(0.375em + 0.1875rem) right calc(0.375em + 0.1875rem); } -.custom-select.is-valid, -.was-validated .custom-select:valid { - border-color: #007bff; - padding-right: calc(0.75em + 2.3125rem); + +.was-validated .custom-select:valid, +.custom-select.is-valid { + border-color: #02bdc2; + padding-right: calc(0.75em + 2.3125rem) !important; background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='4' height='5' viewBox='0 0 4 5'%3e%3cpath fill='%23343a40' d='M2 0L0 2h4zm0 5L0 3h4z'/%3e%3c/svg%3e") - no-repeat right 0.75rem center/8px 10px, - url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath fill='%23007bff' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e") - #fff no-repeat center right 1.75rem / calc(0.75em + 0.375rem) - calc(0.75em + 0.375rem); + right 0.75rem center/8px 10px no-repeat, + #ffffff + url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath fill='%2302bdc2' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e") + center right 1.75rem / calc(0.75em + 0.375rem) calc(0.75em + 0.375rem) + no-repeat; } -.custom-select.is-valid:focus, -.was-validated .custom-select:valid:focus { - border-color: #007bff; - box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25); +.was-validated .custom-select:valid:focus, +.custom-select.is-valid:focus { + border-color: #02bdc2; + box-shadow: 0 0 0 0.2rem rgba(2, 189, 194, 0.25); } -.form-check-input.is-valid ~ .form-check-label, -.was-validated .form-check-input:valid ~ .form-check-label { - color: #007bff; + +.was-validated .form-check-input:valid ~ .form-check-label, +.form-check-input.is-valid ~ .form-check-label { + color: #02bdc2; } -.form-check-input.is-valid ~ .valid-feedback, -.form-check-input.is-valid ~ .valid-tooltip, .was-validated .form-check-input:valid ~ .valid-feedback, -.was-validated .form-check-input:valid ~ .valid-tooltip { +.was-validated .form-check-input:valid ~ .valid-tooltip, +.form-check-input.is-valid ~ .valid-feedback, +.form-check-input.is-valid ~ .valid-tooltip { display: block; } -.custom-control-input.is-valid ~ .custom-control-label, -.was-validated .custom-control-input:valid ~ .custom-control-label { - color: #007bff; + +.was-validated .custom-control-input:valid ~ .custom-control-label, +.custom-control-input.is-valid ~ .custom-control-label { + color: #02bdc2; } -.custom-control-input.is-valid ~ .custom-control-label::before, -.was-validated .custom-control-input:valid ~ .custom-control-label::before { - border-color: #007bff; +.was-validated .custom-control-input:valid ~ .custom-control-label::before, +.custom-control-input.is-valid ~ .custom-control-label::before { + border-color: #02bdc2; } -.custom-control-input.is-valid:checked ~ .custom-control-label::before, .was-validated .custom-control-input:valid:checked - ~ .custom-control-label::before { - border-color: #3395ff; - background-color: #3395ff; + ~ .custom-control-label::before, +.custom-control-input.is-valid:checked ~ .custom-control-label::before { + border-color: #03eef4; + background-color: #03eef4; } -.custom-control-input.is-valid:focus ~ .custom-control-label::before, .was-validated .custom-control-input:valid:focus - ~ .custom-control-label::before { - box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25); -} -.custom-control-input.is-valid:focus:not(:checked) ~ .custom-control-label::before, +.custom-control-input.is-valid:focus ~ .custom-control-label::before { + box-shadow: 0 0 0 0.2rem rgba(2, 189, 194, 0.25); +} .was-validated .custom-control-input:valid:focus:not(:checked) + ~ .custom-control-label::before, +.custom-control-input.is-valid:focus:not(:checked) ~ .custom-control-label::before { - border-color: #007bff; + border-color: #02bdc2; } -.custom-file-input.is-valid ~ .custom-file-label, -.was-validated .custom-file-input:valid ~ .custom-file-label { - border-color: #007bff; + +.was-validated .custom-file-input:valid ~ .custom-file-label, +.custom-file-input.is-valid ~ .custom-file-label { + border-color: #02bdc2; } -.custom-file-input.is-valid:focus ~ .custom-file-label, -.was-validated .custom-file-input:valid:focus ~ .custom-file-label { - border-color: #007bff; - box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25); +.was-validated .custom-file-input:valid:focus ~ .custom-file-label, +.custom-file-input.is-valid:focus ~ .custom-file-label { + border-color: #02bdc2; + box-shadow: 0 0 0 0.2rem rgba(2, 189, 194, 0.25); } + .invalid-feedback { display: none; width: 100%; margin-top: 0.25rem; - font-size: 80%; + font-size: 0.875em; color: #873208; } + .invalid-tooltip { position: absolute; top: 100%; + left: 0; z-index: 5; display: none; max-width: 100%; @@ -2031,98 +2211,117 @@ textarea.form-control.is-valid { margin-top: 0.1rem; font-size: 0.875rem; line-height: 1.5; - color: #fff; + color: #ffffff; background-color: rgba(135, 50, 8, 0.9); border-radius: 0.5rem; } -.is-invalid ~ .invalid-feedback, -.is-invalid ~ .invalid-tooltip, +.form-row > .col > .invalid-tooltip, +.form-row > [class*="col-"] > .invalid-tooltip { + left: 5px; +} + .was-validated :invalid ~ .invalid-feedback, -.was-validated :invalid ~ .invalid-tooltip { +.was-validated :invalid ~ .invalid-tooltip, +.is-invalid ~ .invalid-feedback, +.is-invalid ~ .invalid-tooltip { display: block; } -.form-control.is-invalid, -.was-validated .form-control:invalid { + +.was-validated .form-control:invalid, +.form-control.is-invalid { border-color: #873208; - padding-right: calc(1.5em + 0.75rem); + padding-right: calc(1.5em + 0.75rem) !important; background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23873208' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23873208' stroke='none'/%3e%3c/svg%3e"); background-repeat: no-repeat; background-position: right calc(0.375em + 0.1875rem) center; background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem); } -.form-control.is-invalid:focus, -.was-validated .form-control:invalid:focus { +.was-validated .form-control:invalid:focus, +.form-control.is-invalid:focus { border-color: #873208; box-shadow: 0 0 0 0.2rem rgba(135, 50, 8, 0.25); } + +.was-validated select.form-control:invalid, +select.form-control.is-invalid { + padding-right: 3rem !important; + background-position: right 1.5rem center; +} + .was-validated textarea.form-control:invalid, textarea.form-control.is-invalid { padding-right: calc(1.5em + 0.75rem); background-position: top calc(0.375em + 0.1875rem) right calc(0.375em + 0.1875rem); } -.custom-select.is-invalid, -.was-validated .custom-select:invalid { + +.was-validated .custom-select:invalid, +.custom-select.is-invalid { border-color: #873208; - padding-right: calc(0.75em + 2.3125rem); + padding-right: calc(0.75em + 2.3125rem) !important; background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='4' height='5' viewBox='0 0 4 5'%3e%3cpath fill='%23343a40' d='M2 0L0 2h4zm0 5L0 3h4z'/%3e%3c/svg%3e") - no-repeat right 0.75rem center/8px 10px, - url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23873208' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23873208' stroke='none'/%3e%3c/svg%3e") - #fff no-repeat center right 1.75rem / calc(0.75em + 0.375rem) - calc(0.75em + 0.375rem); + right 0.75rem center/8px 10px no-repeat, + #ffffff + url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23873208' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23873208' stroke='none'/%3e%3c/svg%3e") + center right 1.75rem / calc(0.75em + 0.375rem) calc(0.75em + 0.375rem) + no-repeat; } -.custom-select.is-invalid:focus, -.was-validated .custom-select:invalid:focus { +.was-validated .custom-select:invalid:focus, +.custom-select.is-invalid:focus { border-color: #873208; box-shadow: 0 0 0 0.2rem rgba(135, 50, 8, 0.25); } -.form-check-input.is-invalid ~ .form-check-label, -.was-validated .form-check-input:invalid ~ .form-check-label { + +.was-validated .form-check-input:invalid ~ .form-check-label, +.form-check-input.is-invalid ~ .form-check-label { color: #873208; } -.form-check-input.is-invalid ~ .invalid-feedback, -.form-check-input.is-invalid ~ .invalid-tooltip, .was-validated .form-check-input:invalid ~ .invalid-feedback, -.was-validated .form-check-input:invalid ~ .invalid-tooltip { +.was-validated .form-check-input:invalid ~ .invalid-tooltip, +.form-check-input.is-invalid ~ .invalid-feedback, +.form-check-input.is-invalid ~ .invalid-tooltip { display: block; } -.custom-control-input.is-invalid ~ .custom-control-label, -.was-validated .custom-control-input:invalid ~ .custom-control-label { + +.was-validated .custom-control-input:invalid ~ .custom-control-label, +.custom-control-input.is-invalid ~ .custom-control-label { color: #873208; } -.custom-control-input.is-invalid ~ .custom-control-label::before, -.was-validated .custom-control-input:invalid ~ .custom-control-label::before { +.was-validated .custom-control-input:invalid ~ .custom-control-label::before, +.custom-control-input.is-invalid ~ .custom-control-label::before { border-color: #873208; } -.custom-control-input.is-invalid:checked ~ .custom-control-label::before, .was-validated .custom-control-input:invalid:checked - ~ .custom-control-label::before { + ~ .custom-control-label::before, +.custom-control-input.is-invalid:checked ~ .custom-control-label::before { border-color: #b7440b; background-color: #b7440b; } -.custom-control-input.is-invalid:focus ~ .custom-control-label::before, .was-validated .custom-control-input:invalid:focus - ~ .custom-control-label::before { + ~ .custom-control-label::before, +.custom-control-input.is-invalid:focus ~ .custom-control-label::before { box-shadow: 0 0 0 0.2rem rgba(135, 50, 8, 0.25); } -.custom-control-input.is-invalid:focus:not(:checked) - ~ .custom-control-label::before, .was-validated .custom-control-input:invalid:focus:not(:checked) + ~ .custom-control-label::before, +.custom-control-input.is-invalid:focus:not(:checked) ~ .custom-control-label::before { border-color: #873208; } -.custom-file-input.is-invalid ~ .custom-file-label, -.was-validated .custom-file-input:invalid ~ .custom-file-label { + +.was-validated .custom-file-input:invalid ~ .custom-file-label, +.custom-file-input.is-invalid ~ .custom-file-label { border-color: #873208; } -.custom-file-input.is-invalid:focus ~ .custom-file-label, -.was-validated .custom-file-input:invalid:focus ~ .custom-file-label { +.was-validated .custom-file-input:invalid:focus ~ .custom-file-label, +.custom-file-input.is-invalid:focus ~ .custom-file-label { border-color: #873208; box-shadow: 0 0 0 0.2rem rgba(135, 50, 8, 0.25); } + .form-inline { display: flex; flex-flow: row wrap; @@ -2153,8 +2352,8 @@ textarea.form-control.is-invalid { .form-inline .form-control-plaintext { display: inline-block; } - .form-inline .custom-select, - .form-inline .input-group { + .form-inline .input-group, + .form-inline .custom-select { width: auto; } .form-inline .form-check { @@ -2179,6 +2378,7 @@ textarea.form-control.is-invalid { margin-bottom: 0; } } + .btn { display: inline-block; font-weight: 400; @@ -2204,8 +2404,8 @@ textarea.form-control.is-invalid { color: #495057; text-decoration: none; } -.btn.focus, -.btn:focus { +.btn:focus, +.btn.focus { outline: 0; box-shadow: 0 0 0 0.2rem rgba(241, 100, 30, 0.75); } @@ -2220,146 +2420,151 @@ a.btn.disabled, fieldset:disabled a.btn { pointer-events: none; } + .btn-primary { - color: #fff; + color: #ffffff; background-color: #f1641e; border-color: #f1641e; } .btn-primary:hover { - color: #fff; + color: #ffffff; background-color: #db520e; border-color: #cf4d0d; } -.btn-primary.focus, -.btn-primary:focus { - color: #fff; +.btn-primary:focus, +.btn-primary.focus { + color: #ffffff; background-color: #db520e; border-color: #cf4d0d; box-shadow: 0 0 0 0.2rem rgba(243, 123, 64, 0.5); } .btn-primary.disabled, .btn-primary:disabled { - color: #fff; + color: #ffffff; background-color: #f1641e; border-color: #f1641e; } -.btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active, +.btn-primary:not(:disabled):not(.disabled).active, .show > .btn-primary.dropdown-toggle { - color: #fff; + color: #ffffff; background-color: #cf4d0d; border-color: #c3490c; } -.btn-primary:not(:disabled):not(.disabled).active:focus, .btn-primary:not(:disabled):not(.disabled):active:focus, +.btn-primary:not(:disabled):not(.disabled).active:focus, .show > .btn-primary.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem rgba(243, 123, 64, 0.5); } + .btn-secondary { - color: #fff; + color: #ffffff; background-color: #00c853; border-color: #00c853; } .btn-secondary:hover { - color: #fff; + color: #ffffff; background-color: #00a243; border-color: #00953e; } -.btn-secondary.focus, -.btn-secondary:focus { - color: #fff; +.btn-secondary:focus, +.btn-secondary.focus { + color: #ffffff; background-color: #00a243; border-color: #00953e; box-shadow: 0 0 0 0.2rem rgba(38, 208, 109, 0.5); } .btn-secondary.disabled, .btn-secondary:disabled { - color: #fff; + color: #ffffff; background-color: #00c853; border-color: #00c853; } -.btn-secondary:not(:disabled):not(.disabled).active, .btn-secondary:not(:disabled):not(.disabled):active, +.btn-secondary:not(:disabled):not(.disabled).active, .show > .btn-secondary.dropdown-toggle { - color: #fff; + color: #ffffff; background-color: #00953e; border-color: #008839; } -.btn-secondary:not(:disabled):not(.disabled).active:focus, .btn-secondary:not(:disabled):not(.disabled):active:focus, +.btn-secondary:not(:disabled):not(.disabled).active:focus, .show > .btn-secondary.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem rgba(38, 208, 109, 0.5); } + .btn-success { - color: #fff; + color: #ffffff; background-color: #6610f2; border-color: #6610f2; } .btn-success:hover { - color: #fff; + color: #ffffff; background-color: #560bd0; border-color: #510bc4; } -.btn-success.focus, -.btn-success:focus { - color: #fff; +.btn-success:focus, +.btn-success.focus { + color: #ffffff; background-color: #560bd0; border-color: #510bc4; box-shadow: 0 0 0 0.2rem rgba(125, 52, 244, 0.5); } .btn-success.disabled, .btn-success:disabled { - color: #fff; + color: #ffffff; background-color: #6610f2; border-color: #6610f2; } -.btn-success:not(:disabled):not(.disabled).active, .btn-success:not(:disabled):not(.disabled):active, +.btn-success:not(:disabled):not(.disabled).active, .show > .btn-success.dropdown-toggle { - color: #fff; + color: #ffffff; background-color: #510bc4; border-color: #4c0ab8; } -.btn-success:not(:disabled):not(.disabled).active:focus, .btn-success:not(:disabled):not(.disabled):active:focus, +.btn-success:not(:disabled):not(.disabled).active:focus, .show > .btn-success.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem rgba(125, 52, 244, 0.5); } + .btn-info { - color: #fff; + color: #ffffff; background-color: #007bff; border-color: #007bff; } .btn-info:hover { - color: #fff; + color: #ffffff; background-color: #0069d9; border-color: #0062cc; } -.btn-info.focus, -.btn-info:focus { - color: #fff; +.btn-info:focus, +.btn-info.focus { + color: #ffffff; background-color: #0069d9; border-color: #0062cc; box-shadow: 0 0 0 0.2rem rgba(38, 143, 255, 0.5); } .btn-info.disabled, .btn-info:disabled { - color: #fff; + color: #ffffff; background-color: #007bff; border-color: #007bff; } -.btn-info:not(:disabled):not(.disabled).active, .btn-info:not(:disabled):not(.disabled):active, +.btn-info:not(:disabled):not(.disabled).active, .show > .btn-info.dropdown-toggle { - color: #fff; + color: #ffffff; background-color: #0062cc; border-color: #005cbf; } -.btn-info:not(:disabled):not(.disabled).active:focus, .btn-info:not(:disabled):not(.disabled):active:focus, +.btn-info:not(:disabled):not(.disabled).active:focus, .show > .btn-info.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem rgba(38, 143, 255, 0.5); } + .btn-warning { color: #212529; background-color: #ffc107; @@ -2370,8 +2575,8 @@ fieldset:disabled a.btn { background-color: #e0a800; border-color: #d39e00; } -.btn-warning.focus, -.btn-warning:focus { +.btn-warning:focus, +.btn-warning.focus { color: #212529; background-color: #e0a800; border-color: #d39e00; @@ -2383,53 +2588,55 @@ fieldset:disabled a.btn { background-color: #ffc107; border-color: #ffc107; } -.btn-warning:not(:disabled):not(.disabled).active, .btn-warning:not(:disabled):not(.disabled):active, +.btn-warning:not(:disabled):not(.disabled).active, .show > .btn-warning.dropdown-toggle { color: #212529; background-color: #d39e00; border-color: #c69500; } -.btn-warning:not(:disabled):not(.disabled).active:focus, .btn-warning:not(:disabled):not(.disabled):active:focus, +.btn-warning:not(:disabled):not(.disabled).active:focus, .show > .btn-warning.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem rgba(222, 170, 12, 0.5); } + .btn-danger { - color: #fff; + color: #ffffff; background-color: #873208; border-color: #873208; } .btn-danger:hover { - color: #fff; + color: #ffffff; background-color: #632506; border-color: #572105; } -.btn-danger.focus, -.btn-danger:focus { - color: #fff; +.btn-danger:focus, +.btn-danger.focus { + color: #ffffff; background-color: #632506; border-color: #572105; box-shadow: 0 0 0 0.2rem rgba(153, 81, 45, 0.5); } .btn-danger.disabled, .btn-danger:disabled { - color: #fff; + color: #ffffff; background-color: #873208; border-color: #873208; } -.btn-danger:not(:disabled):not(.disabled).active, .btn-danger:not(:disabled):not(.disabled):active, +.btn-danger:not(:disabled):not(.disabled).active, .show > .btn-danger.dropdown-toggle { - color: #fff; + color: #ffffff; background-color: #572105; border-color: #4b1c05; } -.btn-danger:not(:disabled):not(.disabled).active:focus, .btn-danger:not(:disabled):not(.disabled):active:focus, +.btn-danger:not(:disabled):not(.disabled).active:focus, .show > .btn-danger.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem rgba(153, 81, 45, 0.5); } + .btn-light { color: #212529; background-color: #f8f9fa; @@ -2440,8 +2647,8 @@ fieldset:disabled a.btn { background-color: #e2e6ea; border-color: #dae0e5; } -.btn-light.focus, -.btn-light:focus { +.btn-light:focus, +.btn-light.focus { color: #212529; background-color: #e2e6ea; border-color: #dae0e5; @@ -2453,64 +2660,66 @@ fieldset:disabled a.btn { background-color: #f8f9fa; border-color: #f8f9fa; } -.btn-light:not(:disabled):not(.disabled).active, .btn-light:not(:disabled):not(.disabled):active, +.btn-light:not(:disabled):not(.disabled).active, .show > .btn-light.dropdown-toggle { color: #212529; background-color: #dae0e5; border-color: #d3d9df; } -.btn-light:not(:disabled):not(.disabled).active:focus, .btn-light:not(:disabled):not(.disabled):active:focus, +.btn-light:not(:disabled):not(.disabled).active:focus, .show > .btn-light.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem rgba(216, 217, 219, 0.5); } + .btn-dark { - color: #fff; + color: #ffffff; background-color: #343a40; border-color: #343a40; } .btn-dark:hover { - color: #fff; + color: #ffffff; background-color: #23272b; border-color: #1d2124; } -.btn-dark.focus, -.btn-dark:focus { - color: #fff; +.btn-dark:focus, +.btn-dark.focus { + color: #ffffff; background-color: #23272b; border-color: #1d2124; box-shadow: 0 0 0 0.2rem rgba(82, 88, 93, 0.5); } .btn-dark.disabled, .btn-dark:disabled { - color: #fff; + color: #ffffff; background-color: #343a40; border-color: #343a40; } -.btn-dark:not(:disabled):not(.disabled).active, .btn-dark:not(:disabled):not(.disabled):active, +.btn-dark:not(:disabled):not(.disabled).active, .show > .btn-dark.dropdown-toggle { - color: #fff; + color: #ffffff; background-color: #1d2124; border-color: #171a1d; } -.btn-dark:not(:disabled):not(.disabled).active:focus, .btn-dark:not(:disabled):not(.disabled):active:focus, +.btn-dark:not(:disabled):not(.disabled).active:focus, .show > .btn-dark.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem rgba(82, 88, 93, 0.5); } + .btn-outline-primary { color: #f1641e; border-color: #f1641e; } .btn-outline-primary:hover { - color: #fff; + color: #ffffff; background-color: #f1641e; border-color: #f1641e; } -.btn-outline-primary.focus, -.btn-outline-primary:focus { +.btn-outline-primary:focus, +.btn-outline-primary.focus { box-shadow: 0 0 0 0.2rem rgba(241, 100, 30, 0.5); } .btn-outline-primary.disabled, @@ -2518,29 +2727,30 @@ fieldset:disabled a.btn { color: #f1641e; background-color: transparent; } -.btn-outline-primary:not(:disabled):not(.disabled).active, .btn-outline-primary:not(:disabled):not(.disabled):active, +.btn-outline-primary:not(:disabled):not(.disabled).active, .show > .btn-outline-primary.dropdown-toggle { - color: #fff; + color: #ffffff; background-color: #f1641e; border-color: #f1641e; } -.btn-outline-primary:not(:disabled):not(.disabled).active:focus, .btn-outline-primary:not(:disabled):not(.disabled):active:focus, +.btn-outline-primary:not(:disabled):not(.disabled).active:focus, .show > .btn-outline-primary.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem rgba(241, 100, 30, 0.5); } + .btn-outline-secondary { color: #00c853; border-color: #00c853; } .btn-outline-secondary:hover { - color: #fff; + color: #ffffff; background-color: #00c853; border-color: #00c853; } -.btn-outline-secondary.focus, -.btn-outline-secondary:focus { +.btn-outline-secondary:focus, +.btn-outline-secondary.focus { box-shadow: 0 0 0 0.2rem rgba(0, 200, 83, 0.5); } .btn-outline-secondary.disabled, @@ -2548,29 +2758,30 @@ fieldset:disabled a.btn { color: #00c853; background-color: transparent; } -.btn-outline-secondary:not(:disabled):not(.disabled).active, .btn-outline-secondary:not(:disabled):not(.disabled):active, +.btn-outline-secondary:not(:disabled):not(.disabled).active, .show > .btn-outline-secondary.dropdown-toggle { - color: #fff; + color: #ffffff; background-color: #00c853; border-color: #00c853; } -.btn-outline-secondary:not(:disabled):not(.disabled).active:focus, .btn-outline-secondary:not(:disabled):not(.disabled):active:focus, +.btn-outline-secondary:not(:disabled):not(.disabled).active:focus, .show > .btn-outline-secondary.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem rgba(0, 200, 83, 0.5); } + .btn-outline-success { color: #6610f2; border-color: #6610f2; } .btn-outline-success:hover { - color: #fff; + color: #ffffff; background-color: #6610f2; border-color: #6610f2; } -.btn-outline-success.focus, -.btn-outline-success:focus { +.btn-outline-success:focus, +.btn-outline-success.focus { box-shadow: 0 0 0 0.2rem rgba(102, 16, 242, 0.5); } .btn-outline-success.disabled, @@ -2578,29 +2789,30 @@ fieldset:disabled a.btn { color: #6610f2; background-color: transparent; } -.btn-outline-success:not(:disabled):not(.disabled).active, .btn-outline-success:not(:disabled):not(.disabled):active, +.btn-outline-success:not(:disabled):not(.disabled).active, .show > .btn-outline-success.dropdown-toggle { - color: #fff; + color: #ffffff; background-color: #6610f2; border-color: #6610f2; } -.btn-outline-success:not(:disabled):not(.disabled).active:focus, .btn-outline-success:not(:disabled):not(.disabled):active:focus, +.btn-outline-success:not(:disabled):not(.disabled).active:focus, .show > .btn-outline-success.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem rgba(102, 16, 242, 0.5); } + .btn-outline-info { color: #007bff; border-color: #007bff; } .btn-outline-info:hover { - color: #fff; + color: #ffffff; background-color: #007bff; border-color: #007bff; } -.btn-outline-info.focus, -.btn-outline-info:focus { +.btn-outline-info:focus, +.btn-outline-info.focus { box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.5); } .btn-outline-info.disabled, @@ -2608,18 +2820,19 @@ fieldset:disabled a.btn { color: #007bff; background-color: transparent; } -.btn-outline-info:not(:disabled):not(.disabled).active, .btn-outline-info:not(:disabled):not(.disabled):active, +.btn-outline-info:not(:disabled):not(.disabled).active, .show > .btn-outline-info.dropdown-toggle { - color: #fff; + color: #ffffff; background-color: #007bff; border-color: #007bff; } -.btn-outline-info:not(:disabled):not(.disabled).active:focus, .btn-outline-info:not(:disabled):not(.disabled):active:focus, +.btn-outline-info:not(:disabled):not(.disabled).active:focus, .show > .btn-outline-info.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.5); } + .btn-outline-warning { color: #ffc107; border-color: #ffc107; @@ -2629,8 +2842,8 @@ fieldset:disabled a.btn { background-color: #ffc107; border-color: #ffc107; } -.btn-outline-warning.focus, -.btn-outline-warning:focus { +.btn-outline-warning:focus, +.btn-outline-warning.focus { box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); } .btn-outline-warning.disabled, @@ -2638,29 +2851,30 @@ fieldset:disabled a.btn { color: #ffc107; background-color: transparent; } -.btn-outline-warning:not(:disabled):not(.disabled).active, .btn-outline-warning:not(:disabled):not(.disabled):active, +.btn-outline-warning:not(:disabled):not(.disabled).active, .show > .btn-outline-warning.dropdown-toggle { color: #212529; background-color: #ffc107; border-color: #ffc107; } -.btn-outline-warning:not(:disabled):not(.disabled).active:focus, .btn-outline-warning:not(:disabled):not(.disabled):active:focus, +.btn-outline-warning:not(:disabled):not(.disabled).active:focus, .show > .btn-outline-warning.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); } + .btn-outline-danger { color: #873208; border-color: #873208; } .btn-outline-danger:hover { - color: #fff; + color: #ffffff; background-color: #873208; border-color: #873208; } -.btn-outline-danger.focus, -.btn-outline-danger:focus { +.btn-outline-danger:focus, +.btn-outline-danger.focus { box-shadow: 0 0 0 0.2rem rgba(135, 50, 8, 0.5); } .btn-outline-danger.disabled, @@ -2668,18 +2882,19 @@ fieldset:disabled a.btn { color: #873208; background-color: transparent; } -.btn-outline-danger:not(:disabled):not(.disabled).active, .btn-outline-danger:not(:disabled):not(.disabled):active, +.btn-outline-danger:not(:disabled):not(.disabled).active, .show > .btn-outline-danger.dropdown-toggle { - color: #fff; + color: #ffffff; background-color: #873208; border-color: #873208; } -.btn-outline-danger:not(:disabled):not(.disabled).active:focus, .btn-outline-danger:not(:disabled):not(.disabled):active:focus, +.btn-outline-danger:not(:disabled):not(.disabled).active:focus, .show > .btn-outline-danger.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem rgba(135, 50, 8, 0.5); } + .btn-outline-light { color: #f8f9fa; border-color: #f8f9fa; @@ -2689,8 +2904,8 @@ fieldset:disabled a.btn { background-color: #f8f9fa; border-color: #f8f9fa; } -.btn-outline-light.focus, -.btn-outline-light:focus { +.btn-outline-light:focus, +.btn-outline-light.focus { box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); } .btn-outline-light.disabled, @@ -2698,29 +2913,30 @@ fieldset:disabled a.btn { color: #f8f9fa; background-color: transparent; } -.btn-outline-light:not(:disabled):not(.disabled).active, .btn-outline-light:not(:disabled):not(.disabled):active, +.btn-outline-light:not(:disabled):not(.disabled).active, .show > .btn-outline-light.dropdown-toggle { color: #212529; background-color: #f8f9fa; border-color: #f8f9fa; } -.btn-outline-light:not(:disabled):not(.disabled).active:focus, .btn-outline-light:not(:disabled):not(.disabled):active:focus, +.btn-outline-light:not(:disabled):not(.disabled).active:focus, .show > .btn-outline-light.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); } + .btn-outline-dark { color: #343a40; border-color: #343a40; } .btn-outline-dark:hover { - color: #fff; + color: #ffffff; background-color: #343a40; border-color: #343a40; } -.btn-outline-dark.focus, -.btn-outline-dark:focus { +.btn-outline-dark:focus, +.btn-outline-dark.focus { box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); } .btn-outline-dark.disabled, @@ -2728,18 +2944,19 @@ fieldset:disabled a.btn { color: #343a40; background-color: transparent; } -.btn-outline-dark:not(:disabled):not(.disabled).active, .btn-outline-dark:not(:disabled):not(.disabled):active, +.btn-outline-dark:not(:disabled):not(.disabled).active, .show > .btn-outline-dark.dropdown-toggle { - color: #fff; + color: #ffffff; background-color: #343a40; border-color: #343a40; } -.btn-outline-dark:not(:disabled):not(.disabled).active:focus, .btn-outline-dark:not(:disabled):not(.disabled):active:focus, +.btn-outline-dark:not(:disabled):not(.disabled).active:focus, .show > .btn-outline-dark.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); } + .btn-link { font-weight: 400; color: #f1641e; @@ -2749,29 +2966,32 @@ fieldset:disabled a.btn { color: #b7440b; text-decoration: underline; } -.btn-link.focus, -.btn-link:focus { +.btn-link:focus, +.btn-link.focus { text-decoration: underline; } -.btn-link.disabled, -.btn-link:disabled { +.btn-link:disabled, +.btn-link.disabled { color: #6c757d; pointer-events: none; } -.btn-group-lg > .btn, -.btn-lg { + +.btn-lg, +.btn-group-lg > .btn { padding: 0.5rem 1rem; font-size: 1.25rem; line-height: 1.5; border-radius: 0.5rem; } -.btn-group-sm > .btn, -.btn-sm { + +.btn-sm, +.btn-group-sm > .btn { padding: 0.25rem 0.5rem; font-size: 0.875rem; line-height: 1.5; border-radius: 1rem; } + .btn-block { display: block; width: 100%; @@ -2779,11 +2999,13 @@ fieldset:disabled a.btn { .btn-block + .btn-block { margin-top: 0.5rem; } -input[type="button"].btn-block, + +input[type="submit"].btn-block, input[type="reset"].btn-block, -input[type="submit"].btn-block { +input[type="button"].btn-block { width: 100%; } + .fade { transition: opacity 0.15s linear; } @@ -2795,9 +3017,11 @@ input[type="submit"].btn-block { .fade:not(.show) { opacity: 0; } + .collapse:not(.show) { display: none; } + .collapsing { position: relative; height: 0; @@ -2809,12 +3033,24 @@ input[type="submit"].btn-block { transition: none; } } -.dropdown, -.dropleft, +.collapsing.width { + width: 0; + height: auto; + transition: width 0.35s ease; +} +@media (prefers-reduced-motion: reduce) { + .collapsing.width { + transition: none; + } +} + +.dropup, .dropright, -.dropup { +.dropdown, +.dropleft { position: relative; } + .dropdown-toggle { white-space: nowrap; } @@ -2831,6 +3067,7 @@ input[type="submit"].btn-block { .dropdown-toggle:empty::after { margin-left: 0; } + .dropdown-menu { position: absolute; top: 100%; @@ -2845,19 +3082,22 @@ input[type="submit"].btn-block { color: #495057; text-align: left; list-style: none; - background-color: #fff; + background-color: #ffffff; background-clip: padding-box; border: 1px solid rgba(34, 34, 34, 0.15); border-radius: 0.5rem; } + .dropdown-menu-left { right: auto; left: 0; } + .dropdown-menu-right { right: 0; left: auto; } + @media (min-width: 576px) { .dropdown-menu-sm-left { right: auto; @@ -2917,6 +3157,7 @@ input[type="submit"].btn-block { .dropup .dropdown-toggle:empty::after { margin-left: 0; } + .dropright .dropdown-menu { top: 0; right: auto; @@ -2940,6 +3181,7 @@ input[type="submit"].btn-block { .dropright .dropdown-toggle::after { vertical-align: 0; } + .dropleft .dropdown-menu { top: 0; right: 100%; @@ -2971,19 +3213,22 @@ input[type="submit"].btn-block { .dropleft .dropdown-toggle::before { vertical-align: 0; } -.dropdown-menu[x-placement^="bottom"], -.dropdown-menu[x-placement^="left"], + +.dropdown-menu[x-placement^="top"], .dropdown-menu[x-placement^="right"], -.dropdown-menu[x-placement^="top"] { +.dropdown-menu[x-placement^="bottom"], +.dropdown-menu[x-placement^="left"] { right: auto; bottom: auto; } + .dropdown-divider { height: 0; margin: 0.5rem 0; overflow: hidden; border-top: 1px solid #e9ecef; } + .dropdown-item { display: block; width: 100%; @@ -2996,27 +3241,29 @@ input[type="submit"].btn-block { background-color: transparent; border: 0; } -.dropdown-item:focus, -.dropdown-item:hover { +.dropdown-item:hover, +.dropdown-item:focus { color: #16181b; text-decoration: none; - background-color: #f8f9fa; + background-color: #e9ecef; } .dropdown-item.active, .dropdown-item:active { - color: #fff; + color: #ffffff; text-decoration: none; background-color: #f1641e; } .dropdown-item.disabled, .dropdown-item:disabled { - color: #6c757d; + color: #adb5bd; pointer-events: none; background-color: transparent; } + .dropdown-menu.show { display: block; } + .dropdown-header { display: block; padding: 0.5rem 1.5rem; @@ -3025,34 +3272,37 @@ input[type="submit"].btn-block { color: #6c757d; white-space: nowrap; } + .dropdown-item-text { display: block; padding: 0.25rem 1.5rem; color: #212529; } + .btn-group, .btn-group-vertical { position: relative; display: inline-flex; vertical-align: middle; } -.btn-group-vertical > .btn, -.btn-group > .btn { +.btn-group > .btn, +.btn-group-vertical > .btn { position: relative; flex: 1 1 auto; } -.btn-group-vertical > .btn:hover, -.btn-group > .btn:hover { +.btn-group > .btn:hover, +.btn-group-vertical > .btn:hover { z-index: 1; } -.btn-group-vertical > .btn.active, -.btn-group-vertical > .btn:active, -.btn-group-vertical > .btn:focus, -.btn-group > .btn.active, +.btn-group > .btn:focus, .btn-group > .btn:active, -.btn-group > .btn:focus { +.btn-group > .btn.active, +.btn-group-vertical > .btn:focus, +.btn-group-vertical > .btn:active, +.btn-group-vertical > .btn.active { z-index: 1; } + .btn-toolbar { display: flex; flex-wrap: wrap; @@ -3061,42 +3311,47 @@ input[type="submit"].btn-block { .btn-toolbar .input-group { width: auto; } -.btn-group > .btn-group:not(:first-child), -.btn-group > .btn:not(:first-child) { + +.btn-group > .btn:not(:first-child), +.btn-group > .btn-group:not(:first-child) { margin-left: -1px; } -.btn-group > .btn-group:not(:last-child) > .btn, -.btn-group > .btn:not(:last-child):not(.dropdown-toggle) { +.btn-group > .btn:not(:last-child):not(.dropdown-toggle), +.btn-group > .btn-group:not(:last-child) > .btn { border-top-right-radius: 0; border-bottom-right-radius: 0; } -.btn-group > .btn-group:not(:first-child) > .btn, -.btn-group > .btn:not(:first-child) { +.btn-group > .btn:not(:first-child), +.btn-group > .btn-group:not(:first-child) > .btn { border-top-left-radius: 0; border-bottom-left-radius: 0; } + .dropdown-toggle-split { padding-right: 0.5625rem; padding-left: 0.5625rem; } .dropdown-toggle-split::after, -.dropright .dropdown-toggle-split::after, -.dropup .dropdown-toggle-split::after { +.dropup .dropdown-toggle-split::after, +.dropright .dropdown-toggle-split::after { margin-left: 0; } .dropleft .dropdown-toggle-split::before { margin-right: 0; } -.btn-group-sm > .btn + .dropdown-toggle-split, -.btn-sm + .dropdown-toggle-split { + +.btn-sm + .dropdown-toggle-split, +.btn-group-sm > .btn + .dropdown-toggle-split { padding-right: 0.375rem; padding-left: 0.375rem; } -.btn-group-lg > .btn + .dropdown-toggle-split, -.btn-lg + .dropdown-toggle-split { + +.btn-lg + .dropdown-toggle-split, +.btn-group-lg > .btn + .dropdown-toggle-split { padding-right: 0.75rem; padding-left: 0.75rem; } + .btn-group-vertical { flex-direction: column; align-items: flex-start; @@ -3106,32 +3361,34 @@ input[type="submit"].btn-block { .btn-group-vertical > .btn-group { width: 100%; } -.btn-group-vertical > .btn-group:not(:first-child), -.btn-group-vertical > .btn:not(:first-child) { +.btn-group-vertical > .btn:not(:first-child), +.btn-group-vertical > .btn-group:not(:first-child) { margin-top: -1px; } -.btn-group-vertical > .btn-group:not(:last-child) > .btn, -.btn-group-vertical > .btn:not(:last-child):not(.dropdown-toggle) { +.btn-group-vertical > .btn:not(:last-child):not(.dropdown-toggle), +.btn-group-vertical > .btn-group:not(:last-child) > .btn { border-bottom-right-radius: 0; border-bottom-left-radius: 0; } -.btn-group-vertical > .btn-group:not(:first-child) > .btn, -.btn-group-vertical > .btn:not(:first-child) { +.btn-group-vertical > .btn:not(:first-child), +.btn-group-vertical > .btn-group:not(:first-child) > .btn { border-top-left-radius: 0; border-top-right-radius: 0; } + .btn-group-toggle > .btn, .btn-group-toggle > .btn-group > .btn { margin-bottom: 0; } -.btn-group-toggle > .btn input[type="checkbox"], .btn-group-toggle > .btn input[type="radio"], -.btn-group-toggle > .btn-group > .btn input[type="checkbox"], -.btn-group-toggle > .btn-group > .btn input[type="radio"] { +.btn-group-toggle > .btn input[type="checkbox"], +.btn-group-toggle > .btn-group > .btn input[type="radio"], +.btn-group-toggle > .btn-group > .btn input[type="checkbox"] { position: absolute; clip: rect(0, 0, 0, 0); pointer-events: none; } + .input-group { position: relative; display: flex; @@ -3139,45 +3396,40 @@ input[type="submit"].btn-block { align-items: stretch; width: 100%; } -.input-group > .custom-file, -.input-group > .custom-select, .input-group > .form-control, -.input-group > .form-control-plaintext { +.input-group > .form-control-plaintext, +.input-group > .custom-select, +.input-group > .custom-file { position: relative; flex: 1 1 auto; width: 1%; min-width: 0; margin-bottom: 0; } -.input-group > .custom-file + .custom-file, -.input-group > .custom-file + .custom-select, -.input-group > .custom-file + .form-control, -.input-group > .custom-select + .custom-file, -.input-group > .custom-select + .custom-select, -.input-group > .custom-select + .form-control, -.input-group > .form-control + .custom-file, -.input-group > .form-control + .custom-select, .input-group > .form-control + .form-control, -.input-group > .form-control-plaintext + .custom-file, +.input-group > .form-control + .custom-select, +.input-group > .form-control + .custom-file, +.input-group > .form-control-plaintext + .form-control, .input-group > .form-control-plaintext + .custom-select, -.input-group > .form-control-plaintext + .form-control { +.input-group > .form-control-plaintext + .custom-file, +.input-group > .custom-select + .form-control, +.input-group > .custom-select + .custom-select, +.input-group > .custom-select + .custom-file, +.input-group > .custom-file + .form-control, +.input-group > .custom-file + .custom-select, +.input-group > .custom-file + .custom-file { margin-left: -1px; } -.input-group > .custom-file .custom-file-input:focus ~ .custom-file-label, +.input-group > .form-control:focus, .input-group > .custom-select:focus, -.input-group > .form-control:focus { +.input-group > .custom-file .custom-file-input:focus ~ .custom-file-label { z-index: 3; } .input-group > .custom-file .custom-file-input:focus { z-index: 4; } -.input-group > .custom-select:not(:last-child), -.input-group > .form-control:not(:last-child) { - border-top-right-radius: 0; - border-bottom-right-radius: 0; -} -.input-group > .custom-select:not(:first-child), -.input-group > .form-control:not(:first-child) { +.input-group > .form-control:not(:first-child), +.input-group > .custom-select:not(:first-child) { border-top-left-radius: 0; border-bottom-left-radius: 0; } @@ -3194,35 +3446,61 @@ input[type="submit"].btn-block { border-top-left-radius: 0; border-bottom-left-radius: 0; } -.input-group-append, -.input-group-prepend { +.input-group:not(.has-validation) > .form-control:not(:last-child), +.input-group:not(.has-validation) > .custom-select:not(:last-child), +.input-group:not(.has-validation) + > .custom-file:not(:last-child) + .custom-file-label, +.input-group:not(.has-validation) + > .custom-file:not(:last-child) + .custom-file-label::after { + border-top-right-radius: 0; + border-bottom-right-radius: 0; +} +.input-group.has-validation > .form-control:nth-last-child(n + 3), +.input-group.has-validation > .custom-select:nth-last-child(n + 3), +.input-group.has-validation + > .custom-file:nth-last-child(n + 3) + .custom-file-label, +.input-group.has-validation + > .custom-file:nth-last-child(n + 3) + .custom-file-label::after { + border-top-right-radius: 0; + border-bottom-right-radius: 0; +} + +.input-group-prepend, +.input-group-append { display: flex; } -.input-group-append .btn, -.input-group-prepend .btn { +.input-group-prepend .btn, +.input-group-append .btn { position: relative; z-index: 2; } -.input-group-append .btn:focus, -.input-group-prepend .btn:focus { +.input-group-prepend .btn:focus, +.input-group-append .btn:focus { z-index: 3; } -.input-group-append .btn + .btn, -.input-group-append .btn + .input-group-text, -.input-group-append .input-group-text + .btn, -.input-group-append .input-group-text + .input-group-text, .input-group-prepend .btn + .btn, .input-group-prepend .btn + .input-group-text, +.input-group-prepend .input-group-text + .input-group-text, .input-group-prepend .input-group-text + .btn, -.input-group-prepend .input-group-text + .input-group-text { +.input-group-append .btn + .btn, +.input-group-append .btn + .input-group-text, +.input-group-append .input-group-text + .input-group-text, +.input-group-append .input-group-text + .btn { margin-left: -1px; } + .input-group-prepend { margin-right: -1px; } + .input-group-append { margin-left: -1px; } + .input-group-text { display: flex; align-items: center; @@ -3238,78 +3516,96 @@ input[type="submit"].btn-block { border: 1px solid #ced4da; border-radius: 0.5rem; } -.input-group-text input[type="checkbox"], -.input-group-text input[type="radio"] { +.input-group-text input[type="radio"], +.input-group-text input[type="checkbox"] { margin-top: 0; } -.input-group-lg > .custom-select, -.input-group-lg > .form-control:not(textarea) { + +.input-group-lg > .form-control:not(textarea), +.input-group-lg > .custom-select { height: calc(1.5em + 1rem + 2px); } -.input-group-lg > .custom-select, + .input-group-lg > .form-control, -.input-group-lg > .input-group-append > .btn, +.input-group-lg > .custom-select, +.input-group-lg > .input-group-prepend > .input-group-text, .input-group-lg > .input-group-append > .input-group-text, .input-group-lg > .input-group-prepend > .btn, -.input-group-lg > .input-group-prepend > .input-group-text { +.input-group-lg > .input-group-append > .btn { padding: 0.5rem 1rem; font-size: 1.25rem; line-height: 1.5; border-radius: 0.5rem; } -.input-group-sm > .custom-select, -.input-group-sm > .form-control:not(textarea) { + +.input-group-sm > .form-control:not(textarea), +.input-group-sm > .custom-select { height: calc(1.5em + 0.5rem + 2px); } -.input-group-sm > .custom-select, + .input-group-sm > .form-control, -.input-group-sm > .input-group-append > .btn, +.input-group-sm > .custom-select, +.input-group-sm > .input-group-prepend > .input-group-text, .input-group-sm > .input-group-append > .input-group-text, .input-group-sm > .input-group-prepend > .btn, -.input-group-sm > .input-group-prepend > .input-group-text { +.input-group-sm > .input-group-append > .btn { padding: 0.25rem 0.5rem; font-size: 0.875rem; line-height: 1.5; border-radius: 1rem; } + .input-group-lg > .custom-select, .input-group-sm > .custom-select { padding-right: 1.75rem; } + +.input-group > .input-group-prepend > .btn, +.input-group > .input-group-prepend > .input-group-text, +.input-group:not(.has-validation) > .input-group-append:not(:last-child) > .btn, +.input-group:not(.has-validation) + > .input-group-append:not(:last-child) + > .input-group-text, +.input-group.has-validation > .input-group-append:nth-last-child(n + 3) > .btn, +.input-group.has-validation + > .input-group-append:nth-last-child(n + 3) + > .input-group-text, .input-group > .input-group-append:last-child > .btn:not(:last-child):not(.dropdown-toggle), .input-group > .input-group-append:last-child - > .input-group-text:not(:last-child), -.input-group > .input-group-append:not(:last-child) > .btn, -.input-group > .input-group-append:not(:last-child) > .input-group-text, -.input-group > .input-group-prepend > .btn, -.input-group > .input-group-prepend > .input-group-text { + > .input-group-text:not(:last-child) { border-top-right-radius: 0; border-bottom-right-radius: 0; } + .input-group > .input-group-append > .btn, .input-group > .input-group-append > .input-group-text, +.input-group > .input-group-prepend:not(:first-child) > .btn, +.input-group > .input-group-prepend:not(:first-child) > .input-group-text, .input-group > .input-group-prepend:first-child > .btn:not(:first-child), .input-group > .input-group-prepend:first-child - > .input-group-text:not(:first-child), -.input-group > .input-group-prepend:not(:first-child) > .btn, -.input-group > .input-group-prepend:not(:first-child) > .input-group-text { + > .input-group-text:not(:first-child) { border-top-left-radius: 0; border-bottom-left-radius: 0; } + .custom-control { position: relative; + z-index: 1; display: block; min-height: 1.5rem; padding-left: 1.5rem; + print-color-adjust: exact; } + .custom-control-inline { display: inline-flex; margin-right: 1rem; } + .custom-control-input { position: absolute; left: 0; @@ -3319,7 +3615,7 @@ input[type="submit"].btn-block { opacity: 0; } .custom-control-input:checked ~ .custom-control-label::before { - color: #fff; + color: #ffffff; border-color: #f1641e; background-color: #f1641e; } @@ -3330,18 +3626,19 @@ input[type="submit"].btn-block { border-color: #f8b796; } .custom-control-input:not(:disabled):active ~ .custom-control-label::before { - color: #fff; + color: #ffffff; background-color: #fbd8c6; border-color: #fbd8c6; } -.custom-control-input:disabled ~ .custom-control-label, -.custom-control-input[disabled] ~ .custom-control-label { +.custom-control-input[disabled] ~ .custom-control-label, +.custom-control-input:disabled ~ .custom-control-label { color: #6c757d; } -.custom-control-input:disabled ~ .custom-control-label::before, -.custom-control-input[disabled] ~ .custom-control-label::before { +.custom-control-input[disabled] ~ .custom-control-label::before, +.custom-control-input:disabled ~ .custom-control-label::before { background-color: #e9ecef; } + .custom-control-label { position: relative; margin-bottom: 0; @@ -3356,8 +3653,8 @@ input[type="submit"].btn-block { height: 1rem; pointer-events: none; content: ""; - background-color: #fff; - border: #adb5bd solid 1px; + background-color: #ffffff; + border: 1px solid #adb5bd; } .custom-control-label::after { position: absolute; @@ -3367,8 +3664,9 @@ input[type="submit"].btn-block { width: 1rem; height: 1rem; content: ""; - background: no-repeat 50%/50% 50%; + background: 50%/50% 50% no-repeat; } + .custom-checkbox .custom-control-label::before { border-radius: 0.5rem; } @@ -3396,6 +3694,7 @@ input[type="submit"].btn-block { ~ .custom-control-label::before { background-color: rgba(241, 100, 30, 0.5); } + .custom-radio .custom-control-label::before { border-radius: 50%; } @@ -3407,6 +3706,7 @@ input[type="submit"].btn-block { ~ .custom-control-label::before { background-color: rgba(241, 100, 30, 0.5); } + .custom-switch { padding-left: 2.25rem; } @@ -3432,7 +3732,7 @@ input[type="submit"].btn-block { } } .custom-switch .custom-control-input:checked ~ .custom-control-label::after { - background-color: #fff; + background-color: #ffffff; transform: translateX(0.75rem); } .custom-switch @@ -3440,6 +3740,7 @@ input[type="submit"].btn-block { ~ .custom-control-label::before { background-color: rgba(241, 100, 30, 0.5); } + .custom-select { display: inline-block; width: 100%; @@ -3450,9 +3751,9 @@ input[type="submit"].btn-block { line-height: 1.5; color: #495057; vertical-align: middle; - background: #fff + background: #ffffff url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='4' height='5' viewBox='0 0 4 5'%3e%3cpath fill='%23343a40' d='M2 0L0 2h4zm0 5L0 3h4z'/%3e%3c/svg%3e") - no-repeat right 0.75rem center/8px 10px; + right 0.75rem center/8px 10px no-repeat; border: 1px solid #ced4da; border-radius: 0.5rem; appearance: none; @@ -3464,7 +3765,7 @@ input[type="submit"].btn-block { } .custom-select:focus::-ms-value { color: #495057; - background-color: #fff; + background-color: #ffffff; } .custom-select[multiple], .custom-select[size]:not([size="1"]) { @@ -3483,6 +3784,7 @@ input[type="submit"].btn-block { color: transparent; text-shadow: 0 0 0 #495057; } + .custom-select-sm { height: calc(1.5em + 0.5rem + 2px); padding-top: 0.25rem; @@ -3490,6 +3792,7 @@ input[type="submit"].btn-block { padding-left: 0.5rem; font-size: 0.875rem; } + .custom-select-lg { height: calc(1.5em + 1rem + 2px); padding-top: 0.5rem; @@ -3497,6 +3800,7 @@ input[type="submit"].btn-block { padding-left: 1rem; font-size: 1.25rem; } + .custom-file { position: relative; display: inline-block; @@ -3504,20 +3808,22 @@ input[type="submit"].btn-block { height: calc(1.5em + 0.75rem + 2px); margin-bottom: 0; } + .custom-file-input { position: relative; z-index: 2; width: 100%; height: calc(1.5em + 0.75rem + 2px); margin: 0; + overflow: hidden; opacity: 0; } .custom-file-input:focus ~ .custom-file-label { border-color: #f8b796; box-shadow: 0 0 0 0.2rem rgba(241, 100, 30, 0.75); } -.custom-file-input:disabled ~ .custom-file-label, -.custom-file-input[disabled] ~ .custom-file-label { +.custom-file-input[disabled] ~ .custom-file-label, +.custom-file-input:disabled ~ .custom-file-label { background-color: #e9ecef; } .custom-file-input:lang(en) ~ .custom-file-label::after { @@ -3526,6 +3832,7 @@ input[type="submit"].btn-block { .custom-file-input ~ .custom-file-label[data-browse]::after { content: attr(data-browse); } + .custom-file-label { position: absolute; top: 0; @@ -3534,10 +3841,11 @@ input[type="submit"].btn-block { z-index: 1; height: calc(1.5em + 0.75rem + 2px); padding: 0.375rem 0.75rem; + overflow: hidden; font-weight: 400; line-height: 1.5; color: #495057; - background-color: #fff; + background-color: #ffffff; border: 1px solid #ced4da; border-radius: 0.5rem; } @@ -3557,6 +3865,7 @@ input[type="submit"].btn-block { border-left: inherit; border-radius: 0 0.5rem 0.5rem 0; } + .custom-range { width: 100%; height: 1.4rem; @@ -3688,6 +3997,7 @@ input[type="submit"].btn-block { .custom-range:disabled::-ms-thumb { background-color: #adb5bd; } + .custom-control-label::before, .custom-file-label, .custom-select { @@ -3701,6 +4011,7 @@ input[type="submit"].btn-block { transition: none; } } + .nav { display: flex; flex-wrap: wrap; @@ -3708,12 +4019,13 @@ input[type="submit"].btn-block { margin-bottom: 0; list-style: none; } + .nav-link { display: block; padding: 0.5rem 1rem; } -.nav-link:focus, -.nav-link:hover { +.nav-link:hover, +.nav-link:focus { text-decoration: none; } .nav-link.disabled { @@ -3721,19 +4033,20 @@ input[type="submit"].btn-block { pointer-events: none; cursor: default; } + .nav-tabs { border-bottom: 1px solid #dee2e6; } -.nav-tabs .nav-item { - margin-bottom: -1px; -} .nav-tabs .nav-link { + margin-bottom: -1px; + background-color: transparent; border: 1px solid transparent; border-top-left-radius: 0.5rem; border-top-right-radius: 0.5rem; } -.nav-tabs .nav-link:focus, -.nav-tabs .nav-link:hover { +.nav-tabs .nav-link:hover, +.nav-tabs .nav-link:focus { + isolation: isolate; border-color: #e9ecef #e9ecef #dee2e6; } .nav-tabs .nav-link.disabled { @@ -3741,8 +4054,8 @@ input[type="submit"].btn-block { background-color: transparent; border-color: transparent; } -.nav-tabs .nav-item.show .nav-link, -.nav-tabs .nav-link.active { +.nav-tabs .nav-link.active, +.nav-tabs .nav-item.show .nav-link { color: #495057; background-color: #fff; border-color: #dee2e6 #dee2e6 #fff; @@ -3752,29 +4065,38 @@ input[type="submit"].btn-block { border-top-left-radius: 0; border-top-right-radius: 0; } + .nav-pills .nav-link { + background: none; + border: 0; border-radius: 0.5rem; } .nav-pills .nav-link.active, .nav-pills .show > .nav-link { - color: #fff; + color: #ffffff; background-color: #f1641e; } + +.nav-fill > .nav-link, .nav-fill .nav-item { flex: 1 1 auto; text-align: center; } + +.nav-justified > .nav-link, .nav-justified .nav-item { flex-basis: 0; flex-grow: 1; text-align: center; } + .tab-content > .tab-pane { display: none; } .tab-content > .active { display: block; } + .navbar { position: relative; display: flex; @@ -3785,9 +4107,9 @@ input[type="submit"].btn-block { } .navbar .container, .navbar .container-fluid, -.navbar .container-lg, -.navbar .container-md, .navbar .container-sm, +.navbar .container-md, +.navbar .container-lg, .navbar .container-xl { display: flex; flex-wrap: wrap; @@ -3803,10 +4125,11 @@ input[type="submit"].btn-block { line-height: inherit; white-space: nowrap; } -.navbar-brand:focus, -.navbar-brand:hover { +.navbar-brand:hover, +.navbar-brand:focus { text-decoration: none; } + .navbar-nav { display: flex; flex-direction: column; @@ -3822,16 +4145,19 @@ input[type="submit"].btn-block { position: static; float: none; } + .navbar-text { display: inline-block; padding-top: 0.5rem; padding-bottom: 0.5rem; } + .navbar-collapse { flex-basis: 100%; flex-grow: 1; align-items: center; } + .navbar-toggler { padding: 0.25rem 0.75rem; font-size: 1.25rem; @@ -3840,25 +4166,31 @@ input[type="submit"].btn-block { border: 1px solid transparent; border-radius: 0.5rem; } -.navbar-toggler:focus, -.navbar-toggler:hover { +.navbar-toggler:hover, +.navbar-toggler:focus { text-decoration: none; } + .navbar-toggler-icon { display: inline-block; width: 1.5em; height: 1.5em; vertical-align: middle; content: ""; - background: no-repeat center center; - background-size: 100% 100%; + background: 50%/100% 100% no-repeat; } + +.navbar-nav-scroll { + max-height: 75vh; + overflow-y: auto; +} + @media (max-width: 575.98px) { .navbar-expand-sm > .container, .navbar-expand-sm > .container-fluid, - .navbar-expand-sm > .container-lg, - .navbar-expand-sm > .container-md, .navbar-expand-sm > .container-sm, + .navbar-expand-sm > .container-md, + .navbar-expand-sm > .container-lg, .navbar-expand-sm > .container-xl { padding-right: 0; padding-left: 0; @@ -3881,12 +4213,15 @@ input[type="submit"].btn-block { } .navbar-expand-sm > .container, .navbar-expand-sm > .container-fluid, - .navbar-expand-sm > .container-lg, - .navbar-expand-sm > .container-md, .navbar-expand-sm > .container-sm, + .navbar-expand-sm > .container-md, + .navbar-expand-sm > .container-lg, .navbar-expand-sm > .container-xl { flex-wrap: nowrap; } + .navbar-expand-sm .navbar-nav-scroll { + overflow: visible; + } .navbar-expand-sm .navbar-collapse { display: flex !important; flex-basis: auto; @@ -3898,9 +4233,9 @@ input[type="submit"].btn-block { @media (max-width: 767.98px) { .navbar-expand-md > .container, .navbar-expand-md > .container-fluid, - .navbar-expand-md > .container-lg, - .navbar-expand-md > .container-md, .navbar-expand-md > .container-sm, + .navbar-expand-md > .container-md, + .navbar-expand-md > .container-lg, .navbar-expand-md > .container-xl { padding-right: 0; padding-left: 0; @@ -3923,12 +4258,15 @@ input[type="submit"].btn-block { } .navbar-expand-md > .container, .navbar-expand-md > .container-fluid, - .navbar-expand-md > .container-lg, - .navbar-expand-md > .container-md, .navbar-expand-md > .container-sm, + .navbar-expand-md > .container-md, + .navbar-expand-md > .container-lg, .navbar-expand-md > .container-xl { flex-wrap: nowrap; } + .navbar-expand-md .navbar-nav-scroll { + overflow: visible; + } .navbar-expand-md .navbar-collapse { display: flex !important; flex-basis: auto; @@ -3940,9 +4278,9 @@ input[type="submit"].btn-block { @media (max-width: 991.98px) { .navbar-expand-lg > .container, .navbar-expand-lg > .container-fluid, - .navbar-expand-lg > .container-lg, - .navbar-expand-lg > .container-md, .navbar-expand-lg > .container-sm, + .navbar-expand-lg > .container-md, + .navbar-expand-lg > .container-lg, .navbar-expand-lg > .container-xl { padding-right: 0; padding-left: 0; @@ -3965,12 +4303,15 @@ input[type="submit"].btn-block { } .navbar-expand-lg > .container, .navbar-expand-lg > .container-fluid, - .navbar-expand-lg > .container-lg, - .navbar-expand-lg > .container-md, .navbar-expand-lg > .container-sm, + .navbar-expand-lg > .container-md, + .navbar-expand-lg > .container-lg, .navbar-expand-lg > .container-xl { flex-wrap: nowrap; } + .navbar-expand-lg .navbar-nav-scroll { + overflow: visible; + } .navbar-expand-lg .navbar-collapse { display: flex !important; flex-basis: auto; @@ -3982,9 +4323,9 @@ input[type="submit"].btn-block { @media (max-width: 1199.98px) { .navbar-expand-xl > .container, .navbar-expand-xl > .container-fluid, - .navbar-expand-xl > .container-lg, - .navbar-expand-xl > .container-md, .navbar-expand-xl > .container-sm, + .navbar-expand-xl > .container-md, + .navbar-expand-xl > .container-lg, .navbar-expand-xl > .container-xl { padding-right: 0; padding-left: 0; @@ -4007,12 +4348,15 @@ input[type="submit"].btn-block { } .navbar-expand-xl > .container, .navbar-expand-xl > .container-fluid, - .navbar-expand-xl > .container-lg, - .navbar-expand-xl > .container-md, .navbar-expand-xl > .container-sm, + .navbar-expand-xl > .container-md, + .navbar-expand-xl > .container-lg, .navbar-expand-xl > .container-xl { flex-wrap: nowrap; } + .navbar-expand-xl .navbar-nav-scroll { + overflow: visible; + } .navbar-expand-xl .navbar-collapse { display: flex !important; flex-basis: auto; @@ -4027,9 +4371,9 @@ input[type="submit"].btn-block { } .navbar-expand > .container, .navbar-expand > .container-fluid, -.navbar-expand > .container-lg, -.navbar-expand > .container-md, .navbar-expand > .container-sm, +.navbar-expand > .container-md, +.navbar-expand > .container-lg, .navbar-expand > .container-xl { padding-right: 0; padding-left: 0; @@ -4046,12 +4390,15 @@ input[type="submit"].btn-block { } .navbar-expand > .container, .navbar-expand > .container-fluid, -.navbar-expand > .container-lg, -.navbar-expand > .container-md, .navbar-expand > .container-sm, +.navbar-expand > .container-md, +.navbar-expand > .container-lg, .navbar-expand > .container-xl { flex-wrap: nowrap; } +.navbar-expand .navbar-nav-scroll { + overflow: visible; +} .navbar-expand .navbar-collapse { display: flex !important; flex-basis: auto; @@ -4059,27 +4406,28 @@ input[type="submit"].btn-block { .navbar-expand .navbar-toggler { display: none; } + .navbar-light .navbar-brand { color: #212529; } -.navbar-light .navbar-brand:focus, -.navbar-light .navbar-brand:hover { +.navbar-light .navbar-brand:hover, +.navbar-light .navbar-brand:focus { color: #212529; } .navbar-light .navbar-nav .nav-link { color: #6c757d; } -.navbar-light .navbar-nav .nav-link:focus, -.navbar-light .navbar-nav .nav-link:hover { +.navbar-light .navbar-nav .nav-link:hover, +.navbar-light .navbar-nav .nav-link:focus { color: #212529; } .navbar-light .navbar-nav .nav-link.disabled { color: rgba(34, 34, 34, 0.3); } +.navbar-light .navbar-nav .show > .nav-link, .navbar-light .navbar-nav .active > .nav-link, -.navbar-light .navbar-nav .nav-link.active, .navbar-light .navbar-nav .nav-link.show, -.navbar-light .navbar-nav .show > .nav-link { +.navbar-light .navbar-nav .nav-link.active { color: #212529; } .navbar-light .navbar-toggler { @@ -4095,32 +4443,33 @@ input[type="submit"].btn-block { .navbar-light .navbar-text a { color: #212529; } -.navbar-light .navbar-text a:focus, -.navbar-light .navbar-text a:hover { +.navbar-light .navbar-text a:hover, +.navbar-light .navbar-text a:focus { color: #212529; } + .navbar-dark .navbar-brand { - color: #fff; + color: #ffffff; } -.navbar-dark .navbar-brand:focus, -.navbar-dark .navbar-brand:hover { - color: #fff; +.navbar-dark .navbar-brand:hover, +.navbar-dark .navbar-brand:focus { + color: #ffffff; } .navbar-dark .navbar-nav .nav-link { color: rgba(255, 255, 255, 0.5); } -.navbar-dark .navbar-nav .nav-link:focus, -.navbar-dark .navbar-nav .nav-link:hover { +.navbar-dark .navbar-nav .nav-link:hover, +.navbar-dark .navbar-nav .nav-link:focus { color: rgba(255, 255, 255, 0.75); } .navbar-dark .navbar-nav .nav-link.disabled { color: rgba(255, 255, 255, 0.25); } +.navbar-dark .navbar-nav .show > .nav-link, .navbar-dark .navbar-nav .active > .nav-link, -.navbar-dark .navbar-nav .nav-link.active, .navbar-dark .navbar-nav .nav-link.show, -.navbar-dark .navbar-nav .show > .nav-link { - color: #fff; +.navbar-dark .navbar-nav .nav-link.active { + color: #ffffff; } .navbar-dark .navbar-toggler { color: rgba(255, 255, 255, 0.5); @@ -4133,12 +4482,13 @@ input[type="submit"].btn-block { color: rgba(255, 255, 255, 0.5); } .navbar-dark .navbar-text a { - color: #fff; + color: #ffffff; } -.navbar-dark .navbar-text a:focus, -.navbar-dark .navbar-text a:hover { - color: #fff; +.navbar-dark .navbar-text a:hover, +.navbar-dark .navbar-text a:focus { + color: #ffffff; } + .card { position: relative; display: flex; @@ -4168,28 +4518,38 @@ input[type="submit"].btn-block { border-bottom-right-radius: calc(0.5rem - 1px); border-bottom-left-radius: calc(0.5rem - 1px); } +.card > .card-header + .list-group, +.card > .list-group + .card-footer { + border-top: 0; +} + .card-body { flex: 1 1 auto; min-height: 1px; padding: 1.25rem; color: #495057; } + .card-title { margin-bottom: 0.75rem; } + .card-subtitle { margin-top: -0.375rem; margin-bottom: 0; } + .card-text:last-child { margin-bottom: 0; } + .card-link:hover { text-decoration: none; } .card-link + .card-link { margin-left: 1.25rem; } + .card-header { padding: 0.75rem 1.25rem; margin-bottom: 0; @@ -4200,9 +4560,7 @@ input[type="submit"].btn-block { .card-header:first-child { border-radius: calc(0.5rem - 1px) calc(0.5rem - 1px) 0 0; } -.card-header + .list-group .list-group-item:first-child { - border-top: 0; -} + .card-footer { padding: 0.75rem 1.25rem; color: #495057; @@ -4212,16 +4570,19 @@ input[type="submit"].btn-block { .card-footer:last-child { border-radius: 0 0 calc(0.5rem - 1px) calc(0.5rem - 1px); } + .card-header-tabs { margin-right: -0.625rem; margin-bottom: -0.75rem; margin-left: -0.625rem; border-bottom: 0; } + .card-header-pills { margin-right: -0.625rem; margin-left: -0.625rem; } + .card-img-overlay { position: absolute; top: 0; @@ -4229,23 +4590,28 @@ input[type="submit"].btn-block { bottom: 0; left: 0; padding: 1.25rem; + border-radius: calc(0.5rem - 1px); } + .card-img, -.card-img-bottom, -.card-img-top { +.card-img-top, +.card-img-bottom { flex-shrink: 0; width: 100%; } + .card-img, .card-img-top { border-top-left-radius: calc(0.5rem - 1px); border-top-right-radius: calc(0.5rem - 1px); } + .card-img, .card-img-bottom { border-bottom-right-radius: calc(0.5rem - 1px); border-bottom-left-radius: calc(0.5rem - 1px); } + .card-deck .card { margin-bottom: 15px; } @@ -4263,6 +4629,7 @@ input[type="submit"].btn-block { margin-left: 15px; } } + .card-group > .card { margin-bottom: 15px; } @@ -4283,27 +4650,28 @@ input[type="submit"].btn-block { border-top-right-radius: 0; border-bottom-right-radius: 0; } - .card-group > .card:not(:last-child) .card-header, - .card-group > .card:not(:last-child) .card-img-top { + .card-group > .card:not(:last-child) .card-img-top, + .card-group > .card:not(:last-child) .card-header { border-top-right-radius: 0; } - .card-group > .card:not(:last-child) .card-footer, - .card-group > .card:not(:last-child) .card-img-bottom { + .card-group > .card:not(:last-child) .card-img-bottom, + .card-group > .card:not(:last-child) .card-footer { border-bottom-right-radius: 0; } .card-group > .card:not(:first-child) { border-top-left-radius: 0; border-bottom-left-radius: 0; } - .card-group > .card:not(:first-child) .card-header, - .card-group > .card:not(:first-child) .card-img-top { + .card-group > .card:not(:first-child) .card-img-top, + .card-group > .card:not(:first-child) .card-header { border-top-left-radius: 0; } - .card-group > .card:not(:first-child) .card-footer, - .card-group > .card:not(:first-child) .card-img-bottom { + .card-group > .card:not(:first-child) .card-img-bottom, + .card-group > .card:not(:first-child) .card-footer { border-bottom-left-radius: 0; } } + .card-columns .card { margin-bottom: 0.75rem; } @@ -4319,6 +4687,10 @@ input[type="submit"].btn-block { width: 100%; } } + +.accordion { + overflow-anchor: none; +} .accordion > .card { overflow: hidden; } @@ -4335,6 +4707,7 @@ input[type="submit"].btn-block { border-radius: 0; margin-bottom: -1px; } + .breadcrumb { display: flex; flex-wrap: wrap; @@ -4344,14 +4717,12 @@ input[type="submit"].btn-block { background-color: #e9ecef; border-radius: 0.5rem; } -.breadcrumb-item { - display: flex; -} + .breadcrumb-item + .breadcrumb-item { padding-left: 0.5rem; } .breadcrumb-item + .breadcrumb-item::before { - display: inline-block; + float: left; padding-right: 0.5rem; color: #6c757d; content: "/"; @@ -4365,12 +4736,14 @@ input[type="submit"].btn-block { .breadcrumb-item.active { color: #6c757d; } + .pagination { display: flex; padding-left: 0; list-style: none; border-radius: 0.5rem; } + .page-link { position: relative; display: block; @@ -4378,7 +4751,7 @@ input[type="submit"].btn-block { margin-left: -1px; line-height: 1.25; color: #f1641e; - background-color: #fff; + background-color: #ffffff; border: 1px solid #dee2e6; } .page-link:hover { @@ -4393,6 +4766,7 @@ input[type="submit"].btn-block { outline: 0; box-shadow: 0 0 0 0.2rem rgba(241, 100, 30, 0.75); } + .page-item:first-child .page-link { margin-left: 0; border-top-left-radius: 0.5rem; @@ -4404,7 +4778,7 @@ input[type="submit"].btn-block { } .page-item.active .page-link { z-index: 3; - color: #fff; + color: #ffffff; background-color: #f1641e; border-color: #f1641e; } @@ -4412,9 +4786,10 @@ input[type="submit"].btn-block { color: #6c757d; pointer-events: none; cursor: auto; - background-color: #fff; + background-color: #ffffff; border-color: #dee2e6; } + .pagination-lg .page-link { padding: 0.75rem 1.5rem; font-size: 1.25rem; @@ -4428,6 +4803,7 @@ input[type="submit"].btn-block { border-top-right-radius: 0.5rem; border-bottom-right-radius: 0.5rem; } + .pagination-sm .page-link { padding: 0.25rem 0.5rem; font-size: 0.875rem; @@ -4441,6 +4817,7 @@ input[type="submit"].btn-block { border-top-right-radius: 1rem; border-bottom-right-radius: 1rem; } + .badge { display: inline-block; padding: 0.25em 0.4em; @@ -4459,134 +4836,146 @@ input[type="submit"].btn-block { transition: none; } } -a.badge:focus, -a.badge:hover { +a.badge:hover, +a.badge:focus { text-decoration: none; } + .badge:empty { display: none; } + .btn .badge { position: relative; top: -1px; } + .badge-pill { padding-right: 0.6em; padding-left: 0.6em; border-radius: 10rem; } + .badge-primary { - color: #fff; + color: #ffffff; background-color: #f1641e; } -a.badge-primary:focus, -a.badge-primary:hover { - color: #fff; +a.badge-primary:hover, +a.badge-primary:focus { + color: #ffffff; background-color: #cf4d0d; } -a.badge-primary.focus, -a.badge-primary:focus { +a.badge-primary:focus, +a.badge-primary.focus { outline: 0; box-shadow: 0 0 0 0.2rem rgba(241, 100, 30, 0.5); } + .badge-secondary { - color: #fff; + color: #ffffff; background-color: #00c853; } -a.badge-secondary:focus, -a.badge-secondary:hover { - color: #fff; +a.badge-secondary:hover, +a.badge-secondary:focus { + color: #ffffff; background-color: #00953e; } -a.badge-secondary.focus, -a.badge-secondary:focus { +a.badge-secondary:focus, +a.badge-secondary.focus { outline: 0; box-shadow: 0 0 0 0.2rem rgba(0, 200, 83, 0.5); } + .badge-success { - color: #fff; + color: #ffffff; background-color: #6610f2; } -a.badge-success:focus, -a.badge-success:hover { - color: #fff; +a.badge-success:hover, +a.badge-success:focus { + color: #ffffff; background-color: #510bc4; } -a.badge-success.focus, -a.badge-success:focus { +a.badge-success:focus, +a.badge-success.focus { outline: 0; box-shadow: 0 0 0 0.2rem rgba(102, 16, 242, 0.5); } + .badge-info { - color: #fff; + color: #ffffff; background-color: #007bff; } -a.badge-info:focus, -a.badge-info:hover { - color: #fff; +a.badge-info:hover, +a.badge-info:focus { + color: #ffffff; background-color: #0062cc; } -a.badge-info.focus, -a.badge-info:focus { +a.badge-info:focus, +a.badge-info.focus { outline: 0; box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.5); } + .badge-warning { color: #212529; background-color: #ffc107; } -a.badge-warning:focus, -a.badge-warning:hover { +a.badge-warning:hover, +a.badge-warning:focus { color: #212529; background-color: #d39e00; } -a.badge-warning.focus, -a.badge-warning:focus { +a.badge-warning:focus, +a.badge-warning.focus { outline: 0; box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); } + .badge-danger { - color: #fff; + color: #ffffff; background-color: #873208; } -a.badge-danger:focus, -a.badge-danger:hover { - color: #fff; +a.badge-danger:hover, +a.badge-danger:focus { + color: #ffffff; background-color: #572105; } -a.badge-danger.focus, -a.badge-danger:focus { +a.badge-danger:focus, +a.badge-danger.focus { outline: 0; box-shadow: 0 0 0 0.2rem rgba(135, 50, 8, 0.5); } + .badge-light { color: #212529; background-color: #f8f9fa; } -a.badge-light:focus, -a.badge-light:hover { +a.badge-light:hover, +a.badge-light:focus { color: #212529; background-color: #dae0e5; } -a.badge-light.focus, -a.badge-light:focus { +a.badge-light:focus, +a.badge-light.focus { outline: 0; box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); } + .badge-dark { - color: #fff; + color: #ffffff; background-color: #343a40; } -a.badge-dark:focus, -a.badge-dark:hover { - color: #fff; +a.badge-dark:hover, +a.badge-dark:focus { + color: #ffffff; background-color: #1d2124; } -a.badge-dark.focus, -a.badge-dark:focus { +a.badge-dark:focus, +a.badge-dark.focus { outline: 0; box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); } + .jumbotron { padding: 2rem 1rem; margin-bottom: 2rem; @@ -4598,11 +4987,13 @@ a.badge-dark:focus { padding: 4rem 2rem; } } + .jumbotron-fluid { padding-right: 0; padding-left: 0; border-radius: 0; } + .alert { position: relative; padding: 0.75rem 1.25rem; @@ -4610,12 +5001,15 @@ a.badge-dark:focus { border: 1px solid transparent; border-radius: 0.5rem; } + .alert-heading { color: inherit; } + .alert-link { font-weight: 600; } + .alert-dismissible { padding-right: 4rem; } @@ -4623,9 +5017,11 @@ a.badge-dark:focus { position: absolute; top: 0; right: 0; + z-index: 2; padding: 0.75rem 1.25rem; color: inherit; } + .alert-primary { color: #8e4420; background-color: #fce0d2; @@ -4637,6 +5033,7 @@ a.badge-dark:focus { .alert-primary .alert-link { color: #643017; } + .alert-secondary { color: #10783b; background-color: #ccf4dd; @@ -4648,6 +5045,7 @@ a.badge-dark:focus { .alert-secondary .alert-link { color: #0a4b25; } + .alert-success { color: #45198e; background-color: #e0cffc; @@ -4659,6 +5057,7 @@ a.badge-dark:focus { .alert-success .alert-link { color: #301163; } + .alert-info { color: #105095; background-color: #cce5ff; @@ -4670,6 +5069,7 @@ a.badge-dark:focus { .alert-info .alert-link { color: #0b3767; } + .alert-warning { color: #957514; background-color: #fff3cd; @@ -4681,8 +5081,9 @@ a.badge-dark:focus { .alert-warning .alert-link { color: #68520e; } + .alert-danger { - color: #572b15; + color: #572a14; background-color: #e7d6ce; border-color: #ddc6ba; } @@ -4690,8 +5091,9 @@ a.badge-dark:focus { border-top-color: #d5b8a9; } .alert-danger .alert-link { - color: #2e170b; + color: #2e160a; } + .alert-light { color: #919292; background-color: #fefefe; @@ -4703,6 +5105,7 @@ a.badge-dark:focus { .alert-light .alert-link { color: #777979; } + .alert-dark { color: #2b2e32; background-color: #d6d8d9; @@ -4714,6 +5117,7 @@ a.badge-dark:focus { .alert-dark .alert-link { color: #131517; } + @keyframes progress-bar-stripes { from { background-position: 1rem 0; @@ -4731,12 +5135,13 @@ a.badge-dark:focus { background-color: #e9ecef; border-radius: 0.5rem; } + .progress-bar { display: flex; flex-direction: column; justify-content: center; overflow: hidden; - color: #fff; + color: #ffffff; text-align: center; white-space: nowrap; background-color: #f1641e; @@ -4747,6 +5152,7 @@ a.badge-dark:focus { transition: none; } } + .progress-bar-striped { background-image: linear-gradient( 45deg, @@ -4760,21 +5166,25 @@ a.badge-dark:focus { ); background-size: 1rem 1rem; } + .progress-bar-animated { - animation: progress-bar-stripes 1s linear infinite; + animation: 1s linear infinite progress-bar-stripes; } @media (prefers-reduced-motion: reduce) { .progress-bar-animated { animation: none; } } + .media { display: flex; align-items: flex-start; } + .media-body { flex: 1; } + .list-group { display: flex; flex-direction: column; @@ -4782,13 +5192,14 @@ a.badge-dark:focus { margin-bottom: 0; border-radius: 0.5rem; } + .list-group-item-action { width: 100%; color: #495057; text-align: inherit; } -.list-group-item-action:focus, -.list-group-item-action:hover { +.list-group-item-action:hover, +.list-group-item-action:focus { z-index: 1; color: #495057; text-decoration: none; @@ -4798,11 +5209,12 @@ a.badge-dark:focus { color: #495057; background-color: #e9ecef; } + .list-group-item { position: relative; display: block; padding: 0.75rem 1.25rem; - background-color: #fff; + background-color: #ffffff; border: 1px solid rgba(34, 34, 34, 0.125); } .list-group-item:first-child { @@ -4817,11 +5229,11 @@ a.badge-dark:focus { .list-group-item:disabled { color: #6c757d; pointer-events: none; - background-color: #fff; + background-color: #ffffff; } .list-group-item.active { z-index: 2; - color: #fff; + color: #ffffff; background-color: #f1641e; border-color: #f1641e; } @@ -4832,6 +5244,7 @@ a.badge-dark:focus { margin-top: -1px; border-top-width: 1px; } + .list-group-horizontal { flex-direction: row; } @@ -4854,6 +5267,7 @@ a.badge-dark:focus { margin-left: -1px; border-left-width: 1px; } + @media (min-width: 576px) { .list-group-horizontal-sm { flex-direction: row; @@ -4959,152 +5373,163 @@ a.badge-dark:focus { .list-group-flush > .list-group-item:last-child { border-bottom-width: 0; } + .list-group-item-primary { color: #8e4420; background-color: #fbd4c0; } -.list-group-item-primary.list-group-item-action:focus, -.list-group-item-primary.list-group-item-action:hover { +.list-group-item-primary.list-group-item-action:hover, +.list-group-item-primary.list-group-item-action:focus { color: #8e4420; background-color: #f9c4a8; } .list-group-item-primary.list-group-item-action.active { - color: #fff; + color: #ffffff; background-color: #8e4420; border-color: #8e4420; } + .list-group-item-secondary { color: #10783b; background-color: #b8f0cf; } -.list-group-item-secondary.list-group-item-action:focus, -.list-group-item-secondary.list-group-item-action:hover { +.list-group-item-secondary.list-group-item-action:hover, +.list-group-item-secondary.list-group-item-action:focus { color: #10783b; background-color: #a3ecc1; } .list-group-item-secondary.list-group-item-action.active { - color: #fff; + color: #ffffff; background-color: #10783b; border-color: #10783b; } + .list-group-item-success { color: #45198e; background-color: #d4bcfb; } -.list-group-item-success.list-group-item-action:focus, -.list-group-item-success.list-group-item-action:hover { +.list-group-item-success.list-group-item-action:hover, +.list-group-item-success.list-group-item-action:focus { color: #45198e; background-color: #c5a4fa; } .list-group-item-success.list-group-item-action.active { - color: #fff; + color: #ffffff; background-color: #45198e; border-color: #45198e; } + .list-group-item-info { color: #105095; background-color: #b8daff; } -.list-group-item-info.list-group-item-action:focus, -.list-group-item-info.list-group-item-action:hover { +.list-group-item-info.list-group-item-action:hover, +.list-group-item-info.list-group-item-action:focus { color: #105095; background-color: #9fcdff; } .list-group-item-info.list-group-item-action.active { - color: #fff; + color: #ffffff; background-color: #105095; border-color: #105095; } + .list-group-item-warning { color: #957514; background-color: #ffeeba; } -.list-group-item-warning.list-group-item-action:focus, -.list-group-item-warning.list-group-item-action:hover { +.list-group-item-warning.list-group-item-action:hover, +.list-group-item-warning.list-group-item-action:focus { color: #957514; background-color: #ffe8a1; } .list-group-item-warning.list-group-item-action.active { - color: #fff; + color: #ffffff; background-color: #957514; border-color: #957514; } + .list-group-item-danger { - color: #572b15; + color: #572a14; background-color: #ddc6ba; } -.list-group-item-danger.list-group-item-action:focus, -.list-group-item-danger.list-group-item-action:hover { - color: #572b15; +.list-group-item-danger.list-group-item-action:hover, +.list-group-item-danger.list-group-item-action:focus { + color: #572a14; background-color: #d5b8a9; } .list-group-item-danger.list-group-item-action.active { - color: #fff; - background-color: #572b15; - border-color: #572b15; + color: #ffffff; + background-color: #572a14; + border-color: #572a14; } + .list-group-item-light { color: #919292; background-color: #fdfdfe; } -.list-group-item-light.list-group-item-action:focus, -.list-group-item-light.list-group-item-action:hover { +.list-group-item-light.list-group-item-action:hover, +.list-group-item-light.list-group-item-action:focus { color: #919292; background-color: #ececf6; } .list-group-item-light.list-group-item-action.active { - color: #fff; + color: #ffffff; background-color: #919292; border-color: #919292; } + .list-group-item-dark { color: #2b2e32; background-color: #c6c8ca; } -.list-group-item-dark.list-group-item-action:focus, -.list-group-item-dark.list-group-item-action:hover { +.list-group-item-dark.list-group-item-action:hover, +.list-group-item-dark.list-group-item-action:focus { color: #2b2e32; background-color: #b9bbbe; } .list-group-item-dark.list-group-item-action.active { - color: #fff; + color: #ffffff; background-color: #2b2e32; border-color: #2b2e32; } + .close { float: right; font-size: 1.5rem; font-weight: 600; line-height: 1; - color: #222; - text-shadow: 0 1px 0 #fff; + color: #222222; + text-shadow: 0 1px 0 #ffffff; opacity: 0.5; } .close:hover { - color: #222; + color: #222222; text-decoration: none; } -.close:not(:disabled):not(.disabled):focus, -.close:not(:disabled):not(.disabled):hover { +.close:not(:disabled):not(.disabled):hover, +.close:not(:disabled):not(.disabled):focus { opacity: 0.75; } + button.close { padding: 0; background-color: transparent; border: 0; } + a.close.disabled { pointer-events: none; } + .toast { + flex-basis: 350px; max-width: 350px; - overflow: hidden; font-size: 0.875rem; background-color: rgba(255, 255, 255, 0.85); background-clip: padding-box; border: 1px solid rgba(0, 0, 0, 0.1); box-shadow: 0 0.25rem 0.75rem rgba(34, 34, 34, 0.1); - backdrop-filter: blur(10px); opacity: 0; border-radius: 0.25rem; } @@ -5121,6 +5546,7 @@ a.close.disabled { .toast.hide { display: none; } + .toast-header { display: flex; align-items: center; @@ -5129,10 +5555,14 @@ a.close.disabled { background-color: rgba(255, 255, 255, 0.85); background-clip: padding-box; border-bottom: 1px solid rgba(0, 0, 0, 0.05); + border-top-left-radius: calc(0.25rem - 1px); + border-top-right-radius: calc(0.25rem - 1px); } + .toast-body { padding: 0.75rem; } + .modal-open { overflow: hidden; } @@ -5140,6 +5570,7 @@ a.close.disabled { overflow-x: hidden; overflow-y: auto; } + .modal { position: fixed; top: 0; @@ -5151,6 +5582,7 @@ a.close.disabled { overflow: hidden; outline: 0; } + .modal-dialog { position: relative; width: auto; @@ -5172,6 +5604,7 @@ a.close.disabled { .modal.modal-static .modal-dialog { transform: scale(1.02); } + .modal-dialog-scrollable { display: flex; max-height: calc(100% - 1rem); @@ -5180,13 +5613,14 @@ a.close.disabled { max-height: calc(100vh - 1rem); overflow: hidden; } -.modal-dialog-scrollable .modal-footer, -.modal-dialog-scrollable .modal-header { +.modal-dialog-scrollable .modal-header, +.modal-dialog-scrollable .modal-footer { flex-shrink: 0; } .modal-dialog-scrollable .modal-body { overflow-y: auto; } + .modal-dialog-centered { display: flex; align-items: center; @@ -5209,18 +5643,20 @@ a.close.disabled { .modal-dialog-centered.modal-dialog-scrollable::before { content: none; } + .modal-content { position: relative; display: flex; flex-direction: column; width: 100%; pointer-events: auto; - background-color: #fff; + background-color: #ffffff; background-clip: padding-box; border: 1px solid rgba(34, 34, 34, 0.2); border-radius: 0.5rem; outline: 0; } + .modal-backdrop { position: fixed; top: 0; @@ -5228,7 +5664,7 @@ a.close.disabled { z-index: 1040; width: 100vw; height: 100vh; - background-color: #222; + background-color: #222222; } .modal-backdrop.fade { opacity: 0; @@ -5236,6 +5672,7 @@ a.close.disabled { .modal-backdrop.show { opacity: 0.5; } + .modal-header { display: flex; align-items: flex-start; @@ -5249,15 +5686,18 @@ a.close.disabled { padding: 1rem 1rem; margin: -1rem -1rem -1rem auto; } + .modal-title { margin-bottom: 0; line-height: 1.5; } + .modal-body { position: relative; flex: 1 1 auto; padding: 1rem; } + .modal-footer { display: flex; flex-wrap: wrap; @@ -5271,6 +5711,7 @@ a.close.disabled { .modal-footer > * { margin: 0.25rem; } + .modal-scrollbar-measure { position: absolute; top: -9999px; @@ -5278,6 +5719,7 @@ a.close.disabled { height: 50px; overflow: scroll; } + @media (min-width: 576px) { .modal-dialog { max-width: 500px; @@ -5317,7 +5759,7 @@ a.close.disabled { display: block; margin: 0; font-family: -apple-system, BlinkMacSystemFont, "Droid Sans", "Segoe UI", - Helvetica, Arial, sans-serif; + "Helvetica", Arial, sans-serif; font-style: normal; font-weight: 400; line-height: 1.5; @@ -5328,8 +5770,8 @@ a.close.disabled { text-transform: none; letter-spacing: normal; word-break: normal; - word-spacing: normal; white-space: normal; + word-spacing: normal; line-break: auto; font-size: 0.875rem; word-wrap: break-word; @@ -5350,74 +5792,80 @@ a.close.disabled { border-color: transparent; border-style: solid; } -.bs-tooltip-auto[x-placement^="top"], -.bs-tooltip-top { + +.bs-tooltip-top, +.bs-tooltip-auto[x-placement^="top"] { padding: 0.4rem 0; } -.bs-tooltip-auto[x-placement^="top"] .arrow, -.bs-tooltip-top .arrow { +.bs-tooltip-top .arrow, +.bs-tooltip-auto[x-placement^="top"] .arrow { bottom: 0; } -.bs-tooltip-auto[x-placement^="top"] .arrow::before, -.bs-tooltip-top .arrow::before { +.bs-tooltip-top .arrow::before, +.bs-tooltip-auto[x-placement^="top"] .arrow::before { top: 0; border-width: 0.4rem 0.4rem 0; - border-top-color: #222; + border-top-color: #222222; } -.bs-tooltip-auto[x-placement^="right"], -.bs-tooltip-right { + +.bs-tooltip-right, +.bs-tooltip-auto[x-placement^="right"] { padding: 0 0.4rem; } -.bs-tooltip-auto[x-placement^="right"] .arrow, -.bs-tooltip-right .arrow { +.bs-tooltip-right .arrow, +.bs-tooltip-auto[x-placement^="right"] .arrow { left: 0; width: 0.4rem; height: 0.8rem; } -.bs-tooltip-auto[x-placement^="right"] .arrow::before, -.bs-tooltip-right .arrow::before { +.bs-tooltip-right .arrow::before, +.bs-tooltip-auto[x-placement^="right"] .arrow::before { right: 0; border-width: 0.4rem 0.4rem 0.4rem 0; - border-right-color: #222; + border-right-color: #222222; } -.bs-tooltip-auto[x-placement^="bottom"], -.bs-tooltip-bottom { + +.bs-tooltip-bottom, +.bs-tooltip-auto[x-placement^="bottom"] { padding: 0.4rem 0; } -.bs-tooltip-auto[x-placement^="bottom"] .arrow, -.bs-tooltip-bottom .arrow { +.bs-tooltip-bottom .arrow, +.bs-tooltip-auto[x-placement^="bottom"] .arrow { top: 0; } -.bs-tooltip-auto[x-placement^="bottom"] .arrow::before, -.bs-tooltip-bottom .arrow::before { +.bs-tooltip-bottom .arrow::before, +.bs-tooltip-auto[x-placement^="bottom"] .arrow::before { bottom: 0; border-width: 0 0.4rem 0.4rem; - border-bottom-color: #222; + border-bottom-color: #222222; } -.bs-tooltip-auto[x-placement^="left"], -.bs-tooltip-left { + +.bs-tooltip-left, +.bs-tooltip-auto[x-placement^="left"] { padding: 0 0.4rem; } -.bs-tooltip-auto[x-placement^="left"] .arrow, -.bs-tooltip-left .arrow { +.bs-tooltip-left .arrow, +.bs-tooltip-auto[x-placement^="left"] .arrow { right: 0; width: 0.4rem; height: 0.8rem; } -.bs-tooltip-auto[x-placement^="left"] .arrow::before, -.bs-tooltip-left .arrow::before { +.bs-tooltip-left .arrow::before, +.bs-tooltip-auto[x-placement^="left"] .arrow::before { left: 0; border-width: 0.4rem 0 0.4rem 0.4rem; - border-left-color: #222; + border-left-color: #222222; } + .tooltip-inner { max-width: 200px; padding: 0.25rem 0.5rem; - color: #fff; + color: #ffffff; text-align: center; - background-color: #222; + background-color: #222222; border-radius: 0.5rem; } + .popover { position: absolute; top: 0; @@ -5426,7 +5874,7 @@ a.close.disabled { display: block; max-width: 276px; font-family: -apple-system, BlinkMacSystemFont, "Droid Sans", "Segoe UI", - Helvetica, Arial, sans-serif; + "Helvetica", Arial, sans-serif; font-style: normal; font-weight: 400; line-height: 1.5; @@ -5437,12 +5885,12 @@ a.close.disabled { text-transform: none; letter-spacing: normal; word-break: normal; - word-spacing: normal; white-space: normal; + word-spacing: normal; line-break: auto; font-size: 0.875rem; word-wrap: break-word; - background-color: #fff; + background-color: #ffffff; background-clip: padding-box; border: 1px solid rgba(34, 34, 34, 0.2); border-radius: 0.5rem; @@ -5454,79 +5902,82 @@ a.close.disabled { height: 0.5rem; margin: 0 0.5rem; } -.popover .arrow::after, -.popover .arrow::before { +.popover .arrow::before, +.popover .arrow::after { position: absolute; display: block; content: ""; border-color: transparent; border-style: solid; } -.bs-popover-auto[x-placement^="top"], -.bs-popover-top { + +.bs-popover-top, +.bs-popover-auto[x-placement^="top"] { margin-bottom: 0.5rem; } -.bs-popover-auto[x-placement^="top"] > .arrow, -.bs-popover-top > .arrow { +.bs-popover-top > .arrow, +.bs-popover-auto[x-placement^="top"] > .arrow { bottom: calc(-0.5rem - 1px); } -.bs-popover-auto[x-placement^="top"] > .arrow::before, -.bs-popover-top > .arrow::before { +.bs-popover-top > .arrow::before, +.bs-popover-auto[x-placement^="top"] > .arrow::before { bottom: 0; border-width: 0.5rem 0.5rem 0; border-top-color: rgba(34, 34, 34, 0.25); } -.bs-popover-auto[x-placement^="top"] > .arrow::after, -.bs-popover-top > .arrow::after { +.bs-popover-top > .arrow::after, +.bs-popover-auto[x-placement^="top"] > .arrow::after { bottom: 1px; border-width: 0.5rem 0.5rem 0; - border-top-color: #fff; + border-top-color: #ffffff; } -.bs-popover-auto[x-placement^="right"], -.bs-popover-right { + +.bs-popover-right, +.bs-popover-auto[x-placement^="right"] { margin-left: 0.5rem; } -.bs-popover-auto[x-placement^="right"] > .arrow, -.bs-popover-right > .arrow { +.bs-popover-right > .arrow, +.bs-popover-auto[x-placement^="right"] > .arrow { left: calc(-0.5rem - 1px); width: 0.5rem; height: 1rem; margin: 0.5rem 0; } -.bs-popover-auto[x-placement^="right"] > .arrow::before, -.bs-popover-right > .arrow::before { +.bs-popover-right > .arrow::before, +.bs-popover-auto[x-placement^="right"] > .arrow::before { left: 0; border-width: 0.5rem 0.5rem 0.5rem 0; border-right-color: rgba(34, 34, 34, 0.25); } -.bs-popover-auto[x-placement^="right"] > .arrow::after, -.bs-popover-right > .arrow::after { +.bs-popover-right > .arrow::after, +.bs-popover-auto[x-placement^="right"] > .arrow::after { left: 1px; border-width: 0.5rem 0.5rem 0.5rem 0; - border-right-color: #fff; + border-right-color: #ffffff; } -.bs-popover-auto[x-placement^="bottom"], -.bs-popover-bottom { + +.bs-popover-bottom, +.bs-popover-auto[x-placement^="bottom"] { margin-top: 0.5rem; } -.bs-popover-auto[x-placement^="bottom"] > .arrow, -.bs-popover-bottom > .arrow { +.bs-popover-bottom > .arrow, +.bs-popover-auto[x-placement^="bottom"] > .arrow { top: calc(-0.5rem - 1px); } -.bs-popover-auto[x-placement^="bottom"] > .arrow::before, -.bs-popover-bottom > .arrow::before { +.bs-popover-bottom > .arrow::before, +.bs-popover-auto[x-placement^="bottom"] > .arrow::before { top: 0; border-width: 0 0.5rem 0.5rem 0.5rem; border-bottom-color: rgba(34, 34, 34, 0.25); } -.bs-popover-auto[x-placement^="bottom"] > .arrow::after, -.bs-popover-bottom > .arrow::after { +.bs-popover-bottom > .arrow::after, +.bs-popover-auto[x-placement^="bottom"] > .arrow::after { top: 1px; border-width: 0 0.5rem 0.5rem 0.5rem; - border-bottom-color: #fff; + border-bottom-color: #ffffff; } -.bs-popover-auto[x-placement^="bottom"] .popover-header::before, -.bs-popover-bottom .popover-header::before { +.bs-popover-bottom .popover-header::before, +.bs-popover-auto[x-placement^="bottom"] .popover-header::before { position: absolute; top: 0; left: 50%; @@ -5536,29 +5987,31 @@ a.close.disabled { content: ""; border-bottom: 1px solid #f7f7f7; } -.bs-popover-auto[x-placement^="left"], -.bs-popover-left { + +.bs-popover-left, +.bs-popover-auto[x-placement^="left"] { margin-right: 0.5rem; } -.bs-popover-auto[x-placement^="left"] > .arrow, -.bs-popover-left > .arrow { +.bs-popover-left > .arrow, +.bs-popover-auto[x-placement^="left"] > .arrow { right: calc(-0.5rem - 1px); width: 0.5rem; height: 1rem; margin: 0.5rem 0; } -.bs-popover-auto[x-placement^="left"] > .arrow::before, -.bs-popover-left > .arrow::before { +.bs-popover-left > .arrow::before, +.bs-popover-auto[x-placement^="left"] > .arrow::before { right: 0; border-width: 0.5rem 0 0.5rem 0.5rem; border-left-color: rgba(34, 34, 34, 0.25); } -.bs-popover-auto[x-placement^="left"] > .arrow::after, -.bs-popover-left > .arrow::after { +.bs-popover-left > .arrow::after, +.bs-popover-auto[x-placement^="left"] > .arrow::after { right: 1px; border-width: 0.5rem 0 0.5rem 0.5rem; - border-left-color: #fff; + border-left-color: #ffffff; } + .popover-header { padding: 0.5rem 0.75rem; margin-bottom: 0; @@ -5572,16 +6025,20 @@ a.close.disabled { .popover-header:empty { display: none; } + .popover-body { padding: 0.5rem 0.75rem; color: #495057; } + .carousel { position: relative; } + .carousel.pointer-event { touch-action: pan-y; } + .carousel-inner { position: relative; width: 100%; @@ -5592,6 +6049,7 @@ a.close.disabled { clear: both; content: ""; } + .carousel-item { position: relative; display: none; @@ -5606,27 +6064,31 @@ a.close.disabled { transition: none; } } + +.carousel-item.active, .carousel-item-next, -.carousel-item-prev, -.carousel-item.active { +.carousel-item-prev { display: block; } -.active.carousel-item-right, -.carousel-item-next:not(.carousel-item-left) { + +.carousel-item-next:not(.carousel-item-left), +.active.carousel-item-right { transform: translateX(100%); } -.active.carousel-item-left, -.carousel-item-prev:not(.carousel-item-right) { + +.carousel-item-prev:not(.carousel-item-right), +.active.carousel-item-left { transform: translateX(-100%); } + .carousel-fade .carousel-item { opacity: 0; transition-property: opacity; transform: none; } +.carousel-fade .carousel-item.active, .carousel-fade .carousel-item-next.carousel-item-left, -.carousel-fade .carousel-item-prev.carousel-item-right, -.carousel-fade .carousel-item.active { +.carousel-fade .carousel-item-prev.carousel-item-right { z-index: 1; opacity: 1; } @@ -5642,8 +6104,9 @@ a.close.disabled { transition: none; } } -.carousel-control-next, -.carousel-control-prev { + +.carousel-control-prev, +.carousel-control-next { position: absolute; top: 0; bottom: 0; @@ -5652,45 +6115,54 @@ a.close.disabled { align-items: center; justify-content: center; width: 15%; - color: #fff; + padding: 0; + color: #ffffff; text-align: center; + background: none; + border: 0; opacity: 0.5; transition: opacity 0.15s ease; } @media (prefers-reduced-motion: reduce) { - .carousel-control-next, - .carousel-control-prev { + .carousel-control-prev, + .carousel-control-next { transition: none; } } -.carousel-control-next:focus, -.carousel-control-next:hover, +.carousel-control-prev:hover, .carousel-control-prev:focus, -.carousel-control-prev:hover { - color: #fff; +.carousel-control-next:hover, +.carousel-control-next:focus { + color: #ffffff; text-decoration: none; outline: 0; opacity: 0.9; } + .carousel-control-prev { left: 0; } + .carousel-control-next { right: 0; } -.carousel-control-next-icon, -.carousel-control-prev-icon { + +.carousel-control-prev-icon, +.carousel-control-next-icon { display: inline-block; width: 20px; height: 20px; - background: no-repeat 50%/100% 100%; + background: 50%/100% 100% no-repeat; } + .carousel-control-prev-icon { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23ffffff' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath d='M5.25 0l-4 4 4 4 1.5-1.5L4.25 4l2.5-2.5L5.25 0z'/%3e%3c/svg%3e"); } + .carousel-control-next-icon { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23ffffff' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath d='M2.75 0l-1.5 1.5L3.75 4l-2.5 2.5L2.75 8l4-4-4-4z'/%3e%3c/svg%3e"); } + .carousel-indicators { position: absolute; right: 0; @@ -5713,7 +6185,7 @@ a.close.disabled { margin-left: 3px; text-indent: -999px; cursor: pointer; - background-color: #fff; + background-color: #ffffff; background-clip: padding-box; border-top: 10px solid transparent; border-bottom: 10px solid transparent; @@ -5728,6 +6200,7 @@ a.close.disabled { .carousel-indicators .active { opacity: 1; } + .carousel-caption { position: absolute; right: 15%; @@ -5736,9 +6209,10 @@ a.close.disabled { z-index: 10; padding-top: 20px; padding-bottom: 20px; - color: #fff; + color: #ffffff; text-align: center; } + @keyframes spinner-border { to { transform: rotate(360deg); @@ -5748,17 +6222,19 @@ a.close.disabled { display: inline-block; width: 2rem; height: 2rem; - vertical-align: text-bottom; - border: 0.25em solid currentColor; + vertical-align: -0.125em; + border: 0.25em solid currentcolor; border-right-color: transparent; border-radius: 50%; - animation: spinner-border 0.75s linear infinite; + animation: 0.75s linear infinite spinner-border; } + .spinner-border-sm { width: 1rem; height: 1rem; border-width: 0.2em; } + @keyframes spinner-grow { 0% { transform: scale(0); @@ -5772,235 +6248,306 @@ a.close.disabled { display: inline-block; width: 2rem; height: 2rem; - vertical-align: text-bottom; - background-color: currentColor; + vertical-align: -0.125em; + background-color: currentcolor; border-radius: 50%; opacity: 0; - animation: spinner-grow 0.75s linear infinite; + animation: 0.75s linear infinite spinner-grow; } + .spinner-grow-sm { width: 1rem; height: 1rem; } + +@media (prefers-reduced-motion: reduce) { + .spinner-border, + .spinner-grow { + animation-duration: 1.5s; + } +} .align-baseline { vertical-align: baseline !important; } + .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; } + .bg-primary { background-color: #f1641e !important; } -a.bg-primary:focus, + a.bg-primary:hover, -button.bg-primary:focus, -button.bg-primary:hover { +a.bg-primary:focus, +button.bg-primary:hover, +button.bg-primary:focus { background-color: #cf4d0d !important; } + .bg-secondary { background-color: #00c853 !important; } -a.bg-secondary:focus, + a.bg-secondary:hover, -button.bg-secondary:focus, -button.bg-secondary:hover { +a.bg-secondary:focus, +button.bg-secondary:hover, +button.bg-secondary:focus { background-color: #00953e !important; } + .bg-success { background-color: #6610f2 !important; } -a.bg-success:focus, + a.bg-success:hover, -button.bg-success:focus, -button.bg-success:hover { +a.bg-success:focus, +button.bg-success:hover, +button.bg-success:focus { background-color: #510bc4 !important; } + .bg-info { background-color: #007bff !important; } -a.bg-info:focus, + a.bg-info:hover, -button.bg-info:focus, -button.bg-info:hover { +a.bg-info:focus, +button.bg-info:hover, +button.bg-info:focus { background-color: #0062cc !important; } + .bg-warning { background-color: #ffc107 !important; } -a.bg-warning:focus, + a.bg-warning:hover, -button.bg-warning:focus, -button.bg-warning:hover { +a.bg-warning:focus, +button.bg-warning:hover, +button.bg-warning:focus { background-color: #d39e00 !important; } + .bg-danger { background-color: #873208 !important; } -a.bg-danger:focus, + a.bg-danger:hover, -button.bg-danger:focus, -button.bg-danger:hover { +a.bg-danger:focus, +button.bg-danger:hover, +button.bg-danger:focus { background-color: #572105 !important; } + .bg-light { background-color: #f8f9fa !important; } -a.bg-light:focus, + a.bg-light:hover, -button.bg-light:focus, -button.bg-light:hover { +a.bg-light:focus, +button.bg-light:hover, +button.bg-light:focus { background-color: #dae0e5 !important; } + .bg-dark { background-color: #343a40 !important; } -a.bg-dark:focus, + a.bg-dark:hover, -button.bg-dark:focus, -button.bg-dark:hover { +a.bg-dark:focus, +button.bg-dark:hover, +button.bg-dark:focus { background-color: #1d2124 !important; } + .bg-white { - background-color: #fff !important; + background-color: #ffffff !important; } + .bg-transparent { background-color: transparent !important; } + .border { border: 1px solid #495057 !important; } + .border-top { border-top: 1px solid #495057 !important; } + .border-right { border-right: 1px solid #495057 !important; } + .border-bottom { border-bottom: 1px solid #495057 !important; } + .border-left { border-left: 1px solid #495057 !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; } + .border-primary { border-color: #f1641e !important; } + .border-secondary { border-color: #00c853 !important; } + .border-success { border-color: #6610f2 !important; } + .border-info { border-color: #007bff !important; } + .border-warning { border-color: #ffc107 !important; } + .border-danger { border-color: #873208 !important; } + .border-light { border-color: #f8f9fa !important; } + .border-dark { border-color: #343a40 !important; } + .border-white { - border-color: #fff !important; + border-color: #ffffff !important; } + .rounded-sm { border-radius: 1rem !important; } + .rounded { border-radius: 0.5rem !important; } + .rounded-top { border-top-left-radius: 0.5rem !important; border-top-right-radius: 0.5rem !important; } + .rounded-right { border-top-right-radius: 0.5rem !important; border-bottom-right-radius: 0.5rem !important; } + .rounded-bottom { border-bottom-right-radius: 0.5rem !important; border-bottom-left-radius: 0.5rem !important; } + .rounded-left { border-top-left-radius: 0.5rem !important; border-bottom-left-radius: 0.5rem !important; } + .rounded-lg { border-radius: 0.5rem !important; } + .rounded-circle { border-radius: 50% !important; } + .rounded-pill { border-radius: 0.25rem !important; } + .rounded-0 { border-radius: 0 !important; } + .clearfix::after { display: block; clear: both; content: ""; } + .d-none { display: none !important; } + .d-inline { display: inline !important; } + .d-inline-block { display: inline-block !important; } + .d-block { display: block !important; } + .d-table { display: table !important; } + .d-table-row { display: table-row !important; } + .d-table-cell { display: table-cell !important; } + .d-flex { display: flex !important; } + .d-inline-flex { display: inline-flex !important; } + @media (min-width: 576px) { .d-sm-none { display: none !important; @@ -6158,8 +6705,8 @@ button.bg-dark:hover { content: ""; } .embed-responsive .embed-responsive-item, -.embed-responsive embed, .embed-responsive iframe, +.embed-responsive embed, .embed-responsive object, .embed-responsive video { position: absolute; @@ -6170,120 +6717,159 @@ button.bg-dark:hover { height: 100%; border: 0; } + .embed-responsive-21by9::before { - padding-top: 42.85714%; + padding-top: 42.85714286%; } + .embed-responsive-16by9::before { padding-top: 56.25%; } + .embed-responsive-4by3::before { padding-top: 75%; } + .embed-responsive-1by1::before { padding-top: 100%; } + .flex-row { flex-direction: row !important; } + .flex-column { flex-direction: column !important; } + .flex-row-reverse { flex-direction: row-reverse !important; } + .flex-column-reverse { flex-direction: column-reverse !important; } + .flex-wrap { flex-wrap: wrap !important; } + .flex-nowrap { flex-wrap: nowrap !important; } + .flex-wrap-reverse { flex-wrap: wrap-reverse !important; } + .flex-fill { flex: 1 1 auto !important; } + .flex-grow-0 { flex-grow: 0 !important; } + .flex-grow-1 { flex-grow: 1 !important; } + .flex-shrink-0 { flex-shrink: 0 !important; } + .flex-shrink-1 { flex-shrink: 1 !important; } + .justify-content-start { justify-content: flex-start !important; } + .justify-content-end { justify-content: flex-end !important; } + .justify-content-center { justify-content: center !important; } + .justify-content-between { justify-content: space-between !important; } + .justify-content-around { justify-content: space-around !important; } + .align-items-start { align-items: flex-start !important; } + .align-items-end { align-items: flex-end !important; } + .align-items-center { align-items: center !important; } + .align-items-baseline { align-items: baseline !important; } + .align-items-stretch { align-items: stretch !important; } + .align-content-start { align-content: flex-start !important; } + .align-content-end { align-content: flex-end !important; } + .align-content-center { align-content: center !important; } + .align-content-between { align-content: space-between !important; } + .align-content-around { align-content: space-around !important; } + .align-content-stretch { align-content: stretch !important; } + .align-self-auto { align-self: auto !important; } + .align-self-start { align-self: flex-start !important; } + .align-self-end { align-self: flex-end !important; } + .align-self-center { align-self: center !important; } + .align-self-baseline { align-self: baseline !important; } + .align-self-stretch { align-self: stretch !important; } + @media (min-width: 576px) { .flex-sm-row { flex-direction: row !important; @@ -6703,12 +7289,15 @@ button.bg-dark:hover { .float-left { float: left !important; } + .float-right { float: right !important; } + .float-none { float: none !important; } + @media (min-width: 576px) { .float-sm-left { float: left !important; @@ -6756,33 +7345,43 @@ button.bg-dark:hover { .user-select-all { user-select: all !important; } + .user-select-auto { user-select: auto !important; } + .user-select-none { user-select: none !important; } + .overflow-auto { overflow: auto !important; } + .overflow-hidden { overflow: hidden !important; } + .position-static { position: static !important; } + .position-relative { position: relative !important; } + .position-absolute { position: absolute !important; } + .position-fixed { position: fixed !important; } + .position-sticky { position: sticky !important; } + .fixed-top { position: fixed; top: 0; @@ -6790,6 +7389,7 @@ button.bg-dark:hover { left: 0; z-index: 1030; } + .fixed-bottom { position: fixed; right: 0; @@ -6797,6 +7397,7 @@ button.bg-dark:hover { left: 0; z-index: 1030; } + @supports (position: sticky) { .sticky-top { position: sticky; @@ -6804,6 +7405,7 @@ button.bg-dark:hover { z-index: 1020; } } + .sr-only { position: absolute; width: 1px; @@ -6815,6 +7417,7 @@ button.bg-dark:hover { white-space: nowrap; border: 0; } + .sr-only-focusable:active, .sr-only-focusable:focus { position: static; @@ -6824,408 +7427,519 @@ button.bg-dark:hover { clip: auto; white-space: normal; } + .shadow-sm { box-shadow: 0 0.125rem 0.25rem rgba(34, 34, 34, 0.075) !important; } + .shadow { box-shadow: 0 0.5rem 1rem rgba(34, 34, 34, 0.15) !important; } + .shadow-lg { box-shadow: 0 1rem 3rem rgba(34, 34, 34, 0.175) !important; } + .shadow-none { box-shadow: none !important; } + .w-25 { width: 25% !important; } + .w-50 { width: 50% !important; } + .w-75 { width: 75% !important; } + .w-100 { width: 100% !important; } + .w-auto { width: auto !important; } + .h-25 { height: 25% !important; } + .h-50 { height: 50% !important; } + .h-75 { height: 75% !important; } + .h-100 { height: 100% !important; } + .h-auto { height: auto !important; } + .mw-100 { max-width: 100% !important; } + .mh-100 { max-height: 100% !important; } + .min-vw-100 { min-width: 100vw !important; } + .min-vh-100 { min-height: 100vh !important; } + .vw-100 { width: 100vw !important; } + .vh-100 { height: 100vh !important; } + .m-0 { margin: 0 !important; } + .mt-0, .my-0 { margin-top: 0 !important; } + .mr-0, .mx-0 { margin-right: 0 !important; } + .mb-0, .my-0 { margin-bottom: 0 !important; } + .ml-0, .mx-0 { margin-left: 0 !important; } + .m-1 { margin: 0.25rem !important; } + .mt-1, .my-1 { margin-top: 0.25rem !important; } + .mr-1, .mx-1 { margin-right: 0.25rem !important; } + .mb-1, .my-1 { margin-bottom: 0.25rem !important; } + .ml-1, .mx-1 { margin-left: 0.25rem !important; } + .m-2 { margin: 0.5rem !important; } + .mt-2, .my-2 { margin-top: 0.5rem !important; } + .mr-2, .mx-2 { margin-right: 0.5rem !important; } + .mb-2, .my-2 { margin-bottom: 0.5rem !important; } + .ml-2, .mx-2 { margin-left: 0.5rem !important; } + .m-3 { margin: 1rem !important; } + .mt-3, .my-3 { margin-top: 1rem !important; } + .mr-3, .mx-3 { margin-right: 1rem !important; } + .mb-3, .my-3 { margin-bottom: 1rem !important; } + .ml-3, .mx-3 { margin-left: 1rem !important; } + .m-4 { margin: 1.5rem !important; } + .mt-4, .my-4 { margin-top: 1.5rem !important; } + .mr-4, .mx-4 { margin-right: 1.5rem !important; } + .mb-4, .my-4 { margin-bottom: 1.5rem !important; } + .ml-4, .mx-4 { margin-left: 1.5rem !important; } + .m-5 { margin: 3rem !important; } + .mt-5, .my-5 { margin-top: 3rem !important; } + .mr-5, .mx-5 { margin-right: 3rem !important; } + .mb-5, .my-5 { margin-bottom: 3rem !important; } + .ml-5, .mx-5 { margin-left: 3rem !important; } + .p-0 { padding: 0 !important; } + .pt-0, .py-0 { padding-top: 0 !important; } + .pr-0, .px-0 { padding-right: 0 !important; } + .pb-0, .py-0 { padding-bottom: 0 !important; } + .pl-0, .px-0 { padding-left: 0 !important; } + .p-1 { padding: 0.25rem !important; } + .pt-1, .py-1 { padding-top: 0.25rem !important; } + .pr-1, .px-1 { padding-right: 0.25rem !important; } + .pb-1, .py-1 { padding-bottom: 0.25rem !important; } + .pl-1, .px-1 { padding-left: 0.25rem !important; } + .p-2 { padding: 0.5rem !important; } + .pt-2, .py-2 { padding-top: 0.5rem !important; } + .pr-2, .px-2 { padding-right: 0.5rem !important; } + .pb-2, .py-2 { padding-bottom: 0.5rem !important; } + .pl-2, .px-2 { padding-left: 0.5rem !important; } + .p-3 { padding: 1rem !important; } + .pt-3, .py-3 { padding-top: 1rem !important; } + .pr-3, .px-3 { padding-right: 1rem !important; } + .pb-3, .py-3 { padding-bottom: 1rem !important; } + .pl-3, .px-3 { padding-left: 1rem !important; } + .p-4 { padding: 1.5rem !important; } + .pt-4, .py-4 { padding-top: 1.5rem !important; } + .pr-4, .px-4 { padding-right: 1.5rem !important; } + .pb-4, .py-4 { padding-bottom: 1.5rem !important; } + .pl-4, .px-4 { padding-left: 1.5rem !important; } + .p-5 { padding: 3rem !important; } + .pt-5, .py-5 { padding-top: 3rem !important; } + .pr-5, .px-5 { padding-right: 3rem !important; } + .pb-5, .py-5 { padding-bottom: 3rem !important; } + .pl-5, .px-5 { padding-left: 3rem !important; } + .m-n1 { margin: -0.25rem !important; } + .mt-n1, .my-n1 { margin-top: -0.25rem !important; } + .mr-n1, .mx-n1 { margin-right: -0.25rem !important; } + .mb-n1, .my-n1 { margin-bottom: -0.25rem !important; } + .ml-n1, .mx-n1 { margin-left: -0.25rem !important; } + .m-n2 { margin: -0.5rem !important; } + .mt-n2, .my-n2 { margin-top: -0.5rem !important; } + .mr-n2, .mx-n2 { margin-right: -0.5rem !important; } + .mb-n2, .my-n2 { margin-bottom: -0.5rem !important; } + .ml-n2, .mx-n2 { margin-left: -0.5rem !important; } + .m-n3 { margin: -1rem !important; } + .mt-n3, .my-n3 { margin-top: -1rem !important; } + .mr-n3, .mx-n3 { margin-right: -1rem !important; } + .mb-n3, .my-n3 { margin-bottom: -1rem !important; } + .ml-n3, .mx-n3 { margin-left: -1rem !important; } + .m-n4 { margin: -1.5rem !important; } + .mt-n4, .my-n4 { margin-top: -1.5rem !important; } + .mr-n4, .mx-n4 { margin-right: -1.5rem !important; } + .mb-n4, .my-n4 { margin-bottom: -1.5rem !important; } + .ml-n4, .mx-n4 { margin-left: -1.5rem !important; } + .m-n5 { margin: -3rem !important; } + .mt-n5, .my-n5 { margin-top: -3rem !important; } + .mr-n5, .mx-n5 { margin-right: -3rem !important; } + .mb-n5, .my-n5 { margin-bottom: -3rem !important; } + .ml-n5, .mx-n5 { margin-left: -3rem !important; } + .m-auto { margin: auto !important; } + .mt-auto, .my-auto { margin-top: auto !important; } + .mr-auto, .mx-auto { margin-right: auto !important; } + .mb-auto, .my-auto { margin-bottom: auto !important; } + .ml-auto, .mx-auto { margin-left: auto !important; } + @media (min-width: 576px) { .m-sm-0 { margin: 0 !important; @@ -8613,33 +9327,42 @@ button.bg-dark:hover { content: ""; background-color: rgba(0, 0, 0, 0); } + .text-monospace { font-family: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace !important; } + .text-justify { text-align: justify !important; } + .text-wrap { white-space: normal !important; } + .text-nowrap { white-space: nowrap !important; } + .text-truncate { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } + .text-left { text-align: left !important; } + .text-right { text-align: right !important; } + .text-center { text-align: center !important; } + @media (min-width: 576px) { .text-sm-left { text-align: left !important; @@ -8687,101 +9410,131 @@ button.bg-dark:hover { .text-lowercase { text-transform: lowercase !important; } + .text-uppercase { text-transform: uppercase !important; } + .text-capitalize { text-transform: capitalize !important; } + .font-weight-light { font-weight: 300 !important; } + .font-weight-lighter { font-weight: lighter !important; } + .font-weight-normal { font-weight: 400 !important; } + .font-weight-bold { font-weight: 600 !important; } + .font-weight-bolder { font-weight: bolder !important; } + .font-italic { font-style: italic !important; } + .text-white { - color: #fff !important; + color: #ffffff !important; } + .text-primary { color: #f1641e !important; } -a.text-primary:focus, -a.text-primary:hover { + +a.text-primary:hover, +a.text-primary:focus { color: #b7440b !important; } + .text-secondary { color: #00c853 !important; } -a.text-secondary:focus, -a.text-secondary:hover { + +a.text-secondary:hover, +a.text-secondary:focus { color: #007c33 !important; } + .text-success { color: #6610f2 !important; } -a.text-success:focus, -a.text-success:hover { + +a.text-success:hover, +a.text-success:focus { color: #4709ac !important; } + .text-info { color: #007bff !important; } -a.text-info:focus, -a.text-info:hover { + +a.text-info:hover, +a.text-info:focus { color: #0056b3 !important; } + .text-warning { color: #ffc107 !important; } -a.text-warning:focus, -a.text-warning:hover { + +a.text-warning:hover, +a.text-warning:focus { color: #ba8b00 !important; } + .text-danger { color: #873208 !important; } -a.text-danger:focus, -a.text-danger:hover { + +a.text-danger:hover, +a.text-danger:focus { color: #3f1804 !important; } + .text-light { color: #f8f9fa !important; } -a.text-light:focus, -a.text-light:hover { + +a.text-light:hover, +a.text-light:focus { color: #cbd3da !important; } + .text-dark { color: #343a40 !important; } -a.text-dark:focus, -a.text-dark:hover { + +a.text-dark:hover, +a.text-dark:focus { color: #121416 !important; } + .text-body { color: #495057 !important; } + .text-muted { color: #6c757d !important; } + .text-black-50 { color: rgba(34, 34, 34, 0.5) !important; } + .text-white-50 { color: rgba(255, 255, 255, 0.5) !important; } + .text-hide { font: 0/0 a; color: transparent; @@ -8789,25 +9542,32 @@ a.text-dark:hover { background-color: transparent; border: 0; } + .text-decoration-none { text-decoration: none !important; } + .text-break { + word-break: break-word !important; word-wrap: break-word !important; } + .text-reset { color: inherit !important; } + .visible { visibility: visible !important; } + .invisible { visibility: hidden !important; } + @media print { *, - ::after, - ::before { + *::before, + *::after { text-shadow: none !important; box-shadow: none !important; } @@ -8820,21 +9580,18 @@ a.text-dark:hover { pre { white-space: pre-wrap !important; } - blockquote, - pre { + pre, + blockquote { border: 1px solid #adb5bd; page-break-inside: avoid; } - thead { - display: table-header-group; - } - img, - tr { + tr, + img { page-break-inside: avoid; } + p, h2, - h3, - p { + h3 { orphans: 3; widows: 3; } @@ -8855,26 +9612,26 @@ a.text-dark:hover { display: none; } .badge { - border: 1px solid #222; + border: 1px solid #222222; } .table { border-collapse: collapse !important; } .table td, .table th { - background-color: #fff !important; + background-color: #ffffff !important; } - .table-bordered td, - .table-bordered th { + .table-bordered th, + .table-bordered td { border: 1px solid #dee2e6 !important; } .table-dark { color: inherit; } - .table-dark tbody + tbody, - .table-dark td, .table-dark th, - .table-dark thead th { + .table-dark td, + .table-dark thead th, + .table-dark tbody + tbody { border-color: #495057; } .table .thead-dark th { @@ -8882,3 +9639,5 @@ a.text-dark:hover { border-color: #495057; } } + +/*# sourceMappingURL=litely.css.map */ diff --git a/src/assets/css/themes/litely.scss b/src/assets/css/themes/litely.scss new file mode 100644 index 00000000..061bcc48 --- /dev/null +++ b/src/assets/css/themes/litely.scss @@ -0,0 +1,2 @@ +@import "variables.litely"; +@import "../../../../node_modules/bootstrap-v4/scss/bootstrap";