Skip to content

Commit

Permalink
Breakdown the template.
Browse files Browse the repository at this point in the history
  • Loading branch information
Kaitlyn Parkhurst committed Oct 9, 2021
1 parent 32cb62a commit e0cdea8
Show file tree
Hide file tree
Showing 2 changed files with 88 additions and 82 deletions.
83 changes: 83 additions & 0 deletions Web/templates/default/_/layout.tx
Original file line number Diff line number Diff line change
@@ -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>
87 changes: 5 additions & 82 deletions Web/templates/default/register.html.tx
Original file line number Diff line number Diff line change
@@ -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">
Expand Down Expand Up @@ -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>
%% }

0 comments on commit e0cdea8

Please sign in to comment.