EksDee / Dark Fate (R20D core)

// ==UserScript==
// @name          Dark Fate (R20D core)
// @namespace     https://openuserjs.org/scripts/RedReign/Roll20_Dark
// @description	  A dark theme for Roll20.net.
// @author        RedReign (90%) + EksDee mods (10%)
// @include       https://app.roll20.net/editor*
// @include       https://app.roll20.net/campaigns/chatarchive*
// @run-at        document-start
// @version       2019.4.13.1
// @license       GPL-3.0-or-later
// ==/UserScript==
(function() {var css =`
.button-2{
	background-color: hsl(0,0%,10%) !important;
}

.ui-tabs-panel {
	color:hsl(0,0%,75%)!important;
	border:1px solid black!important;
	background:hsl(0,0%,10%)!important;
}


#textchat-input .btn,
#rightsidebar .btn,
.tokenactions .btn,
.ui-dialog-content .ui-dialog-buttonset > button {
	 background-color:hsl(0,0%,10%)!important;
	 color:hsl(0,0%,75%)!important;
	 border-color:black!important;
}

.ui-state-default,.ui-widget-content .ui-state-default,.ui-widget-header .ui-state-default {
	box-shadow:none !important;
	text-shadow:none !important;
}

input.sheet-sa-free-invoke {
    color:3B3B3B !important;
    font-weight:bold !important;
}

h3, h2, h1, h4, label, tabcontainer {
    color:8C8C8C !important;
    border-color:black !important;
}

input {
    border-color:black !important;
}


div.sheet-bonus-circle, div.sheet-fate-point-circle {
    color:black !important;
    font-weight:bold !important;
    top:-6px !important;
    overflow:visible !important;
    z-index:4 !important;
    font-size:18px !important;
}

div.sheet-row,  div.formula, div.didroll {
    color:white !important;
    font-weight:bold !important;
    font-size:14px !important;
    opacity:1 !important;
}

div.sheet-row.sheet-header {
    font-size:16px !important;
}

div.sheet-row + span.basicdiceroll {
    color:green !important;
    font-weight:bold !important;
    font-size:14px !important;
}

div.sheet-section-id-logo.sheet-section {
    display:none !important;
}

div.sheet-display button.sheet-action-button.btn.ui-draggable {
    min-width: 105px !important;
}

div.sheet-section-id.sheet-section {
    min-width:825px;
}

input.sheet-section-options-flag {
    color:red !important;
}

.button-1{
	background-color: hsl(0,0%,10%) !important;
}

#color_selector{
	background-color:hsl(0,0%,10%) !important;
    border: 1px solid hsl(250,25%,15%) !important;
}

body {
    background:url(http://subtlepatterns.com/patterns/dark_leather.png)!important;
}

#floatingtoolbar, #floatinglayerbar {
	background-color:hsl(0,0%,10%) !important;
	border: none !important;
	box-shadow: none !important;
	width: 40px !important;
}

#floatingtoolbar div.submenu {
	left: 40px !important;
	padding: 0 !important;
	top: 0 !important;
}

#floatingtoolbar div.submenu .pictos, #floatingtoolbar div.submenu .pictosthree, #floatingtoolbar div.submenu .pictostwo {
	left: 15px !important;
	position: absolute !important;
	text-align: center !important;
	width: 20px !important;
}

#floatingtoolbar div.submenu ul {
	background-color:#333 !important;
	border: 0 !important;
	border-radius: 0 !important;
	padding: 0 !important;
	width: 190px !important;
}

#floatingtoolbar div.submenu ul li {
	color:hsl(0,0%,80%) !important;
	padding-right: 20px !important;
    padding-left: 45px !important;
}

#floatingtoolbar div.submenu ul li span {
	padding-left: 10px !important;
}

#floatingtoolbar div.submenu ul li img {
    margin-left: -20px !important;
}

#editinglayer li.gm_slider_box {
    background-color: #333 !important;
}

#floatingtoolbar li.activebutton,
#floatingtoolbar li:hover
#floatingtoolbar div.submenu ul li:hover,
#floatinglayerbar li:hover,
#editinglayer.map div.submenu li.choosemap,
#editinglayer.objects div.submenu li.chooseobjects,
#editinglayer.foreground div.submenu li.chooseforeground,
#editinglayer.gmlayer div.submenu li.choosegmlayer,
#editinglayer.walls div.submenu li.choosewalls,
#editinglayer.weather div.submenu li.chooseweather,
#floatinglayerbar.map li.choosemap,
#floatinglayerbar.objects li.chooseobjects,
#floatinglayerbar.gmlayer li.choosegmlayer,
#floatinglayerbar.walls li.choosewalls,
#floatinglayerbar.weather li.chooseweather,
#floatinglayerbar.foreground li.chooseforeground,
#measure li.activerulermode {
    background-color: #282150 !important;
}

#floatingtoolbar li, #floatinglayerbar li {
	border: 0 !important;
	color:hsl(0,0%,80%) !important;
}

#ttaudio_results .result,
#battlebards_results .result,
#incompetech_results .result,
#jukebox_results .result,
#fanburst_results .result,
#myaudio_results .result,
.listresults .result {
    background-color: #1a1a1a !important;
}

#jukeboxfolderroot div.title:hover {
    background-color: transparent !important;
}

#floatingtoolbar li.activebutton,
#floatingtoolbar li:hover {
background-color: #282150 !important;
}

#page-toolbar {
	background-color:hsl(0,0%,10%) !important;
	border-radius: 0 !important;
}

#page-toolbar .availablepage {
	box-sizing: border-box !important;
}

#page-toolbar .availablepage span {
	color:hsl(0,0%,80%) !important;
	font-size: 12px !important;
}

#page-toolbar .handle {
	background:hsl(0,0%,10%) !important;
	border:1px solid hsl(0,0%,0%)!important;
	border-radius: 0 0 100% 100% !important;
	color:hsl(0,0%,80%) !important;
}

#editor-wrapper {
	overflow: scroll !important; /// CHANGE HIDDEN TO SCROLL FOR SCROLLBARS
}

.btn.btn-danger {
    background-color: #660000 !important;
}

#rightsidebar {
	background-color:hsl(0,0%,0%)!important;
}

#sidebarcontrol {
	opacity: .7 !important;
	padding: 0 !important;
	-webkit-transform: translateX(0) rotate(-90deg) !important;
	-moz-transform: translateX(0) rotate(-90deg) !important;
	width: 50px !important;
	text-align: center !important;
	border: 2px solid hsl(0,0%,0%)!important;
	font-size: 10px !important;
	color:hsl(0,0%,80%) !important;
	background-color:hsl(0,0%,10%) !important;
	height: 24px !important;
	line-height: 35px !important;
	text-transform: uppercase !important;
	letter-spacing: 2px !important;
	-webkit-transform-origin: 100% 100% !important;
	-moz-transform-origin: 100% 100% !important;
	border-radius: 100% 100% 0 0 !important;
	top: 50% !important;
    margin-right: -1px !important;
	margin-top: -62.5px !important;
	transition: width, margin-top, opacity, height, font-size .5s,.5s,.5s,.5s,.5s !important;
}

#sidebarcontrol:hover {
	opacity: 1 !important;
	width: 75px !important;
	margin-top: -80px !important;
	height: 32px !important;
	font-size: 14px !important;
	transition: width, margin-top, opacity, height, font-size .5s,.5s,.5s,.5s,.5s !important;
}

#sidebarcontrol .fonticon-menu {
	display: none !important;
}

#sidebarcontrol:after {
	content: \'Menu\' !important;
}

code {
	color:hsl(0,0%,750%)!important;
	background-color:hsl(0,0%,10%)!important;
	border:1px solid hsl(0,0%,0%)!important;
}

#textchat .formula,#textchat .rolled {
	background:hsl(0,0%,10%)!important;
	border:1px solid hsl(0,0%,0%)!important;
}

#textchat .message {
	color:hsl(0,0%,80%)!important;
	background-color:hsl(0,0%,10%)!important;
	border:none!important;
	border-right:1px solid hsl(0,0%,50%)!important;
    height: auto !important;
}

#textchat .message.general {
    padding-top: 3px !important;
}

#textchat .by {
	color:hsl(44,63%,63%)!important;
}

#textchat .rolled {
	color:hsl(0,0%,75%)!important;
}

#textchat .message.system {
	color:hsl(360,100%,100%)!important;
}

#textchat .userscript-sharelink {
	background-color:black !important;
}

#textchat .message > .userscript-sharelink:hover a {
    color: white !important;
}

#textchat .userscript-commandintro {
	color:hsl(360,100%,100%)!important;
}

#textchat .message.rollresult {
	color:hsl(0,0%,75%)!important;
}

#textchat .message .spacer {
	background-color: black !important;
	margin-right: -5px !important;
	height: 1px !important;
    margin-top: -3px !important;
}

#textchat .message.emote {
	color:hsl(30,40%,45%)!important;
}

#textchat .message.emote .spacer {
	background-color: black !important;
}

#rightsidebar ul.tabmenu {
	top: 2px!important;
	right: 1px!important;
	background-color: hsl(0,0%,10%) !important;
}

.ui-tabs .ui-tabs-nav {
	padding:1px 5px!important;
	border-bottom:none!important;
}

.ui-state-default,.ui-widget-content .ui-state-default,.ui-widget-header .ui-state-default {
	box-shadow:none !important;
	text-shadow:none !important;
}

#textchat-input {
	width:300px!important;
	right:0!important;
	bottom:0!important;
	background-color:hsl(0,0%,10%)!important;
	padding:12px 1px 5px 5px!important;
	margin:0 -5px 0 0!important;
	border-top:0 solid hsl(0,0%,0%)!important;
	text-align:left!important;
}

.btn {
background-image: none !important;
	text-shadow:none!important;
}

textarea,select,table,
#textchat-input .btn,
#rightsidebar .btn,
.tokenactions .btn, {
	 background-color:hsl(0,0%,10%)!important;
	 color:hsl(0,0%,75%)!important;
	 border-color:black!important;
}

.diceroll .didroll {
	text-shadow:0 0 10px hsl(0,0%,0%)!important;
	color:hsl(0,0%,75%)!important;
}

.diceroll.critfail .didroll {
	text-shadow:0 0 10px hsl(0,100%,50%)!important;
	color:hsl(0,80%,50%)!important;
}

.diceroll.critsuccess .didroll {
	text-shadow:0 0 10px hsl(100,50%,50%)!important;
	color:hsl(100,50%,50%)!important;
}

.diceroll.importantroll .didroll {
	text-shadow:0 0 10px hsl(240,100%,65%)!important;
	color:hsl(240,100%,65%)!important;
}

#initiativewindow ul li {
	border-bottom:1px solid hsl(0,0%,10%)!important;
	background-color:hsl(0,0%,25%)!important;
	text-shadow:none!important;
}

#initiativewindow ul li:first-child {
	background-color:hsl(100,30%,25%)!important;
}

hr {
	border-color:hsl(0,0%,15%)!important;
}

.sheet-rolltemplate-default caption {
    background-color: #4b0c59 !important;
}

.sheet-rolltemplate-default tr:nth-child(2n),
.table-striped tbody tr:nth-child(odd) td,
.table-striped tbody tr:nth-child(odd) th {
	background-color:hsl(0,0%,15%)!important;
}

.table tbody tr:hover td,.table tbody tr:hover th {
	background-color:hsl(0,0%,30%)!important;
}

.table th,.table td {
	border-color:hsl(0,0%,10%)!important;
	background-color:hsl(0,0%,25%)!important;
}

#imagedialog .searchbox {
	background:none!important;
}

#textchat .inlinerollresult {
	background-color: hsl(0, 0%, 10%) !important;
	border: 2px solid hsl(50, 30%, 30%) !important;
	color:hsl(0,0%,90%) !important;
}

#textchat .inlinerollresult.importantroll {
	border: 2px solid hsl(240, 100%, 65%) !important;
}

#textchat .inlinerollresult.fullcrit {
	border: 2px solid hsl(104, 79%, 39%) !important;
}

#textchat .inlinerollresult.fullfail {
	border: 2px solid hsl(0, 79%, 39%) !important;
}

div.dd-content {
	color:hsl(0,0%,75%) !important;
}

div.dd-content:hover {
	background-color:hsl(0,0%,40%) !important;
}



.ui-tabs .ui-tabs-nav li:hover,
.ui-tabs .ui-tabs-nav li a:hover {
	background: hsl(0,0%,20%) !important;
	border-bottom: 2px solid hsl(44,63%,63%) !important;
}

li.ui-tabs-active.ui-state-active:focus {
	outline: none;
}

li.ui-tabs-active.ui-state-active:focus {
	border-color: transparent !important;
	outline: none;
}

li.ui-tabs-active.ui-state-active:hover,
li.ui-tabs-active.ui-state-active > a:hover {
	color:hsl(0,0%,100%) !important;
}

li.ui-tabs-active.ui-state-active > a {
	outline: none;
	border-bottom: 2px solid hsl(44,63%,63%) !important;
	color:hsl(0,0%,96%) !important;
}

.dd-item.character > div.dd-content > .name {
	color:hsl(214,100%,79%) !important;
}

.dd-item.handout .dd-content > .name {
	color:hsl(214,100%,79%) !important
}

.sheet-rolltemplate-dmg {
	margin-top: 0px !important;
}

.sheet-rolltemplate-dmg > .sheet-desc {
	background-color: transparent !important;
}


.dd-sortablehandle {
	color: whitesmoke !important;
}

.nav-tabs {
	border-color:hsl(0,0%,47%) !important;
}

.nav-tabs>.active>a,
.nav-tabs>.active>a:hover {
	background-color: transparent !important;
	border-color:transparent !important;
}

.nav-tabs a:hover,
.nav-tabs a:hover {
	background-color: transparent !important;
	border-color:hsl(0,0%,100%) !important;
	border-bottom: 1px solid hsl(0,0%,100%) !important;
	color:hsl(0,0%,80%) !important;
}

.inlinerollresult {
	margin: 3px !important;
}



/* RED'S EDITS */

.ui-dialog-buttonset button[type='button'],
.ui-dialog-buttonset > button,
.r20es-dialog .btn {
background-color: #1a1a1a !important;
color: hsl(0,0%,80%) !important;
border: 1px solid black !important;
line-height: 18px;
border-radius: 4px !important;
padding: 4px 10px 4px !important;
box-shadow: inset 0 1px 0 rgba(255,255,255,0.2),0 1px 2px rgba(0,0,0,0.05) !important;
}

.ui-dialog-buttonset button[type='button']:hover,
.ui-dialog-buttonset > button:hover {
    background-color: hsl(0,0%,20%) !important;
    color: white !important;
}

li.handout.compendium-item .namecontainer {
box-shadow: none !important;
}


#measure.activebutton > img {
-webkit-filter: brightness(0) !important;
}

#measure:not(.activebutton) > img {
opacity: 1 !important;
-webkit-filter: brightness(2.5) !important;
}

.searchbox > input,
.content > #player-search,
#compendium > .searchbox span input {
background-color: hsl(0,0%,30%) !important;
color: hsl(0,0%,0%) !important;
}

.tools-list .tool-row:nth-child(2n+1),
table.config-table tbody tr:nth-child(2n+1) {
background-color: hsl(0,0%,20%) !important;
}

.dd-handle {
color: transparent !important;
background-color: #444 !important;
}

#secondary-toolbar {
background-color:#222 !important;
}

#secondary-toolbar li{
border-right: 1px solid #000 !important;
}

#measure_sticky_clear {
background-color: #111 !important;
border-color: black !important;
}

.dd-list .journalitem .name, .dd-list .library-item .name {
position: static !important;
}

#textchat .message.you {
	color:hsl(0,0%,80%)!important;
	background-color:hsl(250,25%,15%)!important;
}

#textchat .message.emote {
	background-color:hsl(20,25%,15%)!important;
}

.dd-item.handout .dd-content .redactor_editor > .name {
	background-color:hsl(0,0%,20%) !important
}
li.search-choice {
background-color: #333 !important;
background-image: linear-gradient(#444444 20%,#404040 50%,#383838 52%,#3e3e3e 100%) !important;
color: #ccc !important;
}

.textboxlist-bit-box {
background: #223 !important;
}

.textboxlist-bits {
border: 1px solid #000 !important;
}

.chosen-container-multi .chosen-choices {
border: 1px solid #000 !important;
}

.textboxlist-autocomplete-placeholder, .textboxlist-autocomplete-results {
opacity: 1 !important;
filter: alpha(opacity=100) !important;
background: #111 !important;
-webkit-box-shadow: 0 3px 3px #222 !important;
-moz-box-shadow: 0 3px 3px #222 !important;
box-shadow: 0 3px 3px #222 !important;
}

.redactor_editor.content {
	background-color: hsl(0,0%,10%) !important;
}

.note-editor span[style*='color: rgb( 0 , 0 , 0 )'],
.note-editor span[style*='color: rgb( 66 , 66 , 66 )'] {
    color: hsl(0,0%,75%) !important;
}

.note-editor.note-frame .note-editing-area .note-editable {
color: inherit !important;
}

.note-editor .panel-default > .panel-heading {
background-color: #2a2a2a !important;
border-color: #111 !important;
}

.handouteditor .dropbox,
.note-statusbar > .note-resizebar {
background-color: #111 !important;
}

.note-editor.note-frame {
border: 1px solid #000 !important;
}

#containerdiv,
.redactor_box, .redactor_editor, .redactor_editor:focus, div[contenteditable], div[contenteditable]:focus {
	background: #1a1a1a !important;
}

.charactereditor .avatar {
background-color: #1a1a1a !important;
}

.folderroot .dd-content {
	border-top: 1px solid hsl(0,0%,30%) !important;
}

img[src='/images/handout.png'] {
	content: url('https://i.imgur.com/zM79lGs.png')!important;
}

img[src='/images/character.png'] {
	content: url('https://i.imgur.com/nZ5EHJd.png')!important;
}

.dd-item .playerdots {
background-color: transparent !important;
}

.chosen-container-multi .chosen-choices {
background-color: #1a1a1a !important;
background-image: none !important;
}

.textboxlist-bit-editable {
    border: 1px solid #aaaaaa !important;
}

.anm-edit__gui-row-name {
    color: black !important;
    -webkit-text-stroke: 0px rgb(85, 85, 85) !important;
}

.anm-edit__gui-row {
    border: 1px solid hsl(0,0%,30%) !important;
}

.anm-edit__gui-row:nth-child(2n) {
    background: hsl(0,0%,20%) none repeat scroll 0% 0% !important;
}

.anm-edit__gui-row .flex-v-center div input,
anm-edit__gui-row .flex-v-center div button {
    height: 24px !important;
}

.anm-win {
}

.charactereditor .avatar,
.artr__side {
    background-color: #1a1a1a !important;
}

.artr__item,
.artr__item__top,
.artr__item__bottom {
    background-color:#222 !important;
}

.artr__side__tag_header,
.artr__side__head,
.artr__side__tag_grid,
.artr__search {
    background-color:hsl(0,0%,10%) !important;
    border-bottom: 1px solid black !important;
}

.artr__side__tag[data-state="1"] {
	background-image: linear-gradient(#2a2a2a, #337ab7) !important;
}

.artr__side__tag[data-state="2"] {
	background-image: linear-gradient(#2a2a2a, #8a1a1b) !important;
}

.artr__main .artr__view_inner,
.artr__main .artr__view {
background-color: hsl(0,0%,10%) !important;
}


`;
if (typeof GM_addStyle != "undefined") {
	GM_addStyle(css);
} else if (typeof PRO_addStyle != "undefined") {
	PRO_addStyle(css);
} else if (typeof addStyle != "undefined") {
	addStyle(css);
} else {

    const node = document.createElement("style");
	node.type = "text/css";
	node.innerHTML = css;

    // Note(stormy): wait for document.head to be available
    const interval = 10;
    const waitForDepts = () => {
        if(!document.head) {
            setTimeout(waitForDepts, 10);
            return;
        }

        document.head.appendChild(node);

    }
    setTimeout(waitForDepts, 10);
}
})();
(function(){
const el = document.createElement("link");
el.rel = "stylesheet";
el.href = "/css/licensed5ednd.css";
document.head.appendChild(el)
})();