Breakdown the template.

Kaitlyn Parkhurst · Kaitlyn Parkhurst · commit e0cdea8f10c3 · 2021-10-09T15:14:53.000-07:00
diff --git a/Web/templates/default/_/layout.tx b/Web/templates/default/_/layout.tx
@@ -0,0 +1,83 @@
+%% my $gear_icon = mark_raw('<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-gear" viewBox="0 0 16 16"> <path d="M8 4.754a3.246 3.246 0 1 0 0 6.492 3.246 3.246 0 0 0 0-6.492zM5.754 8a2.246 2.246 0 1 1 4.492 0 2.246 2.246 0 0 1-4.492 0z"/> <path d="M9.796 1.343c-.527-1.79-3.065-1.79-3.592 0l-.094.319a.873.873 0 0 1-1.255.52l-.292-.16c-1.64-.892-3.433.902-2.54 2.541l.159.292a.873.873 0 0 1-.52 1.255l-.319.094c-1.79.527-1.79 3.065 0 3.592l.319.094a.873.873 0 0 1 .52 1.255l-.16.292c-.892 1.64.901 3.434 2.541 2.54l.292-.159a.873.873 0 0 1 1.255.52l.094.319c.527 1.79 3.065 1.79 3.592 0l.094-.319a.873.873 0 0 1 1.255-.52l.292.16c1.64.893 3.434-.902 2.54-2.541l-.159-.292a.873.873 0 0 1 .52-1.255l.319-.094c1.79-.527 1.79-3.065 0-3.592l-.319-.094a.873.873 0 0 1-.52-1.255l.16-.292c.893-1.64-.902-3.433-2.541-2.54l-.292.159a.873.873 0 0 1-1.255-.52l-.094-.319zm-2.633.283c.246-.835 1.428-.835 1.674 0l.094.319a1.873 1.873 0 0 0 2.693 1.115l.291-.16c.764-.415 1.6.42 1.184 1.185l-.159.292a1.873 1.873 0 0 0 1.116 2.692l.318.094c.835.246.835 1.428 0 1.674l-.319.094a1.873 1.873 0 0 0-1.115 2.693l.16.291c.415.764-.42 1.6-1.185 1.184l-.291-.159a1.873 1.873 0 0 0-2.693 1.116l-.094.318c-.246.835-1.428.835-1.674 0l-.094-.319a1.873 1.873 0 0 0-2.692-1.115l-.292.16c-.764.415-1.6-.42-1.184-1.185l.159-.291A1.873 1.873 0 0 0 1.945 8.93l-.319-.094c-.835-.246-.835-1.428 0-1.674l.319-.094A1.873 1.873 0 0 0 3.06 4.377l-.16-.292c-.415-.764.42-1.6 1.185-1.184l.292.159a1.873 1.873 0 0 0 2.692-1.115l.094-.319z"/> </svg>');
+
+%% my $door_icon = mark_raw('<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-door-closed-fill" viewBox="0 0 16 16"><path d="M12 1a1 1 0 0 1 1 1v13h1.5a.5.5 0 0 1 0 1h-13a.5.5 0 0 1 0-1H3V2a1 1 0 0 1 1-1h8zm-2 9a1 1 0 1 0 0-2 1 1 0 0 0 0 2z"/></svg>');
+
+<!doctype html>
+<html lang="en">
+<head>
+    <!-- Required meta tags -->
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+
+    <!-- Bootstrap CSS -->
+    <link 
+        href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.2/dist/css/bootstrap.min.css"
+        rel="stylesheet"
+        integrity="sha384-uWxY/CJNBR+1zjPWmfnSnVxwRheevXITnMqoEIeG1LJrdI0GlVs/9cVSyPYXdcSF"
+        crossorigin="anonymous">
+
+    <style>
+
+        .main {
+            background-color: orange;
+            height: 100%;
+        }
+    </style>
+
+    <title>[% $title ? "BlogDB - " ~ $title : "BlogDB" %]</title>
+</head>
+<body>
+    <nav class="navbar navbar-light bg-light">
+        <div class="container-fluid">
+            <div class="col">
+                <a class="navbar-brand" style="font-size: 3em;" href="#">BlogDB</a>
+            </div>
+            <div class="col">
+%%              if ( $login_fail ) {
+                <p class="warning">Error: Login Failed.</p>
+%%              }
+            </div>
+%%          if ( $person ) {
+            <div class="col">
+                <a href="[% $c.url_for( 'user', { name => $person.username } ) %]">[% $person.username %]</a>
+                <a href="[% $c.url_for( 'user_settings' ) %]">[% $gear_icon %]</a>
+                
+                <form method="post" action="[% $c.url_for( 'do_logout' ) %]">
+                    <button class="link" type="submit">[% $door_icon %]</button>
+                </form>
+            </div>
+
+%%          } else {
+            <div class="col">
+                <form method="post" action="[% $c.url_for( 'do_login' ) %]" class="d-flex">
+                    <input type="hidden" name="return_url" value="[% $form_return || $c.url_for() %]">
+                    <input class="form-control me-2" type="text"     name="username" placeholder="Username" aria-label="Username">
+                    <input class="form-control me-2" type="password" name="password" placeholder="Password" aria-label="Password">
+                    <button class="btn btn-outline-success" type="submit">Login</button>
+                </form>
+                <div class="container-fluid">
+                    <p style="margin-right: 0em;"><a href="[% $c.url_for('register') %]">Register</a> | <a href="[% $c.url_for( 'forgot' ) %]">Forgot</a></p>
+                </div>
+            </div>
+%%          }
+        </div>
+    </nav>
+
+    <main class="content-fluid main">
+
+%%  block panel -> {}
+
+    </main>
+
+
+
+
+
+    <!-- Bootstrap Javascript -->
+    <script 
+        src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.2/dist/js/bootstrap.bundle.min.js"
+        integrity="sha384-kQtW33rZJAHjgefvhyyzcGF3C5TFyBQBA13V1RKPf4uH+bwyzQxZ6CmMZHmNBEfJ" 
+        crossorigin="anonymous">
+    </script>
+  </body>
+</html>
diff --git a/Web/templates/default/register.html.tx b/Web/templates/default/register.html.tx
@@ -1,70 +1,8 @@
-%% my $gear_icon = mark_raw('<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-gear" viewBox="0 0 16 16"> <path d="M8 4.754a3.246 3.246 0 1 0 0 6.492 3.246 3.246 0 0 0 0-6.492zM5.754 8a2.246 2.246 0 1 1 4.492 0 2.246 2.246 0 0 1-4.492 0z"/> <path d="M9.796 1.343c-.527-1.79-3.065-1.79-3.592 0l-.094.319a.873.873 0 0 1-1.255.52l-.292-.16c-1.64-.892-3.433.902-2.54 2.541l.159.292a.873.873 0 0 1-.52 1.255l-.319.094c-1.79.527-1.79 3.065 0 3.592l.319.094a.873.873 0 0 1 .52 1.255l-.16.292c-.892 1.64.901 3.434 2.541 2.54l.292-.159a.873.873 0 0 1 1.255.52l.094.319c.527 1.79 3.065 1.79 3.592 0l.094-.319a.873.873 0 0 1 1.255-.52l.292.16c1.64.893 3.434-.902 2.54-2.541l-.159-.292a.873.873 0 0 1 .52-1.255l.319-.094c1.79-.527 1.79-3.065 0-3.592l-.319-.094a.873.873 0 0 1-.52-1.255l.16-.292c.893-1.64-.902-3.433-2.541-2.54l-.292.159a.873.873 0 0 1-1.255-.52l-.094-.319zm-2.633.283c.246-.835 1.428-.835 1.674 0l.094.319a1.873 1.873 0 0 0 2.693 1.115l.291-.16c.764-.415 1.6.42 1.184 1.185l-.159.292a1.873 1.873 0 0 0 1.116 2.692l.318.094c.835.246.835 1.428 0 1.674l-.319.094a1.873 1.873 0 0 0-1.115 2.693l.16.291c.415.764-.42 1.6-1.185 1.184l-.291-.159a1.873 1.873 0 0 0-2.693 1.116l-.094.318c-.246.835-1.428.835-1.674 0l-.094-.319a1.873 1.873 0 0 0-2.692-1.115l-.292.16c-.764.415-1.6-.42-1.184-1.185l.159-.291A1.873 1.873 0 0 0 1.945 8.93l-.319-.094c-.835-.246-.835-1.428 0-1.674l.319-.094A1.873 1.873 0 0 0 3.06 4.377l-.16-.292c-.415-.764.42-1.6 1.185-1.184l.292.159a1.873 1.873 0 0 0 2.692-1.115l.094-.319z"/> </svg>');
-
-%% my $door_icon = mark_raw('<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-door-closed-fill" viewBox="0 0 16 16"><path d="M12 1a1 1 0 0 1 1 1v13h1.5a.5.5 0 0 1 0 1h-13a.5.5 0 0 1 0-1H3V2a1 1 0 0 1 1-1h8zm-2 9a1 1 0 1 0 0-2 1 1 0 0 0 0 2z"/></svg>');
-
-<!doctype html>
-<html lang="en">
-<head>
-    <!-- Required meta tags -->
-    <meta charset="utf-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1">
-
-    <!-- Bootstrap CSS -->
-    <link 
-        href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.2/dist/css/bootstrap.min.css"
-        rel="stylesheet"
-        integrity="sha384-uWxY/CJNBR+1zjPWmfnSnVxwRheevXITnMqoEIeG1LJrdI0GlVs/9cVSyPYXdcSF"
-        crossorigin="anonymous">
-
-    <style>
-
-        .main {
-            background-color: orange;
-            height: 100%;
-        }
-    </style>
-
-    <title>Hello, world!</title>
-</head>
-<body>
-    <nav class="navbar navbar-light bg-light">
-        <div class="container-fluid">
-            <div class="col">
-                <a class="navbar-brand" style="font-size: 3em;" href="#">BlogDB</a>
-            </div>
-            <div class="col">
-%%              if ( $login_fail ) {
-                <p class="warning">Error: Login Failed.</p>
-%%              }
-            </div>
-%%          if ( $person ) {
-            <div class="col">
-                <a href="[% $c.url_for( 'user', { name => $person.username } ) %]">[% $person.username %]</a>
-                <a href="[% $c.url_for( 'user_settings' ) %]">[% $gear_icon %]</a>
-                
-                <form method="post" action="[% $c.url_for( 'do_logout' ) %]">
-                    <button class="link" type="submit">[% $door_icon %]</button>
-                </form>
-            </div>
-
-%%          } else {
-            <div class="col">
-                <form method="post" action="[% $c.url_for( 'do_login' ) %]" class="d-flex">
-                    <input type="hidden" name="return_url" value="[% $form_return || $c.url_for() %]">
-                    <input class="form-control me-2" type="text"     name="username" placeholder="Username" aria-label="Username">
-                    <input class="form-control me-2" type="password" name="password" placeholder="Password" aria-label="Password">
-                    <button class="btn btn-outline-success" type="submit">Login</button>
-                </form>
-                <div class="container-fluid">
-                    <p style="margin-right: 0em;"><a href="[% $c.url_for('register') %]">Register</a> | <a href="[% $c.url_for( 'forgot' ) %]">Forgot</a></p>
-                </div>
-            </div>
-%%          }
-        </div>
-    </nav>
-
-    <main class="content-fluid main">
+%%  cascade default::_::layout { title => 'Register',
+%%      
+%%  }
 
+%% override panel -> {
         <div class="row">
             <!-- Error Handling On LHS -->
             <div class="col">
@@ -111,19 +49,4 @@
 
                 </form>
             </div>
-
-
-    </main>
-
-
-
-
-
-    <!-- Bootstrap Javascript -->
-    <script 
-        src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.2/dist/js/bootstrap.bundle.min.js"
-        integrity="sha384-kQtW33rZJAHjgefvhyyzcGF3C5TFyBQBA13V1RKPf4uH+bwyzQxZ6CmMZHmNBEfJ" 
-        crossorigin="anonymous">
-    </script>
-  </body>
-</html>
+%%  } 
