Ability to change <div>, <p>, <h*> etc. and edit "class" attribute without using "HTML: Input & Output"

[cra3yk]

Hi

Just want to delete/replace/edit "class" attribute or edit whole \<h6> tag (in this example): <div class="css-u2ayx9"><h6 class="css-v3vynn-Text eu5v0x0">Mini Countryman John Cooper Works S- sprzedam</h6><p data-testid="ad-price" class="css-l0108r-Text eu5v0x0">84 500 zł</p></div>

because class ("css-v3vynn-Text") made visited link indistinguishable than not visited one.

source: https://www.olx.pl/d/motoryzacja/samochody/mini/q-Countryman/?search%5Bdescription%5D=1&search%5Bfilter_float_price:from%5D=5000&search%5Bfilter_float_price:to%5D=90000&search%5Bfilter_float_year:from%5D=2010&search%5Bfilter_enum_petrol%5D%5B0%5D=petrol&search%5Bfilter_float_enginepower:from%5D=180&search%5Bfilter_float_milage:to%5D=125000&search%5Bfilter_enum_transmission%5D%5B0%5D=automatic

For this example: editing \<h6> tag attributes and content is possible only, when "HTML" is set to "Input & Output" and using rule below: URL: https://www.olx.pl/d/motoryzacja/samochody/* Replace: (<h6.+?>)(.+?)(<\/h6>) Type: Regex With: \<h3>$2\</h3>

But using "Input & Output" made this web page broken. (unable to switch category, choose different car maker etc)

Is there any chance to add 4th option to HTML (No, Input, Input & Output) to make change/substitute/delete non-input (forms etc) element possible? (like p, div, h*, classes etc)

[Woundorf]

If you just want to change link colors you would be better with a userContent.css. You could use something similar to this (probably with a different selector):

@-moz-document domain(olx.pl) {
    a:visited {
      color: #7b00b0 !important;
    }
}

[cra3yk]

Hi I have this one (and it is not working in "olx.pl" only, but works for all other sites)

a[href]:visited {color: #ff6666!important;text-decoration-color: #ff6666!important;}
a:visited {color: #ff6666!important;text-decoration-color: #ff6666!important;}

I just tried:

@-moz-document domain(olx.pl) {
    a:visited {
      color: #7b00b0 !important;
    }
}

But still didn't work ....

PS: they (olx.pl) did a mess using this:

      .css-1bbgabe:visited .jobs-ad-card {
        color: #002F34;
      }

      .laq-layout__usage a:visited {
        color: #7f9799
      }

and (for some reason) using "userContent.css" "hacks" didn't work ...

[Woundorf]

Then you have to find the appropriate selector for that site, but I can't help you with that. Maybe with that class you said? Or try using the DOM inspector to find what rules are being applied to links.

[cra3yk]

Ok.

Found the "guilty" class (.css-v3vynn-Text)

.css-v3vynn-Text {
  font-size: 20px;
  line-height: 22px;
  font-weight: 500;
  color: #002F34;
  margin: 0;
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: 0px;
  -webkit-box-orient: vertical;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  margin-bottom: auto;
  overflow: hidden;
  font-weight: 400;
  display: inline-block;
  margin-top: 5px;
  max-width: 70%;
  margin-right: 24px;
}

and made the rule (in "userContent.css") that works:

@-moz-document domain(olx.pl) {
    .css-v3vynn-Text {color: unset !important;}
}

Thank You for help :-)