Add info boxes to index

1 files changed, 53 insertions, 0 deletions

diff --git a/views/index.html b/views/index.html
index 245e346..84de07f 100644
--- a/views/index.html
+++ b/views/index.html
@@ -32,5 +32,58 @@
 	{# TODO: Add a series of boxes, each either an image or some text
 	describing the guild. We will create two columns and have a kind of
 	asymmetric layout where the two columns don't line up row-wise. #}
+
+	<div class="boxes">
+		<div class="boxes__column boxes__column--left">
+			<section class="boxes__item">
+				<h2 class="boxes__header">Raiding</h2>
+				<p class="boxes__body-text">
+					We love raiding.
+					In the clan we have a good culture of doing bi-weekly raids.
+					It's not just about the loot;
+					raids provide opportunities for bonding
+					and leveling up less skilled players.
+				</p>
+			</section>
+			<section class="boxes__item">
+				<h2 class="boxes__header">Community</h2>
+				<p class="boxes__body-text">
+					We are probably the #1 guild in the EU at socializing.
+					Being nice to other guildes and building inter-guild community is one of the core values of our guild.
+					Petty behavior and trolling only serves to antagonize other players
+					and worsens the experience for all players in the long run.
+					As such, we have a strict no-troll policy.
+				</p>
+			</section>
+			<section class="boxes__item">
+				<h2 class="boxes__header">Our base</h2>
+				<img class="boxes__image" src="/static/base.jpeg" width="1200" height="675" alt="A very dark and mysterious palace">
+			</section>			
+		</div>
+		<div class="boxes__column boxes__column--right">
+			<section class="boxes__item">
+				<h2 class="boxes__header">The crew</h2>
+				<img class="boxes__image" src="/static/crew.jpeg" width="1600" height="1200" alt="A crew of high-level WoW players">
+			</section>
+			<section class="boxes__item">
+				<h2 class="boxes__header">Coins</h2>
+				<p class="boxes__body-text">
+					We love coins and buying stuff.
+					All guild members contribute to the guild treasury according to their means
+					and members are compensated according to their needs.
+				</p>
+			</section>
+			<section class="boxes__item">
+				<h2 class="boxes__header">Slaying monsters</h2>
+				<p class="boxes__body-text">
+					We view it as the moral duty of any guild worth its salt to slay monsters.
+					Slaying monsters not only gives XP but,
+					much more importantly,
+					keeps the world safe for non-combat based players.
+					It is therefore totally in line with out universalist philosophy to slay as many monsters as we can.
+				</p>
+			</section>
+		</div>
+	</div>
 {% endblock %}