Update the guide on the sample

pages/sample/prime.html

@@ -6,32 +6,30 @@
     <li><p>Put the folder in your <code>templates</code> directory</p></li>
     <li>
       <p>Add to handler</p>
-<code>
-import templates.prime.main as template_dashboard
+      <code>
+<pre>import templates.prime.main as template_dashboard
 
 params["mako"] = {
 	"website" : template_dashboard.main("pages/dashboard", "users")
-}
-</code>
+}</pre>
+      </code>
     </li>
     <li>
-      - Define a necessary variable on your modules
+      <p>Define a necessary variable on your modules</p>
+      <code>
+<pre>title       = "CostaPy"
 
-  ```python
-  title       = "CostaPy"
+user_roles  = [1,2]    # A roles that user have
+active_page = "Users"  # Current active page name
 
-  user_roles  = [1,2]    # A roles that user have
-  active_page = "Users"  # Current active page name
-
-  copyright   = "Copyright (C) 2022 Dita Aji Pratama"
-  greeting    = "Hello world"
-  ```
+copyright   = "Copyright (C) 2022 Dita Aji Pratama"
+greeting    = "Hello world"</pre>
+      </code>
     </li>
     <li>
-      - Define a navbar menu on your modules
-
-  ```python
-  menu_navbar = [
+      <p>Define a navbar menu on your modules</p>
+      <code>
+<pre>menu_navbar = [
 	{
 		"name":"Home",
 		"target":"_self",
@@ -53,14 +51,13 @@ params["mako"] = {
 		"notification":1,
 		"roles":[1,2]
 	}
-  ]
-  ```
+]</pre>
+      </code>
     </li>
     <li>
-      - Define a profile menu on your modules
-
-  ```python
-  menu_profile = {
+      <p>Define a profile menu on your modules</p>
+      <code>
+<pre>menu_profile = {
 	"picture"     : "https://ditaajipratama.net/img/no-profile-donut.png",
 	"name"		: "Dita Aji Pratama",
 	"menu"		: [
@@ -83,14 +80,13 @@ params["mako"] = {
 			"roles":[1,2,3]
 		}
 	]
-  }
-  ```
+}</pre>
+      </code>
     </li>
     <li>
-      - Define a sidebar menu on your modules
-
-  ```python
-  menu_sidebar = [
+      <p>Define a sidebar menu on your modules</p>
+      <code>
+<pre>menu_sidebar = [
 	{
 		"icon":"fa-solid fa-gauge",
 		"name":"Dashboard",
@@ -126,15 +122,13 @@ params["mako"] = {
 		"href":"#",
 		"roles":[1,2]
 	}
-  ]
-  ```
-
+]</pre>
+      </code>
     </li>
     <li>
-      - Set a template on your modules
-
-  ```python
-  return Template(params["mako"]["website"]['index']).render(
+      <p>Set a template on your modules</p>
+      <code>
+<pre>return Template(params["mako"]["website"]['index']).render(
 	title     = title,
 	navbar    = Template(params["mako"]["website"]['navbar']).render(
 		title       = title,
@@ -154,8 +148,8 @@ params["mako"] = {
 	container = Template(params["mako"]["website"]['container']).render(
 		greeting    = greeting
 	)
-  )
-  ```
+)</pre>
+      </code>
     </li>
   </ul>
   <h2>License</h2>