Import and Export Themes
-
@luetage
It's not loadingI included images of my browser.html and the mods folder to see if my eyes are not picking something up, because I'm not seeing it. The filenames match
Oh well, if it's not loading it's not an error in the script. I have no idea why it won't load.
Thanks
-
@sjudenim Hard to tell, I’m trying to think of differences in our setup that could be causing this. The only difference is you’re on Stable, or? Someone else should test this on stable Vivaldi too to make sure.
-
-
A completely fresh standalone install has the same issues as my current install reported in the console regarding
browser.html
-Unchecked runtime.lastError: The message port closed before a response was received.
There are also 3 files that are in the
browser.html
by default that do not exist
<script src="settings-bundle.js"></script>
<script src="urlbar-bundle.js"></script>
<script src="components-bundle.js"></script>So they throw up an error for never loading.
I unloaded all extensions, unloaded ad blocking, and nothing.
I even went back and installed v.2 (clean) and tried to load just this file, and still nothing.
I am out of ideas and my themes not being alphabetical is bothering more than it really should :face_savouring_delicious_food:
@hlehyaric
You are correct -
@sjudenim The runtime lasterror has been around forever, you can safely ignore it. None of this makes a difference to the loading of the mod. Can you paste your whole browser.html somewhere?
You could also try to troubleshoot by inserting console log calls in the mod.
setTimeout(function wait() { const browser = document.getElementById('browser'); if (browser) { document.body.addEventListener('click', function() { console.log('THIS WORKS'); setTimeout(portThemes, 50); }); } else { setTimeout(wait, 300); } }, 300);
-
You just made me figure it out, but I have no idea when this change took place since I was able to load everything before using just the
browser.html
.At the top of the
browser.html
there is a note to keep styling the same inwindow.html
(I never knew that existed). When I inspect UI elements, that note is there indicating that it is thebrowser.html
. But when inspecting the Settings panel the message says to keep styling the same as inbrowser.html
which is the message found at the top ofwindow.html
. So adding thosejs
files towindow.html
does load them. Apparently thebrowser.html
is not used for the settings panel which is why those files were not loaded (the custom css location is there by defualt).Thanks for your help
-
I reworked this mod, updated original post. Will only work with settings in a tab and by directly visiting
vivaldi://settings/themes
. The overviewvivaldi://settings/all
won't trigger the mod. Compatibility mode has been removed. -
Three more
{"colors":{"accentBg":"#662ec7","baseBg":"#110053","baseFg":"#82e0be","highlightBg":"#00c2ba"},"name":"Vaporwave","settings":{"accentFromPage":false,"accentOnWindow":false,"borderRadius":"0","tabsTransparent":false},"version":0.1}
{"colors":{"accentBg":"#7aa001","baseBg":"#2e5b02","baseFg":"#daddb2","highlightBg":"#b8c036"},"name":"Lime","settings":{"accentFromPage":false,"accentOnWindow":false,"borderRadius":"0","tabsTransparent":false},"version":0.1}
{"colors":{"accentBg":"#180608","baseBg":"#170609","baseFg":"#e1c2a3","highlightBg":"#faead3"},"name":"Steampunk","settings":{"accentFromPage":false,"accentOnWindow":false,"borderRadius":"0","tabsTransparent":false},"version":0.1}
Older themes
-
A theme I ported from a vim scheme https://github.com/Rigellute/rigel
{"colors":{"accentBg":"#00384d","baseBg":"#002635","baseFg":"#e6e6dc","highlightBg":"#1c8db2"},"name":"Rigel","settings":{"accentFromPage":false,"accentOnWindow":false,"borderRadius":"4","tabsTransparent":false},"version":0.1}
-
@luetage I dig that it's astronomy inspired.
-
@BoneTone Yeah, that’s what got me interested too. Cool concept.
I would really love for Vivaldi to change the theme setup and allow us to use complete ANSI schemes instead. Would take care of all the fixed colors and there would be no need to automatically create so many color variations. Also we could have great syntax highlighting right built into the UI. I get that it’s too complex for most people to create something worthwhile themselves, but on the other hand there are so many great colorschemes already out there that I think no one would be too bothered.
-
@luetage has this feature been requested? I'd vote for it.
-
@BoneTone I feel this doesn’t have the slightest chance to go through, but I’ll write something up nevertheless, it doesn’t hurt anyone.
-
@luetage You got 4 votes on your previous post in this thread. It may not get into the hundreds, and I agree about the complexity. For the color schemes however, we can share them here and people don't have to develop their own. For the implementation on the other hand, I can understand if it doesn't get much traction inside Vivaldi, but it's worth suggesting. I mean, look how large the themes megathread currently is. There is certainly an active group of users that would make use of it if we can get Vivaldi to build it.
Thanks for writing it up. Let me know if you want someone to review it -- for technical ideas or just copy editing. You can send me a message here or on GitHub.
-
@BoneTone I have already posted the FR → https://forum.vivaldi.net/topic/51889/16-ansi-color-themes
You can add a comment, if you feel something is amiss. It isn’t very detailed, in my experience Vivaldi devs don’t really care too much about the layman’s / users view and opinion on intrinsic technicalities, but knock yourself out ^^ -
-
So I've copied the code from the first post and put it in custom.js, which is in the same directory as browser.html. I'm not getting the Import/Export buttons after restarting. Opening up DevTools I see an error that states:
Uncaught TypeError: Cannot read property 'parentNode' of null at portThemes (custom.js:276)
and this is the line at 276: "document.querySelector(_themeBtn).parentNode.parentNode.appendChild(group);"
Any idea what's wrong here?
-
@dejean That’s a problem with the selector. At the bottom of the file you can see the theme button selector.
const _themeBtn = '.setting-group.unlimited > .toolbar.toolbar-default > .button-toolbar > button';
The selector you are having issues with selects the toolbar which is a grandparent to the element, while trying to add the theme move buttons to the UI. I don’t get the error. Can you inspect the UI and post the HTML around the “edit theme” button? Also, which version of Vivaldi are you using, I take it it’s updated to latest stable or snapshot?
-
@dejean Did you insert the pointing to the js in browser.html? If so try removing it and putting it in window.html.
-
@Folgore101 I load all my mods from
browser.html
and it should work from there. Have you experienced the issue before with some mod?