Theming / Main UI
-
I know its just a preview, but im exited about vivaldi is made of html + css + js. So, where i can found some information about inspecting elements on the browser, editing, making my own css sheet?? I feel that some elements are unnecessary, like home, next, forward backward buttons, and the search bar (just type in the url bar) Vivaldi should have - back button - url bar - reload button - new tab - vivaldi menu Nothing more, other actions could be triggered by hotkeys or "quick commands"
-
common.css in C:\Users<youraccount>\AppData\Local\Vivaldi\Application\1.0.94.2\resources\vivaldi\style (path depends on OS/Installation) is the file you have to change.
Additional .css files can be specified in browser.html in resources\vivaldi\stylecommon.css is minified, to make it human readable you can use beautifiers like:
http://codebeautify.org/css-beautify-minify
(just replace the minified code with the beautified one and continue working on that).As for now, there seems to be no debugging/inspection options for the UI (at least none I know about), so the basic workflow is:
- change something in the.css and save
- restart vivaldi
Buttons in the addressbar have the class .button-addressfield
search bar has the class .searchfieldElements can be hidden with the property
display:none!important;To make your changes easily transferable to new (weekly) builds, you should do you changes to an additional .css file (not common.css, which will change) and reference it in browser.html</youraccount>
-
Thank You !
Yes, I had seen the files but did not know if it was the "right" way