ortiza5 / modding-vivaldi

A not-even-WIP-anymore collection of guides about modifying the Vivaldi browser
The Unlicense
7 stars 1 forks source link

Tips&tricks: IIFE, add CSS with JS #31

Closed ghost closed 2 years ago

ghost commented 3 years ago

Resolves #26

References #30

For now, blocked by #38

code3z commented 3 years ago
  1. Is it really necessary to check that the style hasn’t been added already?
  2. Wouldn’t an IIFE be recommended to ensure that the multiple different ‘style’ variables do not overlap?
  3. Isn’t the IIFE covered by the “First JS Mod”?

Just asking: Did you test the code yet? Does it work even if used multiple times?

code3z commented 3 years ago

Should you specify that this is JS tips and tricks, or does it include CSS too?

ghost commented 3 years ago
  1. Is it really necessary to check that the style hasn’t been added already?

Not in this case, but generally it’s better not to add it too many times (& some mods call the function several times). It’s a common practice & related to that tip.

  1. Wouldn’t an IIFE be recommended to ensure that the multiple different ‘style’ variables do not overlap?

It isn’t related to that tip & there’s no reason to only insert CSS (except for testing if JS mods work). Also, it should only be in the scope of that if.

  1. Isn’t the IIFE covered by the “First JS Mod”?

Not yet. It can be taken out at any time.

Just asking: Did you test the code yet? Does it work even if used multiple times?

Works as expected.

Should you specify that this is JS tips and tricks, or does it include CSS too?

See the sections.

code3z commented 3 years ago

Ok, makes sense. Should you make it clear that myModStyle MUST be replaced with your mods's name, or is it self-explanatory?

Also, it should only be in the scope of that if.

I meant if you take the if out, which you explained wouldn't be good, although I would (briefly) mention the myModStyle must be changed or else the if will prevent multiple mod styles following that code from being inserted.

code3z commented 3 years ago

Would this be the place to show how to pause the UI with the debugger and setting breakpoints ?

ghost commented 3 years ago

Would this be the place to show how to pause the UI with the debugger and setting breakpoints ?

Nope, that’s for some (probably ‘advanced’) devtools guide.

code3z commented 3 years ago

As soon as you can, could you create sections for:

I don’t mean actually write the sections, you could just add a heading and leave it empty for now. If you don’t think they should be in Tips & Tricks that’s fine (but where would you want them to be, if anywhere?).

ghost commented 3 years ago
  • Dealing with Vivaldi’s lack of class names (e.g., use :is(.left, .right) because there is no .vertical class for tabs,
  • Using higher-priority selectors to override the inbuilt styles

Heehee. Haven’t I recently asked you to put something like these into #38? 😀

or using a title= to select the reload button)

I’m not sure about this, since it is a more specific case. I’ll think about it.

code3z commented 3 years ago

Yeah, I know, I'd mention these things in #38 but I think they may need elaboration*. Let me keep working on it and see how it goes.

*For instance, I will likely use style= as a selector but not title=, will probably not have a chance to use is: but will use not:, will use !important to override but not a selector to override. I guess an option would be to but these extra things in spoilers or quote blocks

ghost commented 2 years ago

Closing, as per #42.