Teacher/parent

build/components.html

@@ -9,4 +9,16 @@
         </div>
     </div>
 </div>
+</script>
+<script type="text/ractive" id="teacher"><div class="row">
+    <div class="col s12 m6 offset-m3">
+        <div class="card">
+            <div class="card-content">
+                <span class="card-title grey-text">{{studentName}} - {{age}}</span>
+                <p>I am a very simple card. I am good at containing small bits of information.
+                    I am convenient because I require little markup to use effectively.</p>
+            </div>
+        </div>
+    </div>
+</div>
 </script>

build/components.js

@@ -1,3 +1,7 @@
-Ractive.components.student = Ractive.extend({
-    template:'#student'
+Ractive.components.parent = Ractive.extend({
+    template:'#parent'
+});
+
+Ractive.components.teacher = Ractive.extend({
+    template:'#teacher'
 });

build/index.html

@@ -27,6 +27,18 @@
         </div>
     </div>
 </div>
+</script>
+<script type="text/ractive" id="teacher"><div class="row">
+    <div class="col s12 m6 offset-m3">
+        <div class="card">
+            <div class="card-content">
+                <span class="card-title grey-text">{{studentName}} - {{age}}</span>
+                <p>I am a very simple card. I am good at containing small bits of information.
+                    I am convenient because I require little markup to use effectively.</p>
+            </div>
+        </div>
+    </div>
+</div>
 </script>
 
         <div id='load'></div>

build/index.js

@@ -1,7 +1,11 @@
 $(document).ready(function(){
 
-  Ractive.components.student = Ractive.extend({
-    template:'#student'
+  Ractive.components.parent = Ractive.extend({
+    template:'#parent'
+});
+
+Ractive.components.teacher = Ractive.extend({
+    template:'#teacher'
 });