seepur/resources/scripts/applications/home/components/child_avatar.vue

<template>
  <div class="chiled-avatar has-text-centered">
    <div class="avatar-badge-image">
      <figure class="image is-48x48">
        <img :src="child.avatar" alt="Placeholder image" class="is-rounded is-avatar" />
      </figure>
    </div>
    <div class="chiled-avatar-name">{{child.name}}</div>
  </div>
</template>

<script lang="ts">
export interface IChildAvatar {
  url: string;
  name: string;
}

export default {
  name: "ChildAvatar",
  props: ["child"],
  created() {}
};
</script>