0

I'm trying to make a Google userstyle based on Discord's color scheme. Even though I have no programming experience whatsoever, it has been pretty straightforward (Inspect element > Copy-paste to Stylus) but now there's an element that I can't edit. It's the "next" arrow in the video cards that appear in the results for a search. Here it is: The button on the right.

When inspecting it, the selector just shows up as "element", that didn't work, right-clicking and copying the selector (I'm using FIrefox) also didn't work, and using live CSS editors didn't work either.

1 Answers1

1

I'm guessing it's because they use a fake html element called g-right-button. Just change it to div and you'll be fine.

(You can also just make a g-right-button { .. } selector)

Why

You can also see and change properties from inspector.

Also

benhatsor
  • 1,863
  • 6
  • 20
  • I think he just couldn't select it with CSS because it wasn't a "valid" tag... – benhatsor Sep 22 '20 at 08:43
  • Thanks! This is way out of my league, is there a way to find this out or is it just reading the code and trial and error? Also, how would the code look like then? Using just `g-right-button { .. }` didn't work for me. It changes the color behind the button, not on the button itself. – disgustingwaste Sep 22 '20 at 09:23
  • Try using `g-fab { background: black !important }`. Trial and error... also, when you select an element in debugger it shows you below what properties it has (eg. `g-fab { background: white }`). You can get from that which selector to use, you can even change it... I changed the answer above ^ – benhatsor Sep 22 '20 at 09:35