☰

Craft Pro

Provides Dark Mode for Craft CMS as well as a few small but useful features

//
// Written by Glenn Wiking
// Script Version: 0.0.1
//
//
// ==UserScript==
// @name        Craft Pro
// @namespace   CP
// @description Provides Dark Mode for Craft CMS as well as a few small but useful features
// @version     0.0.1
// @icon        http://laserdays.ddev.site/cpresources/4268e89/images/icons/safari-pinned-tab.svg
// @license			MIT

// @include		*://*/admin/*
// @include  	*.staging.liveavirgin.*

// @require		https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js 
// @require		https://cdn.jsdelivr.net/npm/js-cookie@2/src/js.cookie.min.js

// ==/UserScript==


const iconSections = "<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'><path d='M160 64c-17.7 0-32 14.3-32 32l0 320c0 11.7-3.1 22.6-8.6 32L432 448c26.5 0 48-21.5 48-48l0-304c0-17.7-14.3-32-32-32L160 64zM64 480c-35.3 0-64-28.7-64-64L0 160c0-35.3 28.7-64 64-64l0 32c-17.7 0-32 14.3-32 32l0 256c0 17.7 14.3 32 32 32s32-14.3 32-32L96 96c0-35.3 28.7-64 64-64l288 0c35.3 0 64 28.7 64 64l0 304c0 44.2-35.8 80-80 80L64 480zM384 112c0-8.8 7.2-16 16-16l32 0c8.8 0 16 7.2 16 16s-7.2 16-16 16l-32 0c-8.8 0-16-7.2-16-16zm0 64c0-8.8 7.2-16 16-16l32 0c8.8 0 16 7.2 16 16s-7.2 16-16 16l-32 0c-8.8 0-16-7.2-16-16zm0 64c0-8.8 7.2-16 16-16l32 0c8.8 0 16 7.2 16 16s-7.2 16-16 16l-32 0c-8.8 0-16-7.2-16-16zM160 304c0-8.8 7.2-16 16-16l256 0c8.8 0 16 7.2 16 16s-7.2 16-16 16l-256 0c-8.8 0-16-7.2-16-16zm0 64c0-8.8 7.2-16 16-16l256 0c8.8 0 16 7.2 16 16s-7.2 16-16 16l-256 0c-8.8 0-16-7.2-16-16zm32-144l128 0 0-96-128 0 0 96zM160 120c0-13.3 10.7-24 24-24l144 0c13.3 0 24 10.7 24 24l0 112c0 13.3-10.7 24-24 24l-144 0c-13.3 0-24-10.7-24-24l0-112z'></path></svg>"
const iconEntryTypes = "<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'><path d='M160 384c-17.7 0-32-14.3-32-32l0-288c0-17.7 14.3-32 32-32l144 0 0 80c0 17.7 14.3 32 32 32l80 0c0 .3 0 .5 0 .8L416 352c0 17.7-14.3 32-32 32l-224 0zM336 57.5L390 112l-54 0 0-54.5zM160 0C124.7 0 96 28.7 96 64l0 288c0 35.3 28.7 64 64 64l224 0c35.3 0 64-28.7 64-64l0-207.2c0-12.7-5-24.8-13.9-33.8l-96-96.8C329.1 5.1 316.8 0 304 0L160 0zM32 112c0-8.8-7.2-16-16-16s-16 7.2-16 16L0 384c0 70.7 57.3 128 128 128l208 0c8.8 0 16-7.2 16-16s-7.2-16-16-16l-208 0c-53 0-96-43-96-96l0-272z'></path></svg>"
const iconFields = "<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'><path d='M454.6 45.3l12.1 12.1c12.5 12.5 12.5 32.8 0 45.3L440 129.4 382.6 72l26.7-26.7c12.5-12.5 32.8-12.5 45.3 0zM189 265.6l171-171L417.4 152l-171 171c-4.2 4.2-9.6 7.2-15.4 8.6l-65.6 15.1L180.5 281c1.3-5.8 4.3-11.2 8.6-15.4zm197.7-243L166.4 243c-8.5 8.5-14.4 19.2-17.1 30.9l-20.9 90.6c-1.2 5.4 .4 11 4.3 14.9s9.5 5.5 14.9 4.3l90.6-20.9c11.7-2.7 22.4-8.6 30.9-17.1L489.4 125.3c25-25 25-65.5 0-90.5L477.3 22.6c-25-25-65.5-25-90.5 0zM80 64C35.8 64 0 99.8 0 144L0 432c0 44.2 35.8 80 80 80l288 0c44.2 0 80-35.8 80-80l0-128c0-8.8-7.2-16-16-16s-16 7.2-16 16l0 128c0 26.5-21.5 48-48 48L80 480c-26.5 0-48-21.5-48-48l0-288c0-26.5 21.5-48 48-48l128 0c8.8 0 16-7.2 16-16s-7.2-16-16-16L80 64z'></path></svg>"
const iconBulb = "<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 384 512'><path d='M272 384c9.6-31.9 29.5-59.1 49.2-86.2c0 0 0 0 0 0c5.2-7.1 10.4-14.2 15.4-21.4c19.8-28.5 31.4-63 31.4-100.3C368 78.8 289.2 0 192 0S16 78.8 16 176c0 37.3 11.6 71.9 31.4 100.3c5 7.2 10.2 14.3 15.4 21.4c0 0 0 0 0 0c19.8 27.1 39.7 54.4 49.2 86.2l160 0zM192 512c44.2 0 80-35.8 80-80l0-16-160 0 0 16c0 44.2 35.8 80 80 80zM112 176c0 8.8-7.2 16-16 16s-16-7.2-16-16c0-61.9 50.1-112 112-112c8.8 0 16 7.2 16 16s-7.2 16-16 16c-44.2 0-80 35.8-80 80z'></path></svg>"
let styleBase = "";
let styleBookmarks = "";
let styleDarkmode = "";


