From d4af8947de6cf14c32074627382f0d2cf434dba2 Mon Sep 17 00:00:00 2001 From: HB9HIL Date: Wed, 15 Nov 2023 16:37:09 +0100 Subject: [PATCH] new datatable libaries --- assets/css/buttons.dataTables.min.css | 685 ++++++----- assets/css/datatables.min.css | 1553 +++++++++++++++++++++---- assets/js/dataTables.buttons.min.js | 48 +- assets/js/datatables.min.js | 592 +++------- 4 files changed, 1934 insertions(+), 944 deletions(-) diff --git a/assets/css/buttons.dataTables.min.css b/assets/css/buttons.dataTables.min.css index 4bd532ae..da926ab6 100644 --- a/assets/css/buttons.dataTables.min.css +++ b/assets/css/buttons.dataTables.min.css @@ -27,6 +27,16 @@ transform: rotate(360deg); } } +div.dataTables_wrapper { + position: relative; +} +div.dt-buttons { + position: initial; +} +div.dt-buttons .dt-button { + overflow: hidden; + text-overflow: ellipsis; +} div.dt-button-info { position: fixed; top: 50%; @@ -35,223 +45,121 @@ div.dt-button-info { margin-top: -100px; margin-left: -200px; background-color: white; - border: 2px solid #111; - box-shadow: 3px 3px 8px rgba(0, 0, 0, 0.3); - border-radius: 3px; + border-radius: 0.75em; + box-shadow: 3px 4px 10px 1px rgba(0, 0, 0, 0.8); text-align: center; - z-index: 21; + z-index: 2003; + overflow: hidden; } div.dt-button-info h2 { - padding: 0.5em; + padding: 2rem 2rem 1rem 2rem; margin: 0; font-weight: normal; - border-bottom: 1px solid #ddd; - background-color: #f3f3f3; } div.dt-button-info > div { - padding: 1em; + padding: 1em 2em 2em 2em; +} +div.dtb-popover-close { + position: absolute; + top: 6px; + right: 6px; + width: 22px; + height: 22px; + text-align: center; + border-radius: 3px; + cursor: pointer; + z-index: 2003; +} +button.dtb-hide-drop { + display: none !important; } div.dt-button-collection-title { text-align: center; padding: 0.3em 0 0.5em; + margin-left: 0.5em; + margin-right: 0.5em; font-size: 0.9em; } div.dt-button-collection-title:empty { display: none; } -button.dt-button, -div.dt-button, -a.dt-button, -input.dt-button { - position: relative; +span.dt-button-spacer { display: inline-block; - box-sizing: border-box; - margin-right: 0.333em; - margin-bottom: 0.333em; - padding: 0.5em 1em; - border: 1px solid rgba(0, 0, 0, 0.3); - border-radius: 2px; - cursor: pointer; - font-size: 0.88em; - line-height: 1.6em; - color: black; + margin: 0.5em; white-space: nowrap; - overflow: hidden; - background-color: rgba(0, 0, 0, 0.1); - background: -webkit-linear-gradient( - top, - rgba(230, 230, 230, 0.1) 0%, - rgba(0, 0, 0, 0.1) 100% - ); - background: -moz-linear-gradient( - top, - rgba(230, 230, 230, 0.1) 0%, - rgba(0, 0, 0, 0.1) 100% - ); - background: -ms-linear-gradient( - top, - rgba(230, 230, 230, 0.1) 0%, - rgba(0, 0, 0, 0.1) 100% - ); - background: -o-linear-gradient( - top, - rgba(230, 230, 230, 0.1) 0%, - rgba(0, 0, 0, 0.1) 100% - ); - background: linear-gradient( - to bottom, - rgba(230, 230, 230, 0.1) 0%, - rgba(0, 0, 0, 0.1) 100% - ); - filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr='rgba(230, 230, 230, 0.1)', EndColorStr='rgba(0, 0, 0, 0.1)'); - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - text-decoration: none; - outline: none; - text-overflow: ellipsis; } -button.dt-button.disabled, -div.dt-button.disabled, -a.dt-button.disabled, -input.dt-button.disabled { - cursor: default; - opacity: 0.4; +span.dt-button-spacer.bar { + border-left: 1px solid rgba(0, 0, 0, 0.3); + vertical-align: middle; + padding-left: 0.5em; } -button.dt-button:active:not(.disabled), -button.dt-button.active:not(.disabled), -div.dt-button:active:not(.disabled), -div.dt-button.active:not(.disabled), -a.dt-button:active:not(.disabled), -a.dt-button.active:not(.disabled), -input.dt-button:active:not(.disabled), -input.dt-button.active:not(.disabled) { - background-color: rgba(0, 0, 0, 0.1); - background: -webkit-linear-gradient( - top, - rgba(179, 179, 179, 0.1) 0%, - rgba(0, 0, 0, 0.1) 100% - ); - background: -moz-linear-gradient( - top, - rgba(179, 179, 179, 0.1) 0%, - rgba(0, 0, 0, 0.1) 100% - ); - background: -ms-linear-gradient( - top, - rgba(179, 179, 179, 0.1) 0%, - rgba(0, 0, 0, 0.1) 100% - ); - background: -o-linear-gradient( - top, - rgba(179, 179, 179, 0.1) 0%, - rgba(0, 0, 0, 0.1) 100% - ); - background: linear-gradient( - to bottom, - rgba(179, 179, 179, 0.1) 0%, - rgba(0, 0, 0, 0.1) 100% - ); - filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr='rgba(179, 179, 179, 0.1)', EndColorStr='rgba(0, 0, 0, 0.1)'); - box-shadow: inset 1px 1px 3px #999999; +span.dt-button-spacer.bar:empty { + height: 1em; + width: 1px; + padding-left: 0; } -button.dt-button:active:not(.disabled):hover:not(.disabled), -button.dt-button.active:not(.disabled):hover:not(.disabled), -div.dt-button:active:not(.disabled):hover:not(.disabled), -div.dt-button.active:not(.disabled):hover:not(.disabled), -a.dt-button:active:not(.disabled):hover:not(.disabled), -a.dt-button.active:not(.disabled):hover:not(.disabled), -input.dt-button:active:not(.disabled):hover:not(.disabled), -input.dt-button.active:not(.disabled):hover:not(.disabled) { - box-shadow: inset 1px 1px 3px #999999; - background-color: rgba(0, 0, 0, 0.1); - background: -webkit-linear-gradient( - top, - rgba(128, 128, 128, 0.1) 0%, - rgba(0, 0, 0, 0.1) 100% - ); - background: -moz-linear-gradient( - top, - rgba(128, 128, 128, 0.1) 0%, - rgba(0, 0, 0, 0.1) 100% - ); - background: -ms-linear-gradient( - top, - rgba(128, 128, 128, 0.1) 0%, - rgba(0, 0, 0, 0.1) 100% - ); - background: -o-linear-gradient( - top, - rgba(128, 128, 128, 0.1) 0%, - rgba(0, 0, 0, 0.1) 100% - ); - background: linear-gradient( - to bottom, - rgba(128, 128, 128, 0.1) 0%, - rgba(0, 0, 0, 0.1) 100% - ); - filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr='rgba(128, 128, 128, 0.1)', EndColorStr='rgba(0, 0, 0, 0.1)'); +div.dt-button-collection .dt-button-active { + padding-right: 3em; } -button.dt-button:hover, -div.dt-button:hover, -a.dt-button:hover, -input.dt-button:hover { - text-decoration: none; +div.dt-button-collection .dt-button-active:after { + position: absolute; + top: 50%; + margin-top: -10px; + right: 1em; + display: inline-block; + content: "✓"; + color: inherit; } -button.dt-button:hover:not(.disabled), -div.dt-button:hover:not(.disabled), -a.dt-button:hover:not(.disabled), -input.dt-button:hover:not(.disabled) { - border: 1px solid #666; - background-color: rgba(0, 0, 0, 0.1); - background: -webkit-linear-gradient( - top, - rgba(153, 153, 153, 0.1) 0%, - rgba(0, 0, 0, 0.1) 100% - ); - background: -moz-linear-gradient( - top, - rgba(153, 153, 153, 0.1) 0%, - rgba(0, 0, 0, 0.1) 100% - ); - background: -ms-linear-gradient( - top, - rgba(153, 153, 153, 0.1) 0%, - rgba(0, 0, 0, 0.1) 100% - ); - background: -o-linear-gradient( - top, - rgba(153, 153, 153, 0.1) 0%, - rgba(0, 0, 0, 0.1) 100% - ); - background: linear-gradient( - to bottom, - rgba(153, 153, 153, 0.1) 0%, - rgba(0, 0, 0, 0.1) 100% - ); - filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr='rgba(153, 153, 153, 0.1)', EndColorStr='rgba(0, 0, 0, 0.1)'); +div.dt-button-collection .dt-button-active.dt-button-split { + padding-right: 0; } -button.dt-button:focus:not(.disabled), -div.dt-button:focus:not(.disabled), -a.dt-button:focus:not(.disabled), -input.dt-button:focus:not(.disabled) { - border: 1px solid #426c9e; - text-shadow: 0 1px 0 #c4def1; - outline: none; - background-color: #79ace9; - background: -webkit-linear-gradient(top, #d1e2f7 0%, #79ace9 100%); - background: -moz-linear-gradient(top, #d1e2f7 0%, #79ace9 100%); - background: -ms-linear-gradient(top, #d1e2f7 0%, #79ace9 100%); - background: -o-linear-gradient(top, #d1e2f7 0%, #79ace9 100%); - background: linear-gradient(to bottom, #d1e2f7 0%, #79ace9 100%); - filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr='#d1e2f7', EndColorStr='#79ace9'); +div.dt-button-collection .dt-button-active.dt-button-split:after { + display: none; } -.dt-button embed { - outline: none; +div.dt-button-collection .dt-button-active.dt-button-split > *:first-child { + padding-right: 3em; +} +div.dt-button-collection + .dt-button-active.dt-button-split + > *:first-child:after { + position: absolute; + top: 50%; + margin-top: -10px; + right: 1em; + display: inline-block; + content: "✓"; + color: inherit; +} +div.dt-button-collection .dt-button-active-a a { + padding-right: 3em; +} +div.dt-button-collection .dt-button-active-a a:after { + position: absolute; + right: 1em; + display: inline-block; + content: "✓"; + color: inherit; +} +div.dt-button-collection span.dt-button-spacer { + width: 100%; + font-size: 0.9em; + text-align: center; + margin: 0.5em 0; +} +div.dt-button-collection span.dt-button-spacer:empty { + height: 0; + width: 100%; +} +div.dt-button-collection span.dt-button-spacer.bar { + border-left: none; + border-bottom: 1px solid rgba(0, 0, 0, 0.1); + padding-left: 0; +} +html.dark div.dt-button-info { + background-color: var(--dt-html-background); + border: 1px solid rgba(255, 255, 255, 0.15); } div.dt-buttons { - position: relative; float: left; } div.dt-buttons.buttons-right { @@ -263,55 +171,213 @@ div.dataTables_layout_cell div.dt-buttons { div.dataTables_layout_cell div.dt-buttons.buttons-right { float: none; } +div.dt-buttons > .dt-button, +div.dt-buttons > div.dt-button-split .dt-button { + position: relative; + display: inline-block; + box-sizing: border-box; + margin-left: 0.167em; + margin-right: 0.167em; + margin-bottom: 0.333em; + padding: 0.5em 1em; + border: 1px solid rgba(0, 0, 0, 0.3); + border-radius: 2px; + cursor: pointer; + font-size: 0.88em; + line-height: 1.6em; + color: inherit; + white-space: nowrap; + overflow: hidden; + background-color: rgba(0, 0, 0, 0.1); + background: linear-gradient( + to bottom, + rgba(230, 230, 230, 0.1) 0%, + rgba(0, 0, 0, 0.1) 100% + ); + filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr="rgba(230, 230, 230, 0.1)", EndColorStr="rgba(0, 0, 0, 0.1)"); + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + text-decoration: none; + outline: none; + text-overflow: ellipsis; +} +div.dt-buttons > .dt-button:first-child, +div.dt-buttons > div.dt-button-split .dt-button:first-child { + margin-left: 0; +} +div.dt-buttons > .dt-button.disabled, +div.dt-buttons > div.dt-button-split .dt-button.disabled { + cursor: default; + opacity: 0.4; +} +div.dt-buttons > .dt-button.dt-button-active:not(.disabled), +div.dt-buttons + > div.dt-button-split + .dt-button.dt-button-active:not(.disabled) { + background-color: rgba(0, 0, 0, 0.1); + background: linear-gradient( + to bottom, + rgba(179, 179, 179, 0.1) 0%, + rgba(0, 0, 0, 0.1) 100% + ); + filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr="rgba(179, 179, 179, 0.1)", EndColorStr="rgba(0, 0, 0, 0.1)"); + box-shadow: inset 1px 1px 3px #999; +} +div.dt-buttons + > .dt-button.dt-button-active:not(.disabled):hover:not(.disabled), +div.dt-buttons + > div.dt-button-split + .dt-button.dt-button-active:not(.disabled):hover:not(.disabled) { + box-shadow: inset 1px 1px 3px #999; + background-color: rgba(0, 0, 0, 0.1); + background: linear-gradient( + to bottom, + rgba(128, 128, 128, 0.1) 0%, + rgba(0, 0, 0, 0.1) 100% + ); + filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr="rgba(128, 128, 128, 0.1)", EndColorStr="rgba(0, 0, 0, 0.1)"); +} +div.dt-buttons > .dt-button:hover, +div.dt-buttons > div.dt-button-split .dt-button:hover { + text-decoration: none; +} +div.dt-buttons > .dt-button:hover:not(.disabled), +div.dt-buttons > div.dt-button-split .dt-button:hover:not(.disabled) { + border: 1px solid #666; + background-color: rgba(0, 0, 0, 0.1); + background: linear-gradient( + to bottom, + rgba(153, 153, 153, 0.1) 0%, + rgba(0, 0, 0, 0.1) 100% + ); + filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr="rgba(153, 153, 153, 0.1)", EndColorStr="rgba(0, 0, 0, 0.1)"); +} +div.dt-buttons > .dt-button:focus:not(.disabled), +div.dt-buttons > div.dt-button-split .dt-button:focus:not(.disabled) { + outline: 2px solid rgb(53, 132, 228); +} +div.dt-buttons > .dt-button embed, +div.dt-buttons > div.dt-button-split .dt-button embed { + outline: none; +} +div.dt-buttons > div.dt-button-split .dt-button:first-child { + border-right: 1px solid rgba(0, 0, 0, 0.15); + border-top-right-radius: 0; + border-bottom-right-radius: 0; +} +div.dt-buttons > div.dt-button-split .dt-button:first-child:hover { + border-right: 1px solid #666; +} +div.dt-buttons > div.dt-button-split .dt-button:last-child { + border-left: 1px solid transparent; + border-top-left-radius: 0; + border-bottom-left-radius: 0; +} +div.dt-buttons > div.dt-button-split .dt-button:last-child:hover { + border-left: 1px solid #666; +} +div.dt-buttons span.dt-button-down-arrow { + position: relative; + top: -2px; + font-size: 10px; + padding-left: 10px; + line-height: 1em; + opacity: 0.6; +} +div.dt-buttons div.dt-button-split { + display: inline-block; +} +div.dt-buttons div.dt-button-split .dt-button:first-child { + margin-right: 0; +} +div.dt-buttons div.dt-button-split .dt-button:last-child { + margin-left: -1px; + padding-left: 0.75em; + padding-right: 0.75em; + z-index: 2; +} +div.dt-buttons div.dt-button-split .dt-button:last-child span { + padding-left: 0; +} div.dt-button-collection { position: absolute; top: 0; left: 0; - width: 150px; + width: 200px; margin-top: 3px; - padding: 8px 8px 4px 8px; - border: 1px solid #ccc; + margin-bottom: 3px; + padding: 0.75em 0; border: 1px solid rgba(0, 0, 0, 0.4); background-color: white; overflow: hidden; z-index: 2002; border-radius: 5px; - box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.3); + box-shadow: 3px 4px 10px 1px rgba(0, 0, 0, 0.3); box-sizing: border-box; } -div.dt-button-collection button.dt-button, -div.dt-button-collection div.dt-button, -div.dt-button-collection a.dt-button { +div.dt-button-collection .dt-button { position: relative; left: 0; right: 0; width: 100%; display: block; float: none; - margin-bottom: 4px; - margin-right: 0; + background: none; + margin: 0; + padding: 0.5em 1em; + border: none; + text-align: left; + cursor: pointer; + color: inherit; } -div.dt-button-collection button.dt-button:active:not(.disabled), -div.dt-button-collection button.dt-button.active:not(.disabled), -div.dt-button-collection div.dt-button:active:not(.disabled), -div.dt-button-collection div.dt-button.active:not(.disabled), -div.dt-button-collection a.dt-button:active:not(.disabled), -div.dt-button-collection a.dt-button.active:not(.disabled) { - background-color: #dadada; - background: -webkit-linear-gradient(top, #f0f0f0 0%, #dadada 100%); - background: -moz-linear-gradient(top, #f0f0f0 0%, #dadada 100%); - background: -ms-linear-gradient(top, #f0f0f0 0%, #dadada 100%); - background: -o-linear-gradient(top, #f0f0f0 0%, #dadada 100%); - background: linear-gradient(to bottom, #f0f0f0 0%, #dadada 100%); - filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr='#f0f0f0', EndColorStr='#dadada'); - box-shadow: inset 1px 1px 3px #666; +div.dt-button-collection .dt-button.dt-button-active { + background: none; + box-shadow: none; +} +div.dt-button-collection .dt-button.disabled { + cursor: default; + opacity: 0.4; +} +div.dt-button-collection .dt-button:hover:not(.disabled) { + border: none; + background: rgba(153, 153, 153, 0.1); + box-shadow: none; +} +div.dt-button-collection div.dt-button-split { + display: flex; + flex-direction: row; + flex-wrap: wrap; + justify-content: flex-start; + align-content: flex-start; + align-items: stretch; +} +div.dt-button-collection div.dt-button-split button.dt-button { + margin: 0; + display: inline-block; + width: 0; + flex-grow: 1; + flex-shrink: 0; + flex-basis: 50px; +} +div.dt-button-collection div.dt-button-split button.dt-button-split-drop { + min-width: 33px; + flex: 0; +} +div.dt-button-collection.fixed .dt-button { + border-radius: 0.25em; + background: rgba(255, 255, 255, 0.1); } div.dt-button-collection.fixed { position: fixed; + display: block; top: 50%; left: 50%; margin-left: -75px; - border-radius: 0; + border-radius: 5px; + background-color: white; + padding: 0.5em; } div.dt-button-collection.fixed.two-column { margin-left: -200px; @@ -322,7 +388,31 @@ div.dt-button-collection.fixed.three-column { div.dt-button-collection.fixed.four-column { margin-left: -300px; } -div.dt-button-collection > :last-child { +div.dt-button-collection.fixed.columns { + margin-left: -409px; +} +@media screen and (max-width: 1024px) { + div.dt-button-collection.fixed.columns { + margin-left: -308px; + } +} +@media screen and (max-width: 640px) { + div.dt-button-collection.fixed.columns { + margin-left: -203px; + } +} +@media screen and (max-width: 460px) { + div.dt-button-collection.fixed.columns { + margin-left: -100px; + } +} +div.dt-button-collection.fixed > :last-child { + max-height: 100vh; + overflow: auto; +} +div.dt-button-collection.two-column > :last-child, +div.dt-button-collection.three-column > :last-child, +div.dt-button-collection.four-column > :last-child { display: block !important; -webkit-column-gap: 8px; -moz-column-gap: 8px; @@ -330,7 +420,9 @@ div.dt-button-collection > :last-child { -o-column-gap: 8px; column-gap: 8px; } -div.dt-button-collection > :last-child > * { +div.dt-button-collection.two-column > :last-child > *, +div.dt-button-collection.three-column > :last-child > *, +div.dt-button-collection.four-column > :last-child > * { -webkit-column-break-inside: avoid; break-inside: avoid; } @@ -339,10 +431,6 @@ div.dt-button-collection.two-column { } div.dt-button-collection.two-column > :last-child { padding-bottom: 1px; - -webkit-column-count: 2; - -moz-column-count: 2; - -ms-column-count: 2; - -o-column-count: 2; column-count: 2; } div.dt-button-collection.three-column { @@ -350,10 +438,6 @@ div.dt-button-collection.three-column { } div.dt-button-collection.three-column > :last-child { padding-bottom: 1px; - -webkit-column-count: 3; - -moz-column-count: 3; - -ms-column-count: 3; - -o-column-count: 3; column-count: 3; } div.dt-button-collection.four-column { @@ -361,15 +445,60 @@ div.dt-button-collection.four-column { } div.dt-button-collection.four-column > :last-child { padding-bottom: 1px; - -webkit-column-count: 4; - -moz-column-count: 4; - -ms-column-count: 4; - -o-column-count: 4; column-count: 4; } div.dt-button-collection .dt-button { border-radius: 0; } +div.dt-button-collection.columns { + width: auto; +} +div.dt-button-collection.columns > :last-child { + display: flex; + flex-wrap: wrap; + justify-content: flex-start; + align-items: center; + gap: 6px; + width: 818px; + padding-bottom: 1px; +} +div.dt-button-collection.columns > :last-child .dt-button { + min-width: 200px; + flex: 0 1; + margin: 0; +} +div.dt-button-collection.columns.dtb-b3 > :last-child, +div.dt-button-collection.columns.dtb-b2 > :last-child, +div.dt-button-collection.columns.dtb-b1 > :last-child { + justify-content: space-between; +} +div.dt-button-collection.columns.dtb-b3 .dt-button { + flex: 1 1 32%; +} +div.dt-button-collection.columns.dtb-b2 .dt-button { + flex: 1 1 48%; +} +div.dt-button-collection.columns.dtb-b1 .dt-button { + flex: 1 1 100%; +} +@media screen and (max-width: 1024px) { + div.dt-button-collection.columns > :last-child { + width: 612px; + } +} +@media screen and (max-width: 640px) { + div.dt-button-collection.columns > :last-child { + width: 406px; + } + div.dt-button-collection.columns.dtb-b3 .dt-button { + flex: 0 1 32%; + } +} +@media screen and (max-width: 460px) { + div.dt-button-collection.columns > :last-child { + width: 200px; + } +} div.dt-button-background { position: fixed; top: 0; @@ -377,39 +506,6 @@ div.dt-button-background { width: 100%; height: 100%; background: rgba(0, 0, 0, 0.7); - background: -ms-radial-gradient( - center, - ellipse farthest-corner, - rgba(0, 0, 0, 0.3) 0%, - rgba(0, 0, 0, 0.7) 100% - ); - background: -moz-radial-gradient( - center, - ellipse farthest-corner, - rgba(0, 0, 0, 0.3) 0%, - rgba(0, 0, 0, 0.7) 100% - ); - background: -o-radial-gradient( - center, - ellipse farthest-corner, - rgba(0, 0, 0, 0.3) 0%, - rgba(0, 0, 0, 0.7) 100% - ); - background: -webkit-gradient( - radial, - center center, - 0, - center center, - 497, - color-stop(0, rgba(0, 0, 0, 0.3)), - color-stop(1, rgba(0, 0, 0, 0.7)) - ); - background: -webkit-radial-gradient( - center, - ellipse farthest-corner, - rgba(0, 0, 0, 0.3) 0%, - rgba(0, 0, 0, 0.7) 100% - ); background: radial-gradient( ellipse farthest-corner at center, rgba(0, 0, 0, 0.3) 0%, @@ -417,20 +513,10 @@ div.dt-button-background { ); z-index: 2001; } -@media screen and (max-width: 640px) { - div.dt-buttons { - float: none !important; - text-align: center; - } -} -button.dt-button.processing, -div.dt-button.processing, -a.dt-button.processing { +.dt-button.processing { color: rgba(0, 0, 0, 0.2); } -button.dt-button.processing:after, -div.dt-button.processing:after, -a.dt-button.processing:after { +.dt-button.processing:after { position: absolute; top: 50%; left: 50%; @@ -440,7 +526,7 @@ a.dt-button.processing:after { box-sizing: border-box; display: block; content: " "; - border: 2px solid #282828; + border: 2px solid rgb(40, 40, 40); border-radius: 50%; border-left-color: transparent; border-right-color: transparent; @@ -450,3 +536,54 @@ a.dt-button.processing:after { -webkit-animation: dtb-spinner 1500ms infinite linear; -moz-animation: dtb-spinner 1500ms infinite linear; } +@media screen and (max-width: 640px) { + div.dt-buttons { + float: none !important; + text-align: center; + } +} +html.dark div.dt-buttons > .dt-button, +html.dark div.dt-buttons > div.dt-button-split .dt-button { + border: 1px solid rgb(89, 91, 94); + background: rgba(255, 255, 255, 0.15); +} +html.dark div.dt-buttons > .dt-button.dt-button-active:not(.disabled), +html.dark + div.dt-buttons + > div.dt-button-split + .dt-button.dt-button-active:not(.disabled) { + background: rgba(179, 179, 179, 0.15); + box-shadow: inset 1px 1px 2px black; +} +html.dark + div.dt-buttons + > .dt-button.dt-button-active:not(.disabled):hover:not(.disabled), +html.dark + div.dt-buttons + > div.dt-button-split + .dt-button.dt-button-active:not(.disabled):hover:not(.disabled) { + background: rgba(128, 128, 128, 0.15); + box-shadow: inset 1px 1px 3px black; +} +html.dark div.dt-buttons > .dt-button:hover:not(.disabled), +html.dark div.dt-buttons > div.dt-button-split .dt-button:hover:not(.disabled) { + background: rgba(179, 179, 179, 0.15); +} +html.dark div.dt-buttons > .dt-button:focus:not(.disabled), +html.dark div.dt-buttons > div.dt-button-split .dt-button:focus:not(.disabled) { + outline: 2px solid rgb(110, 168, 254); +} +html.dark div.dt-buttons > div.dt-button-split .dt-button:first-child { + border-right: 1px solid rgba(255, 255, 255, 0.1); +} +html.dark div.dt-buttons > div.dt-button-split .dt-button:first-child:hover { + border-right: 1px solid rgb(89, 91, 94); +} +html.dark div.dt-buttons > div.dt-button-split .dt-button:last-child:hover { + border-left: 1px solid rgb(89, 91, 94); +} +html.dark div.dt-button-collection { + border: 1px solid rgba(255, 255, 255, 0.15); + background-color: rgb(33, 37, 41); + box-shadow: 3px 4px 10px 1px rgba(0, 0, 0, 0.8); +} diff --git a/assets/css/datatables.min.css b/assets/css/datatables.min.css index 5fbbf8d2..c5bb2132 100644 --- a/assets/css/datatables.min.css +++ b/assets/css/datatables.min.css @@ -4,12 +4,285 @@ * * To rebuild or modify this file with the latest versions of the included * software please visit: - * https://datatables.net/download/#bs4/dt-1.10.22/fc-3.3.1/fh-3.1.7/r-2.2.6/sc-2.0.3 + * https://datatables.net/download/#bs5/dt-1.13.7/af-2.6.0/b-2.4.2/b-html5-2.4.2/cr-1.7.0/date-1.5.1/fc-4.3.0/fh-3.4.0/r-2.5.0/sc-2.3.0 * * Included libraries: - * DataTables 1.10.22, FixedColumns 3.3.1, FixedHeader 3.1.7, Responsive 2.2.6, Scroller 2.0.3 + * DataTables 1.13.7, AutoFill 2.6.0, Buttons 2.4.2, HTML5 export 2.4.2, ColReorder 1.7.0, DateTime 1.5.1, FixedColumns 4.3.0, FixedHeader 3.4.0, Responsive 2.5.0, Scroller 2.3.0 */ +: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; + color: rgba(0, 0, 0, 0.5); + content: "▶"; +} +table.dataTable tr.dt-hasChild td.dt-control:before { + content: "▼"; +} +html.dark table.dataTable td.dt-control:before { + color: rgba(255, 255, 255, 0.5); +} +html.dark table.dataTable tr.dt-hasChild td.dt-control:before { + color: rgba(255, 255, 255, 0.5); +} +table.dataTable thead > tr > th.sorting, +table.dataTable thead > tr > th.sorting_asc, +table.dataTable thead > tr > th.sorting_desc, +table.dataTable thead > tr > th.sorting_asc_disabled, +table.dataTable thead > tr > th.sorting_desc_disabled, +table.dataTable thead > tr > td.sorting, +table.dataTable thead > tr > td.sorting_asc, +table.dataTable thead > tr > td.sorting_desc, +table.dataTable thead > tr > td.sorting_asc_disabled, +table.dataTable thead > tr > td.sorting_desc_disabled { + cursor: pointer; + position: relative; + padding-right: 26px; +} +table.dataTable thead > tr > th.sorting:before, +table.dataTable thead > tr > th.sorting:after, +table.dataTable thead > tr > th.sorting_asc:before, +table.dataTable thead > tr > th.sorting_asc:after, +table.dataTable thead > tr > th.sorting_desc:before, +table.dataTable thead > tr > th.sorting_desc:after, +table.dataTable thead > tr > th.sorting_asc_disabled:before, +table.dataTable thead > tr > th.sorting_asc_disabled:after, +table.dataTable thead > tr > th.sorting_desc_disabled:before, +table.dataTable thead > tr > th.sorting_desc_disabled:after, +table.dataTable thead > tr > td.sorting:before, +table.dataTable thead > tr > td.sorting:after, +table.dataTable thead > tr > td.sorting_asc:before, +table.dataTable thead > tr > td.sorting_asc:after, +table.dataTable thead > tr > td.sorting_desc:before, +table.dataTable thead > tr > td.sorting_desc:after, +table.dataTable thead > tr > td.sorting_asc_disabled:before, +table.dataTable thead > tr > td.sorting_asc_disabled:after, +table.dataTable thead > tr > td.sorting_desc_disabled:before, +table.dataTable thead > tr > td.sorting_desc_disabled:after { + position: absolute; + display: block; + opacity: 0.125; + right: 10px; + line-height: 9px; + font-size: 0.8em; +} +table.dataTable thead > tr > th.sorting:before, +table.dataTable thead > tr > th.sorting_asc:before, +table.dataTable thead > tr > th.sorting_desc:before, +table.dataTable thead > tr > th.sorting_asc_disabled:before, +table.dataTable thead > tr > th.sorting_desc_disabled:before, +table.dataTable thead > tr > td.sorting:before, +table.dataTable thead > tr > td.sorting_asc:before, +table.dataTable thead > tr > td.sorting_desc:before, +table.dataTable thead > tr > td.sorting_asc_disabled:before, +table.dataTable thead > tr > td.sorting_desc_disabled:before { + bottom: 50%; + content: "▲"; + content: "▲"/""; +} +table.dataTable thead > tr > th.sorting:after, +table.dataTable thead > tr > th.sorting_asc:after, +table.dataTable thead > tr > th.sorting_desc:after, +table.dataTable thead > tr > th.sorting_asc_disabled:after, +table.dataTable thead > tr > th.sorting_desc_disabled:after, +table.dataTable thead > tr > td.sorting:after, +table.dataTable thead > tr > td.sorting_asc:after, +table.dataTable thead > tr > td.sorting_desc:after, +table.dataTable thead > tr > td.sorting_asc_disabled:after, +table.dataTable thead > tr > td.sorting_desc_disabled:after { + top: 50%; + content: "▼"; + content: "▼"/""; +} +table.dataTable thead > tr > th.sorting_asc:before, +table.dataTable thead > tr > th.sorting_desc:after, +table.dataTable thead > tr > td.sorting_asc:before, +table.dataTable thead > tr > td.sorting_desc:after { + opacity: 0.6; +} +table.dataTable thead > tr > th.sorting_desc_disabled:after, +table.dataTable thead > tr > th.sorting_asc_disabled:before, +table.dataTable thead > tr > td.sorting_desc_disabled:after, +table.dataTable thead > tr > td.sorting_asc_disabled:before { + display: none; +} +table.dataTable thead > tr > th:active, +table.dataTable thead > tr > td:active { + outline: none; +} +div.dataTables_scrollBody > table.dataTable > thead > tr > th:before, +div.dataTables_scrollBody > table.dataTable > thead > tr > th:after, +div.dataTables_scrollBody > table.dataTable > thead > tr > td:before, +div.dataTables_scrollBody > table.dataTable > thead > tr > td:after { + display: none; +} +div.dataTables_processing { + position: absolute; + top: 50%; + left: 50%; + width: 200px; + margin-left: -100px; + margin-top: -26px; + text-align: center; + padding: 2px; + z-index: 10; +} +div.dataTables_processing > div:last-child { + position: relative; + width: 80px; + height: 15px; + margin: 1em auto; +} +div.dataTables_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.dataTables_processing > div:last-child > div:nth-child(1) { + left: 8px; + animation: datatables-loader-1 0.6s infinite; +} +div.dataTables_processing > div:last-child > div:nth-child(2) { + left: 8px; + animation: datatables-loader-2 0.6s infinite; +} +div.dataTables_processing > div:last-child > div:nth-child(3) { + left: 32px; + animation: datatables-loader-2 0.6s infinite; +} +div.dataTables_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.dt-left, +table.dataTable td.dt-left { + text-align: left; +} +table.dataTable th.dt-center, +table.dataTable td.dt-center, +table.dataTable td.dataTables_empty { + 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 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; +} /*! Bootstrap 5 integration for DataTables + * + * ©2020 SpryMedia Ltd, all rights reserved. + * License: MIT datatables.net/license/mit + */ table.dataTable { clear: both; margin-top: 6px !important; @@ -31,6 +304,36 @@ table.dataTable.nowrap th, table.dataTable.nowrap td { white-space: nowrap; } +table.dataTable.table-striped > tbody > tr:nth-of-type(2n + 1) > * { + box-shadow: none; +} +table.dataTable > tbody > tr { + background-color: transparent; +} +table.dataTable > tbody > tr.selected > * { + box-shadow: inset 0 0 0 9999px rgb(13, 110, 253); + box-shadow: inset 0 0 0 9999px rgb(var(--dt-row-selected)); + 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.table-striped > tbody > tr:nth-of-type(2n + 1) > * { + box-shadow: inset 0 0 0 9999px rgba(var(--dt-row-stripe), 0.05); +} +table.dataTable.table-striped > tbody > tr:nth-of-type(2n + 1).selected > * { + box-shadow: inset 0 0 0 9999px rgba(13, 110, 253, 0.95); + box-shadow: inset 0 0 0 9999px rgba(var(--dt-row-selected), 0.95); +} +table.dataTable.table-hover > tbody > tr:hover > * { + box-shadow: inset 0 0 0 9999px rgba(var(--dt-row-hover), 0.075); +} +table.dataTable.table-hover > tbody > tr.selected:hover > * { + box-shadow: inset 0 0 0 9999px rgba(13, 110, 253, 0.975); + box-shadow: inset 0 0 0 9999px rgba(var(--dt-row-selected), 0.975); +} div.dataTables_wrapper div.dataTables_length label { font-weight: normal; text-align: left; @@ -66,89 +369,27 @@ div.dataTables_wrapper div.dataTables_paginate ul.pagination { white-space: nowrap; justify-content: flex-end; } -div.dataTables_wrapper div.dataTables_processing { - position: absolute; - top: 50%; - left: 50%; - width: 200px; - margin-left: -100px; - margin-top: -26px; - text-align: center; - padding: 1em 0; -} -table.dataTable > thead > tr > th:active, -table.dataTable > thead > tr > td:active { - outline: none; -} -table.dataTable > thead > tr > th:not(.sorting_disabled), -table.dataTable > thead > tr > td:not(.sorting_disabled) { - padding-right: 30px; -} -table.dataTable > thead .sorting, -table.dataTable > thead .sorting_asc, -table.dataTable > thead .sorting_desc, -table.dataTable > thead .sorting_asc_disabled, -table.dataTable > thead .sorting_desc_disabled { - cursor: pointer; +div.dataTables_wrapper div.dt-row { position: relative; } -table.dataTable > thead .sorting:before, -table.dataTable > thead .sorting:after, -table.dataTable > thead .sorting_asc:before, -table.dataTable > thead .sorting_asc:after, -table.dataTable > thead .sorting_desc:before, -table.dataTable > thead .sorting_desc:after, -table.dataTable > thead .sorting_asc_disabled:before, -table.dataTable > thead .sorting_asc_disabled:after, -table.dataTable > thead .sorting_desc_disabled:before, -table.dataTable > thead .sorting_desc_disabled:after { - position: absolute; - bottom: 0.9em; - display: block; - opacity: 0.3; -} -table.dataTable > thead .sorting:before, -table.dataTable > thead .sorting_asc:before, -table.dataTable > thead .sorting_desc:before, -table.dataTable > thead .sorting_asc_disabled:before, -table.dataTable > thead .sorting_desc_disabled:before { - right: 1em; - content: "\2191"; -} -table.dataTable > thead .sorting:after, -table.dataTable > thead .sorting_asc:after, -table.dataTable > thead .sorting_desc:after, -table.dataTable > thead .sorting_asc_disabled:after, -table.dataTable > thead .sorting_desc_disabled:after { - right: 0.5em; - content: "\2193"; -} -table.dataTable > thead .sorting_asc:before, -table.dataTable > thead .sorting_desc:after { - opacity: 1; -} -table.dataTable > thead .sorting_asc_disabled:before, -table.dataTable > thead .sorting_desc_disabled:after { - opacity: 0; -} div.dataTables_scrollHead table.dataTable { margin-bottom: 0 !important; } -div.dataTables_scrollBody table { +div.dataTables_scrollBody > table { border-top: none; margin-top: 0 !important; margin-bottom: 0 !important; } -div.dataTables_scrollBody table thead .sorting:before, -div.dataTables_scrollBody table thead .sorting_asc:before, -div.dataTables_scrollBody table thead .sorting_desc:before, -div.dataTables_scrollBody table thead .sorting:after, -div.dataTables_scrollBody table thead .sorting_asc:after, -div.dataTables_scrollBody table thead .sorting_desc:after { +div.dataTables_scrollBody > table > thead .sorting:before, +div.dataTables_scrollBody > table > thead .sorting_asc:before, +div.dataTables_scrollBody > table > thead .sorting_desc:before, +div.dataTables_scrollBody > table > thead .sorting:after, +div.dataTables_scrollBody > table > thead .sorting_asc:after, +div.dataTables_scrollBody > table > thead .sorting_desc:after { display: none; } -div.dataTables_scrollBody table tbody tr:first-child th, -div.dataTables_scrollBody table tbody tr:first-child td { +div.dataTables_scrollBody > table > tbody tr:first-child th, +div.dataTables_scrollBody > table > tbody tr:first-child td { border-top: none; } div.dataTables_scrollFoot > .dataTables_scrollFootInner { @@ -172,33 +413,36 @@ div.dataTables_scrollFoot > .dataTables_scrollFootInner > table { table.dataTable.table-sm > thead > tr > th:not(.sorting_disabled) { padding-right: 20px; } -table.dataTable.table-sm .sorting:before, -table.dataTable.table-sm .sorting_asc:before, -table.dataTable.table-sm .sorting_desc:before { - top: 5px; - right: 0.85em; -} -table.dataTable.table-sm .sorting:after, -table.dataTable.table-sm .sorting_asc:after, -table.dataTable.table-sm .sorting_desc:after { - top: 5px; +table.dataTable.table-sm > thead > tr > th:not(.sorting_disabled):before, +table.dataTable.table-sm > thead > tr > th:not(.sorting_disabled):after { + right: 5px; } table.table-bordered.dataTable { border-right-width: 0; } +table.table-bordered.dataTable thead tr:first-child th, +table.table-bordered.dataTable thead tr:first-child td { + border-top-width: 1px; +} table.table-bordered.dataTable th, table.table-bordered.dataTable td { border-left-width: 0; } +table.table-bordered.dataTable th:first-child, +table.table-bordered.dataTable th:first-child, +table.table-bordered.dataTable td:first-child, +table.table-bordered.dataTable td:first-child { + border-left-width: 1px; +} table.table-bordered.dataTable th:last-child, table.table-bordered.dataTable th:last-child, table.table-bordered.dataTable td:last-child, table.table-bordered.dataTable td:last-child { border-right-width: 1px; } -table.table-bordered.dataTable tbody th, -table.table-bordered.dataTable tbody td { - border-bottom-width: 0; +table.table-bordered.dataTable th, +table.table-bordered.dataTable td { + border-bottom-width: 1px; } div.dataTables_scrollHead table.table-bordered { border-bottom-width: 0; @@ -218,67 +462,944 @@ div.table-responsive > div[class^="col-"]:last-child { padding-right: 0; } +:root[data-bs-theme="dark"] { + --dt-row-hover: 255, 255, 255; + --dt-row-stripe: 255, 255, 255; + --dt-column-ordering: 255, 255, 255; +} -table.DTFC_Cloned tr { +div.dt-autofill-handle { + position: absolute; + height: 8px; + width: 8px; + z-index: 10; + box-sizing: border-box; + background: #0d6efd; + cursor: pointer; +} + +div.dtk-focus-alt div.dt-autofill-handle { + background: #ff8b33; +} + +div.dt-autofill-select { + position: absolute; + z-index: 1001; + background-color: #0d6efd; + background-image: repeating-linear-gradient( + 45deg, + transparent, + transparent 5px, + rgba(255, 255, 255, 0.5) 5px, + rgba(255, 255, 255, 0.5) 10px + ); +} +div.dt-autofill-select.top, +div.dt-autofill-select.bottom { + height: 3px; + margin-top: -1px; +} +div.dt-autofill-select.left, +div.dt-autofill-select.right { + width: 3px; + margin-left: -1px; +} + +div.dt-autofill-list { + position: fixed; + top: 50%; + left: 50%; + width: 500px; + margin-left: -250px; background-color: white; + border-radius: 0.75em; + box-shadow: 0 12px 30px rgba(0, 0, 0, 0.6); + z-index: 104; + box-sizing: border-box; + padding: 2em; +} +div.dt-autofill-list div.dtaf-popover-close { + position: absolute; + top: 6px; + right: 6px; + width: 22px; + height: 22px; + text-align: center; + border-radius: 3px; + cursor: pointer; + z-index: 12; +} +div.dt-autofill-list > div.dt-autofill-list-items > button { + display: block; + width: 100%; + margin: 1em 0; + padding: 1em; + border-radius: 0.5em; + border: 1px solid rgba(0, 0, 0, 0.175); + background-color: #f6f6f6; + text-align: left; + cursor: pointer; +} +div.dt-autofill-list > div.dt-autofill-list-items > button:hover { + background-color: #ebebeb; +} +div.dt-autofill-list > div.dt-autofill-list-items > button:first-child { + margin-top: 0; +} +div.dt-autofill-list > div.dt-autofill-list-items > button:last-child { margin-bottom: 0; } -div.DTFC_LeftHeadWrapper table, -div.DTFC_RightHeadWrapper table { - border-bottom: none !important; - margin-bottom: 0 !important; +div.dt-autofill-list + > div.dt-autofill-list-items + > button + input[type="number"] { + padding: 6px; + width: 30px; + margin: -2px 0; +} +div.dt-autofill-list > div.dt-autofill-list-items > button span { + float: right; +} + +div.dtaf-popover-closeable { + padding-top: 2.5em; +} + +div.dt-autofill-background { + position: fixed; + top: 0; + left: 0; + width: 100%; + height: 100%; + background: rgba(0, 0, 0, 0.7); + background: radial-gradient( + ellipse farthest-corner at center, + rgba(0, 0, 0, 0.3) 0%, + rgba(0, 0, 0, 0.7) 100% + ); + z-index: 103; +} + +html.dark div.dt-autofill-handle { + background: rgb(110, 168, 254); +} +html.dark div.dt-autofill-select { + position: absolute; + z-index: 1001; + background-color: rgb(110, 168, 254); + background-image: repeating-linear-gradient( + 45deg, + transparent, + transparent 5px, + rgba(0, 0, 0, 0.5) 5px, + rgba(0, 0, 0, 0.5) 10px + ); +} +html.dark div.dt-autofill-list { + background-color: var(--dt-html-background); + border: 1px solid rgba(255, 255, 255, 0.15); +} +html.dark div.dt-autofill-list button { + color: inherit; + border: 1px solid rgba(255, 255, 255, 0.175); + background-color: rgb(47, 52, 56); +} +html.dark div.dt-autofill-list button:hover { + background-color: rgb(64, 69, 73); +} + +@media screen and (max-width: 767px) { + div.dt-autofill-handle { + height: 16px; + width: 16px; + } + div.dt-autofill-list { + width: 90%; + left: 74.5%; + } +} +div.dt-autofill-list div.dt-autofill-question input[type="number"] { + padding: 6px; + width: 60px; + margin: -2px 0; +} + +div.row.dt-row > div.col-sm-12 { + position: relative; +} + +@keyframes dtb-spinner { + 100% { + transform: rotate(360deg); + } +} +@-o-keyframes dtb-spinner { + 100% { + -o-transform: rotate(360deg); + transform: rotate(360deg); + } +} +@-ms-keyframes dtb-spinner { + 100% { + -ms-transform: rotate(360deg); + transform: rotate(360deg); + } +} +@-webkit-keyframes dtb-spinner { + 100% { + -webkit-transform: rotate(360deg); + transform: rotate(360deg); + } +} +@-moz-keyframes dtb-spinner { + 100% { + -moz-transform: rotate(360deg); + transform: rotate(360deg); + } +} +div.dataTables_wrapper { + position: relative; +} +div.dt-buttons { + position: initial; +} +div.dt-buttons .dt-button { + overflow: hidden; + text-overflow: ellipsis; +} +div.dt-button-info { + position: fixed; + top: 50%; + left: 50%; + width: 400px; + margin-top: -100px; + margin-left: -200px; background-color: white; + border-radius: 0.75em; + box-shadow: 3px 4px 10px 1px rgba(0, 0, 0, 0.8); + text-align: center; + z-index: 2003; + overflow: hidden; } -div.DTFC_LeftBodyWrapper table, -div.DTFC_RightBodyWrapper table { - border-top: none; - margin: 0 !important; - z-index: 2; +div.dt-button-info h2 { + padding: 2rem 2rem 1rem 2rem; + margin: 0; + font-weight: normal; } -div.DTFC_LeftBodyWrapper table thead .sorting:before, -div.DTFC_LeftBodyWrapper table thead .sorting:after, -div.DTFC_LeftBodyWrapper table thead .sorting_asc:before, -div.DTFC_LeftBodyWrapper table thead .sorting_asc:after, -div.DTFC_LeftBodyWrapper table thead .sorting_desc:before, -div.DTFC_LeftBodyWrapper table thead .sorting_desc:after, -div.DTFC_LeftBodyWrapper table thead .sorting:before, -div.DTFC_LeftBodyWrapper table thead .sorting:after, -div.DTFC_LeftBodyWrapper table thead .sorting_asc:before, -div.DTFC_LeftBodyWrapper table thead .sorting_asc:after, -div.DTFC_LeftBodyWrapper table thead .sorting_desc:before, -div.DTFC_LeftBodyWrapper table thead .sorting_desc:after, -div.DTFC_RightBodyWrapper table thead .sorting:before, -div.DTFC_RightBodyWrapper table thead .sorting:after, -div.DTFC_RightBodyWrapper table thead .sorting_asc:before, -div.DTFC_RightBodyWrapper table thead .sorting_asc:after, -div.DTFC_RightBodyWrapper table thead .sorting_desc:before, -div.DTFC_RightBodyWrapper table thead .sorting_desc:after, -div.DTFC_RightBodyWrapper table thead .sorting:before, -div.DTFC_RightBodyWrapper table thead .sorting:after, -div.DTFC_RightBodyWrapper table thead .sorting_asc:before, -div.DTFC_RightBodyWrapper table thead .sorting_asc:after, -div.DTFC_RightBodyWrapper table thead .sorting_desc:before, -div.DTFC_RightBodyWrapper table thead .sorting_desc:after { +div.dt-button-info > div { + padding: 1em 2em 2em 2em; +} +div.dtb-popover-close { + position: absolute; + top: 6px; + right: 6px; + width: 22px; + height: 22px; + text-align: center; + border-radius: 3px; + cursor: pointer; + z-index: 2003; +} +button.dtb-hide-drop { + display: none !important; +} +div.dt-button-collection-title { + text-align: center; + padding: 0.3em 0 0.5em; + margin-left: 0.5em; + margin-right: 0.5em; + font-size: 0.9em; +} +div.dt-button-collection-title:empty { display: none; } -div.DTFC_LeftBodyWrapper table tbody tr:first-child th, -div.DTFC_LeftBodyWrapper table tbody tr:first-child td, -div.DTFC_RightBodyWrapper table tbody tr:first-child th, -div.DTFC_RightBodyWrapper table tbody tr:first-child td { - border-top: none; +span.dt-button-spacer { + display: inline-block; + margin: 0.5em; + white-space: nowrap; } -div.DTFC_LeftFootWrapper table, -div.DTFC_RightFootWrapper table { - border-top: none; - margin-top: 0 !important; +span.dt-button-spacer.bar { + border-left: 1px solid rgba(0, 0, 0, 0.3); + vertical-align: middle; + padding-left: 0.5em; +} +span.dt-button-spacer.bar:empty { + height: 1em; + width: 1px; + padding-left: 0; +} +div.dt-button-collection .dt-button-active { + padding-right: 3em; +} +div.dt-button-collection .dt-button-active:after { + position: absolute; + top: 50%; + margin-top: -10px; + right: 1em; + display: inline-block; + content: "✓"; + color: inherit; +} +div.dt-button-collection .dt-button-active.dt-button-split { + padding-right: 0; +} +div.dt-button-collection .dt-button-active.dt-button-split:after { + display: none; +} +div.dt-button-collection .dt-button-active.dt-button-split > *:first-child { + padding-right: 3em; +} +div.dt-button-collection + .dt-button-active.dt-button-split + > *:first-child:after { + position: absolute; + top: 50%; + margin-top: -10px; + right: 1em; + display: inline-block; + content: "✓"; + color: inherit; +} +div.dt-button-collection .dt-button-active-a a { + padding-right: 3em; +} +div.dt-button-collection .dt-button-active-a a:after { + position: absolute; + right: 1em; + display: inline-block; + content: "✓"; + color: inherit; +} +div.dt-button-collection span.dt-button-spacer { + width: 100%; + font-size: 0.9em; + text-align: center; + margin: 0.5em 0; +} +div.dt-button-collection span.dt-button-spacer:empty { + height: 0; + width: 100%; +} +div.dt-button-collection span.dt-button-spacer.bar { + border-left: none; + border-bottom: 1px solid rgba(0, 0, 0, 0.1); + padding-left: 0; +} +html.dark div.dt-button-info { + background-color: var(--dt-html-background); + border: 1px solid rgba(255, 255, 255, 0.15); +} +div.dt-buttons div.btn-group { + position: initial; +} +div.dt-buttons div.dropdown-menu { + margin-top: 4px; +} +div.dt-buttons div.dropdown-menu .dt-button { + position: relative; +} +div.dt-buttons div.dropdown-menu div.dt-button-split { + display: flex; + flex-direction: row; + flex-wrap: wrap; + justify-content: flex-start; + align-content: flex-start; + align-items: stretch; +} +div.dt-buttons div.dropdown-menu div.dt-button-split a:first-child { + min-width: auto; + flex: 1 0 50px; + padding-right: 0; +} +div.dt-buttons div.dropdown-menu div.dt-button-split button:last-child { + min-width: 33px; + flex: 0; + background: transparent; + border: none; + line-height: 1rem; + color: var(--bs-dropdown-link-color); + padding: var(--bs-dropdown-item-padding-y) var(--bs-dropdown-item-padding-x); +} +div.dt-buttons div.dropdown-menu div.dt-button-split button:last-child:hover { + color: var(--bs-dropdown-link-hover-color); + background-color: var(--bs-dropdown-link-hover-bg); +} +div.dt-buttons div.dropdown-menu div.dt-button-split button:last-child:after { + position: relative; + left: -3px; +} +div.dt-buttons div.dropdown-menu.fixed { + position: fixed; + display: block; + top: 50%; + left: 50%; + margin-left: -75px; + border-radius: 5px; + background-color: white; + padding: 0.5em; +} +div.dt-buttons div.dropdown-menu.fixed.two-column { + margin-left: -200px; +} +div.dt-buttons div.dropdown-menu.fixed.three-column { + margin-left: -225px; +} +div.dt-buttons div.dropdown-menu.fixed.four-column { + margin-left: -300px; +} +div.dt-buttons div.dropdown-menu.fixed.columns { + margin-left: -409px; +} +@media screen and (max-width: 1024px) { + div.dt-buttons div.dropdown-menu.fixed.columns { + margin-left: -308px; + } +} +@media screen and (max-width: 640px) { + div.dt-buttons div.dropdown-menu.fixed.columns { + margin-left: -203px; + } +} +@media screen and (max-width: 460px) { + div.dt-buttons div.dropdown-menu.fixed.columns { + margin-left: -100px; + } +} +div.dt-buttons div.dropdown-menu.fixed > :last-child { + max-height: 100vh; + overflow: auto; +} +div.dt-buttons div.dropdown-menu.two-column > :last-child, +div.dt-buttons div.dropdown-menu.three-column > :last-child, +div.dt-buttons div.dropdown-menu.four-column > :last-child { + display: block !important; + -webkit-column-gap: 8px; + -moz-column-gap: 8px; + -ms-column-gap: 8px; + -o-column-gap: 8px; + column-gap: 8px; +} +div.dt-buttons div.dropdown-menu.two-column > :last-child > *, +div.dt-buttons div.dropdown-menu.three-column > :last-child > *, +div.dt-buttons div.dropdown-menu.four-column > :last-child > * { + -webkit-column-break-inside: avoid; + break-inside: avoid; +} +div.dt-buttons div.dropdown-menu.two-column { + width: 400px; +} +div.dt-buttons div.dropdown-menu.two-column > :last-child { + padding-bottom: 1px; + column-count: 2; +} +div.dt-buttons div.dropdown-menu.three-column { + width: 450px; +} +div.dt-buttons div.dropdown-menu.three-column > :last-child { + padding-bottom: 1px; + column-count: 3; +} +div.dt-buttons div.dropdown-menu.four-column { + width: 600px; +} +div.dt-buttons div.dropdown-menu.four-column > :last-child { + padding-bottom: 1px; + column-count: 4; +} +div.dt-buttons div.dropdown-menu .dt-button { + border-radius: 0; +} +div.dt-buttons div.dropdown-menu.columns { + width: auto; +} +div.dt-buttons div.dropdown-menu.columns > :last-child { + display: flex; + flex-wrap: wrap; + justify-content: flex-start; + align-items: center; + gap: 6px; + width: 818px; + padding-bottom: 1px; +} +div.dt-buttons div.dropdown-menu.columns > :last-child .dt-button { + min-width: 200px; + flex: 0 1; + margin: 0; +} +div.dt-buttons div.dropdown-menu.columns.dtb-b3 > :last-child, +div.dt-buttons div.dropdown-menu.columns.dtb-b2 > :last-child, +div.dt-buttons div.dropdown-menu.columns.dtb-b1 > :last-child { + justify-content: space-between; +} +div.dt-buttons div.dropdown-menu.columns.dtb-b3 .dt-button { + flex: 1 1 32%; +} +div.dt-buttons div.dropdown-menu.columns.dtb-b2 .dt-button { + flex: 1 1 48%; +} +div.dt-buttons div.dropdown-menu.columns.dtb-b1 .dt-button { + flex: 1 1 100%; +} +@media screen and (max-width: 1024px) { + div.dt-buttons div.dropdown-menu.columns > :last-child { + width: 612px; + } +} +@media screen and (max-width: 640px) { + div.dt-buttons div.dropdown-menu.columns > :last-child { + width: 406px; + } + div.dt-buttons div.dropdown-menu.columns.dtb-b3 .dt-button { + flex: 0 1 32%; + } +} +@media screen and (max-width: 460px) { + div.dt-buttons div.dropdown-menu.columns > :last-child { + width: 200px; + } +} +div.dt-buttons span.dt-button-spacer.empty { + margin: 1px; +} +div.dt-buttons span.dt-button-spacer.bar:empty { + height: inherit; +} +div.dt-buttons .btn.processing { + color: rgba(0, 0, 0, 0.2); +} +div.dt-buttons .btn.processing:after { + position: absolute; + top: 50%; + left: 50%; + width: 16px; + height: 16px; + margin: -8px 0 0 -8px; + box-sizing: border-box; + display: block; + content: " "; + border: 2px solid rgb(40, 40, 40); + border-radius: 50%; + border-left-color: transparent; + border-right-color: transparent; + animation: dtb-spinner 1500ms infinite linear; + -o-animation: dtb-spinner 1500ms infinite linear; + -ms-animation: dtb-spinner 1500ms infinite linear; + -webkit-animation: dtb-spinner 1500ms infinite linear; + -moz-animation: dtb-spinner 1500ms infinite linear; +} +div.dt-button-background { + position: fixed; + top: 0; + left: 0; + width: 100%; + height: 100%; + z-index: 999; +} +@media screen and (max-width: 767px) { + div.dt-buttons { + float: none; + width: 100%; + text-align: center; + margin-bottom: 0.5em; + } + div.dt-buttons a.btn { + float: none; + } +} +:root[data-bs-theme="dark"] div.dropdown-menu.dt-button-collection.fixed { + background-color: rgb(33, 37, 41); + border: 1px solid rgba(255, 255, 255, 0.15); + border-radius: 8px; +} + +table.DTCR_clonedTable.dataTable { + position: absolute !important; + background-color: rgba(255, 255, 255, 0.7); + z-index: 202; + border-radius: 4px; +} +div.DTCR_pointer { + width: 1px; + background-color: #0d6efd; + z-index: 201; +} +html.dark table.DTCR_clonedTable.dataTable { + background-color: rgba(33, 33, 33, 0.9); +} +html.dark div.DTCR_pointer { + background-color: rgb(13, 110, 253); +} + +div.dt-datetime { + position: absolute; + background-color: white; + z-index: 2050; + border: 1px solid #ccc; + box-shadow: 0 5px 15px -5px rgba(0, 0, 0, 0.5); + padding: 6px 20px; + width: 275px; + border-radius: 5px; +} +div.dt-datetime.inline { + position: relative; + box-shadow: none; +} +div.dt-datetime div.dt-datetime-title { + text-align: center; + padding: 5px 0px 3px; +} +div.dt-datetime div.dt-datetime-buttons { + text-align: center; +} +div.dt-datetime div.dt-datetime-buttons a { + display: inline-block; + padding: 0 0.5em 0.5em 0.5em; + margin: 0; + font-size: 0.9em; +} +div.dt-datetime div.dt-datetime-buttons a:hover { + text-decoration: underline; +} +div.dt-datetime table { + border-spacing: 0; + margin: 12px 0; + width: 100%; +} +div.dt-datetime table.dt-datetime-table-nospace { + margin-top: -12px; +} +div.dt-datetime table th { + font-size: 0.8em; + color: #777; + font-weight: normal; + width: 14.285714286%; + padding: 0 0 4px 0; + text-align: center; +} +div.dt-datetime table td { + font-size: 0.9em; + color: #444; + padding: 0; +} +div.dt-datetime table td.selectable { + text-align: center; + background: #f5f5f5; +} +div.dt-datetime table td.selectable.disabled { + color: #aaa; + background: white; +} +div.dt-datetime table td.selectable.disabled button:hover { + color: #aaa; + background: white; +} +div.dt-datetime table td.selectable.now { + background-color: #ddd; +} +div.dt-datetime table td.selectable.now button { + font-weight: bold; +} +div.dt-datetime table td.selectable.selected button { + background: #4e6ca3; + color: white; + border-radius: 2px; +} +div.dt-datetime table td.selectable button:hover { + background: #ff8000; + color: white; + border-radius: 2px; +} +div.dt-datetime table td.dt-datetime-week { + font-size: 0.7em; +} +div.dt-datetime table button { + width: 100%; + box-sizing: border-box; + border: none; + background: transparent; + font-size: inherit; + color: inherit; + text-align: center; + padding: 4px 0; + cursor: pointer; + margin: 0; +} +div.dt-datetime table button span { + display: inline-block; + min-width: 14px; + text-align: right; +} +div.dt-datetime table.weekNumber th { + width: 12.5%; +} +div.dt-datetime div.dt-datetime-calendar table { + margin-top: 0; +} +div.dt-datetime div.dt-datetime-label { + position: relative; + display: inline-block; + height: 30px; + padding: 5px 6px; + border: 1px solid transparent; + box-sizing: border-box; + cursor: pointer; +} +div.dt-datetime div.dt-datetime-label:hover { + border: 1px solid #ddd; + border-radius: 2px; + background-color: #f5f5f5; +} +div.dt-datetime div.dt-datetime-label select { + position: absolute; + top: 6px; + left: 0; + cursor: pointer; + opacity: 0; +} +div.dt-datetime.horizontal { + width: 550px; +} +div.dt-datetime.horizontal div.dt-datetime-date, +div.dt-datetime.horizontal div.dt-datetime-time { + width: 48%; +} +div.dt-datetime.horizontal div.dt-datetime-time { + margin-left: 4%; +} +div.dt-datetime div.dt-datetime-date { + position: relative; + float: left; + width: 100%; +} +div.dt-datetime div.dt-datetime-time { + position: relative; + float: left; + width: 100%; + text-align: center; +} +div.dt-datetime div.dt-datetime-time > span { + vertical-align: middle; +} +div.dt-datetime div.dt-datetime-time th { + text-align: left; +} +div.dt-datetime div.dt-datetime-time div.dt-datetime-timeblock { + display: inline-block; + vertical-align: middle; +} +div.dt-datetime div.dt-datetime-iconLeft, +div.dt-datetime div.dt-datetime-iconRight { + width: 30px; + height: 30px; + background-position: center; + background-repeat: no-repeat; + opacity: 0.3; + overflow: hidden; + box-sizing: border-box; + border: 1px solid transparent; +} +div.dt-datetime div.dt-datetime-iconLeft:hover, +div.dt-datetime div.dt-datetime-iconRight:hover { + border: 1px solid #ccc; + border-radius: 2px; + background-color: #f0f0f0; + opacity: 0.6; +} +div.dt-datetime div.dt-datetime-iconLeft button, +div.dt-datetime div.dt-datetime-iconRight button { + border: none; + background: transparent; + text-indent: 30px; + height: 100%; + width: 100%; + cursor: pointer; +} +div.dt-datetime div.dt-datetime-iconLeft { + position: absolute; + top: 5px; + left: 5px; +} +div.dt-datetime div.dt-datetime-iconLeft button { + position: relative; + z-index: 1; +} +div.dt-datetime div.dt-datetime-iconLeft:after { + position: absolute; + top: 7px; + left: 10px; + display: block; + content: ""; + border-top: 7px solid transparent; + border-right: 7px solid black; + border-bottom: 7px solid transparent; +} +div.dt-datetime div.dt-datetime-iconRight { + position: absolute; + top: 5px; + right: 5px; +} +div.dt-datetime div.dt-datetime-iconRight button { + position: relative; + z-index: 1; +} +div.dt-datetime div.dt-datetime-iconRight:after { + position: absolute; + top: 7px; + left: 12px; + display: block; + content: ""; + border-top: 7px solid transparent; + border-left: 7px solid black; + border-bottom: 7px solid transparent; +} +div.dt-datetime-error { + clear: both; + padding: 0 1em; + max-width: 240px; + font-size: 11px; + line-height: 1.25em; + text-align: center; + color: #b11f1f; +} +html.dark input.dt-datetime { + color-scheme: dark; +} +html.dark div.dt-datetime { + border: 1px solid #595b5e; + background-color: #212529; + box-shadow: 3px 4px 10px 1px rgba(0, 0, 0, 0.8); +} +html.dark div.dt-datetime table th { + color: #ccc; +} +html.dark div.dt-datetime table td { + color: #eee; +} +html.dark div.dt-datetime table td.selectable { + background: #373c41; +} +html.dark div.dt-datetime table td.selectable.disabled { + color: #aaa; + background: #171b1f; +} +html.dark div.dt-datetime table td.selectable.disabled button:hover { + color: #aaa; + background: #171b1f; +} +html.dark div.dt-datetime table td.selectable.now { + background: #4b5055; +} +html.dark div.dt-datetime table td.selectable.selected button { + background: #6ea8fe; + color: black; +} +html.dark div.dt-datetime table td.selectable button:hover { + background: #ff8000; + color: black; +} +html.dark div.dt-datetime div.dt-datetime-label:hover { + border: 1px solid transparent; + background-color: rgba(255, 255, 255, 0.1); +} +html.dark div.dt-datetime div.dt-datetime-iconLeft:hover, +html.dark div.dt-datetime div.dt-datetime-iconRight:hover, +html.dark div.dt-datetime div.dt-datetime-iconUp:hover, +html.dark div.dt-datetime div.dt-datetime-iconDown:hover { + border: 1px solid transparent; + background-color: rgba(255, 255, 255, 0.1); +} +html.dark div.dt-datetime div.dt-datetime-iconLeft:after { + border-right-color: white; +} +html.dark div.dt-datetime div.dt-datetime-iconRight:after { + border-left-color: white; +} +html.dark div.dt-datetime select { + color-scheme: dark; +} +html.dark div.dt-datetime-error { + color: #b11f1f; +} + +table.dataTable thead tr > .dtfc-fixed-left, +table.dataTable thead tr > .dtfc-fixed-right, +table.dataTable tfoot tr > .dtfc-fixed-left, +table.dataTable tfoot tr > .dtfc-fixed-right { + top: 0; + bottom: 0; + z-index: 3; background-color: white; } -div.DTFC_Blocker { +table.dataTable tbody tr > .dtfc-fixed-left, +table.dataTable tbody tr > .dtfc-fixed-right { + z-index: 1; background-color: white; } -table.dataTable.table-striped.DTFC_Cloned tbody { +div.dtfc-left-top-blocker, +div.dtfc-right-top-blocker { background-color: white; } +html.dark table.dataTable thead tr > .dtfc-fixed-left, +html.dark table.dataTable thead tr > .dtfc-fixed-right, +html.dark table.dataTable tfoot tr > .dtfc-fixed-left, +html.dark table.dataTable tfoot tr > .dtfc-fixed-right { + background-color: var(--dt-html-background); +} +html.dark table.dataTable tbody tr > .dtfc-fixed-left, +html.dark table.dataTable tbody tr > .dtfc-fixed-right { + background-color: var(--dt-html-background); +} +html.dark div.dtfc-left-top-blocker, +html.dark div.dtfc-right-top-blocker { + background-color: var(--dt-html-background); +} +div.dtfc-right-top-blocker, +div.dtfc-left-top-blocker { + margin-top: 6px; + border-bottom: 0px solid #ddd !important; +} +table.dataTable.table-bordered.dtfc-has-left { + border-left: none; +} +div.dataTables_scroll.dtfc-has-left table.table-bordered { + border-left: none; +} +div.dataTables_scrollBody { + border-left: 1px solid #ddd !important; +} +div.dataTables_scrollFootInner table.table-bordered tr th:first-child, +div.dataTables_scrollHeadInner table.table-bordered tr th:first-child { + border-left: 1px solid #ddd !important; +} +html[data-bs-theme="dark"] table.dataTable thead tr > .dtfc-fixed-left, +html[data-bs-theme="dark"] table.dataTable thead tr > .dtfc-fixed-right, +html[data-bs-theme="dark"] table.dataTable tfoot tr > .dtfc-fixed-left, +html[data-bs-theme="dark"] table.dataTable tfoot tr > .dtfc-fixed-right { + background-color: var(--bs-body-bg); +} +html[data-bs-theme="dark"] table.dataTable tbody tr > .dtfc-fixed-left, +html[data-bs-theme="dark"] table.dataTable tbody tr > .dtfc-fixed-right { + background-color: var(--bs-body-bg); +} +html[data-bs-theme="dark"] div.dtfc-left-top-blocker, +html[data-bs-theme="dark"] div.dtfc-right-top-blocker { + background-color: var(--bs-body-bg); +} +html[data-bs-theme="dark"] div.dataTables_scrollBody { + border-left-color: var(--bs-border-color) !important; +} +html[data-bs-theme="dark"] + div.dataTables_scrollFootInner + table.table-bordered + tr + th:first-child, +html[data-bs-theme="dark"] + div.dataTables_scrollHeadInner + table.table-bordered + tr + th:first-child { + border-left-color: var(--bs-border-color) !important; +} table.dataTable.fixedHeader-floating, table.dataTable.fixedHeader-locked { @@ -286,9 +1407,6 @@ table.dataTable.fixedHeader-locked { margin-top: 0 !important; margin-bottom: 0 !important; } -table.dataTable.fixedHeader-floating { - position: fixed !important; -} table.dataTable.fixedHeader-locked { position: absolute !important; } @@ -297,6 +1415,10 @@ table.dataTable.fixedHeader-locked { display: none; } } +html[data-bs-theme="dark"] table.dataTable.fixedHeader-floating, +html[data-bs-theme="dark"] table.dataTable.fixedHeader-locked { + background-color: var(--bs-body-bg); +} table.dataTable.dtr-inline.collapsed > tbody > tr > td.child, table.dataTable.dtr-inline.collapsed > tbody > tr > th.child, @@ -308,38 +1430,26 @@ table.dataTable.dtr-inline.collapsed > tbody > tr > th.child:before, table.dataTable.dtr-inline.collapsed > tbody > tr > td.dataTables_empty:before { display: none !important; } -table.dataTable.dtr-inline.collapsed > tbody > tr[role="row"] > td.dtr-control, -table.dataTable.dtr-inline.collapsed > tbody > tr[role="row"] > th.dtr-control { - position: relative; - padding-left: 30px; +table.dataTable.dtr-inline.collapsed > tbody > tr > td.dtr-control, +table.dataTable.dtr-inline.collapsed > tbody > tr > th.dtr-control { cursor: pointer; } +table.dataTable.dtr-inline.collapsed > tbody > tr > td.dtr-control:before, +table.dataTable.dtr-inline.collapsed > tbody > tr > th.dtr-control:before { + margin-right: 0.5em; + display: inline-block; + color: rgba(0, 0, 0, 0.5); + content: "►"; +} table.dataTable.dtr-inline.collapsed > tbody - > tr[role="row"] - > td.dtr-control:before, + > tr + > td.dtr-control.arrow-right::before, table.dataTable.dtr-inline.collapsed > tbody - > tr[role="row"] - > th.dtr-control:before { - top: 50%; - left: 5px; - height: 1em; - width: 1em; - margin-top: -9px; - display: block; - position: absolute; - color: white; - border: 0.15em solid white; - border-radius: 1em; - box-shadow: 0 0 0.2em #444; - box-sizing: content-box; - text-align: center; - text-indent: 0 !important; - font-family: "Courier New", Courier, monospace; - line-height: 1em; - content: "+"; - background-color: #0275d8; + > tr + > th.dtr-control.arrow-right::before { + content: "◄"; } table.dataTable.dtr-inline.collapsed > tbody @@ -349,65 +1459,37 @@ table.dataTable.dtr-inline.collapsed > tbody > tr.parent > th.dtr-control:before { - content: "-"; - background-color: #d33333; + content: "▼"; } table.dataTable.dtr-inline.collapsed.compact > tbody > tr > td.dtr-control, table.dataTable.dtr-inline.collapsed.compact > tbody > tr > th.dtr-control { - padding-left: 27px; -} -table.dataTable.dtr-inline.collapsed.compact - > tbody - > tr - > td.dtr-control:before, -table.dataTable.dtr-inline.collapsed.compact - > tbody - > tr - > th.dtr-control:before { - left: 4px; - height: 14px; - width: 14px; - border-radius: 14px; - line-height: 14px; - text-indent: 3px; + padding-left: 0.333em; } table.dataTable.dtr-column > tbody > tr > td.dtr-control, table.dataTable.dtr-column > tbody > tr > th.dtr-control, table.dataTable.dtr-column > tbody > tr > td.control, table.dataTable.dtr-column > tbody > tr > th.control { - position: relative; cursor: pointer; } table.dataTable.dtr-column > tbody > tr > td.dtr-control:before, table.dataTable.dtr-column > tbody > tr > th.dtr-control:before, table.dataTable.dtr-column > tbody > tr > td.control:before, table.dataTable.dtr-column > tbody > tr > th.control:before { - top: 50%; - left: 50%; - height: 0.8em; - width: 0.8em; - margin-top: -0.5em; - margin-left: -0.5em; - display: block; - position: absolute; - color: white; - border: 0.15em solid white; - border-radius: 1em; - box-shadow: 0 0 0.2em #444; - box-sizing: content-box; - text-align: center; - text-indent: 0 !important; - font-family: "Courier New", Courier, monospace; - line-height: 1em; - content: "+"; - background-color: #0275d8; + display: inline-block; + color: rgba(0, 0, 0, 0.5); + content: "►"; +} +table.dataTable.dtr-column > tbody > tr > td.dtr-control.arrow-right::before, +table.dataTable.dtr-column > tbody > tr > th.dtr-control.arrow-right::before, +table.dataTable.dtr-column > tbody > tr > td.control.arrow-right::before, +table.dataTable.dtr-column > tbody > tr > th.control.arrow-right::before { + content: "◄"; } table.dataTable.dtr-column > tbody > tr.parent td.dtr-control:before, table.dataTable.dtr-column > tbody > tr.parent th.dtr-control:before, table.dataTable.dtr-column > tbody > tr.parent td.control:before, table.dataTable.dtr-column > tbody > tr.parent th.control:before { - content: "-"; - background-color: #d33333; + content: "▼"; } table.dataTable > tbody > tr.child { padding: 0.5em 1em; @@ -429,6 +1511,7 @@ table.dataTable > tbody > tr.child ul.dtr-details > li:first-child { padding-top: 0; } table.dataTable > tbody > tr.child ul.dtr-details > li:last-child { + padding-bottom: 0; border-bottom: none; } table.dataTable > tbody > tr.child span.dtr-title { @@ -453,7 +1536,8 @@ div.dtr-modal div.dtr-modal-display { bottom: 0; right: 0; width: 50%; - height: 50%; + height: fit-content; + max-height: 75%; overflow: auto; margin: auto; z-index: 102; @@ -465,7 +1549,10 @@ div.dtr-modal div.dtr-modal-display { } div.dtr-modal div.dtr-modal-content { position: relative; - padding: 1em; + padding: 2.5em; +} +div.dtr-modal div.dtr-modal-content h2 { + margin-top: 0; } div.dtr-modal div.dtr-modal-close { position: absolute; @@ -473,16 +1560,11 @@ div.dtr-modal div.dtr-modal-close { right: 6px; width: 22px; height: 22px; - border: 1px solid #eaeaea; - background-color: #f9f9f9; text-align: center; border-radius: 3px; cursor: pointer; z-index: 12; } -div.dtr-modal div.dtr-modal-close:hover { - background-color: #eaeaea; -} div.dtr-modal div.dtr-modal-background { position: fixed; top: 0; @@ -497,18 +1579,22 @@ div.dtr-modal div.dtr-modal-background { width: 95%; } } +html.dark table.dataTable > tbody > tr > td.dtr-control:before { + color: rgba(255, 255, 255, 0.5) !important; +} +html.dark table.dataTable > tbody > tr.child ul.dtr-details > li { + border-bottom-color: rgb(64, 67, 70); +} +html.dark div.dtr-modal div.dtr-modal-display { + background-color: rgb(33, 37, 41); + border: 1px solid rgba(255, 255, 255, 0.15); +} div.dtr-bs-modal table.table tr:first-child td { border-top: none; } -table.dataTable.dtr-inline.collapsed.table-sm - > tbody - > tr - > td:first-child:before, -table.dataTable.dtr-inline.collapsed.table-sm - > tbody - > tr - > th:first-child:before { - top: 5px; +table.dataTable.table-bordered th.dtr-control.dtr-hidden + *, +table.dataTable.table-bordered td.dtr-control.dtr-hidden + * { + border-left-width: 1px; } div.dts { @@ -523,7 +1609,7 @@ div.dts div.dts_loading { } div.dts div.dts_label { position: absolute; - right: 10px; + right: 20px; background: rgba(0, 0, 0, 0.8); color: white; box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.5); @@ -536,19 +1622,42 @@ div.dts div.dts_label { div.dts div.dataTables_scrollBody { background: repeating-linear-gradient( 45deg, - #edeeff, - #edeeff 10px, - #fff 10px, - #fff 20px + rgba(0, 0, 0, 0.025), + rgba(0, 0, 0, 0.025) 10px, + rgba(0, 0, 0, 0) 10px, + rgba(0, 0, 0, 0) 20px ); } div.dts div.dataTables_scrollBody table { + background-color: white; z-index: 2; } +div.dts div.dt-length, +div.dts div.dt-paging, div.dts div.dataTables_paginate, div.dts div.dataTables_length { display: none; } +html.dark div.dts div.dts_label { + background: rgba(255, 255, 255, 0.8); + color: black; +} +html.dark div.dts div.dataTables_scrollBody { + background: repeating-linear-gradient( + 45deg, + rgba(255, 255, 255, 0.025), + rgba(255, 255, 255, 0.025) 10px, + rgba(255, 255, 255, 0) 10px, + rgba(255, 255, 255, 0) 20px + ); +} +html.dark div.dts div.dataTables_scrollBody table { + background-color: var(--dt-html-background); + z-index: 2; +} div.DTS div.dataTables_scrollBody table { background-color: white; } +html[data-bs-theme="dark"] div.DTS div.dataTables_scrollBody table { + background-color: var(--bs-body-bg); +} diff --git a/assets/js/dataTables.buttons.min.js b/assets/js/dataTables.buttons.min.js index 7874b7e3..8c3be939 100644 --- a/assets/js/dataTables.buttons.min.js +++ b/assets/js/dataTables.buttons.min.js @@ -1,44 +1,4 @@ -/*! - Buttons for DataTables 1.6.4 - ©2016-2020 SpryMedia Ltd - datatables.net/license -*/ -(function(e){"function"===typeof define&&define.amd?define(["jquery","datatables.net"],function(A){return e(A,window,document)}):"object"===typeof exports?module.exports=function(A,z){A||(A=window);z&&z.fn.dataTable||(z=require("datatables.net")(A,z).$);return e(z,A,A.document)}:e(jQuery,window,document)})(function(e,A,z,u){function E(a,b,c){e.fn.animate?a.stop().fadeIn(b,c):(a.css("display","block"),c&&c.call(a))}function F(a,b,c){e.fn.animate?a.stop().fadeOut(b,c):(a.css("display","none"),c&&c.call(a))} -function H(a,b){a=new t.Api(a);b=b?b:a.init().buttons||t.defaults.buttons;return(new w(a,b)).container()}var t=e.fn.dataTable,M=0,N=0,x=t.ext.buttons,w=function(a,b){if(!(this instanceof w))return function(c){return(new w(c,a)).container()};"undefined"===typeof b&&(b={});!0===b&&(b={});Array.isArray(b)&&(b={buttons:b});this.c=e.extend(!0,{},w.defaults,b);b.buttons&&(this.c.buttons=b.buttons);this.s={dt:new t.Api(a),buttons:[],listenKeys:"",namespace:"dtb"+M++};this.dom={container:e("<"+this.c.dom.container.tag+ -"/>").addClass(this.c.dom.container.className)};this._constructor()};e.extend(w.prototype,{action:function(a,b){a=this._nodeToButton(a);if(b===u)return a.conf.action;a.conf.action=b;return this},active:function(a,b){var c=this._nodeToButton(a);a=this.c.dom.button.active;c=e(c.node);if(b===u)return c.hasClass(a);c.toggleClass(a,b===u?!0:b);return this},add:function(a,b){var c=this.s.buttons;if("string"===typeof b){b=b.split("-");var d=this.s;c=0;for(var h=b.length-1;c"),l.conf._collection=l.collection,this._expandButton(l.buttons,l.conf.buttons,!0,d)),m.init&&m.init.call(h.button(l.node),h,e(l.node),m),f++)}}},_buildButton:function(a,b){var c=this.c.dom.button, -d=this.c.dom.buttonLiner,h=this.c.dom.collection,f=this.s.dt,k=function(n){return"function"===typeof n?n(f,l,a):n};b&&h.button&&(c=h.button);b&&h.buttonLiner&&(d=h.buttonLiner);if(a.available&&!a.available(f,a))return!1;var g=function(n,p,v,y){y.action.call(p.button(v),n,p,v,y);e(p.table().node()).triggerHandler("buttons-action.dt",[p.button(v),p,v,y])};h=a.tag||c.tag;var m=a.clickBlurs===u?!0:a.clickBlurs,l=e("<"+h+"/>").addClass(c.className).attr("tabindex",this.s.dt.settings()[0].iTabIndex).attr("aria-controls", -this.s.dt.table().node().id).on("click.dtb",function(n){n.preventDefault();!l.hasClass(c.disabled)&&a.action&&g(n,f,l,a);m&&l.trigger("blur")}).on("keyup.dtb",function(n){13===n.keyCode&&!l.hasClass(c.disabled)&&a.action&&g(n,f,l,a)});"a"===h.toLowerCase()&&l.attr("href","#");"button"===h.toLowerCase()&&l.attr("type","button");d.tag?(h=e("<"+d.tag+"/>").html(k(a.text)).addClass(d.className),"a"===d.tag.toLowerCase()&&h.attr("href","#"),l.append(h)):l.html(k(a.text));!1===a.enabled&&l.addClass(c.disabled); -a.className&&l.addClass(a.className);a.titleAttr&&l.attr("title",k(a.titleAttr));a.attr&&l.attr(a.attr);a.namespace||(a.namespace=".dt-button-"+N++);d=(d=this.c.dom.buttonContainer)&&d.tag?e("<"+d.tag+"/>").addClass(d.className).append(l):l;this._addKey(a);this.c.buttonCreated&&(d=this.c.buttonCreated(a,d));return{conf:a,node:l.get(0),inserter:d,buttons:[],inCollection:b,collection:null}},_nodeToButton:function(a,b){b||(b=this.s.buttons);for(var c=0,d=b.length;c").addClass("dt-button-collection").addClass(h.collectionLayout).css("display","none");a=e(a).addClass(h.contentClassName).attr("role","menu").appendTo(c);f.attr("aria-expanded","true");f.parents("body")[0]!==z.body&&(f=z.body.lastChild);h.collectionTitle&&c.prepend('
'+h.collectionTitle+"
");E(c.insertAfter(f),h.fade);d=e(b.table().container());var g=c.css("position");"dt-container"===h.align&&(f=f.parent(),c.css("width",d.width()));if("absolute"=== -g&&(c.hasClass(h.rightAlignClassName)||c.hasClass(h.leftAlignClassName)||"dt-container"===h.align)){var m=f.position();c.css({top:m.top+f.outerHeight(),left:m.left});var l=c.outerHeight(),n=d.offset().top+d.height(),p=m.top+f.outerHeight()+l;n=p-n;p=m.top-l;var v=d.offset().top,y=m.top-l-5;(n>v-p||h.dropup)&&-yg+ -r&&(g=m-(g+r),d-=q+r,r=g>d?r+d:r+g)):(r=m-g,dd?r+d:r+g));c.css("left",c.position().left+r)}else"absolute"===g?(m=f.position(),c.css({top:m.top+f.outerHeight(),left:m.left}),l=c.outerHeight(),g=f.offset().top,r=0,r=f.offset().left,B=f.outerWidth(),B=r+B,g=c.offset().left,q=a.width(),q=g+q,y=m.top-l-5,n=d.offset().top+d.height(),p=m.top+f.outerHeight()+l,n=p-n,p=m.top-l,v=d.offset().top,(n>v-p||h.dropup)&&-ye(A).height()/2&&(g=e(A).height()/2),c.css("marginTop",-1*g));h.background&&w.background(!0,h.backgroundClassName,h.fade,f);e("div.dt-button-background").on("click.dtb-collection",function(){});e("body").on("click.dtb-collection",function(C){var I=e.fn.addBack?"addBack":"andSelf",J=e(C.target).parent()[0];(!e(C.target).parents()[I]().filter(a).length&&!e(J).hasClass("dt-buttons")||e(C.target).hasClass("dt-button-background"))&&k()}).on("keyup.dtb-collection", -function(C){27===C.keyCode&&k()});h.autoClose&&setTimeout(function(){b.on("buttons-action.b-internal",function(C,I,J,O){O[0]!==f[0]&&k()})},0);e(c).trigger("buttons-popover.dt")}});w.background=function(a,b,c,d){c===u&&(c=400);d||(d=z.body);a?E(e("
").addClass(b).css("display","none").insertAfter(d),c):F(e("div."+b),c,function(){e(this).removeClass(b).remove()})};w.instanceSelector=function(a,b){if(a===u||null===a)return e.map(b,function(f){return f.inst});var c=[],d=e.map(b,function(f){return f.name}), -h=function(f){if(Array.isArray(f))for(var k=0,g=f.length;k"+a+"":"";E(e('
').html(a).append(e("
")["string"=== -typeof b?"html":"append"](b)).css("display","none").appendTo("body"));c!==u&&0!==c&&(D=setTimeout(function(){d.buttons.info(!1)},c));this.on("destroy.btn-info",function(){d.buttons.info(!1)});return this});t.Api.register("buttons.exportData()",function(a){if(this.context.length)return P(new t.Api(this.context[0]),a)});t.Api.register("buttons.exportInfo()",function(a){a||(a={});var b=a;var c="*"===b.filename&&"*"!==b.title&&b.title!==u&&null!==b.title&&""!==b.title?b.title:b.filename;"function"=== -typeof c&&(c=c());c===u||null===c?c=null:(-1!==c.indexOf("*")&&(c=c.replace("*",e("head > title").text()).trim()),c=c.replace(/[^a-zA-Z0-9_\u00A1-\uFFFF\.,\-_ !\(\)]/g,""),(b=G(b.extension))||(b=""),c+=b);b=G(a.title);b=null===b?null:-1!==b.indexOf("*")?b.replace("*",e("head > title").text()||"Exported data"):b;return{filename:c,title:b,messageTop:K(this,a.message||a.messageTop,"top"),messageBottom:K(this,a.messageBottom,"bottom")}});var G=function(a){return null===a||a===u?null:"function"===typeof a? -a():a},K=function(a,b,c){b=G(b);if(null===b)return null;a=e("caption",a.table().container()).eq(0);return"*"===b?a.css("caption-side")!==c?null:a.length?a.text():"":b},L=e("