Plamcheg's blog

/* Vivaldi UI. Minimalistic, black, transparent. Replies: t.me/Plamcheg, plmch@bk.ru */

/* global and fixes */ * { border: 0!important; box-shadow: none!important; outline: none!important; outline-style: none!important; } *::selection { color: #000; background-color: #fff; } #main { margin-top: -19px; } /* starting splash (obsolete, need to fix) */ body { background: #000 url()!important; } /* tab bar (kinda main section, all others tested with this enabled) */ .tabbar-wrapper { margin-left: -155px; /* optional: hide few pinned tabs (31px each) */ } #header { margin: 5px 0 0 -15px; background: rgba(0,0,0,0)!important; width: 99%; min-height: 0!important; height: 14px; overflow: visible; box-shadow: none!important; pointer-events: none!important; z-index: 3; } #tabs-tabbar-container, #tabs-container { background: none!important; border: none; } #tabs-container { padding: 0!important; min-height: 0; } .tab-strip { pointer-events: none!important; } .tab-strip span { pointer-events: auto!important; } .tab-position .tab { background-color: rgba(0,0,0,0.85)!important; border-radius: 0 0 3px 3px!important; min-height: 14px!important; height: 14px!important; margin-top: 14px; } .tab-position .tab .title { font-size: 12px!important; margin-top: -14px!important; } .tab-header { padding-top: 0!important; padding-bottom: 0!important } .page-progress-indicator { top: 12px!important; } .audioicon { margin-top: -6px; } .tab:hover, .tab.active { color: #fff!important; } .tab { font-weight:900; } .window-buttongroup, #tabs-container > div.toolbar.toolbar-tabbar.sync-and-trash-container, .burger-icon, .close, .toolbar > .button-toolbar, #browser.linux.alt #header .vivaldi, #titlebar > button { display: none!important; } /* icons fix (testing) */ .tab-position .tab .favicon { margin-top: -23px!important; position: relative!important; display: block!important; width: 8px!important; min-width: 8px!important; min-height: 8px!important; height: 8px!important; } .tab-position .tab.active .tab-header .favicon:not(.svg) { overflow: visible; } /* address bar */ .mainbar { position: absolute; width: 66%; z-index: 1!important; } .toolbar { background-color: rgba(0,0,0,0)!important; top: 10px; } .UrlBar-AddressField.button-textonly.below { border: 0!important; border-radius: 0 3px 3px 0!important; background-color: rgba(0,0,0,0.85); outline: none; border: none!important; top: 4px; margin-left: 0px; } .UrlBar-AddressField.button-textonly.below:hover, .UrlBar-AddressField.button-textonly.below:focus-within { background-color: rgba(0,0,0,0.85); } .address-top .mainbar>.toolbar-mainbar:before { display: none; } /* bookmark bar (auto-hide) */ .bookmark-bar.default { background-color: rgba(0,0,0,0.55); position: fixed; width: 99.5%; height: 1px; border-radius: 0 0 3px 0!important; z-index: 2!important; opacity: 0; } .bookmark-bar.default:hover { opacity: 1; height: 35px; z-index: 4!important; } .bookmark-bar button { background: none!important; align-items: end; } .bookmark-bar button > img, .bookmark-bar button > svg { margin-top: 18px!important; } /* side panel */ .panel.downloads .tree-row[data-selected][data-nofocus] .DownloadItem-ProgressBar, .popout.downloads-popout .tree-row[data-selected][data-nofocus] .DownloadItem-ProgressBar, .DownloadItem-ProgressBar { background-color: rgba(70,70,70,0.8)!important; height: 7px; } .panel.downloads .DownloadItem-ProgressBar .value, .popout.downloads-popout .DownloadItem-ProgressBar .value { background-color: rgba(150,150,150,0.9); background-image: none; height: 3px; margin: 2px; } #switch { display: none; } #panels-container { left: -40px!important; } .panel { padding-left: 0; padding-right: 0; } /* quick commands */ #modal-bg > div { background-color: rgba(0,0,0,0)!important; border: 0!important; } .quick-command-container .qc-entry { background-color: rgba(0,0,0,0.7)!important; } .quick-command-container .quick-commands { background-color: rgba(0,0,0,0.8)!important; } #modal-bg.qc-modal { top: 30px; } input.quick-command-search, .quick-command-search-hint { font-size: 14px!important; } .quick-command-container .quick-commands .quick-command-sectionheader, .quick-command-container .quick-command-search, .quick-command-container .quick-command- search-hint { border-bottom: none; } /* express-panel/speeddial/start page) */ .sdwrapper .iconmenu-container.SearchField { background-color: #00000080; box-shadow: none!important; border-radius: 4px; opacity: 0.2; } .SpeedDialView-SearchField.iconmenu-container.SearchField:focus-within, .SpeedDialView-SearchField.iconmenu-container.SearchField:hover { box-shadow: none!important; border: none!important; opacity: 0.8; } .SpeedDialView-Settings-Button { opacity: 0; } .speeddial .dial { opacity: 0.3!important; } .speeddial .dial:hover { opacity: 0.9!important; } /* widget panel (new express-panel) */ .add-button, .show-title { opacity: 0.3; } .feed-row, .email-item, .widget-config-content { opacity: 0.6; } .add-button:hover, .show-title:hover, .feed-row:hover, .email-item:hover { opacity: 0.9; } ::-webkit-scrollbar { width: 4px; } ::-webkit-scrollbar-thumb { background: #636363c7!important; } /* hide panel's settings and scrollbars (optional) */ .dashboard-widget-header { opacity: 0; } .dashboard-widget-header:hover { opacity: 0.9; } /* extension popup */ .extension-popup { opacity: 0.85; }