/*
 *  Author:      Twily                      2016-2017
 *  Description: Vivaldi Style file & Setting choices
 *  
 *  Usage:
 *      Save this file as 'twily.css' in
 *          Linux: /opt/vivaldi/resources/vivaldi/style/
 *          Win:   /AppData/Local/Vivaldi/Application/<version>/resources/vivaldi/style/
 *      Edit 'common.css' and add '@import "twily.css";'
 *
 *  Settings (Optional):
 *      Appearance  > Use Native Window, Hide Status Bar
 *      Themes      > Dark Theme
 *      Start Page  > Custom BG, Max 4 Col
 *      Tabs        > Right (w/o Close Button & Thumbnails)
 *      Tabs        > New Tab Page (Custom Homepage)
 *      Tabs        > Tab Handling > Focus Page Content (Custom Homepage)
 *      Address Bar > Buttom (w/o Fast Forward/Rewind)
 *      Mouse       > Disable Gestures
 *      Search      > Disable Search Field, Set Engine
 *
 *  Keyboard (Optional):
 *      Enable Single Key Shortcuts
 *      View > Bookmarks Bar - Bind 'B'
 *      View > Status Bar - Bind 'F10'
 *      Tab > New Tab - Bind 'T'
 *      Tab > Clone Tab - Bind 'Shift T'
 *      Page > Focus Address Field - Bind 'O'
 *      Page > Reload Page - Bind 'R'
 *      Page > Force Page Reload - Bind 'Shift R'
 *      Page > Page Up - Bind 'K'
 *      Page > Page Down - Bind 'J'
 *      Page > Scroll Page to Top - Bind 'G'
 *      Page > Scroll Page to Bottom - Bind 'Shift G'
 *      Page > Disable Keyboard Shortcuts - Bind 'Shift K'
 *      Page > Find in Page - Bind '/'
 *
 *  Extensions (Optional):
 *      uBlock Origin
 *      Dark Reader
 *      Cloudy Calculator
 *      Stylish (Hide button)
 *
 *  More:
 *      F2 > Enter 'Set(tings)', 'Ext(ensions)' etc.
 *      F4 > Toggle Side Bar
 *      Alt > Open Menu
 *      Customize this file further by analyzing common.css
 *          (Readable version http://twily.info/vivaldi/common.css)
 */


/* General Cleanup */
#header { min-height: 0 !important; }
#titlebar, #header .vivaldi { display: none !important; }
#tabs-container { padding: 0 !important; border-width: 0px !important; }
.stacks-on .tab-strip .tab .tab-group-indicator .tab-indicator { border-top: 0 !important; }


/* Auto-Hide Tabs (side) */
#tabs-container.left, #tabs-container.right { width: 31px !important; transition: width .0s linear; }
#tabs-container.left:hover, #tabs-container.right:hover { width: 200px !important; transition-delay: .5s; }
#tabs-container.right .newtab, #tabs-container.right .newtab { display: none !important; }
#tabs-container.right .trash{ margin-right: -1px !important; }
#tabs-container.left .trash{ margin-left: -1px !important; }
#tabs-container ::-webkit-scrollbar { width: 10px !important; }
.tab-strip { overflow-y: hidden !important; }
.tab-strip:hover { overflow-y: auto !important; }


/* Overlay Tabs for Autohide (side) */
#main .inner { position: relative; padding-right: 31px; /* padding-left: 31px; */ }
#browser.fullscreen #main .inner { padding-right: 0 !important; padding-left: 0 !important; }
#tabs-container { position: absolute !important; z-index: 15; height: 100%; right: 0; /* left: 0; */ }
/* https://forum.vivaldi.net/topic/12720/almost-autohide-vertical-tab-bar/11 */


/*

The following code customized the scrollbar in vivaldi, but since
it's part of the website and not the browser it has to be used with
the stylish addon.

Create a new style 'scrollbars' in vivaldi and Copy-paste the code below:

::-webkit-scrollbar { height: 10px; width: 10px; background: transparent; }
::-webkit-scrollbar-thumb { background: #40373E; border-radius: 1px; }
::-webkit-scrollbar-corner { background: #000; }

*/


/*
 * Tip: to deobfuscate the common.css and make it readable (using vim):
 *
 * Copy common.css to research.css.
 * Open research.css using vim.
 * Type the following commands:
 *     :%s/}/\r}\r\r/g
 *     :%s/{/ {\r    /g
 *     :%s/;/;\r    /g
 * research.css sould now be readable but likely not useable.
 *
 */