defined-pseudo-class

Information

Folder
src/components/defined-pseudo-class

Files

// src/components/defined-pseudo-class/mocks.json

{
  "text": "Custom element example text"
}
// src/components/defined-pseudo-class/index.hbs

<style>
  .DefinedPseudoClass p {
    background: yellow;
  }

  simple-custom {
    background: cyan;
  }

  .DefinedPseudoClass :defined {
    font-style: italic;
  }

  simple-custom:not(:defined) {
    display: none;
  }

  simple-custom:defined {
    display: block;
  }
</style>

<div class="DefinedPseudoClass">
  <simple-custom text="Custom element example text"></simple-custom>
  <p>Standard paragraph example text</p>
</div>

Variations

Standard paragraph example text