Some template cleanup and semantic HTML changes

This commit is contained in:
swag 2023-05-09 20:07:28 -04:00
parent 625843af53
commit 079910ad68
12 changed files with 115 additions and 163 deletions

View File

@ -58,6 +58,9 @@ Run the tests locally (against development environment):
## TODOs ## TODOs
1. Show `bump_tally` and `remark_count` in single thread view
1. Rename `remark_count` to `remark_tally`
1. Redirect mod/admin back to hidden/flagged where it makes sense
1. CSS 1. CSS
1. "All new posts flagged" mode (require approval for new posts) 1. "All new posts flagged" mode (require approval for new posts)
1. Tests for mod-only user? 1. Tests for mod-only user?

View File

@ -13,74 +13,10 @@
border-collapse: collapse; border-collapse: collapse;
} }
.thread .id, .remark .id, .thread .flag, nav .login { .thread .id, .remark .id, nav .flag, nav .login {
float: right; float: right;
} }
code { pre {
white-space: pre-wrap; white-space: pre-wrap;
} }
/*
* For the custom Markdown <h1> - <h6>
*/
span.head1 {
display: block;
font-size: 2em;
margin-top: 0.67em;
margin-bottom: 0.67em;
margin-left: 0;
margin-right: 0;
font-weight: bold;
}
span.head2 {
display: block;
font-size: 1.5em;
margin-top: 0.83em;
margin-bottom: 0.83em;
margin-left: 0;
margin-right: 0;
font-weight: bold;
}
span.head3 {
display: block;
font-size: 1.17em;
margin-top: 1em;
margin-bottom: 1em;
margin-left: 0;
margin-right: 0;
font-weight: bold;
}
span.head4 {
display: block;
font-size: 1em;
margin-top: 1.33em;
margin-bottom: 1.33em;
margin-left: 0;
margin-right: 0;
font-weight: bold;
}
span.head5 {
display: block;
font-size: .83em;
margin-top: 1.67em;
margin-bottom: 1.67em;
margin-left: 0;
margin-right: 0;
font-weight: bold;
}
span.head6 {
display: block;
font-size: .67em;
margin-top: 2.33em;
margin-bottom: 2.33em;
margin-left: 0;
margin-right: 0;
font-weight: bold;
}

View File

@ -5,9 +5,9 @@
<%= asset 'main.css' %> <%= asset 'main.css' %>
</head> </head>
<body> <body>
<h1>Post::Text</h1> <header>
<nav> <h1>Post::Text</h1>
<div> <nav>
<%= link_to List => threads_list => {list_page => 1} %> <%= link_to List => threads_list => {list_page => 1} %>
<%= link_to New => 'post_thread' %> <%= link_to New => 'post_thread' %>
<%= link_to About => 'about_page' %> <%= link_to About => 'about_page' %>
@ -20,17 +20,17 @@
<%= link_to Login => 'mod_login' %> <%= link_to Login => 'mod_login' %>
<% } =%> <% } =%>
</span> </span>
</div> </nav>
<% if (is_mod) { =%> <% if (is_mod) { =%>
<div> <nav>
<span>Moderate:</span> <span>Moderate:</span>
<%= link_to Flagged => 'flagged_list' %> <%= link_to Flagged => 'flagged_list' %>
<%= link_to Hidden => 'hidden_list' %> <%= link_to Hidden => 'hidden_list' %>
<%= link_to Reset => 'mod_reset' %> <%= link_to Reset => 'mod_reset' %>
</div> </nav>
<% } =%> <% } =%>
<% if (is_admin) { =%> <% if (is_admin) { =%>
<div> <nav>
<span>Admin:</span> <span>Admin:</span>
<%= link_to Create => 'create_mod' %> <%= link_to Create => 'create_mod' %>
<%= link_to Reset => 'admin_reset' %> <%= link_to Reset => 'admin_reset' %>
@ -38,9 +38,9 @@
<%= link_to Unlock => 'unlock_mod' %> <%= link_to Unlock => 'unlock_mod' %>
<%= link_to Promote => 'promote_mod' %> <%= link_to Promote => 'promote_mod' %>
<%= link_to Demote => 'demote_admin' %> <%= link_to Demote => 'demote_admin' %>
</div> </nav>
<% } =%> <% } =%>
</nav> </header>
<hr> <hr>
<% if (flash 'error') { =%> <% if (flash 'error') { =%>
<p class="field-with-error" id="error"><%= flash 'error' %></p> <p class="field-with-error" id="error"><%= flash 'error' %></p>
@ -49,8 +49,7 @@
<% } =%> <% } =%>
<% if (flash 'info') { =%> <% if (flash 'info') { =%>
<p class="field-with-info" id="info"><%= flash 'info' %></p> <p class="field-with-info" id="info"><%= flash 'info' %></p>
<% } =%> <% } elsif (stash 'info') { =%>
<% if (stash 'info') { =%>
<p class="field-with-info" id="info"><%= stash 'info' %></p> <p class="field-with-info" id="info"><%= stash 'info' %></p>
<% } =%> <% } =%>
<%= content =%> <%= content =%>

