Apply the styles to moar pages
This commit is contained in:
parent
4b29dfa85d
commit
fe7599ae3d
@ -44,25 +44,23 @@ pre > code {
|
|||||||
* Simple classes
|
* Simple classes
|
||||||
*/
|
*/
|
||||||
|
|
||||||
|
.site-header {
|
||||||
|
display: flex;
|
||||||
|
flex-flow: column wrap;
|
||||||
|
gap: 1em;
|
||||||
|
}
|
||||||
|
|
||||||
.site-title {
|
.site-title {
|
||||||
text-align: center;
|
text-align: center;
|
||||||
border: outset var(--light-warm-gray);
|
border: outset var(--light-warm-gray);
|
||||||
background-color: var(--light-warm-gray);
|
background-color: var(--light-warm-gray);
|
||||||
padding: 0.5em 0;
|
padding: 0.5em 0;
|
||||||
}
|
margin-bottom: 0;
|
||||||
|
|
||||||
.site-footer {
|
|
||||||
text-align: center;
|
|
||||||
border: outset var(--light-warm-gray);
|
|
||||||
background-color: var(--light-warm-gray);
|
|
||||||
padding: 0;
|
|
||||||
margin: 1em 0;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.site-nav {
|
.site-nav {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-flow: row wrap;
|
flex-flow: row wrap;
|
||||||
justify-content: flex-start;
|
|
||||||
gap: 0.25em;
|
gap: 0.25em;
|
||||||
border: outset var(--light-warm-gray);
|
border: outset var(--light-warm-gray);
|
||||||
padding: 0.5em 0.25em;
|
padding: 0.5em 0.25em;
|
||||||
@ -76,6 +74,14 @@ pre > code {
|
|||||||
background-color: var(--light-blue);
|
background-color: var(--light-blue);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.site-footer {
|
||||||
|
text-align: center;
|
||||||
|
border: outset var(--light-warm-gray);
|
||||||
|
background-color: var(--light-warm-gray);
|
||||||
|
padding: 0;
|
||||||
|
margin: 1em 0;
|
||||||
|
}
|
||||||
|
|
||||||
.page-title {
|
.page-title {
|
||||||
text-align: center;
|
text-align: center;
|
||||||
border: inset var(--dark-warm-gray);
|
border: inset var(--dark-warm-gray);
|
||||||
@ -103,20 +109,28 @@ pre > code {
|
|||||||
flex-flow: column wrap;
|
flex-flow: column wrap;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.form-field > textarea {
|
||||||
|
overflow: scroll;
|
||||||
|
resize: vertical;
|
||||||
|
}
|
||||||
|
|
||||||
.form-button {
|
.form-button {
|
||||||
border: outset var(--light-blue);
|
border: outset var(--light-blue);
|
||||||
background-color: var(--light-blue);
|
background-color: var(--light-blue);
|
||||||
padding: 0.5em 0;
|
padding: 0.5em 1.5em;
|
||||||
|
text-align: left;
|
||||||
}
|
}
|
||||||
|
|
||||||
.field-with-info {
|
.field-with-info {
|
||||||
border-style: solid;
|
border: dashed var(--highlight-green) 0.5em;
|
||||||
border-color: var(--highlight-green);
|
background-color: var(--true-gray);
|
||||||
|
padding: 1em;
|
||||||
}
|
}
|
||||||
|
|
||||||
.field-with-error {
|
.field-with-error {
|
||||||
border-style: solid;
|
border: dashed var(--highlight-red) 0.5em;
|
||||||
border-color: var(--highlight-red);
|
background-color: var(--true-gray);
|
||||||
|
padding: 1em;
|
||||||
}
|
}
|
||||||
|
|
||||||
/*
|
/*
|
||||||
@ -132,7 +146,6 @@ pre > code {
|
|||||||
|
|
||||||
.pager__nav {
|
.pager__nav {
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: flex-start;
|
|
||||||
flex-flow: row wrap;
|
flex-flow: row wrap;
|
||||||
border: inset var(--dark-warm-gray);
|
border: inset var(--dark-warm-gray);
|
||||||
background-color: var(--dark-warm-gray);
|
background-color: var(--dark-warm-gray);
|
||||||
|
@ -6,7 +6,7 @@
|
|||||||
<%= asset 'app.css' %>
|
<%= asset 'app.css' %>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<header>
|
<header class="site-header">
|
||||||
<h1 class="site-title">Post::Text</h1>
|
<h1 class="site-title">Post::Text</h1>
|
||||||
<nav class="site-nav">
|
<nav class="site-nav">
|
||||||
<%= link_to List => threads_list => {list_page => 1} %>
|
<%= link_to List => threads_list => {list_page => 1} %>
|
||||||
|
@ -1,14 +1,14 @@
|
|||||||
% layout 'default';
|
% layout 'default';
|
||||||
% title 'Reset Password';
|
% title 'Reset Password';
|
||||||
<h2><%= title %></h2>
|
<h2 class="page-title"><%= title %></h2>
|
||||||
<form method="post">
|
<form method="post" class="form-body">
|
||||||
<div class="email field">
|
<div class="form-field">
|
||||||
<%= label_for email => 'Email' %>
|
<%= label_for email => 'Email' %>
|
||||||
<%= email_field email => (id => 'email') %>
|
<%= email_field email => (id => 'email') %>
|
||||||
</div>
|
</div>
|
||||||
<div class="password field">
|
<div class="form-field">
|
||||||
<%= label_for password => 'Password' %>
|
<%= label_for password => 'Password' %>
|
||||||
<%= password_field password => (id => 'password') %>
|
<%= password_field password => (id => 'password') %>
|
||||||
</div>
|
</div>
|
||||||
<%= submit_button 'Reset' %>
|
<%= submit_button Reset => (class => 'form-button') %>
|
||||||
</form>
|
</form>
|
||||||
|
@ -1,18 +1,18 @@
|
|||||||
% layout 'default';
|
% layout 'default';
|
||||||
% title 'Create Moderator';
|
% title 'Create Moderator';
|
||||||
<h2><%= title %></h2>
|
<h2 class="page-title"><%= title %></h2>
|
||||||
<form method="post">
|
<form method="post" class="form-body">
|
||||||
<div class="name field">
|
<div class="form-field">
|
||||||
<%= label_for name => 'Name' %>
|
<%= label_for name => 'Name' %>
|
||||||
<%= text_field name => (id => 'name') %>
|
<%= text_field name => (id => 'name') %>
|
||||||
</div>
|
</div>
|
||||||
<div class="email field">
|
<div class="form-field">
|
||||||
<%= label_for email => 'Email' %>
|
<%= label_for email => 'Email' %>
|
||||||
<%= email_field email => (id => 'email') %>
|
<%= email_field email => (id => 'email') %>
|
||||||
</div>
|
</div>
|
||||||
<div class="password field">
|
<div class="form-field">
|
||||||
<%= label_for password => 'Password' %>
|
<%= label_for password => 'Password' %>
|
||||||
<%= password_field password => (id => 'password') %>
|
<%= password_field password => (id => 'password') %>
|
||||||
</div>
|
</div>
|
||||||
<%= submit_button 'Create' %>
|
<%= submit_button Create => (class => 'form-button') %>
|
||||||
</form>
|
</form>
|
||||||
|
@ -1,10 +1,10 @@
|
|||||||
% layout 'default';
|
% layout 'default';
|
||||||
% title 'Demote Admin';
|
% title 'Demote Admin';
|
||||||
<h2><%= title %></h2>
|
<h2 class="page-title"><%= title %></h2>
|
||||||
<form method="post">
|
<form method="post" class="form-body">
|
||||||
<div class="email field">
|
<div class="form-field">
|
||||||
<%= label_for email => 'Email' %>
|
<%= label_for email => 'Email' %>
|
||||||
<%= email_field email => (id => 'email') %>
|
<%= email_field email => (id => 'email') %>
|
||||||
</div>
|
</div>
|
||||||
<%= submit_button 'Demote' %>
|
<%= submit_button Demote => (class => 'form-button') %>
|
||||||
</form>
|
</form>
|
||||||
|
@ -1,7 +1,7 @@
|
|||||||
% layout 'default';
|
% layout 'default';
|
||||||
% title 'Flagged Posts';
|
% title 'Flagged Posts';
|
||||||
<h2><%= title %></h2>
|
<h2 class="page-title"><%= title %></h2>
|
||||||
<main>
|
<main class="page-body">
|
||||||
<% if ($post_links->[0]) { =%>
|
<% if ($post_links->[0]) { =%>
|
||||||
<ul>
|
<ul>
|
||||||
<% for my $link (@{$post_links}) { =%>
|
<% for my $link (@{$post_links}) { =%>
|
||||||
|
@ -1,7 +1,7 @@
|
|||||||
% layout 'default';
|
% layout 'default';
|
||||||
% title 'Hidden Posts';
|
% title 'Hidden Posts';
|
||||||
<h2><%= title %></h2>
|
<h2 class="page-title"><%= title %></h2>
|
||||||
<main>
|
<main class="page-body">
|
||||||
<% if ($post_links->[0]) { =%>
|
<% if ($post_links->[0]) { =%>
|
||||||
<ul>
|
<ul>
|
||||||
<% for my $link (@{$post_links}) { =%>
|
<% for my $link (@{$post_links}) { =%>
|
||||||
|
@ -1,10 +1,10 @@
|
|||||||
% layout 'default';
|
% layout 'default';
|
||||||
% title 'Lock Account';
|
% title 'Lock Account';
|
||||||
<h2><%= title %></h2>
|
<h2 class="page-title"><%= title %></h2>
|
||||||
<form method="post">
|
<form method="post" class="form-body">
|
||||||
<div class="email field">
|
<div class="form-field">
|
||||||
<%= label_for email => 'Email' %>
|
<%= label_for email => 'Email' %>
|
||||||
<%= email_field email => (id => 'email') %>
|
<%= email_field email => (id => 'email') %>
|
||||||
</div>
|
</div>
|
||||||
<%= submit_button 'Lock' %>
|
<%= submit_button Lock => (class => 'form-button') %>
|
||||||
</form>
|
</form>
|
||||||
|
@ -1,14 +1,14 @@
|
|||||||
% layout 'default';
|
% layout 'default';
|
||||||
% title 'Moderator Login';
|
% title 'Moderator Login';
|
||||||
<h2><%= title %></h2>
|
<h2 class="page-title"><%= title %></h2>
|
||||||
<form method="post">
|
<form method="post" class="form-body">
|
||||||
<div class="email field">
|
<div class="form-field">
|
||||||
<%= label_for email => 'Email' %>
|
<%= label_for email => 'Email' %>
|
||||||
<%= email_field email => (id => 'email') %>
|
<%= email_field email => (id => 'email') %>
|
||||||
</div>
|
</div>
|
||||||
<div class="password field">
|
<div class="form-field">
|
||||||
<%= label_for password => 'Password' %>
|
<%= label_for password => 'Password' %>
|
||||||
<%= password_field password => (id => 'password') %>
|
<%= password_field password => (id => 'password') %>
|
||||||
</div>
|
</div>
|
||||||
<%= submit_button 'Login' %>
|
<%= submit_button Login => (class => 'form-button') %>
|
||||||
</form>
|
</form>
|
||||||
|
@ -1,11 +1,11 @@
|
|||||||
% layout 'default';
|
% layout 'default';
|
||||||
% title 'Reset Password';
|
% title 'Reset Password';
|
||||||
<h2><%= title %></h2>
|
<h2 class="page-title"><%= title %></h2>
|
||||||
<form method="post">
|
<form method="post" class="form-body">
|
||||||
<div class="password field">
|
<div class="form-field">
|
||||||
<%= label_for password => 'Password' %>
|
<%= label_for password => 'Password' %>
|
||||||
<%= password_field password => (id => 'password') %>
|
<%= password_field password => (id => 'password') %>
|
||||||
</div>
|
</div>
|
||||||
<%= submit_button 'Reset' %>
|
<%= submit_button Reset => (class => 'form-button') %>
|
||||||
</form>
|
</form>
|
||||||
|
|
||||||
|
@ -1,10 +1,10 @@
|
|||||||
% layout 'default';
|
% layout 'default';
|
||||||
% title 'Promote Moderator';
|
% title 'Promote Moderator';
|
||||||
<h2><%= title %></h2>
|
<h2 class="page-title"><%= title %></h2>
|
||||||
<form method="post">
|
<form method="post" class="form-body">
|
||||||
<div class="email field">
|
<div class="form-field">
|
||||||
<%= label_for email => 'Email' %>
|
<%= label_for email => 'Email' %>
|
||||||
<%= email_field email => (id => 'email') %>
|
<%= email_field email => (id => 'email') %>
|
||||||
</div>
|
</div>
|
||||||
<%= submit_button 'Promote' %>
|
<%= submit_button Promote => (class => 'form-button') %>
|
||||||
</form>
|
</form>
|
||||||
|
@ -1,10 +1,10 @@
|
|||||||
% layout 'default';
|
% layout 'default';
|
||||||
% title 'Unlock Account';
|
% title 'Unlock Account';
|
||||||
<h2><%= title %></h2>
|
<h2 class="page-title"><%= title %></h2>
|
||||||
<form method="post">
|
<form method="post" class="form-body">
|
||||||
<div class="email field">
|
<div class="form-field">
|
||||||
<%= label_for email => 'Email' %>
|
<%= label_for email => 'Email' %>
|
||||||
<%= email_field email => (id => 'email') %>
|
<%= email_field email => (id => 'email') %>
|
||||||
</div>
|
</div>
|
||||||
<%= submit_button 'Unlock' %>
|
<%= submit_button Unlock => (class => 'form-button') %>
|
||||||
</form>
|
</form>
|
||||||
|
@ -1,8 +1,8 @@
|
|||||||
% layout 'default';
|
% layout 'default';
|
||||||
% title 'New Remark';
|
% title 'New Remark';
|
||||||
<h2><%= title %></h2>
|
<h2 class="page-title"><%= title %></h2>
|
||||||
<form method="post">
|
<form method="post" class="form-body">
|
||||||
<div class="author field">
|
<div class="form-field">
|
||||||
<%= label_for author => 'Author' %>
|
<%= label_for author => 'Author' %>
|
||||||
<%= text_field author => session->{'author'}, (
|
<%= text_field author => session->{'author'}, (
|
||||||
id => 'author',
|
id => 'author',
|
||||||
@ -14,7 +14,7 @@
|
|||||||
<p class="field-with-error">Invalid author: 1 to 63 characters please.</p>
|
<p class="field-with-error">Invalid author: 1 to 63 characters please.</p>
|
||||||
<% } =%>
|
<% } =%>
|
||||||
</div>
|
</div>
|
||||||
<div class="text field">
|
<div class="form-field">
|
||||||
<%= label_for body => 'Text' %>
|
<%= label_for body => 'Text' %>
|
||||||
<%= text_area body => (
|
<%= text_area body => (
|
||||||
id => 'body',
|
id => 'body',
|
||||||
@ -28,40 +28,40 @@
|
|||||||
<p class="field-with-error">Invalid text: Up to 4,000 characters only.</p>
|
<p class="field-with-error">Invalid text: Up to 4,000 characters only.</p>
|
||||||
<% } =%>
|
<% } =%>
|
||||||
</div>
|
</div>
|
||||||
<%= submit_button 'Post', class => 'post button' %>
|
<%= submit_button 'Post', class => 'form-button' %>
|
||||||
</form>
|
</form>
|
||||||
<section class="threads">
|
<section class="pager">
|
||||||
<h3>Thread</h3>
|
<h3 class="page-title">Thread</h3>
|
||||||
<article class="thread">
|
<article class="post">
|
||||||
<h3 class="title">
|
<h3 class="post__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">
|
<span class="post__id">
|
||||||
<%= link_to "#$thread->{'id'}",
|
<%= link_to "#$thread->{'id'}",
|
||||||
single_thread => {thread_id => $thread->{'id'}} %>
|
single_thread => {thread_id => $thread->{'id'}} %>
|
||||||
</span>
|
</span>
|
||||||
</h3>
|
</h3>
|
||||||
<h4 class="date"><%= $thread->{'date'} %></h4>
|
<h4 class="post__date"><%= $thread->{'date'} %></h4>
|
||||||
<h5 class="author"><%= $thread->{'author'} %></h5>
|
<h5 class="post__author"><%= $thread->{'author'} %></h5>
|
||||||
<div class="body">
|
<div class="post__body">
|
||||||
<%== markdown $thread->{'body'} =%>
|
<%== markdown $thread->{'body'} =%>
|
||||||
</div>
|
</div>
|
||||||
</article>
|
</article>
|
||||||
</section>
|
</section>
|
||||||
<% if (my $last_remark_id = $last_remark->{'id'}) { =%>
|
<% if (my $last_remark_id = $last_remark->{'id'}) { =%>
|
||||||
<section class="remarks">
|
<section class="pager">
|
||||||
<h3>Last Remark</h3>
|
<h3 class="page-title">Last Remark</h3>
|
||||||
<article class="remark">
|
<article class="post">
|
||||||
<h4 class="date">
|
<h4 class="post--remark__date">
|
||||||
<%= $last_remark->{'date'} %>
|
<%= $last_remark->{'date'} %>
|
||||||
<span class="id">
|
<span class="post__id">
|
||||||
<%= link_to "#$last_remark_id",
|
<%= link_to "#$last_remark_id",
|
||||||
single_remark => {remark_id => $last_remark_id} %>
|
single_remark => {remark_id => $last_remark_id} %>
|
||||||
</span>
|
</span>
|
||||||
</h4>
|
</h4>
|
||||||
<h5 class="author"><%= $last_remark->{'author'} %></h5>
|
<h5 class="post__author"><%= $last_remark->{'author'} %></h5>
|
||||||
<div class="body">
|
<div class="post__body">
|
||||||
<%== markdown $last_remark->{'body'} =%>
|
<%== markdown $last_remark->{'body'} =%>
|
||||||
</div>
|
</div>
|
||||||
</article>
|
</article>
|
||||||
|
Loading…
x
Reference in New Issue
Block a user