User:Cronos/vector.css

/*in case not me: this only works when only lightmode active, darkmode uses more specific selectors that override*/
:root {
    --stone: #373432;
    --body-main: #494034;
    --body-light: #574f49;
    --body-mid: #5a564f;
    --body-dark: var(--stone);
    --body-border: #20201e;
    --body-background-color: #1d1b0f;
    --body-background-image: none;
    --input-bg: #372e22;
    --input-bg--active: #8d622f;
    --input-bg--active--hover: #f79522;
    --input-border-color: #5a4444;
    --input-bg-light: #594c3a;
    --input-bg-dark: #402929;
    --button-background: #686468;
    --button-color: #684141;
    --button-border: #1b7353;
    --button-dark: #59374b;
    --button-light: #12dfac;
    --sidebar: var(--body-border);
    --search-box: var(--body-light);
    --link-color: #f79522;
    --text-color: #ebdbd6;
    --messagebox-safe-color: var(--stone);
    --messagebox-warn-color: var(--stone);
    --background-text-color: var(--text-color);
    --background-link-color: #90c040;
    --byline-color: #ad9183;
    --subtle-color: var(--byline-color);
    --thumb-bg: var(--body-light);
    --thumb-caption-bg: var(--body-mid);
    --sourceeditor-input-background: #73776c;
    --sourceeditor-background: #2c2d33;
    --sourceeditor-background-secondary: #7a7c7582;
    --sourceeditor-border: #6c6e77;
    --codemirror-gutter-background: #6c6e77;
    --tile-border-color: #373224;
    --tile-background-color: #514c3d;
    --tile-link-button-color: #392727;
    --tile-link-button-highlight-color: #2e1f1f;
    --mainpage-recent-updates-description-color: #ecbdbd;
    --bigtile-background-color: rgba(101,57,57,1);
    --bigtile-background-fade-zero: rgba(101,57,57,0);
    --bigtile-background-fade-seventyfive: rgba(101,57,57,0.75);
    --ooui-text: var(--text-color);
    --ooui-interface: var(--input-bg);
    --ooui-interface-border: var(--input-bg-dark);
    --ooui-window-background: rgba(25,25,25,0.6);
    --ooui-input: var(--input-bg);
    --ooui-input-border: var(--input-border-color);
    --ooui-input-border--hover: var(--input-border-color);
    --ooui-normal: var(--input-bg);
    --ooui-normal--hover: var(--input-bg-light);
    --ooui-normal-border: var(--input-border-color);
    --ooui-progressive: var(--input-bg--active);
    --ooui-progressive--hover: var(--input-bg--active--hover);
    --ooui-disabled: var(--input-bg-dark);
    --ooui-disabled-border: var(--input-bg-dark);
    --vector-tab-background: #585147;
    --vector-tab-background--hover: #817868;
    --mw-background-color: #2c2d33;
    --mw-code-background-color: var(--mw-background-color);
    --warningbox-bg: #7d7231;
    --personal-links-bg: #372f2f;
    --questdetails-header-background: #3d352b;
    --questdetails-header-background-alt: #372f27;
    --droptable-text-color: rgba(0,0,0,0.6);
    --droptable-always-background: #78aeaf;
    --droptable-common-background: #4b8c4b;
    --droptable-uncommon-background: #a67b26;
    --droptable-rare-background: #c17241;
    --droptable-veryrare-background: #c05f5f;
    --droptable-random-background: #ffa3ff;
    --lighttable-bg: #618146;
    --lighttable-bg-hover: #9ba791;
    --lighttable-link-color: #c0f892;
    --lighttable-bg-active: #367106;
    
    --tabber-inactive-tab-bg: var(--body-dark);
    --tabber-inactive-tab-hover-bg: var(--body-mid);
    
    --echo-icon-person-bg-image:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2212%22 height=%2213.836%22 viewBox=%220 0 12 13.836%22%3E %3Cpath fill='%23e6ddd8' d=%22M1.938%2C6.656c-1.32%2C1.485-1.47%2C3.15-0.97%2C4.25c0.323%2C0.707%2C0.78%2C1.127%2C1.313%2C1.375 c0.496%2C0.229%2C1.074%2C0.273%2C1.658%2C0.282c0.023%2C0%2C0.04%2C0.03%2C0.062%2C0.03h4.187c0.61%2C0%2C1.225-0.125%2C1.75-0.405 c0.527-0.28%2C0.961-0.718%2C1.188-1.376c0.335-0.964%2C0.175-2.529-1.094-4.03C9.094%2C7.954%2C7.68%2C8.719%2C6.065%2C8.719 c-1.677%2C0-3.182-0.812-4.125-2.063H1.938z%22/%3E %3Cpath fill='%23e6ddd8' d=%22M6.063%2C0c-1.89%2C0-3.595%2C1.674-3.594%2C3.563C2.467%2C5.45%2C4.173%2C7.155%2C6.06%2C7.155 c1.89%2C0%2C3.564-1.705%2C3.563-3.593C9.625%2C1.673%2C7.95%2C0%2C6.063%2C0L6.063%2C0z%22/%3E %3C/svg%3E");
    --echo-icon-bell-bg-image:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2220%22 height=%2220%22 viewBox=%220 0 20 20%22%3E%3Ctitle%3Ebell%3C/title%3E%3Cpath d=%22M16 7a5.38 5.38 0 00-4.46-4.85C11.6 1.46 11.53 0 10 0S8.4 1.46 8.46 2.15A5.38 5.38 0 004 7v6l-2 2v1h16v-1l-2-2zm-6 13a3 3 0 003-3H7a3 3 0 003 3z%22 fill='%23e6ddd8'/%3E%3C/svg%3E");
    --echo-icon-tray-bg-image:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2220%22 height=%2220%22 viewBox=%220 0 20 20%22%3E%3Ctitle%3Etray%3C/title%3E%3Cpath d=%22M3 1a2 2 0 00-2 2v14a2 2 0 002 2h14a2 2 0 002-2V3a2 2 0 00-2-2zm14 12h-4l-1 2H8l-1-2H3V3h14z%22 fill='%23e6ddd8'/%3E%3C/svg%3E");
}
.questdetails {
	border-collapse:collapse;
}
.questdetails tr:nth-child(odd) {
  background-color:var(--questdetails-header-background-alt)
}
.questdetails tr:nth-child(even) {
  background-color:var(--questdetails-header-background);
}
#pagehistory [type='checkbox'], #pagehistory [type='radio'], input{
	accent-color:var(--text-color);
}
.lighttable.checklist li:not(.checked):hover::before {
  background-color: #3f3c35;
}
.lighttable.checklist li::before {
  border-radius: 2px;
  box-shadow: inset #9e865b 0 0 0 2px, #191919 0 0 0 1px;
  background: #191919;
}
.lighttable.checklist .checked::before {
  background-image: url(//oldschool.runescape.wiki/images/f/fb/Yes_check.svg?00000);
  background-size: 80%;
  background-position: center 34%;
  background-repeat: no-repeat;
}

/* also stoled from the actual darkmode sheet */
.oo-ui-iconElement-icon:not(.oo-ui-image-destructive):not(.oo-ui-image-warning):not(.oo-ui-image-progressive):not(.oo-ui-checkboxInputWidget-checkIcon):not(.oo-ui-icon-page-existing),
.oo-ui-icon-advanced, 
.oo-ui-indicatorElement-indicator,
.mw-ui-icon::before, .soft-redirect > div:nth-child(1) img,
.vector-menu-dropdown .vector-menu-heading::after,
.vector-menu-tabs .mw-watchlink.icon a, .searchButton[name="go"] {
  filter:brightness(0) saturate(100%) invert(99%) sepia(52%) saturate(385%) hue-rotate(296deg) brightness(91%) contrast(98%);
}

/*not syre if i like it tbh*/
.vector-menu-tabs #ca-unwatch.icon a, .vector-menu-tabs #ca-unwatch.icon a:hover, .vector-menu-tabs #ca-unwatch.icon a:focus{
	filter:brightness(0) saturate(100%) invert(85%) sepia(78%) saturate(597%) hue-rotate(333deg) brightness(96%) contrast(99%);
}