View File

@ -1,10 +1,12 @@
% layout 'default'; % layout 'default';
% title 'Flagged Posts'; % title 'Flagged Posts';
<h2><%= title %></h2> <h2><%= title %></h2>
<% if ($post_links->[0]) { =%> <main>
<ul> <% if ($post_links->[0]) { =%>
<% for my $link (@{$post_links}) { =%> <ul>
<li><%= link_to $link, $link %></li> <% for my $link (@{$post_links}) { =%>
<li><%= link_to $link, $link %></li>
<% } =%>
</ul>
<% } =%> <% } =%>
</ul> </main>
<% } =%>

View File

@ -1,10 +1,12 @@
% layout 'default'; % layout 'default';
% title 'Hidden Posts'; % title 'Hidden Posts';
<h2><%= title %></h2> <h2><%= title %></h2>
<% if ($post_links->[0]) { =%> <main>
<ul> <% if ($post_links->[0]) { =%>
<% for my $link (@{$post_links}) { =%> <ul>
<li><%= link_to $link, $link %></li> <% for my $link (@{$post_links}) { =%>
<li><%= link_to $link, $link %></li>
<% } =%>
</ul>
<% } =%> <% } =%>
</ul> </main>
<% } =%>

View File

@ -1,4 +0,0 @@
% layout 'default';
% title 'Top Secret';
<h2><%= title %></h2>
<p>For mods only!!</p>

View File

@ -1,12 +1,13 @@
% layout 'default'; % layout 'default';
% title 'About Post::Text'; % title 'About Post::Text';
<h2><%= title %></h2> <h2><%= title %></h2>
<div class="about body"> <main class="about body">
<p>Post::Text is a <a href="">textboard</a> a bit like 2channel. You <p>Post::Text is a
can post whatever you want anonymously just please mind the <%= <a href="https://en.wikipedia.org/wiki/Textboard">textboard</a>
link_to rules => 'rules_page' %>. Markdown is supported for a bit like 2channel. You can post whatever you want anonymously
formatting posts using the <a just please mind the <%= link_to rules => 'rules_page' %>.
href="https://daringfireball.net/projects/markdown/syntax"> Markdown is supported for formatting posts using the
<a href="https://daringfireball.net/projects/markdown/syntax">
original implementation from The Daring Fireball</a>. For example, original implementation from The Daring Fireball</a>. For example,
back-ticks are for <em>inline code</em> while indentation should back-ticks are for <em>inline code</em> while indentation should
be used if you want an entire code bock:</p> be used if you want an entire code bock:</p>
@ -28,7 +29,7 @@ This is correct for a multi-line code block:
<p>You can use an actual tab character or four spaces to indent. <p>You can use an actual tab character or four spaces to indent.
<strong>Only Markdown is supported, HTML will be filtered <strong>Only Markdown is supported, HTML will be filtered
out.</strong></p> out.</strong></p>
<p>There is a button for users to 'flag' a post for review by a <p>There is a button for users to 'flag' a post for review by a
moderator. If you need further assistance you can reach out to the moderator. If you need further assistance you can reach out to the
<a href="mailto:swaggboi@slackware.uk">webmaster</a>. There is <a href="mailto:swaggboi@slackware.uk">webmaster</a>. There is
also a 'bump' button you're free to use and abuse to your heart's also a 'bump' button you're free to use and abuse to your heart's
@ -36,5 +37,5 @@ This is correct for a multi-line code block:
email client you can check out the email client you can check out the
<%= link_to 'RSS feed', threads_feed => {format => 'rss'} %>.</p> <%= link_to 'RSS feed', threads_feed => {format => 'rss'} %>.</p>
<p>Click 'New' in the top navigation bar to start a new thread and <p>Click 'New' in the top navigation bar to start a new thread and
make some <s>enemies</s> friends!</p> make some <del>enemies</del> <ins>friends</ins>!</p>
</div> </main>

