Redesigned project page.

app/client/templates/project.html

@@ -1,42 +1,54 @@
 <template name="project">
     {{> header}}
-    <main class="content-box">
-        <h3 class="black-text thin">The Project</h3>
-        <hr>
-        <h4 class="thin">What is Musare?</h4>
-        <p class="flow-text">
-            Musare is a modern, open source, collaborative music app where a user can go into any of our "stations" and
-            listen to music simultaneously with other users in that "station".
-        </p>
-        <hr>
-        <h4 class="thin">What is Musare's end goal?</h4>
-        <p class="flow-text">
-            Musare's end goal is to be a collaborative way of discovering new music. We are working hard to implement
-            all the features that are necessary for this.
-        </p>
-        <hr>
-        <h4 class="thin">How can I help?</h4>
-        <p class="flow-text">
-            There are essentially 3 main ways in which you can help us:
-        <ol>
-            <li>
-                If you are a JavaScript developer, then we can use your help! Our project is open source and all the
-                source code can be found on GitHub. We would love for you to create new features, add exciting
-                content or just improve what already is on Musare. Also, if you see a bug or glitch on Musare, then
-                create a new
-                "issue" on GitHub and we will fix it as soon as possible. You can also have a try at fixing a
-                bug that you may find!
-            </li>
-            <li>
-                If you are not a developer but want some way of supporting us - you can donate to Musare. Any
-                amount of donation is highly appreciated, and will help us maintain server costs.
-            </li>
-            <li>
-                Send us feedback! You're comments and/or suggestion are extremely valuable to us. In order to improve
-                we need to know what you like, don't like or what you might want on the app.
-            </li>
-        </ol>
-        </p>
+    <main class="content-box row">
+        <div class="col s4 l4 m4 offset-l4 offset-m4 offset-s4">
+            <h3 class="black-text thin">The Project</h3>
+            <hr>
+            <div class="card teal accent-3">
+                <div class="card-content white-text">
+                    <span class="card-title">What is Musare?</span>
+                    <p>
+                        Musare is a modern, open source, collaborative music app where a user can go into any of our "stations" and
+                        listen to music simultaneously with other users in that "station".
+                    </p>
+                </div>
+            </div>
+            <div class="card teal accent-3">
+                <div class="card-content white-text">
+                    <span class="card-title">What is Musare's end goal?</span>
+                    <p>
+                        Musare's end goal is to be a collaborative way of discovering new music. We are working hard to implement
+                        all the features that are necessary for this.
+                    </p>
+                </div>
+            </div>
+            <div class="card teal accent-3">
+                <div class="card-content white-text">
+                    <span class="card-title">How can I help?</span>
+                    <p>
+                        There are essentially 3 main ways in which you can help us:
+                        <ol>
+                            <li>
+                                If you are a JavaScript developer, then we can use your help! Our project is open source and all the
+                                source code can be found on GitHub. We would love for you to create new features, add exciting
+                                content or just improve what already is on Musare. Also, if you see a bug or glitch on Musare, then
+                                create a new
+                                "issue" on GitHub and we will fix it as soon as possible. You can also have a try at fixing a
+                                bug that you may find!
+                            </li>
+                            <li>
+                                If you are not a developer but want some way of supporting us - you can donate to Musare. Any
+                                amount of donation is highly appreciated, and will help us maintain server costs.
+                            </li>
+                            <li>
+                                Send us feedback! Your comments and/or suggestion are extremely valuable to us. In order to improve
+                                we need to know what you like, don't like or what you might want on the app.
+                            </li>
+                        </ol>
+                    </p>
+                </div>
+            </div>
+        </div>
     </main>
     {{> footer}}
 </template>