☰

Greasy Fork is available in English.

Nighty-night Google Docs

Write at night comfortably!

Mint 2017.11.21.. Lásd a legutóbbi verzió

  1. // ==UserScript==
  2. // @name         Nighty-night Google Docs
  3. // @namespace    https://github.com/KeyWeeUsr/Userscripts
  4. // @version      2.9
  5. // @description  Write at night comfortably!
  6. // @author       Peter Badida
  7. // @copyright    2016+, Peter Badida
  8. // @license      GPL-3.0
  9. // @homepage     https://github.com/KeyWeeUsr/Userscripts/tree/master/Nighty-night-Google-Docs
  10. // @supportURL   https://github.com/KeyWeeUsr/Userscripts/issues
  11. // @icon         https://www.google.com/docs/about/favicon.ico
  12. // @include      https://*docs.google.*/document/*
  13. // @include      https://*docs.google.*/sharing/*
  14. // @include      https://*docs.google.*/e/organize*
  15. // @include      https://*docs.google.*/picker*
  16. // @include      https://*docs.google.*/drawings/*
  17. // @include      https://*.google.*/webstore/wall/widget?container=GOOGLE_DOCUMENT*ref=https%3A%2F%2Fdocs.google.*
  18. // @contributionURL https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=ACVM74AYCXVWQ
  19. // @grant        GM_addStyle
  20. // @require https://greasemonkey.github.io/gm4-polyfill/gm4-polyfill.js
  21. // ==/UserScript==
  22. /* jshint -W097 */
  23. 'use strict';
  24.  
  25. (function () {
  26. // basic colors
  27. var text = '#777777';
  28. var buttons = '#696969';
  29. var disabled = '#888888';
  30.  
  31. // main backgrounds
  32. var black = '#0c0c0c';
  33. var softBlack = '#191919';
  34. var softGrey = '#555555';
  35.  
  36. // modal, popup, listbox, other large areas' backgrounds
  37. var darkModal = '#333333';
  38. var lightModal = '#393939';
  39.  
  40. // hover, selection, active element color
  41. var hover = '#f8f8f8';
  42. var darkHover = '#242424';
  43. var lightHover = '#494949';
  44.  
  45. var maincss = "\
  46. img#kwu_av:hover {\
  47.     opacity: 1 !important;\
  48. }\
  49. \
  50. *:focus {\
  51.     outline: none;\
  52. }\
  53. /*TOOLBAR*/\
  54. div#docs-chrome, div#docs-toolbar-wrapper, \
  55. div#docs-title-widget div.goog-inline-block, div.goog-toolbar, \
  56. div#docs-toolbar-wrapper.docs-material {\
  57.     color: {text} !important;\
  58.     background-color: {black} !important;\
  59.     background-image: none !important;\
  60.     border: 0;\
  61.     box-shadow: none;\
  62. }\
  63. div.goog-control-hover, div.goog-control-open {\
  64.     background: {lightHover} !important;\
  65.     border-color: {lightHover} !important;\
  66. }\
  67. div#docs-branding-container.docs-branding-documents, div.goog-button-hover {\
  68.     background-color: {softBlack} !important;\
  69.     background: {softBlack};\
  70. }\
  71. div.docs-icon-folder-solid {\
  72.     background-color: {buttons} !important;\
  73. }\
  74. div.jfk-activityIndicator-circle {\
  75.     background-color: {buttons} !important;\
  76. }\
  77. div#docs-toolbar {\
  78.     background-color: {softBlack} !important;\
  79.     border: 0 !important;\
  80. }\
  81. input.goog-toolbar-combo-button-input, input.docs-title-input:focus {\
  82.     color: {darkModal} !important;\
  83.     border-color: gray !important;\
  84. }\
  85. div.goog-toolbar-menu-button-caption {\
  86.     color: {darkModal} !important;\
  87.     border-color: gray !important;\
  88. }\
  89. div.goog-toolbar-separator{\
  90.     visibility: hidden;\
  91. }\
  92. div.goog-toolbar-combo-button {\
  93.     background: {buttons} !important;\
  94. }\
  95. div#boldButton, div#undoButton, div#redoButton, div#printButton, \
  96. div#formatPainterButton, div#underlineButton, div#textColorButton, \
  97. div#insertLinkButton, div#insertCommentButton, div#alignLeftButton, \
  98. div#alignCenterButton, div#alignRightButton, div#alignJustifyButton, \
  99. div#addNumberedBulletButton, div#addBulletButton, div#bulletListPresetButton, \
  100. div#outdentButton, div#indentButton, div#clearFormattingButtonButton, \
  101. div#viewModeButton {\
  102.     background-color: {buttons} !important;\
  103.     border: 0;\
  104.     color: {darkModal} !important;\
  105. }\
  106. div.goog-menuitem.docs-submenuitem {\
  107.     border: 0 !important;\
  108. }\
  109. div.jfk-button.docs-submenuitem-splitbutton, \
  110. div.jfk-button.docs-submenuitem-splitbutton:hover {\
  111.     background-color: {darkHover} !important;\
  112. }\
  113. \
  114. /*BUTTONS*/\
  115. div.goog-toolbar-button, div.goog-toolbar-menu-button {\
  116.     background-color: {buttons} !important;\
  117.     border: 0;\
  118.     color: {darkModal} !important;\
  119. }\
  120. div.jfk-button-disabled, .jfk-button-standard.jfk-button-disabled {\
  121.     background: {disabled} !important;\
  122.     background-image: none;\
  123.     color: {darkModal};\
  124. }\
  125. div#picker:ap:1, div.jfk-button, div.jfk-button-mini, \
  126. div#docs-chrome > div > div > div > div > div > div > div > div > div {\
  127.     color: {darkModal} !important;\
  128.     background-color: {buttons} !important;\
  129.     background-image: none !important;\
  130.     border: 0 !important;\
  131. }\
  132. div.jfk-button:hover {\
  133.     color: {darkModal} !important;\
  134.     background-color: {hover} !important;\
  135.     background-image: none !important;\
  136.     border: 0 !important;\
  137. }\
  138. div.goog-toolbar-button-hover, div.goog-toolbar-menu-button-hover {\
  139.     background-color: {hover} !important;\
  140.     border: 0 !important;\
  141.     background-image: -webkit-linear-gradient(top,#f8f8f8,#f1f1f1) !important;\
  142.     background-image: -moz-linear-gradient(top,#f8f8f8,#f1f1f1) !important;\
  143.     background-image: -ms-linear-gradient(top,#f8f8f8,#f1f1f1) !important;\
  144.     background-image: -o-linear-gradient(top,#f8f8f8,#f1f1f1) !important;\
  145.     background-image: linear-gradient(top,#f8f8f8,#f1f1f1) !important;\
  146. }\
  147. div.jfk-button-standard.jfk-button-hover, div.jfk-button-hover {\
  148.     background-color: {hover} !important;\
  149.     background-image: none !important;\
  150. }\
  151. div.goog-flat-menu-button {\
  152.     color: {darkModal} !important;\
  153.     background-color: {buttons} !important;\
  154.     background-image: none !important;\
  155.     border: 0 !important;\
  156. }\
  157. div.goog-toolbar-combo-button-hover, div.goog-flat-menu-button-hover {\
  158.     background-color: {hover} !important;\
  159.     background-image: none !important;\
  160. }\
  161. div.jfk-button-standard {\
  162.     background-color: {buttons};\
  163.     background-image: none;\
  164.     border: 0 !important;\
  165. }\
  166. \
  167. /*MENUBAR*/\
  168. div.goog-menuseparator {\
  169.     border:0;\
  170. }\
  171. div.goog-menuitem, .goog-option-selected .goog-menuitem-content {\
  172.     color: {text} !important;\
  173. }\
  174. div.goog-menuitem-disabled > div > span, \
  175. div.goog-menuitem-disabled > div >.goog-menuitem-accel {\
  176.     color: {lightHover} !important;\
  177. }\
  178. div#docs-menu-shield, div.goog-menu-vertical {\
  179.     background-color: {lightModal} !important;\
  180.     background: {lightModal};\
  181. }\
  182. \
  183. /*MODAL SHARE*/\
  184. div.modal-dialog, div.modal-dialog-title, div.modal-dialog-content, \
  185. div.modal-dialog-bg {\
  186.     color:{text};\
  187.     background: {lightModal} !important;\
  188.     background-color: {lightModal} !important;\
  189.     border-bottom: 0 !important;\
  190. }\
  191. div.modal-dialog-content > body {\
  192.     background-color: {lightModal} !important;\
  193.     border-top:0;\
  194. }\
  195. span.apc-name {\
  196.     color: {text} !important;\
  197. }\
  198. div.permissions-list-container, div.permissions-list > td{\
  199.     border: 0 !important;\
  200. }\
  201. textarea.simple-sharing-note-text-area {\
  202.     background-color: {text} !important;\
  203. }\
  204. div.inviter-role-area > div.goog-flat-menu-button {\
  205.     color: {darkModal} !important;\
  206.     background-color: {buttons} !important;\
  207.     background-image: none !important;\
  208.     border: 0 !important;\
  209.     } \
  210. div.ia-invite-controls-area {\
  211.     background-color: {lightModal} !important;\
  212. }\
  213. div.link-management-select, div.jfk-button-action, \
  214. button.simple-sharing-primary-button {\
  215.     color: {darkModal};\
  216.     background: {buttons} !important;\
  217.     background-color: {buttons} !important;\
  218.     border: 0 !important;\
  219.     background-image: none !important;\
  220. }\
  221. div.inviter-role-area > div.goog-flat-menu-button-hover, \
  222. div.link-management-select:hover {\
  223.     background-color: {hover} !important;\
  224.     background-image: none !important;\
  225.     border: 0 !important;\
  226. }\
  227. div.link-management-url-container {\
  228.     border-color: {buttons} !important;\
  229. }\
  230. td.vs-learn-more-text > a, a.ap-learn-more-link, div.share-fmb, \
  231. div.vs-info-text > a, a.simple-sharing-link-sharing-learn-more, \
  232. span.vpc-change-link {\
  233.     color: {text} !important;\
  234. }\
  235. \
  236. /*MODAL FILE BROWSER*/\
  237. div.picker.modal-dialog, div.picker-iframe.picker-min.goog-menu {\
  238.     border:0;\
  239. }\
  240. div.goog-tree-root {\
  241.     border: 0 !important;\
  242. }\
  243. div.folder-creation-link, div.folder-creation-link:hover {\
  244.     color: {text} !important;\
  245. }\
  246. div.folders-popup-summary {\
  247.     background: transparent !important;\
  248. }\
  249. div.folders-popup {\
  250.     background-color: {text};\
  251. }\
  252. div.picker-min-arrow-inner {\
  253.     border-color: {darkModal} transparent !important;\
  254. }\
  255. \
  256. /*REVISIONS*/\
  257. div#docs-revisions-sidebar {\
  258.     background-color: {darkModal} !important;\
  259.     border-left: 0;\
  260. }\
  261. /*frame around tile-text*/\
  262. textarea.docs-revisions-tile-text-box:focus:enabled {\
  263.     border-color: {text} !important;\
  264. }\
  265. div#docs-revisions-sidebar-header, div.docs-revisions-sidebar-date-group, \
  266. div.docs-revisions-chromecover-content-color-default, \
  267. div#docs-toolbar-iterator-label {\
  268.     background-color: {black} !important;\
  269.     border: 0 !important;\
  270.     color: {text} !important;\
  271. }\
  272. div.docs-revisions-tile-content-wrapper, div.docs-revisions-tile, \
  273. div#docs-revisions-sidebar-actions {\
  274.     border: 0;\
  275. }\
  276. span.docs-revisions-tile-link, .docs-revisions-tile-timestamp, \
  277. textarea.docs-revisions-tile-text-box, \
  278. textarea.docs-revisions-tile-text-box:disabled, \
  279. div.docs-revisions-sidebar-header-text-color-brand, \
  280. div.docs-revisions-sidebar-name-filter-switch-container > label {\
  281.     color: {text} !important;\
  282. }\
  283. div.docs-revisions-tile-selected {\
  284.     background-color: {darkHover} !important;\
  285. }\
  286. div.goog-sa-pane-inner, div.docs-revisions-tile-hover {\
  287.     background-color: {darkHover} !important;\
  288.     background: {darkHover};\
  289. }\
  290. div.docs-revisions-chromecover-titlebar-color-brand {\
  291.     background-color: {buttons} !important;\
  292.     color: {darkModal} !important;\
  293. }\
  294. div.docs-revisions-chromecover-titlebar-color-brand:hover {\
  295.     background-color: {hover} !important;\
  296. }\
  297. div.docs-revisions-chromecover-titlebar-button-action {\
  298.     background-color: {darkModal} !important;\
  299.     background: {darkModal} !important;\
  300.     color: {text} !important;\
  301. }\
  302. div.docs-revisions-sidebar-actions {\
  303.     border-top: 1px solid {lightModal} !important;\
  304. }\
  305. \
  306. /*PUBLISH*/\
  307. div.modal-dialog > a {\
  308.     color: {text} !important;\
  309. }\
  310. hr.pub-dialog-sep {\
  311.     border-top-color: {text} !important;\
  312. }\
  313. div.goog-tab-hover, div.goog-tab.pub-dialog-tab.goog-tab-selected {\
  314.     border: 0 !important;\
  315.     background: {buttons} !important;\
  316. }\
  317. \
  318. /*MAIL ATTACHMENT*/\
  319. textarea.email-attach-medium-text-area {\
  320.     background-color: {softGrey} !important;\
  321.     border-color: {text} !important;\
  322. }\
  323. \
  324. /*PAGE SETTINGS*/\
  325. div.goog-menu {\
  326.     background: {darkModal} !important;\
  327. }\
  328. \
  329. /*DOCUMENT*/\
  330. a, a:link, a:hover, a:visited {\
  331.     color: {text} !important;\
  332. }\
  333. body {\
  334.     background-color: {lightModal} !important;\
  335.     color: {text} !important;\
  336. }\
  337. .docs-bubble-link, .docs-bubble a {\
  338.     color: {text} !important;\
  339. }\
  340. div#docs-editor, div#docs-editor-container {\
  341.     background-color: black !important;\
  342. }\
  343. div#kix-appview {\
  344.     background-color: {softBlack} !important;\
  345. }\
  346. div#docs-equationtoolbar {\
  347.     background: {black} !important;\
  348.     border: 0 !important;\
  349. }\
  350. div.kix-page-paginated {\
  351.     box-shadow: none !important}\
  352. div.kix-print-block, div.kix-page-content-wrapper {\
  353.     background-color: {softGrey} !important;\
  354. }\
  355. td.kix-documentmetricsdialog-row {\
  356.     border-bottom-color: {text} !important;\
  357. }\
  358. \
  359. /*FIND-REPLACE*/\
  360. div.kix-findselectionprovider-underlay-match, \
  361. div.kix-findandreplaceoverlayprovider-match, div.kix-selection-overlay {\
  362.     background-color: {lightHover} !important;\
  363.     border-color: {lightHover};\
  364. }\
  365. table.docs-findinput-container, table.docs-findinput-container-focus {\
  366.     background-color: {text} !important;\
  367.     border: 0;\
  368. }\
  369. \
  370. /*TABLES*/\
  371. td.goog-palette-cell {\
  372.     background-color: {buttons} !important;\
  373. }\
  374. td.goog-palette-cell:hover {\
  375.     background-color: {hover} !important;\
  376. }\
  377. div.kix-equation-toolbar-palette-item {\
  378.     border: 0 !important;\
  379. }\
  380. div.goog-dimension-picker-unhighlighted {\
  381.     background-color: {text} !important;\
  382. }\
  383. \
  384. /*COMPACT TOOLBAR*/\
  385. div.ac-renderer {\
  386.     background-color: {darkModal} !important;\
  387.     border: 0 !important;\
  388.     color: {disabled} !important;\
  389. }\
  390. div.ac-active {\
  391.     background-color: {darkHover} !important;\
  392. }\
  393. div.goog-menuitem-content {\
  394.     color: {text} !important;\
  395. }\
  396. div.goog-menuitem-highlight {\
  397.     background: {darkHover} !important;\
  398.     border: 0;\
  399. }\
  400. \
  401. /*IMAGE*/\
  402. div.goog-slider-thumb, div.docs-rotationhandle-stick, \
  403. div.docs-rotationhandle-circle, div.docs-squarehandleselectionbox-handle {\
  404.     background-color: {text};\
  405.     background-image: none;\
  406. }\
  407. div.docs-squarehandleselectionbox-border{\
  408.     border-color: {text};\
  409. }\
  410. div.docs-image-effect-sidebar, div.docs-image-effect-sidebar-scroll {\
  411.     background-color:{darkModal};\
  412.     border:0;\
  413. }\
  414. div.docs-image-effect-recolor-tile, div.docs-image-effect-adjustment-tile, \
  415. div.docs-image-effect-sidebar-header {\
  416.     border:0;\
  417.     background-color:{darkModal};\
  418.     color: {buttons} !important;\
  419. }\
  420. \
  421. /*BUBBLES*/\
  422. div.docs-bubble, span.docs-bubble-link, div.jfk-bubble {\
  423.     border:0;\
  424.     background-color:{darkModal};\
  425.     color: {buttons} !important;\
  426. }\
  427. div.docs-link-insertlinkbubble-suggestionholder, \
  428. div.docs-link-linksuggestiongroup {\
  429.     background-color: {darkModal} !important;\
  430.     border: 0 !important;\
  431. }\
  432. div.jfk-bubble-arrowimplbefore, div.jfk-bubble-arrowimplafter {\
  433.     border-color: {darkModal} transparent !important;\
  434. }\
  435. \
  436. /*COMMENTS*/\
  437. div.docos-anchoreddocoview-arrow-outer, \
  438. div.docos-anchoreddocoview-arrow-inner {\
  439.     border-right: 20px solid {darkHover} !important;\
  440. }\
  441. div.docos-streampane-content, div.docos-streampane-header, \
  442. div.docos-replyview-quote {\
  443.     border:0;\
  444.     background-color:{darkHover};\
  445.     color: {buttons} !important;\
  446. }\
  447. div.docos-streampane-header .docos-new-comment-button, \
  448. div.docos-streampane-header jfk-button {\
  449.     background-color: {buttons};\
  450.     color: {darkModal} !important;\
  451. }\
  452. div.docos-overflowmenu-outer > .docos-docomenu-dropdown, \
  453. div.docs-docos-activitybox {\
  454.     border: 0;\
  455. }\
  456. div.docos-streamdocoview {\
  457.     border-top-color: {softGrey} !important;\
  458. }\
  459. div#docos-comment-bubble {\
  460.     border: 0 !important;\
  461.     background: {lightHover} !important;\
  462. }\
  463. div.docos-streamrootreplyview, div.docos-streamrootreplyview:hover, \
  464. div.docos-streamreplyview, div.docos-streamdocoview-inputcontainer, \
  465. div.docos-overflowmenu-vertical, div.docos-actionmenu-vertical {\
  466.     background-color: {darkModal} !important;\
  467. }\
  468. div.docos-anchoredreplyview-author, div.docos-streamdocoview-authorname, \
  469. div.docos-streamdocoview-body, span.docos-streamreplyview-body, \
  470. span.docos-replyview-quote {\
  471.     color: {text} !important;\
  472. }\
  473. div.docos-docoview-reopen, div.docos-docoview-comment, \
  474. div.docos-docoview-resolve, div.docos-replyview-edit, \
  475. div.docos-replyview-edit:hover, div.docos-replyview-delete, \
  476. div.docos-replyview-delete:hover, div.docos-showrepliesbutton-collapsed {\
  477.     color: {text} !important;\
  478. }\
  479. div.docos-anchoredreplyview, div.docos-anchoreddocoview-input-pane, \
  480. div.docos-showrepliesbutton {\
  481.     background-color: {darkHover} !important;\
  482.     background: {darkHover} !important;\
  483.     color: {text} !important;\
  484. }\
  485. textarea.docos-input-textarea {\
  486.     background-color: {buttons} !important;\
  487.     border: 0 !important;\
  488. }\
  489. div.docos-anchoredreplyview, div.docos-showrepliesbutton {\
  490.     border-bottom-color: {softGrey} !important;\
  491. }\
  492. div.docos-anchoredreplyview .docos-anchoredreplyview-body, \
  493. div.docos-streamreplyview-author {\
  494.     color: {text} !important;\
  495. }\
  496. div.docos-enable-new-header>.docs-docos-caret-inner, \
  497. div.docs-docos-caret-outer {\
  498.     border-color: {darkModal} transparent !important;\
  499. }\
  500. \
  501. /*SPECIAL CHARS*/\
  502. div.ita-cp-search, div.ita-cp-search.ita-cp-focus, div.ita-cp-hwt, \
  503. input.ita-cp-input, input.label-input-label {\
  504.     background-color: {text} !important;\
  505.     border-color: {text} !important;\
  506. }\
  507. div.goog-char-picker-hovercard {\
  508.     border-color: {lightModal} !important;\
  509.     background-color: {lightHover} !important;\
  510. }\
  511. \
  512. /*ALT TEXT*/\
  513. textarea#alt-text-dialog-description {\
  514.     background-color: {buttons} !important;\
  515.     border: 0 !important;\
  516. }\
  517. \
  518. /*SPELL-CHECK*/\
  519. label.docs-spellcheckslidingdialog-title-text {\
  520.     color: {buttons} !important;\
  521. }\
  522. div.docs-slidingdialog {\
  523.     border:0;\
  524.     background-color:{darkModal};\
  525.     color: {buttons} !important;\
  526. }\
  527. td.docs-spellcheckslidingdialog-replacement-input-container {\
  528.     background-color: {text} !important;\
  529.     border: 0;\
  530. }\
  531. div#docs-spellcheckslidingdialog-suggestion-list {\
  532.     background: {lightHover} !important;\
  533.     border: 0;\
  534. }\
  535. \
  536. /*RESEARCH - NEW EXPLORE SIDEBAR (Ctrl+Alt+Shift+I)*/\
  537. div.docs-explore-sidebar-title {\
  538.     background-color: {darkModal};\
  539.     border: 0;\
  540. }\
  541. div.docs-explore-sidebar, div.docs-dictionary-sidebar {\
  542.     background-color: {lightModal};\
  543. }\
  544. div.goog-sa-searchbox-back-button.jfk-button-disabled, \
  545. div.goog-sa-searchbox-back-button, \
  546. div.goog-sa-searchbox-fwd-button.jfk-button-disabled, \
  547. div.goog-sa-searchbox-fwd-button, \
  548. div.goog-sa-searchbox.goog-sa-component-online .goog-sa-searchbox-selectormenu {\
  549.     background-color: {disabled} !important;\
  550.     background: {disabled} !important;\
  551.     border: 1px solid {text} !important;\
  552.     border-right: none !important;\
  553. }\
  554. div.goog-sa-searchbox-container, div.goog-sa-searchbox-selectormenu, \
  555. div.docs-explore-widget {\
  556.     border-color: {text} !important;\
  557.     background-color: {softGrey} !important;\
  558. }\
  559. div.goog-sa-settings-controls, div.goog-sa-settings-toggle-content, \
  560. div.goog-sa-pane-search {\
  561.     border-color: {text} !important;\
  562. }\
  563. div.goog-sa-welcome-content > a, div.goog-sa-snippet-title-link, \
  564. div.goog-sa-component-active, div.docs-dictionary-titlebar-heading, \
  565. .goog-sa-personal.goog-sa-component-active.goog-sa-component-online \
  566. .goog-sa-snippet-title-link, .goog-sa-personal .goog-sa-snippet-title-link, \
  567. div.goog-sa-pane-title, .goog-sa-content.goog-sa-common-heading \
  568. .goog-sa-content-link, div.docs-explore-topicitem-title, \
  569. div.docs-explore-topicitem-generator-text, div.docs-explore-card-more-button, \
  570. div.docs-explore-card-title-heading, div.docs-explore-tabbar-tab-label, \
  571. div.docs-explore-serp-webresult-snippet, div.docs-explore-emptylist-title, \
  572. div.docs-explore-emptylist-body, div.docs-explore-sidebar-title-heading, {\
  573.     color: {text} !important;\
  574. }\
  575. div.docs-explore-searchbar-suggestion-itemview-title, \
  576. span.docs-explore-widget-text, div.docs-explore-card-more-button {\
  577.     color: {darkHover} !important;\
  578. }\
  579. div.goog-sa-previewpane-closestrip, div.goog-sa-previewpane, \
  580. div.goog-sa-pane-attribution, div.docs-explore-card, \
  581. div.docs-explore-nuggetscardview-container, div.docs-explore-searchbar-ac-active, \
  582. div.docs-explore-serp-webresultsview-card-container {\
  583.     background-color: {lightModal} !important;\
  584.     border-color: {text} !important;\
  585. }\
  586. div.goog-sa-component-online.goog-sa-component-active.goog-sa-sectiongroup-heading, \
  587. div.goog-sa-snippet .goog-sa-button-bar, div.goog-sa-button-bar, \
  588. div.goog-sa-personal.goog-sa-component-active .goog-sa-button-bar, \
  589. div.docs-explore-searchbar-ac-renderer {\
  590.     background-color: {softGrey} !important;\
  591.     border-color: {text} !important;\
  592. }\
  593. div.goog-sa-sectiongroup-heading {\
  594.     border: 0 !important;\
  595. }\
  596. div.goog-sa-common-heading {\
  597.     background-color: transparent;\
  598. }\
  599. div.goog-sa-scrollfloater > div, div.docs-explore-serp-webresultscard-header, \
  600. div.docs-explore-serp-webresultscard-content, \
  601. div.docs-explore-serp-webresultscard, \
  602. div.docs-explore-serp-webresultscard-allresults {\
  603.     background-color: {lightModal} !important;\
  604.     border-color: {text} !important;\
  605. }\
  606. a.goog-sa-common-heading, .goog-sa-content-link, a.goog-sa-snippet-title-link,\
  607. a.goog-sa-snippet-title-link:hover, a.goog-sa-link {\
  608.     color: {text} !important;\
  609.     text-decoration: underline !important;\
  610. }\
  611. div.goog-sa-component-online.goog-sa-component-focus.goog-sa-searchbox .goog-sa-searchbox-selectormenu, \
  612. div.goog-sa-component-online.goog-sa-component-active.goog-sa-snippet {\
  613.     border-color: {text} !important;\
  614. }\
  615. div.goog-sa-sneakpeek, div.goog-sa-sneakpeek:last-child {\
  616.     background-color: {softGrey} !important;\
  617.     border-top-color: {lightHover} !important;\
  618.     border-bottom-color: {lightHover} !important;\
  619. }\
  620. div.docs-explore-tabbar-tab-selected {\
  621.     border-bottom-color: {lightHover} !important;\
  622. }\
  623. \
  624. /*DEFINITION*/\
  625. div.goog-sa-definition {\
  626.     border-color: {text} !important;\
  627. }\
  628. \
  629. /*PREFS*/\
  630. div.docs-preferencesdialog-list-body {\
  631.     background-color: {lightModal};\
  632.     color: {text} !important;\
  633. }\
  634. div.docs-preferencesdialog-list-body::-webkit-scrollbar-thumb {\
  635.     border: 0 !important;\
  636. }\
  637. \
  638. /*USER DICTIONARY*/\
  639. div.docs-userdictionarydialog-row-container {\
  640.     border: 0;\
  641. }\
  642. div.docs-userdictionarydialog-row-container:hover {\
  643.     background: {darkHover} !important;\
  644.     border: 0;\
  645. }\
  646. div.docs-userdictionarydialog-list-container {\
  647.     border:0;\
  648.     background-color:{darkModal};\
  649.     color: {buttons} !important;\
  650. }\
  651. div.docs-userdictionarydialog-button-add-container {\
  652.     border: 0}\
  653. div.modal-dialog-buttons > button, button.goog-buttonset-action {\
  654.     color: {darkModal} !important;\
  655.     background: {buttons} !important;\
  656.     background-color: {buttons} !important;\
  657.     border: 0 !important;\
  658.     background-image: none !important;\
  659. }\
  660. div.modal-dialog-buttons > button:hover, button.goog-buttonset-action:hover {\
  661.     background-color: {hover} !important;\
  662.     background-image: none !important;\
  663.     border: 0 !important;\
  664. }\
  665. \
  666. /*KBSHORTCUTS*/\
  667. div.apps-shortcutshelppopup-ac-renderer {\
  668.     background-color: {darkModal} !important;\
  669.     border: 0 !important;\
  670. }\
  671. h3.apps-shortcutshelppopup-search-label, \
  672. div.apps-shortcutshelpcontentimpl-search-label, \
  673. h3.apps-actiondatawidget-content-header, \
  674. h2.apps-shortcutshelpcontentimpl-dialog-title, \
  675. div.apps-navigationwidget {\
  676.     color: {text} !important;\
  677. }\
  678. div.apps-navigationwidget-item-selected {\
  679.     background-color:{darkHover} !important;\
  680.     color: {text} !important;\
  681. }\
  682. div.apps-shortcutshelpcontentimpl-container {\
  683.     background-color: {darkModal} !important;\
  684.     color: {text} !important;\
  685. }\
  686. table.apps-shortcutshelppopup-content {\
  687.     background-color: {lightModal};\
  688.     color: {text} !important;\
  689. }\
  690. td.apps-actiondatawidget-content-element, \
  691. a.apps-shortcutshelppopup-help-center-link {\
  692.     color: {text} !important;\
  693.     border: 0;\
  694. }\
  695. div.apps-shortcutshelppopup, \
  696. div.apps-navigationwidget-item-hover {\
  697.     background-color:{darkHover} !important;\
  698.     box-shadow: none;\
  699. }\
  700. div.apps-shortcutshelppopup-header, div.apps-shortcutshelppopup-container {\
  701.     border: 0 !important;\
  702. }\
  703. \
  704. /*USERPANEL*/\
  705. /*div#gb == div#docs-header > div+div*/\
  706. div#gb > div > div > div > div+div > div+div {\
  707.     background: {darkHover} !important;\
  708. }\
  709. div#gb > div > div > div > div > div > div {\
  710.     background: none !important;\
  711. }\
  712. div#gb > div > div > div > div > div > div > div > div,\
  713. div#gb > div > div > div > div+div > div > a{\
  714.     color: {disabled} !important;\
  715. }\
  716. div#gb > div > div > div > div > div > div > div > a {\
  717.     background-color: {lightModal} !important;\
  718.     border: 0;\
  719.     color: {disabled} !important;\
  720. }\
  721. div#gb > div > div > div > div > div > div > div > a:hover {\
  722.     color: {darkModal} !important;\
  723.     background-color: {hover} !important;\
  724.     background-image: none !important;\
  725.     border: 0 !important;\
  726. }\
  727. div#gb > div > div > div > div > div > div {\
  728.     border-bottom-color: {darkHover} !important;\
  729. }\
  730. \
  731. /*RULER*/\
  732. div.kix-ruler-contributed-dragger-container, div#kix-ruler {\
  733.     border:0;\
  734.     background-color: {softBlack} !important;\
  735. }\
  736. div.docs-ruler-background-inner {\
  737.     background-color: {softGrey} !important;\
  738. }\
  739. \
  740. /*INPUTS*/\
  741. input.docs-title-input {\
  742.     color: {text} !important;\
  743.     background-color: {black} !important;\
  744.     background-image: none !important;\
  745.     border: 0;\
  746.     box-shadow: none;\
  747. }\
  748. textarea.jfk-textinput, textarea.jfk-textinput:focus, input.jfk-textinput, \
  749. input.jfk-textinput:focus, div.inviter-recipient-area {\
  750.     background-color: {softGrey} !important;\
  751.     border: 0;\
  752.     color: {darkModal} !important;\
  753.     outline: none;\
  754. }\
  755. input.hsv-input {\
  756.     color: {darkModal} !important;\
  757.     background-color: {softGrey} !important;\
  758.     border-color: gray !important;\
  759. }\
  760. \
  761. /*NAVIGATION*/\
  762. div.docs-icon-close-thin {\
  763.     background-color: {lightHover} !important;\
  764. }\
  765. div.navigation-widget-hat-title {\
  766.     color: {text} !important;\
  767. }\
  768. div.navigation-widget-hat {\
  769.     border-bottom: solid 1px {lightHover};\
  770. }\
  771. div.navigation-widget > div+div+div > div[role=menuitem] > div {\
  772.     color: {text} !important;\
  773. }\
  774. \
  775. /*CONTAINERS*/\
  776. div.webstore-widget {\
  777.     color:{text};\
  778.     background: {lightModal} !important;\
  779.     background-color: {lightModal} !important;\
  780.     border-bottom: 0 !important;\
  781. }\
  782. \
  783. ";
  784. var webstorecss = "\
  785. /*WEBSTORE*/\
  786. *:focus {\
  787.     outline: none;\
  788. }\
  789. body > div > div > div > div > span[role=button], \
  790. body > div > div > div > div > div > div > div > div > a > div+div+div > \
  791. div+div > div > div {\
  792.     color: {darkModal} !important;\
  793.     background: {buttons} !important;\
  794.     background-color: {buttons} !important;\
  795.     border: 0 !important;\
  796.     background-image: none !important;\
  797. }\
  798. body > div > div > div > div > span[role=button]:hover, \
  799. body > div > div > div > div > div > div > div > div > a > div+div+div > \
  800. div+div > div > div:hover {\
  801.     background-color: {hover} !important;\
  802.     background-image: none !important;\
  803.     border: 0 !important;\
  804. }\
  805. body > div > div > div > div > div > div > div > div > a > div > div {\
  806.     background-color: {lightModal} !important;\
  807.     border: 0 !important;\
  808. }\
  809. body > div > div > div > div > div > div > div > div > a > div, \
  810. body > div > div > div > div > div > div > div > div > a > div > div > img {\
  811.     border: 0 !important;\
  812. }\
  813. body > div > div > div > div > div > input#searchbox-input {\
  814.     color: {text} !important;\
  815.     background-color: {softGrey} !important;\
  816.     border: 0;\
  817.     box-shadow: none;\
  818. }\
  819. body, body > div > div > div, body > div > div+div+div, \
  820. body > div > div > div > div > div > div > div > div > a > div, \
  821. body > div > div > div > div > div > div > div > div > a > div+div+div {\
  822.     background-color: {darkModal} !important;\
  823.     border: 0 !important;\
  824.     color: {text} !important;\
  825. }\
  826. body > div > div > div > div > div[role=listbox] {\
  827.     background: {darkModal} !important;\
  828.     border: 0 !important;\
  829. }\
  830. body > div > div > div > div > div[role=listbox] > div[role=option] {\
  831.     background: {darkModal} !important;\
  832. }\
  833. body > div > div > div > div > div[role=listbox] > div[role=option]:hover {\
  834.     background: {softBlack} !important;\
  835. }\
  836. body > div > div > div > div > div > div > div > div > div, \
  837. body > div > div > div > div > div > div > div > div > a > div > div > \
  838. div+div > div, body > div > div > div > div > div > div > div > div > a > \
  839. div+div+div > div+div+div > div {\
  840.     color: {text} !important;\
  841. }\
  842. \
  843. ";
  844. var opencss = "\
  845. /*MODAL OPEN*/\
  846. *:focus {\
  847.     outline: none;\
  848. }\
  849. body {\
  850.     background-color: {lightModal} !important;\
  851. }\
  852. div[role=button] {\
  853.     color: {darkModal} !important;\
  854.     background-color: {buttons} !important;\
  855.     background-image: none;\
  856.     border: 0 !important;\
  857. }\
  858. div[role=button]:hover {\
  859.     color: {darkModal} !important;\
  860.     background-color: {hover} !important;\
  861.     background-image: none;\
  862.     border: 0 !important;\
  863.     box-shadow: none !important;\
  864.     -webkit-box-shadow: none !important;\
  865. }\
  866. div#doclist > div > div > div > div > div > div > div > \
  867. div > div > div > div[role=listbox], \
  868. div#doclist > div > div > div > div > div+div > div > \
  869. div > div > div, div[role=menu] {\
  870.     background-color: {lightModal} !important;\
  871. }\
  872. div#doclist > div > div > div > div > div > div > div > div+div, \
  873. div#doclist > div > div > div > div > div > div > div > div > div > div+div, \
  874. input {\
  875.     background-color: {lightModal} !important;\
  876.     border-color: {text} !important;\
  877.     color: {text} !important;\
  878. }\
  879. div[role=tab], div[role=heading], div[role=status] {\
  880.     color: {text} !important;\
  881.     border-color: {text} !important;\
  882. }\
  883. div#doclist > div > div > div > div > div, div[target=layout] {\
  884.     background-color: {lightModal} !important;\
  885.     background-image: none;\
  886.     border: 0 !important;\
  887.     box-shadow: none !important;\
  888.     -webkit-box-shadow: none !important;\
  889. }\
  890. div[role=option] > div, div[role=option] > div > div, \
  891. div#doclist > div > div > div > div > div > div > div > div > div > div > \
  892. div > div > div > div > div > div > div > div+div {\
  893.     background-color: {buttons} !important;\
  894.     border: 0 !important;\
  895. }\
  896. div#doclist > div > div > div > div > div > div > div > div > div > div > \
  897. div > div > div > div > div > div+div, div[data-target=layout] {\
  898.     background-color: {lightModal} !important;\
  899.     border:0 !important;\
  900. }\
  901. div#doclist > div > div > div > div > div > div > div > div > div > label, \
  902. div[role=menuitem] > div, div[role=menuitemradio] > div, \
  903. a.picker-actionpane-notice-link {\
  904.     color: {text} !important;\
  905.     border: 0 !important;\
  906. }\
  907. div[role=presentation] > div[role=option] {\
  908.     background-color: none !important;\
  909. }\
  910. \
  911. ";
  912. var movecss = "\
  913. *:focus {\
  914.     outline: none;\
  915. }\
  916. div[role=button] {\
  917.     color: {darkModal} !important;\
  918.     background-color: {buttons} !important;\
  919.     background-image: none;\
  920.     border: 0 !important;\
  921. }\
  922. div[role=button]:hover {\
  923.     color: {darkModal} !important;\
  924.     background-color: {hover} !important;\
  925.     background-image: none;\
  926.     border: 0 !important;\
  927.     box-shadow: none !important;\
  928.     -webkit-box-shadow: none !important;\
  929. }\
  930. input {\
  931.     background-color: {lightModal} !important;\
  932.     border-color: {text} !important;\
  933.     color: {text} !important;\
  934. }\
  935. div#doclist > div > div+div > div {\
  936.     background-color: {lightModal} !important;\
  937. }\
  938. div[role=heading], div[role=status] {\
  939.     color: {text} !important;\
  940.     border-color: {text} !important;\
  941. }\
  942. div[role=menuitem] > div > div, div[role=menuitem] > div > div > a {\
  943.     color: {text} !important;\
  944. }\
  945. div[role=menu], div[role=menuitem] > div, div[role=menuitem] > div > \
  946. div+div+div > div {\
  947.     background-color: {lightModal} !important;\
  948. }\
  949. div[role=menuitem]>div:hover, div[role=menuitem] > div > div+div+div > \
  950. div:hover {\
  951.     background-color: {darkHover} !important;\
  952. }\
  953. div[role=group] {\
  954.     border-color: {text} !important;\
  955. }\
  956. \
  957. ";
  958.  
  959. var css;
  960. if (/webstore/i.test(window.location.href)) {
  961.     css = webstorecss;
  962. } else if (/picker.*?kix-fileopen/i.test(window.location.href) ||
  963.           (/picker.*?kix&/i.test(window.location.href))) {
  964.     css = opencss;
  965. } else if (/picker.*?kix-move/i.test(window.location.href)) {
  966.     css = movecss;
  967. } else if (/picker.*?profilePhoto=true/i.test(window.location.href)) {
  968.     css = opencss;
  969. } else {
  970.     css = maincss;
  971.     var panel=document.body;
  972.     var av_style = 'position: relative; opacity: 0.3; border-radius: 5px;';
  973.     var av='<div style="position: absolute; left: 48.5vw; top: 1vh;">\
  974. <a href="https://github.com/KeyWeeUsr/Userscripts">\
  975. <img id="kwu_av" style="' + av_style + '"\
  976. src="https://github.com/identicons/KeyWeeUsr.png" width="24"></img></a></div>';
  977.     panel.insertAdjacentHTML('beforeend', av);
  978. }
  979. css = css.replace(new RegExp('{text}', 'gi'), text);
  980. css = css.replace(new RegExp('{black}', 'gi'), black);
  981. css = css.replace(new RegExp('{lightHover}', 'gi'), lightHover);
  982. css = css.replace(new RegExp('{darkHover}', 'gi'), darkHover);
  983. css = css.replace(new RegExp('{buttons}', 'gi'), buttons);
  984. css = css.replace(new RegExp('{softBlack}', 'gi'), softBlack);
  985. css = css.replace(new RegExp('{darkModal}', 'gi'), darkModal);
  986. css = css.replace(new RegExp('{hover}', 'gi'), hover);
  987. css = css.replace(new RegExp('{lightModal}', 'gi'), lightModal);
  988. css = css.replace(new RegExp('{softGrey}', 'gi'), softGrey);
  989. css = css.replace(new RegExp('{disabled}', 'gi'), disabled);
  990.  
  991. GM_addStyle(css);
  992. })();
  993.  
  994. /*
  995. Missing:
  996. 1) Docs Help popup
  997. 2) Report a problem screen cover
  998. Notify me if there's something missing/undesirable.
  999. */