View File

@ -1,7 +1,7 @@
% layout 'default'; % layout 'default';
% title 'The Rules™'; % title 'The Rules™';
<h2><%= title %></h2> <h2><%= title %></h2>
<div class="rules body"> <main class="rules body">
<p>The rules here are pretty simple:</p> <p>The rules here are pretty simple:</p>
<ul> <ul>
<li>No hate speech (e.g. racism, sexism, homophobia, transphobia, etc.)</li> <li>No hate speech (e.g. racism, sexism, homophobia, transphobia, etc.)</li>
@ -19,4 +19,5 @@
should download your own copy of that content.</li> should download your own copy of that content.</li>
<li>You are liable for what you post, and we are not liable for it.</li> <li>You are liable for what you post, and we are not liable for it.</li>
<li>We may modifiy these rules at any time.</li> <li>We may modifiy these rules at any time.</li>
</div> </ul>
</main>

View File

@ -1,24 +1,26 @@
% layout 'default'; % layout 'default';
% title "Remark #$remark->{'id'}"; % title "Remark #$remark->{'id'}";
<h2><%= title %></h2> <h2><%= title %></h2>
<div class="remarks"> <main class="remarks">
<article class="remark"> <article class="remark">
<nav class="id">#<%= $remark->{'id'} %></nav>
<h4 class="date"><%= $remark->{'date'} %></h4> <h4 class="date"><%= $remark->{'date'} %></h4>
<h5 class="author"><%= $remark->{'author'} %></h5> <h5 class="author"><%= $remark->{'author'} %></h5>
<div class="body"> <div class="body">
<%== markdown $remark->{'body'} =%> <%== markdown $remark->{'body'} =%>
</div> </div>
<nav>
<%= link_to Thread => single_thread => {thread_id => $remark->{'thread_id'}} %>
<%= link_to Remark => post_remark => {thread_id => $remark->{'thread_id'}} %>
<span class="flag">
<%= link_to Flag => flag_remark => {remark_id => $remark->{'id'}} %>
</span>
</nav>
<% if (is_mod) { =%>
<nav>
<%= link_to Hide => hide_remark => {remark_id => $remark->{'id'}} %>
<%= link_to Unhide => unhide_remark => {remark_id => $remark->{'id'}} %>
<%= link_to Unflag => unflag_remark => {remark_id => $remark->{'id'}} %>
</nav>
<% } =%>
</article> </article>
</div> </main>
<nav>
<%= link_to Thread => single_thread => {thread_id => $remark->{'thread_id'}} %>
<%= link_to Flag => flag_remark => {remark_id => $remark->{'id'} } %>
</nav>
<% if (is_mod) { =%>
<nav>
<%= link_to Hide => hide_remark => {remark_id => $remark->{'id'}} %>
<%= link_to Unhide => unhide_remark => {remark_id => $remark->{'id'}} %>
<%= link_to Unflag => unflag_remark => {remark_id => $remark->{'id'}} %>
</nav>
<% } =%>