styleBase = ""
+ ".darkmode-toggler {display: flex; flex-direction: row; justify-content: flex-start; align-items: flex-start; gap: 8px; cursor: pointer; padding: 5px 0;}"
+ ".darkmode-toggler > svg {height: 22px; width: 20px; fill: var(--blue-600);}"
+ ".darkmode-toggler > span {width: auto; display: inline-block; color: var(--blue-600);}"
+ ".pro-autotrace-cont {margin-bottom: 18px; margin-top: -10px;}"
+ "";

stylesheet( "style-base", "Base styles", styleBase );

console.log( $(".sidebar-actions") );
$(".sidebar-actions").before("<div class='cp-bookmarks'></div>");
$(".cp-bookmarks").append("<a class='cp-bookmark' href='http://laserdays.ddev.site/admin/settings/sections' nth='0'>"+ iconSections +"</a>");
$(".cp-bookmarks").append("<a class='cp-bookmark' href='http://laserdays.ddev.site/admin/settings/entry-types' nth='1'>"+ iconEntryTypes +"</a>");
$(".cp-bookmarks").append("<a class='cp-bookmark' href='http://laserdays.ddev.site/admin/settings/fields' nth='2'>"+ iconFields +"</a>");

// Bookmarks
styleBookmarks = ""
+ ".cp-bookmarks {height: 60px; padding: 8px 16px; display: flex; justify-content: space-between; border-bottom: 1px solid var(--gray-150); align-items: center;}"
+ ".cp-bookmark {height: 20.2px; width: 20px}"
+ "#global-sidebar[data-state='collapsed'] .cp-bookmarks {display: none}"
+ "";

if ( $(".cp-bookmarks").length ) {
  $("head").append("<style class='style-bookmarks'>"+ styleBookmarks +"</style>");
}

