Simple reusable web component for web games linking to the Vault
This repository houses a reusable html component for the Vault floating dropdown on free browser-based games. There are two pieces used for this component:
- the html template used to display the component on the dom
- the Unity javascript plugin to be used to remove the buttom after exitting the title screen.
This example illustrates how this component can be added to a project
<script src="FloatingDropdown/index.js"></script>
This element uses slots to make the component more flexible. If you are unfamiliar with slots, you can read more here
Example from a Unity WebGL Template:
<body>
<div id="BrainPOPsnapArea">
<div class="webgl-content">
/* Here is the floating dropdown component */
<floating-dropdown>
<style> /* Add custom fonts here */ </style>
<img slot="header" src="/path/to/header/image" alt="Vault Games Library" width="250px">
<p slot="desc" class="content" style="font-weight: 400;">
Put the body text here
</p>
<p slot="button-label" class="content" style="font-weight: bolder;">
Put button label here
</p>
</floating-dropdown>
...