View File

@ -27,34 +27,40 @@
</div> </div>
<%= submit_button 'Post', class => 'post button' %> <%= submit_button 'Post', class => 'post button' %>
</form> </form>
<div class="threads"> <section class="threads">
<h3>Thread</h3> <h3>Thread</h3>
<article class="thread"> <article class="thread">
<nav class="id"> <h3 class="title">
<%= link_to "#$thread->{'id'}", <%= link_to single_thread => {thread_id => $thread->{'id'}}, begin %>
<%= $thread->{'title'} %>
<% end %>
<span class="id">
<%= link_to "#$thread->{'id'}",
single_thread => {thread_id => $thread->{'id'}} %> single_thread => {thread_id => $thread->{'id'}} %>
</nav> </span>
<h3 class="title"><%= $thread->{'title'} %></h3> </h3>
<h4 class="date"><%= $thread->{'date'} %></h4> <h4 class="date"><%= $thread->{'date'} %></h4>
<h5 class="author"><%= $thread->{'author'} %></h5> <h5 class="author"><%= $thread->{'author'} %></h5>
<div class="body"> <div class="body">
<%== markdown $thread->{'body'} =%> <%== markdown $thread->{'body'} =%>
</div> </div>
</article> </article>
</div> </section>
<% if (my $last_remark_id = $last_remark->{'id'}) { =%> <% if (my $last_remark_id = $last_remark->{'id'}) { =%>
<div class="remarks"> <section class="remarks">
<h3>Last Remark</h3> <h3>Last Remark</h3>
<article class="remark"> <article class="remark">
<nav class="id"> <h4 class="date">
<%= link_to "#$last_remark_id", <%= $last_remark->{'date'} %>
single_remark => {remark_id => $last_remark_id} %> <span class="id">
</nav> <%= link_to "#$last_remark_id",
<h4 class="date"><%= $last_remark->{'date'} %></h4> single_remark => {remark_id => $last_remark_id} %>
</span>
</h4>
<h5 class="author"><%= $last_remark->{'author'} %></h5> <h5 class="author"><%= $last_remark->{'author'} %></h5>
<div class="body"> <div class="body">
<%== markdown $last_remark->{'body'} =%> <%== markdown $last_remark->{'body'} =%>
</div> </div>
</article> </article>
</div> </section>
<% } =%> <% } =%>

View File

