Sbordia

index.html

@@ -24,6 +24,7 @@ <h1>The Tree Encyclopedia</h1>
             <h3>Index</h3>
             <p><button id="oak">Oak</button></p>
             <p><button id="beech">Beech</button></p>
+            <p><button id ="rosewood">Rosewood</button></p>
 
         </div>
         <div class="content">
@@ -50,8 +51,15 @@ <h3>Index</h3>
             $("#i_summary").attr("src","oak_summary.html");
         })
         $("#beech").click(function(){
+            $("#i_content").attr("src","beech_content.html");
+            $("#i_summary").attr("src","beech_summary.html");
+
+        })
 
 
+        $("#rosewood").click(function(){
+            $("#i_content").attr("src","rosewood_content.html");
+            $("#i_summary").attr("src","rosewood_summary.html");
         })
 
         /* This will not be merged !  */

rosewood_content.html

@@ -0,0 +1,23 @@
+<style>
+@import url('https://fonts.googleapis.com/css2?family=Lato&family=Overlock:wght@700&display=swap');
+body{font-family: 'Lato', sans-serif;
+text-align: center;
+color: white;
+}
+h3{
+	font-family: 'Overlock', cursive;
+	font-size: 28px;
+	margin: 0px;
+	padding-top: 10px;
+}
+p{
+	font-size: 16px;
+	padding: 0px;
+}
+</style>
+
+<h3>Rosewood</h3>
+
+<p>todo</p>
+
+<p>todo</p>

rosewood_summary.html

@@ -0,0 +1,33 @@
+<style>body{font-family:'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
+    color: white;}</style>
+    <style>
+    @import url('https://fonts.googleapis.com/css2?family=Lato&family=Overlock:wght@700&display=swap');
+    body{font-family: 'Lato', sans-serif;
+    text-align: center;
+    }
+    h3{
+        font-family: 'Overlock', cursive;
+        font-size: 26px;
+        margin: 0px;
+        padding-top: 10px;
+
+    }
+    p{
+        font-size: 15px;
+        padding: 0px;
+    }
+    #type{
+        font-size: 12px;
+        margin: 0;
+        padding: 0;
+        margin-bottom: 10px;
+    }
+    </style>
+
+
+    <h3>Rosewood</h3>
+
+    <p id="type"> todo </p>
+    <img src="img/rosewood.jpg" style="width: 200px;">
+    <p>Family: todo.
+    </p>