1 files changed, 68 insertions, 2 deletions
diff --git a/about/index.php b/about/index.php
index 65ed9c4..19d4d8a 100644
--- a/about/index.php
+++ b/about/index.php
@@ -6,8 +6,74 @@
     <h1 class="text-center">My name is <span id="scoots">Scootaloo</span>!</h1>
     <h3 class="text-center">I'm the computer pegasus</h3>
 
-    <p>TODO: Add some sort of circles with things I like (MLP, computers, Linux, OSS, music, video, photography, graphical design)</p>
-    <div id="circles"></div>
+    <div id="circles">
+        <div class="circle">
+            <div class="circle-icon">
+                <img class="circle-icon-img" src="/assets/about/mlp.png" alt="">
+            </div>
+            <div class="circle-text">
+                My Little Pony
+            </div>
+        </div>
+        <div class="circle">
+            <div class="circle-icon">
+                <img class="circle-icon-img" src="/assets/about/computers.png" alt="">
+            </div>
+            <div class="circle-text">
+                Computers
+            </div>
+        </div>
+        <div class="circle">
+            <div class="circle-icon">
+                <img class="circle-icon-img" src="/assets/about/linux.png" alt="">
+            </div>
+            <div class="circle-text">
+                Linux
+            </div>
+        </div>
+        <div class="circle">
+            <div class="circle-icon">
+                <img class="circle-icon-img" src="/assets/about/opensource.png" alt="">
+            </div>
+            <div class="circle-text">
+                Open-source
+            </div>
+        </div>
+        <div class="circle">
+            <div class="circle-icon">
+                <img class="circle-icon-img" src="/assets/about/music.png" alt="">
+            </div>
+            <div class="circle-text">
+                Music
+            </div>
+        </div>
+        <div class="circle">
+            <div class="circle-icon">
+                <img class="circle-icon-img" src="/assets/about/cinema.png" alt="">
+            </div>
+            <div class="circle-text">
+                Cinema
+            </div>
+        </div>
+        <div class="circle">
+            <div class="circle-icon">
+                <img class="circle-icon-img" src="/assets/about/photography.png" alt="">
+            </div>
+            <div class="circle-text">
+                Photography
+            </div>
+        </div>
+        <div class="circle">
+            <div class="circle-icon">
+                <img class="circle-icon-img" src="/assets/about/vector.png" alt="">
+            </div>
+            <div class="circle-text">
+                Graphic design
+            </div>
+        </div>
+    </div>
+
+    <br>
 
     <p><b>Info about me:</b></p>
     <table class="table">