Apply the styles to moar pages

This commit is contained in:
swagg boi 2023-05-20 13:22:29 -04:00
parent 4b29dfa85d
commit fe7599ae3d
13 changed files with 89 additions and 76 deletions

View file

@ -44,25 +44,23 @@ pre > code {
* Simple classes
*/
.site-header {
display: flex;
flex-flow: column wrap;
gap: 1em;
}
.site-title {
text-align: center;
border: outset var(--light-warm-gray);
background-color: var(--light-warm-gray);
padding: 0.5em 0;
}
.site-footer {
text-align: center;
border: outset var(--light-warm-gray);
background-color: var(--light-warm-gray);
padding: 0;
margin: 1em 0;
margin-bottom: 0;
}
.site-nav {
display: flex;
flex-flow: row wrap;
justify-content: flex-start;
gap: 0.25em;
border: outset var(--light-warm-gray);
padding: 0.5em 0.25em;
@ -76,6 +74,14 @@ pre > code {
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 {
text-align: center;
border: inset var(--dark-warm-gray);
@ -103,20 +109,28 @@ pre > code {
flex-flow: column wrap;
}
.form-field > textarea {
overflow: scroll;
resize: vertical;
}
.form-button {
border: outset var(--light-blue);
background-color: var(--light-blue);
padding: 0.5em 0;
padding: 0.5em 1.5em;
text-align: left;
}
.field-with-info {
border-style: solid;
border-color: var(--highlight-green);
border: dashed var(--highlight-green) 0.5em;
background-color: var(--true-gray);
padding: 1em;
}
.field-with-error {
border-style: solid;
border-color: var(--highlight-red);
border: dashed var(--highlight-red) 0.5em;
background-color: var(--true-gray);
padding: 1em;
}
/*
@ -132,7 +146,6 @@ pre > code {
.pager__nav {
display: flex;
justify-content: flex-start;
flex-flow: row wrap;
border: inset var(--dark-warm-gray);
background-color: var(--dark-warm-gray);

View file

@ -6,7 +6,7 @@
<%= asset 'app.css' %>
</head>
<body>
<header>
<header class="site-header">
<h1 class="site-title">Post::Text</h1>
<nav class="site-nav">
<%= link_to List => threads_list => {list_page => 1} %>

View file

@ -1,14 +1,14 @@
% layout 'default';
% title 'Reset Password';
<h2><%= title %></h2>
<form method="post">
<div class="email field">
<h2 class="page-title"><%= title %></h2>
<form method="post" class="form-body">
<div class="form-field">
<%= label_for email => 'Email' %>
<%= email_field email => (id => 'email') %>
</div>
<div class="password field">
<div class="form-field">
<%= label_for password => 'Password' %>
<%= password_field password => (id => 'password') %>
</div>
<%= submit_button 'Reset' %>
<%= submit_button Reset => (class => 'form-button') %>
</form>

View file

@ -1,18 +1,18 @@
% layout 'default';
% title 'Create Moderator';
<h2><%= title %></h2>
<form method="post">
<div class="name field">
<h2 class="page-title"><%= title %></h2>
<form method="post" class="form-body">
<div class="form-field">
<%= label_for name => 'Name' %>
<%= text_field name => (id => 'name') %>
</div>
<div class="email field">
<div class="form-field">
<%= label_for email => 'Email' %>
<%= email_field email => (id => 'email') %>
</div>
<div class="password field">
<div class="form-field">
<%= label_for password => 'Password' %>
<%= password_field password => (id => 'password') %>
</div>
<%= submit_button 'Create' %>
<%= submit_button Create => (class => 'form-button') %>
</form>

View file

@ -1,10 +1,10 @@
% layout 'default';
% title 'Demote Admin';
<h2><%= title %></h2>
<form method="post">
<div class="email field">
<h2 class="page-title"><%= title %></h2>
<form method="post" class="form-body">
<div class="form-field">
<%= label_for email => 'Email' %>
<%= email_field email => (id => 'email') %>
</div>
<%= submit_button 'Demote' %>
<%= submit_button Demote => (class => 'form-button') %>
</form>

View file

@ -1,7 +1,7 @@
% layout 'default';
% title 'Flagged Posts';
<h2><%= title %></h2>
<main>
<h2 class="page-title"><%= title %></h2>
<main class="page-body">
<% if ($post_links->[0]) { =%>
<ul>
<% for my $link (@{$post_links}) { =%>

View file

@ -1,7 +1,7 @@
% layout 'default';
% title 'Hidden Posts';
<h2><%= title %></h2>
<main>
<h2 class="page-title"><%= title %></h2>
<main class="page-body">
<% if ($post_links->[0]) { =%>
<ul>
<% for my $link (@{$post_links}) { =%>

View file

@ -1,10 +1,10 @@
% layout 'default';
% title 'Lock Account';
<h2><%= title %></h2>
<form method="post">
<div class="email field">
<h2 class="page-title"><%= title %></h2>
<form method="post" class="form-body">
<div class="form-field">
<%= label_for email => 'Email' %>
<%= email_field email => (id => 'email') %>
</div>
<%= submit_button 'Lock' %>
<%= submit_button Lock => (class => 'form-button') %>
</form>

View file

@ -1,14 +1,14 @@
% layout 'default';
% title 'Moderator Login';
<h2><%= title %></h2>
<form method="post">
<div class="email field">
<h2 class="page-title"><%= title %></h2>
<form method="post" class="form-body">
<div class="form-field">
<%= label_for email => 'Email' %>
<%= email_field email => (id => 'email') %>
</div>
<div class="password field">
<div class="form-field">
<%= label_for password => 'Password' %>
<%= password_field password => (id => 'password') %>
</div>
<%= submit_button 'Login' %>
<%= submit_button Login => (class => 'form-button') %>
</form>

View file

@ -1,11 +1,11 @@
% layout 'default';
% title 'Reset Password';
<h2><%= title %></h2>
<form method="post">
<div class="password field">
<h2 class="page-title"><%= title %></h2>
<form method="post" class="form-body">
<div class="form-field">
<%= label_for password => 'Password' %>
<%= password_field password => (id => 'password') %>
</div>
<%= submit_button 'Reset' %>
<%= submit_button Reset => (class => 'form-button') %>
</form>

View file

@ -1,10 +1,10 @@
% layout 'default';
% title 'Promote Moderator';
<h2><%= title %></h2>
<form method="post">
<div class="email field">
<h2 class="page-title"><%= title %></h2>
<form method="post" class="form-body">
<div class="form-field">
<%= label_for email => 'Email' %>
<%= email_field email => (id => 'email') %>
</div>
<%= submit_button 'Promote' %>
<%= submit_button Promote => (class => 'form-button') %>
</form>

View file

@ -1,10 +1,10 @@
% layout 'default';
% title 'Unlock Account';
<h2><%= title %></h2>
<form method="post">
<div class="email field">
<h2 class="page-title"><%= title %></h2>
<form method="post" class="form-body">
<div class="form-field">
<%= label_for email => 'Email' %>
<%= email_field email => (id => 'email') %>
</div>
<%= submit_button 'Unlock' %>
<%= submit_button Unlock => (class => 'form-button') %>
</form>

View file

@ -1,8 +1,8 @@
% layout 'default';
% title 'New Remark';
<h2><%= title %></h2>
<form method="post">
<div class="author field">
<h2 class="page-title"><%= title %></h2>
<form method="post" class="form-body">
<div class="form-field">
<%= label_for author => 'Author' %>
<%= text_field author => session->{'author'}, (
id => 'author',
@ -14,7 +14,7 @@
<p class="field-with-error">Invalid author: 1 to 63 characters please.</p>
<% } =%>
</div>
<div class="text field">
<div class="form-field">
<%= label_for body => 'Text' %>
<%= text_area body => (
id => 'body',
@ -28,40 +28,40 @@
<p class="field-with-error">Invalid text: Up to 4,000 characters only.</p>
<% } =%>
</div>
<%= submit_button 'Post', class => 'post button' %>
<%= submit_button 'Post', class => 'form-button' %>
</form>
<section class="threads">
<h3>Thread</h3>
<article class="thread">
<h3 class="title">
<section class="pager">
<h3 class="page-title">Thread</h3>
<article class="post">
<h3 class="post__title">
<%= link_to single_thread => {thread_id => $thread->{'id'}}, begin %>
<%= $thread->{'title'} %>
<% end %>
<span class="id">
<span class="post__id">
<%= link_to "#$thread->{'id'}",
single_thread => {thread_id => $thread->{'id'}} %>
</span>
</h3>
<h4 class="date"><%= $thread->{'date'} %></h4>
<h5 class="author"><%= $thread->{'author'} %></h5>
<div class="body">
<h4 class="post__date"><%= $thread->{'date'} %></h4>
<h5 class="post__author"><%= $thread->{'author'} %></h5>
<div class="post__body">
<%== markdown $thread->{'body'} =%>
</div>
</article>
</section>
<% if (my $last_remark_id = $last_remark->{'id'}) { =%>
<section class="remarks">
<h3>Last Remark</h3>
<article class="remark">
<h4 class="date">
<section class="pager">
<h3 class="page-title">Last Remark</h3>
<article class="post">
<h4 class="post--remark__date">
<%= $last_remark->{'date'} %>
<span class="id">
<span class="post__id">
<%= link_to "#$last_remark_id",
single_remark => {remark_id => $last_remark_id} %>
</span>
</h4>
<h5 class="author"><%= $last_remark->{'author'} %></h5>
<div class="body">
<h5 class="post__author"><%= $last_remark->{'author'} %></h5>
<div class="post__body">
<%== markdown $last_remark->{'body'} =%>
</div>
</article>