Gmail: reduce empty horizontal space in new design sidebar
authorDariusz Murakowski <murakdar@gmail.com>
Mon, 1 Oct 2018 20:19:57 +0000 (16:19 -0400)
committerDariusz Murakowski <murakdar@gmail.com>
Mon, 1 Oct 2018 20:19:57 +0000 (16:19 -0400)
narrow sidebar of new Gmail look.user.js [new file with mode: 0644]

diff --git a/narrow sidebar of new Gmail look.user.js b/narrow sidebar of new Gmail look.user.js
new file mode 100644 (file)
index 0000000..a3363a1
--- /dev/null
@@ -0,0 +1,76 @@
+// ==UserScript==
+// @name         narrow sidebar of new Gmail look
+// @namespace    http://dariusz.murakowski.org/
+// @version      0.3
+// @description  modify CSS to reduce width of various classes
+// @author       Dariusz Murakowski
+// @match        https://mail.google.com/mail/u/*
+// @require      http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js#md5=3576a6e73c9dccdbbc4a2cf8ff544ad7
+// @require      https://gist.github.com/raw/2625891/waitForKeyElements.js#md5=00fb18e232833d213389750973375f62
+// @grant        GM_addStyle
+// @run-at       document-idle
+// ==/UserScript==
+
+(function() {
+    'use strict';
+
+    // from https://somethingididnotknow.wordpress.com/2013/07/01/change-page-styles-with-greasemonkeytampermonkey/
+    ///*
+    function addGlobalStyle(css) {
+        var head, style;
+        head = document.getElementsByTagName('head')[0];
+        if (!head) { return; }
+        style = document.createElement('style');
+        style.type = 'text/css';
+        style.innerHTML = css;
+        head.appendChild(style);
+    }
+    //*/
+    // unnecessary; see https://stackoverflow.com/questions/23683439/gm-addstyle-equivalent-in-tampermonkey
+
+    // recommended by comment at https://stackoverflow.com/questions/12897446/userscript-to-wait-for-page-to-load-before-executing-code-techniques
+    //this.$ = this.jQuery = jQuery.noConflict(true);
+
+    /*
+    function setWidth (jNode, width) {
+        var s = width + 'px !important';
+        //jNode.css({ 'min-width': s, 'max-width': s, 'width': s });
+        //jNode.width(width + 'px');
+        jNode.css('min-width', 'none');
+        console.log('dkm run setWidth ' + width, jNode);
+    }
+    */
+    // didn't work
+
+    // complete left sidebar; <div class="nH oy8Mbf nn aeN" style="width: 187px; height: 548px;">
+    //GM_addStyle('.aeN { min-width: 156px !important; max-width: 156px !important; }');  // originally 256px
+    //waitForKeyElements('.aeN', (function(n){setWidth(n,156);}));
+    waitForKeyElements('.aeN', (n => {GM_addStyle('.aeN { min-width: 196px !important; max-width: 196px !important; }');}));
+
+    // top portion (Inbox, Starred, Chats, Sent, Drafts, More)
+    //GM_addStyle('.wT { min-width: 140px !important; max-width: 140px !important; }');  // originally 240px
+    //waitForKeyElements('.wT', (function(n){setWidth(n,140);}));
+    waitForKeyElements('.wT', (n => {GM_addStyle('.wT { min-width: 180px !important; max-width: 180px !important; }');}));
+
+    // <div class="TN bzz aHS-bnq" style="margin-left:0px"><div class="aio UKr6le"> contains
+    // <span class="nU n1">[label name]</span> and <div class="bsU">[number unread]</div>
+    //GM_addStyle('.TN>.aio { flex-grow: 50%; }');  // original flex: 1 1 0; (flex-grow flex-shrink flex-basis)
+    //waitForKeyElements('.TN>.aio', (n => {n.css('flex-grow','50%');}));
+
+    //class="CL"
+    //padding-left: 26px;
+    GM_addStyle('.CL { padding-left: 16px !important; }');
+
+    // .n4
+    //padding: 0 0 0 26px;
+    GM_addStyle('.n4 { padding: 0 0 0 16px !important; }');
+
+    // .TN
+    //padding: 0 8px 0 26px;
+    GM_addStyle('.TN { padding: 0 8px 0 16px !important; }');
+
+    // .pp
+    //margin: 0 0 0 25px;
+    GM_addStyle('.pp { margin: 0 0 0 15px !important; }');
+
+})();
\ No newline at end of file