ul {
	list-style-image: radial-gradient(var(--text-color) 60%, transparent 70%);
}
.coins{color:#69be69;}
.coins-pos{color: #3999e0;}
.coins-neg{color:#ee4f4f;}
	
	/*--=== only relevant to module editing ===---*/
.mw-highlight .nb {
	color:#a6cea6;
}
.mw-highlight .nc {
	color:#8686BB;
}
.mw-highlight .nd {
  color:#22BC98
}
.mw-highlight .nf {
  color:brown
}
.mw-highlight .nn {
	color:#D0CF73;
}
.mw-highlight .nv {
  color:#feb2b2
}
.mw-highlight .nt {
}
.mw-highlight .mh {
  color:#a7a775
}
.mw-highlight .mi {
	color:#aaa;
}
.mw-highlight .k {
}
.mw-highlight .kc {
}
.mw-highlight .o {
}
.mw-highlight .s2 {
}
.mw-highlight .sx {
	color:#43bf43;
}
.mw-highlight .err {
}
.ace-tm .ace_line .ace_variable {
  color:rgb(31, 206, 247);
}
.ace-tm .ace_line .ace_keyword {
  color:rgb(243, 210, 34);
}
.ace-tm .ace_line .ace_string {
  color:rgb(243, 122, 34);
}
.ace-tm .ace_line .ace_numeric {
  color:rgb(255, 170, 9);
}
.ace-tm  .ace_line .ace_support.ace_type, .ace-tm  .ace_line .ace_support.ace_class {
  color: rgb(255, 134, 157);
}
.ace-tm .ace_line .ace_color {
  color:rgb(87, 240, 1);
}
.ace-tm .ace_line .ace_comment {
  color:rgb(39, 2, 0);
}
.ace-tm .ace_line .ace_support.ace_function {
  color:rgb(152, 208, 217) ;
}