// Dark Mode
styleDarkmode = ""
+ "a {color: var(--blue-400);}"
+ ".light {color: var(--gray-200) !important;}"
+ ".global-sidebar {background-color: var(--gray-1000)}"
+ ".sidebar-action, .dark .darkmode-toggler span, .h4, .h5, h4, h5 {color: var(--gray-100)}"
+ ".dark .darkmode-toggler svg {fill: var(--gray-100)}"
+ ".dark .darkmode-toggler:hover::after {content: ''; background: var(--gray-600); position: absolute; left: -13px; width: calc(100% + 13px); margin-top: -10px; height: 43px; z-index: -1;}"
+ ".sel .sidebar-action {color: var(--gray-100)}"
+ ".nav-item.sel, .sidebar-action:hover, .sidebar-action:focus-visible, .menu-item.sel {background-color: var(--gray-800); color: var(--gray-100)}"
+ "#global-sidebar #system-info {color: var(--gray-050)}"
+ "#global-sidebar #system-info:hover {background-color: var(--gray-800)}"
+ "#system-info #site-icon {filter: invert(1)}"
+ ".cp-bookmarks {border-bottom: 1px solid var(--gray-800)}"
+ ".cp-bookmark {fill: var(--gray-100)}"
+ "#global-header, #notifications .notification, #language-menu, .menu, .ui-datepicker, .ui-timepicker-list {background-color: var(--gray-800)}"
+ "#crumb-list li.crumb > .crumb-link, #sites-btn, #notifications .notification, .btn, #language-menu .menu-item, #account-menu ul li a {color: var(--blue-050)}"
+ "#crumb-list li.crumb > .crumb-link:hover, #global-header .btn:hover, #user-info:hover::after {color: var(--blue-200)}"
+ "#crumb-list li.crumb:not(.current)::after, #crumb-list li.crumb:not(.current)::before {filter: invert(1); mix-blend-mode: multiply;}"
+ ".context-label, .context-menu-container {border: 1px solid var(--gray-900)}"
+ "#user-info .header-photo .thumb.rounded {background-color: #FFF; border-radius: 50%;}"
+ "#user-info::after, .menu-toggle::after, .menubtn:not(.action-btn)::after {border-color: var(--gray-050);}"
+ ".context-menu-container .menubtn:not(.action-btn) {border-inline-start: 1px solid var(--gray-900);}"
+ ".nav-item__trigger .menubtn:hover, .menu--disclosure ul li > .menu-item:hover, .menu--disclosure ul li > .menu-option:hover, .menu--disclosure ul li > a:not(.crumb-link):hover {background-color: var(--gray-600); color: var(--blue-050);}"
+ ".global-sidebar__footer {border-block-start: 1px solid var(--gray-800);}"
+ "#user-info:hover::after {border-color: var(--blue-200):}"
+ "#page-container {background-color: var(--gray-900); color: var(--gray-050);}"
+ "hr {border-bottom: 1px solid var(--gray-550);}"
+ "#page-container .pane, #trial-info, .content-pane {background: var(--gray-1000); box-shadow: 0 0 0 1px rgba(0,0,0,.2), 0 2px 12px rgba(0,0,0,.25);}"
+ "#page-container .back > .pane {background: var(--gray-1000);}"
+ "#page-container .pane .cs-opt:hover {background: var(--gray-800);}"
+ "#page-container .pane .cs-screen-home .cs-opt p {color: var(--gray-300);}"
+ "#page-container .pane .cs-screen-home .cs-opt:not(:first-child) {border-block-start: 1px solid var(--gray-800);}"
+ ".main {background: var(--gray-1000); color: var(--gray-050);}"
+ "table.data tbody tr:not(.disabled):hover td, table.data tbody tr:not(.disabled):hover th {background-color: var(--gray-900);}"
+ ".hud .tip-top {filter: brightness(0.1);}"
+ ".slide-picker a {border: 1px solid var(--gray-200);}"
+ ".active-hover, .last-active-hover {border: 1px solid var(--gray-400) !important;}"
+ ".sidebar nav li a .label {color: var(--blue-100);}"
+ ".sidebar .heading .type-heading-small, .sidebar .heading > span {color: var(--gray-300);}"
+ "#sidebar nav li a:not(.sel):hover {background-color: var(--gray-800);}"
+ "@supports ((-webkit-backdrop-filter:blur(10px)) or (backdrop-filter:blur(10px))) {body.fixed-header #header { -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); background-color: rgba(120,120,125,.55); }}"
+ "table.data thead td, table.data thead th {background-color: var(--gray-700);}"
+ "#footer {background: var(--gray-1000); border-block-start: 2px solid var(--gray-800);}"
+ "@supports ((-webkit-backdrop-filter:blur(10px)) or (backdrop-filter:blur(10px))) {#footer.stuck {background-color: rgba(50,50,55,.85);}}"
+ "#toolbar .text {background-color: var(--gray-1000);}"
+ ".field p, .select:not(.selectize) select {color: var(--gray-100);}"
+ "p .code, p code {background-color: var(--blue-900);}"
+ ".card .label a.label-link, .chip .label a.label-link {color: var(--blue-300);}"
+ ".selectize.multiselect .selectize-input, .text > input, .text > textarea, input.text, table.editable textarea, textarea.text {background-color: var(--gray-900); color: var(--gray-200); border: 1px solid var(--gray-400);}"
+ ".site--default .text-gray-600 {color: var(--gray-300);}"
+ ".icon.delete::before {color: var(--gray-050);}"
+ "table.data.vuetable th.sortable:hover, .btn:hover:not(.chromeless) {background-color: var(--gray-600); color: var(--gray-050);}"
+ ".status-label .status-label-text {color: var(--gray-200);}"
+ ".status-label.teal, .status-label.turquoise {--status-label-text-color: var(--teal-200); --status-label-bg-color: var(--bg-enabled);}"
+ ".link-input > .flex > div.text-link {background-color: var(--gray-800);}"
+ ".context-label, .context-menu-container {color: var(--gray-300);}"
+ ".menu ul li .menu-item:not(.flex, .hidden), .menu ul li .menu-option:not(.flex, .hidden), .menu ul li a:not(.flex, .hidden) {color: var(--blue-300);}"
+ ".menu-group h3 {color: var(--gray-150);}"
+ ".pane-header {background-color: var(--gray-800); box-shadow: 0 0 0 1px rgba(0,0,0,.2), 0 2px 12px rgba(0,0,0,.25);}"
+ ".pane-tabs [role='tablist'] [role='tab'], #details .details .meta:not(.read-only, .warning), .card:not(.chromeless, .hairline), .chip:not(.chromeless, .hairline), .matrixblock:not(.chromeless, .hairline) {box-shadow: 0 0 0 1px rgba(0,0,0,.2), 0 2px 12px rgba(0,0,0,.25) !important;}"
+ ".pane-tabs [role='tablist'] [role='tab'] .tab-label {background-color: var(--gray-700); color: var(--gray-100);}"
+ ".pane-tabs [role='tablist'] [role='tab']:not([aria-selected='true']):hover .tab-label {background-color: var(--gray-800); color: var(--gray-100);}"
+ ".pane-tabs [role='tablist'] [role='tab'][aria-selected='true'] .tab-label {background-color: var(--gray-1000); color: var(--gray-100);}"
+ "#details-toggle > button:focus .details-toggle__inner, #details-toggle > button:focus-visible .details-toggle__inner, #details-toggle > button:hover .details-toggle__inner {background-color: var(--gray-200);}"
+ "#details .details .meta:not(.read-only, .warning) {background: var(--gray-800);}"
+ ".details .meta > .data > .heading, .details .meta > .data > .heading > label, .details .meta > .field > .heading, .details .meta > .field > .heading > label {color: var(--gray-100); background: var(--gray-800);}"
+ ".details .meta:not(.read-only) {background-color: var(--gray-1000) !important;}"
+ "@media screen and (min-width: 400px) {.meta > .field > .heading, .meta > .flex-fields > .field > .heading {border-inline-end: 1px solid var(--gray-700);}}"
+ ".card:not(.chromeless, .hairline), .chip:not(.chromeless, .hairline), .matrixblock:not(.chromeless, .hairline) {background-color: var(--gray-800,var(--gray-700));}"
+ ".chip > .thumb.rounded img, .chip > .thumb.rounded svg {background-color: #FFF;}"
+ ".card:not(.chromeless)::before, .chip:not(.chromeless)::before, .matrixblock:not(.chromeless)::before {box-shadow: inset 0 0 0 1px var(--gray-500,var(--gray-200));}"
+ "#details .details > .field > .input > .text.fullwidth {background: var(--gray-1000) !important; box-shadow: 0 0 0 1px rgba(0,0,0,.2), 0 2px 12px rgba(0,0,0,.25) !important;}"
+ ".cp-icon svg {filter: brightness(4);}"
+ ".tableview .cp-icon svg {filter: brightness(1);}"
+ ".cp-icon svg circle, .cp-icon svg ellipse, .cp-icon svg line, .cp-icon svg path, .cp-icon svg polygon, .cp-icon svg polyline, .cp-icon svg rect, .cp-icon svg text {fill: var(--blue-400,var(--ui-control-color));}"
+ ".tableview [data-title='Link'] svg path {fill: var(--blue-400) !important;}"
+ "#details-toggle > button .details-toggle__inner {background-color: var(--gray-1000); border: 1px solid var(--gray-500);}"
+ "#details-toggle > button:focus .details-toggle__inner, #details-toggle > button:focus-visible .details-toggle__inner, #details-toggle > button:hover .details-toggle__inner {background-color: var(--gray-700);}"
+ "body:not(.dragging) table.data thead th.orderable:not(.ordered):hover {background-color: var(--gray-600);}"
+ "table.data thead th.orderable.ordered {background-color: var(--gray-1000);}"
+ "flex-fields > :not(h2, hr, .line-break)::before, .flex-fields > :not(h2, hr, .line-break):last-child::before {background-color: var(--blue-700);}"
+ ".meta dd {color: var(--blue-300);}"
+ ".element-index .source-path {background-color: var(--gray-800);}"
+ ".element-index .source-path .chevron-btns {background: var(--gray-800-hsl);}"
+ ".element-index .source-path .chevron-btns::after {border-block-end: calc(var(--ui-control-height)/2) solid var(--gray-800) !important;}"
+ ".element-index .source-path .chevron-btns::before {border-block-start: calc(var(--ui-control-height)/2) solid var(--gray-800) !important;}"
+ ".so-content {background: var(--gray-900);}"
+ "@container (width > 700px) {.slideout.showing-sidebar .so-body > .so-content {border-inline-end: 1px solid var(--gray-1000);}}"
+ ".slideout > .so-footer {background: var(--gray-900); box-shadow: 0 0 0 1px rgba(0,0,0,.2), 0 2px 12px rgba(0,0,0,.25);}"
+ ".slideout {background-color: var(--gray-1000); box-shadow: 0 0 0 1px rgba(0,0,0,.2), 0 2px 12px rgba(0,0,0,.25);}"
+ ".slideout.showing-sidebar .so-body > .so-sidebar {background: var(--gray-1000) !important;}"
+ ".so-body h2, .so-body .heading label, .field > .heading > label, .field > .heading > legend {color: var(--gray-100);}"
+ "svg text {color: var(--blue-050); fill: var(--blue-050)}"
+ ".hud .main, .modal .body$ {background: var(--gray-800);}"
+ ".apexcharts-tooltip {background-color: var(--gray-800);}"
+ ".apexcharts-tooltip {background: #222 !important; color: #FFF !important; border: 1px solid #444 !important; border-radius: 4px !important;} .apexcharts-tooltip-title { background: #333 !important; border-bottom: 1px solid #444 !important;}"
+ ".apexcharts-radialbar-hollow {fill: var(--gray-900);}"
+ "li.checkboxChecklist.checked {color: var(--green-400);}"
+ ".readable li + li {color: var(--gray-150);}"
+ ".warning {color: var(--gray-150) !important;}"
+ ".warning .code, .warning code {background-color: var(--blue-100); border-color: var(--blue-400); background-color: var(--blue-900);}"
+ ".notice {color: var(--blue-300) !important;}"
+ ".sidebar nav li a, .vue-treeselect__single-value {color: var(--gray-200);}"
+ "div.displaypreview {border: 1px solid var(--gray-700);}"
+ "div.vue-treeselect > div.vue-treeselect__control {background-color: var(--gray-900);}"
+ ".vue-treeselect__menu {background: var(--gray-900) !important;color: var(--gray-050) !important;border: 1px solid var(--gray-400) !important;}.vue-treeselect__option {background: transparent !important;color: var(--gray-050) !important;}.vue-treeselect__option--highlight {background: var(--gray-800) !important;} .vue-treeselect__option--selected {var(--gray-700) !important;font-weight: bold; }.vue-treeselect__option--disabled { var(--gray-400) !important;}"
+ ".vue-treeselect__control {background-color: var(--gray-900); border: 1px solid var(--gray-600)}"
+ "div.vue-treeselect__multi-value-item, span.vue-treeselect__value-remove {color: var(--gray-050); background-color: var(--gray-700);}"
+ ".vue-treeselect__value-remove {border-left: 1px solid var(--gray-400);}"
+ "body.ltr .monaco-editor-codefield {background: var(--gray-900);}"
+ "h4.metadata-title-separator span {background: var(--gray-700); color: var(--gray-100);}"
+ "div[style*='/no_image_set.png'] {filter: invert(1) contrast(0.7);}"
+ ".card-seo-twitter {border: 1px solid var(--gray-700); background-color: var(--gray-800);}"
+ ".card-seo-twitter:hover  {border: 1px solid var(--gray-600); background-color: var(--gray-700);}"
+ ".card-seo-twitter__title {color: var(--blue-200);}"
+ ".card-seo-twitter__description-summary {color: var(--gray-050);}"
+ ".card-seo-twitter__link {color: var(--blue-400);}"
+ "a.googleDisplay:visited {color: #C26EEC;}"
+ ".card-seo-google__url-title {color: #24BC55;}"
+ ".card-seo-google__description {color: var(--gray-150);}"
+ ".monaco-editor > .overflow-guard {filter: invert(0.9) hue-rotate(220deg) brightness(1.1);}"
+ ".card-seo-facebook__text {color: var(--gray-100); background: var(--gray-800); border: 1px solid var(--gray-550);}"
+ ".card-seo-facebook__link {color: var(--blue-200);}"
+ ".card-seo-facebook__title {color: var(--blue-400);}"
+ ".card-seo-facebook__description {color: var(--gray-200)}"
+ ".playground .sprig-component, .playground textarea.field, .playground input.field {background: var(--gray-800);}"
+ ".translate-table tr:nth-child(2n) td:not(:hover) {background-color: var(--gray-900) !important;}"
+ "#details-container .details > .field > .heading > label, #details-container .details > fieldset > legend {color: var(--blue-100);}"
+ ".draft-notice .discard-changes-btn {border: 2px solid var(--blue-300) !important; color: var(--blue-400) !important;}"
+ ".draft-notice {color: var(--blue-300);}"
+ ".ck.ck-editor__main > .ck-editor__editable {background: var(--gray-1000);}"
+ ".ck.ck-toolbar {background: var(--gray-800);}"
+ ".ck.ck-button.ck-button_with-text, a.ck.ck-button.ck-button_with-text, .ck.ck-toolbar > .ck-toolbar__items > :not(.ck-toolbar__line-break), .ck.ck-toolbar > .ck.ck-toolbar__grouped-dropdown, .ck-toolbar__items button, .ck-button {color: var(--gray-050) !important;}"
+ ".elements.busy::after {background: rgba(50,50,55,.75); mix-blend-mode: darken;}"
+ ".element-index-view-menu .menu-footer {background-color: var(--gray-800);}"
+ "div.checkbox, input.checkbox + label {color: var(--blue-050);}"
+ ".icon.move::before {color: var(--custom-text-color,var(--blue-300));}"
+ "th[data-title='Asset'] svg g path + path {fill: rgba(39, 52, 92, 0.8) !important}"
+ ".card > .card-actions-container > .card-actions > .action-btn::before, .card > .card-actions-container > .card-actions > .move::before, .card > .chip-content > .chip-actions > .action-btn::before, .card > .chip-content > .chip-actions > .move::before, .chip > .card-actions-container > .card-actions > .action-btn::before, .chip > .card-actions-container > .card-actions > .move::before, .chip > .chip-content > .chip-actions > .action-btn::before, .chip > .chip-content > .chip-actions > .move::before {color: var(--blue-050,var(--ui-control-color));}"
+ ".zilch {color: var(--blue-200);}"
+ ".select:not(.selectize) select {background-color: var(--gray-800);}"
+ ".select:not(.selectize)::after {color: var(--blue-050);}"
+ ".select:not(.selectize) select:hover:not(:disabled) {background-color: var(--gray-600);}"
+ "ul.icons li a {border: 1px solid var(--gray-500); color: var(--gray-050);}"
+ "ul.icons li a .icon.icon-mask svg circle, ul.icons li a .icon.icon-mask svg ellipse, ul.icons li a .icon.icon-mask svg line, ul.icons li a .icon.icon-mask svg path, ul.icons li a .icon.icon-mask svg polygon, ul.icons li a .icon.icon-mask svg polyline, ul.icons li a .icon.icon-mask svg rect, ul.icons li a .icon.icon-mask svg text {fill: var(--gray-100);}"
+ "ul.icons li a:hover {background-color: var(--gray-800); border-color: var(--gray-300);}"
+ "ul.icons li a:hover .icon.icon-mask svg circle, ul.icons li a:hover .icon.icon-mask svg ellipse, ul.icons li a:hover .icon.icon-mask svg line, ul.icons li a:hover .icon.icon-mask svg path, ul.icons li a:hover .icon.icon-mask svg polygon, ul.icons li a:hover .icon.icon-mask svg polyline, ul.icons li a:hover .icon.icon-mask svg rect, ul.icons li a:hover .icon.icon-mask svg text {fill: var(--gray-150);}"
+ ".selectize.select .selectize-control, .selectize.select .selectize-input, .selectize-input, #live-selectized, .selectize-control.single .selectize-input.input-active, .selectize-input, body .selectize-dropdown-content {background-color: var(--gray-800); color: var(--gray-100);}"
+ ".selectize.select .selectize-control::after {color: var(--gray-100);}"
+ "body .selectize-dropdown .active:not(.selected), body .selectize-dropdown .option:hover {background-color: var(--gray-700)}"
+ ".optgroup .option {color: var(--gray-050);}"
+ ".modal .body {background: var(--gray-1000); background: var(--gray-1000); border: none; box-shadow: 0 0 0 1px rgba(0,0,0,.2), 0 2px 12px rgba(0,0,0,.25);}"
+ ".readable .h1, .readable h1 {color: var(--blue-050);}"
+ ".login-modal-intro p {color: var(--gray-300);}"
+ ".CodeMirror, .border-box, .multiselect > select, .passwordwrapper, .selectize.multiselect .selectize-input, .text {background: var(--gray-900);}"
+ "body.login header {background: var(--gray-800);}"
+ "#system-name .h2, #system-name h2 {color: var(--gray-100);}"
/*+ "#system-info #site-icon img, #site-icon svg {filter: brightness(20);}"*/
+ ".chevron-btns .btn .btn-body {background-color: var(--gray-1000);}"
+ ".chevron-btns .first-step .btn-body, body .selectize-dropdown .optgroup-header {background-color: var(--gray-800);}"
+ ".chevron-btns .btn.active-drop-target, .chevron-btns .btn.current-step {--ui-control-bg-color: var(--gray-1000);}"
+ ".chevron-btns .btn .chevron-right {border-inline-start: calc(var(--ui-control-height)/2) solid var(--gray-1000);}"
+ ".chevron-btns .first-step .btn .chevron-right {border-inline-start: calc(var(--ui-control-height)/2) solid var(--gray-800);}"
+ ".chevron-btns .btn .chevron-left {border-block-start: calc(var(--ui-control-height)/2) solid var(--gray-1000);}"
+ ".chevron-btns .btn .chevron-left::after {border-block-end: calc(var(--ui-control-height)/2) solid var(--gray-1000);}"
+ ".element-index table.data.vuetable th.sortable:hover, .element-index .btn:hover:not(.chromeless) {background-color: unset;}"
+ "path.apexcharts-radialbar-area[stroke='rgba(139,1,0,0.85)'] {stroke: #E00D0D;}"
+ ".pagination .page-number.active {background: var(--gray-700);}"
+ "table.editable tbody tr td {background-color: var(--gray-800); color: var(--gray-050);}"
+ ".content-notice p {color: var(--blue-050);}"
+ "#sections-vue-admin-table .cell-bold {color: var(--gray-050);}"
+ "#entrytypes-vue-admin-table .chip .cp-icon path {fill: var(--blue-100)}"
+ "#entrytypes-vue-admin-table .chip .chip-content .chip-label, #entrytypes-vue-admin-table .chip .chip-content .chip-label a {color: var(--blue-100)}"
+ "craft-copy-attribute button {color: var(--blue-100);}"
+ "craft-copy-attribute button:focus, craft-copy-attribute button:hover {border-color: var(--gray-350); color: var(--gray-100);}"
+ ".vue-admin-table-footer {background-color: var(--gray-800); border-top: 1px solid var(--gray-600);}"
+ ".content-notice .content-notice-icon {box-shadow: none;}"
+ "body .selectize-dropdown .optgroup-header, body .selectize-dropdown .option, body .selectize-dropdown, .selectize-dropdown .active:not(.selected), body .selectize-dropdown .optgroup-header [data-selectable], .autosuggest__results-container .autosuggest__results-item {color: var(--gray-100);}"
+ "body .selectize-dropdown .optgroup-header, .autosuggest__results-container .autosuggest__results-before {color: var(--gray-350)}"
+ ".pane.secondary {background: var(--gray-900); border: none; box-shadow: 0 0 0 1px rgba(0,0,0,.2), 0 2px 12px rgba(0,0,0,.25);}"
+ ".autosuggest__results-container {background-color: var(--gray-800);}"
+ ".fui-pages-menu {background: var(--gray-900); border-bottom: 1px solid var(--gray-1000);}"
+ ".fui-tab-item {background: var(--gray-800); color: var(--gray-100);}"
+ ".fui-field-tabs .fui-tab-btn {background-image: linear-gradient(#3f4d5a,#263647) !important;}"
+ ".fui-settings-wrap {background: var(--gray-900);}"
+ ".fui-settings-wrap {background: var(--gray-900); border: 1px solid var(--gray-700);}"
+ ".fui-editor-toolbar {background: var(--gray-800);}"
+ ".fui-toolbar-btn .custom-svg, .fui-field-tabs .fui-tab-btn {fill: var(--gray-100) !important;}"
+ ".fui-field-tabs .fui-tab-btn {border: 1px solid var(--gray-700)}"
+ ".btn.fui-toolbar-btn.v-popper--has-tooltip:hover {background-color: var(--gray-700) !important;}"
+ ".fui-rich-text .ProseMirror {background: var(--gray-900);}"
+ ".tippy-box[data-theme~='light-border'] {background: var(--gray-900); border: 1px solid var(--gray-600);}"
+ ".fui-list-item-heading {border-bottom: 1px solid var(--gray-600) !important;}"
+ ".fui-list-item {color: var(--gray-050) !important;}"
+ ".fui-list-item.is-selected {background-color: var(--gray-800) !important; color: var(--blue-050);}"
+ ".fui-list-item.is-selected, .fui-list-item:hover {background: var(--gray-700);}"
+ ".fui-list-item:hover {background: var(--gray-800) !important;}"
+ ".fui-tab-btn::after {color: var(--gray-050);}"
+ ".fui-field-info .fui-field-label, .fui-pages-sidebar-item h4 {color: var(--gray-100);}"
+ ".fui-field-block:hover, .fui-sidebar-wrapper {background: var(--gray-900);}"
+ " {background: var(--gray-900);}"
+ ".sidebar-title {color: var(--gray-100);}"
+ ".fui-sidebar-wrapper .add.btn:hover {background: var(--gray-700) !important;}"
+ ".fui-field-preview .fui-field-input, .fui-field-preview .fui-field-select {background: var(--gray-900); color: var(--gray-050); border: 1px solid var(--gray-600);}"
+ ".fui-field-icon {opacity: .7 !important}"
+ ".fui-field-icon svg {color: #FFF !important; fill: #FFF !important}"
+ ".fui-modal-header, .fui-pages-sidebar {background-color: var(--gray-800);}"
+ ".fui-modal-title {color: #FFF !important;}"
+ ".fui-dialog-close {filter: brightness(5); opacity: 1 !important;}"
+ ".fui-pages-wrap {background: var(--gray-900);}"
+ ".fui-pages-sidebar {background: var(--gray-800) !important;}"
+ ".fui-pages-sidebar-item {background: var(--gray-700) !important;}"
+ ".fui-pages-sidebar-item h4 {color: var(--gray-100) !important;}"
+ ".fui-modal-footer, .fui-email-header, .fui-email-footer {background: var(--gray-800);}"
+ ".formkit-form, .fui-modal-content, #modalDescription {background: var(--gray-900);}"
+ ".field-wrapper .input {color: var(--blue-200);}"
+ "table.editable td.action, table.editable td.heading, table.editable th {background-color: var(--gray-800); color: var(--gray-100);}"
+ "table.editable {border: 1px solid var(--gray-500);}"
+ ".fui-tags-list .ProseMirror:not(.read-only) {background: var(--gray-1000);}"
+ ".fui-field-add-variable-icon:hover, .is-open .fui-field-add-variable-icon {background: var(--gray-700) !important; border-left-color: var(--gray-800) !important;}"
+ ".fui-field-add-variable-icon {color: var(--gray-050) !important;}"
+ ".fui-field-add-variable-icon:hover svg, .is-open .fui-field-add-variable-icon svg, .fui-field-add-variable-icon svg {color: var(--gray-050) !important}"
+ ".fui-email-header {border-bottom: 1px var(--gray-700) solid;}"
+ ".fui-email-meta {background: var(--gray-800); color: var(--gray-100);}"
+ ".modal {background-color: var(--gray-900);}"
+ ".customize-sources-modal > .footer, .customize-sources-modal > .cs-sidebar {background: var(--gray-800);}"
+ ".customize-sources-item {background-color: var(--gray-900); color: var(--gray-050);}"
+ ".instructions {color: var(--blue-300) !important;}"
+ ".elements .header {background-color: var(--gray-800);}"
+ ".elements .thumbsview li:hover .chip {background-color: var(--gray-500);}"
+ ".card > .card-titlebar {background-color: var(--gray-900,var(--gray-100));}"
+ ".ps-wrapper .ps-sidebar {background-color: var(--gray-800);}"
+ ".nav-items ul li a.router-link-exact-active {background-color: var(--gray-900); color: var(--gray-100);}}"
+ ".nav-items ul li a {color: var(--blue-050);}"
+ ".ps-sidebar {border-right: 1px solid var(--gray-800);}"
+ ".nav-items ul li a {color: var(--gray-100);}"
+ ".nav-items ul li a:hover {background-color: var(--gray-700);}"
+ ".plugin-name {color: var(--gray-050);}"
+ ".plugin-name + div {color: var(--blue-200);}"
+ "a.plugin-card:hover strong {color: var(--blue-300) !important;}"
+ ".tw-border-gray-200 {border-color: var(--gray-600);}"
+ "hr {border-color: var(--gray-500);}"
+ ".update .pane.release {background: var(--gray-800) !important;}"
+ "#content .update .releases .release .release-info.fieldtoggle::before {border-color: var(--gray-050);}"
+ ".release-heading a span:first-child {color: var(--blue-050);}"
+ ".release-heading a span:nth-child(2) {color: var(--blue-300) !important;}"
+ ".readable code, .readable pre {background-color: var(--blue-900);}"
+ ".tw-bg-white {background: var(--gray-800); color: var(--blue-200);}"
+ ".tw-text-gray-500, .tw-text-gray-700, .changelog-release .version .date {color: var(--gray-200);}"
+ ".changelog-release {border-color: var(--gray-700);}"
+ ".tw-text-blue-600 {color: var(--blue-400);}"
+ ".tw-bg-gray-50 {background-color: var(--gray-800); border: 1px solid var(--gray-700);}"
+ ".tw-bg-gray-50:hover, .tw-bg-white:hover {background-color: var(--gray-700); border: 1px solid var(--gray-600);}"
+ ".tw-text-black {color: var(--gray-50);}"
+ ".tw-bg-blue-50 {background: var(--gray-700); color: var(--blue-300);}"
+ ".footer, .header, .hud-footer, .hud-header {color: var(--gray-100); background-color: var(--gray-800);}"
+ "#pluginstore-modal .pluginstore-modal-flex .pluginstore-modal-main .pluginstore-modal-content {color: var(--gray-050);}";





