Energy label

Default

F

Velmi nehospodárná

        {% include "@Components/energy-label/energy-label.twig" with {
  props: {
    economy_letter: "F",
  }
} %}

                

  
<div class="energy-label    --very_uneco">
  <h3 class="base-h2 energy-label__heading">F</h3>
  <p class="energy-label__perex">Velmi nehospodárná</p>
</div>

Small

G

Mimořádně nehospodárná

        {% include "@Components/energy-label/energy-label.twig" with {
  props: {
    size: "small",
  }
}%}

                
      
  
<div class="energy-label  --small  --extremly_uneco">
  <h3 class="base-h2 energy-label__heading">G</h3>
  <p class="energy-label__perex">Mimořádně nehospodárná</p>
</div>

Mono

G

Mimořádně nehospodárná

        {% include "@Components/energy-label/energy-label.twig" with {
  props: {
    variant: "mono",
  }
}%}

                
      
  <div class="energy-label --mono   --extremly_uneco">
  <h3 class="base-h3 energy-label__heading">G</h3>
  <p class="energy-label__perex">Mimořádně nehospodárná</p>
</div>

Schema

    {
  "props": {
    "economy_letter": {
      "type": "string",
      "description": " A | B | C | D | E | F | G (default)"
    },
    "size": {
      "type": "string",
      "description": " small | undefined"
    },
    "variant": {
      "type": "string",
      "description": " mono | undefined"
    },
    "unvisibility": {
      "type": "string",
      "description": " mobile | undefined"
    }
  }
}