---
const { type } = Astro.props;

type Props = {
  type: ExtType;
};

let icon = "fa-solid fa-paintbrush";
let abbrTitle = "Style";

if (type === "page" || type === "serviceWorker") {
  icon = "fa-solid fa-scroll";
  abbrTitle = "Script";
}
---

<div class="marketplace-icon">
  <abbr title={abbrTitle}>
    <i class={icon + " fa-lg marketplace-icon"}></i>
  </abbr>
</div>

<style>
  .marketplace-icon {
    width: 32px;
    filter: brightness(0.8);
    align-self: flex-start;
    padding-bottom: 1rem;
  }
</style>