if ( $("#account-menu").length ) {
	$("#account-menu hr:first").after("<div class='darkmode-toggler'>"+ iconBulb +"<span>Dark mode</span></div><hr>");
  function darkmodeCheck() {
    stylesheet( "darkmode", "Dark mode" ,styleDarkmode );
    if ( $("head .darkmode").length ) {
      $(this).addClass("on");
      $("body").addClass("dark");
      localStorage.setItem("darkmode", true);
    } else {
      $("body").removeClass("dark");
      $(this).removeClass("on");
      localStorage.setItem("darkmode", false);
    }
  }
  $(".darkmode-toggler").on("click", darkmodeCheck);
  if ( localStorage.getItem("darkmode") != null ) {
    if ( localStorage.getItem("darkmode") == "true" ) { darkmodeCheck() }
  }
}

function stylesheet(className, label, styleCont) {
	if ( $("head ."+ className ).length ) {
    $("head ."+ className).remove();
  } else {
    $("head").append( "<style class='"+ className +"'>"+ styleCont +"</style>");
  }
}

// Redirects Autoscroll (Retour)
if ( $("h1#page-heading").attr("title") == "Redirects" ) {
	$("#main-content #cp-nav-content > div:first").after("<div class='pro-autotrace-cont'></div>");
  $(".pro-autotrace-cont").append("<div class='checkbox-select-item'><input type='checkbox' value='link' class='checkbox' id='pro-autotrace'><label for='pro-autotrace'>Automatically Scroll to next item after saving</label></div>");
  $("#pro-autotrace").on("change input", function() {
    if ( $(this).prop("checked") ) {
      localStorage.setItem("pro-autotrace", true);
    } else {
      localStorage.removeItem("pro-autotrace");
    }
  });
  if ( localStorage.getItem("pro-autotrace") != null ) {
    if ( localStorage.getItem("pro-autotrace") == "true" ) {
      $("#pro-autotrace").prop("checked", true);
    }
  }
	
  let findRedirects = setInterval( function() {
  	if ( $(".vuetable-body tr[item-index] a.go").length ) {
      clearInterval( findRedirects );
      $(".vuetable-pagination select[data-target-prefix]").append("<option value='1000000'>All</option>");
      
      setTimeout( function() {
        // Save
        $(window).on("click", function(e) {
        	console.log( $(e.target).closest("tr[item-index] a.go").length );
          if ( $(e.target).closest("tr[item-index] a.go").length ) {
            if ( localStorage.getItem("pro-autotrace") != null ) {
              if ( localStorage.getItem("pro-autotrace") == "true" ) {
                e.preventDefault();
            		e.stopPropagation();
                let nth = parseInt( $(e.target).closest("tr").attr("item-index") );
                if ( nth != null && nth != undefined ) {
                  if ( $(e.target).closest("tbody").find("tr[item-index='"+ (nth + 1) +"']").length ) { nth = (nth + 1) }
                  localStorage.setItem("pro-autotrace-id", nth );
                }
                console.log( $(e.target).closest("tr[item-index] a.go") );
                window.location.href = $(e.target).closest("tr[item-index] a.go").attr("href");
              }
            }
          }
        });
        console.log( $("tr[item-index] a.go").length );

        // Load
        if ( localStorage.getItem("pro-autotrace") == "true" && localStorage.getItem("pro-autotrace-id") != null ) {
          const nth = parseInt( localStorage.getItem("pro-autotrace-id") );
          const item = $("tr[item-index='"+ nth +"']:has(a.go)");
          console.log( item );
          $(window).scrollTop( item.offset().top - 110 );
        }
      }, 100);
    }
  }, 120);    
}