Removing an element added by ::before pseudo selector

Question

I have the following case: (styling is done in SASS and unnecessary stylings are omitted.)

.header {
  ...
  &::before {
    ...
    position: absolute;         


        

Answer 1

If you are manipulating the DOM by using JavaScript, you can add a class name - for instance .remove-bar - to the element having .header in order to remove the pseudo-element (generated content):

.remove-bar {
    &::before { content: none; }
}

Also make sure that it is placed after the previous styles, or use a more specific selector if needed.