@ -1,7 +1,7 @@
% layout 'default'; % layout 'default';
% title "Thread #$thread->{'id'}"; % title "Thread #$thread->{'id'}";
<h2><%= title %></h2> <h2><%= title %></h2>
<div class="threads"> <main class="threads">
<article class="thread"> <article class="thread">
<h3 class="title"><%= $thread->{'title'} %></h3> <h3 class="title"><%= $thread->{'title'} %></h3>
<h4 class="date"><%= $thread->{'date'} %></h4> <h4 class="date"><%= $thread->{'date'} %></h4>
@ -9,43 +9,47 @@
<div class="body"> <div class="body">
<%== markdown $thread->{'body'} =%> <%== markdown $thread->{'body'} =%>
</div> </div>
<nav>
<%= link_to Remark => post_remark => {thread_id => $thread->{'id'}} %>
<%= link_to Bump => bump_thread => {thread_id => $thread->{'id'}} %>
<span class="flag">
<%= link_to Flag => flag_thread => {thread_id => $thread->{'id'}} %>
</span>
</nav>
<% if (is_mod) { =%>
<nav>
<%= link_to Hide => hide_thread => {thread_id => $thread->{'id'}} %>
<%= link_to Unhide => unhide_thread => {thread_id => $thread->{'id'}} %>
<%= link_to Unflag => unflag_thread => {thread_id => $thread->{'id'}} %>
</nav>
<% } =%>
</article> </article>
</div> </main>
<nav>
<%= link_to Remark => post_remark => {thread_id => $thread->{'id'}} %>
<%= link_to Bump => bump_thread => {thread_id => $thread->{'id'}} %>
<%= link_to Flag => flag_thread => {thread_id => $thread->{'id'}} %>
</nav>
<% if (is_mod) { =%>
<nav>
<%= link_to Hide => hide_thread => {thread_id => $thread->{'id'}} %>
<%= link_to Unhide => unhide_thread => {thread_id => $thread->{'id'}} %>
<%= link_to Unflag => unflag_thread => {thread_id => $thread->{'id'}} %>
</nav>
<% } =%>
<% if (my $first_remark = $remarks->[0]) { =%> <% if (my $first_remark = $remarks->[0]) { =%>
<div class="remarks" id="remarks"> <section class="remarks" id="remarks">
<h3>Remarks</h3> <h3>Remarks</h3>
<% for my $remark (@{$remarks}) { =%> <% for my $remark (@{$remarks}) { =%>
<article class="remark"> <article class="remark">
<nav class="id"> <h4 class="date">
<%= link_to "#$remark->{'id'}", <%= $remark->{'date'} %>
single_remark => {remark_id => $remark->{'id'}} %> <span class="id">
</nav> <%= link_to "#$remark->{'id'}",
<h4 class="date"><%= $remark->{'date'} %></h4> single_remark => {remark_id => $remark->{'id'}} %>
</span>
</h4>
<h5 class="author"><%= $remark->{'author'} %></h5> <h5 class="author"><%= $remark->{'author'} %></h5>
<div class="body"> <div class="body">
<%== markdown $remark->{'body'} =%> <%== markdown $remark->{'body'} =%>
</div> </div>
<nav class="flag"> <nav>
<%= link_to Flag => flag_remark => {remark_id => $remark->{'id'}} %> <%= link_to Remark => post_remark => {thread_id => $thread->{'id'}} %>
<span class="flag">
<%= link_to Flag => flag_remark => {remark_id => $remark->{'id'}} %>
</span>
</nav> </nav>
</article> </article>
<% } =%> <% } =%>
</div> </section>
<nav>
<%= link_to Remark => post_remark => {thread_id => $thread->{'id'}} %>
</nav>
<nav> <nav>
<% if ($last_page && $last_page != 1) { =%> <% if ($last_page && $last_page != 1) { =%>
<%= pagination $this_page, $last_page, ($base_path . '/{page}') %> <%= pagination $this_page, $last_page, ($base_path . '/{page}') %>

View File

@ -1,17 +1,17 @@
% layout 'default'; % layout 'default';
% title 'Threads List'; % title 'Threads List';
<h2><%= title %></h2> <h2><%= title %></h2>
<div class="threads"> <main class="threads">
<% for my $thread (@{$threads}) { =%> <% for my $thread (@{$threads}) { =%>
<article class="thread"> <article class="thread">
<nav class="id">
<%= link_to "#$thread->{'id'}",
single_thread => {thread_id => $thread->{'id'}} %>
</nav>
<h3 class="title"> <h3 class="title">
<%= link_to single_thread => {thread_id => $thread->{'id'}}, begin %> <%= link_to single_thread => {thread_id => $thread->{'id'}}, begin %>
<%= $thread->{'title'} %> <%= $thread->{'title'} %>
<% end %> <% end %>
<span class="id">
<%= link_to "#$thread->{'id'}",
single_thread => {thread_id => $thread->{'id'}} %>
</span>
</h3> </h3>
<h4 class="date"><%= $thread->{'date'} %></h4> <h4 class="date"><%= $thread->{'date'} %></h4>
<h5 class="author"><%= $thread->{'author'} %></h5> <h5 class="author"><%= $thread->{'author'} %></h5>
@ -32,7 +32,7 @@
</nav> </nav>
</article> </article>
<% } =%> <% } =%>
</div> </main>
<% if ($last_page && $last_page != 1) { =%> <% if ($last_page && $last_page != 1) { =%>
<nav> <nav>
<%= pagination $this_page, $last_page, ($base_path . '/{page}') %> <%= pagination $this_page, $last_page, ($base_path . '/{page}') %>