dolphish

Dark Skin for Google Docs

Nov 6th, 2016
30
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. // ==UserScript==
  2. // @name          Google Docs Dark UI
  3. // @namespace     http://userstyles.org
  4. // @description   A very minimal-code theme to darken the main UI of Google Docs. Not a complete overhaul, but enough to keep the website from blinding you. Built for and tested on Firefox 41+, works on Chromium 45.
  5. // @author        Zebouski
  6. // @match        *://*.google.com/*
  7. // @homepage      https://userstyles.org/styles/120097
  8. // @run-at        document-start
  9. // @version       0.20151026171604
  10. // ==/UserScript==
  11. (function() {var css = "";
  12. css += [
  13.         "/* Google Docs Dark UI by UGoBoom         */",
  14.         "/* Version 1.0                            */",
  15.         "/* Published Oct 26 2015                  */",
  16.         "/* Aesthetic inspired by Vertex-gtk theme */",
  17.         "",
  18.         "@namespace url(http://www.w3.org/1999/xhtml);"
  19.     ].join("\n");
  20. if (false || (document.location.href.indexOf("https://docs.google.com/document/") == 0))
  21.     css += [
  22.         "#docs-chrome{background: #333 none repeat scroll 0% 0% !important; color: #DDD !important;}",
  23.         "  ",
  24.         "  #gb#gb a.gb_b, /* Account email in top right corner */",
  25.         "  .docs-presence-plus-widget-status /* x total viewers text */",
  26.         "  {color: #DDD !important;}",
  27.         "  ",
  28.         "  .navigation-widget-container{",
  29.         "  color: #FFF !important;",
  30.         "  background: linear-gradient(rgba(1, 1, 1, 0), rgba(1, 1, 1, 0.3));",
  31.         "  }",
  32.         "  .navigation-item>*{",
  33.         "  color: #FFF !important;",
  34.         "  }",
  35.         "  .docs-icon-close-thin{",
  36.         "  filter: invert(1) !important;",
  37.         "  }",
  38. //      "  #docs-chat-mole > .talk_chat_widget {",
  39. //      "  width: 672px !important;",
  40. //      "  height: 845px !important;",
  41. //      "  }",
  42.         "  /* Document title box */",
  43.         "  .docs-title-input{",
  44.         "    background-color: #2B2B2C !important;",
  45.         "    border-radius: 2px !important;",
  46.         "    border: 1px solid #171717 !important;",
  47.         "    border-top-color: #0f0f0f !important;",
  48.         "    box-shadow: 0 1px rgba(255,255,255,0.15),",
  49.         "                inset 0 1px rgba(0,0,0,0.1) !important;",
  50.         "    font-style: normal !important;",
  51.         "  }",
  52.         "  .docs-title-input:focus{",
  53.         "    color: white !important;",
  54.         "    background-color: #2B2B2C !important;",
  55.         "    border: 1px solid #171717 !important;",
  56.         "    border-top-color: #0f0f0f !important;",
  57.         "  }",
  58.         "  .docs-title-untitled{display: none !important;}",
  59.         "  ",
  60.         "  /* Fix for menu bar text when hover */",
  61.         "  .goog-control-hover{color: black !important;}",
  62.         "  ",
  63.         "  /* Main toolbar */",
  64.         "  #docs-toolbar-wrapper{",
  65.         "    border-top: 1px solid #151516 !important;",
  66.         "    border-bottom: 1px solid #040404 !important;",
  67.         "    background-image: linear-gradient(#404143, #333436) !important;",
  68.         "    box-shadow: inset 0 1px rgba(255,255,255,0.15) !important;",
  69.         "  }",
  70.         "  ",
  71.         "  /* Toolbar\'s vertical dividers */",
  72.         "  .goog-toolbar-separator.goog-inline-block{border-left: 1px solid #222 !important;}",
  73.         "  ",
  74.         "  /* A very simple/lazy fix to get toolbar item colors to look good on a dark background */",
  75.         "  .goog-toolbar-button,",
  76.         "  .goog-toolbar-toggle-button,",
  77.         "  .goog-toolbar-menu-button:not([id=\"textColorButton\"]),",
  78.         "  .goog-toolbar-combo-button,",
  79.         "  .docs-icon-folder-solid{",
  80.         "    -webkit-filter: invert(1) !important;",
  81.         "    filter: invert(1) !important;",
  82.         "  }",
  83.         "  ",
  84.         "  /* Fixes for suggestion mode when editing own doc, viewing mode when editing others\' docs */",
  85.         "  #docs-toolbar-mode-switcher, #docs-access-level-indicator{background-color: transparent !important; color: black !important;}",
  86.         "  .docs-icon-mode-review-white, .docs-icon-mode-view-white{filter: invert(1) !important;}",
  87.         "  ",
  88.         "  /* Background behind the document */",
  89.         "  #docs-editor{background: #333 none repeat scroll 0% 0% !important;}",
  90.         "  ",
  91.         "  /* Document drop-shadow removal */",
  92.         "  .kix-page-paginated{box-shadow: none !important;}"
  93.     ].join("\n");
  94. if (typeof GM_addStyle != "undefined") {
  95.     GM_addStyle(css);
  96. } else if (typeof PRO_addStyle != "undefined") {
  97.     PRO_addStyle(css);
  98. } else if (typeof addStyle != "undefined") {
  99.     addStyle(css);
  100. } else {
  101.     var node = document.createElement("style");
  102.     node.type = "text/css";
  103.     node.appendChild(document.createTextNode(css));
  104.     var heads = document.getElementsByTagName("head");
  105.     if (heads.length > 0) {
  106.         heads[0].appendChild(node);
  107.     } else {
  108.         // no head yet, stick it whereever
  109.         document.documentElement.appendChild(node);
  110.     }
  111. }
  112. })();
Add Comment
Please, Sign In to add comment