Bounce! is an online store for buying fresh jelly made from wholesome ingredients. This is a style guide for Bounce!
Bounce! is a kitchen that creates jelly desserts, our jellies are inspired by dim sum desserts. All of our flavours are derived from wholesome ingredients, we use real tea leaves to infuse our jelly flavours. No artificial flavours or food colouring ever. We have vegan jelly options created using agar-agar and plant-based milk.
.grid-colour
<div class="grid-colour two-column four-column" style="background-color:#0148F0">#0148F0</div>
a
<a href="https://blog.piquelife.com/types-of-tea/" target="blank">The Ultimate Guide to Different Types of Tea</a>
.button-nav
<a href="#" class="button-nav">Default Button</a>
form, label, input
<form method="post" action="#">
<label for="form-email">Email</label>
<input type="text" id="form-email" placeholder="@sfu.ca">
<a class="button-nav" href="#">Save</a>
</form>
a img, a:hover img, a:focus img
<a href="https://www.25ah.se/project/pen-store/" target="blank">
<img src="img/layout-image.jpg" alt="Image of three posters that show a clear grid with large sans-serif headings in all caps from Pen Store's branding.">
</a>
h1, h2, h3, h4, h5
<h1>Heading 1</h1>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h5>Heading 5</h5>
p
<p>Bounce! is a kitchen that creates jelly desserts, our jellies are inspired by dim sum desserts. All of our flavours are derived from wholesome ingredients, we use real tea leaves to infuse our jelly flavours. No artificial flavours or food colouring ever. We have vegan jelly options created using agar-agar and plant-based milk.</p>
Bounce! is a kitchen that creates jelly desserts, our jellies are inspired by dim sum desserts. All of our flavours are derived from wholesome ingredients, we use real tea leaves to infuse our jelly flavours. No artificial flavours or food colouring ever. We have vegan jelly options created using agar-agar and plant-based milk.
ol, li
<ol>
<li>Coconut Jelly</li>
<li>Grass Jelly</li>
<li>Osmanthus Jelly</li>
<li>Earl Grey Jelly</li>
</ol>
.button-nav
<a href="#" class="button-nav">Home</a>
<a href="#" class="button-nav">About</a>
<a href="#" class="button-nav">Order</a>
<a href="#" class="button-nav">FAQ</a>
<a href="#" class="button-nav">Contact</a>
.grid-product
<div class="grid-product">
<h5>Coconut Jelly</h5>
<p>$10.00 / 2 servings</p>
<a class="button-nav" href="#">Add to Cart</a>
</div>