Overview button

Threedimensional

        {% include "@Components/overview-button/overview-button.twig" with {
  props: {
    tag: "button",
    type: "button",
    threeDimensional: true,
  }
} %}

            <button class="overview-button" type="button"><span class="icon --white --lg">
      <img src="images/svg/three-dimensional.svg"  loading="lazy">
  
  </span>
</button>

Photo

        {% include "@Components/overview-button/overview-button.twig" with {
  props: {
    photo: {
      count: "1"
    }
  }
}%}

          <a class="overview-button" href='#'><span class="icon --white  overview-button__camera">
      <img src="images/svg/camera.svg"  loading="lazy">
  
  </span>

    <span class="overview-button__photo-count">
      1</span></a>

Video

        {% include "@Components/overview-button/overview-button.twig" with {
  props: {
    video: true,
  }
} %}

          <a class="overview-button" href='#'><span class="icon --white --lg">
      <img src="images/svg/videocamera.svg"  loading="lazy">
  
  </span>
</a>

Schema

    {
  "props": {
    "tag": {
      "type": "string",
      "description": "a (default) | button"
    },
    "type": {
      "type": "string",
      "description": "Set if should include three dimensional"
    },
    "id": {
      "type": "string",
      "description": "Id of button"
    },
    "url": {
      "type": "string",
      "description": "Url address (default # if tag is a)"
    },
    "blank": {
      "type": "boolean",
      "description": "true | undefined"
    },
    "threeDimensional": {
      "type": "boolean",
      "description": "Set if should include three dimensional"
    },
    "video": {
      "type": "boolean",
      "description": "Set if should include video"
    },
    "count": {
      "type": "number",
      "description": "Count of photos"
    }
  }
}