A partial archive of discourse.wicg.io as of Saturday February 24, 2024.

Proposal !default keyword for setting author-controlled property as complement to unset or revert

paceaux
2020-06-11

I understand that we already have a CSS value called unset where we can revert back to a user-agent default style.

Specifications state:

This keyword effectively erases all declared values occurring earlier in the cascade

However, what if we wanted only a partial erasure of these styles? i.e. an author-controlled default style that unset could return?

I would propose that there should be a keyword set inline with the CSS property, similar to !important

a {
  text-decoration: dotted underline !default;
}

   nav a{
   text-decoration: none;
}

   nav a:hover {
text-decoration: unset; // renders "dotted underline" without having to repeat the style
   }

This is especially useful in cases like display where there is no good “opposite” of none:

.someModal {
  display: flex !default;
}

   .someModal.ui-collapsed {
display: none; 
   }

   .someModal.ui-collapsed.ui-peak {
 display: unset; // reverted to flex
   }

alternatively, if the behavior of unset can’t be changed, then I would suggest that this be a complement to revert so that revert knows exactly which property to choose from the cascade.

simevidas
2020-06-12

The unset value does not revert back to the user agent style.

Malvoz
2020-06-13

This was proposed in:

paceaux
2020-06-15

I misunderstood a component of the specification:

This keyword effectively erases all declared values occurring earlier in the cascade.

I took that to mean it went all the way back to original user-agent styles, not to a previously inherited style.

I still often find myself in a situation where I’d prefer to revert to a previous style in the cascade; having a !default I think would make it very explicit to an author that “this is where your unset will point to”.

liamquin
2020-06-15

Don’t custom properties solve this use case?

paceaux
2020-06-18

I don’t believe so, but could you provide a description of how you think they could?

My interest is more in setting an “opposite” of display:block or being able to use unset to target a specific property to unset to. So I’m struggling with how I could do this with CSS properties.