From d71b2a278fc7e5cd9bdd21510f46624adcfdefff Mon Sep 17 00:00:00 2001 From: Joseph Muller Date: Sat, 2 Nov 2024 19:05:57 +0000 Subject: [PATCH 01/21] Back office CSS settings --- src/static/admin/css/settings.css | 7 +++++++ 1 file changed, 7 insertions(+) diff --git a/src/static/admin/css/settings.css b/src/static/admin/css/settings.css index 9c3e536499..77b0352517 100644 --- a/src/static/admin/css/settings.css +++ b/src/static/admin/css/settings.css @@ -13,4 +13,11 @@ --clr-orcid: rgb(68, 116, 5); --clr-orcid-light: rgb(245, 249, 232); + /* Alpha theme mapping */ + --clr-black: #262522; + --clr-white: #fdfeff; + --clr-tan: #fdf3e3; + --clr-orange: #bb4e30; + --clr-blue: #36565f; + --clr-rust: #c08031; } From 1b15d0d55e90a05fffaffac317fbfe7e0fa1bde9 Mon Sep 17 00:00:00 2001 From: Joseph Muller Date: Sat, 2 Nov 2024 19:07:18 +0000 Subject: [PATCH 02/21] Lint back office app CSS with Prettier --- src/static/admin/css/app.css | 7092 +++++++++++++++++++++------------- 1 file changed, 4440 insertions(+), 2652 deletions(-) diff --git a/src/static/admin/css/app.css b/src/static/admin/css/app.css index 4fc28a6bb8..b628ce97af 100644 --- a/src/static/admin/css/app.css +++ b/src/static/admin/css/app.css @@ -1,5 +1,5 @@ @charset "UTF-8"; -@import url('https://fonts.googleapis.com/css2?family=Open+Sans&display=swap'); +@import url("https://fonts.googleapis.com/css2?family=Open+Sans&display=swap"); /** * Foundation for Sites by ZURB @@ -8,27 +8,35 @@ * Licensed under MIT Open Source */ .kanban .card { - border-color: #ccc; } + border-color: #ccc; +} @media print, screen and (min-width: 40em) { .kanban { width: 100%; height: 90vh; - min-height: 400px; } - .kanban .inner { - height: 95%; } - .kanban .box { - float: left; - width: 450px; - margin-right: 1.25rem; - height: 100%; } - .kanban .box .content { - overflow: auto; - height: 88.5%; } } + min-height: 400px; + } + .kanban .inner { + height: 95%; + } + .kanban .box { + float: left; + width: 450px; + margin-right: 1.25rem; + height: 100%; + } + .kanban .box .content { + overflow: auto; + height: 88.5%; + } +} @media screen and (max-width: 39.9375em) { .kanban .inner { - width: auto !important; } } + width: auto !important; + } +} /* perfect-scrollbar v0.6.16 */ .ps-container { @@ -36,116 +44,159 @@ -ms-touch-action: auto; touch-action: auto; overflow: hidden !important; - -ms-overflow-style: none; } + -ms-overflow-style: none; +} @supports (-ms-overflow-style: none) { .ps-container { - overflow: auto !important; } } + overflow: auto !important; + } +} @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { .ps-container { - overflow: auto !important; } } + overflow: auto !important; + } +} .ps-container.ps-active-x > .ps-scrollbar-x-rail, .ps-container.ps-active-y > .ps-scrollbar-y-rail { display: block; - background-color: transparent; } + background-color: transparent; +} .ps-container.ps-in-scrolling.ps-x > .ps-scrollbar-x-rail { background-color: #eee; - opacity: 0.9; } + opacity: 0.9; +} .ps-container.ps-in-scrolling.ps-x > .ps-scrollbar-x-rail > .ps-scrollbar-x { background-color: #999; - height: 11px; } + height: 11px; +} .ps-container.ps-in-scrolling.ps-y > .ps-scrollbar-y-rail { background-color: #eee; - opacity: 0.9; } + opacity: 0.9; +} .ps-container.ps-in-scrolling.ps-y > .ps-scrollbar-y-rail > .ps-scrollbar-y { background-color: #999; - width: 11px; } + width: 11px; +} .ps-container > .ps-scrollbar-x-rail { display: none; position: absolute; /* please don't change 'position' */ opacity: 0; - transition: background-color .2s linear, opacity .2s linear; + transition: + background-color 0.2s linear, + opacity 0.2s linear; bottom: 0px; /* there must be 'bottom' for ps-scrollbar-x-rail */ - height: 15px; } + height: 15px; +} .ps-container > .ps-scrollbar-x-rail > .ps-scrollbar-x { position: absolute; /* please don't change 'position' */ background-color: #aaa; border-radius: 6px; - transition: background-color .2s linear, height .2s linear, width .2s ease-in-out, border-radius .2s ease-in-out; + transition: + background-color 0.2s linear, + height 0.2s linear, + width 0.2s ease-in-out, + border-radius 0.2s ease-in-out; bottom: 2px; /* there must be 'bottom' for ps-scrollbar-x */ - height: 6px; } + height: 6px; +} -.ps-container > .ps-scrollbar-x-rail:hover > .ps-scrollbar-x, .ps-container > .ps-scrollbar-x-rail:active > .ps-scrollbar-x { - height: 11px; } +.ps-container > .ps-scrollbar-x-rail:hover > .ps-scrollbar-x, +.ps-container > .ps-scrollbar-x-rail:active > .ps-scrollbar-x { + height: 11px; +} .ps-container > .ps-scrollbar-y-rail { display: none; position: absolute; /* please don't change 'position' */ opacity: 0; - transition: background-color .2s linear, opacity .2s linear; + transition: + background-color 0.2s linear, + opacity 0.2s linear; right: 0; /* there must be 'right' for ps-scrollbar-y-rail */ - width: 15px; } + width: 15px; +} .ps-container > .ps-scrollbar-y-rail > .ps-scrollbar-y { position: absolute; /* please don't change 'position' */ background-color: #aaa; border-radius: 6px; - transition: background-color .2s linear, height .2s linear, width .2s ease-in-out, border-radius .2s ease-in-out; + transition: + background-color 0.2s linear, + height 0.2s linear, + width 0.2s ease-in-out, + border-radius 0.2s ease-in-out; right: 2px; /* there must be 'right' for ps-scrollbar-y */ - width: 6px; } + width: 6px; +} -.ps-container > .ps-scrollbar-y-rail:hover > .ps-scrollbar-y, .ps-container > .ps-scrollbar-y-rail:active > .ps-scrollbar-y { - width: 11px; } +.ps-container > .ps-scrollbar-y-rail:hover > .ps-scrollbar-y, +.ps-container > .ps-scrollbar-y-rail:active > .ps-scrollbar-y { + width: 11px; +} .ps-container:hover.ps-in-scrolling.ps-x > .ps-scrollbar-x-rail { background-color: #eee; - opacity: 0.9; } + opacity: 0.9; +} -.ps-container:hover.ps-in-scrolling.ps-x > .ps-scrollbar-x-rail > .ps-scrollbar-x { +.ps-container:hover.ps-in-scrolling.ps-x + > .ps-scrollbar-x-rail + > .ps-scrollbar-x { background-color: #999; - height: 11px; } + height: 11px; +} .ps-container:hover.ps-in-scrolling.ps-y > .ps-scrollbar-y-rail { background-color: #eee; - opacity: 0.9; } + opacity: 0.9; +} -.ps-container:hover.ps-in-scrolling.ps-y > .ps-scrollbar-y-rail > .ps-scrollbar-y { +.ps-container:hover.ps-in-scrolling.ps-y + > .ps-scrollbar-y-rail + > .ps-scrollbar-y { background-color: #999; - width: 11px; } + width: 11px; +} .ps-container:hover > .ps-scrollbar-x-rail, .ps-container:hover > .ps-scrollbar-y-rail { - opacity: 0.6; } + opacity: 0.6; +} .ps-container:hover > .ps-scrollbar-x-rail:hover { background-color: #eee; - opacity: 0.9; } + opacity: 0.9; +} .ps-container:hover > .ps-scrollbar-x-rail:hover > .ps-scrollbar-x { - background-color: #999; } + background-color: #999; +} .ps-container:hover > .ps-scrollbar-y-rail:hover { background-color: #eee; - opacity: 0.9; } + opacity: 0.9; +} .ps-container:hover > .ps-scrollbar-y-rail:hover > .ps-scrollbar-y { - background-color: #999; } + background-color: #999; +} /*! normalize-scss | MIT/GPLv2 License | bit.ly/normalize-scss */ /* Document @@ -164,7 +215,8 @@ html { -ms-text-size-adjust: 100%; /* 3 */ -webkit-text-size-adjust: 100%; - /* 3 */ } + /* 3 */ +} /* Sections ========================================================================== */ @@ -172,7 +224,8 @@ html { * Remove the margin in all browsers (opinionated). */ body { - margin: 0; } + margin: 0; +} /** * Add the correct display in IE 9-. @@ -183,7 +236,8 @@ footer, header, nav, section { - display: block; } + display: block; +} /** * Correct the font size and margin on `h1` elements within `section` and @@ -191,7 +245,8 @@ section { */ h1 { font-size: 2em; - margin: 0.67em 0; } + margin: 0.67em 0; +} /* Grouping content ========================================================================== */ @@ -200,13 +255,15 @@ h1 { */ figcaption, figure { - display: block; } + display: block; +} /** * Add the correct margin in IE 8. */ figure { - margin: 1em 40px; } + margin: 1em 40px; +} /** * 1. Add the correct box sizing in Firefox. @@ -218,13 +275,15 @@ hr { height: 0; /* 1 */ overflow: visible; - /* 2 */ } + /* 2 */ +} /** * Add the correct display in IE. */ main { - display: block; } + display: block; +} /** * 1. Correct the inheritance and scaling of font size in all browsers. @@ -234,7 +293,8 @@ pre { font-family: monospace, monospace; /* 1 */ font-size: 1em; - /* 2 */ } + /* 2 */ +} /* Links ========================================================================== */ @@ -246,7 +306,8 @@ a { background-color: transparent; /* 1 */ -webkit-text-decoration-skip: objects; - /* 2 */ } + /* 2 */ +} /** * Remove the outline on focused links when they are also active or hovered @@ -254,7 +315,8 @@ a { */ a:active, a:hover { - outline-width: 0; } + outline-width: 0; +} /* Text-level semantics ========================================================================== */ @@ -268,21 +330,24 @@ abbr[title] { text-decoration: underline; /* 2 */ text-decoration: underline dotted; - /* 2 */ } + /* 2 */ +} /** * Prevent the duplicate application of `bolder` by the next rule in Safari 6. */ b, strong { - font-weight: inherit; } + font-weight: inherit; +} /** * Add the correct font weight in Chrome, Edge, and Safari. */ b, strong { - font-weight: bolder; } + font-weight: bolder; +} /** * 1. Correct the inheritance and scaling of font size in all browsers. @@ -294,26 +359,30 @@ samp { font-family: monospace, monospace; /* 1 */ font-size: 1em; - /* 2 */ } + /* 2 */ +} /** * Add the correct font style in Android 4.3-. */ dfn { - font-style: italic; } + font-style: italic; +} /** * Add the correct background and color in IE 9-. */ mark { background-color: #ff0; - color: #000; } + color: #000; +} /** * Add the correct font size in all browsers. */ small { - font-size: 80%; } + font-size: 80%; +} /** * Prevent `sub` and `sup` elements from affecting the line height in @@ -324,13 +393,16 @@ sup { font-size: 75%; line-height: 0; position: relative; - vertical-align: baseline; } + vertical-align: baseline; +} sub { - bottom: -0.25em; } + bottom: -0.25em; +} sup { - top: -0.5em; } + top: -0.5em; +} /* Embedded content ========================================================================== */ @@ -339,26 +411,30 @@ sup { */ audio, video { - display: inline-block; } + display: inline-block; +} /** * Add the correct display in iOS 4-7. */ audio:not([controls]) { display: none; - height: 0; } + height: 0; +} /** * Remove the border on images inside links in IE 10-. */ img { - border-style: none; } + border-style: none; +} /** * Hide the overflow in IE. */ svg:not(:root) { - overflow: hidden; } + overflow: hidden; +} /* Forms ========================================================================== */ @@ -378,13 +454,15 @@ textarea { line-height: 1.15; /* 1 */ margin: 0; - /* 2 */ } + /* 2 */ +} /** * Show the overflow in IE. */ button { - overflow: visible; } + overflow: visible; +} /** * Remove the inheritance of text transform in Edge, Firefox, and IE. @@ -393,7 +471,8 @@ button { button, select { /* 1 */ - text-transform: none; } + text-transform: none; +} /** * 1. Prevent a WebKit bug where (2) destroys native `audio` and `video` @@ -405,7 +484,8 @@ html [type="button"], [type="reset"], [type="submit"] { -webkit-appearance: button; - /* 2 */ } + /* 2 */ +} button, [type="button"], @@ -416,24 +496,28 @@ button, */ /** * Restore the focus styles unset by the previous rule. - */ } - button::-moz-focus-inner, - [type="button"]::-moz-focus-inner, - [type="reset"]::-moz-focus-inner, - [type="submit"]::-moz-focus-inner { - border-style: none; - padding: 0; } - button:-moz-focusring, - [type="button"]:-moz-focusring, - [type="reset"]:-moz-focusring, - [type="submit"]:-moz-focusring { - outline: 1px dotted ButtonText; } + */ +} +button::-moz-focus-inner, +[type="button"]::-moz-focus-inner, +[type="reset"]::-moz-focus-inner, +[type="submit"]::-moz-focus-inner { + border-style: none; + padding: 0; +} +button:-moz-focusring, +[type="button"]:-moz-focusring, +[type="reset"]:-moz-focusring, +[type="submit"]:-moz-focusring { + outline: 1px dotted ButtonText; +} /** * Show the overflow in Edge. */ input { - overflow: visible; } + overflow: visible; +} /** * 1. Add the correct box sizing in IE 10-. @@ -444,14 +528,16 @@ input { box-sizing: border-box; /* 1 */ padding: 0; - /* 2 */ } + /* 2 */ +} /** * Correct the cursor style of increment and decrement buttons in Chrome. */ [type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button { - height: auto; } + height: auto; +} /** * 1. Correct the odd appearance in Chrome and Safari. @@ -464,9 +550,12 @@ input { /* 2 */ /** * Remove the inner padding and cancel buttons in Chrome and Safari on macOS. - */ } - [type="search"]::-webkit-search-cancel-button, [type="search"]::-webkit-search-decoration { - -webkit-appearance: none; } + */ +} +[type="search"]::-webkit-search-cancel-button, +[type="search"]::-webkit-search-decoration { + -webkit-appearance: none; +} /** * 1. Correct the inability to style clickable types in iOS and Safari. @@ -476,7 +565,8 @@ input { -webkit-appearance: button; /* 1 */ font: inherit; - /* 2 */ } + /* 2 */ +} /** * Change the border, margin, and padding in all browsers (opinionated). @@ -484,7 +574,8 @@ input { fieldset { border: 1px solid #c0c0c0; margin: 0 2px; - padding: 0.35em 0.625em 0.75em; } + padding: 0.35em 0.625em 0.75em; +} /** * 1. Correct the text wrapping in Edge and IE. @@ -504,7 +595,8 @@ legend { color: inherit; /* 2 */ white-space: normal; - /* 1 */ } + /* 1 */ +} /** * 1. Add the correct display in IE 9-. @@ -514,13 +606,15 @@ progress { display: inline-block; /* 1 */ vertical-align: baseline; - /* 2 */ } + /* 2 */ +} /** * Remove the default vertical scrollbar in IE. */ textarea { - overflow: auto; } + overflow: auto; +} /* Interactive ========================================================================== */ @@ -528,19 +622,22 @@ textarea { * Add the correct display in Edge, IE, and Firefox. */ details { - display: block; } + display: block; +} /* * Add the correct display in all browsers. */ summary { - display: list-item; } + display: list-item; +} /* * Add the correct display in IE 9-. */ menu { - display: block; } + display: block; +} /* Scripting ========================================================================== */ @@ -548,13 +645,15 @@ menu { * Add the correct display in IE 9-. */ canvas { - display: inline-block; } + display: inline-block; +} /** * Add the correct display in IE. */ template { - display: none; } + display: none; +} /* Hidden ========================================================================== */ @@ -562,19 +661,23 @@ template { * Add the correct display in IE 10-. */ [hidden] { - display: none; } + display: none; +} .foundation-mq { - font-family: "small=0em&medium=40em&large=64em&xlarge=75em&xxlarge=90em"; } + font-family: "small=0em&medium=40em&large=64em&xlarge=75em&xxlarge=90em"; +} html { box-sizing: border-box; - font-size: 100%; } + font-size: 100%; +} *, *::before, *::after { - box-sizing: inherit; } + box-sizing: inherit; +} body { margin: 0; @@ -585,23 +688,27 @@ body { line-height: 1.5; color: #0a0a0a; -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; } + -moz-osx-font-smoothing: grayscale; +} img { display: inline-block; vertical-align: middle; max-width: 100%; height: auto; - -ms-interpolation-mode: bicubic; } + -ms-interpolation-mode: bicubic; +} textarea { height: auto; min-height: 50px; - border-radius: 4px; } + border-radius: 4px; +} select { width: 100%; - border-radius: 4px; } + border-radius: 4px; +} .map_canvas img, .map_canvas embed, @@ -609,349 +716,504 @@ select { .mqa-display img, .mqa-display embed, .mqa-display object { - max-width: none !important; } + max-width: none !important; +} button { padding: 0; -webkit-appearance: none; - -moz-appearance: none; - appearance: none; + -moz-appearance: none; + appearance: none; border: 0; border-radius: 4px; background: transparent; - line-height: 1; } - [data-whatinput='mouse'] button { - outline: 0; } + line-height: 1; +} +[data-whatinput="mouse"] button { + outline: 0; +} .is-visible { - display: block !important; } + display: block !important; +} .is-hidden { - display: none !important; } + display: none !important; +} .row { max-width: 75rem; margin-right: auto; - margin-left: auto; } - .row::before, .row::after { - display: table; - content: ' '; } - .row::after { - clear: both; } - .row.collapse > .column, .row.collapse > .columns { - padding-right: 0; - padding-left: 0; } + margin-left: auto; +} +.row::before, +.row::after { + display: table; + content: " "; +} +.row::after { + clear: both; +} +.row.collapse > .column, +.row.collapse > .columns { + padding-right: 0; + padding-left: 0; +} +.row .row { + margin-right: -0.625rem; + margin-left: -0.625rem; +} +@media print, screen and (min-width: 40em) { .row .row { - margin-right: -0.625rem; - margin-left: -0.625rem; } - @media print, screen and (min-width: 40em) { - .row .row { - margin-right: -0.9375rem; - margin-left: -0.9375rem; } } - @media print, screen and (min-width: 64em) { - .row .row { - margin-right: -0.9375rem; - margin-left: -0.9375rem; } } - .row .row.collapse { - margin-right: 0; - margin-left: 0; } - .row.expanded { - max-width: none; } - .row.expanded .row { - margin-right: auto; - margin-left: auto; } - .row.gutter-small > .column, .row.gutter-small > .columns { - padding-right: 0.625rem; - padding-left: 0.625rem; } - .row.gutter-medium > .column, .row.gutter-medium > .columns { - padding-right: 0.9375rem; - padding-left: 0.9375rem; } + margin-right: -0.9375rem; + margin-left: -0.9375rem; + } +} +@media print, screen and (min-width: 64em) { + .row .row { + margin-right: -0.9375rem; + margin-left: -0.9375rem; + } +} +.row .row.collapse { + margin-right: 0; + margin-left: 0; +} +.row.expanded { + max-width: none; +} +.row.expanded .row { + margin-right: auto; + margin-left: auto; +} +.row.gutter-small > .column, +.row.gutter-small > .columns { + padding-right: 0.625rem; + padding-left: 0.625rem; +} +.row.gutter-medium > .column, +.row.gutter-medium > .columns { + padding-right: 0.9375rem; + padding-left: 0.9375rem; +} -.column, .columns { +.column, +.columns { width: 100%; float: left; padding-right: 0.625rem; - padding-left: 0.625rem; } - @media print, screen and (min-width: 40em) { - .column, .columns { - padding-right: 0.9375rem; - padding-left: 0.9375rem; } } - .column:last-child:not(:first-child), .columns:last-child:not(:first-child) { - float: right; } - .column.end:last-child:last-child, .end.columns:last-child:last-child { - float: left; } - -.column.row.row, .row.row.columns { - float: none; } - -.row .column.row.row, .row .row.row.columns { + padding-left: 0.625rem; +} +@media print, screen and (min-width: 40em) { + .column, + .columns { + padding-right: 0.9375rem; + padding-left: 0.9375rem; + } +} +.column:last-child:not(:first-child), +.columns:last-child:not(:first-child) { + float: right; +} +.column.end:last-child:last-child, +.end.columns:last-child:last-child { + float: left; +} + +.column.row.row, +.row.row.columns { + float: none; +} + +.row .column.row.row, +.row .row.row.columns { margin-right: 0; margin-left: 0; padding-right: 0; - padding-left: 0; } + padding-left: 0; +} .small-1 { - width: 8.33333%; } + width: 8.33333%; +} .small-push-1 { position: relative; - left: 8.33333%; } + left: 8.33333%; +} .small-pull-1 { position: relative; - left: -8.33333%; } + left: -8.33333%; +} .small-offset-0 { - margin-left: 0%; } + margin-left: 0%; +} .small-2 { - width: 16.66667%; } + width: 16.66667%; +} .small-push-2 { position: relative; - left: 16.66667%; } + left: 16.66667%; +} .small-pull-2 { position: relative; - left: -16.66667%; } + left: -16.66667%; +} .small-offset-1 { - margin-left: 8.33333%; } + margin-left: 8.33333%; +} .small-3 { - width: 25%; } + width: 25%; +} .small-push-3 { position: relative; - left: 25%; } + left: 25%; +} .small-pull-3 { position: relative; - left: -25%; } + left: -25%; +} .small-offset-2 { - margin-left: 16.66667%; } + margin-left: 16.66667%; +} .small-4 { - width: 33.33333%; } + width: 33.33333%; +} .small-push-4 { position: relative; - left: 33.33333%; } + left: 33.33333%; +} .small-pull-4 { position: relative; - left: -33.33333%; } + left: -33.33333%; +} .small-offset-3 { - margin-left: 25%; } + margin-left: 25%; +} .small-5 { - width: 41.66667%; } + width: 41.66667%; +} .small-push-5 { position: relative; - left: 41.66667%; } + left: 41.66667%; +} .small-pull-5 { position: relative; - left: -41.66667%; } + left: -41.66667%; +} .small-offset-4 { - margin-left: 33.33333%; } + margin-left: 33.33333%; +} .small-6 { - width: 50%; } + width: 50%; +} .small-push-6 { position: relative; - left: 50%; } + left: 50%; +} .small-pull-6 { position: relative; - left: -50%; } + left: -50%; +} .small-offset-5 { - margin-left: 41.66667%; } + margin-left: 41.66667%; +} .small-7 { - width: 58.33333%; } + width: 58.33333%; +} .small-push-7 { position: relative; - left: 58.33333%; } + left: 58.33333%; +} .small-pull-7 { position: relative; - left: -58.33333%; } + left: -58.33333%; +} .small-offset-6 { - margin-left: 50%; } + margin-left: 50%; +} .small-8 { - width: 66.66667%; } + width: 66.66667%; +} .small-push-8 { position: relative; - left: 66.66667%; } + left: 66.66667%; +} .small-pull-8 { position: relative; - left: -66.66667%; } + left: -66.66667%; +} .small-offset-7 { - margin-left: 58.33333%; } + margin-left: 58.33333%; +} .small-9 { - width: 75%; } + width: 75%; +} .small-push-9 { position: relative; - left: 75%; } + left: 75%; +} .small-pull-9 { position: relative; - left: -75%; } + left: -75%; +} .small-offset-8 { - margin-left: 66.66667%; } + margin-left: 66.66667%; +} .small-10 { - width: 83.33333%; } + width: 83.33333%; +} .small-push-10 { position: relative; - left: 83.33333%; } + left: 83.33333%; +} .small-pull-10 { position: relative; - left: -83.33333%; } + left: -83.33333%; +} .small-offset-9 { - margin-left: 75%; } + margin-left: 75%; +} .small-11 { - width: 91.66667%; } + width: 91.66667%; +} .small-push-11 { position: relative; - left: 91.66667%; } + left: 91.66667%; +} .small-pull-11 { position: relative; - left: -91.66667%; } + left: -91.66667%; +} .small-offset-10 { - margin-left: 83.33333%; } + margin-left: 83.33333%; +} .small-12 { - width: 100%; } + width: 100%; +} .small-offset-11 { - margin-left: 91.66667%; } + margin-left: 91.66667%; +} -.small-up-1 > .column, .small-up-1 > .columns { +.small-up-1 > .column, +.small-up-1 > .columns { float: left; - width: 100%; } - .small-up-1 > .column:nth-of-type(1n), .small-up-1 > .columns:nth-of-type(1n) { - clear: none; } - .small-up-1 > .column:nth-of-type(1n+1), .small-up-1 > .columns:nth-of-type(1n+1) { - clear: both; } - .small-up-1 > .column:last-child, .small-up-1 > .columns:last-child { - float: left; } - -.small-up-2 > .column, .small-up-2 > .columns { + width: 100%; +} +.small-up-1 > .column:nth-of-type(1n), +.small-up-1 > .columns:nth-of-type(1n) { + clear: none; +} +.small-up-1 > .column:nth-of-type(1n + 1), +.small-up-1 > .columns:nth-of-type(1n + 1) { + clear: both; +} +.small-up-1 > .column:last-child, +.small-up-1 > .columns:last-child { float: left; - width: 50%; } - .small-up-2 > .column:nth-of-type(1n), .small-up-2 > .columns:nth-of-type(1n) { - clear: none; } - .small-up-2 > .column:nth-of-type(2n+1), .small-up-2 > .columns:nth-of-type(2n+1) { - clear: both; } - .small-up-2 > .column:last-child, .small-up-2 > .columns:last-child { - float: left; } - -.small-up-3 > .column, .small-up-3 > .columns { +} + +.small-up-2 > .column, +.small-up-2 > .columns { float: left; - width: 33.33333%; } - .small-up-3 > .column:nth-of-type(1n), .small-up-3 > .columns:nth-of-type(1n) { - clear: none; } - .small-up-3 > .column:nth-of-type(3n+1), .small-up-3 > .columns:nth-of-type(3n+1) { - clear: both; } - .small-up-3 > .column:last-child, .small-up-3 > .columns:last-child { - float: left; } - -.small-up-4 > .column, .small-up-4 > .columns { + width: 50%; +} +.small-up-2 > .column:nth-of-type(1n), +.small-up-2 > .columns:nth-of-type(1n) { + clear: none; +} +.small-up-2 > .column:nth-of-type(2n + 1), +.small-up-2 > .columns:nth-of-type(2n + 1) { + clear: both; +} +.small-up-2 > .column:last-child, +.small-up-2 > .columns:last-child { float: left; - width: 25%; } - .small-up-4 > .column:nth-of-type(1n), .small-up-4 > .columns:nth-of-type(1n) { - clear: none; } - .small-up-4 > .column:nth-of-type(4n+1), .small-up-4 > .columns:nth-of-type(4n+1) { - clear: both; } - .small-up-4 > .column:last-child, .small-up-4 > .columns:last-child { - float: left; } - -.small-up-5 > .column, .small-up-5 > .columns { +} + +.small-up-3 > .column, +.small-up-3 > .columns { float: left; - width: 20%; } - .small-up-5 > .column:nth-of-type(1n), .small-up-5 > .columns:nth-of-type(1n) { - clear: none; } - .small-up-5 > .column:nth-of-type(5n+1), .small-up-5 > .columns:nth-of-type(5n+1) { - clear: both; } - .small-up-5 > .column:last-child, .small-up-5 > .columns:last-child { - float: left; } - -.small-up-6 > .column, .small-up-6 > .columns { + width: 33.33333%; +} +.small-up-3 > .column:nth-of-type(1n), +.small-up-3 > .columns:nth-of-type(1n) { + clear: none; +} +.small-up-3 > .column:nth-of-type(3n + 1), +.small-up-3 > .columns:nth-of-type(3n + 1) { + clear: both; +} +.small-up-3 > .column:last-child, +.small-up-3 > .columns:last-child { float: left; - width: 16.66667%; } - .small-up-6 > .column:nth-of-type(1n), .small-up-6 > .columns:nth-of-type(1n) { - clear: none; } - .small-up-6 > .column:nth-of-type(6n+1), .small-up-6 > .columns:nth-of-type(6n+1) { - clear: both; } - .small-up-6 > .column:last-child, .small-up-6 > .columns:last-child { - float: left; } - -.small-up-7 > .column, .small-up-7 > .columns { +} + +.small-up-4 > .column, +.small-up-4 > .columns { float: left; - width: 14.28571%; } - .small-up-7 > .column:nth-of-type(1n), .small-up-7 > .columns:nth-of-type(1n) { - clear: none; } - .small-up-7 > .column:nth-of-type(7n+1), .small-up-7 > .columns:nth-of-type(7n+1) { - clear: both; } - .small-up-7 > .column:last-child, .small-up-7 > .columns:last-child { - float: left; } - -.small-up-8 > .column, .small-up-8 > .columns { + width: 25%; +} +.small-up-4 > .column:nth-of-type(1n), +.small-up-4 > .columns:nth-of-type(1n) { + clear: none; +} +.small-up-4 > .column:nth-of-type(4n + 1), +.small-up-4 > .columns:nth-of-type(4n + 1) { + clear: both; +} +.small-up-4 > .column:last-child, +.small-up-4 > .columns:last-child { float: left; - width: 12.5%; } - .small-up-8 > .column:nth-of-type(1n), .small-up-8 > .columns:nth-of-type(1n) { - clear: none; } - .small-up-8 > .column:nth-of-type(8n+1), .small-up-8 > .columns:nth-of-type(8n+1) { - clear: both; } - .small-up-8 > .column:last-child, .small-up-8 > .columns:last-child { - float: left; } - -.small-collapse > .column, .small-collapse > .columns { - padding-right: 0; - padding-left: 0; } +} + +.small-up-5 > .column, +.small-up-5 > .columns { + float: left; + width: 20%; +} +.small-up-5 > .column:nth-of-type(1n), +.small-up-5 > .columns:nth-of-type(1n) { + clear: none; +} +.small-up-5 > .column:nth-of-type(5n + 1), +.small-up-5 > .columns:nth-of-type(5n + 1) { + clear: both; +} +.small-up-5 > .column:last-child, +.small-up-5 > .columns:last-child { + float: left; +} + +.small-up-6 > .column, +.small-up-6 > .columns { + float: left; + width: 16.66667%; +} +.small-up-6 > .column:nth-of-type(1n), +.small-up-6 > .columns:nth-of-type(1n) { + clear: none; +} +.small-up-6 > .column:nth-of-type(6n + 1), +.small-up-6 > .columns:nth-of-type(6n + 1) { + clear: both; +} +.small-up-6 > .column:last-child, +.small-up-6 > .columns:last-child { + float: left; +} + +.small-up-7 > .column, +.small-up-7 > .columns { + float: left; + width: 14.28571%; +} +.small-up-7 > .column:nth-of-type(1n), +.small-up-7 > .columns:nth-of-type(1n) { + clear: none; +} +.small-up-7 > .column:nth-of-type(7n + 1), +.small-up-7 > .columns:nth-of-type(7n + 1) { + clear: both; +} +.small-up-7 > .column:last-child, +.small-up-7 > .columns:last-child { + float: left; +} + +.small-up-8 > .column, +.small-up-8 > .columns { + float: left; + width: 12.5%; +} +.small-up-8 > .column:nth-of-type(1n), +.small-up-8 > .columns:nth-of-type(1n) { + clear: none; +} +.small-up-8 > .column:nth-of-type(8n + 1), +.small-up-8 > .columns:nth-of-type(8n + 1) { + clear: both; +} +.small-up-8 > .column:last-child, +.small-up-8 > .columns:last-child { + float: left; +} + +.small-collapse > .column, +.small-collapse > .columns { + padding-right: 0; + padding-left: 0; +} .small-collapse .row { margin-right: 0; - margin-left: 0; } + margin-left: 0; +} .expanded.row .small-collapse.row { margin-right: 0; - margin-left: 0; } + margin-left: 0; +} -.small-uncollapse > .column, .small-uncollapse > .columns { +.small-uncollapse > .column, +.small-uncollapse > .columns { padding-right: 0.625rem; - padding-left: 0.625rem; } + padding-left: 0.625rem; +} .small-centered { margin-right: auto; - margin-left: auto; } - .small-centered, .small-centered:last-child:not(:first-child) { - float: none; - clear: both; } + margin-left: auto; +} +.small-centered, +.small-centered:last-child:not(:first-child) { + float: none; + clear: both; +} .small-uncentered, .small-push-0, @@ -959,444 +1221,692 @@ button { position: static; float: left; margin-right: 0; - margin-left: 0; } + margin-left: 0; +} @media print, screen and (min-width: 40em) { .medium-1 { - width: 8.33333%; } + width: 8.33333%; + } .medium-push-1 { position: relative; - left: 8.33333%; } + left: 8.33333%; + } .medium-pull-1 { position: relative; - left: -8.33333%; } + left: -8.33333%; + } .medium-offset-0 { - margin-left: 0%; } + margin-left: 0%; + } .medium-2 { - width: 16.66667%; } + width: 16.66667%; + } .medium-push-2 { position: relative; - left: 16.66667%; } + left: 16.66667%; + } .medium-pull-2 { position: relative; - left: -16.66667%; } + left: -16.66667%; + } .medium-offset-1 { - margin-left: 8.33333%; } + margin-left: 8.33333%; + } .medium-3 { - width: 25%; } + width: 25%; + } .medium-push-3 { position: relative; - left: 25%; } + left: 25%; + } .medium-pull-3 { position: relative; - left: -25%; } + left: -25%; + } .medium-offset-2 { - margin-left: 16.66667%; } + margin-left: 16.66667%; + } .medium-4 { - width: 33.33333%; } + width: 33.33333%; + } .medium-push-4 { position: relative; - left: 33.33333%; } + left: 33.33333%; + } .medium-pull-4 { position: relative; - left: -33.33333%; } + left: -33.33333%; + } .medium-offset-3 { - margin-left: 25%; } + margin-left: 25%; + } .medium-5 { - width: 41.66667%; } + width: 41.66667%; + } .medium-push-5 { position: relative; - left: 41.66667%; } + left: 41.66667%; + } .medium-pull-5 { position: relative; - left: -41.66667%; } + left: -41.66667%; + } .medium-offset-4 { - margin-left: 33.33333%; } + margin-left: 33.33333%; + } .medium-6 { - width: 50%; } + width: 50%; + } .medium-push-6 { position: relative; - left: 50%; } + left: 50%; + } .medium-pull-6 { position: relative; - left: -50%; } + left: -50%; + } .medium-offset-5 { - margin-left: 41.66667%; } + margin-left: 41.66667%; + } .medium-7 { - width: 58.33333%; } + width: 58.33333%; + } .medium-push-7 { position: relative; - left: 58.33333%; } + left: 58.33333%; + } .medium-pull-7 { position: relative; - left: -58.33333%; } + left: -58.33333%; + } .medium-offset-6 { - margin-left: 50%; } + margin-left: 50%; + } .medium-8 { - width: 66.66667%; } + width: 66.66667%; + } .medium-push-8 { position: relative; - left: 66.66667%; } + left: 66.66667%; + } .medium-pull-8 { position: relative; - left: -66.66667%; } + left: -66.66667%; + } .medium-offset-7 { - margin-left: 58.33333%; } + margin-left: 58.33333%; + } .medium-9 { - width: 75%; } + width: 75%; + } .medium-push-9 { position: relative; - left: 75%; } + left: 75%; + } .medium-pull-9 { position: relative; - left: -75%; } + left: -75%; + } .medium-offset-8 { - margin-left: 66.66667%; } + margin-left: 66.66667%; + } .medium-10 { - width: 83.33333%; } + width: 83.33333%; + } .medium-push-10 { position: relative; - left: 83.33333%; } + left: 83.33333%; + } .medium-pull-10 { position: relative; - left: -83.33333%; } + left: -83.33333%; + } .medium-offset-9 { - margin-left: 75%; } + margin-left: 75%; + } .medium-11 { - width: 91.66667%; } + width: 91.66667%; + } .medium-push-11 { position: relative; - left: 91.66667%; } + left: 91.66667%; + } .medium-pull-11 { position: relative; - left: -91.66667%; } + left: -91.66667%; + } .medium-offset-10 { - margin-left: 83.33333%; } + margin-left: 83.33333%; + } .medium-12 { - width: 100%; } + width: 100%; + } .medium-offset-11 { - margin-left: 91.66667%; } - .medium-up-1 > .column, .medium-up-1 > .columns { + margin-left: 91.66667%; + } + .medium-up-1 > .column, + .medium-up-1 > .columns { float: left; - width: 100%; } - .medium-up-1 > .column:nth-of-type(1n), .medium-up-1 > .columns:nth-of-type(1n) { - clear: none; } - .medium-up-1 > .column:nth-of-type(1n+1), .medium-up-1 > .columns:nth-of-type(1n+1) { - clear: both; } - .medium-up-1 > .column:last-child, .medium-up-1 > .columns:last-child { - float: left; } - .medium-up-2 > .column, .medium-up-2 > .columns { + width: 100%; + } + .medium-up-1 > .column:nth-of-type(1n), + .medium-up-1 > .columns:nth-of-type(1n) { + clear: none; + } + .medium-up-1 > .column:nth-of-type(1n + 1), + .medium-up-1 > .columns:nth-of-type(1n + 1) { + clear: both; + } + .medium-up-1 > .column:last-child, + .medium-up-1 > .columns:last-child { + float: left; + } + .medium-up-2 > .column, + .medium-up-2 > .columns { + float: left; + width: 50%; + } + .medium-up-2 > .column:nth-of-type(1n), + .medium-up-2 > .columns:nth-of-type(1n) { + clear: none; + } + .medium-up-2 > .column:nth-of-type(2n + 1), + .medium-up-2 > .columns:nth-of-type(2n + 1) { + clear: both; + } + .medium-up-2 > .column:last-child, + .medium-up-2 > .columns:last-child { + float: left; + } + .medium-up-3 > .column, + .medium-up-3 > .columns { + float: left; + width: 33.33333%; + } + .medium-up-3 > .column:nth-of-type(1n), + .medium-up-3 > .columns:nth-of-type(1n) { + clear: none; + } + .medium-up-3 > .column:nth-of-type(3n + 1), + .medium-up-3 > .columns:nth-of-type(3n + 1) { + clear: both; + } + .medium-up-3 > .column:last-child, + .medium-up-3 > .columns:last-child { float: left; - width: 50%; } - .medium-up-2 > .column:nth-of-type(1n), .medium-up-2 > .columns:nth-of-type(1n) { - clear: none; } - .medium-up-2 > .column:nth-of-type(2n+1), .medium-up-2 > .columns:nth-of-type(2n+1) { - clear: both; } - .medium-up-2 > .column:last-child, .medium-up-2 > .columns:last-child { - float: left; } - .medium-up-3 > .column, .medium-up-3 > .columns { + } + .medium-up-4 > .column, + .medium-up-4 > .columns { + float: left; + width: 25%; + } + .medium-up-4 > .column:nth-of-type(1n), + .medium-up-4 > .columns:nth-of-type(1n) { + clear: none; + } + .medium-up-4 > .column:nth-of-type(4n + 1), + .medium-up-4 > .columns:nth-of-type(4n + 1) { + clear: both; + } + .medium-up-4 > .column:last-child, + .medium-up-4 > .columns:last-child { + float: left; + } + .medium-up-5 > .column, + .medium-up-5 > .columns { + float: left; + width: 20%; + } + .medium-up-5 > .column:nth-of-type(1n), + .medium-up-5 > .columns:nth-of-type(1n) { + clear: none; + } + .medium-up-5 > .column:nth-of-type(5n + 1), + .medium-up-5 > .columns:nth-of-type(5n + 1) { + clear: both; + } + .medium-up-5 > .column:last-child, + .medium-up-5 > .columns:last-child { + float: left; + } + .medium-up-6 > .column, + .medium-up-6 > .columns { float: left; - width: 33.33333%; } - .medium-up-3 > .column:nth-of-type(1n), .medium-up-3 > .columns:nth-of-type(1n) { - clear: none; } - .medium-up-3 > .column:nth-of-type(3n+1), .medium-up-3 > .columns:nth-of-type(3n+1) { - clear: both; } - .medium-up-3 > .column:last-child, .medium-up-3 > .columns:last-child { - float: left; } - .medium-up-4 > .column, .medium-up-4 > .columns { + width: 16.66667%; + } + .medium-up-6 > .column:nth-of-type(1n), + .medium-up-6 > .columns:nth-of-type(1n) { + clear: none; + } + .medium-up-6 > .column:nth-of-type(6n + 1), + .medium-up-6 > .columns:nth-of-type(6n + 1) { + clear: both; + } + .medium-up-6 > .column:last-child, + .medium-up-6 > .columns:last-child { float: left; - width: 25%; } - .medium-up-4 > .column:nth-of-type(1n), .medium-up-4 > .columns:nth-of-type(1n) { - clear: none; } - .medium-up-4 > .column:nth-of-type(4n+1), .medium-up-4 > .columns:nth-of-type(4n+1) { - clear: both; } - .medium-up-4 > .column:last-child, .medium-up-4 > .columns:last-child { - float: left; } - .medium-up-5 > .column, .medium-up-5 > .columns { + } + .medium-up-7 > .column, + .medium-up-7 > .columns { float: left; - width: 20%; } - .medium-up-5 > .column:nth-of-type(1n), .medium-up-5 > .columns:nth-of-type(1n) { - clear: none; } - .medium-up-5 > .column:nth-of-type(5n+1), .medium-up-5 > .columns:nth-of-type(5n+1) { - clear: both; } - .medium-up-5 > .column:last-child, .medium-up-5 > .columns:last-child { - float: left; } - .medium-up-6 > .column, .medium-up-6 > .columns { + width: 14.28571%; + } + .medium-up-7 > .column:nth-of-type(1n), + .medium-up-7 > .columns:nth-of-type(1n) { + clear: none; + } + .medium-up-7 > .column:nth-of-type(7n + 1), + .medium-up-7 > .columns:nth-of-type(7n + 1) { + clear: both; + } + .medium-up-7 > .column:last-child, + .medium-up-7 > .columns:last-child { float: left; - width: 16.66667%; } - .medium-up-6 > .column:nth-of-type(1n), .medium-up-6 > .columns:nth-of-type(1n) { - clear: none; } - .medium-up-6 > .column:nth-of-type(6n+1), .medium-up-6 > .columns:nth-of-type(6n+1) { - clear: both; } - .medium-up-6 > .column:last-child, .medium-up-6 > .columns:last-child { - float: left; } - .medium-up-7 > .column, .medium-up-7 > .columns { + } + .medium-up-8 > .column, + .medium-up-8 > .columns { float: left; - width: 14.28571%; } - .medium-up-7 > .column:nth-of-type(1n), .medium-up-7 > .columns:nth-of-type(1n) { - clear: none; } - .medium-up-7 > .column:nth-of-type(7n+1), .medium-up-7 > .columns:nth-of-type(7n+1) { - clear: both; } - .medium-up-7 > .column:last-child, .medium-up-7 > .columns:last-child { - float: left; } - .medium-up-8 > .column, .medium-up-8 > .columns { + width: 12.5%; + } + .medium-up-8 > .column:nth-of-type(1n), + .medium-up-8 > .columns:nth-of-type(1n) { + clear: none; + } + .medium-up-8 > .column:nth-of-type(8n + 1), + .medium-up-8 > .columns:nth-of-type(8n + 1) { + clear: both; + } + .medium-up-8 > .column:last-child, + .medium-up-8 > .columns:last-child { float: left; - width: 12.5%; } - .medium-up-8 > .column:nth-of-type(1n), .medium-up-8 > .columns:nth-of-type(1n) { - clear: none; } - .medium-up-8 > .column:nth-of-type(8n+1), .medium-up-8 > .columns:nth-of-type(8n+1) { - clear: both; } - .medium-up-8 > .column:last-child, .medium-up-8 > .columns:last-child { - float: left; } - .medium-collapse > .column, .medium-collapse > .columns { + } + .medium-collapse > .column, + .medium-collapse > .columns { padding-right: 0; - padding-left: 0; } + padding-left: 0; + } .medium-collapse .row { margin-right: 0; - margin-left: 0; } + margin-left: 0; + } .expanded.row .medium-collapse.row { margin-right: 0; - margin-left: 0; } - .medium-uncollapse > .column, .medium-uncollapse > .columns { + margin-left: 0; + } + .medium-uncollapse > .column, + .medium-uncollapse > .columns { padding-right: 0.9375rem; - padding-left: 0.9375rem; } + padding-left: 0.9375rem; + } .medium-centered { margin-right: auto; - margin-left: auto; } - .medium-centered, .medium-centered:last-child:not(:first-child) { - float: none; - clear: both; } + margin-left: auto; + } + .medium-centered, + .medium-centered:last-child:not(:first-child) { + float: none; + clear: both; + } .medium-uncentered, .medium-push-0, .medium-pull-0 { position: static; float: left; margin-right: 0; - margin-left: 0; } } + margin-left: 0; + } +} @media print, screen and (min-width: 64em) { .large-1 { - width: 8.33333%; } + width: 8.33333%; + } .large-push-1 { position: relative; - left: 8.33333%; } + left: 8.33333%; + } .large-pull-1 { position: relative; - left: -8.33333%; } + left: -8.33333%; + } .large-offset-0 { - margin-left: 0%; } + margin-left: 0%; + } .large-2 { - width: 16.66667%; } + width: 16.66667%; + } .large-push-2 { position: relative; - left: 16.66667%; } + left: 16.66667%; + } .large-pull-2 { position: relative; - left: -16.66667%; } + left: -16.66667%; + } .large-offset-1 { - margin-left: 8.33333%; } + margin-left: 8.33333%; + } .large-3 { - width: 25%; } + width: 25%; + } .large-push-3 { position: relative; - left: 25%; } + left: 25%; + } .large-pull-3 { position: relative; - left: -25%; } + left: -25%; + } .large-offset-2 { - margin-left: 16.66667%; } + margin-left: 16.66667%; + } .large-4 { - width: 33.33333%; } + width: 33.33333%; + } .large-push-4 { position: relative; - left: 33.33333%; } + left: 33.33333%; + } .large-pull-4 { position: relative; - left: -33.33333%; } + left: -33.33333%; + } .large-offset-3 { - margin-left: 25%; } + margin-left: 25%; + } .large-5 { - width: 41.66667%; } + width: 41.66667%; + } .large-push-5 { position: relative; - left: 41.66667%; } + left: 41.66667%; + } .large-pull-5 { position: relative; - left: -41.66667%; } + left: -41.66667%; + } .large-offset-4 { - margin-left: 33.33333%; } + margin-left: 33.33333%; + } .large-6 { - width: 50%; } + width: 50%; + } .large-push-6 { position: relative; - left: 50%; } + left: 50%; + } .large-pull-6 { position: relative; - left: -50%; } + left: -50%; + } .large-offset-5 { - margin-left: 41.66667%; } + margin-left: 41.66667%; + } .large-7 { - width: 58.33333%; } + width: 58.33333%; + } .large-push-7 { position: relative; - left: 58.33333%; } + left: 58.33333%; + } .large-pull-7 { position: relative; - left: -58.33333%; } + left: -58.33333%; + } .large-offset-6 { - margin-left: 50%; } + margin-left: 50%; + } .large-8 { - width: 66.66667%; } + width: 66.66667%; + } .large-push-8 { position: relative; - left: 66.66667%; } + left: 66.66667%; + } .large-pull-8 { position: relative; - left: -66.66667%; } + left: -66.66667%; + } .large-offset-7 { - margin-left: 58.33333%; } + margin-left: 58.33333%; + } .large-9 { - width: 75%; } + width: 75%; + } .large-push-9 { position: relative; - left: 75%; } + left: 75%; + } .large-pull-9 { position: relative; - left: -75%; } + left: -75%; + } .large-offset-8 { - margin-left: 66.66667%; } + margin-left: 66.66667%; + } .large-10 { - width: 83.33333%; } + width: 83.33333%; + } .large-push-10 { position: relative; - left: 83.33333%; } + left: 83.33333%; + } .large-pull-10 { position: relative; - left: -83.33333%; } + left: -83.33333%; + } .large-offset-9 { - margin-left: 75%; } + margin-left: 75%; + } .large-11 { - width: 91.66667%; } + width: 91.66667%; + } .large-push-11 { position: relative; - left: 91.66667%; } + left: 91.66667%; + } .large-pull-11 { position: relative; - left: -91.66667%; } + left: -91.66667%; + } .large-offset-10 { - margin-left: 83.33333%; } + margin-left: 83.33333%; + } .large-12 { - width: 100%; } + width: 100%; + } .large-offset-11 { - margin-left: 91.66667%; } - .large-up-1 > .column, .large-up-1 > .columns { + margin-left: 91.66667%; + } + .large-up-1 > .column, + .large-up-1 > .columns { + float: left; + width: 100%; + } + .large-up-1 > .column:nth-of-type(1n), + .large-up-1 > .columns:nth-of-type(1n) { + clear: none; + } + .large-up-1 > .column:nth-of-type(1n + 1), + .large-up-1 > .columns:nth-of-type(1n + 1) { + clear: both; + } + .large-up-1 > .column:last-child, + .large-up-1 > .columns:last-child { + float: left; + } + .large-up-2 > .column, + .large-up-2 > .columns { + float: left; + width: 50%; + } + .large-up-2 > .column:nth-of-type(1n), + .large-up-2 > .columns:nth-of-type(1n) { + clear: none; + } + .large-up-2 > .column:nth-of-type(2n + 1), + .large-up-2 > .columns:nth-of-type(2n + 1) { + clear: both; + } + .large-up-2 > .column:last-child, + .large-up-2 > .columns:last-child { float: left; - width: 100%; } - .large-up-1 > .column:nth-of-type(1n), .large-up-1 > .columns:nth-of-type(1n) { - clear: none; } - .large-up-1 > .column:nth-of-type(1n+1), .large-up-1 > .columns:nth-of-type(1n+1) { - clear: both; } - .large-up-1 > .column:last-child, .large-up-1 > .columns:last-child { - float: left; } - .large-up-2 > .column, .large-up-2 > .columns { + } + .large-up-3 > .column, + .large-up-3 > .columns { + float: left; + width: 33.33333%; + } + .large-up-3 > .column:nth-of-type(1n), + .large-up-3 > .columns:nth-of-type(1n) { + clear: none; + } + .large-up-3 > .column:nth-of-type(3n + 1), + .large-up-3 > .columns:nth-of-type(3n + 1) { + clear: both; + } + .large-up-3 > .column:last-child, + .large-up-3 > .columns:last-child { + float: left; + } + .large-up-4 > .column, + .large-up-4 > .columns { + float: left; + width: 25%; + } + .large-up-4 > .column:nth-of-type(1n), + .large-up-4 > .columns:nth-of-type(1n) { + clear: none; + } + .large-up-4 > .column:nth-of-type(4n + 1), + .large-up-4 > .columns:nth-of-type(4n + 1) { + clear: both; + } + .large-up-4 > .column:last-child, + .large-up-4 > .columns:last-child { + float: left; + } + .large-up-5 > .column, + .large-up-5 > .columns { + float: left; + width: 20%; + } + .large-up-5 > .column:nth-of-type(1n), + .large-up-5 > .columns:nth-of-type(1n) { + clear: none; + } + .large-up-5 > .column:nth-of-type(5n + 1), + .large-up-5 > .columns:nth-of-type(5n + 1) { + clear: both; + } + .large-up-5 > .column:last-child, + .large-up-5 > .columns:last-child { float: left; - width: 50%; } - .large-up-2 > .column:nth-of-type(1n), .large-up-2 > .columns:nth-of-type(1n) { - clear: none; } - .large-up-2 > .column:nth-of-type(2n+1), .large-up-2 > .columns:nth-of-type(2n+1) { - clear: both; } - .large-up-2 > .column:last-child, .large-up-2 > .columns:last-child { - float: left; } - .large-up-3 > .column, .large-up-3 > .columns { + } + .large-up-6 > .column, + .large-up-6 > .columns { float: left; - width: 33.33333%; } - .large-up-3 > .column:nth-of-type(1n), .large-up-3 > .columns:nth-of-type(1n) { - clear: none; } - .large-up-3 > .column:nth-of-type(3n+1), .large-up-3 > .columns:nth-of-type(3n+1) { - clear: both; } - .large-up-3 > .column:last-child, .large-up-3 > .columns:last-child { - float: left; } - .large-up-4 > .column, .large-up-4 > .columns { + width: 16.66667%; + } + .large-up-6 > .column:nth-of-type(1n), + .large-up-6 > .columns:nth-of-type(1n) { + clear: none; + } + .large-up-6 > .column:nth-of-type(6n + 1), + .large-up-6 > .columns:nth-of-type(6n + 1) { + clear: both; + } + .large-up-6 > .column:last-child, + .large-up-6 > .columns:last-child { float: left; - width: 25%; } - .large-up-4 > .column:nth-of-type(1n), .large-up-4 > .columns:nth-of-type(1n) { - clear: none; } - .large-up-4 > .column:nth-of-type(4n+1), .large-up-4 > .columns:nth-of-type(4n+1) { - clear: both; } - .large-up-4 > .column:last-child, .large-up-4 > .columns:last-child { - float: left; } - .large-up-5 > .column, .large-up-5 > .columns { + } + .large-up-7 > .column, + .large-up-7 > .columns { float: left; - width: 20%; } - .large-up-5 > .column:nth-of-type(1n), .large-up-5 > .columns:nth-of-type(1n) { - clear: none; } - .large-up-5 > .column:nth-of-type(5n+1), .large-up-5 > .columns:nth-of-type(5n+1) { - clear: both; } - .large-up-5 > .column:last-child, .large-up-5 > .columns:last-child { - float: left; } - .large-up-6 > .column, .large-up-6 > .columns { + width: 14.28571%; + } + .large-up-7 > .column:nth-of-type(1n), + .large-up-7 > .columns:nth-of-type(1n) { + clear: none; + } + .large-up-7 > .column:nth-of-type(7n + 1), + .large-up-7 > .columns:nth-of-type(7n + 1) { + clear: both; + } + .large-up-7 > .column:last-child, + .large-up-7 > .columns:last-child { float: left; - width: 16.66667%; } - .large-up-6 > .column:nth-of-type(1n), .large-up-6 > .columns:nth-of-type(1n) { - clear: none; } - .large-up-6 > .column:nth-of-type(6n+1), .large-up-6 > .columns:nth-of-type(6n+1) { - clear: both; } - .large-up-6 > .column:last-child, .large-up-6 > .columns:last-child { - float: left; } - .large-up-7 > .column, .large-up-7 > .columns { + } + .large-up-8 > .column, + .large-up-8 > .columns { float: left; - width: 14.28571%; } - .large-up-7 > .column:nth-of-type(1n), .large-up-7 > .columns:nth-of-type(1n) { - clear: none; } - .large-up-7 > .column:nth-of-type(7n+1), .large-up-7 > .columns:nth-of-type(7n+1) { - clear: both; } - .large-up-7 > .column:last-child, .large-up-7 > .columns:last-child { - float: left; } - .large-up-8 > .column, .large-up-8 > .columns { + width: 12.5%; + } + .large-up-8 > .column:nth-of-type(1n), + .large-up-8 > .columns:nth-of-type(1n) { + clear: none; + } + .large-up-8 > .column:nth-of-type(8n + 1), + .large-up-8 > .columns:nth-of-type(8n + 1) { + clear: both; + } + .large-up-8 > .column:last-child, + .large-up-8 > .columns:last-child { float: left; - width: 12.5%; } - .large-up-8 > .column:nth-of-type(1n), .large-up-8 > .columns:nth-of-type(1n) { - clear: none; } - .large-up-8 > .column:nth-of-type(8n+1), .large-up-8 > .columns:nth-of-type(8n+1) { - clear: both; } - .large-up-8 > .column:last-child, .large-up-8 > .columns:last-child { - float: left; } - .large-collapse > .column, .large-collapse > .columns { + } + .large-collapse > .column, + .large-collapse > .columns { padding-right: 0; - padding-left: 0; } + padding-left: 0; + } .large-collapse .row { margin-right: 0; - margin-left: 0; } + margin-left: 0; + } .expanded.row .large-collapse.row { margin-right: 0; - margin-left: 0; } - .large-uncollapse > .column, .large-uncollapse > .columns { + margin-left: 0; + } + .large-uncollapse > .column, + .large-uncollapse > .columns { padding-right: 0.9375rem; - padding-left: 0.9375rem; } + padding-left: 0.9375rem; + } .large-centered { margin-right: auto; - margin-left: auto; } - .large-centered, .large-centered:last-child:not(:first-child) { - float: none; - clear: both; } + margin-left: auto; + } + .large-centered, + .large-centered:last-child:not(:first-child) { + float: none; + clear: both; + } .large-uncentered, .large-push-0, .large-pull-0 { position: static; float: left; margin-right: 0; - margin-left: 0; } } + margin-left: 0; + } +} .column-block { - margin-bottom: 1.25rem; } + margin-bottom: 1.25rem; +} +.column-block > :last-child { + margin-bottom: 0; +} +@media print, screen and (min-width: 40em) { + .column-block { + margin-bottom: 1.875rem; + } .column-block > :last-child { - margin-bottom: 0; } - @media print, screen and (min-width: 40em) { - .column-block { - margin-bottom: 1.875rem; } - .column-block > :last-child { - margin-bottom: 0; } } - + margin-bottom: 0; + } +} + div, dl, dt, @@ -1417,27 +1927,32 @@ blockquote, th, td { margin: 0; - padding: 0; } + padding: 0; +} p { margin-bottom: 1rem; font-size: inherit; line-height: 1.6; - text-rendering: optimizeLegibility; } + text-rendering: optimizeLegibility; +} em, i { font-style: italic; - line-height: inherit; } + line-height: inherit; +} strong, b { font-weight: bold; - line-height: inherit; } + line-height: inherit; +} small { font-size: 80%; - line-height: inherit; } + line-height: inherit; +} h1, h2, @@ -1449,76 +1964,94 @@ h6 { font-style: normal; font-weight: 300; color: inherit; - text-rendering: optimizeLegibility; } - h1 small, - h2 small, - h3 small, - h4 small, - h5 small, - h6 small { - line-height: 0; - color: #b7bac0; } + text-rendering: optimizeLegibility; +} +h1 small, +h2 small, +h3 small, +h4 small, +h5 small, +h6 small { + line-height: 0; + color: #b7bac0; +} h1 { font-size: 1.5rem; line-height: 1.4; margin-top: 0; - margin-bottom: 0.5rem; } + margin-bottom: 0.5rem; +} h2 { font-size: 1.25rem; line-height: 1.4; margin-top: 0; - margin-bottom: 0.5rem; } + margin-bottom: 0.5rem; +} h3 { font-size: 1.1875rem; line-height: 1.4; margin-top: 0; - margin-bottom: 0.5rem; } + margin-bottom: 0.5rem; +} h4 { font-size: 1.125rem; line-height: 1.4; margin-top: 0; - margin-bottom: 0.5rem; } + margin-bottom: 0.5rem; +} h5 { font-size: 0.875rem; line-height: 1.4; margin-top: 0; - margin-bottom: 0.5rem; } + margin-bottom: 0.5rem; +} h6 { font-size: 0.8125rem; line-height: 1.4; margin-top: 0; - margin-bottom: 0.5rem; } + margin-bottom: 0.5rem; +} @media print, screen and (min-width: 40em) { h1 { - font-size: 2.5rem; } + font-size: 2.5rem; + } h2 { - font-size: 2rem; } + font-size: 2rem; + } h3 { - font-size: 1.75rem; } + font-size: 1.75rem; + } h4 { - font-size: 1.125rem; } + font-size: 1.125rem; + } h5 { - font-size: 0.875rem; } + font-size: 0.875rem; + } h6 { - font-size: 0.8125rem; } } + font-size: 0.8125rem; + } +} a { line-height: inherit; color: var(--clr-blue-medium); text-decoration: none; - cursor: pointer; } - a:hover, a:focus { - color: var(--clr-navy); - } - a img { - border: 0; } + cursor: pointer; +} +a:hover, +a:focus { + color: #3380df; +} +a img { + border: 0; +} hr { clear: both; @@ -1527,57 +2060,75 @@ hr { border-top: 0; border-right: 0; border-bottom: 1px solid #b7bac0; - border-left: 0; } + border-left: 0; +} ul, ol, dl { margin-bottom: 1rem; list-style-position: outside; - line-height: 1.6; } + line-height: 1.6; +} li { - font-size: inherit; } + font-size: inherit; +} ul { margin-left: 1.25rem; - list-style-type: disc; } + list-style-type: disc; +} ol { - margin-left: 1.25rem; } + margin-left: 1.25rem; +} -ul ul, ol ul, ul ol, ol ol { +ul ul, +ol ul, +ul ol, +ol ol { margin-left: 1.25rem; - margin-bottom: 0; } + margin-bottom: 0; +} dl { - margin-bottom: 1rem; } - dl dt { - margin-bottom: 0.3rem; - font-weight: bold; } + margin-bottom: 1rem; +} +dl dt { + margin-bottom: 0.3rem; + font-weight: bold; +} blockquote { margin: 0 0 1rem; padding: 0.5625rem 1.25rem 0 1.1875rem; - border-left: 1px solid #b7bac0; } - blockquote, blockquote p { - line-height: 1.6; - color: #5b5e61; } + border-left: 1px solid #b7bac0; +} +blockquote, +blockquote p { + line-height: 1.6; + color: #5b5e61; +} cite { display: block; font-size: 0.8125rem; - color: #5b5e61; } - cite:before { - content: "— "; } + color: #5b5e61; +} +cite:before { + content: "— "; +} abbr { border-bottom: 1px dotted #0a0a0a; color: #0a0a0a; - cursor: help; } + cursor: help; +} figure { - margin: 0; } + margin: 0; +} code { padding: 0.125rem 0.3125rem 0.0625rem; @@ -1585,7 +2136,8 @@ code { background-color: #f5f6f9; font-family: Consolas, "Liberation Mono", Courier, monospace; font-weight: 300; - color: #0a0a0a; } + color: #0a0a0a; +} kbd { margin: 0; @@ -1593,118 +2145,160 @@ kbd { background-color: #f5f6f9; font-family: Consolas, "Liberation Mono", Courier, monospace; color: #0a0a0a; - border-radius: 4px; } + border-radius: 4px; +} .subheader { margin-top: 0.2rem; margin-bottom: 0.5rem; font-weight: 300; line-height: 1.4; - color: #5b5e61; } + color: #5b5e61; +} .lead { font-size: 125%; - line-height: 1.6; } + line-height: 1.6; +} .stat { font-size: 2.5rem; - line-height: 1; } - p + .stat { - margin-top: -1rem; } + line-height: 1; +} +p + .stat { + margin-top: -1rem; +} .no-bullet { margin-left: 0; - list-style: none; } + list-style: none; +} .text-left { - text-align: left; } + text-align: left; +} .text-right { - text-align: right; } + text-align: right; +} .text-center { - text-align: center; } + text-align: center; +} .text-justify { - text-align: justify; } + text-align: justify; +} @media print, screen and (min-width: 40em) { .medium-text-left { - text-align: left; } + text-align: left; + } .medium-text-right { - text-align: right; } + text-align: right; + } .medium-text-center { - text-align: center; } + text-align: center; + } .medium-text-justify { - text-align: justify; } } + text-align: justify; + } +} @media print, screen and (min-width: 64em) { .large-text-left { - text-align: left; } + text-align: left; + } .large-text-right { - text-align: right; } + text-align: right; + } .large-text-center { - text-align: center; } + text-align: center; + } .large-text-justify { - text-align: justify; } } + text-align: justify; + } +} .show-for-print { - display: none !important; } + display: none !important; +} @media print { * { background: transparent !important; box-shadow: none !important; color: black !important; - text-shadow: none !important; } + text-shadow: none !important; + } .show-for-print { - display: block !important; } + display: block !important; + } .hide-for-print { - display: none !important; } + display: none !important; + } table.show-for-print { - display: table !important; } + display: table !important; + } thead.show-for-print { - display: table-header-group !important; } + display: table-header-group !important; + } tbody.show-for-print { - display: table-row-group !important; } + display: table-row-group !important; + } tr.show-for-print { - display: table-row !important; } + display: table-row !important; + } td.show-for-print { - display: table-cell !important; } + display: table-cell !important; + } th.show-for-print { - display: table-cell !important; } + display: table-cell !important; + } a, a:visited { - text-decoration: underline; } + text-decoration: underline; + } a[href]:after { - content: " (" attr(href) ")"; } + content: " (" attr(href) ")"; + } .ir a:after, - a[href^='javascript:']:after, - a[href^='#']:after { - content: ''; } + a[href^="javascript:"]:after, + a[href^="#"]:after { + content: ""; + } abbr[title]:after { - content: " (" attr(title) ")"; } + content: " (" attr(title) ")"; + } pre, blockquote { border: 1px solid #5b5e61; - page-break-inside: avoid; } + page-break-inside: avoid; + } thead { - display: table-header-group; } + display: table-header-group; + } tr, img { - page-break-inside: avoid; } + page-break-inside: avoid; + } img { - max-width: 100% !important; } + max-width: 100% !important; + } @page { - margin: 0.5cm; } + margin: 0.5cm; + } p, h2, h3 { orphans: 3; - widows: 3; } + widows: 3; + } h2, h3 { - page-break-after: avoid; } } + page-break-after: avoid; + } +} .button { display: inline-block; @@ -1714,154 +2308,253 @@ kbd { -webkit-appearance: none; border: 1px solid transparent; border-radius: 4px; - transition: background-color 0.25s ease-out, color 0.25s ease-out; + transition: + background-color 0.25s ease-out, + color 0.25s ease-out; font-size: 0.9rem; line-height: 1; text-align: center; cursor: pointer; background-color: #5a98e5; - color: #fefefe; } - [data-whatinput='mouse'] .button { - outline: 0; } - .button:hover, .button:focus { - background-color: #317ede; - color: #fefefe; } - .button.tiny { - font-size: 0.6rem; } - .button.small, .title-area .button { - font-size: 0.75rem; } - .button.large { - font-size: 1.25rem; } - .button.expanded { - display: block; - width: 100%; - margin-right: 0; - margin-left: 0; } - .button.primary { - background-color: #5a98e5; - color: #0a0a0a; } - .button.primary:hover, .button.primary:focus { - background-color: #2376dc; - color: #0a0a0a; } - .button.secondary { - background-color: #1a2a57; - color: #fefefe; } - .button.secondary:hover, .button.secondary:focus { - background-color: #152246; - color: #fefefe; } - .button.success { - background-color: #def5e3; - color: #0a0a0a; } - .button.success:hover, .button.success:focus { - background-color: #96dfa6; - color: #0a0a0a; } - .button.warning { - background-color: #fbf0dc; - color: #0a0a0a; } - .button.warning:hover, .button.warning:focus { - background-color: #f1cc87; - color: #0a0a0a; } - .button.alert { - background-color: #f5dee4; - color: #0a0a0a; } - .button.alert:hover, .button.alert:focus { - background-color: #df96a9; - color: #0a0a0a; } - .button.hollow { - border: 1px solid #5a98e5; - color: #5a98e5; } - .button.hollow, .button.hollow:hover, .button.hollow:focus { - background-color: transparent; } - .button.hollow:hover, .button.hollow:focus { - border-color: #16498a; - color: #16498a; } - .button.hollow.primary { - border: 1px solid #5a98e5; - color: #5a98e5; } - .button.hollow.primary:hover, .button.hollow.primary:focus { - border-color: #16498a; - color: #16498a; } - .button.hollow.secondary { - border: 1px solid #1a2a57; - color: #1a2a57; } - .button.hollow.secondary:hover, .button.hollow.secondary:focus { - border-color: #0d152c; - color: #0d152c; } - .button.hollow.success { - border: 1px solid #def5e3; - color: #def5e3; } - .button.hollow.success:hover, .button.hollow.success:focus { - border-color: #36b351; - color: #36b351; } - .button.hollow.warning { - border: 1px solid #fbf0dc; - color: #fbf0dc; } - .button.hollow.warning:hover, .button.hollow.warning:focus { - border-color: #d39118; - color: #d39118; } - .button.hollow.alert { - border: 1px solid #f5dee4; - color: #f5dee4; } - .button.hollow.alert:hover, .button.hollow.alert:focus { - border-color: #b33657; - color: #b33657; } - .button.disabled, .button[disabled] { - opacity: 0.25; - cursor: not-allowed; } - .button.disabled:hover, .button.disabled:focus, .button[disabled]:hover, .button[disabled]:focus { - background-color: #5a98e5; - color: #fefefe; } - .button.disabled.primary, .button[disabled].primary { - opacity: 0.25; - cursor: not-allowed; } - .button.disabled.primary:hover, .button.disabled.primary:focus, .button[disabled].primary:hover, .button[disabled].primary:focus { - background-color: #5a98e5; - color: #fefefe; } - .button.disabled.secondary, .button[disabled].secondary { - opacity: 0.25; - cursor: not-allowed; } - .button.disabled.secondary:hover, .button.disabled.secondary:focus, .button[disabled].secondary:hover, .button[disabled].secondary:focus { - background-color: #1a2a57; - color: #fefefe; } - .button.disabled.success, .button[disabled].success { - opacity: 0.25; - cursor: not-allowed; } - .button.disabled.success:hover, .button.disabled.success:focus, .button[disabled].success:hover, .button[disabled].success:focus { - background-color: #def5e3; - color: #fefefe; } - .button.disabled.warning, .button[disabled].warning { - opacity: 0.25; - cursor: not-allowed; } - .button.disabled.warning:hover, .button.disabled.warning:focus, .button[disabled].warning:hover, .button[disabled].warning:focus { - background-color: #fbf0dc; - color: #fefefe; } - .button.disabled.alert, .button[disabled].alert { - opacity: 0.25; - cursor: not-allowed; } - .button.disabled.alert:hover, .button.disabled.alert:focus, .button[disabled].alert:hover, .button[disabled].alert:focus { - background-color: #f5dee4; - color: #fefefe; } - .button.dropdown::after { - display: block; - width: 0; - height: 0; - border: inset 0.4em; - content: ''; - border-bottom-width: 0; - border-top-style: solid; - border-color: #fefefe transparent transparent; - position: relative; - top: 0.4em; - display: inline-block; - float: right; - margin-left: 1em; } - .button.arrow-only::after { - top: -0.1em; - float: none; - margin-left: 0; } + color: #fefefe; +} +[data-whatinput="mouse"] .button { + outline: 0; +} +.button:hover, +.button:focus { + background-color: #317ede; + color: #fefefe; +} +.button.tiny { + font-size: 0.6rem; +} +.button.small, +.title-area .button { + font-size: 0.75rem; +} +.button.large { + font-size: 1.25rem; +} +.button.expanded { + display: block; + width: 100%; + margin-right: 0; + margin-left: 0; +} +.button.primary { + background-color: #5a98e5; + color: #0a0a0a; +} +.button.primary:hover, +.button.primary:focus { + background-color: #2376dc; + color: #0a0a0a; +} +.button.secondary { + background-color: #1a2a57; + color: #fefefe; +} +.button.secondary:hover, +.button.secondary:focus { + background-color: #152246; + color: #fefefe; +} +.button.success { + background-color: #def5e3; + color: #0a0a0a; +} +.button.success:hover, +.button.success:focus { + background-color: #96dfa6; + color: #0a0a0a; +} +.button.warning { + background-color: #fbf0dc; + color: #0a0a0a; +} +.button.warning:hover, +.button.warning:focus { + background-color: #f1cc87; + color: #0a0a0a; +} +.button.alert { + background-color: #f5dee4; + color: #0a0a0a; +} +.button.alert:hover, +.button.alert:focus { + background-color: #df96a9; + color: #0a0a0a; +} +.button.hollow { + border: 1px solid #5a98e5; + color: #5a98e5; +} +.button.hollow, +.button.hollow:hover, +.button.hollow:focus { + background-color: transparent; +} +.button.hollow:hover, +.button.hollow:focus { + border-color: #16498a; + color: #16498a; +} +.button.hollow.primary { + border: 1px solid #5a98e5; + color: #5a98e5; +} +.button.hollow.primary:hover, +.button.hollow.primary:focus { + border-color: #16498a; + color: #16498a; +} +.button.hollow.secondary { + border: 1px solid #1a2a57; + color: #1a2a57; +} +.button.hollow.secondary:hover, +.button.hollow.secondary:focus { + border-color: #0d152c; + color: #0d152c; +} +.button.hollow.success { + border: 1px solid #def5e3; + color: #def5e3; +} +.button.hollow.success:hover, +.button.hollow.success:focus { + border-color: #36b351; + color: #36b351; +} +.button.hollow.warning { + border: 1px solid #fbf0dc; + color: #fbf0dc; +} +.button.hollow.warning:hover, +.button.hollow.warning:focus { + border-color: #d39118; + color: #d39118; +} +.button.hollow.alert { + border: 1px solid #f5dee4; + color: #f5dee4; +} +.button.hollow.alert:hover, +.button.hollow.alert:focus { + border-color: #b33657; + color: #b33657; +} +.button.disabled, +.button[disabled] { + opacity: 0.25; + cursor: not-allowed; +} +.button.disabled:hover, +.button.disabled:focus, +.button[disabled]:hover, +.button[disabled]:focus { + background-color: #5a98e5; + color: #fefefe; +} +.button.disabled.primary, +.button[disabled].primary { + opacity: 0.25; + cursor: not-allowed; +} +.button.disabled.primary:hover, +.button.disabled.primary:focus, +.button[disabled].primary:hover, +.button[disabled].primary:focus { + background-color: #5a98e5; + color: #fefefe; +} +.button.disabled.secondary, +.button[disabled].secondary { + opacity: 0.25; + cursor: not-allowed; +} +.button.disabled.secondary:hover, +.button.disabled.secondary:focus, +.button[disabled].secondary:hover, +.button[disabled].secondary:focus { + background-color: #1a2a57; + color: #fefefe; +} +.button.disabled.success, +.button[disabled].success { + opacity: 0.25; + cursor: not-allowed; +} +.button.disabled.success:hover, +.button.disabled.success:focus, +.button[disabled].success:hover, +.button[disabled].success:focus { + background-color: #def5e3; + color: #fefefe; +} +.button.disabled.warning, +.button[disabled].warning { + opacity: 0.25; + cursor: not-allowed; +} +.button.disabled.warning:hover, +.button.disabled.warning:focus, +.button[disabled].warning:hover, +.button[disabled].warning:focus { + background-color: #fbf0dc; + color: #fefefe; +} +.button.disabled.alert, +.button[disabled].alert { + opacity: 0.25; + cursor: not-allowed; +} +.button.disabled.alert:hover, +.button.disabled.alert:focus, +.button[disabled].alert:hover, +.button[disabled].alert:focus { + background-color: #f5dee4; + color: #fefefe; +} +.button.dropdown::after { + display: block; + width: 0; + height: 0; + border: inset 0.4em; + content: ""; + border-bottom-width: 0; + border-top-style: solid; + border-color: #fefefe transparent transparent; + position: relative; + top: 0.4em; + display: inline-block; + float: right; + margin-left: 1em; +} +.button.arrow-only::after { + top: -0.1em; + float: none; + margin-left: 0; +} -[type='text'], [type='password'], [type='date'], [type='datetime'], [type='datetime-local'], [type='month'], [type='week'], [type='email'], [type='number'], [type='search'], [type='tel'], [type='time'], [type='url'], [type='color'], -textarea, ul.tagit{ +[type="text"], +[type="password"], +[type="date"], +[type="datetime"], +[type="datetime-local"], +[type="month"], +[type="week"], +[type="email"], +[type="number"], +[type="search"], +[type="tel"], +[type="time"], +[type="url"], +[type="color"], +textarea, +ul.tagit { display: block; box-sizing: border-box; width: 100%; @@ -1876,77 +2569,111 @@ textarea, ul.tagit{ font-size: 1rem; font-weight: 300; color: #0a0a0a; - transition: box-shadow 0.5s, border-color 0.25s ease-in-out; + transition: + box-shadow 0.5s, + border-color 0.25s ease-in-out; -webkit-appearance: none; - -moz-appearance: none; - appearance: none; } - [type='text']:focus, [type='password']:focus, [type='date']:focus, [type='datetime']:focus, [type='datetime-local']:focus, [type='month']:focus, [type='week']:focus, [type='email']:focus, [type='number']:focus, [type='search']:focus, [type='tel']:focus, [type='time']:focus, [type='url']:focus, [type='color']:focus, - textarea:focus { - outline: none; - border: 1px solid #5b5e61; - background-color: #fefefe; - box-shadow: 0 0 5px #b7bac0; - transition: box-shadow 0.5s, border-color 0.25s ease-in-out; } + -moz-appearance: none; + appearance: none; +} +[type="text"]:focus, +[type="password"]:focus, +[type="date"]:focus, +[type="datetime"]:focus, +[type="datetime-local"]:focus, +[type="month"]:focus, +[type="week"]:focus, +[type="email"]:focus, +[type="number"]:focus, +[type="search"]:focus, +[type="tel"]:focus, +[type="time"]:focus, +[type="url"]:focus, +[type="color"]:focus, +textarea:focus { + outline: none; + border: 1px solid #5b5e61; + background-color: #fefefe; + box-shadow: 0 0 5px #b7bac0; + transition: + box-shadow 0.5s, + border-color 0.25s ease-in-out; +} textarea { - max-width: 100%; } - textarea[rows] { - height: auto; } + max-width: 100%; +} +textarea[rows] { + height: auto; +} input::-webkit-input-placeholder, textarea::-webkit-input-placeholder { - color: #b7bac0; } + color: #b7bac0; +} input::-moz-placeholder, textarea::-moz-placeholder { - color: #b7bac0; } + color: #b7bac0; +} input:-ms-input-placeholder, textarea:-ms-input-placeholder { - color: #b7bac0; } + color: #b7bac0; +} input::placeholder, textarea::placeholder { - color: #b7bac0; } + color: #b7bac0; +} -input:disabled, input[readonly], +input:disabled, +input[readonly], textarea:disabled, textarea[readonly] { background-color: #f5f6f9; - cursor: not-allowed; } + cursor: not-allowed; +} -[type='submit'], -[type='button'] { +[type="submit"], +[type="button"] { -webkit-appearance: none; - -moz-appearance: none; - appearance: none; - border-radius: 4px; } + -moz-appearance: none; + appearance: none; + border-radius: 4px; +} -input[type='search'] { - box-sizing: border-box; } +input[type="search"] { + box-sizing: border-box; +} -[type='file'], -[type='checkbox'], -[type='radio'] { - margin: 0 0 1rem; } +[type="file"], +[type="checkbox"], +[type="radio"] { + margin: 0 0 1rem; +} -[type='checkbox'] + label, -[type='radio'] + label { +[type="checkbox"] + label, +[type="radio"] + label { display: inline-block; vertical-align: baseline; margin-left: 0.5rem; margin-right: 1rem; - margin-bottom: 0; } - [type='checkbox'] + label[for], - [type='radio'] + label[for] { - cursor: pointer; } + margin-bottom: 0; +} +[type="checkbox"] + label[for], +[type="radio"] + label[for] { + cursor: pointer; +} -label > [type='checkbox'], -label > [type='radio'] { - margin-right: 0.5rem; } +label > [type="checkbox"], +label > [type="radio"] { + margin-right: 0.5rem; +} -[type='file'] { - width: 100%; } +[type="file"] { + width: 100%; +} label { display: block; @@ -1954,34 +2681,44 @@ label { font-size: 0.875rem; font-weight: 300; line-height: 1.8; - color: #0a0a0a; } - label.middle { - margin: 0 0 1rem; - padding: 0.5625rem 0; } + color: #0a0a0a; +} +label.middle { + margin: 0 0 1rem; + padding: 0.5625rem 0; +} .help-text { margin-top: -1rem; font-size: 0.8125rem; font-style: italic; - color: #0a0a0a; } + color: #0a0a0a; +} .input-group { display: table; width: 100%; - margin-bottom: 1rem; } - .input-group > :first-child { - border-radius: 4px 0 0 4px; } - .input-group > :last-child > * { - border-radius: 0 4px 4px 0; } + margin-bottom: 1rem; +} +.input-group > :first-child { + border-radius: 4px 0 0 4px; +} +.input-group > :last-child > * { + border-radius: 0 4px 4px 0; +} -.input-group-label, .input-group-field, .input-group-button, .input-group-button a, +.input-group-label, +.input-group-field, +.input-group-button, +.input-group-button a, .input-group-button input, .input-group-button button, .input-group-button label { margin: 0; white-space: nowrap; display: table-cell; - vertical-align: middle; } + vertical-align: middle; +} .input-group-label { padding: 0 1rem; @@ -1991,60 +2728,71 @@ label { text-align: center; white-space: nowrap; width: 1%; - height: 100%; } - .input-group-label:first-child { - border-right: 0; } - .input-group-label:last-child { - border-left: 0; } + height: 100%; +} +.input-group-label:first-child { + border-right: 0; +} +.input-group-label:last-child { + border-left: 0; +} .input-group-field { border-radius: 0; - height: 2.5rem; } + height: 2.5rem; +} .input-group-button { padding-top: 0; padding-bottom: 0; text-align: center; width: 1%; - height: 100%; } - .input-group-button a, - .input-group-button input, - .input-group-button button, - .input-group-button label { - height: 2.5rem; - padding-top: 0; - padding-bottom: 0; - font-size: 1rem; } + height: 100%; +} +.input-group-button a, +.input-group-button input, +.input-group-button button, +.input-group-button label { + height: 2.5rem; + padding-top: 0; + padding-bottom: 0; + font-size: 1rem; +} .input-group .input-group-button { - display: table-cell; } + display: table-cell; +} fieldset { margin: 0; padding: 0; - border: 0; } + border: 0; +} legend { max-width: 100%; - margin-bottom: 0.5rem; } + margin-bottom: 0.5rem; +} .fieldset { margin: 1.125rem 0; padding: 1.25rem; - border: 1px solid #b7bac0; } - .fieldset legend { - margin: 0; - margin-left: -0.1875rem; - padding: 0 0.1875rem; - background: #f5f6f9; } + border: 1px solid #b7bac0; +} +.fieldset legend { + margin: 0; + margin-left: -0.1875rem; + padding: 0 0.1875rem; + background: #f5f6f9; +} select { height: 2.4375rem; margin: 0 0 1rem; padding: 0.5rem; -webkit-appearance: none; - -moz-appearance: none; - appearance: none; + -moz-appearance: none; + appearance: none; border: 1px solid #b7bac0; border-radius: 4px; background-color: #fefefe; @@ -2058,39 +2806,56 @@ select { background-repeat: no-repeat; background-size: 9px 6px; padding-right: 1.5rem; - transition: box-shadow 0.5s, border-color 0.25s ease-in-out; } - @media screen and (min-width: 0\0) { - select { - background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAYCAYAAACbU/80AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAIpJREFUeNrEkckNgDAMBBfRkEt0ObRBBdsGXUDgmQfK4XhH2m8czQAAy27R3tsw4Qfe2x8uOO6oYLb6GlOor3GF+swURAOmUJ+RwtEJs9WvTGEYxBXqI1MQAZhCfUQKRzDMVj+TwrAIV6jvSUEkYAr1LSkcyTBb/V+KYfX7xAeusq3sLDtGH3kEGACPWIflNZfhRQAAAABJRU5ErkJggg=="); } } - select:focus { - outline: none; - border: 1px solid #5b5e61; - background-color: #fefefe; - box-shadow: 0 0 5px #b7bac0; - transition: box-shadow 0.5s, border-color 0.25s ease-in-out; } - select:disabled { - background-color: #f5f6f9; - cursor: not-allowed; } - select::-ms-expand { - display: none; } - select[multiple] { - height: auto; - background-image: none; } + transition: + box-shadow 0.5s, + border-color 0.25s ease-in-out; +} +@media screen and (min-width: 0\0) { + select { + background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAYCAYAAACbU/80AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAIpJREFUeNrEkckNgDAMBBfRkEt0ObRBBdsGXUDgmQfK4XhH2m8czQAAy27R3tsw4Qfe2x8uOO6oYLb6GlOor3GF+swURAOmUJ+RwtEJs9WvTGEYxBXqI1MQAZhCfUQKRzDMVj+TwrAIV6jvSUEkYAr1LSkcyTBb/V+KYfX7xAeusq3sLDtGH3kEGACPWIflNZfhRQAAAABJRU5ErkJggg=="); + } +} +select:focus { + outline: none; + border: 1px solid #5b5e61; + background-color: #fefefe; + box-shadow: 0 0 5px #b7bac0; + transition: + box-shadow 0.5s, + border-color 0.25s ease-in-out; +} +select:disabled { + background-color: #f5f6f9; + cursor: not-allowed; +} +select::-ms-expand { + display: none; +} +select[multiple] { + height: auto; + background-image: none; +} .is-invalid-input:not(:focus) { border-color: #f5dee4; - background-color: #fdfbfb; } - .is-invalid-input:not(:focus)::-webkit-input-placeholder { - color: #f5dee4; } - .is-invalid-input:not(:focus)::-moz-placeholder { - color: #f5dee4; } - .is-invalid-input:not(:focus):-ms-input-placeholder { - color: #f5dee4; } - .is-invalid-input:not(:focus)::placeholder { - color: #f5dee4; } + background-color: #fdfbfb; +} +.is-invalid-input:not(:focus)::-webkit-input-placeholder { + color: #f5dee4; +} +.is-invalid-input:not(:focus)::-moz-placeholder { + color: #f5dee4; +} +.is-invalid-input:not(:focus):-ms-input-placeholder { + color: #f5dee4; +} +.is-invalid-input:not(:focus)::placeholder { + color: #f5dee4; +} .is-invalid-label { - color: #f5dee4; } + color: #f5dee4; +} .form-error { display: none; @@ -2098,20 +2863,25 @@ select { margin-bottom: 1rem; font-size: 0.75rem; font-weight: bold; - color: #f5dee4; } - .form-error.is-visible { - display: block; } + color: #f5dee4; +} +.form-error.is-visible { + display: block; +} .accordion { margin-left: 0; background: #fefefe; - list-style-type: none; } + list-style-type: none; +} .accordion-item:first-child > :first-child { - border-radius: 4px 4px 0 0; } + border-radius: 4px 4px 0 0; +} .accordion-item:last-child > :last-child { - border-radius: 0 0 4px 4px; } + border-radius: 0 0 4px 4px; +} .accordion-title { position: relative; @@ -2121,20 +2891,26 @@ select { border-bottom: 0; font-size: 0.75rem; line-height: 1; - color: #5a98e5; } - :last-child:not(.is-active) > .accordion-title { - border-bottom: 1px solid #f5f6f9; - border-radius: 0 0 4px 4px; } - .accordion-title:hover, .accordion-title:focus { - background-color: #f5f6f9; } - .accordion-title::before { - position: absolute; - top: 50%; - right: 1rem; - margin-top: -0.5rem; - content: '+'; } - .is-active > .accordion-title::before { - content: '–'; } + color: #5a98e5; +} +:last-child:not(.is-active) > .accordion-title { + border-bottom: 1px solid #f5f6f9; + border-radius: 0 0 4px 4px; +} +.accordion-title:hover, +.accordion-title:focus { + background-color: #f5f6f9; +} +.accordion-title::before { + position: absolute; + top: 50%; + right: 1rem; + margin-top: -0.5rem; + content: "+"; +} +.is-active > .accordion-title::before { + content: "–"; +} .accordion-content { display: none; @@ -2142,33 +2918,38 @@ select { border: 1px solid #f5f6f9; border-bottom: 0; background-color: #fefefe; - color: #0a0a0a; } - :last-child > .accordion-content:last-child { - border-bottom: 1px solid #f5f6f9; } + color: #0a0a0a; +} +:last-child > .accordion-content:last-child { + border-bottom: 1px solid #f5f6f9; +} .is-accordion-submenu-parent > a { - position: relative; } - .is-accordion-submenu-parent > a::after { - display: block; - width: 0; - height: 0; - border: inset 6px; - content: ''; - border-bottom-width: 0; - border-top-style: solid; - border-color: #5a98e5 transparent transparent; - position: absolute; - top: 50%; - margin-top: -3px; - right: 1rem; } + position: relative; +} +.is-accordion-submenu-parent > a::after { + display: block; + width: 0; + height: 0; + border: inset 6px; + content: ""; + border-bottom-width: 0; + border-top-style: solid; + border-color: #5a98e5 transparent transparent; + position: absolute; + top: 50%; + margin-top: -3px; + right: 1rem; +} -.is-accordion-submenu-parent[aria-expanded='true'] > a::after { +.is-accordion-submenu-parent[aria-expanded="true"] > a::after { -webkit-transform: rotate(180deg); - -ms-transform: rotate(180deg); - transform: rotate(180deg); + -ms-transform: rotate(180deg); + transform: rotate(180deg); -webkit-transform-origin: 50% 50%; - -ms-transform-origin: 50% 50%; - transform-origin: 50% 50%; } + -ms-transform-origin: 50% 50%; + transform-origin: 50% 50%; +} .badge { display: inline-block; @@ -2178,157 +2959,255 @@ select { font-size: 0.6rem; text-align: center; background: #5a98e5; - color: #fefefe; } - .badge.primary { - background: #5a98e5; - color: #0a0a0a; } - .badge.secondary { - background: #1a2a57; - color: #fefefe; } - .badge.success { - background: #def5e3; - color: #0a0a0a; } - .badge.warning { - background: #fbf0dc; - color: #0a0a0a; } - .badge.alert { - background: #f5dee4; - color: #0a0a0a; } + color: #fefefe; +} +.badge.primary { + background: #5a98e5; + color: #0a0a0a; +} +.badge.secondary { + background: #1a2a57; + color: #fefefe; +} +.badge.success { + background: #def5e3; + color: #0a0a0a; +} +.badge.warning { + background: #fbf0dc; + color: #0a0a0a; +} +.badge.alert { + background: #f5dee4; + color: #0a0a0a; +} .breadcrumbs { margin: 0.5rem 0 1rem 0; - list-style: none; } - .breadcrumbs::before, .breadcrumbs::after { - display: table; - content: ' '; } - .breadcrumbs::after { - clear: both; } - .breadcrumbs li { - float: left; - font-size: 0.6875rem; - color: #0a0a0a; - cursor: default; - text-transform: uppercase; } - .breadcrumbs li:not(:last-child)::after { - position: relative; - top: 1px; - margin: 0 0.75rem; - opacity: 1; - content: "/"; - color: #b7bac0; } - .breadcrumbs a { - color: var(--clr-blue-medium); - } - .breadcrumbs a:hover { - text-decoration: underline; } - .breadcrumbs .disabled { - color: #b7bac0; - cursor: not-allowed; } + list-style: none; +} +.breadcrumbs a { + color: var(--clr-blue-medium); +} +.breadcrumbs::before, +.breadcrumbs::after { + display: table; + content: " "; +} +.breadcrumbs::after { + clear: both; +} +.breadcrumbs li { + float: left; + font-size: 0.6875rem; + color: #0a0a0a; + cursor: default; + text-transform: uppercase; +} +.breadcrumbs li:not(:last-child)::after { + position: relative; + top: 1px; + margin: 0 0.75rem; + opacity: 1; + content: "/"; + color: #b7bac0; +} +.breadcrumbs a { + color: #5a98e5; +} +.breadcrumbs a:hover { + text-decoration: underline; +} +.breadcrumbs .disabled { + color: #b7bac0; + cursor: not-allowed; +} .button-group { margin-bottom: 1rem; - font-size: 0; } - .button-group::before, .button-group::after { - display: table; - content: ' '; } - .button-group::after { - clear: both; } - .button-group .button { - margin: 0; - margin-right: 1px; - margin-bottom: 1px; - font-size: 0.9rem; - border-radius: 0;} - .button-group .button:last-child { - margin-right: 0; } - .button-group.tiny .button { - font-size: 0.6rem; } - .button-group.small .button, .title-area .button-group.button .button { - font-size: 0.75rem; } - .button-group.large .button { - font-size: 1.25rem; } - .button-group.expanded { - margin-right: -1px; } - .button-group.expanded::before, .button-group.expanded::after { - display: none; } - .button-group.expanded .button:first-child:nth-last-child(2), .button-group.expanded .button:first-child:nth-last-child(2):first-child:nth-last-child(2) ~ .button { - display: inline-block; - width: calc(50% - 1px); - margin-right: 1px; } - .button-group.expanded .button:first-child:nth-last-child(2):last-child, .button-group.expanded .button:first-child:nth-last-child(2):first-child:nth-last-child(2) ~ .button:last-child { - margin-right: -6px; } - .button-group.expanded .button:first-child:nth-last-child(3), .button-group.expanded .button:first-child:nth-last-child(3):first-child:nth-last-child(3) ~ .button { - display: inline-block; - width: calc(33.33333% - 1px); - margin-right: 1px; } - .button-group.expanded .button:first-child:nth-last-child(3):last-child, .button-group.expanded .button:first-child:nth-last-child(3):first-child:nth-last-child(3) ~ .button:last-child { - margin-right: -6px; } - .button-group.expanded .button:first-child:nth-last-child(4), .button-group.expanded .button:first-child:nth-last-child(4):first-child:nth-last-child(4) ~ .button { - display: inline-block; - width: calc(25% - 1px); - margin-right: 1px; } - .button-group.expanded .button:first-child:nth-last-child(4):last-child, .button-group.expanded .button:first-child:nth-last-child(4):first-child:nth-last-child(4) ~ .button:last-child { - margin-right: -6px; } - .button-group.expanded .button:first-child:nth-last-child(5), .button-group.expanded .button:first-child:nth-last-child(5):first-child:nth-last-child(5) ~ .button { - display: inline-block; - width: calc(20% - 1px); - margin-right: 1px; } - .button-group.expanded .button:first-child:nth-last-child(5):last-child, .button-group.expanded .button:first-child:nth-last-child(5):first-child:nth-last-child(5) ~ .button:last-child { - margin-right: -6px; } - .button-group.expanded .button:first-child:nth-last-child(6), .button-group.expanded .button:first-child:nth-last-child(6):first-child:nth-last-child(6) ~ .button { - display: inline-block; - width: calc(16.66667% - 1px); - margin-right: 1px; } - .button-group.expanded .button:first-child:nth-last-child(6):last-child, .button-group.expanded .button:first-child:nth-last-child(6):first-child:nth-last-child(6) ~ .button:last-child { - margin-right: -6px; } - .button-group.primary .button { - background-color: #5a98e5; - color: #0a0a0a; } - .button-group.primary .button:hover, .button-group.primary .button:focus { - background-color: #2376dc; - color: #0a0a0a; } - .button-group.secondary .button { - background-color: #1a2a57; - color: #fefefe; } - .button-group.secondary .button:hover, .button-group.secondary .button:focus { - background-color: #152246; - color: #fefefe; } - .button-group.success .button { - background-color: #def5e3; - color: #0a0a0a; } - .button-group.success .button:hover, .button-group.success .button:focus { - background-color: #96dfa6; - color: #0a0a0a; } - .button-group.warning .button { - background-color: #fbf0dc; - color: #0a0a0a; } - .button-group.warning .button:hover, .button-group.warning .button:focus { - background-color: #f1cc87; - color: #0a0a0a; } - .button-group.alert .button { - background-color: #f5dee4; - color: #0a0a0a; } - .button-group.alert .button:hover, .button-group.alert .button:focus { - background-color: #df96a9; - color: #0a0a0a; } - .button-group.stacked .button, .button-group.stacked-for-small .button, .button-group.stacked-for-medium .button { - width: 100%; } - .button-group.stacked .button:last-child, .button-group.stacked-for-small .button:last-child, .button-group.stacked-for-medium .button:last-child { - margin-bottom: 0; } - @media print, screen and (min-width: 40em) { - .button-group.stacked-for-small .button { - width: auto; - margin-bottom: 0; } } - @media print, screen and (min-width: 64em) { - .button-group.stacked-for-medium .button { - width: auto; - margin-bottom: 0; } } - @media screen and (max-width: 39.9375em) { - .button-group.stacked-for-small.expanded { - display: block; } - .button-group.stacked-for-small.expanded .button { - display: block; - margin-right: 0; } } + font-size: 0; +} +.button-group::before, +.button-group::after { + display: table; + content: " "; +} +.button-group::after { + clear: both; +} +.button-group .button { + margin: 0; + margin-right: 1px; + margin-bottom: 1px; + font-size: 0.9rem; + border-radius: 0; +} +.button-group .button:last-child { + margin-right: 0; +} +.button-group.tiny .button { + font-size: 0.6rem; +} +.button-group.small .button, +.title-area .button-group.button .button { + font-size: 0.75rem; +} +.button-group.large .button { + font-size: 1.25rem; +} +.button-group.expanded { + margin-right: -1px; +} +.button-group.expanded::before, +.button-group.expanded::after { + display: none; +} +.button-group.expanded .button:first-child:nth-last-child(2), +.button-group.expanded + .button:first-child:nth-last-child(2):first-child:nth-last-child(2) + ~ .button { + display: inline-block; + width: calc(50% - 1px); + margin-right: 1px; +} +.button-group.expanded .button:first-child:nth-last-child(2):last-child, +.button-group.expanded + .button:first-child:nth-last-child(2):first-child:nth-last-child(2) + ~ .button:last-child { + margin-right: -6px; +} +.button-group.expanded .button:first-child:nth-last-child(3), +.button-group.expanded + .button:first-child:nth-last-child(3):first-child:nth-last-child(3) + ~ .button { + display: inline-block; + width: calc(33.33333% - 1px); + margin-right: 1px; +} +.button-group.expanded .button:first-child:nth-last-child(3):last-child, +.button-group.expanded + .button:first-child:nth-last-child(3):first-child:nth-last-child(3) + ~ .button:last-child { + margin-right: -6px; +} +.button-group.expanded .button:first-child:nth-last-child(4), +.button-group.expanded + .button:first-child:nth-last-child(4):first-child:nth-last-child(4) + ~ .button { + display: inline-block; + width: calc(25% - 1px); + margin-right: 1px; +} +.button-group.expanded .button:first-child:nth-last-child(4):last-child, +.button-group.expanded + .button:first-child:nth-last-child(4):first-child:nth-last-child(4) + ~ .button:last-child { + margin-right: -6px; +} +.button-group.expanded .button:first-child:nth-last-child(5), +.button-group.expanded + .button:first-child:nth-last-child(5):first-child:nth-last-child(5) + ~ .button { + display: inline-block; + width: calc(20% - 1px); + margin-right: 1px; +} +.button-group.expanded .button:first-child:nth-last-child(5):last-child, +.button-group.expanded + .button:first-child:nth-last-child(5):first-child:nth-last-child(5) + ~ .button:last-child { + margin-right: -6px; +} +.button-group.expanded .button:first-child:nth-last-child(6), +.button-group.expanded + .button:first-child:nth-last-child(6):first-child:nth-last-child(6) + ~ .button { + display: inline-block; + width: calc(16.66667% - 1px); + margin-right: 1px; +} +.button-group.expanded .button:first-child:nth-last-child(6):last-child, +.button-group.expanded + .button:first-child:nth-last-child(6):first-child:nth-last-child(6) + ~ .button:last-child { + margin-right: -6px; +} +.button-group.primary .button { + background-color: #5a98e5; + color: #0a0a0a; +} +.button-group.primary .button:hover, +.button-group.primary .button:focus { + background-color: #2376dc; + color: #0a0a0a; +} +.button-group.secondary .button { + background-color: #1a2a57; + color: #fefefe; +} +.button-group.secondary .button:hover, +.button-group.secondary .button:focus { + background-color: #152246; + color: #fefefe; +} +.button-group.success .button { + background-color: #def5e3; + color: #0a0a0a; +} +.button-group.success .button:hover, +.button-group.success .button:focus { + background-color: #96dfa6; + color: #0a0a0a; +} +.button-group.warning .button { + background-color: #fbf0dc; + color: #0a0a0a; +} +.button-group.warning .button:hover, +.button-group.warning .button:focus { + background-color: #f1cc87; + color: #0a0a0a; +} +.button-group.alert .button { + background-color: #f5dee4; + color: #0a0a0a; +} +.button-group.alert .button:hover, +.button-group.alert .button:focus { + background-color: #df96a9; + color: #0a0a0a; +} +.button-group.stacked .button, +.button-group.stacked-for-small .button, +.button-group.stacked-for-medium .button { + width: 100%; +} +.button-group.stacked .button:last-child, +.button-group.stacked-for-small .button:last-child, +.button-group.stacked-for-medium .button:last-child { + margin-bottom: 0; +} +@media print, screen and (min-width: 40em) { + .button-group.stacked-for-small .button { + width: auto; + margin-bottom: 0; + } +} +@media print, screen and (min-width: 64em) { + .button-group.stacked-for-medium .button { + width: auto; + margin-bottom: 0; + } +} +@media screen and (max-width: 39.9375em) { + .button-group.stacked-for-small.expanded { + display: block; + } + .button-group.stacked-for-small.expanded .button { + display: block; + margin-right: 0; + } +} .callout { position: relative; @@ -2337,36 +3216,47 @@ select { border: 1px solid rgba(10, 10, 10, 0.07); border-radius: 4px; background-color: white; - color: #0a0a0a; } - .callout > :first-child { - margin-top: 0; } - .callout > :last-child { - margin-bottom: 0; } - .callout.primary { - background-color: #e6f0fb; - color: #0a0a0a; } - .callout.secondary { - background-color: #d1daf1; - color: #0a0a0a; } - .callout.success { - background-color: #fafefb; - color: #0a0a0a; } - .callout.warning { - background-color: #fefdfa; - color: #0a0a0a; } - .callout.alert { - background-color: #fefafb; - color: #0a0a0a; } - .callout.small, .title-area .callout.button { - padding-top: 0.5rem; - padding-right: 0.5rem; - padding-bottom: 0.5rem; - padding-left: 0.5rem; } - .callout.large { - padding-top: 3rem; - padding-right: 3rem; - padding-bottom: 3rem; - padding-left: 3rem; } + color: #0a0a0a; +} +.callout > :first-child { + margin-top: 0; +} +.callout > :last-child { + margin-bottom: 0; +} +.callout.primary { + background-color: #e6f0fb; + color: #0a0a0a; +} +.callout.secondary { + background-color: #d1daf1; + color: #0a0a0a; +} +.callout.success { + background-color: #fafefb; + color: #0a0a0a; +} +.callout.warning { + background-color: #fefdfa; + color: #0a0a0a; +} +.callout.alert { + background-color: #fefafb; + color: #0a0a0a; +} +.callout.small, +.title-area .callout.button { + padding-top: 0.5rem; + padding-right: 0.5rem; + padding-bottom: 0.5rem; + padding-left: 0.5rem; +} +.callout.large { + padding-top: 3rem; + padding-right: 3rem; + padding-bottom: 3rem; + padding-left: 3rem; +} .card { margin-bottom: 1rem; @@ -2375,135 +3265,186 @@ select { background: #fefefe; box-shadow: none; overflow: hidden; - color: #0a0a0a; } - .card > :last-child { - margin-bottom: 0; } + color: #0a0a0a; +} +.card > :last-child { + margin-bottom: 0; +} .card-divider { padding: 1rem; - background: #f5f6f9; } - .card-divider > :last-child { - margin-bottom: 0; } + background: #f5f6f9; +} +.card-divider > :last-child { + margin-bottom: 0; +} .card-section { - padding: 1rem; } - .card-section > :last-child { - margin-bottom: 0; } + padding: 1rem; +} +.card-section > :last-child { + margin-bottom: 0; +} .close-button { position: absolute; color: #5b5e61; - cursor: pointer; } - [data-whatinput='mouse'] .close-button { - outline: 0; } - .close-button:hover, .close-button:focus { - color: #0a0a0a; } - .close-button.small, .title-area .close-button.button { - right: 0.66rem; - top: 0.33em; - font-size: 1.5em; - line-height: 1; } - .close-button, .close-button.medium { - right: 1rem; - top: 0.5rem; - font-size: 2em; - line-height: 1; } + cursor: pointer; +} +[data-whatinput="mouse"] .close-button { + outline: 0; +} +.close-button:hover, +.close-button:focus { + color: #0a0a0a; +} +.close-button.small, +.title-area .close-button.button { + right: 0.66rem; + top: 0.33em; + font-size: 1.5em; + line-height: 1; +} +.close-button, +.close-button.medium { + right: 1rem; + top: 0.5rem; + font-size: 2em; + line-height: 1; +} .menu { margin: 0; - list-style-type: none; } - .menu > li { + list-style-type: none; +} +.menu > li { + display: table-cell; + vertical-align: middle; +} +[data-whatinput="mouse"] .menu > li { + outline: 0; +} +.menu > li > a { + display: block; + padding: 0.7rem 1rem; + line-height: 1; +} +.menu input, +.menu select, +.menu a, +.menu button { + margin-bottom: 0; +} +.menu > li > a img, +.menu > li > a i, +.menu > li > a svg { + vertical-align: middle; +} +.menu > li > a img + span, +.menu > li > a i + span, +.menu > li > a svg + span { + vertical-align: middle; +} +.menu > li > a img, +.menu > li > a i, +.menu > li > a svg { + margin-right: 0.25rem; + display: inline-block; +} +.menu > li, +.menu.horizontal > li { + display: table-cell; +} +.menu.expanded { + display: table; + width: 100%; + table-layout: fixed; +} +.menu.expanded > li:first-child:last-child { + width: 100%; +} +.menu.vertical > li { + display: block; +} +@media print, screen and (min-width: 40em) { + .menu.medium-horizontal > li { display: table-cell; - vertical-align: middle; } - [data-whatinput='mouse'] .menu > li { - outline: 0; } - .menu > li > a { - display: block; - padding: 0.7rem 1rem; - line-height: 1; } - .menu input, - .menu select, - .menu a, - .menu button { - margin-bottom: 0; } - .menu > li > a img, - .menu > li > a i, - .menu > li > a svg { - vertical-align: middle; } - .menu > li > a img + span, - .menu > li > a i + span, - .menu > li > a svg + span { - vertical-align: middle; } - .menu > li > a img, - .menu > li > a i, - .menu > li > a svg { - margin-right: 0.25rem; - display: inline-block; } - .menu > li, .menu.horizontal > li { - display: table-cell; } - .menu.expanded { + } + .menu.medium-expanded { display: table; width: 100%; - table-layout: fixed; } - .menu.expanded > li:first-child:last-child { - width: 100%; } - .menu.vertical > li { - display: block; } - @media print, screen and (min-width: 40em) { - .menu.medium-horizontal > li { - display: table-cell; } - .menu.medium-expanded { - display: table; - width: 100%; - table-layout: fixed; } - .menu.medium-expanded > li:first-child:last-child { - width: 100%; } - .menu.medium-vertical > li { - display: block; } } - @media print, screen and (min-width: 64em) { - .menu.large-horizontal > li { - display: table-cell; } - .menu.large-expanded { - display: table; - width: 100%; - table-layout: fixed; } - .menu.large-expanded > li:first-child:last-child { - width: 100%; } - .menu.large-vertical > li { - display: block; } } - .menu.simple li { - display: inline-block; - margin-right: 1rem; - line-height: 1; } - .menu.simple a { - padding: 0; } - .menu.align-right::before, .menu.align-right::after { + table-layout: fixed; + } + .menu.medium-expanded > li:first-child:last-child { + width: 100%; + } + .menu.medium-vertical > li { + display: block; + } +} +@media print, screen and (min-width: 64em) { + .menu.large-horizontal > li { + display: table-cell; + } + .menu.large-expanded { display: table; - content: ' '; } - .menu.align-right::after { - clear: both; } - .menu.align-right > li { - float: right; } - .menu.icon-top > li > a { - text-align: center; } - .menu.icon-top > li > a img, - .menu.icon-top > li > a i, - .menu.icon-top > li > a svg { - display: block; - margin: 0 auto 0.25rem; } - .menu.icon-top.vertical a > span { - margin: auto; } - .menu.nested { - margin-left: 1rem; } - .menu .active > a { - background: #5a98e5; - color: #fefefe; } - .menu.menu-bordered li { - border: 1px solid #f5f6f9; } - .menu.menu-bordered li:not(:first-child) { - border-top: 0; } - .menu.menu-hover li:hover { - background-color: #f5f6f9; } + width: 100%; + table-layout: fixed; + } + .menu.large-expanded > li:first-child:last-child { + width: 100%; + } + .menu.large-vertical > li { + display: block; + } +} +.menu.simple li { + display: inline-block; + margin-right: 1rem; + line-height: 1; +} +.menu.simple a { + padding: 0; +} +.menu.align-right::before, +.menu.align-right::after { + display: table; + content: " "; +} +.menu.align-right::after { + clear: both; +} +.menu.align-right > li { + float: right; +} +.menu.icon-top > li > a { + text-align: center; +} +.menu.icon-top > li > a img, +.menu.icon-top > li > a i, +.menu.icon-top > li > a svg { + display: block; + margin: 0 auto 0.25rem; +} +.menu.icon-top.vertical a > span { + margin: auto; +} +.menu.nested { + margin-left: 1rem; +} +.menu .active > a { + background: #5a98e5; + color: #fefefe; +} +.menu.menu-bordered li { + border: 1px solid #f5f6f9; +} +.menu.menu-bordered li:not(:first-child) { + border-top: 0; +} +.menu.menu-hover li:hover { + background-color: #f5f6f9; +} .menu-text { padding-top: 0; @@ -2511,15 +3452,19 @@ select { padding: 0.7rem 1rem; font-weight: bold; line-height: 1; - color: inherit; } + color: inherit; +} .menu-centered { - text-align: center; } - .menu-centered > .menu { - display: inline-block; } + text-align: center; +} +.menu-centered > .menu { + display: inline-block; +} .no-js [data-responsive-menu] ul { - display: none; } + display: none; +} .menu-icon { position: relative; @@ -2527,20 +3472,27 @@ select { vertical-align: middle; width: 20px; height: 16px; - cursor: pointer; } - .menu-icon::after { - position: absolute; - top: 0; - left: 0; - display: block; - width: 100%; - height: 2px; - background: #5a98e5; - box-shadow: 0 7px 0 #5a98e5, 0 14px 0 #5a98e5; - content: ''; } - .menu-icon:hover::after { - background: #2e7cde; - box-shadow: 0 7px 0 #2e7cde, 0 14px 0 #2e7cde; } + cursor: pointer; +} +.menu-icon::after { + position: absolute; + top: 0; + left: 0; + display: block; + width: 100%; + height: 2px; + background: #5a98e5; + box-shadow: + 0 7px 0 #5a98e5, + 0 14px 0 #5a98e5; + content: ""; +} +.menu-icon:hover::after { + background: #2e7cde; + box-shadow: + 0 7px 0 #2e7cde, + 0 14px 0 #2e7cde; +} .menu-icon.dark { position: relative; @@ -2548,28 +3500,38 @@ select { vertical-align: middle; width: 20px; height: 16px; - cursor: pointer; } - .menu-icon.dark::after { - position: absolute; - top: 0; - left: 0; - display: block; - width: 100%; - height: 2px; - background: #0a0a0a; - box-shadow: 0 7px 0 #0a0a0a, 0 14px 0 #0a0a0a; - content: ''; } - .menu-icon.dark:hover::after { - background: #5b5e61; - box-shadow: 0 7px 0 #5b5e61, 0 14px 0 #5b5e61; } + cursor: pointer; +} +.menu-icon.dark::after { + position: absolute; + top: 0; + left: 0; + display: block; + width: 100%; + height: 2px; + background: #0a0a0a; + box-shadow: + 0 7px 0 #0a0a0a, + 0 14px 0 #0a0a0a; + content: ""; +} +.menu-icon.dark:hover::after { + background: #5b5e61; + box-shadow: + 0 7px 0 #5b5e61, + 0 14px 0 #5b5e61; +} .is-drilldown { position: relative; - overflow: hidden; } - .is-drilldown li { - display: block; } - .is-drilldown.animate-height { - transition: height 0.5s; } + overflow: hidden; +} +.is-drilldown li { + display: block; +} +.is-drilldown.animate-height { + transition: height 0.5s; +} .is-drilldown-submenu { position: absolute; @@ -2580,43 +3542,51 @@ select { background: #fefefe; transition: -webkit-transform 0.15s linear; transition: transform 0.15s linear; - transition: transform 0.15s linear, -webkit-transform 0.15s linear; } - .is-drilldown-submenu.is-active { - z-index: 1; - display: block; - -webkit-transform: translateX(-100%); - -ms-transform: translateX(-100%); - transform: translateX(-100%); } - .is-drilldown-submenu.is-closing { - -webkit-transform: translateX(100%); - -ms-transform: translateX(100%); - transform: translateX(100%); } + transition: + transform 0.15s linear, + -webkit-transform 0.15s linear; +} +.is-drilldown-submenu.is-active { + z-index: 1; + display: block; + -webkit-transform: translateX(-100%); + -ms-transform: translateX(-100%); + transform: translateX(-100%); +} +.is-drilldown-submenu.is-closing { + -webkit-transform: translateX(100%); + -ms-transform: translateX(100%); + transform: translateX(100%); +} .drilldown-submenu-cover-previous { - min-height: 100%; } + min-height: 100%; +} .is-drilldown-submenu-parent > a { - position: relative; } - .is-drilldown-submenu-parent > a::after { - display: block; - width: 0; - height: 0; - border: inset 6px; - content: ''; - border-right-width: 0; - border-left-style: solid; - border-color: transparent transparent transparent #5a98e5; - position: absolute; - top: 50%; - margin-top: -6px; - right: 1rem; } + position: relative; +} +.is-drilldown-submenu-parent > a::after { + display: block; + width: 0; + height: 0; + border: inset 6px; + content: ""; + border-right-width: 0; + border-left-style: solid; + border-color: transparent transparent transparent #5a98e5; + position: absolute; + top: 50%; + margin-top: -6px; + right: 1rem; +} .js-drilldown-back > a::before { display: block; width: 0; height: 0; border: inset 6px; - content: ''; + content: ""; border-left-width: 0; border-right-style: solid; border-color: transparent #5a98e5 transparent transparent; @@ -2624,7 +3594,8 @@ select { display: inline-block; vertical-align: middle; margin-right: 0.75rem; - border-left-width: 0; } + border-left-width: 0; +} .dropdown-pane { position: absolute; @@ -2636,272 +3607,333 @@ select { border: none; border-radius: 4px; background-color: #f5f6f9; - font-size: 1rem; } - .dropdown-pane.is-open { - visibility: visible; } + font-size: 1rem; +} +.dropdown-pane.is-open { + visibility: visible; +} .dropdown-pane.tiny { - width: 100px; } + width: 100px; +} -.dropdown-pane.small, .title-area .dropdown-pane.button { - width: 200px; } +.dropdown-pane.small, +.title-area .dropdown-pane.button { + width: 200px; +} .dropdown-pane.large { - width: 400px; } + width: 400px; +} .dropdown.menu > li.opens-left > .is-dropdown-submenu { top: 100%; right: 0; - left: auto; } + left: auto; +} .dropdown.menu > li.opens-right > .is-dropdown-submenu { top: 100%; right: auto; - left: 0; } + left: 0; +} .dropdown.menu > li.is-dropdown-submenu-parent > a { position: relative; - padding-right: 1.5rem; } + padding-right: 1.5rem; +} .dropdown.menu > li.is-dropdown-submenu-parent > a::after { display: block; width: 0; height: 0; border: inset 6px; - content: ''; + content: ""; border-bottom-width: 0; border-top-style: solid; border-color: #5a98e5 transparent transparent; right: 5px; - margin-top: -3px; } + margin-top: -3px; +} -[data-whatinput='mouse'] .dropdown.menu a { - outline: 0; } +[data-whatinput="mouse"] .dropdown.menu a { + outline: 0; +} .no-js .dropdown.menu ul { - display: none; } + display: none; +} .dropdown.menu.vertical > li .is-dropdown-submenu { - top: 0; } + top: 0; +} .dropdown.menu.vertical > li.opens-left > .is-dropdown-submenu { right: 100%; - left: auto; } + left: auto; +} .dropdown.menu.vertical > li.opens-right > .is-dropdown-submenu { right: auto; - left: 100%; } + left: 100%; +} .dropdown.menu.vertical > li > a::after { - right: 14px; } + right: 14px; +} .dropdown.menu.vertical > li.opens-left > a::after { display: block; width: 0; height: 0; border: inset 6px; - content: ''; + content: ""; border-left-width: 0; border-right-style: solid; - border-color: transparent #5a98e5 transparent transparent; } + border-color: transparent #5a98e5 transparent transparent; +} .dropdown.menu.vertical > li.opens-right > a::after { display: block; width: 0; height: 0; border: inset 6px; - content: ''; + content: ""; border-right-width: 0; border-left-style: solid; - border-color: transparent transparent transparent #5a98e5; } + border-color: transparent transparent transparent #5a98e5; +} @media print, screen and (min-width: 40em) { .dropdown.menu.medium-horizontal > li.opens-left > .is-dropdown-submenu { top: 100%; right: 0; - left: auto; } + left: auto; + } .dropdown.menu.medium-horizontal > li.opens-right > .is-dropdown-submenu { top: 100%; right: auto; - left: 0; } + left: 0; + } .dropdown.menu.medium-horizontal > li.is-dropdown-submenu-parent > a { position: relative; - padding-right: 1.5rem; } + padding-right: 1.5rem; + } .dropdown.menu.medium-horizontal > li.is-dropdown-submenu-parent > a::after { display: block; width: 0; height: 0; border: inset 6px; - content: ''; + content: ""; border-bottom-width: 0; border-top-style: solid; border-color: #5a98e5 transparent transparent; right: 5px; - margin-top: -3px; } + margin-top: -3px; + } .dropdown.menu.medium-vertical > li .is-dropdown-submenu { - top: 0; } + top: 0; + } .dropdown.menu.medium-vertical > li.opens-left > .is-dropdown-submenu { right: 100%; - left: auto; } + left: auto; + } .dropdown.menu.medium-vertical > li.opens-right > .is-dropdown-submenu { right: auto; - left: 100%; } + left: 100%; + } .dropdown.menu.medium-vertical > li > a::after { - right: 14px; } + right: 14px; + } .dropdown.menu.medium-vertical > li.opens-left > a::after { display: block; width: 0; height: 0; border: inset 6px; - content: ''; + content: ""; border-left-width: 0; border-right-style: solid; - border-color: transparent #5a98e5 transparent transparent; } + border-color: transparent #5a98e5 transparent transparent; + } .dropdown.menu.medium-vertical > li.opens-right > a::after { display: block; width: 0; height: 0; border: inset 6px; - content: ''; + content: ""; border-right-width: 0; border-left-style: solid; - border-color: transparent transparent transparent #5a98e5; } } + border-color: transparent transparent transparent #5a98e5; + } +} @media print, screen and (min-width: 64em) { .dropdown.menu.large-horizontal > li.opens-left > .is-dropdown-submenu { top: 100%; right: 0; - left: auto; } + left: auto; + } .dropdown.menu.large-horizontal > li.opens-right > .is-dropdown-submenu { top: 100%; right: auto; - left: 0; } + left: 0; + } .dropdown.menu.large-horizontal > li.is-dropdown-submenu-parent > a { position: relative; - padding-right: 1.5rem; } + padding-right: 1.5rem; + } .dropdown.menu.large-horizontal > li.is-dropdown-submenu-parent > a::after { display: block; width: 0; height: 0; border: inset 6px; - content: ''; + content: ""; border-bottom-width: 0; border-top-style: solid; border-color: #5a98e5 transparent transparent; right: 5px; - margin-top: -3px; } + margin-top: -3px; + } .dropdown.menu.large-vertical > li .is-dropdown-submenu { - top: 0; } + top: 0; + } .dropdown.menu.large-vertical > li.opens-left > .is-dropdown-submenu { right: 100%; - left: auto; } + left: auto; + } .dropdown.menu.large-vertical > li.opens-right > .is-dropdown-submenu { right: auto; - left: 100%; } + left: 100%; + } .dropdown.menu.large-vertical > li > a::after { - right: 14px; } + right: 14px; + } .dropdown.menu.large-vertical > li.opens-left > a::after { display: block; width: 0; height: 0; border: inset 6px; - content: ''; + content: ""; border-left-width: 0; border-right-style: solid; - border-color: transparent #5a98e5 transparent transparent; } + border-color: transparent #5a98e5 transparent transparent; + } .dropdown.menu.large-vertical > li.opens-right > a::after { display: block; width: 0; height: 0; border: inset 6px; - content: ''; + content: ""; border-right-width: 0; border-left-style: solid; - border-color: transparent transparent transparent #5a98e5; } } + border-color: transparent transparent transparent #5a98e5; + } +} .dropdown.menu.align-right .is-dropdown-submenu.first-sub { top: 100%; right: 0; - left: auto; } + left: auto; +} .is-dropdown-menu.vertical { - width: 100px; } - .is-dropdown-menu.vertical.align-right { - float: right; } + width: 100px; +} +.is-dropdown-menu.vertical.align-right { + float: right; +} .is-dropdown-submenu-parent { - position: relative; } - .is-dropdown-submenu-parent a::after { - position: absolute; - top: 50%; - right: 5px; - margin-top: -6px; } - .is-dropdown-submenu-parent.opens-inner > .is-dropdown-submenu { - top: 100%; - left: auto; } - .is-dropdown-submenu-parent.opens-left > .is-dropdown-submenu { - right: 100%; - left: auto; } - .is-dropdown-submenu-parent.opens-right > .is-dropdown-submenu { - right: auto; - left: 100%; } + position: relative; +} +.is-dropdown-submenu-parent a::after { + position: absolute; + top: 50%; + right: 5px; + margin-top: -6px; +} +.is-dropdown-submenu-parent.opens-inner > .is-dropdown-submenu { + top: 100%; + left: auto; +} +.is-dropdown-submenu-parent.opens-left > .is-dropdown-submenu { + right: 100%; + left: auto; +} +.is-dropdown-submenu-parent.opens-right > .is-dropdown-submenu { + right: auto; + left: 100%; +} + +.is-dropdown-submenu { + position: absolute; + top: 0; + left: 100%; + z-index: 1; + display: none; + min-width: 200px; + border: 1px solid #b7bac0; + background: #fefefe; +} +.is-dropdown-submenu .is-dropdown-submenu-parent > a::after { + right: 14px; +} +.is-dropdown-submenu .is-dropdown-submenu-parent.opens-left > a::after { + display: block; + width: 0; + height: 0; + border: inset 6px; + content: ""; + border-left-width: 0; + border-right-style: solid; + border-color: transparent #5a98e5 transparent transparent; +} +.is-dropdown-submenu .is-dropdown-submenu-parent.opens-right > a::after { + display: block; + width: 0; + height: 0; + border: inset 6px; + content: ""; + border-right-width: 0; + border-left-style: solid; + border-color: transparent transparent transparent #5a98e5; +} +.is-dropdown-submenu .is-dropdown-submenu { + margin-top: -1px; +} +.is-dropdown-submenu > li { + width: 100%; +} +.is-dropdown-submenu.js-dropdown-active { + display: block; +} -.is-dropdown-submenu { - position: absolute; - top: 0; - left: 100%; - z-index: 1; - display: none; - min-width: 200px; - border: 1px solid #b7bac0; - background: #fefefe; } - .is-dropdown-submenu .is-dropdown-submenu-parent > a::after { - right: 14px; } - .is-dropdown-submenu .is-dropdown-submenu-parent.opens-left > a::after { - display: block; - width: 0; - height: 0; - border: inset 6px; - content: ''; - border-left-width: 0; - border-right-style: solid; - border-color: transparent #5a98e5 transparent transparent; } - .is-dropdown-submenu .is-dropdown-submenu-parent.opens-right > a::after { - display: block; - width: 0; - height: 0; - border: inset 6px; - content: ''; - border-right-width: 0; - border-left-style: solid; - border-color: transparent transparent transparent #5a98e5; } - .is-dropdown-submenu .is-dropdown-submenu { - margin-top: -1px; } - .is-dropdown-submenu > li { - width: 100%; } - .is-dropdown-submenu.js-dropdown-active { - display: block; } - -.responsive-embed, .flex-video { +.responsive-embed, +.flex-video { position: relative; height: 0; margin-bottom: 1rem; padding-bottom: 75%; - overflow: hidden; } - .responsive-embed iframe, - .responsive-embed object, - .responsive-embed embed, - .responsive-embed video, .flex-video iframe, - .flex-video object, - .flex-video embed, - .flex-video video { - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; } - .responsive-embed.widescreen, .flex-video.widescreen { - padding-bottom: 56.25%; } + overflow: hidden; +} +.responsive-embed iframe, +.responsive-embed object, +.responsive-embed embed, +.responsive-embed video, +.flex-video iframe, +.flex-video object, +.flex-video embed, +.flex-video video { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; +} +.responsive-embed.widescreen, +.flex-video.widescreen { + padding-bottom: 56.25%; +} .label { display: inline-block; @@ -2912,52 +3944,70 @@ select { white-space: nowrap; cursor: default; background: #5a98e5; - color: #fefefe; } - .label.primary { - background: #5a98e5; - color: #0a0a0a; } - .label.secondary { - background: #1a2a57; - color: #fefefe; } - .label.success { - background: #def5e3; - color: #0a0a0a; } - .label.warning { - background: #fbf0dc; - color: #0a0a0a; } - .label.alert { - background: #f5dee4; - color: #0a0a0a; } + color: #fefefe; +} +.label.primary { + background: #5a98e5; + color: #0a0a0a; +} +.label.secondary { + background: #1a2a57; + color: #fefefe; +} +.label.success { + background: #def5e3; + color: #0a0a0a; +} +.label.warning { + background: #fbf0dc; + color: #0a0a0a; +} +.label.alert { + background: #f5dee4; + color: #0a0a0a; +} .media-object { display: block; - margin-bottom: 1rem; } - .media-object img { - max-width: none; } - @media screen and (max-width: 39.9375em) { - .media-object.stack-for-small .media-object-section { - padding: 0; - padding-bottom: 1rem; - display: block; } - .media-object.stack-for-small .media-object-section img { - width: 100%; } } + margin-bottom: 1rem; +} +.media-object img { + max-width: none; +} +@media screen and (max-width: 39.9375em) { + .media-object.stack-for-small .media-object-section { + padding: 0; + padding-bottom: 1rem; + display: block; + } + .media-object.stack-for-small .media-object-section img { + width: 100%; + } +} .media-object-section { display: table-cell; - vertical-align: top; } - .media-object-section:first-child { - padding-right: 1rem; } - .media-object-section:last-child:not(:nth-child(2)) { - padding-left: 1rem; } - .media-object-section > :last-child { - margin-bottom: 0; } - .media-object-section.middle { - vertical-align: middle; } - .media-object-section.bottom { - vertical-align: bottom; } + vertical-align: top; +} +.media-object-section:first-child { + padding-right: 1rem; +} +.media-object-section:last-child:not(:nth-child(2)) { + padding-left: 1rem; +} +.media-object-section > :last-child { + margin-bottom: 0; +} +.media-object-section.middle { + vertical-align: middle; +} +.media-object-section.bottom { + vertical-align: bottom; +} .is-off-canvas-open { - overflow: hidden; } + overflow: hidden; +} .js-off-canvas-overlay { position: absolute; @@ -2965,64 +4015,86 @@ select { left: 0; width: 100%; height: 100%; - transition: opacity 0.5s ease, visibility 0.5s ease; + transition: + opacity 0.5s ease, + visibility 0.5s ease; background: rgba(254, 254, 254, 0.25); opacity: 0; visibility: hidden; - overflow: hidden; } - .js-off-canvas-overlay.is-visible { - opacity: 1; - visibility: visible; } - .js-off-canvas-overlay.is-closable { - cursor: pointer; } - .js-off-canvas-overlay.is-overlay-absolute { - position: absolute; } - .js-off-canvas-overlay.is-overlay-fixed { - position: fixed; } + overflow: hidden; +} +.js-off-canvas-overlay.is-visible { + opacity: 1; + visibility: visible; +} +.js-off-canvas-overlay.is-closable { + cursor: pointer; +} +.js-off-canvas-overlay.is-overlay-absolute { + position: absolute; +} +.js-off-canvas-overlay.is-overlay-fixed { + position: fixed; +} .off-canvas-wrapper { position: relative; - overflow: hidden; } + overflow: hidden; +} .off-canvas { position: fixed; z-index: 1; transition: -webkit-transform 0.5s ease; transition: transform 0.5s ease; - transition: transform 0.5s ease, -webkit-transform 0.5s ease; + transition: + transform 0.5s ease, + -webkit-transform 0.5s ease; -webkit-backface-visibility: hidden; - backface-visibility: hidden; - background: #404554; } - [data-whatinput='mouse'] .off-canvas { - outline: 0; } - .off-canvas.is-transition-overlap { - z-index: 10; } - .off-canvas.is-transition-overlap.is-open { - box-shadow: 0 0 10px rgba(10, 10, 10, 0.7); } - .off-canvas.is-open { - -webkit-transform: translate(0, 0); - -ms-transform: translate(0, 0); - transform: translate(0, 0); } + backface-visibility: hidden; + background: #404554; +} +[data-whatinput="mouse"] .off-canvas { + outline: 0; +} +.off-canvas.is-transition-overlap { + z-index: 10; +} +.off-canvas.is-transition-overlap.is-open { + box-shadow: 0 0 10px rgba(10, 10, 10, 0.7); +} +.off-canvas.is-open { + -webkit-transform: translate(0, 0); + -ms-transform: translate(0, 0); + transform: translate(0, 0); +} .off-canvas-absolute { position: absolute; z-index: 1; transition: -webkit-transform 0.5s ease; transition: transform 0.5s ease; - transition: transform 0.5s ease, -webkit-transform 0.5s ease; + transition: + transform 0.5s ease, + -webkit-transform 0.5s ease; -webkit-backface-visibility: hidden; - backface-visibility: hidden; - background: #404554; } - [data-whatinput='mouse'] .off-canvas-absolute { - outline: 0; } - .off-canvas-absolute.is-transition-overlap { - z-index: 10; } - .off-canvas-absolute.is-transition-overlap.is-open { - box-shadow: 0 0 10px rgba(10, 10, 10, 0.7); } - .off-canvas-absolute.is-open { - -webkit-transform: translate(0, 0); - -ms-transform: translate(0, 0); - transform: translate(0, 0); } + backface-visibility: hidden; + background: #404554; +} +[data-whatinput="mouse"] .off-canvas-absolute { + outline: 0; +} +.off-canvas-absolute.is-transition-overlap { + z-index: 10; +} +.off-canvas-absolute.is-transition-overlap.is-open { + box-shadow: 0 0 10px rgba(10, 10, 10, 0.7); +} +.off-canvas-absolute.is-open { + -webkit-transform: translate(0, 0); + -ms-transform: translate(0, 0); + transform: translate(0, 0); +} .position-left { top: 0; @@ -3030,25 +4102,29 @@ select { width: 225px; height: 100%; -webkit-transform: translateX(-225px); - -ms-transform: translateX(-225px); - transform: translateX(-225px); - overflow-y: auto; } - .position-left.is-open ~ .off-canvas-content { - -webkit-transform: translateX(225px); - -ms-transform: translateX(225px); - transform: translateX(225px); } - .position-left.is-transition-push::after { - position: absolute; - top: 0; - right: 0; - height: 100%; - width: 1px; - box-shadow: 0 0 10px rgba(10, 10, 10, 0.7); - content: " "; } - .position-left.is-transition-overlap.is-open ~ .off-canvas-content { - -webkit-transform: none; - -ms-transform: none; - transform: none; } + -ms-transform: translateX(-225px); + transform: translateX(-225px); + overflow-y: auto; +} +.position-left.is-open ~ .off-canvas-content { + -webkit-transform: translateX(225px); + -ms-transform: translateX(225px); + transform: translateX(225px); +} +.position-left.is-transition-push::after { + position: absolute; + top: 0; + right: 0; + height: 100%; + width: 1px; + box-shadow: 0 0 10px rgba(10, 10, 10, 0.7); + content: " "; +} +.position-left.is-transition-overlap.is-open ~ .off-canvas-content { + -webkit-transform: none; + -ms-transform: none; + transform: none; +} .position-right { top: 0; @@ -3056,25 +4132,29 @@ select { width: 225px; height: 100%; -webkit-transform: translateX(225px); - -ms-transform: translateX(225px); - transform: translateX(225px); - overflow-y: auto; } - .position-right.is-open ~ .off-canvas-content { - -webkit-transform: translateX(-225px); - -ms-transform: translateX(-225px); - transform: translateX(-225px); } - .position-right.is-transition-push::after { - position: absolute; - top: 0; - left: 0; - height: 100%; - width: 1px; - box-shadow: 0 0 10px rgba(10, 10, 10, 0.7); - content: " "; } - .position-right.is-transition-overlap.is-open ~ .off-canvas-content { - -webkit-transform: none; - -ms-transform: none; - transform: none; } + -ms-transform: translateX(225px); + transform: translateX(225px); + overflow-y: auto; +} +.position-right.is-open ~ .off-canvas-content { + -webkit-transform: translateX(-225px); + -ms-transform: translateX(-225px); + transform: translateX(-225px); +} +.position-right.is-transition-push::after { + position: absolute; + top: 0; + left: 0; + height: 100%; + width: 1px; + box-shadow: 0 0 10px rgba(10, 10, 10, 0.7); + content: " "; +} +.position-right.is-transition-overlap.is-open ~ .off-canvas-content { + -webkit-transform: none; + -ms-transform: none; + transform: none; +} .position-top { top: 0; @@ -3082,25 +4162,29 @@ select { width: 100%; height: 250px; -webkit-transform: translateY(-250px); - -ms-transform: translateY(-250px); - transform: translateY(-250px); - overflow-x: auto; } - .position-top.is-open ~ .off-canvas-content { - -webkit-transform: translateY(250px); - -ms-transform: translateY(250px); - transform: translateY(250px); } - .position-top.is-transition-push::after { - position: absolute; - bottom: 0; - left: 0; - height: 1px; - width: 100%; - box-shadow: 0 0 10px rgba(10, 10, 10, 0.7); - content: " "; } - .position-top.is-transition-overlap.is-open ~ .off-canvas-content { - -webkit-transform: none; - -ms-transform: none; - transform: none; } + -ms-transform: translateY(-250px); + transform: translateY(-250px); + overflow-x: auto; +} +.position-top.is-open ~ .off-canvas-content { + -webkit-transform: translateY(250px); + -ms-transform: translateY(250px); + transform: translateY(250px); +} +.position-top.is-transition-push::after { + position: absolute; + bottom: 0; + left: 0; + height: 1px; + width: 100%; + box-shadow: 0 0 10px rgba(10, 10, 10, 0.7); + content: " "; +} +.position-top.is-transition-overlap.is-open ~ .off-canvas-content { + -webkit-transform: none; + -ms-transform: none; + transform: none; +} .position-bottom { bottom: 0; @@ -3108,116 +4192,147 @@ select { width: 100%; height: 250px; -webkit-transform: translateY(250px); - -ms-transform: translateY(250px); - transform: translateY(250px); - overflow-x: auto; } - .position-bottom.is-open ~ .off-canvas-content { - -webkit-transform: translateY(-250px); - -ms-transform: translateY(-250px); - transform: translateY(-250px); } - .position-bottom.is-transition-push::after { - position: absolute; - top: 0; - left: 0; - height: 1px; - width: 100%; - box-shadow: 0 0 10px rgba(10, 10, 10, 0.7); - content: " "; } - .position-bottom.is-transition-overlap.is-open ~ .off-canvas-content { - -webkit-transform: none; - -ms-transform: none; - transform: none; } + -ms-transform: translateY(250px); + transform: translateY(250px); + overflow-x: auto; +} +.position-bottom.is-open ~ .off-canvas-content { + -webkit-transform: translateY(-250px); + -ms-transform: translateY(-250px); + transform: translateY(-250px); +} +.position-bottom.is-transition-push::after { + position: absolute; + top: 0; + left: 0; + height: 1px; + width: 100%; + box-shadow: 0 0 10px rgba(10, 10, 10, 0.7); + content: " "; +} +.position-bottom.is-transition-overlap.is-open ~ .off-canvas-content { + -webkit-transform: none; + -ms-transform: none; + transform: none; +} .off-canvas-content { transition: -webkit-transform 0.5s ease; transition: transform 0.5s ease; - transition: transform 0.5s ease, -webkit-transform 0.5s ease; + transition: + transform 0.5s ease, + -webkit-transform 0.5s ease; -webkit-backface-visibility: hidden; - backface-visibility: hidden; } + backface-visibility: hidden; +} @media print, screen and (min-width: 40em) { .position-left.reveal-for-medium { -webkit-transform: none; - -ms-transform: none; - transform: none; - z-index: 1; } - .position-left.reveal-for-medium ~ .off-canvas-content { - margin-left: 225px; } + -ms-transform: none; + transform: none; + z-index: 1; + } + .position-left.reveal-for-medium ~ .off-canvas-content { + margin-left: 225px; + } .position-right.reveal-for-medium { -webkit-transform: none; - -ms-transform: none; - transform: none; - z-index: 1; } - .position-right.reveal-for-medium ~ .off-canvas-content { - margin-right: 225px; } + -ms-transform: none; + transform: none; + z-index: 1; + } + .position-right.reveal-for-medium ~ .off-canvas-content { + margin-right: 225px; + } .position-top.reveal-for-medium { -webkit-transform: none; - -ms-transform: none; - transform: none; - z-index: 1; } - .position-top.reveal-for-medium ~ .off-canvas-content { - margin-top: 225px; } + -ms-transform: none; + transform: none; + z-index: 1; + } + .position-top.reveal-for-medium ~ .off-canvas-content { + margin-top: 225px; + } .position-bottom.reveal-for-medium { -webkit-transform: none; - -ms-transform: none; - transform: none; - z-index: 1; } - .position-bottom.reveal-for-medium ~ .off-canvas-content { - margin-bottom: 225px; } } + -ms-transform: none; + transform: none; + z-index: 1; + } + .position-bottom.reveal-for-medium ~ .off-canvas-content { + margin-bottom: 225px; + } +} @media print, screen and (min-width: 64em) { .position-left.reveal-for-large { -webkit-transform: none; - -ms-transform: none; - transform: none; - z-index: 1; } - .position-left.reveal-for-large ~ .off-canvas-content { - margin-left: 225px; } + -ms-transform: none; + transform: none; + z-index: 1; + } + .position-left.reveal-for-large ~ .off-canvas-content { + margin-left: 225px; + } .position-right.reveal-for-large { -webkit-transform: none; - -ms-transform: none; - transform: none; - z-index: 1; } - .position-right.reveal-for-large ~ .off-canvas-content { - margin-right: 225px; } + -ms-transform: none; + transform: none; + z-index: 1; + } + .position-right.reveal-for-large ~ .off-canvas-content { + margin-right: 225px; + } .position-top.reveal-for-large { -webkit-transform: none; - -ms-transform: none; - transform: none; - z-index: 1; } - .position-top.reveal-for-large ~ .off-canvas-content { - margin-top: 225px; } + -ms-transform: none; + transform: none; + z-index: 1; + } + .position-top.reveal-for-large ~ .off-canvas-content { + margin-top: 225px; + } .position-bottom.reveal-for-large { -webkit-transform: none; - -ms-transform: none; - transform: none; - z-index: 1; } - .position-bottom.reveal-for-large ~ .off-canvas-content { - margin-bottom: 225px; } } + -ms-transform: none; + transform: none; + z-index: 1; + } + .position-bottom.reveal-for-large ~ .off-canvas-content { + margin-bottom: 225px; + } +} .orbit { - position: relative; } + position: relative; +} .orbit-container { position: relative; height: 0; margin: 0; list-style: none; - overflow: hidden; } + overflow: hidden; +} .orbit-slide { - width: 100%; } - .orbit-slide.no-motionui.is-active { - top: 0; - left: 0; } + width: 100%; +} +.orbit-slide.no-motionui.is-active { + top: 0; + left: 0; +} .orbit-figure { - margin: 0; } + margin: 0; +} .orbit-image { width: 100%; max-width: 100%; - margin: 0; } + margin: 0; +} .orbit-caption { position: absolute; @@ -3226,117 +4341,158 @@ select { margin-bottom: 0; padding: 1rem; background-color: rgba(10, 10, 10, 0.5); - color: #fefefe; } + color: #fefefe; +} -.orbit-previous, .orbit-next { +.orbit-previous, +.orbit-next { position: absolute; top: 50%; -webkit-transform: translateY(-50%); - -ms-transform: translateY(-50%); - transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); z-index: 10; padding: 1rem; - color: #fefefe; } - [data-whatinput='mouse'] .orbit-previous, [data-whatinput='mouse'] .orbit-next { - outline: 0; } - .orbit-previous:hover, .orbit-next:hover, .orbit-previous:active, .orbit-next:active, .orbit-previous:focus, .orbit-next:focus { - background-color: rgba(10, 10, 10, 0.5); } + color: #fefefe; +} +[data-whatinput="mouse"] .orbit-previous, +[data-whatinput="mouse"] .orbit-next { + outline: 0; +} +.orbit-previous:hover, +.orbit-next:hover, +.orbit-previous:active, +.orbit-next:active, +.orbit-previous:focus, +.orbit-next:focus { + background-color: rgba(10, 10, 10, 0.5); +} .orbit-previous { - left: 0; } + left: 0; +} .orbit-next { left: auto; - right: 0; } + right: 0; +} .orbit-bullets { position: relative; margin-top: 0.8rem; margin-bottom: 0.8rem; - text-align: center; } - [data-whatinput='mouse'] .orbit-bullets { - outline: 0; } - .orbit-bullets button { - width: 1.2rem; - height: 1.2rem; - margin: 0.1rem; - border-radius: 50%; - background-color: #b7bac0; } - .orbit-bullets button:hover { - background-color: #5b5e61; } - .orbit-bullets button.is-active { - background-color: #5b5e61; } + text-align: center; +} +[data-whatinput="mouse"] .orbit-bullets { + outline: 0; +} +.orbit-bullets button { + width: 1.2rem; + height: 1.2rem; + margin: 0.1rem; + border-radius: 50%; + background-color: #b7bac0; +} +.orbit-bullets button:hover { + background-color: #5b5e61; +} +.orbit-bullets button.is-active { + background-color: #5b5e61; +} .pagination { margin-left: 0; - margin-bottom: 1rem; } - .pagination::before, .pagination::after { - display: table; - content: ' '; } - .pagination::after { - clear: both; } + margin-bottom: 1rem; +} +.pagination::before, +.pagination::after { + display: table; + content: " "; +} +.pagination::after { + clear: both; +} +.pagination li { + margin-right: 0.0625rem; + border-radius: 4px; + font-size: 0.875rem; + display: none; +} +.pagination li:last-child, +.pagination li:first-child { + display: inline-block; +} +@media print, screen and (min-width: 40em) { .pagination li { - margin-right: 0.0625rem; - border-radius: 4px; - font-size: 0.875rem; - display: none; } - .pagination li:last-child, .pagination li:first-child { - display: inline-block; } - @media print, screen and (min-width: 40em) { - .pagination li { - display: inline-block; } } - .pagination a, - .pagination button { - display: block; - padding: 0.1875rem 0.625rem; - border-radius: 4px; - color: #0a0a0a; } - .pagination a:hover, - .pagination button:hover { - background: #f5f6f9; } - .pagination .current { - padding: 0.1875rem 0.625rem; - background: #5a98e5; - color: #fefefe; - cursor: default; } - .pagination .disabled { - padding: 0.1875rem 0.625rem; - color: #b7bac0; - cursor: not-allowed; } - .pagination .disabled:hover { - background: transparent; } - .pagination .ellipsis::after { - padding: 0.1875rem 0.625rem; - content: '\2026'; - color: #0a0a0a; } + display: inline-block; + } +} +.pagination a, +.pagination button { + display: block; + padding: 0.1875rem 0.625rem; + border-radius: 4px; + color: #0a0a0a; +} +.pagination a:hover, +.pagination button:hover { + background: #f5f6f9; +} +.pagination .current { + padding: 0.1875rem 0.625rem; + background: #5a98e5; + color: #fefefe; + cursor: default; +} +.pagination .disabled { + padding: 0.1875rem 0.625rem; + color: #b7bac0; + cursor: not-allowed; +} +.pagination .disabled:hover { + background: transparent; +} +.pagination .ellipsis::after { + padding: 0.1875rem 0.625rem; + content: "\2026"; + color: #0a0a0a; +} .pagination-previous a::before, .pagination-previous.disabled::before { display: inline-block; margin-right: 0.5rem; - content: '\00ab'; } + content: "\00ab"; +} .pagination-next a::after, .pagination-next.disabled::after { display: inline-block; margin-left: 0.5rem; - content: '\00bb'; } + content: "\00bb"; +} .progress { height: 1rem; margin-bottom: 1rem; border-radius: 4px; - background-color: #b7bac0; } - .progress.primary .progress-meter { - background-color: #5a98e5; } - .progress.secondary .progress-meter { - background-color: #1a2a57; } - .progress.success .progress-meter { - background-color: #def5e3; } - .progress.warning .progress-meter { - background-color: #fbf0dc; } - .progress.alert .progress-meter { - background-color: #f5dee4; } + background-color: #b7bac0; +} +.progress.primary .progress-meter { + background-color: #5a98e5; +} +.progress.secondary .progress-meter { + background-color: #1a2a57; +} +.progress.success .progress-meter { + background-color: #def5e3; +} +.progress.warning .progress-meter { + background-color: #fbf0dc; +} +.progress.alert .progress-meter { + background-color: #f5dee4; +} .progress-meter { position: relative; @@ -3344,22 +4500,24 @@ select { width: 0%; height: 100%; background-color: #5a98e5; - border-radius: 4px; } + border-radius: 4px; +} .progress-meter-text { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); - -ms-transform: translate(-50%, -50%); - transform: translate(-50%, -50%); + -ms-transform: translate(-50%, -50%); + transform: translate(-50%, -50%); position: absolute; margin: 0; font-size: 0.75rem; font-weight: bold; color: #fefefe; white-space: nowrap; - border-radius: 4px; } + border-radius: 4px; +} .slider { position: relative; @@ -3369,11 +4527,12 @@ select { background-color: #f5f6f9; cursor: pointer; -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; -ms-touch-action: none; - touch-action: none; } + touch-action: none; +} .slider-fill { position: absolute; @@ -3383,16 +4542,18 @@ select { max-width: 100%; height: 0.5rem; background-color: #b7bac0; - transition: all 0.2s ease-in-out; } - .slider-fill.is-dragging { - transition: all 0s linear; } + transition: all 0.2s ease-in-out; +} +.slider-fill.is-dragging { + transition: all 0s linear; +} .slider-handle { position: absolute; top: 50%; -webkit-transform: translateY(-50%); - -ms-transform: translateY(-50%); - transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); position: absolute; left: 0; z-index: 1; @@ -3403,18 +4564,23 @@ select { background-color: #5a98e5; transition: all 0.2s ease-in-out; -ms-touch-action: manipulation; - touch-action: manipulation; } - [data-whatinput='mouse'] .slider-handle { - outline: 0; } - .slider-handle:hover { - background-color: #317ede; } - .slider-handle.is-dragging { - transition: all 0s linear; } + touch-action: manipulation; +} +[data-whatinput="mouse"] .slider-handle { + outline: 0; +} +.slider-handle:hover { + background-color: #317ede; +} +.slider-handle.is-dragging { + transition: all 0s linear; +} .slider.disabled, .slider[disabled] { opacity: 0.25; - cursor: not-allowed; } + cursor: not-allowed; +} .slider.vertical { display: inline-block; @@ -3422,57 +4588,69 @@ select { height: 12.5rem; margin: 0 1.25rem; -webkit-transform: scale(1, -1); - -ms-transform: scale(1, -1); - transform: scale(1, -1); } - .slider.vertical .slider-fill { - top: 0; - width: 0.5rem; - max-height: 100%; } - .slider.vertical .slider-handle { - position: absolute; - top: 0; - left: 50%; - width: 1.4rem; - height: 1.4rem; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); } + -ms-transform: scale(1, -1); + transform: scale(1, -1); +} +.slider.vertical .slider-fill { + top: 0; + width: 0.5rem; + max-height: 100%; +} +.slider.vertical .slider-handle { + position: absolute; + top: 0; + left: 50%; + width: 1.4rem; + height: 1.4rem; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} .sticky-container { - position: relative; } + position: relative; +} .sticky { position: relative; z-index: 0; -webkit-transform: translate3d(0, 0, 0); - transform: translate3d(0, 0, 0); } + transform: translate3d(0, 0, 0); +} .sticky.is-stuck { position: fixed; - z-index: 5; } - .sticky.is-stuck.is-at-top { - top: 0; } - .sticky.is-stuck.is-at-bottom { - bottom: 0; } + z-index: 5; +} +.sticky.is-stuck.is-at-top { + top: 0; +} +.sticky.is-stuck.is-at-bottom { + bottom: 0; +} .sticky.is-anchored { position: relative; right: auto; - left: auto; } - .sticky.is-anchored.is-at-bottom { - bottom: 0; } + left: auto; +} +.sticky.is-anchored.is-at-bottom { + bottom: 0; +} body.is-reveal-open { - overflow: hidden; } + overflow: hidden; +} html.is-reveal-open, html.is-reveal-open body { min-height: 100%; overflow: hidden; -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; } + -moz-user-select: none; + -ms-user-select: none; + user-select: none; +} .reveal-overlay { position: fixed; @@ -3483,12 +4661,13 @@ html.is-reveal-open body { z-index: 1005; display: none; background-color: rgba(10, 10, 10, 0.45); - overflow-y: scroll; } + overflow-y: scroll; +} .reveal { z-index: 1006; -webkit-backface-visibility: hidden; - backface-visibility: hidden; + backface-visibility: hidden; display: none; padding: 0; border: 1px solid #b7bac0; @@ -3498,41 +4677,73 @@ html.is-reveal-open body { top: 100px; margin-right: auto; margin-left: auto; - overflow-y: auto; } - [data-whatinput='mouse'] .reveal { - outline: 0; } - @media print, screen and (min-width: 40em) { - .reveal { - min-height: 0; } } - .reveal .column, .reveal .columns, - .reveal .columns { - min-width: 0; } - .reveal > :last-child { - margin-bottom: 0; } - @media print, screen and (min-width: 40em) { - .reveal { - min-width: 600px; - max-width: 75rem; } } - @media print, screen and (min-width: 40em) { - .reveal .reveal { - right: auto; - left: auto; - margin: 0 auto; } } - .reveal.collapse { - padding: 0; } - @media print, screen and (min-width: 40em) { - .reveal.tiny { - width: 30%; - max-width: 75rem; } } - @media print, screen and (min-width: 40em) { - .reveal.small, .title-area .reveal.button { - width: 50%; - max-width: 75rem; } } - @media print, screen and (min-width: 40em) { - .reveal.large { - width: 90%; - max-width: 75rem; } } - .reveal.full { + overflow-y: auto; +} +[data-whatinput="mouse"] .reveal { + outline: 0; +} +@media print, screen and (min-width: 40em) { + .reveal { + min-height: 0; + } +} +.reveal .column, +.reveal .columns, +.reveal .columns { + min-width: 0; +} +.reveal > :last-child { + margin-bottom: 0; +} +@media print, screen and (min-width: 40em) { + .reveal { + min-width: 600px; + max-width: 75rem; + } +} +@media print, screen and (min-width: 40em) { + .reveal .reveal { + right: auto; + left: auto; + margin: 0 auto; + } +} +.reveal.collapse { + padding: 0; +} +@media print, screen and (min-width: 40em) { + .reveal.tiny { + width: 30%; + max-width: 75rem; + } +} +@media print, screen and (min-width: 40em) { + .reveal.small, + .title-area .reveal.button { + width: 50%; + max-width: 75rem; + } +} +@media print, screen and (min-width: 40em) { + .reveal.large { + width: 90%; + max-width: 75rem; + } +} +.reveal.full { + top: 0; + left: 0; + width: 100%; + max-width: none; + height: 100%; + height: 100vh; + min-height: 100vh; + margin-left: 0; + border: 0; + border-radius: 0; +} +@media screen and (max-width: 39.9375em) { + .reveal { top: 0; left: 0; width: 100%; @@ -3542,21 +4753,12 @@ html.is-reveal-open body { min-height: 100vh; margin-left: 0; border: 0; - border-radius: 0; } - @media screen and (max-width: 39.9375em) { - .reveal { - top: 0; - left: 0; - width: 100%; - max-width: none; - height: 100%; - height: 100vh; - min-height: 100vh; - margin-left: 0; - border: 0; - border-radius: 0; } } - .reveal.without-overlay { - position: fixed; } + border-radius: 0; + } +} +.reveal.without-overlay { + position: fixed; +} .switch { height: 2rem; @@ -3567,14 +4769,16 @@ html.is-reveal-open body { font-weight: bold; color: #fefefe; -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; } + -moz-user-select: none; + -ms-user-select: none; + user-select: none; +} .switch-input { position: absolute; margin-bottom: 0; - opacity: 0; } + opacity: 0; +} .switch-paddle { position: relative; @@ -3586,141 +4790,185 @@ html.is-reveal-open body { transition: all 0.25s ease-out; font-weight: inherit; color: inherit; - cursor: pointer; } - input + .switch-paddle { - margin: 0; } - .switch-paddle::after { - position: absolute; - top: 0.25rem; - left: 0.25rem; - display: block; - width: 1.5rem; - height: 1.5rem; - -webkit-transform: translate3d(0, 0, 0); - transform: translate3d(0, 0, 0); - border-radius: 4px; - background: #fefefe; - transition: all 0.25s ease-out; - content: ''; } - input:checked ~ .switch-paddle { - background: #5a98e5; } - input:checked ~ .switch-paddle::after { - left: 2.25rem; } - [data-whatinput='mouse'] input:focus ~ .switch-paddle { - outline: 0; } - -.switch-active, .switch-inactive { + cursor: pointer; +} +input + .switch-paddle { + margin: 0; +} +.switch-paddle::after { + position: absolute; + top: 0.25rem; + left: 0.25rem; + display: block; + width: 1.5rem; + height: 1.5rem; + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); + border-radius: 4px; + background: #fefefe; + transition: all 0.25s ease-out; + content: ""; +} +input:checked ~ .switch-paddle { + background: #5a98e5; +} +input:checked ~ .switch-paddle::after { + left: 2.25rem; +} +[data-whatinput="mouse"] input:focus ~ .switch-paddle { + outline: 0; +} + +.switch-active, +.switch-inactive { position: absolute; top: 50%; -webkit-transform: translateY(-50%); - -ms-transform: translateY(-50%); - transform: translateY(-50%); } + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} .switch-active { left: 8%; - display: none; } - input:checked + label > .switch-active { - display: block; } + display: none; +} +input:checked + label > .switch-active { + display: block; +} .switch-inactive { - right: 15%; } - input:checked + label > .switch-inactive { - display: none; } + right: 15%; +} +input:checked + label > .switch-inactive { + display: none; +} .switch.tiny { - height: 1.5rem; } - .switch.tiny .switch-paddle { - width: 3rem; - height: 1.5rem; - font-size: 0.625rem; } - .switch.tiny .switch-paddle::after { - top: 0.25rem; - left: 0.25rem; - width: 1rem; - height: 1rem; } - .switch.tiny input:checked ~ .switch-paddle::after { - left: 1.75rem; } - -.switch.small, .title-area .switch.button { - height: 1.75rem; } - .switch.small .switch-paddle, .title-area .switch.button .switch-paddle { - width: 3.5rem; - height: 1.75rem; - font-size: 0.75rem; } - .switch.small .switch-paddle::after, .title-area .switch.button .switch-paddle::after { - top: 0.25rem; - left: 0.25rem; - width: 1.25rem; - height: 1.25rem; } - .switch.small input:checked ~ .switch-paddle::after, .title-area .switch.button input:checked ~ .switch-paddle::after { - left: 2rem; } + height: 1.5rem; +} +.switch.tiny .switch-paddle { + width: 3rem; + height: 1.5rem; + font-size: 0.625rem; +} +.switch.tiny .switch-paddle::after { + top: 0.25rem; + left: 0.25rem; + width: 1rem; + height: 1rem; +} +.switch.tiny input:checked ~ .switch-paddle::after { + left: 1.75rem; +} + +.switch.small, +.title-area .switch.button { + height: 1.75rem; +} +.switch.small .switch-paddle, +.title-area .switch.button .switch-paddle { + width: 3.5rem; + height: 1.75rem; + font-size: 0.75rem; +} +.switch.small .switch-paddle::after, +.title-area .switch.button .switch-paddle::after { + top: 0.25rem; + left: 0.25rem; + width: 1.25rem; + height: 1.25rem; +} +.switch.small input:checked ~ .switch-paddle::after, +.title-area .switch.button input:checked ~ .switch-paddle::after { + left: 2rem; +} .switch.large { - height: 2.5rem; } - .switch.large .switch-paddle { - width: 5rem; - height: 2.5rem; - font-size: 1rem; } - .switch.large .switch-paddle::after { - top: 0.25rem; - left: 0.25rem; - width: 2rem; - height: 2rem; } - .switch.large input:checked ~ .switch-paddle::after { - left: 2.75rem; } + height: 2.5rem; +} +.switch.large .switch-paddle { + width: 5rem; + height: 2.5rem; + font-size: 1rem; +} +.switch.large .switch-paddle::after { + top: 0.25rem; + left: 0.25rem; + width: 2rem; + height: 2rem; +} +.switch.large input:checked ~ .switch-paddle::after { + left: 2.75rem; +} table { width: 100%; margin-bottom: 1rem; - border-radius: 4px; } - table thead, - table tbody, - table tfoot { - border: 1px solid #f1f1f1; - background-color: #fefefe; } - table caption { - padding: 0.5rem 0.625rem 0.625rem; - font-weight: bold; } - table thead { - background: #f8f8f8; - color: #0a0a0a; } - table tfoot { - background: #f1f1f1; - color: #0a0a0a; } - table thead tr, - table tfoot tr { - background: transparent; } - table thead th, - table thead td, - table tfoot th, - table tfoot td { - padding: 0.5rem 0.625rem 0.625rem; - font-weight: bold; - text-align: left; } - table tbody th, - table tbody td { - padding: 0.5rem 0.625rem 0.625rem; } - table tbody tr:nth-child(even) { - border-bottom: 0; - background-color: #f1f1f1; } - table.unstriped tbody { - background-color: #fefefe; } - table.unstriped tbody tr { - border-bottom: 0; - border-bottom: 1px solid #f1f1f1; - background-color: #fefefe; } + border-radius: 4px; +} +table thead, +table tbody, +table tfoot { + border: 1px solid #f1f1f1; + background-color: #fefefe; +} +table caption { + padding: 0.5rem 0.625rem 0.625rem; + font-weight: bold; +} +table thead { + background: #f8f8f8; + color: #0a0a0a; +} +table tfoot { + background: #f1f1f1; + color: #0a0a0a; +} +table thead tr, +table tfoot tr { + background: transparent; +} +table thead th, +table thead td, +table tfoot th, +table tfoot td { + padding: 0.5rem 0.625rem 0.625rem; + font-weight: bold; + text-align: left; +} +table tbody th, +table tbody td { + padding: 0.5rem 0.625rem 0.625rem; +} +table tbody tr:nth-child(even) { + border-bottom: 0; + background-color: #f1f1f1; +} +table.unstriped tbody { + background-color: #fefefe; +} +table.unstriped tbody tr { + border-bottom: 0; + border-bottom: 1px solid #f1f1f1; + background-color: #fefefe; +} @media screen and (max-width: 63.9375em) { table.stack thead { - display: none; } + display: none; + } table.stack tfoot { - display: none; } + display: none; + } table.stack tr, table.stack th, table.stack td { - display: block; } + display: block; + } table.stack td { - border-top: 0; } } + border-top: 0; + } +} table.scroll { display: table; @@ -3737,81 +4985,107 @@ table.scroll { } table.hover thead tr:hover { - background-color: #f3f3f3; } + background-color: #f3f3f3; +} table.hover tfoot tr:hover { - background-color: #ececec; } + background-color: #ececec; +} table.hover tbody tr:hover { - background-color: #f9f9f9; } + background-color: #f9f9f9; +} table.hover:not(.unstriped) tr:nth-of-type(even):hover { - background-color: #ececec; } + background-color: #ececec; +} .table-scroll { - overflow-x: auto; } - .table-scroll table { - width: auto; } + overflow-x: auto; +} +.table-scroll table { + width: auto; +} .tabs { margin: 0; border: 1px solid #f5f6f9; background: #fefefe; - list-style-type: none; } - .tabs::before, .tabs::after { - display: table; - content: ' '; } - .tabs::after { - clear: both; } + list-style-type: none; +} +.tabs::before, +.tabs::after { + display: table; + content: " "; +} +.tabs::after { + clear: both; +} .tabs.vertical > li { display: block; float: none; - width: auto; } + width: auto; +} .tabs.simple > li > a { - padding: 0; } - .tabs.simple > li > a:hover { - background: transparent; } + padding: 0; +} +.tabs.simple > li > a:hover { + background: transparent; +} .tabs.primary { - background: #5a98e5; } - .tabs.primary > li > a { - color: #0a0a0a; } - .tabs.primary > li > a:hover, .tabs.primary > li > a:focus { - background: #4c8fe3; } + background: #5a98e5; +} +.tabs.primary > li > a { + color: #0a0a0a; +} +.tabs.primary > li > a:hover, +.tabs.primary > li > a:focus { + background: #4c8fe3; +} .tabs-title { - float: left; } - .tabs-title > a { - display: block; - padding: 1.25rem 1.5rem; - font-size: 0.75rem; - line-height: 1; - color: #5a98e5; } - .tabs-title > a:hover { - background: #fefefe; - color: #3380df; } - .tabs-title > a:focus, .tabs-title > a[aria-selected='true'] { - background: #f5f6f9; - color: #5a98e5; } + float: left; +} +.tabs-title > a { + display: block; + padding: 1.25rem 1.5rem; + font-size: 0.75rem; + line-height: 1; + color: #5a98e5; +} +.tabs-title > a:hover { + background: #fefefe; + color: #3380df; +} +.tabs-title > a:focus, +.tabs-title > a[aria-selected="true"] { + background: #f5f6f9; + color: #5a98e5; +} .tabs-content { border: 1px solid #f5f6f9; border-top: 0; background: #fefefe; color: #0a0a0a; - transition: all 0.5s ease; } + transition: all 0.5s ease; +} .tabs-content.vertical { border: 1px solid #f5f6f9; - border-left: 0; } + border-left: 0; +} .tabs-panel { display: none; - padding: 1rem; } - .tabs-panel[aria-hidden="false"] { - display: block; } + padding: 1rem; +} +.tabs-panel[aria-hidden="false"] { + display: block; +} .thumbnail { display: inline-block; @@ -3820,206 +5094,266 @@ table.hover:not(.unstriped) tr:nth-of-type(even):hover { border: solid 4px #fefefe; border-radius: 4px; box-shadow: 0 0 0 1px rgba(10, 10, 10, 0.2); - line-height: 0; } + line-height: 0; +} a.thumbnail { - transition: box-shadow 200ms ease-out; } - a.thumbnail:hover, a.thumbnail:focus { - box-shadow: 0 0 6px 1px rgba(90, 152, 229, 0.5); } - a.thumbnail image { - box-shadow: none; } + transition: box-shadow 200ms ease-out; +} +a.thumbnail:hover, +a.thumbnail:focus { + box-shadow: 0 0 6px 1px rgba(90, 152, 229, 0.5); +} +a.thumbnail image { + box-shadow: none; +} .title-bar { padding: 0.5rem; background: none; - color: #fefefe; } - .title-bar::before, .title-bar::after { - display: table; - content: ' '; } - .title-bar::after { - clear: both; } - .title-bar .menu-icon { - margin-left: 0.25rem; - margin-right: 0.25rem; } + color: #fefefe; +} +.title-bar::before, +.title-bar::after { + display: table; + content: " "; +} +.title-bar::after { + clear: both; +} +.title-bar .menu-icon { + margin-left: 0.25rem; + margin-right: 0.25rem; +} .title-bar-left { - float: left; } + float: left; +} .title-bar-right { float: right; - text-align: right; } + text-align: right; +} .title-bar-title { display: inline-block; vertical-align: middle; - font-weight: bold; } + font-weight: bold; +} .has-tip { - position: relative; - display: inline-block; - border-bottom: dotted 1px #5b5e61; - font-weight: bold;} - -.tooltip { - position: absolute; - top: calc(100% + 0.6495rem); - z-index: 1200; - max-width: 10rem; - padding: 0.75rem; - border-radius: 4px; - background-color: #0a0a0a; - font-size: 80%; - color: #fefefe; } - .tooltip::before { - display: block; - width: 0; - height: 0; - border: inset 0.75rem; - content: ''; - border-top-width: 0; - border-bottom-style: solid; - border-color: transparent transparent #0a0a0a; - position: absolute; - bottom: 100%; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); } - .tooltip.top::before { - display: block; - width: 0; - height: 0; - border: inset 0.75rem; - content: ''; - border-bottom-width: 0; - border-top-style: solid; - border-color: #0a0a0a transparent transparent; - top: 100%; - bottom: auto; } - .tooltip.left::before { - display: block; - width: 0; - height: 0; - border: inset 0.75rem; - content: ''; - border-right-width: 0; - border-left-style: solid; - border-color: transparent transparent transparent #0a0a0a; - top: 50%; - bottom: auto; - left: 100%; - -webkit-transform: translateY(-50%); - -ms-transform: translateY(-50%); - transform: translateY(-50%); } - .tooltip.right::before { - display: block; - width: 0; - height: 0; - border: inset 0.75rem; - content: ''; - border-left-width: 0; - border-right-style: solid; - border-color: transparent #0a0a0a transparent transparent; - top: 50%; - right: 100%; - bottom: auto; - left: auto; - -webkit-transform: translateY(-50%); - -ms-transform: translateY(-50%); - transform: translateY(-50%); } + position: relative; + display: inline-block; + border-bottom: dotted 1px #5b5e61; + font-weight: bold; +} + +.tooltip { + position: absolute; + top: calc(100% + 0.6495rem); + z-index: 1200; + max-width: 10rem; + padding: 0.75rem; + border-radius: 4px; + background-color: #0a0a0a; + font-size: 80%; + color: #fefefe; +} +.tooltip::before { + display: block; + width: 0; + height: 0; + border: inset 0.75rem; + content: ""; + border-top-width: 0; + border-bottom-style: solid; + border-color: transparent transparent #0a0a0a; + position: absolute; + bottom: 100%; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} +.tooltip.top::before { + display: block; + width: 0; + height: 0; + border: inset 0.75rem; + content: ""; + border-bottom-width: 0; + border-top-style: solid; + border-color: #0a0a0a transparent transparent; + top: 100%; + bottom: auto; +} +.tooltip.left::before { + display: block; + width: 0; + height: 0; + border: inset 0.75rem; + content: ""; + border-right-width: 0; + border-left-style: solid; + border-color: transparent transparent transparent #0a0a0a; + top: 50%; + bottom: auto; + left: 100%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} +.tooltip.right::before { + display: block; + width: 0; + height: 0; + border: inset 0.75rem; + content: ""; + border-left-width: 0; + border-right-style: solid; + border-color: transparent #0a0a0a transparent transparent; + top: 50%; + right: 100%; + bottom: auto; + left: auto; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} .top-bar { - padding: 0.5rem; } - .top-bar::before, .top-bar::after { - display: table; - content: ' '; } - .top-bar::after { - clear: both; } - .top-bar, - .top-bar ul { - background-color: #f5f6f9; } - .top-bar input { - max-width: 200px; - margin-right: 1rem; } - .top-bar .input-group-field { - width: 100%; - margin-right: 0; } - .top-bar input.button { - width: auto; } + padding: 0.5rem; +} +.top-bar::before, +.top-bar::after { + display: table; + content: " "; +} +.top-bar::after { + clear: both; +} +.top-bar, +.top-bar ul { + background-color: #f5f6f9; +} +.top-bar input { + max-width: 200px; + margin-right: 1rem; +} +.top-bar .input-group-field { + width: 100%; + margin-right: 0; +} +.top-bar input.button { + width: auto; +} +.top-bar .top-bar-left, +.top-bar .top-bar-right { + width: 100%; +} +@media print, screen and (min-width: 40em) { .top-bar .top-bar-left, .top-bar .top-bar-right { - width: 100%; } - @media print, screen and (min-width: 40em) { - .top-bar .top-bar-left, - .top-bar .top-bar-right { - width: auto; } } - @media screen and (max-width: 63.9375em) { - .top-bar.stacked-for-medium .top-bar-left, - .top-bar.stacked-for-medium .top-bar-right { - width: 100%; } } - @media screen and (max-width: 74.9375em) { - .top-bar.stacked-for-large .top-bar-left, - .top-bar.stacked-for-large .top-bar-right { - width: 100%; } } + width: auto; + } +} +@media screen and (max-width: 63.9375em) { + .top-bar.stacked-for-medium .top-bar-left, + .top-bar.stacked-for-medium .top-bar-right { + width: 100%; + } +} +@media screen and (max-width: 74.9375em) { + .top-bar.stacked-for-large .top-bar-left, + .top-bar.stacked-for-large .top-bar-right { + width: 100%; + } +} .top-bar-title { display: inline-block; float: left; - padding: 0.5rem 1rem 0.5rem 0; } - .top-bar-title .menu-icon { - bottom: 2px; } + padding: 0.5rem 1rem 0.5rem 0; +} +.top-bar-title .menu-icon { + bottom: 2px; +} .top-bar-left { - float: left; } + float: left; +} .top-bar-right { - float: right; } + float: right; +} .hide { - display: none !important; } + display: none !important; +} .invisible { - visibility: hidden; } + visibility: hidden; +} @media screen and (max-width: 39.9375em) { .hide-for-small-only { - display: none !important; } } + display: none !important; + } +} @media screen and (max-width: 0em), screen and (min-width: 40em) { .show-for-small-only { - display: none !important; } } + display: none !important; + } +} @media print, screen and (min-width: 40em) { .hide-for-medium { - display: none !important; } } + display: none !important; + } +} @media screen and (max-width: 39.9375em) { .show-for-medium { - display: none !important; } } + display: none !important; + } +} @media screen and (min-width: 40em) and (max-width: 63.9375em) { .hide-for-medium-only { - display: none !important; } } + display: none !important; + } +} @media screen and (max-width: 39.9375em), screen and (min-width: 64em) { .show-for-medium-only { - display: none !important; } } + display: none !important; + } +} @media print, screen and (min-width: 64em) { .hide-for-large { - display: none !important; } } + display: none !important; + } +} @media screen and (max-width: 63.9375em) { .show-for-large { - display: none !important; } } + display: none !important; + } +} @media screen and (min-width: 64em) and (max-width: 74.9375em) { .hide-for-large-only { - display: none !important; } } + display: none !important; + } +} @media screen and (max-width: 63.9375em), screen and (min-width: 75em) { .show-for-large-only { - display: none !important; } } + display: none !important; + } +} .show-for-sr, .show-on-focus { @@ -4027,778 +5361,1150 @@ a.thumbnail { width: 1px; height: 1px; overflow: hidden; - clip: rect(0, 0, 0, 0); } + clip: rect(0, 0, 0, 0); +} -.show-on-focus:active, .show-on-focus:focus { +.show-on-focus:active, +.show-on-focus:focus { position: static !important; width: auto; height: auto; overflow: visible; - clip: auto; } + clip: auto; +} .show-for-landscape, .hide-for-portrait { - display: block !important; } - @media screen and (orientation: landscape) { - .show-for-landscape, - .hide-for-portrait { - display: block !important; } } - @media screen and (orientation: portrait) { - .show-for-landscape, - .hide-for-portrait { - display: none !important; } } + display: block !important; +} +@media screen and (orientation: landscape) { + .show-for-landscape, + .hide-for-portrait { + display: block !important; + } +} +@media screen and (orientation: portrait) { + .show-for-landscape, + .hide-for-portrait { + display: none !important; + } +} .hide-for-landscape, .show-for-portrait { - display: none !important; } - @media screen and (orientation: landscape) { - .hide-for-landscape, - .show-for-portrait { - display: none !important; } } - @media screen and (orientation: portrait) { - .hide-for-landscape, - .show-for-portrait { - display: block !important; } } + display: none !important; +} +@media screen and (orientation: landscape) { + .hide-for-landscape, + .show-for-portrait { + display: none !important; + } +} +@media screen and (orientation: portrait) { + .hide-for-landscape, + .show-for-portrait { + display: block !important; + } +} .float-left { - float: left !important; } + float: left !important; +} .float-right { - float: right !important; } + float: right !important; +} .float-center { display: block; margin-right: auto; - margin-left: auto; } + margin-left: auto; +} -.clearfix::before, .clearfix::after { +.clearfix::before, +.clearfix::after { display: table; - content: ' '; } + content: " "; +} .clearfix::after { - clear: both; } + clear: both; +} .slide-in-down.mui-enter { transition-duration: 500ms; transition-timing-function: linear; -webkit-transform: translateY(-100%); - -ms-transform: translateY(-100%); - transform: translateY(-100%); - transition-property: opacity, -webkit-transform; + -ms-transform: translateY(-100%); + transform: translateY(-100%); + transition-property: + opacity, + -webkit-transform; transition-property: transform, opacity; - transition-property: transform, opacity, -webkit-transform; + transition-property: + transform, + opacity, + -webkit-transform; -webkit-backface-visibility: hidden; - backface-visibility: hidden; } + backface-visibility: hidden; +} .slide-in-down.mui-enter.mui-enter-active { -webkit-transform: translateY(0); - -ms-transform: translateY(0); - transform: translateY(0); } + -ms-transform: translateY(0); + transform: translateY(0); +} .slide-in-left.mui-enter { transition-duration: 500ms; transition-timing-function: linear; -webkit-transform: translateX(-100%); - -ms-transform: translateX(-100%); - transform: translateX(-100%); - transition-property: opacity, -webkit-transform; + -ms-transform: translateX(-100%); + transform: translateX(-100%); + transition-property: + opacity, + -webkit-transform; transition-property: transform, opacity; - transition-property: transform, opacity, -webkit-transform; + transition-property: + transform, + opacity, + -webkit-transform; -webkit-backface-visibility: hidden; - backface-visibility: hidden; } + backface-visibility: hidden; +} .slide-in-left.mui-enter.mui-enter-active { -webkit-transform: translateX(0); - -ms-transform: translateX(0); - transform: translateX(0); } + -ms-transform: translateX(0); + transform: translateX(0); +} .slide-in-up.mui-enter { transition-duration: 500ms; transition-timing-function: linear; -webkit-transform: translateY(100%); - -ms-transform: translateY(100%); - transform: translateY(100%); - transition-property: opacity, -webkit-transform; + -ms-transform: translateY(100%); + transform: translateY(100%); + transition-property: + opacity, + -webkit-transform; transition-property: transform, opacity; - transition-property: transform, opacity, -webkit-transform; + transition-property: + transform, + opacity, + -webkit-transform; -webkit-backface-visibility: hidden; - backface-visibility: hidden; } + backface-visibility: hidden; +} .slide-in-up.mui-enter.mui-enter-active { -webkit-transform: translateY(0); - -ms-transform: translateY(0); - transform: translateY(0); } + -ms-transform: translateY(0); + transform: translateY(0); +} .slide-in-right.mui-enter { transition-duration: 500ms; transition-timing-function: linear; -webkit-transform: translateX(100%); - -ms-transform: translateX(100%); - transform: translateX(100%); - transition-property: opacity, -webkit-transform; + -ms-transform: translateX(100%); + transform: translateX(100%); + transition-property: + opacity, + -webkit-transform; transition-property: transform, opacity; - transition-property: transform, opacity, -webkit-transform; + transition-property: + transform, + opacity, + -webkit-transform; -webkit-backface-visibility: hidden; - backface-visibility: hidden; } + backface-visibility: hidden; +} .slide-in-right.mui-enter.mui-enter-active { -webkit-transform: translateX(0); - -ms-transform: translateX(0); - transform: translateX(0); } + -ms-transform: translateX(0); + transform: translateX(0); +} .slide-out-down.mui-leave { transition-duration: 500ms; transition-timing-function: linear; -webkit-transform: translateY(0); - -ms-transform: translateY(0); - transform: translateY(0); - transition-property: opacity, -webkit-transform; + -ms-transform: translateY(0); + transform: translateY(0); + transition-property: + opacity, + -webkit-transform; transition-property: transform, opacity; - transition-property: transform, opacity, -webkit-transform; + transition-property: + transform, + opacity, + -webkit-transform; -webkit-backface-visibility: hidden; - backface-visibility: hidden; } + backface-visibility: hidden; +} .slide-out-down.mui-leave.mui-leave-active { -webkit-transform: translateY(100%); - -ms-transform: translateY(100%); - transform: translateY(100%); } + -ms-transform: translateY(100%); + transform: translateY(100%); +} .slide-out-right.mui-leave { transition-duration: 500ms; transition-timing-function: linear; -webkit-transform: translateX(0); - -ms-transform: translateX(0); - transform: translateX(0); - transition-property: opacity, -webkit-transform; + -ms-transform: translateX(0); + transform: translateX(0); + transition-property: + opacity, + -webkit-transform; transition-property: transform, opacity; - transition-property: transform, opacity, -webkit-transform; + transition-property: + transform, + opacity, + -webkit-transform; -webkit-backface-visibility: hidden; - backface-visibility: hidden; } + backface-visibility: hidden; +} .slide-out-right.mui-leave.mui-leave-active { -webkit-transform: translateX(100%); - -ms-transform: translateX(100%); - transform: translateX(100%); } + -ms-transform: translateX(100%); + transform: translateX(100%); +} .slide-out-up.mui-leave { transition-duration: 500ms; transition-timing-function: linear; -webkit-transform: translateY(0); - -ms-transform: translateY(0); - transform: translateY(0); - transition-property: opacity, -webkit-transform; + -ms-transform: translateY(0); + transform: translateY(0); + transition-property: + opacity, + -webkit-transform; transition-property: transform, opacity; - transition-property: transform, opacity, -webkit-transform; + transition-property: + transform, + opacity, + -webkit-transform; -webkit-backface-visibility: hidden; - backface-visibility: hidden; } + backface-visibility: hidden; +} .slide-out-up.mui-leave.mui-leave-active { -webkit-transform: translateY(-100%); - -ms-transform: translateY(-100%); - transform: translateY(-100%); } + -ms-transform: translateY(-100%); + transform: translateY(-100%); +} .slide-out-left.mui-leave { transition-duration: 500ms; transition-timing-function: linear; -webkit-transform: translateX(0); - -ms-transform: translateX(0); - transform: translateX(0); - transition-property: opacity, -webkit-transform; + -ms-transform: translateX(0); + transform: translateX(0); + transition-property: + opacity, + -webkit-transform; transition-property: transform, opacity; - transition-property: transform, opacity, -webkit-transform; + transition-property: + transform, + opacity, + -webkit-transform; -webkit-backface-visibility: hidden; - backface-visibility: hidden; } + backface-visibility: hidden; +} .slide-out-left.mui-leave.mui-leave-active { -webkit-transform: translateX(-100%); - -ms-transform: translateX(-100%); - transform: translateX(-100%); } + -ms-transform: translateX(-100%); + transform: translateX(-100%); +} .fade-in.mui-enter { transition-duration: 500ms; transition-timing-function: linear; opacity: 0; - transition-property: opacity; } + transition-property: opacity; +} .fade-in.mui-enter.mui-enter-active { - opacity: 1; } + opacity: 1; +} .fade-out.mui-leave { transition-duration: 500ms; transition-timing-function: linear; opacity: 1; - transition-property: opacity; } + transition-property: opacity; +} .fade-out.mui-leave.mui-leave-active { - opacity: 0; } + opacity: 0; +} .hinge-in-from-top.mui-enter { transition-duration: 500ms; transition-timing-function: linear; -webkit-transform: perspective(2000px) rotateX(-90deg); - transform: perspective(2000px) rotateX(-90deg); + transform: perspective(2000px) rotateX(-90deg); -webkit-transform-origin: top; - -ms-transform-origin: top; - transform-origin: top; - transition-property: opacity, -webkit-transform; + -ms-transform-origin: top; + transform-origin: top; + transition-property: + opacity, + -webkit-transform; transition-property: transform, opacity; - transition-property: transform, opacity, -webkit-transform; - opacity: 0; } + transition-property: + transform, + opacity, + -webkit-transform; + opacity: 0; +} .hinge-in-from-top.mui-enter.mui-enter-active { -webkit-transform: perspective(2000px) rotate(0deg); - transform: perspective(2000px) rotate(0deg); - opacity: 1; } + transform: perspective(2000px) rotate(0deg); + opacity: 1; +} .hinge-in-from-right.mui-enter { transition-duration: 500ms; transition-timing-function: linear; -webkit-transform: perspective(2000px) rotateY(-90deg); - transform: perspective(2000px) rotateY(-90deg); + transform: perspective(2000px) rotateY(-90deg); -webkit-transform-origin: right; - -ms-transform-origin: right; - transform-origin: right; - transition-property: opacity, -webkit-transform; + -ms-transform-origin: right; + transform-origin: right; + transition-property: + opacity, + -webkit-transform; transition-property: transform, opacity; - transition-property: transform, opacity, -webkit-transform; - opacity: 0; } + transition-property: + transform, + opacity, + -webkit-transform; + opacity: 0; +} .hinge-in-from-right.mui-enter.mui-enter-active { -webkit-transform: perspective(2000px) rotate(0deg); - transform: perspective(2000px) rotate(0deg); - opacity: 1; } + transform: perspective(2000px) rotate(0deg); + opacity: 1; +} .hinge-in-from-bottom.mui-enter { transition-duration: 500ms; transition-timing-function: linear; -webkit-transform: perspective(2000px) rotateX(90deg); - transform: perspective(2000px) rotateX(90deg); + transform: perspective(2000px) rotateX(90deg); -webkit-transform-origin: bottom; - -ms-transform-origin: bottom; - transform-origin: bottom; - transition-property: opacity, -webkit-transform; + -ms-transform-origin: bottom; + transform-origin: bottom; + transition-property: + opacity, + -webkit-transform; transition-property: transform, opacity; - transition-property: transform, opacity, -webkit-transform; - opacity: 0; } + transition-property: + transform, + opacity, + -webkit-transform; + opacity: 0; +} .hinge-in-from-bottom.mui-enter.mui-enter-active { -webkit-transform: perspective(2000px) rotate(0deg); - transform: perspective(2000px) rotate(0deg); - opacity: 1; } + transform: perspective(2000px) rotate(0deg); + opacity: 1; +} .hinge-in-from-left.mui-enter { transition-duration: 500ms; transition-timing-function: linear; -webkit-transform: perspective(2000px) rotateY(90deg); - transform: perspective(2000px) rotateY(90deg); + transform: perspective(2000px) rotateY(90deg); -webkit-transform-origin: left; - -ms-transform-origin: left; - transform-origin: left; - transition-property: opacity, -webkit-transform; + -ms-transform-origin: left; + transform-origin: left; + transition-property: + opacity, + -webkit-transform; transition-property: transform, opacity; - transition-property: transform, opacity, -webkit-transform; - opacity: 0; } + transition-property: + transform, + opacity, + -webkit-transform; + opacity: 0; +} .hinge-in-from-left.mui-enter.mui-enter-active { -webkit-transform: perspective(2000px) rotate(0deg); - transform: perspective(2000px) rotate(0deg); - opacity: 1; } + transform: perspective(2000px) rotate(0deg); + opacity: 1; +} .hinge-in-from-middle-x.mui-enter { transition-duration: 500ms; transition-timing-function: linear; -webkit-transform: perspective(2000px) rotateX(-90deg); - transform: perspective(2000px) rotateX(-90deg); + transform: perspective(2000px) rotateX(-90deg); -webkit-transform-origin: center; - -ms-transform-origin: center; - transform-origin: center; - transition-property: opacity, -webkit-transform; + -ms-transform-origin: center; + transform-origin: center; + transition-property: + opacity, + -webkit-transform; transition-property: transform, opacity; - transition-property: transform, opacity, -webkit-transform; - opacity: 0; } + transition-property: + transform, + opacity, + -webkit-transform; + opacity: 0; +} .hinge-in-from-middle-x.mui-enter.mui-enter-active { -webkit-transform: perspective(2000px) rotate(0deg); - transform: perspective(2000px) rotate(0deg); - opacity: 1; } + transform: perspective(2000px) rotate(0deg); + opacity: 1; +} .hinge-in-from-middle-y.mui-enter { transition-duration: 500ms; transition-timing-function: linear; -webkit-transform: perspective(2000px) rotateY(-90deg); - transform: perspective(2000px) rotateY(-90deg); + transform: perspective(2000px) rotateY(-90deg); -webkit-transform-origin: center; - -ms-transform-origin: center; - transform-origin: center; - transition-property: opacity, -webkit-transform; + -ms-transform-origin: center; + transform-origin: center; + transition-property: + opacity, + -webkit-transform; transition-property: transform, opacity; - transition-property: transform, opacity, -webkit-transform; - opacity: 0; } + transition-property: + transform, + opacity, + -webkit-transform; + opacity: 0; +} .hinge-in-from-middle-y.mui-enter.mui-enter-active { -webkit-transform: perspective(2000px) rotate(0deg); - transform: perspective(2000px) rotate(0deg); - opacity: 1; } + transform: perspective(2000px) rotate(0deg); + opacity: 1; +} .hinge-out-from-top.mui-leave { transition-duration: 500ms; transition-timing-function: linear; -webkit-transform: perspective(2000px) rotate(0deg); - transform: perspective(2000px) rotate(0deg); + transform: perspective(2000px) rotate(0deg); -webkit-transform-origin: top; - -ms-transform-origin: top; - transform-origin: top; - transition-property: opacity, -webkit-transform; + -ms-transform-origin: top; + transform-origin: top; + transition-property: + opacity, + -webkit-transform; transition-property: transform, opacity; - transition-property: transform, opacity, -webkit-transform; - opacity: 1; } + transition-property: + transform, + opacity, + -webkit-transform; + opacity: 1; +} .hinge-out-from-top.mui-leave.mui-leave-active { -webkit-transform: perspective(2000px) rotateX(-90deg); - transform: perspective(2000px) rotateX(-90deg); - opacity: 0; } + transform: perspective(2000px) rotateX(-90deg); + opacity: 0; +} .hinge-out-from-right.mui-leave { transition-duration: 500ms; transition-timing-function: linear; -webkit-transform: perspective(2000px) rotate(0deg); - transform: perspective(2000px) rotate(0deg); + transform: perspective(2000px) rotate(0deg); -webkit-transform-origin: right; - -ms-transform-origin: right; - transform-origin: right; - transition-property: opacity, -webkit-transform; + -ms-transform-origin: right; + transform-origin: right; + transition-property: + opacity, + -webkit-transform; transition-property: transform, opacity; - transition-property: transform, opacity, -webkit-transform; - opacity: 1; } + transition-property: + transform, + opacity, + -webkit-transform; + opacity: 1; +} .hinge-out-from-right.mui-leave.mui-leave-active { -webkit-transform: perspective(2000px) rotateY(-90deg); - transform: perspective(2000px) rotateY(-90deg); - opacity: 0; } + transform: perspective(2000px) rotateY(-90deg); + opacity: 0; +} .hinge-out-from-bottom.mui-leave { transition-duration: 500ms; transition-timing-function: linear; -webkit-transform: perspective(2000px) rotate(0deg); - transform: perspective(2000px) rotate(0deg); + transform: perspective(2000px) rotate(0deg); -webkit-transform-origin: bottom; - -ms-transform-origin: bottom; - transform-origin: bottom; - transition-property: opacity, -webkit-transform; + -ms-transform-origin: bottom; + transform-origin: bottom; + transition-property: + opacity, + -webkit-transform; transition-property: transform, opacity; - transition-property: transform, opacity, -webkit-transform; - opacity: 1; } + transition-property: + transform, + opacity, + -webkit-transform; + opacity: 1; +} .hinge-out-from-bottom.mui-leave.mui-leave-active { -webkit-transform: perspective(2000px) rotateX(90deg); - transform: perspective(2000px) rotateX(90deg); - opacity: 0; } + transform: perspective(2000px) rotateX(90deg); + opacity: 0; +} .hinge-out-from-left.mui-leave { transition-duration: 500ms; transition-timing-function: linear; -webkit-transform: perspective(2000px) rotate(0deg); - transform: perspective(2000px) rotate(0deg); + transform: perspective(2000px) rotate(0deg); -webkit-transform-origin: left; - -ms-transform-origin: left; - transform-origin: left; - transition-property: opacity, -webkit-transform; + -ms-transform-origin: left; + transform-origin: left; + transition-property: + opacity, + -webkit-transform; transition-property: transform, opacity; - transition-property: transform, opacity, -webkit-transform; - opacity: 1; } + transition-property: + transform, + opacity, + -webkit-transform; + opacity: 1; +} .hinge-out-from-left.mui-leave.mui-leave-active { -webkit-transform: perspective(2000px) rotateY(90deg); - transform: perspective(2000px) rotateY(90deg); - opacity: 0; } + transform: perspective(2000px) rotateY(90deg); + opacity: 0; +} .hinge-out-from-middle-x.mui-leave { transition-duration: 500ms; transition-timing-function: linear; -webkit-transform: perspective(2000px) rotate(0deg); - transform: perspective(2000px) rotate(0deg); + transform: perspective(2000px) rotate(0deg); -webkit-transform-origin: center; - -ms-transform-origin: center; - transform-origin: center; - transition-property: opacity, -webkit-transform; + -ms-transform-origin: center; + transform-origin: center; + transition-property: + opacity, + -webkit-transform; transition-property: transform, opacity; - transition-property: transform, opacity, -webkit-transform; - opacity: 1; } + transition-property: + transform, + opacity, + -webkit-transform; + opacity: 1; +} .hinge-out-from-middle-x.mui-leave.mui-leave-active { -webkit-transform: perspective(2000px) rotateX(-90deg); - transform: perspective(2000px) rotateX(-90deg); - opacity: 0; } + transform: perspective(2000px) rotateX(-90deg); + opacity: 0; +} .hinge-out-from-middle-y.mui-leave { transition-duration: 500ms; transition-timing-function: linear; -webkit-transform: perspective(2000px) rotate(0deg); - transform: perspective(2000px) rotate(0deg); + transform: perspective(2000px) rotate(0deg); -webkit-transform-origin: center; - -ms-transform-origin: center; - transform-origin: center; - transition-property: opacity, -webkit-transform; + -ms-transform-origin: center; + transform-origin: center; + transition-property: + opacity, + -webkit-transform; transition-property: transform, opacity; - transition-property: transform, opacity, -webkit-transform; - opacity: 1; } + transition-property: + transform, + opacity, + -webkit-transform; + opacity: 1; +} .hinge-out-from-middle-y.mui-leave.mui-leave-active { -webkit-transform: perspective(2000px) rotateY(-90deg); - transform: perspective(2000px) rotateY(-90deg); - opacity: 0; } + transform: perspective(2000px) rotateY(-90deg); + opacity: 0; +} .scale-in-up.mui-enter { transition-duration: 500ms; transition-timing-function: linear; -webkit-transform: scale(0.5); - -ms-transform: scale(0.5); - transform: scale(0.5); - transition-property: opacity, -webkit-transform; + -ms-transform: scale(0.5); + transform: scale(0.5); + transition-property: + opacity, + -webkit-transform; transition-property: transform, opacity; - transition-property: transform, opacity, -webkit-transform; - opacity: 0; } + transition-property: + transform, + opacity, + -webkit-transform; + opacity: 0; +} .scale-in-up.mui-enter.mui-enter-active { -webkit-transform: scale(1); - -ms-transform: scale(1); - transform: scale(1); - opacity: 1; } + -ms-transform: scale(1); + transform: scale(1); + opacity: 1; +} .scale-in-down.mui-enter { transition-duration: 500ms; transition-timing-function: linear; -webkit-transform: scale(1.5); - -ms-transform: scale(1.5); - transform: scale(1.5); - transition-property: opacity, -webkit-transform; + -ms-transform: scale(1.5); + transform: scale(1.5); + transition-property: + opacity, + -webkit-transform; transition-property: transform, opacity; - transition-property: transform, opacity, -webkit-transform; - opacity: 0; } + transition-property: + transform, + opacity, + -webkit-transform; + opacity: 0; +} .scale-in-down.mui-enter.mui-enter-active { -webkit-transform: scale(1); - -ms-transform: scale(1); - transform: scale(1); - opacity: 1; } + -ms-transform: scale(1); + transform: scale(1); + opacity: 1; +} .scale-out-up.mui-leave { transition-duration: 500ms; transition-timing-function: linear; -webkit-transform: scale(1); - -ms-transform: scale(1); - transform: scale(1); - transition-property: opacity, -webkit-transform; + -ms-transform: scale(1); + transform: scale(1); + transition-property: + opacity, + -webkit-transform; transition-property: transform, opacity; - transition-property: transform, opacity, -webkit-transform; - opacity: 1; } + transition-property: + transform, + opacity, + -webkit-transform; + opacity: 1; +} .scale-out-up.mui-leave.mui-leave-active { -webkit-transform: scale(1.5); - -ms-transform: scale(1.5); - transform: scale(1.5); - opacity: 0; } + -ms-transform: scale(1.5); + transform: scale(1.5); + opacity: 0; +} .scale-out-down.mui-leave { transition-duration: 500ms; transition-timing-function: linear; -webkit-transform: scale(1); - -ms-transform: scale(1); - transform: scale(1); - transition-property: opacity, -webkit-transform; + -ms-transform: scale(1); + transform: scale(1); + transition-property: + opacity, + -webkit-transform; transition-property: transform, opacity; - transition-property: transform, opacity, -webkit-transform; - opacity: 1; } + transition-property: + transform, + opacity, + -webkit-transform; + opacity: 1; +} .scale-out-down.mui-leave.mui-leave-active { -webkit-transform: scale(0.5); - -ms-transform: scale(0.5); - transform: scale(0.5); - opacity: 0; } + -ms-transform: scale(0.5); + transform: scale(0.5); + opacity: 0; +} .spin-in.mui-enter { transition-duration: 500ms; transition-timing-function: linear; -webkit-transform: rotate(-0.75turn); - -ms-transform: rotate(-0.75turn); - transform: rotate(-0.75turn); - transition-property: opacity, -webkit-transform; + -ms-transform: rotate(-0.75turn); + transform: rotate(-0.75turn); + transition-property: + opacity, + -webkit-transform; transition-property: transform, opacity; - transition-property: transform, opacity, -webkit-transform; - opacity: 0; } + transition-property: + transform, + opacity, + -webkit-transform; + opacity: 0; +} .spin-in.mui-enter.mui-enter-active { -webkit-transform: rotate(0); - -ms-transform: rotate(0); - transform: rotate(0); - opacity: 1; } + -ms-transform: rotate(0); + transform: rotate(0); + opacity: 1; +} .spin-out.mui-leave { transition-duration: 500ms; transition-timing-function: linear; -webkit-transform: rotate(0); - -ms-transform: rotate(0); - transform: rotate(0); - transition-property: opacity, -webkit-transform; + -ms-transform: rotate(0); + transform: rotate(0); + transition-property: + opacity, + -webkit-transform; transition-property: transform, opacity; - transition-property: transform, opacity, -webkit-transform; - opacity: 1; } + transition-property: + transform, + opacity, + -webkit-transform; + opacity: 1; +} .spin-out.mui-leave.mui-leave-active { -webkit-transform: rotate(0.75turn); - -ms-transform: rotate(0.75turn); - transform: rotate(0.75turn); - opacity: 0; } + -ms-transform: rotate(0.75turn); + transform: rotate(0.75turn); + opacity: 0; +} .spin-in-ccw.mui-enter { transition-duration: 500ms; transition-timing-function: linear; -webkit-transform: rotate(0.75turn); - -ms-transform: rotate(0.75turn); - transform: rotate(0.75turn); - transition-property: opacity, -webkit-transform; + -ms-transform: rotate(0.75turn); + transform: rotate(0.75turn); + transition-property: + opacity, + -webkit-transform; transition-property: transform, opacity; - transition-property: transform, opacity, -webkit-transform; - opacity: 0; } + transition-property: + transform, + opacity, + -webkit-transform; + opacity: 0; +} .spin-in-ccw.mui-enter.mui-enter-active { -webkit-transform: rotate(0); - -ms-transform: rotate(0); - transform: rotate(0); - opacity: 1; } + -ms-transform: rotate(0); + transform: rotate(0); + opacity: 1; +} .spin-out-ccw.mui-leave { transition-duration: 500ms; transition-timing-function: linear; -webkit-transform: rotate(0); - -ms-transform: rotate(0); - transform: rotate(0); - transition-property: opacity, -webkit-transform; + -ms-transform: rotate(0); + transform: rotate(0); + transition-property: + opacity, + -webkit-transform; transition-property: transform, opacity; - transition-property: transform, opacity, -webkit-transform; - opacity: 1; } + transition-property: + transform, + opacity, + -webkit-transform; + opacity: 1; +} .spin-out-ccw.mui-leave.mui-leave-active { -webkit-transform: rotate(-0.75turn); - -ms-transform: rotate(-0.75turn); - transform: rotate(-0.75turn); - opacity: 0; } + -ms-transform: rotate(-0.75turn); + transform: rotate(-0.75turn); + opacity: 0; +} .slow { - transition-duration: 750ms !important; } + transition-duration: 750ms !important; +} .fast { - transition-duration: 250ms !important; } + transition-duration: 250ms !important; +} .linear { - transition-timing-function: linear !important; } + transition-timing-function: linear !important; +} .ease { - transition-timing-function: ease !important; } + transition-timing-function: ease !important; +} .ease-in { - transition-timing-function: ease-in !important; } + transition-timing-function: ease-in !important; +} .ease-out { - transition-timing-function: ease-out !important; } + transition-timing-function: ease-out !important; +} .ease-in-out { - transition-timing-function: ease-in-out !important; } + transition-timing-function: ease-in-out !important; +} .bounce-in { - transition-timing-function: cubic-bezier(0.485, 0.155, 0.24, 1.245) !important; } + transition-timing-function: cubic-bezier( + 0.485, + 0.155, + 0.24, + 1.245 + ) !important; +} .bounce-out { - transition-timing-function: cubic-bezier(0.485, 0.155, 0.515, 0.845) !important; } + transition-timing-function: cubic-bezier( + 0.485, + 0.155, + 0.515, + 0.845 + ) !important; +} .bounce-in-out { - transition-timing-function: cubic-bezier(0.76, -0.245, 0.24, 1.245) !important; } + transition-timing-function: cubic-bezier( + 0.76, + -0.245, + 0.24, + 1.245 + ) !important; +} .short-delay { - transition-delay: 300ms !important; } + transition-delay: 300ms !important; +} .long-delay { - transition-delay: 700ms !important; } + transition-delay: 700ms !important; +} .shake { -webkit-animation-name: shake-7; - animation-name: shake-7; } + animation-name: shake-7; +} @-webkit-keyframes shake-7 { - 0%, 10%, 20%, 30%, 40%, 50%, 60%, 70%, 80%, 90% { + 0%, + 10%, + 20%, + 30%, + 40%, + 50%, + 60%, + 70%, + 80%, + 90% { -webkit-transform: translateX(7%); - transform: translateX(7%); } - 5%, 15%, 25%, 35%, 45%, 55%, 65%, 75%, 85%, 95% { + transform: translateX(7%); + } + 5%, + 15%, + 25%, + 35%, + 45%, + 55%, + 65%, + 75%, + 85%, + 95% { -webkit-transform: translateX(-7%); - transform: translateX(-7%); } } + transform: translateX(-7%); + } +} @keyframes shake-7 { - 0%, 10%, 20%, 30%, 40%, 50%, 60%, 70%, 80%, 90% { + 0%, + 10%, + 20%, + 30%, + 40%, + 50%, + 60%, + 70%, + 80%, + 90% { -webkit-transform: translateX(7%); - transform: translateX(7%); } - 5%, 15%, 25%, 35%, 45%, 55%, 65%, 75%, 85%, 95% { + transform: translateX(7%); + } + 5%, + 15%, + 25%, + 35%, + 45%, + 55%, + 65%, + 75%, + 85%, + 95% { -webkit-transform: translateX(-7%); - transform: translateX(-7%); } } + transform: translateX(-7%); + } +} .spin-cw { -webkit-animation-name: spin-cw-1turn; - animation-name: spin-cw-1turn; } + animation-name: spin-cw-1turn; +} @-webkit-keyframes spin-cw-1turn { 0% { -webkit-transform: rotate(-1turn); - transform: rotate(-1turn); } + transform: rotate(-1turn); + } 100% { -webkit-transform: rotate(0); - transform: rotate(0); } } + transform: rotate(0); + } +} @keyframes spin-cw-1turn { 0% { -webkit-transform: rotate(-1turn); - transform: rotate(-1turn); } + transform: rotate(-1turn); + } 100% { -webkit-transform: rotate(0); - transform: rotate(0); } } + transform: rotate(0); + } +} .spin-ccw { -webkit-animation-name: spin-cw-1turn; - animation-name: spin-cw-1turn; } + animation-name: spin-cw-1turn; +} @keyframes spin-cw-1turn { 0% { -webkit-transform: rotate(0); - transform: rotate(0); } + transform: rotate(0); + } 100% { -webkit-transform: rotate(1turn); - transform: rotate(1turn); } } + transform: rotate(1turn); + } +} .wiggle { -webkit-animation-name: wiggle-7deg; - animation-name: wiggle-7deg; } + animation-name: wiggle-7deg; +} @-webkit-keyframes wiggle-7deg { - 40%, 50%, 60% { + 40%, + 50%, + 60% { -webkit-transform: rotate(7deg); - transform: rotate(7deg); } - 35%, 45%, 55%, 65% { + transform: rotate(7deg); + } + 35%, + 45%, + 55%, + 65% { -webkit-transform: rotate(-7deg); - transform: rotate(-7deg); } - 0%, 30%, 70%, 100% { + transform: rotate(-7deg); + } + 0%, + 30%, + 70%, + 100% { -webkit-transform: rotate(0); - transform: rotate(0); } } + transform: rotate(0); + } +} @keyframes wiggle-7deg { - 40%, 50%, 60% { + 40%, + 50%, + 60% { -webkit-transform: rotate(7deg); - transform: rotate(7deg); } - 35%, 45%, 55%, 65% { + transform: rotate(7deg); + } + 35%, + 45%, + 55%, + 65% { -webkit-transform: rotate(-7deg); - transform: rotate(-7deg); } - 0%, 30%, 70%, 100% { + transform: rotate(-7deg); + } + 0%, + 30%, + 70%, + 100% { -webkit-transform: rotate(0); - transform: rotate(0); } } + transform: rotate(0); + } +} .shake, .spin-cw, .spin-ccw, .wiggle { -webkit-animation-duration: 500ms; - animation-duration: 500ms; } + animation-duration: 500ms; +} .infinite { -webkit-animation-iteration-count: infinite; - animation-iteration-count: infinite; } + animation-iteration-count: infinite; +} .slow { -webkit-animation-duration: 750ms !important; - animation-duration: 750ms !important; } + animation-duration: 750ms !important; +} .fast { -webkit-animation-duration: 250ms !important; - animation-duration: 250ms !important; } + animation-duration: 250ms !important; +} .linear { -webkit-animation-timing-function: linear !important; - animation-timing-function: linear !important; } + animation-timing-function: linear !important; +} .ease { -webkit-animation-timing-function: ease !important; - animation-timing-function: ease !important; } + animation-timing-function: ease !important; +} .ease-in { -webkit-animation-timing-function: ease-in !important; - animation-timing-function: ease-in !important; } + animation-timing-function: ease-in !important; +} .ease-out { -webkit-animation-timing-function: ease-out !important; - animation-timing-function: ease-out !important; } + animation-timing-function: ease-out !important; +} .ease-in-out { -webkit-animation-timing-function: ease-in-out !important; - animation-timing-function: ease-in-out !important; } + animation-timing-function: ease-in-out !important; +} .bounce-in { - -webkit-animation-timing-function: cubic-bezier(0.485, 0.155, 0.24, 1.245) !important; - animation-timing-function: cubic-bezier(0.485, 0.155, 0.24, 1.245) !important; } + -webkit-animation-timing-function: cubic-bezier( + 0.485, + 0.155, + 0.24, + 1.245 + ) !important; + animation-timing-function: cubic-bezier(0.485, 0.155, 0.24, 1.245) !important; +} .bounce-out { - -webkit-animation-timing-function: cubic-bezier(0.485, 0.155, 0.515, 0.845) !important; - animation-timing-function: cubic-bezier(0.485, 0.155, 0.515, 0.845) !important; } + -webkit-animation-timing-function: cubic-bezier( + 0.485, + 0.155, + 0.515, + 0.845 + ) !important; + animation-timing-function: cubic-bezier( + 0.485, + 0.155, + 0.515, + 0.845 + ) !important; +} .bounce-in-out { - -webkit-animation-timing-function: cubic-bezier(0.76, -0.245, 0.24, 1.245) !important; - animation-timing-function: cubic-bezier(0.76, -0.245, 0.24, 1.245) !important; } + -webkit-animation-timing-function: cubic-bezier( + 0.76, + -0.245, + 0.24, + 1.245 + ) !important; + animation-timing-function: cubic-bezier(0.76, -0.245, 0.24, 1.245) !important; +} .short-delay { -webkit-animation-delay: 300ms !important; - animation-delay: 300ms !important; } + animation-delay: 300ms !important; +} .long-delay { -webkit-animation-delay: 700ms !important; - animation-delay: 700ms !important; } + animation-delay: 700ms !important; +} @media screen and (max-width: 39.9375em) { .no-js .top-bar { - display: none; } } + display: none; + } +} @media print, screen and (min-width: 40em) { .no-js .title-bar { - display: none; } } + display: none; + } +} .off-canvas-content { - overflow: hidden; } + overflow: hidden; +} header { position: relative; height: 60px; - background: #fefefe; } - header h1 { - font-size: 1.125rem; - line-height: 3.75rem; - font-weight: bold; - color: #5a98e5; - margin: 0; } - header .button { - background: #fefefe; - font-family: "Open sans", sans-serif; - color: #b7bac0; - margin: 0.5625rem 0; - font-size: 0.8125rem; } - header .button img { - width: 1.5rem; - margin-right: 0.3125rem; - vertical-align: middle; } - header .button:hover, header .button:focus { - background: #f5f6f9; - color: #333; } - header .profile .avatar { - margin: 0.625rem; } - header .profile p { - display: inline-block; - font-size: 0.875rem; - color: #5b5e61; - font-weight: 500; - font-family: "Open sans", sans-serif; } + background: #fefefe; +} +header h1 { + font-size: 1.125rem; + line-height: 3.75rem; + font-weight: bold; + color: #5a98e5; + margin: 0; +} +header .button { + background: #fefefe; + font-family: "Open sans", sans-serif; + color: #b7bac0; + margin: 0.5625rem 0; + font-size: 0.8125rem; +} +header .button img { + width: 1.5rem; + margin-right: 0.3125rem; + vertical-align: middle; +} +header .button:hover, +header .button:focus { + background: #f5f6f9; + color: #333; +} +header .profile .avatar { + margin: 0.625rem; +} +header .profile p { + display: inline-block; + font-size: 0.875rem; + color: #5b5e61; + font-weight: 500; + font-family: "Open sans", sans-serif; +} .avatar { display: inline-block; @@ -4812,40 +6518,51 @@ header { overflow: hidden; margin-right: 0.3125rem; font-family: "Open sans", sans-serif; - font-weight: 300; } + font-weight: 300; +} #profile-dropdown { background: #fefefe; box-shadow: 0 0 10px rgba(10, 10, 10, 0.07); border: none; - text-align: left; } - #profile-dropdown ul li a { - position: relative; - background: #fefefe; - margin-bottom: 0.625rem; - border-radius: 4px; - border: 1px solid #f5f6f9; - color: #5b5e61; - font-family: "Open sans", sans-serif; } - #profile-dropdown ul li a:hover { - background: #b7bac0; } - #profile-dropdown h3 { - font-size: 1rem; } - #profile-dropdown p { - font-size: 0.8125rem; } + text-align: left; +} +#profile-dropdown ul li a { + position: relative; + background: #fefefe; + margin-bottom: 0.625rem; + border-radius: 4px; + border: 1px solid #f5f6f9; + color: #5b5e61; + font-family: "Open sans", sans-serif; +} +#profile-dropdown ul li a:hover { + background: #b7bac0; +} +#profile-dropdown h3 { + font-size: 1rem; +} +#profile-dropdown p { + font-size: 0.8125rem; +} .off-canvas .close-button { top: 0.875rem; - color: #fefefe; } - .off-canvas .close-button:hover, .off-canvas .close-button:focus { - color: #b7bac0; } + color: #fefefe; +} +.off-canvas .close-button:hover, +.off-canvas .close-button:focus { + color: #b7bac0; +} .off-canvas .menu > li.title > a { background: #2a2d37; - pointer-events: none; } + pointer-events: none; +} .off-canvas .menu > li.subtitle > a { - pointer-events: none; } + pointer-events: none; +} .off-canvas .menu > li > a { width: 225px; @@ -4854,16 +6571,25 @@ header { font-weight: 600; color: #b7bac0; padding: 1.25rem; - border-bottom: 1px solid rgba(255, 255, 255, 0.04); } - .off-canvas .menu > li > a img { - width: 1.5rem; - margin-right: 1.25rem; } - .off-canvas .menu > li > a:hover { - background: #353946; } + border-bottom: 1px solid rgba(255, 255, 255, 0.04); +} +.off-canvas .menu > li > a img { + width: 1.5rem; + margin-right: 1.25rem; +} +.off-canvas .menu > li > a:hover { + background: #353946; +} -.uppercase, header h1, header .button, .off-canvas .menu > li.subtitle > a, .title-area h2, .title-area h4 { - letter-spacing: .1em; - text-transform: uppercase; } +.uppercase, +header h1, +header .button, +.off-canvas .menu > li.subtitle > a, +.title-area h2, +.title-area h4 { + letter-spacing: 0.1em; + text-transform: uppercase; +} .box-link { position: absolute; @@ -4871,261 +6597,323 @@ header { left: 0; width: 100%; height: 100%; - z-index: 2; } + z-index: 2; +} main { position: relative; width: 100%; - overflow: hidden; } - main:before { - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 1px; - box-shadow: 0 0 10px rgba(10, 10, 10, 0.7); - content: " "; } - main section { - padding: 1.25rem 0; } + overflow: hidden; +} +main:before { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 1px; + box-shadow: 0 0 10px rgba(10, 10, 10, 0.7); + content: " "; +} +main section { + padding: 1.25rem 0; +} .title h1 { font-size: 1.75rem; font-weight: 600; color: #404554; - margin: 0; } + margin: 0; +} .title p { font-family: "Open sans", sans-serif; color: #b7bac0; font-weight: 600; font-size: 0.8125rem; - margin: 0; } + margin: 0; +} .title-area { border-bottom: 1px solid rgba(0, 0, 0, 0.04); - margin-bottom: 1.25rem; } - .title-area::before, .title-area::after { - display: table; - content: ' '; } - .title-area::after { - clear: both; } - .title-area h2, .title-area h4 { - float: left; - font-size: 0.875rem; - color: #5b5e61; - font-weight: 600; - line-height: 34px; - margin: 0; } - .title-area .button { - float: right; - background: none; - margin: 0; - color: #5a98e5; } - .title-area .button:hover { - color: #1e64bb; } - -.line-item, .box .summary { + margin-bottom: 1.25rem; +} +.title-area::before, +.title-area::after { + display: table; + content: " "; +} +.title-area::after { + clear: both; +} +.title-area h2, +.title-area h4 { + float: left; + font-size: 0.875rem; + color: #5b5e61; + font-weight: 600; + line-height: 34px; + margin: 0; +} +.title-area .button { + float: right; + background: none; + margin: 0; + color: #5a98e5; +} +.title-area .button:hover { + color: #1e64bb; +} + +.line-item, +.box .summary { position: relative; border-bottom: 1px solid rgba(0, 0, 0, 0.04); font-size: 1rem; - padding: 0.625rem; } - .line-item:hover, .box .summary:hover { - background: #f5f6f9; } - .line-item .title, .box .summary .title { - font-family: "Open sans", sans-serif; - color: #5b5e61; - font-weight: 600; } - .line-item .stat, .box .summary .stat { - vertical-align: middle; - height: 3.125rem; - width: 3.125rem; - line-height: 3.125rem; - display: inline-block; - text-align: center; - font-size: 2rem; - border-radius: 10px; - margin-right: 1.25rem; - background: #fbf0dc; - color: #ebb553; } - .line-item .stat.success, .box .summary .stat.success { - background: #def5e3; - color: #69d17f; } - .line-item .stat.alert, .box .summary .stat.alert { - background: #f5dee4; - color: #d16984; } + padding: 0.625rem; +} +.line-item:hover, +.box .summary:hover { + background: #f5f6f9; +} +.line-item .title, +.box .summary .title { + font-family: "Open sans", sans-serif; + color: #5b5e61; + font-weight: 600; +} +.line-item .stat, +.box .summary .stat { + vertical-align: middle; + height: 3.125rem; + width: 3.125rem; + line-height: 3.125rem; + display: inline-block; + text-align: center; + font-size: 2rem; + border-radius: 10px; + margin-right: 1.25rem; + background: #fbf0dc; + color: #ebb553; +} +.line-item .stat.success, +.box .summary .stat.success { + background: #def5e3; + color: #69d17f; +} +.line-item .stat.alert, +.box .summary .stat.alert { + background: #f5dee4; + color: #d16984; +} .box { background: #fefefe; padding: 1.25rem; box-shadow: 0 0 10px rgba(10, 10, 10, 0.04); - margin-bottom: 1.25rem; } - .box.alert { - background: #f5dee4; } - .box.warning { - background: #fbf0dc; } - .box.success { - background: #def5e3; } - .box.success .button.success { - background: #b7e9c2; } - .box.success .button.success:hover { - background: #90dda1; } - .box .tabs-content { - border: none; } - .box .tabs-content .tabs-panel { - padding-left: 0; - padding-right: 0; } + margin-bottom: 1.25rem; +} +.box.alert { + background: #f5dee4; +} +.box.warning { + background: #fbf0dc; +} +.box.success { + background: #def5e3; +} +.box.success .button.success { + background: #b7e9c2; +} +.box.success .button.success:hover { + background: #90dda1; +} +.box .tabs-content { + border: none; +} +.box .tabs-content .tabs-panel { + padding-left: 0; + padding-right: 0; +} .callout.breakdown { - padding-top: 1.25rem; } - .callout.breakdown:before { - content: ''; - position: relative; - height: 2px; - width: 60px; - display: block; - margin-bottom: 0.625rem; } - .callout.breakdown.file:before { - background: #69d17f; } - .callout.breakdown.reviewer:before { - background: #ebb553; } - .callout.breakdown p { - font-size: 0.8125rem; } - .callout.breakdown .menu li a img { - width: 20px; - height: auto; } - .callout.breakdown table { - font-size: 0.8125rem; } + padding-top: 1.25rem; +} +.callout.breakdown:before { + content: ""; + position: relative; + height: 2px; + width: 60px; + display: block; + margin-bottom: 0.625rem; +} +.callout.breakdown.file:before { + background: #69d17f; +} +.callout.breakdown.reviewer:before { + background: #ebb553; +} +.callout.breakdown p { + font-size: 0.8125rem; +} +.callout.breakdown .menu li a img { + width: 20px; + height: auto; +} +.callout.breakdown table { + font-size: 0.8125rem; +} a span.has-tip { - border: none; } + border: none; +} .dropdown-pane { background: #fefefe; - box-shadow: 0 0 10px rgba(10, 10, 10, 0.07); } + box-shadow: 0 0 10px rgba(10, 10, 10, 0.07); +} ul.actions li a { color: #5b5e61; font-family: "Open sans", sans-serif; - font-size: 0.8125rem; } - ul.actions li a img { - width: 1.25rem; - height: auto; - margin-right: 0.625rem; } - ul.actions li a:hover { - background: #f5f6f9; } - - ul.actions li button { + font-size: 0.8125rem; +} +ul.actions li a img { + width: 1.25rem; + height: auto; + margin-right: 0.625rem; +} +ul.actions li a:hover { + background: #f5f6f9; +} + +ul.actions li button { color: #5b5e61; font-family: "Open sans", sans-serif; font-size: 0.8125rem; display: block; - padding: 0.7rem 1rem; - line-height: 1;} - ul.actions li button img { - width: 1.25rem; - height: auto; - margin-right: 0.625rem; } - ul.actions li button:hover { - background: #f5f6f9; } + padding: 0.7rem 1rem; + line-height: 1; +} +ul.actions li button img { + width: 1.25rem; + height: auto; + margin-right: 0.625rem; +} +ul.actions li button:hover { + background: #f5f6f9; +} .checklist { position: relative; - padding: 2.5rem 0; } + padding: 2.5rem 0; +} +.checklist img { + width: 50px; + margin-bottom: 1.25rem; +} +@media print, screen and (min-width: 64em) { .checklist img { - width: 50px; - margin-bottom: 1.25rem; } - @media print, screen and (min-width: 64em) { - .checklist img { - width: 60%; - display: block; - margin: 0 auto; } } - .checklist:nth-child(1):before { - content: "1"; - position: absolute; - top: 0; - right: 0; - z-index: 0; - font-size: 11.25rem; - font-weight: 100; - font-family: "Open sans", sans-serif; - opacity: 0.05; } - .checklist:nth-child(2):before { - content: "2"; - position: absolute; - top: 0; - right: 0; - z-index: 0; - font-size: 11.25rem; - font-weight: 100; - font-family: "Open sans", sans-serif; - opacity: 0.05; } - .checklist:nth-child(3):before { - content: "3"; - position: absolute; - top: 0; - right: 0; - z-index: 0; - font-size: 11.25rem; - font-weight: 100; - font-family: "Open sans", sans-serif; - opacity: 0.05; } - .checklist:nth-child(4):before { - content: "4"; - position: absolute; - top: 0; - right: 0; - z-index: 0; - font-size: 11.25rem; - font-weight: 100; - font-family: "Open sans", sans-serif; - opacity: 0.05; } - .checklist:nth-child(5):before { - content: "5"; - position: absolute; - top: 0; - right: 0; - z-index: 0; - font-size: 11.25rem; - font-weight: 100; - font-family: "Open sans", sans-serif; - opacity: 0.05; } - .checklist:nth-child(6):before { - content: "6"; - position: absolute; - top: 0; - right: 0; - z-index: 0; - font-size: 11.25rem; - font-weight: 100; - font-family: "Open sans", sans-serif; - opacity: 0.05; } - .checklist:nth-child(7):before { - content: "7"; - position: absolute; - top: 0; - right: 0; - z-index: 0; - font-size: 11.25rem; - font-weight: 100; - font-family: "Avenir Next", Avenir, sans-serif; - opacity: 0.05; } - .checklist:nth-child(8):before { - content: "8"; - position: absolute; - top: 0; - right: 0; - z-index: 0; - font-size: 11.25rem; - font-weight: 100; - font-family: "Avenir Next", Avenir, sans-serif; - opacity: 0.05; } + width: 60%; + display: block; + margin: 0 auto; + } +} +.checklist:nth-child(1):before { + content: "1"; + position: absolute; + top: 0; + right: 0; + z-index: 0; + font-size: 11.25rem; + font-weight: 100; + font-family: "Open sans", sans-serif; + opacity: 0.05; +} +.checklist:nth-child(2):before { + content: "2"; + position: absolute; + top: 0; + right: 0; + z-index: 0; + font-size: 11.25rem; + font-weight: 100; + font-family: "Open sans", sans-serif; + opacity: 0.05; +} +.checklist:nth-child(3):before { + content: "3"; + position: absolute; + top: 0; + right: 0; + z-index: 0; + font-size: 11.25rem; + font-weight: 100; + font-family: "Open sans", sans-serif; + opacity: 0.05; +} +.checklist:nth-child(4):before { + content: "4"; + position: absolute; + top: 0; + right: 0; + z-index: 0; + font-size: 11.25rem; + font-weight: 100; + font-family: "Open sans", sans-serif; + opacity: 0.05; +} +.checklist:nth-child(5):before { + content: "5"; + position: absolute; + top: 0; + right: 0; + z-index: 0; + font-size: 11.25rem; + font-weight: 100; + font-family: "Open sans", sans-serif; + opacity: 0.05; +} +.checklist:nth-child(6):before { + content: "6"; + position: absolute; + top: 0; + right: 0; + z-index: 0; + font-size: 11.25rem; + font-weight: 100; + font-family: "Open sans", sans-serif; + opacity: 0.05; +} +.checklist:nth-child(7):before { + content: "7"; + position: absolute; + top: 0; + right: 0; + z-index: 0; + font-size: 11.25rem; + font-weight: 100; + font-family: "Avenir Next", Avenir, sans-serif; + opacity: 0.05; +} +.checklist:nth-child(8):before { + content: "8"; + position: absolute; + top: 0; + right: 0; + z-index: 0; + font-size: 11.25rem; + font-weight: 100; + font-family: "Avenir Next", Avenir, sans-serif; + opacity: 0.05; +} .header-icon { float: left; - margin-right: 0.625rem; } + margin-right: 0.625rem; +} .dataTables_wrapper > .row { - max-width: 100% !important; + max-width: 100% !important; } .control-button { @@ -5186,5 +6974,5 @@ ul.actions li a { /* workaround for TinyMCE: foudnation sets negative top margin to all form elements */ .tox-tinymce { - margin-bottom: 1rem; + margin-bottom: 1rem; } From 269c025f7dcf80c176bdfd90cd15d89ad7a5cde8 Mon Sep 17 00:00:00 2001 From: Joseph Muller Date: Thu, 8 Jan 2026 08:33:23 +0000 Subject: [PATCH 03/21] Upgrade and restyle datatables #5024 --- src/static/common/datatables/datatables.css | 792 + src/static/common/datatables/datatables.js | 13672 ++++++++++++++++ .../common/datatables/datatables.min.css | 15 + .../common/datatables/datatables.min.js | 22 + src/templates/admin/elements/datatables.html | 7 +- 5 files changed, 14505 insertions(+), 3 deletions(-) create mode 100644 src/static/common/datatables/datatables.css create mode 100644 src/static/common/datatables/datatables.js create mode 100644 src/static/common/datatables/datatables.min.css create mode 100644 src/static/common/datatables/datatables.min.js diff --git a/src/static/common/datatables/datatables.css b/src/static/common/datatables/datatables.css new file mode 100644 index 0000000000..ef7c75e14e --- /dev/null +++ b/src/static/common/datatables/datatables.css @@ -0,0 +1,792 @@ +/* + * This combined file was created by the DataTables downloader builder: + * https://datatables.net/download + * + * To rebuild or modify this file with the latest versions of the included + * software please visit: + * https://datatables.net/download/#dt/dt-2.1.8 + * + * Included libraries: + * DataTables 2.1.8 + */ + +@charset "UTF-8"; +:root { + --dt-row-selected: 13, 110, 253; + --dt-row-selected-text: 255, 255, 255; + --dt-row-selected-link: 9, 10, 11; + --dt-row-stripe: 0, 0, 0; + --dt-row-hover: 0, 0, 0; + --dt-column-ordering: 0, 0, 0; + --dt-html-background: white; +} +:root.dark { + --dt-html-background: rgb(33, 37, 41); +} + +table.dataTable td.dt-control { + text-align: center; + cursor: pointer; +} +table.dataTable td.dt-control:before { + display: inline-block; + box-sizing: border-box; + content: ""; + border-top: 5px solid transparent; + border-left: 10px solid rgba(0, 0, 0, 0.5); + border-bottom: 5px solid transparent; + border-right: 0px solid transparent; +} +table.dataTable tr.dt-hasChild td.dt-control:before { + border-top: 10px solid rgba(0, 0, 0, 0.5); + border-left: 5px solid transparent; + border-bottom: 0px solid transparent; + border-right: 5px solid transparent; +} + +html.dark table.dataTable td.dt-control:before, +:root[data-bs-theme=dark] table.dataTable td.dt-control:before, +:root[data-theme=dark] table.dataTable td.dt-control:before { + border-left-color: rgba(255, 255, 255, 0.5); +} +html.dark table.dataTable tr.dt-hasChild td.dt-control:before, +:root[data-bs-theme=dark] table.dataTable tr.dt-hasChild td.dt-control:before, +:root[data-theme=dark] table.dataTable tr.dt-hasChild td.dt-control:before { + border-top-color: rgba(255, 255, 255, 0.5); + border-left-color: transparent; +} + +div.dt-scroll { + width: 100%; +} + +div.dt-scroll-body thead tr, +div.dt-scroll-body tfoot tr { + height: 0; +} +div.dt-scroll-body thead tr th, div.dt-scroll-body thead tr td, +div.dt-scroll-body tfoot tr th, +div.dt-scroll-body tfoot tr td { + height: 0 !important; + padding-top: 0px !important; + padding-bottom: 0px !important; + border-top-width: 0px !important; + border-bottom-width: 0px !important; +} +div.dt-scroll-body thead tr th div.dt-scroll-sizing, div.dt-scroll-body thead tr td div.dt-scroll-sizing, +div.dt-scroll-body tfoot tr th div.dt-scroll-sizing, +div.dt-scroll-body tfoot tr td div.dt-scroll-sizing { + height: 0 !important; + overflow: hidden !important; +} + +table.dataTable thead > tr > th:active, +table.dataTable thead > tr > td:active { + outline: none; +} +table.dataTable thead > tr > th.dt-orderable-asc span.dt-column-order:before, table.dataTable thead > tr > th.dt-ordering-asc span.dt-column-order:before, +table.dataTable thead > tr > td.dt-orderable-asc span.dt-column-order:before, +table.dataTable thead > tr > td.dt-ordering-asc span.dt-column-order:before { + position: absolute; + display: block; + bottom: 50%; + content: "▲"; + content: "▲"/""; +} +table.dataTable thead > tr > th.dt-orderable-desc span.dt-column-order:after, table.dataTable thead > tr > th.dt-ordering-desc span.dt-column-order:after, +table.dataTable thead > tr > td.dt-orderable-desc span.dt-column-order:after, +table.dataTable thead > tr > td.dt-ordering-desc span.dt-column-order:after { + position: absolute; + display: block; + top: 50%; + content: "▼"; + content: "▼"/""; +} +table.dataTable thead > tr > th.dt-orderable-asc, table.dataTable thead > tr > th.dt-orderable-desc, table.dataTable thead > tr > th.dt-ordering-asc, table.dataTable thead > tr > th.dt-ordering-desc, +table.dataTable thead > tr > td.dt-orderable-asc, +table.dataTable thead > tr > td.dt-orderable-desc, +table.dataTable thead > tr > td.dt-ordering-asc, +table.dataTable thead > tr > td.dt-ordering-desc { + position: relative; + padding-right: 30px; +} +table.dataTable thead > tr > th.dt-orderable-asc span.dt-column-order, table.dataTable thead > tr > th.dt-orderable-desc span.dt-column-order, table.dataTable thead > tr > th.dt-ordering-asc span.dt-column-order, table.dataTable thead > tr > th.dt-ordering-desc span.dt-column-order, +table.dataTable thead > tr > td.dt-orderable-asc span.dt-column-order, +table.dataTable thead > tr > td.dt-orderable-desc span.dt-column-order, +table.dataTable thead > tr > td.dt-ordering-asc span.dt-column-order, +table.dataTable thead > tr > td.dt-ordering-desc span.dt-column-order { + position: absolute; + right: 12px; + top: 0; + bottom: 0; + width: 12px; +} +table.dataTable thead > tr > th.dt-orderable-asc span.dt-column-order:before, table.dataTable thead > tr > th.dt-orderable-asc span.dt-column-order:after, table.dataTable thead > tr > th.dt-orderable-desc span.dt-column-order:before, table.dataTable thead > tr > th.dt-orderable-desc span.dt-column-order:after, table.dataTable thead > tr > th.dt-ordering-asc span.dt-column-order:before, table.dataTable thead > tr > th.dt-ordering-asc span.dt-column-order:after, table.dataTable thead > tr > th.dt-ordering-desc span.dt-column-order:before, table.dataTable thead > tr > th.dt-ordering-desc span.dt-column-order:after, +table.dataTable thead > tr > td.dt-orderable-asc span.dt-column-order:before, +table.dataTable thead > tr > td.dt-orderable-asc span.dt-column-order:after, +table.dataTable thead > tr > td.dt-orderable-desc span.dt-column-order:before, +table.dataTable thead > tr > td.dt-orderable-desc span.dt-column-order:after, +table.dataTable thead > tr > td.dt-ordering-asc span.dt-column-order:before, +table.dataTable thead > tr > td.dt-ordering-asc span.dt-column-order:after, +table.dataTable thead > tr > td.dt-ordering-desc span.dt-column-order:before, +table.dataTable thead > tr > td.dt-ordering-desc span.dt-column-order:after { + left: 0; + opacity: 0.125; + line-height: 9px; + font-size: 0.8em; +} +table.dataTable thead > tr > th.dt-orderable-asc, table.dataTable thead > tr > th.dt-orderable-desc, +table.dataTable thead > tr > td.dt-orderable-asc, +table.dataTable thead > tr > td.dt-orderable-desc { + cursor: pointer; +} +table.dataTable thead > tr > th.dt-orderable-asc:hover, table.dataTable thead > tr > th.dt-orderable-desc:hover, +table.dataTable thead > tr > td.dt-orderable-asc:hover, +table.dataTable thead > tr > td.dt-orderable-desc:hover { + outline: 2px solid rgba(0, 0, 0, 0.05); + outline-offset: -2px; +} +table.dataTable thead > tr > th.dt-ordering-asc span.dt-column-order:before, table.dataTable thead > tr > th.dt-ordering-desc span.dt-column-order:after, +table.dataTable thead > tr > td.dt-ordering-asc span.dt-column-order:before, +table.dataTable thead > tr > td.dt-ordering-desc span.dt-column-order:after { + opacity: 0.6; +} +table.dataTable thead > tr > th.sorting_desc_disabled span.dt-column-order:after, table.dataTable thead > tr > th.sorting_asc_disabled span.dt-column-order:before, +table.dataTable thead > tr > td.sorting_desc_disabled span.dt-column-order:after, +table.dataTable thead > tr > td.sorting_asc_disabled span.dt-column-order:before { + display: none; +} +table.dataTable thead > tr > th:active, +table.dataTable thead > tr > td:active { + outline: none; +} + +div.dt-scroll-body > table.dataTable > thead > tr > th, +div.dt-scroll-body > table.dataTable > thead > tr > td { + overflow: hidden; +} + +:root.dark table.dataTable thead > tr > th.dt-orderable-asc:hover, :root.dark table.dataTable thead > tr > th.dt-orderable-desc:hover, +:root.dark table.dataTable thead > tr > td.dt-orderable-asc:hover, +:root.dark table.dataTable thead > tr > td.dt-orderable-desc:hover, +:root[data-bs-theme=dark] table.dataTable thead > tr > th.dt-orderable-asc:hover, +:root[data-bs-theme=dark] table.dataTable thead > tr > th.dt-orderable-desc:hover, +:root[data-bs-theme=dark] table.dataTable thead > tr > td.dt-orderable-asc:hover, +:root[data-bs-theme=dark] table.dataTable thead > tr > td.dt-orderable-desc:hover { + outline: 2px solid rgba(255, 255, 255, 0.05); +} + +div.dt-processing { + position: absolute; + top: 50%; + left: 50%; + width: 200px; + margin-left: -100px; + margin-top: -22px; + text-align: center; + padding: 2px; + z-index: 10; +} +div.dt-processing > div:last-child { + position: relative; + width: 80px; + height: 15px; + margin: 1em auto; +} +div.dt-processing > div:last-child > div { + position: absolute; + top: 0; + width: 13px; + height: 13px; + border-radius: 50%; + background: rgb(13, 110, 253); + background: rgb(var(--dt-row-selected)); + animation-timing-function: cubic-bezier(0, 1, 1, 0); +} +div.dt-processing > div:last-child > div:nth-child(1) { + left: 8px; + animation: datatables-loader-1 0.6s infinite; +} +div.dt-processing > div:last-child > div:nth-child(2) { + left: 8px; + animation: datatables-loader-2 0.6s infinite; +} +div.dt-processing > div:last-child > div:nth-child(3) { + left: 32px; + animation: datatables-loader-2 0.6s infinite; +} +div.dt-processing > div:last-child > div:nth-child(4) { + left: 56px; + animation: datatables-loader-3 0.6s infinite; +} + +@keyframes datatables-loader-1 { + 0% { + transform: scale(0); + } + 100% { + transform: scale(1); + } +} +@keyframes datatables-loader-3 { + 0% { + transform: scale(1); + } + 100% { + transform: scale(0); + } +} +@keyframes datatables-loader-2 { + 0% { + transform: translate(0, 0); + } + 100% { + transform: translate(24px, 0); + } +} +table.dataTable.nowrap th, table.dataTable.nowrap td { + white-space: nowrap; +} +table.dataTable th, +table.dataTable td { + box-sizing: border-box; +} +table.dataTable th.dt-left, +table.dataTable td.dt-left { + text-align: left; +} +table.dataTable th.dt-center, +table.dataTable td.dt-center { + text-align: center; +} +table.dataTable th.dt-right, +table.dataTable td.dt-right { + text-align: right; +} +table.dataTable th.dt-justify, +table.dataTable td.dt-justify { + text-align: justify; +} +table.dataTable th.dt-nowrap, +table.dataTable td.dt-nowrap { + white-space: nowrap; +} +table.dataTable th.dt-empty, +table.dataTable td.dt-empty { + text-align: center; + vertical-align: top; +} +table.dataTable th.dt-type-numeric, table.dataTable th.dt-type-date, +table.dataTable td.dt-type-numeric, +table.dataTable td.dt-type-date { + text-align: right; +} +table.dataTable thead th, +table.dataTable thead td, +table.dataTable tfoot th, +table.dataTable tfoot td { + text-align: left; +} +table.dataTable thead th.dt-head-left, +table.dataTable thead td.dt-head-left, +table.dataTable tfoot th.dt-head-left, +table.dataTable tfoot td.dt-head-left { + text-align: left; +} +table.dataTable thead th.dt-head-center, +table.dataTable thead td.dt-head-center, +table.dataTable tfoot th.dt-head-center, +table.dataTable tfoot td.dt-head-center { + text-align: center; +} +table.dataTable thead th.dt-head-right, +table.dataTable thead td.dt-head-right, +table.dataTable tfoot th.dt-head-right, +table.dataTable tfoot td.dt-head-right { + text-align: right; +} +table.dataTable thead th.dt-head-justify, +table.dataTable thead td.dt-head-justify, +table.dataTable tfoot th.dt-head-justify, +table.dataTable tfoot td.dt-head-justify { + text-align: justify; +} +table.dataTable thead th.dt-head-nowrap, +table.dataTable thead td.dt-head-nowrap, +table.dataTable tfoot th.dt-head-nowrap, +table.dataTable tfoot td.dt-head-nowrap { + white-space: nowrap; +} +table.dataTable tbody th.dt-body-left, +table.dataTable tbody td.dt-body-left { + text-align: left; +} +table.dataTable tbody th.dt-body-center, +table.dataTable tbody td.dt-body-center { + text-align: center; +} +table.dataTable tbody th.dt-body-right, +table.dataTable tbody td.dt-body-right { + text-align: right; +} +table.dataTable tbody th.dt-body-justify, +table.dataTable tbody td.dt-body-justify { + text-align: justify; +} +table.dataTable tbody th.dt-body-nowrap, +table.dataTable tbody td.dt-body-nowrap { + white-space: nowrap; +} + +/* + * Table styles + */ +table.dataTable { + width: 100%; + margin: 0 auto; + border-spacing: 0; + /* + * Header and footer styles + */ + /* + * Body styles + */ +} +table.dataTable thead th, +table.dataTable tfoot th { + font-weight: bold; +} +table.dataTable > thead > tr > th, +table.dataTable > thead > tr > td { + padding: 10px; + border-bottom: 1px solid rgba(0, 0, 0, 0.3); +} +table.dataTable > thead > tr > th:active, +table.dataTable > thead > tr > td:active { + outline: none; +} +table.dataTable > tfoot > tr > th, +table.dataTable > tfoot > tr > td { + border-top: 1px solid rgba(0, 0, 0, 0.3); + padding: 10px 10px 6px 10px; +} +table.dataTable > tbody > tr:first-child > * { + border-top: none; +} +table.dataTable > tbody > tr:last-child > * { + border-bottom: none; +} +table.dataTable > tbody > tr.selected > * { + box-shadow: inset 0 0 0 9999px rgba(13, 110, 253, 0.9); + box-shadow: inset 0 0 0 9999px rgba(var(--dt-row-selected), 0.9); + color: rgb(255, 255, 255); + color: rgb(var(--dt-row-selected-text)); +} +table.dataTable > tbody > tr.selected a { + color: rgb(9, 10, 11); + color: rgb(var(--dt-row-selected-link)); +} +table.dataTable > tbody > tr > th, +table.dataTable > tbody > tr > td { + padding: 8px 10px; +} +table.dataTable.row-border > tbody > tr > *, table.dataTable.display > tbody > tr > * { + border-top: 1px solid rgba(0, 0, 0, 0.15); +} +table.dataTable.row-border > tbody > tr:first-child > *, table.dataTable.display > tbody > tr:first-child > * { + border-top: none; +} +table.dataTable.row-border > tbody > tr.selected + tr.selected > td, table.dataTable.display > tbody > tr.selected + tr.selected > td { + border-top-color: rgba(13, 110, 253, 0.65); + border-top-color: rgba(var(--dt-row-selected), 0.65); +} +table.dataTable.cell-border > tbody > tr > * { + border-top: 1px solid rgba(0, 0, 0, 0.15); + border-right: 1px solid rgba(0, 0, 0, 0.15); +} +table.dataTable.cell-border > tbody > tr > *:first-child { + border-left: 1px solid rgba(0, 0, 0, 0.15); +} +table.dataTable.cell-border > tbody > tr:first-child > * { + border-top: 1px solid rgba(0, 0, 0, 0.3); +} +table.dataTable.stripe > tbody > tr:nth-child(odd) > *, table.dataTable.display > tbody > tr:nth-child(odd) > * { + box-shadow: inset 0 0 0 9999px rgba(0, 0, 0, 0.023); + box-shadow: inset 0 0 0 9999px rgba(var(--dt-row-stripe), 0.023); +} +table.dataTable.stripe > tbody > tr:nth-child(odd).selected > *, table.dataTable.display > tbody > tr:nth-child(odd).selected > * { + box-shadow: inset 0 0 0 9999px rgba(13, 110, 253, 0.923); + box-shadow: inset 0 0 0 9999px rgba(var(--dt-row-selected), 0.923); +} +table.dataTable.hover > tbody > tr:hover > *, table.dataTable.display > tbody > tr:hover > * { + box-shadow: inset 0 0 0 9999px rgba(0, 0, 0, 0.035); + box-shadow: inset 0 0 0 9999px rgba(var(--dt-row-hover), 0.035); +} +table.dataTable.hover > tbody > tr.selected:hover > *, table.dataTable.display > tbody > tr.selected:hover > * { + box-shadow: inset 0 0 0 9999px #0d6efd !important; + box-shadow: inset 0 0 0 9999px rgba(var(--dt-row-selected), 1) !important; +} +table.dataTable.order-column > tbody tr > .sorting_1, +table.dataTable.order-column > tbody tr > .sorting_2, +table.dataTable.order-column > tbody tr > .sorting_3, table.dataTable.display > tbody tr > .sorting_1, +table.dataTable.display > tbody tr > .sorting_2, +table.dataTable.display > tbody tr > .sorting_3 { + box-shadow: inset 0 0 0 9999px rgba(0, 0, 0, 0.019); + box-shadow: inset 0 0 0 9999px rgba(var(--dt-column-ordering), 0.019); +} +table.dataTable.order-column > tbody tr.selected > .sorting_1, +table.dataTable.order-column > tbody tr.selected > .sorting_2, +table.dataTable.order-column > tbody tr.selected > .sorting_3, table.dataTable.display > tbody tr.selected > .sorting_1, +table.dataTable.display > tbody tr.selected > .sorting_2, +table.dataTable.display > tbody tr.selected > .sorting_3 { + box-shadow: inset 0 0 0 9999px rgba(13, 110, 253, 0.919); + box-shadow: inset 0 0 0 9999px rgba(var(--dt-row-selected), 0.919); +} +table.dataTable.display > tbody > tr:nth-child(odd) > .sorting_1, table.dataTable.order-column.stripe > tbody > tr:nth-child(odd) > .sorting_1 { + box-shadow: inset 0 0 0 9999px rgba(0, 0, 0, 0.054); + box-shadow: inset 0 0 0 9999px rgba(var(--dt-column-ordering), 0.054); +} +table.dataTable.display > tbody > tr:nth-child(odd) > .sorting_2, table.dataTable.order-column.stripe > tbody > tr:nth-child(odd) > .sorting_2 { + box-shadow: inset 0 0 0 9999px rgba(0, 0, 0, 0.047); + box-shadow: inset 0 0 0 9999px rgba(var(--dt-column-ordering), 0.047); +} +table.dataTable.display > tbody > tr:nth-child(odd) > .sorting_3, table.dataTable.order-column.stripe > tbody > tr:nth-child(odd) > .sorting_3 { + box-shadow: inset 0 0 0 9999px rgba(0, 0, 0, 0.039); + box-shadow: inset 0 0 0 9999px rgba(var(--dt-column-ordering), 0.039); +} +table.dataTable.display > tbody > tr:nth-child(odd).selected > .sorting_1, table.dataTable.order-column.stripe > tbody > tr:nth-child(odd).selected > .sorting_1 { + box-shadow: inset 0 0 0 9999px rgba(13, 110, 253, 0.954); + box-shadow: inset 0 0 0 9999px rgba(var(--dt-row-selected), 0.954); +} +table.dataTable.display > tbody > tr:nth-child(odd).selected > .sorting_2, table.dataTable.order-column.stripe > tbody > tr:nth-child(odd).selected > .sorting_2 { + box-shadow: inset 0 0 0 9999px rgba(13, 110, 253, 0.947); + box-shadow: inset 0 0 0 9999px rgba(var(--dt-row-selected), 0.947); +} +table.dataTable.display > tbody > tr:nth-child(odd).selected > .sorting_3, table.dataTable.order-column.stripe > tbody > tr:nth-child(odd).selected > .sorting_3 { + box-shadow: inset 0 0 0 9999px rgba(13, 110, 253, 0.939); + box-shadow: inset 0 0 0 9999px rgba(var(--dt-row-selected), 0.939); +} +table.dataTable.display > tbody > tr.even > .sorting_1, table.dataTable.order-column.stripe > tbody > tr.even > .sorting_1 { + box-shadow: inset 0 0 0 9999px rgba(0, 0, 0, 0.019); + box-shadow: inset 0 0 0 9999px rgba(var(--dt-column-ordering), 0.019); +} +table.dataTable.display > tbody > tr.even > .sorting_2, table.dataTable.order-column.stripe > tbody > tr.even > .sorting_2 { + box-shadow: inset 0 0 0 9999px rgba(0, 0, 0, 0.011); + box-shadow: inset 0 0 0 9999px rgba(var(--dt-column-ordering), 0.011); +} +table.dataTable.display > tbody > tr.even > .sorting_3, table.dataTable.order-column.stripe > tbody > tr.even > .sorting_3 { + box-shadow: inset 0 0 0 9999px rgba(0, 0, 0, 0.003); + box-shadow: inset 0 0 0 9999px rgba(var(--dt-column-ordering), 0.003); +} +table.dataTable.display > tbody > tr.even.selected > .sorting_1, table.dataTable.order-column.stripe > tbody > tr.even.selected > .sorting_1 { + box-shadow: inset 0 0 0 9999px rgba(13, 110, 253, 0.919); + box-shadow: inset 0 0 0 9999px rgba(var(--dt-row-selected), 0.919); +} +table.dataTable.display > tbody > tr.even.selected > .sorting_2, table.dataTable.order-column.stripe > tbody > tr.even.selected > .sorting_2 { + box-shadow: inset 0 0 0 9999px rgba(13, 110, 253, 0.911); + box-shadow: inset 0 0 0 9999px rgba(var(--dt-row-selected), 0.911); +} +table.dataTable.display > tbody > tr.even.selected > .sorting_3, table.dataTable.order-column.stripe > tbody > tr.even.selected > .sorting_3 { + box-shadow: inset 0 0 0 9999px rgba(13, 110, 253, 0.903); + box-shadow: inset 0 0 0 9999px rgba(var(--dt-row-selected), 0.903); +} +table.dataTable.display tbody tr:hover > .sorting_1, table.dataTable.order-column.hover tbody tr:hover > .sorting_1 { + box-shadow: inset 0 0 0 9999px rgba(0, 0, 0, 0.082); + box-shadow: inset 0 0 0 9999px rgba(var(--dt-row-hover), 0.082); +} +table.dataTable.display tbody tr:hover > .sorting_2, table.dataTable.order-column.hover tbody tr:hover > .sorting_2 { + box-shadow: inset 0 0 0 9999px rgba(0, 0, 0, 0.074); + box-shadow: inset 0 0 0 9999px rgba(var(--dt-row-hover), 0.074); +} +table.dataTable.display tbody tr:hover > .sorting_3, table.dataTable.order-column.hover tbody tr:hover > .sorting_3 { + box-shadow: inset 0 0 0 9999px rgba(0, 0, 0, 0.062); + box-shadow: inset 0 0 0 9999px rgba(var(--dt-row-hover), 0.062); +} +table.dataTable.display tbody tr:hover.selected > .sorting_1, table.dataTable.order-column.hover tbody tr:hover.selected > .sorting_1 { + box-shadow: inset 0 0 0 9999px rgba(13, 110, 253, 0.982); + box-shadow: inset 0 0 0 9999px rgba(var(--dt-row-selected), 0.982); +} +table.dataTable.display tbody tr:hover.selected > .sorting_2, table.dataTable.order-column.hover tbody tr:hover.selected > .sorting_2 { + box-shadow: inset 0 0 0 9999px rgba(13, 110, 253, 0.974); + box-shadow: inset 0 0 0 9999px rgba(var(--dt-row-selected), 0.974); +} +table.dataTable.display tbody tr:hover.selected > .sorting_3, table.dataTable.order-column.hover tbody tr:hover.selected > .sorting_3 { + box-shadow: inset 0 0 0 9999px rgba(13, 110, 253, 0.962); + box-shadow: inset 0 0 0 9999px rgba(var(--dt-row-selected), 0.962); +} +table.dataTable.compact thead th, +table.dataTable.compact thead td, +table.dataTable.compact tfoot th, +table.dataTable.compact tfoot td, +table.dataTable.compact tbody th, +table.dataTable.compact tbody td { + padding: 4px; +} + +div.dt-container div.dt-layout-row { + display: flex; + justify-content: space-between; + align-items: center; + width: 100%; + margin: 0.75em 0; +} +div.dt-container div.dt-layout-row div.dt-layout-cell { + display: flex; + justify-content: space-between; + align-items: center; +} +div.dt-container div.dt-layout-row div.dt-layout-cell.dt-layout-start { + justify-content: flex-start; + margin-right: auto; +} +div.dt-container div.dt-layout-row div.dt-layout-cell.dt-layout-end { + justify-content: flex-end; + margin-left: auto; +} +div.dt-container div.dt-layout-row div.dt-layout-cell:empty { + display: none; +} + +@media screen and (max-width: 767px) { + div.dt-container div.dt-layout-row:not(.dt-layout-table) { + display: block; + } + div.dt-container div.dt-layout-row:not(.dt-layout-table) div.dt-layout-cell { + display: block; + text-align: center; + } + div.dt-container div.dt-layout-row:not(.dt-layout-table) div.dt-layout-cell > * { + margin: 0.5em 0; + } + div.dt-container div.dt-layout-row:not(.dt-layout-table) div.dt-layout-cell.dt-layout-start { + margin-right: 0; + } + div.dt-container div.dt-layout-row:not(.dt-layout-table) div.dt-layout-cell.dt-layout-end { + margin-left: 0; + } +} +div.dt-container div.dt-layout-start > *:not(:last-child) { + margin-right: 1em; +} +div.dt-container div.dt-layout-end > *:not(:first-child) { + margin-left: 1em; +} +div.dt-container div.dt-layout-full { + width: 100%; +} +div.dt-container div.dt-layout-full > *:only-child { + margin-left: auto; + margin-right: auto; +} +div.dt-container div.dt-layout-table > div { + display: block !important; +} + +@media screen and (max-width: 767px) { + div.dt-container div.dt-layout-start > *:not(:last-child) { + margin-right: 0; + } + div.dt-container div.dt-layout-end > *:not(:first-child) { + margin-left: 0; + } +} +/* + * Control feature layout + */ +div.dt-container { + position: relative; + clear: both; +} +div.dt-container .dt-search input { + border: 1px solid #aaa; + border-radius: 3px; + padding: 5px; + background-color: transparent; + color: inherit; + margin-left: 3px; +} +div.dt-container .dt-input { + border: 1px solid #aaa; + border-radius: 3px; + padding: 5px; + background-color: transparent; + color: inherit; +} +div.dt-container select.dt-input { + padding: 4px; +} +div.dt-container .dt-paging .dt-paging-button { + box-sizing: border-box; + display: inline-block; + min-width: 1.5em; + padding: 0.5em 1em; + margin-left: 2px; + text-align: center; + text-decoration: none !important; + cursor: pointer; + color: inherit !important; + border: 1px solid transparent; + border-radius: 2px; + background: transparent; +} +div.dt-container .dt-paging .dt-paging-button.current, div.dt-container .dt-paging .dt-paging-button.current:hover { + color: inherit !important; + border: 1px solid rgba(0, 0, 0, 0.3); + background-color: rgba(0, 0, 0, 0.05); + background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(230, 230, 230, 0.05)), color-stop(100%, rgba(0, 0, 0, 0.05))); /* Chrome,Safari4+ */ + background: -webkit-linear-gradient(top, rgba(230, 230, 230, 0.05) 0%, rgba(0, 0, 0, 0.05) 100%); /* Chrome10+,Safari5.1+ */ + background: -moz-linear-gradient(top, rgba(230, 230, 230, 0.05) 0%, rgba(0, 0, 0, 0.05) 100%); /* FF3.6+ */ + background: -ms-linear-gradient(top, rgba(230, 230, 230, 0.05) 0%, rgba(0, 0, 0, 0.05) 100%); /* IE10+ */ + background: -o-linear-gradient(top, rgba(230, 230, 230, 0.05) 0%, rgba(0, 0, 0, 0.05) 100%); /* Opera 11.10+ */ + background: linear-gradient(to bottom, rgba(230, 230, 230, 0.05) 0%, rgba(0, 0, 0, 0.05) 100%); /* W3C */ +} +div.dt-container .dt-paging .dt-paging-button.disabled, div.dt-container .dt-paging .dt-paging-button.disabled:hover, div.dt-container .dt-paging .dt-paging-button.disabled:active { + cursor: default; + color: rgba(0, 0, 0, 0.5) !important; + border: 1px solid transparent; + background: transparent; + box-shadow: none; +} +div.dt-container .dt-paging .dt-paging-button:hover { + color: white !important; + border: 1px solid #111; + background-color: #111; + background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #585858), color-stop(100%, #111)); /* Chrome,Safari4+ */ + background: -webkit-linear-gradient(top, #585858 0%, #111 100%); /* Chrome10+,Safari5.1+ */ + background: -moz-linear-gradient(top, #585858 0%, #111 100%); /* FF3.6+ */ + background: -ms-linear-gradient(top, #585858 0%, #111 100%); /* IE10+ */ + background: -o-linear-gradient(top, #585858 0%, #111 100%); /* Opera 11.10+ */ + background: linear-gradient(to bottom, #585858 0%, #111 100%); /* W3C */ +} +div.dt-container .dt-paging .dt-paging-button:active { + outline: none; + background-color: #0c0c0c; + background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #2b2b2b), color-stop(100%, #0c0c0c)); /* Chrome,Safari4+ */ + background: -webkit-linear-gradient(top, #2b2b2b 0%, #0c0c0c 100%); /* Chrome10+,Safari5.1+ */ + background: -moz-linear-gradient(top, #2b2b2b 0%, #0c0c0c 100%); /* FF3.6+ */ + background: -ms-linear-gradient(top, #2b2b2b 0%, #0c0c0c 100%); /* IE10+ */ + background: -o-linear-gradient(top, #2b2b2b 0%, #0c0c0c 100%); /* Opera 11.10+ */ + background: linear-gradient(to bottom, #2b2b2b 0%, #0c0c0c 100%); /* W3C */ + box-shadow: inset 0 0 3px #111; +} +div.dt-container .dt-paging .ellipsis { + padding: 0 1em; +} +div.dt-container .dt-length, +div.dt-container .dt-search, +div.dt-container .dt-info, +div.dt-container .dt-processing, +div.dt-container .dt-paging { + color: inherit; +} +div.dt-container .dataTables_scroll { + clear: both; +} +div.dt-container .dataTables_scroll div.dt-scroll-body { + -webkit-overflow-scrolling: touch; +} +div.dt-container .dataTables_scroll div.dt-scroll-body > table > thead > tr > th, div.dt-container .dataTables_scroll div.dt-scroll-body > table > thead > tr > td, div.dt-container .dataTables_scroll div.dt-scroll-body > table > tbody > tr > th, div.dt-container .dataTables_scroll div.dt-scroll-body > table > tbody > tr > td { + vertical-align: middle; +} +div.dt-container .dataTables_scroll div.dt-scroll-body > table > thead > tr > th > div.dataTables_sizing, +div.dt-container .dataTables_scroll div.dt-scroll-body > table > thead > tr > td > div.dataTables_sizing, div.dt-container .dataTables_scroll div.dt-scroll-body > table > tbody > tr > th > div.dataTables_sizing, +div.dt-container .dataTables_scroll div.dt-scroll-body > table > tbody > tr > td > div.dataTables_sizing { + height: 0; + overflow: hidden; + margin: 0 !important; + padding: 0 !important; +} +div.dt-container.dt-empty-footer tbody > tr:last-child > * { + border-bottom: 1px solid rgba(0, 0, 0, 0.3); +} +div.dt-container.dt-empty-footer .dt-scroll-body { + border-bottom: 1px solid rgba(0, 0, 0, 0.3); +} +div.dt-container.dt-empty-footer .dt-scroll-body tbody > tr:last-child > * { + border-bottom: none; +} + +html.dark { + --dt-row-hover: 255, 255, 255; + --dt-row-stripe: 255, 255, 255; + --dt-column-ordering: 255, 255, 255; +} +html.dark table.dataTable > thead > tr > th, +html.dark table.dataTable > thead > tr > td { + border-bottom: 1px solid rgb(89, 91, 94); +} +html.dark table.dataTable > thead > tr > th:active, +html.dark table.dataTable > thead > tr > td:active { + outline: none; +} +html.dark table.dataTable > tfoot > tr > th, +html.dark table.dataTable > tfoot > tr > td { + border-top: 1px solid rgb(89, 91, 94); +} +html.dark table.dataTable.row-border > tbody > tr > *, html.dark table.dataTable.display > tbody > tr > * { + border-top: 1px solid rgb(64, 67, 70); +} +html.dark table.dataTable.row-border > tbody > tr:first-child > *, html.dark table.dataTable.display > tbody > tr:first-child > * { + border-top: none; +} +html.dark table.dataTable.row-border > tbody > tr.selected + tr.selected > td, html.dark table.dataTable.display > tbody > tr.selected + tr.selected > td { + border-top-color: rgba(13, 110, 253, 0.65); + border-top-color: rgba(var(--dt-row-selected), 0.65); +} +html.dark table.dataTable.cell-border > tbody > tr > th, +html.dark table.dataTable.cell-border > tbody > tr > td { + border-top: 1px solid rgb(64, 67, 70); + border-right: 1px solid rgb(64, 67, 70); +} +html.dark table.dataTable.cell-border > tbody > tr > th:first-child, +html.dark table.dataTable.cell-border > tbody > tr > td:first-child { + border-left: 1px solid rgb(64, 67, 70); +} +html.dark .dt-container.dt-empty-footer table.dataTable { + border-bottom: 1px solid rgb(89, 91, 94); +} +html.dark .dt-container .dt-search input, +html.dark .dt-container .dt-length select { + border: 1px solid rgba(255, 255, 255, 0.2); + background-color: var(--dt-html-background); +} +html.dark .dt-container .dt-paging .dt-paging-button.current, html.dark .dt-container .dt-paging .dt-paging-button.current:hover { + border: 1px solid rgb(89, 91, 94); + background: rgba(255, 255, 255, 0.15); +} +html.dark .dt-container .dt-paging .dt-paging-button.disabled, html.dark .dt-container .dt-paging .dt-paging-button.disabled:hover, html.dark .dt-container .dt-paging .dt-paging-button.disabled:active { + color: #666 !important; +} +html.dark .dt-container .dt-paging .dt-paging-button:hover { + border: 1px solid rgb(53, 53, 53); + background: rgb(53, 53, 53); +} +html.dark .dt-container .dt-paging .dt-paging-button:active { + background: #3a3a3a; +} + +/* + * Overrides for RTL support + */ +*[dir=rtl] table.dataTable thead th, +*[dir=rtl] table.dataTable thead td, +*[dir=rtl] table.dataTable tfoot th, +*[dir=rtl] table.dataTable tfoot td { + text-align: right; +} +*[dir=rtl] table.dataTable th.dt-type-numeric, *[dir=rtl] table.dataTable th.dt-type-date, +*[dir=rtl] table.dataTable td.dt-type-numeric, +*[dir=rtl] table.dataTable td.dt-type-date { + text-align: left; +} +*[dir=rtl] div.dt-container div.dt-layout-cell.dt-start { + text-align: right; +} +*[dir=rtl] div.dt-container div.dt-layout-cell.dt-end { + text-align: left; +} +*[dir=rtl] div.dt-container div.dt-search input { + margin: 0 3px 0 0; +} + + diff --git a/src/static/common/datatables/datatables.js b/src/static/common/datatables/datatables.js new file mode 100644 index 0000000000..624c38eee6 --- /dev/null +++ b/src/static/common/datatables/datatables.js @@ -0,0 +1,13672 @@ +/* + * This combined file was created by the DataTables downloader builder: + * https://datatables.net/download + * + * To rebuild or modify this file with the latest versions of the included + * software please visit: + * https://datatables.net/download/#dt/dt-2.1.8 + * + * Included libraries: + * DataTables 2.1.8 + */ + +/*! DataTables 2.1.8 + * © SpryMedia Ltd - datatables.net/license + */ + +/** + * @summary DataTables + * @description Paginate, search and order HTML tables + * @version 2.1.8 + * @author SpryMedia Ltd + * @contact www.datatables.net + * @copyright SpryMedia Ltd. + * + * This source file is free software, available under the following license: + * MIT license - https://datatables.net/license + * + * This source file is distributed in the hope that it will be useful, but + * WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY + * or FITNESS FOR A PARTICULAR PURPOSE. See the license files for details. + * + * For details please refer to: https://www.datatables.net + */ + +(function( factory ) { + "use strict"; + + if ( typeof define === 'function' && define.amd ) { + // AMD + define( ['jquery'], function ( $ ) { + return factory( $, window, document ); + } ); + } + else if ( typeof exports === 'object' ) { + // CommonJS + // jQuery's factory checks for a global window - if it isn't present then it + // returns a factory function that expects the window object + var jq = require('jquery'); + + if (typeof window === 'undefined') { + module.exports = function (root, $) { + if ( ! root ) { + // CommonJS environments without a window global must pass a + // root. This will give an error otherwise + root = window; + } + + if ( ! $ ) { + $ = jq( root ); + } + + return factory( $, root, root.document ); + }; + } + else { + module.exports = factory( jq, window, window.document ); + } + } + else { + // Browser + window.DataTable = factory( jQuery, window, document ); + } +}(function( $, window, document ) { + "use strict"; + + + var DataTable = function ( selector, options ) + { + // Check if called with a window or jQuery object for DOM less applications + // This is for backwards compatibility + if (DataTable.factory(selector, options)) { + return DataTable; + } + + // When creating with `new`, create a new DataTable, returning the API instance + if (this instanceof DataTable) { + return $(selector).DataTable(options); + } + else { + // Argument switching + options = selector; + } + + var _that = this; + var emptyInit = options === undefined; + var len = this.length; + + if ( emptyInit ) { + options = {}; + } + + // Method to get DT API instance from jQuery object + this.api = function () + { + return new _Api( this ); + }; + + this.each(function() { + // For each initialisation we want to give it a clean initialisation + // object that can be bashed around + var o = {}; + var oInit = len > 1 ? // optimisation for single table case + _fnExtend( o, options, true ) : + options; + + + var i=0, iLen; + var sId = this.getAttribute( 'id' ); + var defaults = DataTable.defaults; + var $this = $(this); + + + /* Sanity check */ + if ( this.nodeName.toLowerCase() != 'table' ) + { + _fnLog( null, 0, 'Non-table node initialisation ('+this.nodeName+')', 2 ); + return; + } + + $(this).trigger( 'options.dt', oInit ); + + /* Backwards compatibility for the defaults */ + _fnCompatOpts( defaults ); + _fnCompatCols( defaults.column ); + + /* Convert the camel-case defaults to Hungarian */ + _fnCamelToHungarian( defaults, defaults, true ); + _fnCamelToHungarian( defaults.column, defaults.column, true ); + + /* Setting up the initialisation object */ + _fnCamelToHungarian( defaults, $.extend( oInit, $this.data() ), true ); + + + + /* Check to see if we are re-initialising a table */ + var allSettings = DataTable.settings; + for ( i=0, iLen=allSettings.length ; i').prependTo(this), + fastData: function (row, column, type) { + return _fnGetCellData(oSettings, row, column, type); + } + } ); + oSettings.nTable = this; + oSettings.oInit = oInit; + + allSettings.push( oSettings ); + + // Make a single API instance available for internal handling + oSettings.api = new _Api( oSettings ); + + // Need to add the instance after the instance after the settings object has been added + // to the settings array, so we can self reference the table instance if more than one + oSettings.oInstance = (_that.length===1) ? _that : $this.dataTable(); + + // Backwards compatibility, before we apply all the defaults + _fnCompatOpts( oInit ); + + // If the length menu is given, but the init display length is not, use the length menu + if ( oInit.aLengthMenu && ! oInit.iDisplayLength ) + { + oInit.iDisplayLength = Array.isArray(oInit.aLengthMenu[0]) + ? oInit.aLengthMenu[0][0] + : $.isPlainObject( oInit.aLengthMenu[0] ) + ? oInit.aLengthMenu[0].value + : oInit.aLengthMenu[0]; + } + + // Apply the defaults and init options to make a single init object will all + // options defined from defaults and instance options. + oInit = _fnExtend( $.extend( true, {}, defaults ), oInit ); + + + // Map the initialisation options onto the settings object + _fnMap( oSettings.oFeatures, oInit, [ + "bPaginate", + "bLengthChange", + "bFilter", + "bSort", + "bSortMulti", + "bInfo", + "bProcessing", + "bAutoWidth", + "bSortClasses", + "bServerSide", + "bDeferRender" + ] ); + _fnMap( oSettings, oInit, [ + "ajax", + "fnFormatNumber", + "sServerMethod", + "aaSorting", + "aaSortingFixed", + "aLengthMenu", + "sPaginationType", + "iStateDuration", + "bSortCellsTop", + "iTabIndex", + "sDom", + "fnStateLoadCallback", + "fnStateSaveCallback", + "renderer", + "searchDelay", + "rowId", + "caption", + "layout", + "orderDescReverse", + "typeDetect", + [ "iCookieDuration", "iStateDuration" ], // backwards compat + [ "oSearch", "oPreviousSearch" ], + [ "aoSearchCols", "aoPreSearchCols" ], + [ "iDisplayLength", "_iDisplayLength" ] + ] ); + _fnMap( oSettings.oScroll, oInit, [ + [ "sScrollX", "sX" ], + [ "sScrollXInner", "sXInner" ], + [ "sScrollY", "sY" ], + [ "bScrollCollapse", "bCollapse" ] + ] ); + _fnMap( oSettings.oLanguage, oInit, "fnInfoCallback" ); + + /* Callback functions which are array driven */ + _fnCallbackReg( oSettings, 'aoDrawCallback', oInit.fnDrawCallback ); + _fnCallbackReg( oSettings, 'aoStateSaveParams', oInit.fnStateSaveParams ); + _fnCallbackReg( oSettings, 'aoStateLoadParams', oInit.fnStateLoadParams ); + _fnCallbackReg( oSettings, 'aoStateLoaded', oInit.fnStateLoaded ); + _fnCallbackReg( oSettings, 'aoRowCallback', oInit.fnRowCallback ); + _fnCallbackReg( oSettings, 'aoRowCreatedCallback', oInit.fnCreatedRow ); + _fnCallbackReg( oSettings, 'aoHeaderCallback', oInit.fnHeaderCallback ); + _fnCallbackReg( oSettings, 'aoFooterCallback', oInit.fnFooterCallback ); + _fnCallbackReg( oSettings, 'aoInitComplete', oInit.fnInitComplete ); + _fnCallbackReg( oSettings, 'aoPreDrawCallback', oInit.fnPreDrawCallback ); + + oSettings.rowIdFn = _fnGetObjectDataFn( oInit.rowId ); + + /* Browser support detection */ + _fnBrowserDetect( oSettings ); + + var oClasses = oSettings.oClasses; + + $.extend( oClasses, DataTable.ext.classes, oInit.oClasses ); + $this.addClass( oClasses.table ); + + if (! oSettings.oFeatures.bPaginate) { + oInit.iDisplayStart = 0; + } + + if ( oSettings.iInitDisplayStart === undefined ) + { + /* Display start point, taking into account the save saving */ + oSettings.iInitDisplayStart = oInit.iDisplayStart; + oSettings._iDisplayStart = oInit.iDisplayStart; + } + + var defer = oInit.iDeferLoading; + if ( defer !== null ) + { + oSettings.deferLoading = true; + + var tmp = Array.isArray(defer); + oSettings._iRecordsDisplay = tmp ? defer[0] : defer; + oSettings._iRecordsTotal = tmp ? defer[1] : defer; + } + + /* + * Columns + * See if we should load columns automatically or use defined ones + */ + var columnsInit = []; + var thead = this.getElementsByTagName('thead'); + var initHeaderLayout = _fnDetectHeader( oSettings, thead[0] ); + + // If we don't have a columns array, then generate one with nulls + if ( oInit.aoColumns ) { + columnsInit = oInit.aoColumns; + } + else if ( initHeaderLayout.length ) { + for ( i=0, iLen=initHeaderLayout[0].length ; i').appendTo( $this ); + } + + caption.html( oSettings.caption ); + } + + // Store the caption side, so we can remove the element from the document + // when creating the element + if (caption.length) { + caption[0]._captionSide = caption.css('caption-side'); + oSettings.captionNode = caption[0]; + } + + if ( thead.length === 0 ) { + thead = $('').appendTo($this); + } + oSettings.nTHead = thead[0]; + $('tr', thead).addClass(oClasses.thead.row); + + var tbody = $this.children('tbody'); + if ( tbody.length === 0 ) { + tbody = $('').insertAfter(thead); + } + oSettings.nTBody = tbody[0]; + + var tfoot = $this.children('tfoot'); + if ( tfoot.length === 0 ) { + // If we are a scrolling table, and no footer has been given, then we need to create + // a tfoot element for the caption element to be appended to + tfoot = $('').appendTo($this); + } + oSettings.nTFoot = tfoot[0]; + $('tr', tfoot).addClass(oClasses.tfoot.row); + + // Copy the data index array + oSettings.aiDisplay = oSettings.aiDisplayMaster.slice(); + + // Initialisation complete - table can be drawn + oSettings.bInitialised = true; + + // Language definitions + var oLanguage = oSettings.oLanguage; + $.extend( true, oLanguage, oInit.oLanguage ); + + if ( oLanguage.sUrl ) { + // Get the language definitions from a file + $.ajax( { + dataType: 'json', + url: oLanguage.sUrl, + success: function ( json ) { + _fnCamelToHungarian( defaults.oLanguage, json ); + $.extend( true, oLanguage, json, oSettings.oInit.oLanguage ); + + _fnCallbackFire( oSettings, null, 'i18n', [oSettings], true); + _fnInitialise( oSettings ); + }, + error: function () { + // Error occurred loading language file + _fnLog( oSettings, 0, 'i18n file loading error', 21 ); + + // Continue on as best we can + _fnInitialise( oSettings ); + } + } ); + } + else { + _fnCallbackFire( oSettings, null, 'i18n', [oSettings], true); + _fnInitialise( oSettings ); + } + } ); + _that = null; + return this; + }; + + + + /** + * DataTables extensions + * + * This namespace acts as a collection area for plug-ins that can be used to + * extend DataTables capabilities. Indeed many of the build in methods + * use this method to provide their own capabilities (sorting methods for + * example). + * + * Note that this namespace is aliased to `jQuery.fn.dataTableExt` for legacy + * reasons + * + * @namespace + */ + DataTable.ext = _ext = { + /** + * Buttons. For use with the Buttons extension for DataTables. This is + * defined here so other extensions can define buttons regardless of load + * order. It is _not_ used by DataTables core. + * + * @type object + * @default {} + */ + buttons: {}, + + + /** + * Element class names + * + * @type object + * @default {} + */ + classes: {}, + + + /** + * DataTables build type (expanded by the download builder) + * + * @type string + */ + builder: "dt/dt-2.1.8", + + + /** + * Error reporting. + * + * How should DataTables report an error. Can take the value 'alert', + * 'throw', 'none' or a function. + * + * @type string|function + * @default alert + */ + errMode: "alert", + + + /** + * Legacy so v1 plug-ins don't throw js errors on load + */ + feature: [], + + /** + * Feature plug-ins. + * + * This is an object of callbacks which provide the features for DataTables + * to be initialised via the `layout` option. + */ + features: {}, + + + /** + * Row searching. + * + * This method of searching is complimentary to the default type based + * searching, and a lot more comprehensive as it allows you complete control + * over the searching logic. Each element in this array is a function + * (parameters described below) that is called for every row in the table, + * and your logic decides if it should be included in the searching data set + * or not. + * + * Searching functions have the following input parameters: + * + * 1. `{object}` DataTables settings object: see + * {@link DataTable.models.oSettings} + * 2. `{array|object}` Data for the row to be processed (same as the + * original format that was passed in as the data source, or an array + * from a DOM data source + * 3. `{int}` Row index ({@link DataTable.models.oSettings.aoData}), which + * can be useful to retrieve the `TR` element if you need DOM interaction. + * + * And the following return is expected: + * + * * {boolean} Include the row in the searched result set (true) or not + * (false) + * + * Note that as with the main search ability in DataTables, technically this + * is "filtering", since it is subtractive. However, for consistency in + * naming we call it searching here. + * + * @type array + * @default [] + * + * @example + * // The following example shows custom search being applied to the + * // fourth column (i.e. the data[3] index) based on two input values + * // from the end-user, matching the data in a certain range. + * $.fn.dataTable.ext.search.push( + * function( settings, data, dataIndex ) { + * var min = document.getElementById('min').value * 1; + * var max = document.getElementById('max').value * 1; + * var version = data[3] == "-" ? 0 : data[3]*1; + * + * if ( min == "" && max == "" ) { + * return true; + * } + * else if ( min == "" && version < max ) { + * return true; + * } + * else if ( min < version && "" == max ) { + * return true; + * } + * else if ( min < version && version < max ) { + * return true; + * } + * return false; + * } + * ); + */ + search: [], + + + /** + * Selector extensions + * + * The `selector` option can be used to extend the options available for the + * selector modifier options (`selector-modifier` object data type) that + * each of the three built in selector types offer (row, column and cell + + * their plural counterparts). For example the Select extension uses this + * mechanism to provide an option to select only rows, columns and cells + * that have been marked as selected by the end user (`{selected: true}`), + * which can be used in conjunction with the existing built in selector + * options. + * + * Each property is an array to which functions can be pushed. The functions + * take three attributes: + * + * * Settings object for the host table + * * Options object (`selector-modifier` object type) + * * Array of selected item indexes + * + * The return is an array of the resulting item indexes after the custom + * selector has been applied. + * + * @type object + */ + selector: { + cell: [], + column: [], + row: [] + }, + + + /** + * Legacy configuration options. Enable and disable legacy options that + * are available in DataTables. + * + * @type object + */ + legacy: { + /** + * Enable / disable DataTables 1.9 compatible server-side processing + * requests + * + * @type boolean + * @default null + */ + ajax: null + }, + + + /** + * Pagination plug-in methods. + * + * Each entry in this object is a function and defines which buttons should + * be shown by the pagination rendering method that is used for the table: + * {@link DataTable.ext.renderer.pageButton}. The renderer addresses how the + * buttons are displayed in the document, while the functions here tell it + * what buttons to display. This is done by returning an array of button + * descriptions (what each button will do). + * + * Pagination types (the four built in options and any additional plug-in + * options defined here) can be used through the `paginationType` + * initialisation parameter. + * + * The functions defined take two parameters: + * + * 1. `{int} page` The current page index + * 2. `{int} pages` The number of pages in the table + * + * Each function is expected to return an array where each element of the + * array can be one of: + * + * * `first` - Jump to first page when activated + * * `last` - Jump to last page when activated + * * `previous` - Show previous page when activated + * * `next` - Show next page when activated + * * `{int}` - Show page of the index given + * * `{array}` - A nested array containing the above elements to add a + * containing 'DIV' element (might be useful for styling). + * + * Note that DataTables v1.9- used this object slightly differently whereby + * an object with two functions would be defined for each plug-in. That + * ability is still supported by DataTables 1.10+ to provide backwards + * compatibility, but this option of use is now decremented and no longer + * documented in DataTables 1.10+. + * + * @type object + * @default {} + * + * @example + * // Show previous, next and current page buttons only + * $.fn.dataTableExt.oPagination.current = function ( page, pages ) { + * return [ 'previous', page, 'next' ]; + * }; + */ + pager: {}, + + + renderer: { + pageButton: {}, + header: {} + }, + + + /** + * Ordering plug-ins - custom data source + * + * The extension options for ordering of data available here is complimentary + * to the default type based ordering that DataTables typically uses. It + * allows much greater control over the the data that is being used to + * order a column, but is necessarily therefore more complex. + * + * This type of ordering is useful if you want to do ordering based on data + * live from the DOM (for example the contents of an 'input' element) rather + * than just the static string that DataTables knows of. + * + * The way these plug-ins work is that you create an array of the values you + * wish to be ordering for the column in question and then return that + * array. The data in the array much be in the index order of the rows in + * the table (not the currently ordering order!). Which order data gathering + * function is run here depends on the `dt-init columns.orderDataType` + * parameter that is used for the column (if any). + * + * The functions defined take two parameters: + * + * 1. `{object}` DataTables settings object: see + * {@link DataTable.models.oSettings} + * 2. `{int}` Target column index + * + * Each function is expected to return an array: + * + * * `{array}` Data for the column to be ordering upon + * + * @type array + * + * @example + * // Ordering using `input` node values + * $.fn.dataTable.ext.order['dom-text'] = function ( settings, col ) + * { + * return this.api().column( col, {order:'index'} ).nodes().map( function ( td, i ) { + * return $('input', td).val(); + * } ); + * } + */ + order: {}, + + + /** + * Type based plug-ins. + * + * Each column in DataTables has a type assigned to it, either by automatic + * detection or by direct assignment using the `type` option for the column. + * The type of a column will effect how it is ordering and search (plug-ins + * can also make use of the column type if required). + * + * @namespace + */ + type: { + /** + * Automatic column class assignment + */ + className: {}, + + /** + * Type detection functions. + * + * The functions defined in this object are used to automatically detect + * a column's type, making initialisation of DataTables super easy, even + * when complex data is in the table. + * + * The functions defined take two parameters: + * + * 1. `{*}` Data from the column cell to be analysed + * 2. `{settings}` DataTables settings object. This can be used to + * perform context specific type detection - for example detection + * based on language settings such as using a comma for a decimal + * place. Generally speaking the options from the settings will not + * be required + * + * Each function is expected to return: + * + * * `{string|null}` Data type detected, or null if unknown (and thus + * pass it on to the other type detection functions. + * + * @type array + * + * @example + * // Currency type detection plug-in: + * $.fn.dataTable.ext.type.detect.push( + * function ( data, settings ) { + * // Check the numeric part + * if ( ! data.substring(1).match(/[0-9]/) ) { + * return null; + * } + * + * // Check prefixed by currency + * if ( data.charAt(0) == '$' || data.charAt(0) == '£' ) { + * return 'currency'; + * } + * return null; + * } + * ); + */ + detect: [], + + /** + * Automatic renderer assignment + */ + render: {}, + + + /** + * Type based search formatting. + * + * The type based searching functions can be used to pre-format the + * data to be search on. For example, it can be used to strip HTML + * tags or to de-format telephone numbers for numeric only searching. + * + * Note that is a search is not defined for a column of a given type, + * no search formatting will be performed. + * + * Pre-processing of searching data plug-ins - When you assign the sType + * for a column (or have it automatically detected for you by DataTables + * or a type detection plug-in), you will typically be using this for + * custom sorting, but it can also be used to provide custom searching + * by allowing you to pre-processing the data and returning the data in + * the format that should be searched upon. This is done by adding + * functions this object with a parameter name which matches the sType + * for that target column. This is the corollary of afnSortData + * for searching data. + * + * The functions defined take a single parameter: + * + * 1. `{*}` Data from the column cell to be prepared for searching + * + * Each function is expected to return: + * + * * `{string|null}` Formatted string that will be used for the searching. + * + * @type object + * @default {} + * + * @example + * $.fn.dataTable.ext.type.search['title-numeric'] = function ( d ) { + * return d.replace(/\n/g," ").replace( /<.*?>/g, "" ); + * } + */ + search: {}, + + + /** + * Type based ordering. + * + * The column type tells DataTables what ordering to apply to the table + * when a column is sorted upon. The order for each type that is defined, + * is defined by the functions available in this object. + * + * Each ordering option can be described by three properties added to + * this object: + * + * * `{type}-pre` - Pre-formatting function + * * `{type}-asc` - Ascending order function + * * `{type}-desc` - Descending order function + * + * All three can be used together, only `{type}-pre` or only + * `{type}-asc` and `{type}-desc` together. It is generally recommended + * that only `{type}-pre` is used, as this provides the optimal + * implementation in terms of speed, although the others are provided + * for compatibility with existing Javascript sort functions. + * + * `{type}-pre`: Functions defined take a single parameter: + * + * 1. `{*}` Data from the column cell to be prepared for ordering + * + * And return: + * + * * `{*}` Data to be sorted upon + * + * `{type}-asc` and `{type}-desc`: Functions are typical Javascript sort + * functions, taking two parameters: + * + * 1. `{*}` Data to compare to the second parameter + * 2. `{*}` Data to compare to the first parameter + * + * And returning: + * + * * `{*}` Ordering match: <0 if first parameter should be sorted lower + * than the second parameter, ===0 if the two parameters are equal and + * >0 if the first parameter should be sorted height than the second + * parameter. + * + * @type object + * @default {} + * + * @example + * // Numeric ordering of formatted numbers with a pre-formatter + * $.extend( $.fn.dataTable.ext.type.order, { + * "string-pre": function(x) { + * a = (a === "-" || a === "") ? 0 : a.replace( /[^\d\-\.]/g, "" ); + * return parseFloat( a ); + * } + * } ); + * + * @example + * // Case-sensitive string ordering, with no pre-formatting method + * $.extend( $.fn.dataTable.ext.order, { + * "string-case-asc": function(x,y) { + * return ((x < y) ? -1 : ((x > y) ? 1 : 0)); + * }, + * "string-case-desc": function(x,y) { + * return ((x < y) ? 1 : ((x > y) ? -1 : 0)); + * } + * } ); + */ + order: {} + }, + + /** + * Unique DataTables instance counter + * + * @type int + * @private + */ + _unique: 0, + + + // + // Depreciated + // The following properties are retained for backwards compatibility only. + // The should not be used in new projects and will be removed in a future + // version + // + + /** + * Version check function. + * @type function + * @depreciated Since 1.10 + */ + fnVersionCheck: DataTable.fnVersionCheck, + + + /** + * Index for what 'this' index API functions should use + * @type int + * @deprecated Since v1.10 + */ + iApiIndex: 0, + + + /** + * Software version + * @type string + * @deprecated Since v1.10 + */ + sVersion: DataTable.version + }; + + + // + // Backwards compatibility. Alias to pre 1.10 Hungarian notation counter parts + // + $.extend( _ext, { + afnFiltering: _ext.search, + aTypes: _ext.type.detect, + ofnSearch: _ext.type.search, + oSort: _ext.type.order, + afnSortData: _ext.order, + aoFeatures: _ext.feature, + oStdClasses: _ext.classes, + oPagination: _ext.pager + } ); + + + $.extend( DataTable.ext.classes, { + container: 'dt-container', + empty: { + row: 'dt-empty' + }, + info: { + container: 'dt-info' + }, + layout: { + row: 'dt-layout-row', + cell: 'dt-layout-cell', + tableRow: 'dt-layout-table', + tableCell: '', + start: 'dt-layout-start', + end: 'dt-layout-end', + full: 'dt-layout-full' + }, + length: { + container: 'dt-length', + select: 'dt-input' + }, + order: { + canAsc: 'dt-orderable-asc', + canDesc: 'dt-orderable-desc', + isAsc: 'dt-ordering-asc', + isDesc: 'dt-ordering-desc', + none: 'dt-orderable-none', + position: 'sorting_' + }, + processing: { + container: 'dt-processing' + }, + scrolling: { + body: 'dt-scroll-body', + container: 'dt-scroll', + footer: { + self: 'dt-scroll-foot', + inner: 'dt-scroll-footInner' + }, + header: { + self: 'dt-scroll-head', + inner: 'dt-scroll-headInner' + } + }, + search: { + container: 'dt-search', + input: 'dt-input' + }, + table: 'dataTable', + tbody: { + cell: '', + row: '' + }, + thead: { + cell: '', + row: '' + }, + tfoot: { + cell: '', + row: '' + }, + paging: { + active: 'current', + button: 'dt-paging-button', + container: 'dt-paging', + disabled: 'disabled', + nav: '' + } + } ); + + + /* + * It is useful to have variables which are scoped locally so only the + * DataTables functions can access them and they don't leak into global space. + * At the same time these functions are often useful over multiple files in the + * core and API, so we list, or at least document, all variables which are used + * by DataTables as private variables here. This also ensures that there is no + * clashing of variable names and that they can easily referenced for reuse. + */ + + + // Defined else where + // _selector_run + // _selector_opts + // _selector_row_indexes + + var _ext; // DataTable.ext + var _Api; // DataTable.Api + var _api_register; // DataTable.Api.register + var _api_registerPlural; // DataTable.Api.registerPlural + + var _re_dic = {}; + var _re_new_lines = /[\r\n\u2028]/g; + var _re_html = /<([^>]*>)/g; + var _max_str_len = Math.pow(2, 28); + + // This is not strict ISO8601 - Date.parse() is quite lax, although + // implementations differ between browsers. + var _re_date = /^\d{2,4}[./-]\d{1,2}[./-]\d{1,2}([T ]{1}\d{1,2}[:.]\d{2}([.:]\d{2})?)?$/; + + // Escape regular expression special characters + var _re_escape_regex = new RegExp( '(\\' + [ '/', '.', '*', '+', '?', '|', '(', ')', '[', ']', '{', '}', '\\', '$', '^', '-' ].join('|\\') + ')', 'g' ); + + // https://en.wikipedia.org/wiki/Foreign_exchange_market + // - \u20BD - Russian ruble. + // - \u20a9 - South Korean Won + // - \u20BA - Turkish Lira + // - \u20B9 - Indian Rupee + // - R - Brazil (R$) and South Africa + // - fr - Swiss Franc + // - kr - Swedish krona, Norwegian krone and Danish krone + // - \u2009 is thin space and \u202F is narrow no-break space, both used in many + // - Ƀ - Bitcoin + // - Ξ - Ethereum + // standards as thousands separators. + var _re_formatted_numeric = /['\u00A0,$£€¥%\u2009\u202F\u20BD\u20a9\u20BArfkɃΞ]/gi; + + + var _empty = function ( d ) { + return !d || d === true || d === '-' ? true : false; + }; + + + var _intVal = function ( s ) { + var integer = parseInt( s, 10 ); + return !isNaN(integer) && isFinite(s) ? integer : null; + }; + + // Convert from a formatted number with characters other than `.` as the + // decimal place, to a Javascript number + var _numToDecimal = function ( num, decimalPoint ) { + // Cache created regular expressions for speed as this function is called often + if ( ! _re_dic[ decimalPoint ] ) { + _re_dic[ decimalPoint ] = new RegExp( _fnEscapeRegex( decimalPoint ), 'g' ); + } + return typeof num === 'string' && decimalPoint !== '.' ? + num.replace( /\./g, '' ).replace( _re_dic[ decimalPoint ], '.' ) : + num; + }; + + + var _isNumber = function ( d, decimalPoint, formatted, allowEmpty ) { + var type = typeof d; + var strType = type === 'string'; + + if ( type === 'number' || type === 'bigint') { + return true; + } + + // If empty return immediately so there must be a number if it is a + // formatted string (this stops the string "k", or "kr", etc being detected + // as a formatted number for currency + if ( allowEmpty && _empty( d ) ) { + return true; + } + + if ( decimalPoint && strType ) { + d = _numToDecimal( d, decimalPoint ); + } + + if ( formatted && strType ) { + d = d.replace( _re_formatted_numeric, '' ); + } + + return !isNaN( parseFloat(d) ) && isFinite( d ); + }; + + + // A string without HTML in it can be considered to be HTML still + var _isHtml = function ( d ) { + return _empty( d ) || typeof d === 'string'; + }; + + // Is a string a number surrounded by HTML? + var _htmlNumeric = function ( d, decimalPoint, formatted, allowEmpty ) { + if ( allowEmpty && _empty( d ) ) { + return true; + } + + // input and select strings mean that this isn't just a number + if (typeof d === 'string' && d.match(/<(input|select)/i)) { + return null; + } + + var html = _isHtml( d ); + return ! html ? + null : + _isNumber( _stripHtml( d ), decimalPoint, formatted, allowEmpty ) ? + true : + null; + }; + + + var _pluck = function ( a, prop, prop2 ) { + var out = []; + var i=0, ien=a.length; + + // Could have the test in the loop for slightly smaller code, but speed + // is essential here + if ( prop2 !== undefined ) { + for ( ; i _max_str_len) { + throw new Error('Exceeded max str len'); + } + + var previous; + + input = input.replace(_re_html, ''); // Complete tags + + // Safety for incomplete script tag - use do / while to ensure that + // we get all instances + do { + previous = input; + input = input.replace(/ - +{% load static %} + + + +{% endif %} diff --git a/src/templates/admin/elements/button_filter.html b/src/templates/admin/elements/button_filter.html new file mode 100644 index 0000000000..9b22e884fb --- /dev/null +++ b/src/templates/admin/elements/button_filter.html @@ -0,0 +1,17 @@ +{% comment %} + A primary-color filter button with seive icon. +{% endcomment %} + +{% load i18n %} + + diff --git a/src/templates/admin/elements/button_no.html b/src/templates/admin/elements/button_no.html new file mode 100644 index 0000000000..99eda2b1f2 --- /dev/null +++ b/src/templates/admin/elements/button_no.html @@ -0,0 +1,21 @@ +{% comment %} + A secondary-color no button with a cross icon +{% endcomment %} + +{% load i18n %} + + diff --git a/src/templates/admin/elements/button_remove.html b/src/templates/admin/elements/button_remove.html new file mode 100644 index 0000000000..3b8459e579 --- /dev/null +++ b/src/templates/admin/elements/button_remove.html @@ -0,0 +1,18 @@ +{% comment %} + A secondary-color remove button with a minus icon. + Use this rather than button_delete.html when the user will still be able to + go find the thing somewhere and put it back here. +{% endcomment %} + +{% load i18n %} + + diff --git a/src/templates/admin/elements/button_restore.html b/src/templates/admin/elements/button_restore.html new file mode 100644 index 0000000000..c976f01ac4 --- /dev/null +++ b/src/templates/admin/elements/button_restore.html @@ -0,0 +1,22 @@ +{% comment %} + A secondary-color restore button with a backwards-turning clock face icon. + Can be made primary by passing hierarchy. +{% endcomment %} + +{% load i18n %} + + diff --git a/src/templates/admin/elements/button_save.html b/src/templates/admin/elements/button_save.html index 8e53088458..4bb4487436 100644 --- a/src/templates/admin/elements/button_save.html +++ b/src/templates/admin/elements/button_save.html @@ -1,13 +1,21 @@ {% comment %} -A generic save button with floppy disk icon + A primary-color save button with floppy disk icon. + Can be made secondary with the 'hierarchy' argument. {% endcomment %} {% load i18n %} diff --git a/src/templates/admin/elements/button_search.html b/src/templates/admin/elements/button_search.html new file mode 100644 index 0000000000..92dddecc8e --- /dev/null +++ b/src/templates/admin/elements/button_search.html @@ -0,0 +1,14 @@ +{% comment %} + A primary-color search button with a magnifying glass icon +{% endcomment %} + +{% load i18n %} + + diff --git a/src/templates/admin/elements/button_send.html b/src/templates/admin/elements/button_send.html new file mode 100644 index 0000000000..a29468a4dd --- /dev/null +++ b/src/templates/admin/elements/button_send.html @@ -0,0 +1,19 @@ +{% comment %} + A primary-color send button with an envelope icon +{% endcomment %} +{% load i18n %} + + diff --git a/src/templates/admin/elements/button_skip.html b/src/templates/admin/elements/button_skip.html new file mode 100644 index 0000000000..78e3fc6dc3 --- /dev/null +++ b/src/templates/admin/elements/button_skip.html @@ -0,0 +1,16 @@ +{% comment %} + A secondary-color skip button with a step-forward icon +{% endcomment %} + +{% load i18n %} + + diff --git a/src/templates/admin/elements/button_submit_warning.html b/src/templates/admin/elements/button_submit_warning.html deleted file mode 100644 index 70f6babe12..0000000000 --- a/src/templates/admin/elements/button_submit_warning.html +++ /dev/null @@ -1,16 +0,0 @@ -{% comment %} -A generic yellow submit button with a forward arrow icon -{% endcomment %} - -{% load i18n %} - - diff --git a/src/templates/admin/elements/button_upload.html b/src/templates/admin/elements/button_upload.html new file mode 100644 index 0000000000..149536c236 --- /dev/null +++ b/src/templates/admin/elements/button_upload.html @@ -0,0 +1,19 @@ +{% comment %} + A primary-color upload button with an upload icon +{% endcomment %} + +{% load i18n %} + + diff --git a/src/templates/admin/elements/button_upload_modal.html b/src/templates/admin/elements/button_upload_modal.html new file mode 100644 index 0000000000..e69de29bb2 diff --git a/src/templates/admin/elements/button_yes.html b/src/templates/admin/elements/button_yes.html new file mode 100644 index 0000000000..45f8339335 --- /dev/null +++ b/src/templates/admin/elements/button_yes.html @@ -0,0 +1,25 @@ +{% comment %} + A primary-color yes button with a check icon +{% endcomment %} + +{% load i18n %} + + diff --git a/src/templates/admin/elements/button_yes_delete.html b/src/templates/admin/elements/button_yes_delete.html index b2d7c2e3cd..f002f17810 100644 --- a/src/templates/admin/elements/button_yes_delete.html +++ b/src/templates/admin/elements/button_yes_delete.html @@ -1,13 +1,16 @@ {% comment %} - A generic confirm delete button with a rubbish icon + A warning-color confirm-delete button with a rubbish icon. + Use this rather than button_yes_remove.html when the thing will really be gone, + and the user cannot easily find it and put it back. {% endcomment %} {% load i18n %} diff --git a/src/templates/admin/elements/button_yes_remove.html b/src/templates/admin/elements/button_yes_remove.html index dca1f08e67..4ba0fc31f5 100644 --- a/src/templates/admin/elements/button_yes_remove.html +++ b/src/templates/admin/elements/button_yes_remove.html @@ -1,13 +1,16 @@ {% comment %} - A generic confirm remove button with a minus icon + A primary-color confirm-remove button with a minus icon + Use this rather than button_yes_delete.html when the user will still be able to + go find the thing somewhere and put it back here. {% endcomment %} {% load i18n %} diff --git a/src/templates/admin/elements/confirm_modal.html b/src/templates/admin/elements/confirm_modal.html index 7fba7a4f41..41b8c9d8b0 100644 --- a/src/templates/admin/elements/confirm_modal.html +++ b/src/templates/admin/elements/confirm_modal.html @@ -10,7 +10,7 @@

{% trans "Confirmation" %}

{{ modal.question }}

{% if modal.potential_errors %} {% for error in modal.potential_errors %} -
+

 {{ error }}

{% endfor %} @@ -18,12 +18,12 @@

{% trans "Confirmation" %}

- - + {% with name=modal.confirmed_button_name value=version.pk form_id=form_id %} + {% include "elements/button_yes.html" %} + {% endwith %} + {% with label="No, go back" data_attrs="data-close" %} + {% include "elements/button_no.html" %} + {% endwith %}
diff --git a/src/templates/admin/elements/email_form.html b/src/templates/admin/elements/email_form.html index 26c42cebd2..c673a8e3cf 100644 --- a/src/templates/admin/elements/email_form.html +++ b/src/templates/admin/elements/email_form.html @@ -6,14 +6,15 @@
- - {% if skip %} - - {% endif %} - {% if cancel_url %} -  Cancel & go back - {% endif %} + {% include "elements/button_send.html" %} + {% if skip %} + {% include "elements/button_skip.html" %} + {% endif %} + {% if cancel_url %} + {% with href=cancel_url label="Cancel and go back" %} + {% include "elements/a_cancel.html" %} + {% endwith %} + {% endif %}
- diff --git a/src/templates/admin/elements/forms/field.html b/src/templates/admin/elements/forms/field.html index 6123c09a75..3136574a76 100644 --- a/src/templates/admin/elements/forms/field.html +++ b/src/templates/admin/elements/forms/field.html @@ -10,11 +10,11 @@ {% endif %} {% if languages|length > 1 and field.name in edit_form.translatable_field_names %} - [{% trans 'translatable' %}] + [{% trans 'translatable' %}] {% endif %} {% for error in field.errors %} -
+
{{ error|escape }}
diff --git a/src/templates/admin/elements/forms/generic_error.html b/src/templates/admin/elements/forms/generic_error.html new file mode 100644 index 0000000000..510125c130 --- /dev/null +++ b/src/templates/admin/elements/forms/generic_error.html @@ -0,0 +1,3 @@ +{% if error %} + +{% endif %} diff --git a/src/templates/admin/elements/forms/group_field.html b/src/templates/admin/elements/forms/group_field.html index c76e4dfcb7..43607393ae 100644 --- a/src/templates/admin/elements/forms/group_field.html +++ b/src/templates/admin/elements/forms/group_field.html @@ -10,6 +10,8 @@

{{ field.label }}

{{ field }} {% endif %} {% for error in field.errors %} - {{ error|escape }} + + {{ error|escape }} + {% endfor %} -
\ No newline at end of file + From e8ed9eff8365889291bd815ec00510ee083535bf Mon Sep 17 00:00:00 2001 From: Joseph Muller Date: Thu, 8 Jan 2026 09:08:19 +0000 Subject: [PATCH 08/21] feat #5024 Colour system refactor - submission --- src/submission/views.py | 8 +-- .../elements/submission/edit_author.html | 2 +- .../admin/elements/submit/author.html | 4 ++ src/templates/admin/elements/submit/file.html | 10 ++-- .../submission/current_funders_table.html | 40 +++++++++++++ .../admin/submission/edit/author.html | 4 +- .../admin/submission/edit/funder.html | 2 +- .../admin/submission/edit/metadata.html | 58 ++++-------------- .../submission/manager/configurator.html | 4 +- .../submission/manager/delete_license.html | 4 +- .../admin/submission/manager/fields.html | 22 ++++--- .../admin/submission/manager/licenses.html | 25 ++++---- src/templates/admin/submission/start.html | 6 +- .../admin/submission/submit_author_order.html | 8 +-- .../admin/submission/submit_authors.html | 28 ++++----- .../submit_correspondence_author.html | 4 +- .../admin/submission/submit_credit_roles.html | 6 +- .../admin/submission/submit_files.html | 35 +++++++---- .../admin/submission/submit_funding.html | 60 ++++--------------- .../admin/submission/submit_info.html | 11 ++-- .../admin/submission/submit_review.html | 14 +++-- 21 files changed, 178 insertions(+), 177 deletions(-) create mode 100644 src/templates/admin/submission/current_funders_table.html diff --git a/src/submission/views.py b/src/submission/views.py index 59325ba23b..dfe710a2b4 100755 --- a/src/submission/views.py +++ b/src/submission/views.py @@ -433,8 +433,8 @@ def edit_funder(request, article_id, funder_id): ) # The incoming link _should_ have a return value set to ensure # the user gets back to the right place. - if request.GET.get("return"): - return redirect(request.GET["return"]) + if request.GET.get("next"): + return redirect(request.GET["next"]) # If no return value is set we should try to work out where the # user should be sent to. @@ -486,8 +486,8 @@ def delete_funder(request, article_id, funder_id): article_funding.delete() - if request.GET.get("return"): - return redirect(request.GET["return"]) + if request.GET.get("next"): + return redirect(request.GET["next"]) return redirect(reverse("submit_funding", kwargs={"article_id": article_id})) diff --git a/src/templates/admin/elements/submission/edit_author.html b/src/templates/admin/elements/submission/edit_author.html index 687917fbf5..ddf8c47d3b 100644 --- a/src/templates/admin/elements/submission/edit_author.html +++ b/src/templates/admin/elements/submission/edit_author.html @@ -17,7 +17,7 @@

 {% if frozen_author %}Edit {{ frozen_author. {{ frozen_author.author.pk }} - {{ frozen_author.author.full_name }}. If you wish to change the ORCID or email address associated with this record we recommend doing so at the account level using the link.{% endif %}

{% endif %} - {% include "elements/forms/errors.html" with form=author_form %} + {% include "admin/elements/forms/errors.html" with form=author_form %}
{% if frozen_author.author and not frozen_author.author == article.correspondence_author %}
diff --git a/src/templates/admin/elements/submit/author.html b/src/templates/admin/elements/submit/author.html index 3d595944a7..b324c950bc 100644 --- a/src/templates/admin/elements/submit/author.html +++ b/src/templates/admin/elements/submit/author.html @@ -1,3 +1,7 @@ +{% comment %} + This template is deprecated. Authors are now edited using admin/submission/edit/author.html. +{% endcomment %} + {% load foundation %} {% load i18n %} diff --git a/src/templates/admin/elements/submit/file.html b/src/templates/admin/elements/submit/file.html index c133ae06c0..943f909aef 100644 --- a/src/templates/admin/elements/submit/file.html +++ b/src/templates/admin/elements/submit/file.html @@ -26,12 +26,10 @@
{{ form|foundation }} - + {% trans 'Add File' as add_file %} + {% with label=add_file name=modaltype %} + {% include "elements/button_yes.html" %} + {% endwith %} @@ -180,7 +180,7 @@

{% trans "User profile" %}

{% endif %} {% else %}

{% blocktrans with journal_title=journal.name %} - This author has not registerd for a user account with {{ journal_title }}. + This author has not registered for a user account with {{ journal_title }}. {% endblocktrans %}

{% endif %} diff --git a/src/templates/admin/submission/edit/funder.html b/src/templates/admin/submission/edit/funder.html index 033dc36047..8a570b0386 100644 --- a/src/templates/admin/submission/edit/funder.html +++ b/src/templates/admin/submission/edit/funder.html @@ -22,7 +22,7 @@

Edit Funder Entry #{{ funder.pk }}

{{ form|foundation }}
- + {% include "elements/button_save.html" %}
diff --git a/src/templates/admin/submission/edit/metadata.html b/src/templates/admin/submission/edit/metadata.html index 9c8e1e2105..6e1bd982e4 100644 --- a/src/templates/admin/submission/edit/metadata.html +++ b/src/templates/admin/submission/edit/metadata.html @@ -26,7 +26,7 @@

Edit Metadata

{% include "elements/translations/form_tabs.html" with object=article %} - {% include "elements/forms/errors.html" with form=info_form %} + {% include "admin/elements/forms/errors.html" with form=info_form %} {% csrf_token %}
@@ -120,7 +120,9 @@

Edit Metadata

{% include "admin/elements/submission/additional_fields.html" with form=info_form additional_fields=additional_fields %}
- + {% with name="metadata" label="Save Metadata" %} + {% include "elements/button_save.html" %} + {% endwith %}
@@ -146,20 +148,20 @@

Funding

onkeypress="javascript:onFunderTextEnterPress(event);" />
-
+
+
-
-
+
@@ -174,45 +176,7 @@

Funding

Current Funders

-
-
- - - - - - - - - - - - - {% for funder in article.funders.all %} - - - - - - - - - {% empty %} - - - - {% endfor %} -
NameFundRef IDGrant Number{% trans "Funding Statement" %}EditDelete
{{ funder.name|default_if_none:"" }}{{ funder.fundref_id|default_if_none:"" }}{{ funder.funding_id|default_if_none:"" }}{{ funder.funding_statement|safe }} - - Edit - - - - Delete - -
No funders added.
-
-
+ {% include "submission/current_funders_table.html" %}
@@ -223,7 +187,7 @@
Add funder
{% csrf_token %} {{ funder_form|foundation }} - + {% include "elements/button_save.html" with name="add_funder" %}
diff --git a/src/templates/admin/submission/manager/configurator.html b/src/templates/admin/submission/manager/configurator.html index 6a1b502d31..89477845fb 100644 --- a/src/templates/admin/submission/manager/configurator.html +++ b/src/templates/admin/submission/manager/configurator.html @@ -21,10 +21,10 @@ can be configured when the fields are not being used.

{% include "elements/translations/form_tabs.html" with object=configuration %} - {% include "elements/forms/errors.html" %} + {% include "admin/elements/forms/errors.html" %} {% csrf_token %} {{ form|foundation }} - + {% include "elements/button_save.html" %}
diff --git a/src/templates/admin/submission/manager/delete_license.html b/src/templates/admin/submission/manager/delete_license.html index 75957304e6..cf1c9a5de3 100644 --- a/src/templates/admin/submission/manager/delete_license.html +++ b/src/templates/admin/submission/manager/delete_license.html @@ -40,7 +40,9 @@

Confirm Deletion

{% csrf_token %} - + {% with label="Delete License" %} + {% include "elements/button_delete.html" %} + {% endwith %}
diff --git a/src/templates/admin/submission/manager/fields.html b/src/templates/admin/submission/manager/fields.html index 62221aa0ec..ece77b801e 100644 --- a/src/templates/admin/submission/manager/fields.html +++ b/src/templates/admin/submission/manager/fields.html @@ -30,15 +30,21 @@

Current Fields

{% csrf_token %} {% for field in fields %}
  • +
    +
      {{ field.name }} -
    - -
    -
    +
    + {% url 'submission_fields_id' field.pk as edit_href %} + {% with href=edit_href size="small" %} + {% include "elements/a_edit.html" %} + {% endwith %} + {% with name="delete" value=field.pk size="small" %} + {% include "elements/button_delete.html" %} + {% endwith %} +
    +
  • {% endfor %} @@ -54,11 +60,11 @@

    Add New Field

    {% endif %}
    - {% include "elements/forms/errors.html" with form=form %} + {% include "admin/elements/forms/errors.html" with form=form %}
    {% csrf_token %} {{ form|foundation }} - + {% include "elements/button_save.html" %}
    diff --git a/src/templates/admin/submission/manager/licenses.html b/src/templates/admin/submission/manager/licenses.html index e826ce0a12..6d286c191f 100644 --- a/src/templates/admin/submission/manager/licenses.html +++ b/src/templates/admin/submission/manager/licenses.html @@ -30,17 +30,22 @@

    Current Licences

    {% csrf_token %} {% for license in licenses %}
  • +
    +
      {{ license.name }} -
    - - {% if request.user.is_staff %} - - {% endif %}
    -
    +
    + {% url 'submission_licenses_id' license.pk as edit_href %} + {% with size="small" href=edit_href %} + {% include "elements/a_edit.html" %} + {% endwith %} + {% url 'submission_delete_license' license.pk as delete_href %} + {% with size="small" href=delete_href %} + {% include "elements/a_delete.html" %} + {% endwith %} +
    +
  • {% endfor %} @@ -56,11 +61,11 @@

    Add New License

    {% endif %}
    - {% include "elements/forms/errors.html" with form=form %} + {% include "admin/elements/forms/errors.html" with form=form %}
    {% csrf_token %} {{ form|foundation }} - + {% include "elements/button_save.html" %}
    diff --git a/src/templates/admin/submission/start.html b/src/templates/admin/submission/start.html index 4b7978574e..231b38d349 100644 --- a/src/templates/admin/submission/start.html +++ b/src/templates/admin/submission/start.html @@ -74,8 +74,10 @@

    {% trans "Competing Interests" %}

    {{ form.competing_interests|foundation }} {% endif %} - + {% trans "Start Submission" as start_label %} + {% with name="start_submission" label=start_label %} + {% include "elements/button_complete.html" %} + {% endwith %}
    diff --git a/src/templates/admin/submission/submit_author_order.html b/src/templates/admin/submission/submit_author_order.html index 75192ed563..47cba64845 100644 --- a/src/templates/admin/submission/submit_author_order.html +++ b/src/templates/admin/submission/submit_author_order.html @@ -6,7 +6,7 @@
    + {% with name="search_authors" label="Add Self as Author" %} + {% include "elements/button_add.html" %} + {% endwith %}
    @@ -73,10 +72,10 @@

    {% trans "Add more authors" %}

    placeholder="e.g. 0000-0001-2345-6789" type="search">
    - + {% trans "Add author from search" as add_search_label %} + {% with name="search_authors" label=add_search_label %} + {% include "elements/button_search.html" %} + {% endwith %}
    @@ -108,7 +107,7 @@

    {% trans "Add more authors" %}

    @@ -132,13 +131,10 @@

    {% trans "Proceed to next step" %}

    {% csrf_token %} - + {% trans "Save and continue" as continue_label %} + {% with name="save_continue" label=continue_label %} + {% include "elements/button_complete.html" %} + {% endwith %}
    diff --git a/src/templates/admin/submission/submit_correspondence_author.html b/src/templates/admin/submission/submit_correspondence_author.html index 6045b69325..7f2d409224 100644 --- a/src/templates/admin/submission/submit_correspondence_author.html +++ b/src/templates/admin/submission/submit_correspondence_author.html @@ -6,7 +6,7 @@
    + class="give-me-options box">
    @@ -19,7 +19,7 @@
    +
    + {% trans "Save and Continue" as continue_label %} + {% with name="next_step" label=continue_label %} + {% include "elements/button_complete.html" %} + {% endwith %} +
    @@ -118,8 +85,7 @@
    {% trans 'Add funder' %}
    {% csrf_token %} {{ funder_form|foundation }} - + {% include "elements/button_save.html" with name="add_funder" %} diff --git a/src/templates/admin/submission/submit_info.html b/src/templates/admin/submission/submit_info.html index 9e2f2a057d..0a09a38cca 100644 --- a/src/templates/admin/submission/submit_info.html +++ b/src/templates/admin/submission/submit_info.html @@ -59,7 +59,7 @@

    {% trans 'Basic Information' %}

    {% if request.journal.submissionconfiguration.license %} -
    +
    {{ form.license|foundation }}

    {% trans 'View license information' %}

    @@ -85,9 +85,12 @@

    {% trans 'Basic Information' %}

    {% include "admin/elements/submission/additional_fields.html" with form=form additional_fields=additional_fields %}
    - +
    + {% trans "Save and Continue" as continue_label %} + {% with name="next_step" label=continue_label %} + {% include "elements/button_complete.html" %} + {% endwith %} +
    diff --git a/src/templates/admin/submission/submit_review.html b/src/templates/admin/submission/submit_review.html index f8033ad0c1..c9146d786d 100644 --- a/src/templates/admin/submission/submit_review.html +++ b/src/templates/admin/submission/submit_review.html @@ -26,15 +26,15 @@

    {% trans 'Agreements' %}

    {% if request.journal.submissionconfiguration.publication_fees %} - {% trans "Agreed to Publication Fees statement" %} .
    + {% trans "Agreed to Publication Fees statement" %} .
    {% endif %} {% if request.journal.submissionconfiguration.submission_check %} - {% trans "Agreed to Submission Checklist" %} .
    + {% trans "Agreed to Submission Checklist" %} .
    {% endif %} {% if request.journal.submissionconfiguration.copyright_notice %} - {% trans "Agreed to Copyright statement" %}.
    + {% trans "Agreed to Copyright statement" %}.
    {% endif %}

    @@ -142,8 +142,12 @@

    {% trans "Comments to the Editor" %}

    {% endif %}
    - +
    + {% trans "Complete Submission" as complete_label %} + {% with name="next_step" label=complete_label %} + {% include "elements/button_complete.html" %} + {% endwith %} +
    From 3685d5fdee25a345d731458ebfdfe162a16e567e Mon Sep 17 00:00:00 2001 From: Joseph Muller Date: Thu, 8 Jan 2026 09:18:45 +0000 Subject: [PATCH 09/21] feat #5024 Colour system refactor - review --- src/review/models.py | 5 -- src/templates/admin/elements/review/card.html | 14 ++- .../elements/review/draft_decisions_js.html | 2 +- .../admin/elements/review/dropdown.html | 19 ++-- .../admin/elements/review/element_form.html | 8 +- .../admin/elements/review/review_block.html | 4 +- .../admin/elements/review/reviews_small.html | 6 +- src/templates/admin/review/add_files.html | 15 ++-- .../admin/review/add_review_assignment.html | 17 ++-- .../admin/review/decision_helper.html | 88 +++++++++++-------- src/templates/admin/review/delete_review.html | 10 ++- .../admin/review/delete_review_round.html | 10 ++- .../admin/review/draft_decision.html | 47 ++++++---- src/templates/admin/review/edit_review.html | 10 ++- .../admin/review/edit_review_answer.html | 2 +- src/templates/admin/review/in_review.html | 35 ++++---- .../review/manager/edit_review_form.html | 22 +++-- .../admin/review/manager/review_forms.html | 27 ++++-- .../admin/review/projected_issue.html | 2 +- src/templates/admin/review/rate_reviewer.html | 4 +- src/templates/admin/review/reset.html | 10 ++- .../admin/review/review_decline.html | 18 ++-- src/templates/admin/review/review_form.html | 28 +++--- .../admin/review/review_warning.html | 6 +- .../admin/review/revision/do_revision.html | 18 ++-- .../revision/edit_revision_request.html | 13 ++- .../admin/review/revision/replace_file.html | 6 +- .../review/revision/request_revisions.html | 11 ++- .../request_revisions_notification.html | 9 +- .../admin/review/revision/upload_file.html | 14 ++- .../admin/review/send_review_reminder.html | 4 +- src/templates/admin/review/share/editor.html | 18 ++-- .../admin/review/suggest_reviewers.html | 10 ++- .../review/upload_reviewers_from_csv.html | 6 +- 34 files changed, 306 insertions(+), 212 deletions(-) diff --git a/src/review/models.py b/src/review/models.py index bb38cede92..e7530dc18c 100755 --- a/src/review/models.py +++ b/src/review/models.py @@ -346,7 +346,6 @@ def status(self): return { "code": "withdrawn", "display": "Withdrawn", - "span_class": "red", "date": "", "reminder": None, } @@ -354,7 +353,6 @@ def status(self): return { "code": "complete", "display": "Complete", - "span_class": "light-green", "date": shared.day_month(self.date_complete), "reminder": None, } @@ -362,7 +360,6 @@ def status(self): return { "code": "accept", "display": "Yes", - "span_class": "green", "date": shared.day_month(self.date_accepted), "reminder": "accepted", } @@ -370,7 +367,6 @@ def status(self): return { "code": "declined", "display": "No", - "span_class": "red", "date": shared.day_month(self.date_declined), "reminder": None, } @@ -378,7 +374,6 @@ def status(self): return { "code": "wait", "display": "Wait", - "span_class": "amber", "date": "", "reminder": "request", } diff --git a/src/templates/admin/elements/review/card.html b/src/templates/admin/elements/review/card.html index 3ece3bde11..be69716896 100644 --- a/src/templates/admin/elements/review/card.html +++ b/src/templates/admin/elements/review/card.html @@ -11,9 +11,15 @@

    {{ request.article.safe_title }}

    {% endif %}
    {% if type == "new" %} - - Accept Task - Decline Task + + + Accept Task + + + Decline Task + {% elif type == 'active' %} View Task {% endif %} @@ -29,4 +35,4 @@

    {{ request.article.safe_title }}

    - \ No newline at end of file + diff --git a/src/templates/admin/elements/review/draft_decisions_js.html b/src/templates/admin/elements/review/draft_decisions_js.html index 9bed6199aa..8f2a408439 100644 --- a/src/templates/admin/elements/review/draft_decisions_js.html +++ b/src/templates/admin/elements/review/draft_decisions_js.html @@ -13,7 +13,7 @@

    {% trans "Confirmation" %}

    -
    +

     The 'Draft Email to Author' field needs to be reloaded to match the chosen decision. This will overwrite any edits made to that field. OK?

    diff --git a/src/templates/admin/elements/review/dropdown.html b/src/templates/admin/elements/review/dropdown.html index a1a6ca8fc9..2d4b37cab5 100644 --- a/src/templates/admin/elements/review/dropdown.html +++ b/src/templates/admin/elements/review/dropdown.html @@ -1,8 +1,17 @@
    - {% if not small %}View{% endif %} - {% if small %}{% endif %} + {% if small %} + + + + {% else %} + {% url 'review_view_review' article.pk review.pk as item_href %} + {% include "elements/a_menu_item.html" with href=item_href label="View" %} + + + {% endif %}
    \ No newline at end of file +
    diff --git a/src/templates/admin/elements/review/element_form.html b/src/templates/admin/elements/review/element_form.html index bd77782ee0..dac034f28d 100644 --- a/src/templates/admin/elements/review/element_form.html +++ b/src/templates/admin/elements/review/element_form.html @@ -7,15 +7,17 @@

    {% if modal %} Edit Element{% else %} Add New Element{% endif %}

    - {% include "elements/forms/errors.html" with form=element_form %} + {% include "admin/elements/forms/errors.html" with form=element_form %}
    {% csrf_token %} {{ element_form|foundation }} - + {% with name="element" %} + {% include "elements/button_save.html" %} + {% endwith %}
    - \ No newline at end of file + diff --git a/src/templates/admin/elements/review/review_block.html b/src/templates/admin/elements/review/review_block.html index 6aff9e6122..4512f3799c 100644 --- a/src/templates/admin/elements/review/review_block.html +++ b/src/templates/admin/elements/review/review_block.html @@ -46,9 +46,9 @@

    #{{ review.pk }} - {{ review.reviewer.full_name }} {% if journal_settings.general.open_peer_review %} {% if review.permission_to_make_public %} -