<script>
  import Icon from '$/client/components/Icon.svelte';
</script>
<style>
  content {
    display: flex;
    flex: flex-shrink;
    flex-grow: 1;
    justify-content: center;
  }
</style>

<content>
  <tile>
    <left>
      <Icon name="user" size="48" />
    </left>

    <middle>
      <h4>
        Tile Example
      </h4>
      <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
    </middle>

    <right>
    <button><Icon name="check-circle" color="var(--color-bg)" size="24" /></button>
    <button><Icon name="x-circle" color="var(--color-bg)"  size="24"/></button>
    </right>
  </tile>
</content>

