p-button-tile is an interactive component that displays a provided image to tease content and performs form or
interaction events within one container. Whenever you want to provide navigational elements, stick to the
<img/>, <picture/> or <video/> tag has to be provided as default slot.description and label are required. The description property is used as a teaser with
a more detailed description of the button and its action.label property is used to describe the button.
<!doctype html>
<html lang="en" class="scheme-light-dark">
<head>
<title></title>
</head>
<body class="bg-canvas">
<p-button-tile label="Some label" description="Some Description" gradient="true">
<p-tag slot="header" color="background-frosted" compact="true">
Some tag
</p-tag>
<img src="assets/lights.jpg" alt="Some image description" />
<p-text slot="footer">
Some footer text
</p-text>
</p-button-tile>
<script>
</script>
</body>
</html>