User registration.
Cleanup CSS. Signed-off-by: Armored Dragon <publicmail@armoreddragon.com>pull/1/head
parent
1b9ea56423
commit
5ab8a79e78
|
@ -25,7 +25,7 @@ async function index(request, response) {
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
function register(request, response) {
|
function register(request, response) {
|
||||||
response.render("register.ejs", getDefaults(request));
|
response.render(getThemePage("register"), getDefaults(request));
|
||||||
}
|
}
|
||||||
function login(request, response) {
|
function login(request, response) {
|
||||||
response.render(getThemePage("login"), getDefaults(request));
|
response.render(getThemePage("login"), getDefaults(request));
|
||||||
|
|
|
@ -1,252 +0,0 @@
|
||||||
body {
|
|
||||||
margin: 0;
|
|
||||||
background-color: #111;
|
|
||||||
color: white;
|
|
||||||
font-family: Verdana, Geneva, Tahoma, sans-serif;
|
|
||||||
}
|
|
||||||
|
|
||||||
.header {
|
|
||||||
background-color: #222;
|
|
||||||
width: 100%;
|
|
||||||
height: 50px;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: row;
|
|
||||||
padding: 0 10px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
margin-bottom: 1rem;
|
|
||||||
}
|
|
||||||
.header .left {
|
|
||||||
margin: auto auto auto 0;
|
|
||||||
font-size: 20px;
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
.header .left a {
|
|
||||||
width: inherit;
|
|
||||||
}
|
|
||||||
.header .right {
|
|
||||||
margin: auto 0 auto auto;
|
|
||||||
height: 100%;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: row;
|
|
||||||
}
|
|
||||||
.header .right a:hover,
|
|
||||||
.header .right a:focus {
|
|
||||||
background-color: #333;
|
|
||||||
}
|
|
||||||
.header a {
|
|
||||||
height: 100%;
|
|
||||||
width: 130px;
|
|
||||||
margin: auto 0;
|
|
||||||
display: flex;
|
|
||||||
text-decoration: none;
|
|
||||||
transition: background-color ease-in-out 0.1s;
|
|
||||||
}
|
|
||||||
.header a div {
|
|
||||||
margin: auto;
|
|
||||||
color: white;
|
|
||||||
}
|
|
||||||
|
|
||||||
button {
|
|
||||||
background-color: #1c478a;
|
|
||||||
border: 0;
|
|
||||||
border-radius: 5px;
|
|
||||||
color: white;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
button:hover,
|
|
||||||
button:focus {
|
|
||||||
background-color: #122d57;
|
|
||||||
}
|
|
||||||
|
|
||||||
button.good,
|
|
||||||
a.good {
|
|
||||||
background-color: #015b01;
|
|
||||||
}
|
|
||||||
|
|
||||||
button.yellow,
|
|
||||||
a.yellow {
|
|
||||||
background-color: #4a4a00;
|
|
||||||
}
|
|
||||||
|
|
||||||
button.bad,
|
|
||||||
a.bad {
|
|
||||||
background-color: #8e0000;
|
|
||||||
}
|
|
||||||
|
|
||||||
.page {
|
|
||||||
width: 1000px;
|
|
||||||
min-height: 10px;
|
|
||||||
margin: 0 auto;
|
|
||||||
}
|
|
||||||
.page .horizontal-button-container {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: row;
|
|
||||||
}
|
|
||||||
.page .horizontal-button-container button,
|
|
||||||
.page .horizontal-button-container a {
|
|
||||||
width: 120px;
|
|
||||||
min-height: 30px;
|
|
||||||
text-decoration: none;
|
|
||||||
display: flex;
|
|
||||||
margin-right: 5px;
|
|
||||||
}
|
|
||||||
.page .horizontal-button-container button span,
|
|
||||||
.page .horizontal-button-container a span {
|
|
||||||
margin: auto;
|
|
||||||
}
|
|
||||||
.page .horizontal-button-container button:last-of-type,
|
|
||||||
.page .horizontal-button-container a:last-of-type {
|
|
||||||
margin-right: 0;
|
|
||||||
}
|
|
||||||
.page .blog-admin {
|
|
||||||
margin-bottom: 10px;
|
|
||||||
}
|
|
||||||
.page .pagination {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: row;
|
|
||||||
width: 100%;
|
|
||||||
margin: 0 auto;
|
|
||||||
}
|
|
||||||
.page .pagination a {
|
|
||||||
height: 40px;
|
|
||||||
width: 150px;
|
|
||||||
margin-right: 5px;
|
|
||||||
display: flex;
|
|
||||||
text-decoration: none;
|
|
||||||
background-color: #222;
|
|
||||||
}
|
|
||||||
.page .pagination a span {
|
|
||||||
margin: auto;
|
|
||||||
color: white;
|
|
||||||
font-size: 20px;
|
|
||||||
}
|
|
||||||
.page .pagination a:last-of-type {
|
|
||||||
margin-right: 0;
|
|
||||||
margin-left: 5px;
|
|
||||||
}
|
|
||||||
.page .pagination a.disabled {
|
|
||||||
filter: brightness(50%);
|
|
||||||
}
|
|
||||||
.page .pagination .page-list {
|
|
||||||
flex-grow: 1;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: row;
|
|
||||||
margin-bottom: 50px;
|
|
||||||
}
|
|
||||||
.page .pagination .page-list a {
|
|
||||||
width: 40px;
|
|
||||||
height: 40px;
|
|
||||||
display: flex;
|
|
||||||
text-decoration: none;
|
|
||||||
background-color: #222;
|
|
||||||
border-radius: 10px;
|
|
||||||
margin: 0 10px 0 0;
|
|
||||||
}
|
|
||||||
.page .pagination .page-list a span {
|
|
||||||
margin: auto;
|
|
||||||
color: white;
|
|
||||||
}
|
|
||||||
.page .pagination .page-list a:first-of-type {
|
|
||||||
margin: auto 10px auto auto;
|
|
||||||
}
|
|
||||||
.page .pagination .page-list a:last-of-type {
|
|
||||||
margin: auto auto auto 0;
|
|
||||||
}
|
|
||||||
.page .pagination .page-list a.active {
|
|
||||||
background-color: #993d00;
|
|
||||||
}
|
|
||||||
|
|
||||||
.hidden {
|
|
||||||
display: none !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
@media screen and (max-width: 1010px) {
|
|
||||||
.page {
|
|
||||||
width: 95%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.container {
|
|
||||||
background-color: #222;
|
|
||||||
min-height: 10px;
|
|
||||||
padding: 10px 20px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
}
|
|
||||||
.container .category-navigation {
|
|
||||||
width: 100%;
|
|
||||||
height: 30px;
|
|
||||||
display: flex;
|
|
||||||
margin-bottom: 15px;
|
|
||||||
}
|
|
||||||
.container .category-navigation button {
|
|
||||||
width: 100%;
|
|
||||||
margin-right: 5px;
|
|
||||||
border-radius: 5px;
|
|
||||||
text-decoration: none;
|
|
||||||
display: flex;
|
|
||||||
}
|
|
||||||
.container .category-navigation button span {
|
|
||||||
margin: auto;
|
|
||||||
color: white;
|
|
||||||
}
|
|
||||||
.container .category-navigation button:not(.active) {
|
|
||||||
background-color: #4c515e;
|
|
||||||
}
|
|
||||||
.container .category-navigation button:hover,
|
|
||||||
.container .category-navigation button:focus {
|
|
||||||
filter: brightness(50%);
|
|
||||||
}
|
|
||||||
.container .setting-row {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: row;
|
|
||||||
min-height: 30px;
|
|
||||||
padding: 5px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
}
|
|
||||||
.container .setting-row .setting-title {
|
|
||||||
font-size: 18px;
|
|
||||||
margin: auto auto auto 0;
|
|
||||||
}
|
|
||||||
.container .setting-row .setting-toggleable {
|
|
||||||
min-width: 150px;
|
|
||||||
display: flex;
|
|
||||||
margin: auto 0 auto auto;
|
|
||||||
}
|
|
||||||
.container .setting-row .setting-toggleable .spinner {
|
|
||||||
margin: auto 0 auto auto;
|
|
||||||
animation: spin 1s;
|
|
||||||
animation-timing-function: linear;
|
|
||||||
animation-iteration-count: infinite;
|
|
||||||
}
|
|
||||||
.container .setting-row .setting-toggleable input {
|
|
||||||
padding: 0;
|
|
||||||
margin: auto 0 auto auto;
|
|
||||||
height: 25px;
|
|
||||||
width: 100px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
text-align: center;
|
|
||||||
border-radius: 10px;
|
|
||||||
}
|
|
||||||
.container .setting-row .setting-toggleable input[type=text] {
|
|
||||||
width: 350px;
|
|
||||||
}
|
|
||||||
.container .setting-row .setting-toggleable button {
|
|
||||||
width: 125px;
|
|
||||||
margin-left: auto;
|
|
||||||
height: 30px;
|
|
||||||
}
|
|
||||||
.container .setting-row:nth-child(even) {
|
|
||||||
background-color: #1c1c1c;
|
|
||||||
}
|
|
||||||
.container .setting-row:nth-child(odd) {
|
|
||||||
background-color: #191919;
|
|
||||||
}
|
|
||||||
|
|
||||||
@keyframes spin {
|
|
||||||
from {
|
|
||||||
transform: rotate(0deg);
|
|
||||||
}
|
|
||||||
to {
|
|
||||||
transform: rotate(-360deg);
|
|
||||||
}
|
|
||||||
}
|
|
|
@ -1,101 +0,0 @@
|
||||||
@use "theme";
|
|
||||||
|
|
||||||
.container {
|
|
||||||
background-color: theme.$header-color;
|
|
||||||
min-height: 10px;
|
|
||||||
padding: 10px 20px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
|
|
||||||
.category-navigation {
|
|
||||||
width: 100%;
|
|
||||||
height: 30px;
|
|
||||||
display: flex;
|
|
||||||
margin-bottom: 15px;
|
|
||||||
|
|
||||||
button {
|
|
||||||
width: 100%;
|
|
||||||
margin-right: 5px;
|
|
||||||
border-radius: 5px;
|
|
||||||
text-decoration: none;
|
|
||||||
display: flex;
|
|
||||||
|
|
||||||
span {
|
|
||||||
margin: auto;
|
|
||||||
color: white;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
button:not(.active) {
|
|
||||||
background-color: #4c515e;
|
|
||||||
}
|
|
||||||
|
|
||||||
button:hover,
|
|
||||||
button:focus {
|
|
||||||
filter: brightness(50%);
|
|
||||||
}
|
|
||||||
|
|
||||||
button:active {
|
|
||||||
// display: none;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.setting-row {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: row;
|
|
||||||
min-height: 30px;
|
|
||||||
padding: 5px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
|
|
||||||
.setting-title {
|
|
||||||
font-size: 18px;
|
|
||||||
margin: auto auto auto 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.setting-toggleable {
|
|
||||||
min-width: 150px;
|
|
||||||
display: flex;
|
|
||||||
margin: auto 0 auto auto;
|
|
||||||
|
|
||||||
.spinner {
|
|
||||||
margin: auto 0 auto auto;
|
|
||||||
animation: spin 1s;
|
|
||||||
animation-timing-function: linear;
|
|
||||||
animation-iteration-count: infinite;
|
|
||||||
}
|
|
||||||
|
|
||||||
input {
|
|
||||||
padding: 0;
|
|
||||||
margin: auto 0 auto auto;
|
|
||||||
height: 25px;
|
|
||||||
width: 100px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
text-align: center;
|
|
||||||
border-radius: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
input[type="text"] {
|
|
||||||
width: 350px;
|
|
||||||
}
|
|
||||||
|
|
||||||
button {
|
|
||||||
width: 125px;
|
|
||||||
margin-left: auto;
|
|
||||||
height: 30px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.setting-row:nth-child(even) {
|
|
||||||
background-color: #1c1c1c;
|
|
||||||
}
|
|
||||||
.setting-row:nth-child(odd) {
|
|
||||||
background-color: #191919;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@keyframes spin {
|
|
||||||
from {
|
|
||||||
transform: rotate(0deg);
|
|
||||||
}
|
|
||||||
to {
|
|
||||||
transform: rotate(-360deg);
|
|
||||||
}
|
|
||||||
}
|
|
|
@ -1,128 +0,0 @@
|
||||||
.blog-admin {
|
|
||||||
width: 100%;
|
|
||||||
background-color: #222;
|
|
||||||
margin-bottom: 20px;
|
|
||||||
padding: 5px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
}
|
|
||||||
.blog-admin .horizontal-button-container a {
|
|
||||||
background-color: #00367b;
|
|
||||||
color: white;
|
|
||||||
text-decoration: none;
|
|
||||||
padding: 5px 10px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
border-radius: 5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.search-area {
|
|
||||||
width: 100%;
|
|
||||||
height: 30px;
|
|
||||||
margin-bottom: 10px;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: row;
|
|
||||||
}
|
|
||||||
.search-area input {
|
|
||||||
width: 50%;
|
|
||||||
background-color: black;
|
|
||||||
border: 0;
|
|
||||||
outline: 0;
|
|
||||||
border-radius: 5px;
|
|
||||||
color: white;
|
|
||||||
height: 100%;
|
|
||||||
text-indent: 5px;
|
|
||||||
margin: 0 10px 0 auto;
|
|
||||||
}
|
|
||||||
.search-area button {
|
|
||||||
height: 100%;
|
|
||||||
min-width: 100px;
|
|
||||||
margin: 0 auto 0 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.blog-entry {
|
|
||||||
width: 100%;
|
|
||||||
display: grid;
|
|
||||||
grid-template-columns: 150px auto;
|
|
||||||
grid-gap: 10px;
|
|
||||||
margin-bottom: 10px;
|
|
||||||
}
|
|
||||||
.blog-entry .thumbnail {
|
|
||||||
width: 150px;
|
|
||||||
height: 150px;
|
|
||||||
}
|
|
||||||
.blog-entry .thumbnail img {
|
|
||||||
height: 100%;
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
.blog-entry .blog-info {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
}
|
|
||||||
.blog-entry .blog-info .blog-title {
|
|
||||||
font-size: 20px;
|
|
||||||
border-bottom: 1px solid #9f9f9f;
|
|
||||||
display: flex;
|
|
||||||
}
|
|
||||||
.blog-entry .blog-info .blog-title a {
|
|
||||||
color: white;
|
|
||||||
text-decoration: none;
|
|
||||||
}
|
|
||||||
.blog-entry .blog-info .blog-title .author {
|
|
||||||
color: #9f9f9f;
|
|
||||||
font-style: italic;
|
|
||||||
margin-left: auto;
|
|
||||||
font-size: 16px;
|
|
||||||
}
|
|
||||||
.blog-entry .blog-info .blog-description {
|
|
||||||
color: #9f9f9f;
|
|
||||||
margin-top: 10px;
|
|
||||||
max-height: 100px;
|
|
||||||
display: -webkit-box;
|
|
||||||
-webkit-line-clamp: 3;
|
|
||||||
-webkit-box-orient: vertical;
|
|
||||||
word-break: none;
|
|
||||||
overflow: hidden;
|
|
||||||
text-align: left;
|
|
||||||
}
|
|
||||||
.blog-entry .blog-info .blog-action {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: row;
|
|
||||||
margin-top: auto;
|
|
||||||
}
|
|
||||||
.blog-entry .blog-info .blog-action .date {
|
|
||||||
font-size: 16px;
|
|
||||||
color: gray;
|
|
||||||
margin-right: auto;
|
|
||||||
}
|
|
||||||
.blog-entry .blog-info .blog-action a {
|
|
||||||
color: white;
|
|
||||||
font-style: italic;
|
|
||||||
}
|
|
||||||
|
|
||||||
.blog-entry:last-of-type {
|
|
||||||
margin-bottom: inherit;
|
|
||||||
}
|
|
||||||
|
|
||||||
@media screen and (max-width: 500px) {
|
|
||||||
.search-area {
|
|
||||||
height: 60px;
|
|
||||||
flex-direction: column;
|
|
||||||
}
|
|
||||||
.search-area input {
|
|
||||||
width: 100%;
|
|
||||||
height: 30px;
|
|
||||||
margin: 0;
|
|
||||||
}
|
|
||||||
.search-area button {
|
|
||||||
height: 30px;
|
|
||||||
width: 100%;
|
|
||||||
margin: 0;
|
|
||||||
}
|
|
||||||
.page .blog-entry {
|
|
||||||
grid-template-columns: 75px auto;
|
|
||||||
margin-bottom: 20px;
|
|
||||||
}
|
|
||||||
.page .blog-entry .thumbnail {
|
|
||||||
width: 75px;
|
|
||||||
height: 75px;
|
|
||||||
}
|
|
||||||
}
|
|
|
@ -1,142 +0,0 @@
|
||||||
$quiet-text: #9f9f9f;
|
|
||||||
|
|
||||||
.blog-admin {
|
|
||||||
width: 100%;
|
|
||||||
background-color: #222;
|
|
||||||
margin-bottom: 20px;
|
|
||||||
padding: 5px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
|
|
||||||
.horizontal-button-container {
|
|
||||||
a {
|
|
||||||
background-color: #00367b;
|
|
||||||
color: white;
|
|
||||||
text-decoration: none;
|
|
||||||
padding: 5px 10px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
border-radius: 5px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.search-area {
|
|
||||||
width: 100%;
|
|
||||||
height: 30px;
|
|
||||||
margin-bottom: 10px;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: row;
|
|
||||||
|
|
||||||
input {
|
|
||||||
width: 50%;
|
|
||||||
background-color: black;
|
|
||||||
border: 0;
|
|
||||||
outline: 0;
|
|
||||||
border-radius: 5px;
|
|
||||||
color: white;
|
|
||||||
height: 100%;
|
|
||||||
text-indent: 5px;
|
|
||||||
margin: 0 10px 0 auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
button {
|
|
||||||
height: 100%;
|
|
||||||
min-width: 100px;
|
|
||||||
margin: 0 auto 0 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.blog-entry {
|
|
||||||
width: 100%;
|
|
||||||
display: grid;
|
|
||||||
grid-template-columns: 150px auto;
|
|
||||||
grid-gap: 10px;
|
|
||||||
margin-bottom: 10px;
|
|
||||||
|
|
||||||
.thumbnail {
|
|
||||||
width: 150px;
|
|
||||||
height: 150px;
|
|
||||||
img {
|
|
||||||
height: 100%;
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.blog-info {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
.blog-title {
|
|
||||||
font-size: 20px;
|
|
||||||
border-bottom: 1px solid $quiet-text;
|
|
||||||
display: flex;
|
|
||||||
a {
|
|
||||||
color: white;
|
|
||||||
text-decoration: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.author {
|
|
||||||
color: $quiet-text;
|
|
||||||
font-style: italic;
|
|
||||||
margin-left: auto;
|
|
||||||
font-size: 16px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.blog-description {
|
|
||||||
color: $quiet-text;
|
|
||||||
margin-top: 10px;
|
|
||||||
max-height: 100px;
|
|
||||||
display: -webkit-box;
|
|
||||||
-webkit-line-clamp: 3;
|
|
||||||
-webkit-box-orient: vertical;
|
|
||||||
word-break: none;
|
|
||||||
overflow: hidden;
|
|
||||||
text-align: left;
|
|
||||||
}
|
|
||||||
|
|
||||||
.blog-action {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: row;
|
|
||||||
margin-top: auto;
|
|
||||||
|
|
||||||
.date {
|
|
||||||
font-size: 16px;
|
|
||||||
color: gray;
|
|
||||||
margin-right: auto;
|
|
||||||
}
|
|
||||||
a {
|
|
||||||
color: white;
|
|
||||||
font-style: italic;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.blog-entry:last-of-type {
|
|
||||||
margin-bottom: inherit;
|
|
||||||
}
|
|
||||||
|
|
||||||
@media screen and (max-width: 500px) {
|
|
||||||
.search-area {
|
|
||||||
height: 60px;
|
|
||||||
flex-direction: column;
|
|
||||||
input {
|
|
||||||
width: 100%;
|
|
||||||
height: 30px;
|
|
||||||
margin: 0;
|
|
||||||
}
|
|
||||||
button {
|
|
||||||
height: 30px;
|
|
||||||
width: 100%;
|
|
||||||
margin: 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.page {
|
|
||||||
.blog-entry {
|
|
||||||
grid-template-columns: 75px auto;
|
|
||||||
margin-bottom: 20px;
|
|
||||||
.thumbnail {
|
|
||||||
width: 75px;
|
|
||||||
height: 75px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
|
@ -1,192 +0,0 @@
|
||||||
.e-header {
|
|
||||||
width: 100%;
|
|
||||||
display: grid;
|
|
||||||
grid-template-columns: 150px auto;
|
|
||||||
background-color: #222;
|
|
||||||
padding: 10px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
grid-gap: 20px;
|
|
||||||
margin-bottom: 10px;
|
|
||||||
}
|
|
||||||
.e-header .e-thumbnail {
|
|
||||||
height: 150px;
|
|
||||||
}
|
|
||||||
.e-header .e-thumbnail img {
|
|
||||||
height: 100%;
|
|
||||||
width: 100%;
|
|
||||||
-o-object-fit: cover;
|
|
||||||
object-fit: cover;
|
|
||||||
}
|
|
||||||
.e-header .e-description {
|
|
||||||
width: 100%;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
}
|
|
||||||
.e-header .e-description input {
|
|
||||||
margin-bottom: 5px;
|
|
||||||
}
|
|
||||||
.e-header .e-description textarea {
|
|
||||||
color: #ccc;
|
|
||||||
font-size: 16px;
|
|
||||||
width: 100%;
|
|
||||||
flex-grow: 1;
|
|
||||||
}
|
|
||||||
|
|
||||||
.e-image-area {
|
|
||||||
background-color: #222;
|
|
||||||
min-height: 200px;
|
|
||||||
display: grid;
|
|
||||||
grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));
|
|
||||||
grid-template-rows: auto auto;
|
|
||||||
grid-gap: 4px;
|
|
||||||
padding: 5px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
width: 100%;
|
|
||||||
margin-bottom: 10px;
|
|
||||||
}
|
|
||||||
.e-image-area .placeholder {
|
|
||||||
margin: auto;
|
|
||||||
grid-row: 1/-1;
|
|
||||||
grid-column: 1/-1;
|
|
||||||
}
|
|
||||||
.e-image-area .image {
|
|
||||||
height: 100px;
|
|
||||||
aspect-ratio: 16/9;
|
|
||||||
margin: auto;
|
|
||||||
display: flex;
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
.e-image-area .image img {
|
|
||||||
max-height: 100%;
|
|
||||||
max-width: 100%;
|
|
||||||
margin: auto;
|
|
||||||
}
|
|
||||||
.e-image-area .image div {
|
|
||||||
position: absolute;
|
|
||||||
right: 0;
|
|
||||||
padding: 5px 10px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
background-color: darkred;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
.e-content {
|
|
||||||
background-color: #222;
|
|
||||||
padding: 5px;
|
|
||||||
margin-bottom: 10px;
|
|
||||||
}
|
|
||||||
.e-content .text-actions {
|
|
||||||
height: 35px;
|
|
||||||
width: 100%;
|
|
||||||
background-color: #424242;
|
|
||||||
border-radius: 2px;
|
|
||||||
display: flex;
|
|
||||||
flex-flow: row wrap;
|
|
||||||
place-content: space-around;
|
|
||||||
}
|
|
||||||
.e-content .text-actions .left,
|
|
||||||
.e-content .text-actions .right {
|
|
||||||
height: 100%;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: row;
|
|
||||||
}
|
|
||||||
.e-content .text-actions .left a,
|
|
||||||
.e-content .text-actions .right a {
|
|
||||||
height: 100%;
|
|
||||||
max-height: 100%;
|
|
||||||
min-width: 50px;
|
|
||||||
display: flex;
|
|
||||||
border-radius: 2px;
|
|
||||||
background-color: #333;
|
|
||||||
box-sizing: border-box;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
.e-content .text-actions .left a span,
|
|
||||||
.e-content .text-actions .right a span {
|
|
||||||
margin: auto;
|
|
||||||
}
|
|
||||||
.e-content .text-actions .left a img,
|
|
||||||
.e-content .text-actions .right a img {
|
|
||||||
margin: auto;
|
|
||||||
height: 100%;
|
|
||||||
padding: 5px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
color: white;
|
|
||||||
}
|
|
||||||
.e-content .text-actions .left {
|
|
||||||
margin: 0 auto 0 0;
|
|
||||||
}
|
|
||||||
.e-content .text-actions .right {
|
|
||||||
margin: 0 0 0 auto;
|
|
||||||
}
|
|
||||||
.e-content .text-actions a:hover,
|
|
||||||
.e-content .text-actions a:focus {
|
|
||||||
filter: brightness(50%);
|
|
||||||
}
|
|
||||||
.e-content textarea {
|
|
||||||
font-size: 16px;
|
|
||||||
min-height: 200px;
|
|
||||||
color: white;
|
|
||||||
outline: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.e-tags {
|
|
||||||
min-height: 40px;
|
|
||||||
width: 100%;
|
|
||||||
background-color: #222;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: row;
|
|
||||||
padding: 5px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
margin-bottom: 1rem;
|
|
||||||
}
|
|
||||||
.e-tags input {
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.e-settings {
|
|
||||||
min-height: 40px;
|
|
||||||
width: 100%;
|
|
||||||
background-color: #222;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: row;
|
|
||||||
padding: 5px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
margin-bottom: 1rem;
|
|
||||||
}
|
|
||||||
.e-settings .publish-date {
|
|
||||||
display: flex;
|
|
||||||
}
|
|
||||||
.e-settings .publish-date div {
|
|
||||||
margin: auto 10px auto auto;
|
|
||||||
}
|
|
||||||
.e-settings .publish-date input {
|
|
||||||
margin-right: 5px;
|
|
||||||
}
|
|
||||||
.e-settings input,
|
|
||||||
.e-settings textarea {
|
|
||||||
width: 200px;
|
|
||||||
}
|
|
||||||
.e-settings .horizontal-buttons {
|
|
||||||
width: 100%;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: row;
|
|
||||||
flex-wrap: wrap;
|
|
||||||
}
|
|
||||||
.e-settings .horizontal-buttons button {
|
|
||||||
width: 200px;
|
|
||||||
height: 40px;
|
|
||||||
}
|
|
||||||
|
|
||||||
input,
|
|
||||||
textarea {
|
|
||||||
width: 100%;
|
|
||||||
padding: 5px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
margin: 0;
|
|
||||||
border: 0;
|
|
||||||
background-color: black;
|
|
||||||
color: white;
|
|
||||||
font-size: 18px;
|
|
||||||
resize: vertical;
|
|
||||||
}
|
|
|
@ -1,211 +0,0 @@
|
||||||
$background-body: #222;
|
|
||||||
|
|
||||||
.e-header {
|
|
||||||
width: 100%;
|
|
||||||
display: grid;
|
|
||||||
grid-template-columns: 150px auto;
|
|
||||||
background-color: $background-body;
|
|
||||||
padding: 10px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
grid-gap: 20px;
|
|
||||||
margin-bottom: 10px;
|
|
||||||
|
|
||||||
.e-thumbnail {
|
|
||||||
height: 150px;
|
|
||||||
|
|
||||||
img {
|
|
||||||
height: 100%;
|
|
||||||
width: 100%;
|
|
||||||
object-fit: cover;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.e-description {
|
|
||||||
width: 100%;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
|
|
||||||
input {
|
|
||||||
margin-bottom: 5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
textarea {
|
|
||||||
color: #ccc;
|
|
||||||
font-size: 16px;
|
|
||||||
width: 100%;
|
|
||||||
flex-grow: 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.e-image-area {
|
|
||||||
background-color: $background-body;
|
|
||||||
min-height: 200px;
|
|
||||||
display: grid;
|
|
||||||
grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));
|
|
||||||
grid-template-rows: auto auto;
|
|
||||||
grid-gap: 4px;
|
|
||||||
padding: 5px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
width: 100%;
|
|
||||||
margin-bottom: 10px;
|
|
||||||
|
|
||||||
.placeholder {
|
|
||||||
margin: auto;
|
|
||||||
grid-row: 1 / -1;
|
|
||||||
grid-column: 1 / -1;
|
|
||||||
}
|
|
||||||
|
|
||||||
.image {
|
|
||||||
height: 100px;
|
|
||||||
aspect-ratio: 16/9;
|
|
||||||
margin: auto;
|
|
||||||
display: flex;
|
|
||||||
position: relative;
|
|
||||||
|
|
||||||
img {
|
|
||||||
max-height: 100%;
|
|
||||||
max-width: 100%;
|
|
||||||
margin: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
div {
|
|
||||||
position: absolute;
|
|
||||||
right: 0;
|
|
||||||
padding: 5px 10px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
background-color: darkred;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.e-content {
|
|
||||||
background-color: $background-body;
|
|
||||||
padding: 5px;
|
|
||||||
margin-bottom: 10px;
|
|
||||||
|
|
||||||
.text-actions {
|
|
||||||
height: 35px;
|
|
||||||
width: 100%;
|
|
||||||
background-color: #424242;
|
|
||||||
border-radius: 2px;
|
|
||||||
display: flex;
|
|
||||||
flex-flow: row wrap;
|
|
||||||
place-content: space-around;
|
|
||||||
|
|
||||||
.left,
|
|
||||||
.right {
|
|
||||||
height: 100%;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: row;
|
|
||||||
|
|
||||||
a {
|
|
||||||
height: 100%;
|
|
||||||
max-height: 100%;
|
|
||||||
min-width: 50px;
|
|
||||||
display: flex;
|
|
||||||
border-radius: 2px;
|
|
||||||
background-color: #333;
|
|
||||||
box-sizing: border-box;
|
|
||||||
cursor: pointer;
|
|
||||||
|
|
||||||
span {
|
|
||||||
margin: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
img {
|
|
||||||
margin: auto;
|
|
||||||
height: 100%;
|
|
||||||
padding: 5px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
color: white;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.left {
|
|
||||||
margin: 0 auto 0 0;
|
|
||||||
}
|
|
||||||
.right {
|
|
||||||
margin: 0 0 0 auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
a:hover,
|
|
||||||
a:focus {
|
|
||||||
filter: brightness(50%);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
textarea {
|
|
||||||
font-size: 16px;
|
|
||||||
min-height: 200px;
|
|
||||||
color: white;
|
|
||||||
outline: 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.e-tags {
|
|
||||||
min-height: 40px;
|
|
||||||
width: 100%;
|
|
||||||
background-color: $background-body;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: row;
|
|
||||||
padding: 5px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
margin-bottom: 1rem;
|
|
||||||
|
|
||||||
input {
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.e-settings {
|
|
||||||
min-height: 40px;
|
|
||||||
width: 100%;
|
|
||||||
background-color: $background-body;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: row;
|
|
||||||
padding: 5px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
margin-bottom: 1rem;
|
|
||||||
.publish-date {
|
|
||||||
display: flex;
|
|
||||||
div {
|
|
||||||
margin: auto 10px auto auto;
|
|
||||||
}
|
|
||||||
input {
|
|
||||||
margin-right: 5px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
input,
|
|
||||||
textarea {
|
|
||||||
width: 200px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.horizontal-buttons {
|
|
||||||
width: 100%;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: row;
|
|
||||||
flex-wrap: wrap;
|
|
||||||
|
|
||||||
button {
|
|
||||||
width: 200px;
|
|
||||||
height: 40px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
input,
|
|
||||||
textarea {
|
|
||||||
width: 100%;
|
|
||||||
padding: 5px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
margin: 0;
|
|
||||||
border: 0;
|
|
||||||
background-color: black;
|
|
||||||
color: white;
|
|
||||||
font-size: 18px;
|
|
||||||
resize: vertical;
|
|
||||||
}
|
|
|
@ -1,68 +0,0 @@
|
||||||
.page .title {
|
|
||||||
background-color: #222;
|
|
||||||
padding: 10px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
font-size: 24px;
|
|
||||||
}
|
|
||||||
.page .image-container {
|
|
||||||
width: 100%;
|
|
||||||
margin-bottom: 4px;
|
|
||||||
}
|
|
||||||
.page .image-container img {
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
.page .video-embed {
|
|
||||||
width: 100%;
|
|
||||||
min-height: 560px;
|
|
||||||
display: flex;
|
|
||||||
}
|
|
||||||
.page .video-embed iframe {
|
|
||||||
width: 100%;
|
|
||||||
height: 560px;
|
|
||||||
margin: auto;
|
|
||||||
}
|
|
||||||
.page .side-by-side {
|
|
||||||
display: flex;
|
|
||||||
flex-flow: row wrap;
|
|
||||||
place-content: space-around;
|
|
||||||
}
|
|
||||||
.page .side-by-side .image-container {
|
|
||||||
padding: 5px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
width: 50%;
|
|
||||||
margin-bottom: 0;
|
|
||||||
}
|
|
||||||
.page .side-by-side .video-embed {
|
|
||||||
width: 50%;
|
|
||||||
min-height: 280px;
|
|
||||||
padding: 5px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
}
|
|
||||||
.page .side-by-side .video-embed iframe {
|
|
||||||
width: 100%;
|
|
||||||
height: 280px;
|
|
||||||
}
|
|
||||||
.page h1 {
|
|
||||||
border-bottom: 1px solid #777;
|
|
||||||
}
|
|
||||||
.page h2 {
|
|
||||||
width: 50%;
|
|
||||||
border-bottom: 1px solid #777;
|
|
||||||
}
|
|
||||||
.page h3 {
|
|
||||||
width: 25%;
|
|
||||||
border-bottom: 1px solid #777;
|
|
||||||
}
|
|
||||||
.page h4 {
|
|
||||||
width: 20%;
|
|
||||||
border-bottom: 1px solid #777;
|
|
||||||
}
|
|
||||||
.page a {
|
|
||||||
color: white;
|
|
||||||
}
|
|
||||||
|
|
||||||
@media screen and (max-width: 500px) {
|
|
||||||
.page .side-by-side .image-container {
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
}
|
|
|
@ -1,86 +0,0 @@
|
||||||
.page {
|
|
||||||
.title {
|
|
||||||
background-color: #222;
|
|
||||||
padding: 10px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
font-size: 24px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.image-container {
|
|
||||||
width: 100%;
|
|
||||||
margin-bottom: 4px;
|
|
||||||
|
|
||||||
img {
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.video-embed {
|
|
||||||
width: 100%;
|
|
||||||
min-height: 560px;
|
|
||||||
display: flex;
|
|
||||||
|
|
||||||
iframe {
|
|
||||||
width: 100%;
|
|
||||||
height: 560px;
|
|
||||||
margin: auto;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.side-by-side {
|
|
||||||
display: flex;
|
|
||||||
flex-flow: row wrap;
|
|
||||||
place-content: space-around;
|
|
||||||
|
|
||||||
.image-container {
|
|
||||||
padding: 5px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
width: 50%;
|
|
||||||
margin-bottom: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.video-embed {
|
|
||||||
width: 50%;
|
|
||||||
min-height: 280px;
|
|
||||||
padding: 5px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
|
|
||||||
iframe {
|
|
||||||
width: 100%;
|
|
||||||
height: 280px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
h1 {
|
|
||||||
border-bottom: 1px solid #777;
|
|
||||||
}
|
|
||||||
|
|
||||||
h2 {
|
|
||||||
width: 50%;
|
|
||||||
border-bottom: 1px solid #777;
|
|
||||||
}
|
|
||||||
h3 {
|
|
||||||
width: 25%;
|
|
||||||
border-bottom: 1px solid #777;
|
|
||||||
}
|
|
||||||
|
|
||||||
h4 {
|
|
||||||
width: 20%;
|
|
||||||
border-bottom: 1px solid #777;
|
|
||||||
}
|
|
||||||
|
|
||||||
a {
|
|
||||||
color: white;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@media screen and (max-width: 500px) {
|
|
||||||
.page {
|
|
||||||
.side-by-side {
|
|
||||||
.image-container {
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
|
@ -1,38 +0,0 @@
|
||||||
.page .page-center {
|
|
||||||
margin-top: 2rem;
|
|
||||||
}
|
|
||||||
.page .page-center .page-modal {
|
|
||||||
width: 400px;
|
|
||||||
height: 200px;
|
|
||||||
background-color: white;
|
|
||||||
margin: auto;
|
|
||||||
padding: 1rem;
|
|
||||||
box-sizing: border-box;
|
|
||||||
}
|
|
||||||
.page .page-center .page-modal .title {
|
|
||||||
font-size: 1.4rem;
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
.page .page-center .page-modal .login-part {
|
|
||||||
width: 100%;
|
|
||||||
margin-bottom: 1rem;
|
|
||||||
}
|
|
||||||
.page .page-center .page-modal .login-part input {
|
|
||||||
width: 100%;
|
|
||||||
padding: 0.25rem;
|
|
||||||
box-sizing: border-box;
|
|
||||||
}
|
|
||||||
.page .page-center .page-modal .action-container {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: row-reverse;
|
|
||||||
}
|
|
||||||
.page .page-center .page-modal .action-container button {
|
|
||||||
width: 100px;
|
|
||||||
padding: 0.25rem;
|
|
||||||
box-sizing: border-box;
|
|
||||||
margin-left: auto;
|
|
||||||
height: 30px;
|
|
||||||
}
|
|
||||||
.page .page-center .page-modal .action-container a {
|
|
||||||
margin: auto auto auto 0;
|
|
||||||
}
|
|
|
@ -1,217 +0,0 @@
|
||||||
body {
|
|
||||||
margin: 0;
|
|
||||||
background-color: #111;
|
|
||||||
color: white;
|
|
||||||
font-family: Verdana, Geneva, Tahoma, sans-serif;
|
|
||||||
}
|
|
||||||
|
|
||||||
.header {
|
|
||||||
background-color: #222;
|
|
||||||
width: 100%;
|
|
||||||
height: 50px;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: row;
|
|
||||||
padding: 0 10px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
margin-bottom: 1rem;
|
|
||||||
}
|
|
||||||
.header .left {
|
|
||||||
margin: auto auto auto 0;
|
|
||||||
font-size: 20px;
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
.header .left a {
|
|
||||||
width: inherit;
|
|
||||||
}
|
|
||||||
.header .right {
|
|
||||||
margin: auto 0 auto auto;
|
|
||||||
height: 100%;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: row;
|
|
||||||
}
|
|
||||||
.header .right a:hover,
|
|
||||||
.header .right a:focus {
|
|
||||||
background-color: #333;
|
|
||||||
}
|
|
||||||
.header a {
|
|
||||||
height: 100%;
|
|
||||||
width: 130px;
|
|
||||||
margin: auto 0;
|
|
||||||
display: flex;
|
|
||||||
text-decoration: none;
|
|
||||||
transition: background-color ease-in-out 0.1s;
|
|
||||||
}
|
|
||||||
.header a div {
|
|
||||||
margin: auto;
|
|
||||||
color: white;
|
|
||||||
}
|
|
||||||
|
|
||||||
button {
|
|
||||||
background-color: #1c478a;
|
|
||||||
border: 0;
|
|
||||||
border-radius: 5px;
|
|
||||||
color: white;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
button:hover,
|
|
||||||
button:focus {
|
|
||||||
background-color: #122d57;
|
|
||||||
}
|
|
||||||
|
|
||||||
button.good,
|
|
||||||
a.good {
|
|
||||||
background-color: #015b01;
|
|
||||||
}
|
|
||||||
|
|
||||||
button.yellow,
|
|
||||||
a.yellow {
|
|
||||||
background-color: #4a4a00;
|
|
||||||
}
|
|
||||||
|
|
||||||
button.bad,
|
|
||||||
a.bad {
|
|
||||||
background-color: #8e0000;
|
|
||||||
}
|
|
||||||
|
|
||||||
.page {
|
|
||||||
width: 1000px;
|
|
||||||
min-height: 10px;
|
|
||||||
margin: 0 auto;
|
|
||||||
}
|
|
||||||
.page .horizontal-button-container {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: row;
|
|
||||||
}
|
|
||||||
.page .horizontal-button-container button,
|
|
||||||
.page .horizontal-button-container a {
|
|
||||||
width: 120px;
|
|
||||||
min-height: 30px;
|
|
||||||
text-decoration: none;
|
|
||||||
display: flex;
|
|
||||||
margin-right: 5px;
|
|
||||||
}
|
|
||||||
.page .horizontal-button-container button span,
|
|
||||||
.page .horizontal-button-container a span {
|
|
||||||
margin: auto;
|
|
||||||
}
|
|
||||||
.page .horizontal-button-container button:last-of-type,
|
|
||||||
.page .horizontal-button-container a:last-of-type {
|
|
||||||
margin-right: 0;
|
|
||||||
}
|
|
||||||
.page .blog-admin {
|
|
||||||
margin-bottom: 10px;
|
|
||||||
}
|
|
||||||
.page .pagination {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: row;
|
|
||||||
width: 100%;
|
|
||||||
margin: 0 auto;
|
|
||||||
}
|
|
||||||
.page .pagination a {
|
|
||||||
height: 40px;
|
|
||||||
width: 150px;
|
|
||||||
margin-right: 5px;
|
|
||||||
display: flex;
|
|
||||||
text-decoration: none;
|
|
||||||
background-color: #222;
|
|
||||||
}
|
|
||||||
.page .pagination a span {
|
|
||||||
margin: auto;
|
|
||||||
color: white;
|
|
||||||
font-size: 20px;
|
|
||||||
}
|
|
||||||
.page .pagination a:last-of-type {
|
|
||||||
margin-right: 0;
|
|
||||||
margin-left: 5px;
|
|
||||||
}
|
|
||||||
.page .pagination a.disabled {
|
|
||||||
filter: brightness(50%);
|
|
||||||
}
|
|
||||||
.page .pagination .page-list {
|
|
||||||
flex-grow: 1;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: row;
|
|
||||||
margin-bottom: 50px;
|
|
||||||
}
|
|
||||||
.page .pagination .page-list a {
|
|
||||||
width: 40px;
|
|
||||||
height: 40px;
|
|
||||||
display: flex;
|
|
||||||
text-decoration: none;
|
|
||||||
background-color: #222;
|
|
||||||
border-radius: 10px;
|
|
||||||
margin: 0 10px 0 0;
|
|
||||||
}
|
|
||||||
.page .pagination .page-list a span {
|
|
||||||
margin: auto;
|
|
||||||
color: white;
|
|
||||||
}
|
|
||||||
.page .pagination .page-list a:first-of-type {
|
|
||||||
margin: auto 10px auto auto;
|
|
||||||
}
|
|
||||||
.page .pagination .page-list a:last-of-type {
|
|
||||||
margin: auto auto auto 0;
|
|
||||||
}
|
|
||||||
.page .pagination .page-list a.active {
|
|
||||||
background-color: #993d00;
|
|
||||||
}
|
|
||||||
|
|
||||||
.hidden {
|
|
||||||
display: none !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
@media screen and (max-width: 1010px) {
|
|
||||||
.page {
|
|
||||||
width: 95%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.center-modal {
|
|
||||||
margin: auto;
|
|
||||||
width: 400px;
|
|
||||||
background-color: #222;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
padding: 0 20px 20px 20px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
border-radius: 5px;
|
|
||||||
}
|
|
||||||
.center-modal .modal-title {
|
|
||||||
text-align: center;
|
|
||||||
font-size: 26px;
|
|
||||||
margin-top: 10px;
|
|
||||||
}
|
|
||||||
.center-modal .input-line {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
margin-bottom: 20px;
|
|
||||||
}
|
|
||||||
.center-modal .input-line div {
|
|
||||||
margin-bottom: 5px;
|
|
||||||
font-size: 18px;
|
|
||||||
}
|
|
||||||
.center-modal .input-line input {
|
|
||||||
background-color: #0d0d0d;
|
|
||||||
border: 0;
|
|
||||||
padding: 5px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
color: white;
|
|
||||||
}
|
|
||||||
.center-modal .horizontal-button-container {
|
|
||||||
flex-direction: row-reverse !important;
|
|
||||||
}
|
|
||||||
.center-modal .horizontal-button-container * {
|
|
||||||
width: 100% !important;
|
|
||||||
}
|
|
||||||
.center-modal .horizontal-button-container a,
|
|
||||||
.center-modal .horizontal-button-container button {
|
|
||||||
color: white;
|
|
||||||
display: flex;
|
|
||||||
width: -moz-min-content;
|
|
||||||
width: min-content;
|
|
||||||
}
|
|
||||||
.center-modal .horizontal-button-container a span,
|
|
||||||
.center-modal .horizontal-button-container button span {
|
|
||||||
margin: auto;
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
|
@ -1,57 +0,0 @@
|
||||||
@use "theme";
|
|
||||||
|
|
||||||
.center-modal {
|
|
||||||
margin: auto;
|
|
||||||
width: 400px;
|
|
||||||
background-color: theme.$header-color;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
padding: 0 20px 20px 20px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
border-radius: 5px;
|
|
||||||
|
|
||||||
.modal-title {
|
|
||||||
text-align: center;
|
|
||||||
font-size: 26px;
|
|
||||||
margin-top: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.input-line {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
margin-bottom: 20px;
|
|
||||||
|
|
||||||
div {
|
|
||||||
margin-bottom: 5px;
|
|
||||||
font-size: 18px;
|
|
||||||
}
|
|
||||||
|
|
||||||
input {
|
|
||||||
background-color: #0d0d0d;
|
|
||||||
border: 0;
|
|
||||||
padding: 5px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
color: white;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.horizontal-button-container {
|
|
||||||
flex-direction: row-reverse !important;
|
|
||||||
|
|
||||||
* {
|
|
||||||
width: 100% !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
a,
|
|
||||||
button {
|
|
||||||
color: white;
|
|
||||||
display: flex;
|
|
||||||
width: min-content;
|
|
||||||
|
|
||||||
span {
|
|
||||||
margin: auto;
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
|
@ -1,168 +0,0 @@
|
||||||
body {
|
|
||||||
margin: 0;
|
|
||||||
background-color: #111;
|
|
||||||
color: white;
|
|
||||||
font-family: Verdana, Geneva, Tahoma, sans-serif;
|
|
||||||
}
|
|
||||||
|
|
||||||
.header {
|
|
||||||
background-color: #222;
|
|
||||||
width: 100%;
|
|
||||||
height: 50px;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: row;
|
|
||||||
padding: 0 10px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
margin-bottom: 1rem;
|
|
||||||
}
|
|
||||||
.header .left {
|
|
||||||
margin: auto auto auto 0;
|
|
||||||
font-size: 20px;
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
.header .left a {
|
|
||||||
width: inherit;
|
|
||||||
}
|
|
||||||
.header .right {
|
|
||||||
margin: auto 0 auto auto;
|
|
||||||
height: 100%;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: row;
|
|
||||||
}
|
|
||||||
.header .right a:hover,
|
|
||||||
.header .right a:focus {
|
|
||||||
background-color: #333;
|
|
||||||
}
|
|
||||||
.header a {
|
|
||||||
height: 100%;
|
|
||||||
width: 130px;
|
|
||||||
margin: auto 0;
|
|
||||||
display: flex;
|
|
||||||
text-decoration: none;
|
|
||||||
transition: background-color ease-in-out 0.1s;
|
|
||||||
}
|
|
||||||
.header a div {
|
|
||||||
margin: auto;
|
|
||||||
color: white;
|
|
||||||
}
|
|
||||||
|
|
||||||
button {
|
|
||||||
background-color: #1c478a;
|
|
||||||
border: 0;
|
|
||||||
border-radius: 5px;
|
|
||||||
color: white;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
button:hover,
|
|
||||||
button:focus {
|
|
||||||
background-color: #122d57;
|
|
||||||
}
|
|
||||||
|
|
||||||
button.good,
|
|
||||||
a.good {
|
|
||||||
background-color: #015b01;
|
|
||||||
}
|
|
||||||
|
|
||||||
button.yellow,
|
|
||||||
a.yellow {
|
|
||||||
background-color: #4a4a00;
|
|
||||||
}
|
|
||||||
|
|
||||||
button.bad,
|
|
||||||
a.bad {
|
|
||||||
background-color: #8e0000;
|
|
||||||
}
|
|
||||||
|
|
||||||
.page {
|
|
||||||
width: 1000px;
|
|
||||||
min-height: 10px;
|
|
||||||
margin: 0 auto;
|
|
||||||
}
|
|
||||||
.page .horizontal-button-container {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: row;
|
|
||||||
}
|
|
||||||
.page .horizontal-button-container button,
|
|
||||||
.page .horizontal-button-container a {
|
|
||||||
width: 120px;
|
|
||||||
min-height: 30px;
|
|
||||||
text-decoration: none;
|
|
||||||
display: flex;
|
|
||||||
margin-right: 5px;
|
|
||||||
}
|
|
||||||
.page .horizontal-button-container button span,
|
|
||||||
.page .horizontal-button-container a span {
|
|
||||||
margin: auto;
|
|
||||||
}
|
|
||||||
.page .horizontal-button-container button:last-of-type,
|
|
||||||
.page .horizontal-button-container a:last-of-type {
|
|
||||||
margin-right: 0;
|
|
||||||
}
|
|
||||||
.page .blog-admin {
|
|
||||||
margin-bottom: 10px;
|
|
||||||
}
|
|
||||||
.page .pagination {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: row;
|
|
||||||
width: 100%;
|
|
||||||
margin: 0 auto;
|
|
||||||
}
|
|
||||||
.page .pagination a {
|
|
||||||
height: 40px;
|
|
||||||
width: 150px;
|
|
||||||
margin-right: 5px;
|
|
||||||
display: flex;
|
|
||||||
text-decoration: none;
|
|
||||||
background-color: #222;
|
|
||||||
}
|
|
||||||
.page .pagination a span {
|
|
||||||
margin: auto;
|
|
||||||
color: white;
|
|
||||||
font-size: 20px;
|
|
||||||
}
|
|
||||||
.page .pagination a:last-of-type {
|
|
||||||
margin-right: 0;
|
|
||||||
margin-left: 5px;
|
|
||||||
}
|
|
||||||
.page .pagination a.disabled {
|
|
||||||
filter: brightness(50%);
|
|
||||||
}
|
|
||||||
.page .pagination .page-list {
|
|
||||||
flex-grow: 1;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: row;
|
|
||||||
margin-bottom: 50px;
|
|
||||||
}
|
|
||||||
.page .pagination .page-list a {
|
|
||||||
width: 40px;
|
|
||||||
height: 40px;
|
|
||||||
display: flex;
|
|
||||||
text-decoration: none;
|
|
||||||
background-color: #222;
|
|
||||||
border-radius: 10px;
|
|
||||||
margin: 0 10px 0 0;
|
|
||||||
}
|
|
||||||
.page .pagination .page-list a span {
|
|
||||||
margin: auto;
|
|
||||||
color: white;
|
|
||||||
}
|
|
||||||
.page .pagination .page-list a:first-of-type {
|
|
||||||
margin: auto 10px auto auto;
|
|
||||||
}
|
|
||||||
.page .pagination .page-list a:last-of-type {
|
|
||||||
margin: auto auto auto 0;
|
|
||||||
}
|
|
||||||
.page .pagination .page-list a.active {
|
|
||||||
background-color: #993d00;
|
|
||||||
}
|
|
||||||
|
|
||||||
.hidden {
|
|
||||||
display: none !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
@media screen and (max-width: 1010px) {
|
|
||||||
.page {
|
|
||||||
width: 95%;
|
|
||||||
}
|
|
||||||
}
|
|
|
@ -1,186 +0,0 @@
|
||||||
$header-color: #222;
|
|
||||||
$button-generic: #1c478a;
|
|
||||||
|
|
||||||
body {
|
|
||||||
margin: 0;
|
|
||||||
background-color: #111;
|
|
||||||
color: white;
|
|
||||||
font-family: Verdana, Geneva, Tahoma, sans-serif;
|
|
||||||
}
|
|
||||||
|
|
||||||
.header {
|
|
||||||
background-color: $header-color;
|
|
||||||
width: 100%;
|
|
||||||
height: 50px;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: row;
|
|
||||||
padding: 0 10px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
margin-bottom: 1rem;
|
|
||||||
|
|
||||||
.left {
|
|
||||||
margin: auto auto auto 0;
|
|
||||||
font-size: 20px;
|
|
||||||
height: 100%;
|
|
||||||
|
|
||||||
a {
|
|
||||||
width: inherit;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.right {
|
|
||||||
margin: auto 0 auto auto;
|
|
||||||
height: 100%;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: row;
|
|
||||||
|
|
||||||
a:hover,
|
|
||||||
a:focus {
|
|
||||||
background-color: #333;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
a {
|
|
||||||
height: 100%;
|
|
||||||
width: 130px;
|
|
||||||
margin: auto 0;
|
|
||||||
display: flex;
|
|
||||||
text-decoration: none;
|
|
||||||
transition: background-color ease-in-out 0.1s;
|
|
||||||
|
|
||||||
div {
|
|
||||||
margin: auto;
|
|
||||||
color: white;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
button {
|
|
||||||
background-color: $button-generic;
|
|
||||||
border: 0;
|
|
||||||
border-radius: 5px;
|
|
||||||
color: white;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
button:hover,
|
|
||||||
button:focus {
|
|
||||||
background-color: #122d57;
|
|
||||||
}
|
|
||||||
|
|
||||||
button.good,
|
|
||||||
a.good {
|
|
||||||
background-color: #015b01;
|
|
||||||
}
|
|
||||||
button.yellow,
|
|
||||||
a.yellow {
|
|
||||||
background-color: #4a4a00;
|
|
||||||
}
|
|
||||||
button.bad,
|
|
||||||
a.bad {
|
|
||||||
background-color: #8e0000;
|
|
||||||
}
|
|
||||||
|
|
||||||
.page {
|
|
||||||
width: 1000px;
|
|
||||||
min-height: 10px;
|
|
||||||
margin: 0 auto;
|
|
||||||
|
|
||||||
.horizontal-button-container {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: row;
|
|
||||||
|
|
||||||
button,
|
|
||||||
a {
|
|
||||||
width: 120px;
|
|
||||||
min-height: 30px;
|
|
||||||
text-decoration: none;
|
|
||||||
// background-color: #222;
|
|
||||||
display: flex;
|
|
||||||
margin-right: 5px;
|
|
||||||
|
|
||||||
span {
|
|
||||||
margin: auto;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
button:last-of-type,
|
|
||||||
a:last-of-type {
|
|
||||||
margin-right: 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.blog-admin {
|
|
||||||
margin-bottom: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.pagination {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: row;
|
|
||||||
width: 100%;
|
|
||||||
margin: 0 auto;
|
|
||||||
|
|
||||||
a {
|
|
||||||
height: 40px;
|
|
||||||
width: 150px;
|
|
||||||
margin-right: 5px;
|
|
||||||
display: flex;
|
|
||||||
text-decoration: none;
|
|
||||||
background-color: #222;
|
|
||||||
|
|
||||||
span {
|
|
||||||
margin: auto;
|
|
||||||
color: white;
|
|
||||||
font-size: 20px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
a:last-of-type {
|
|
||||||
margin-right: 0;
|
|
||||||
margin-left: 5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
a.disabled {
|
|
||||||
filter: brightness(50%);
|
|
||||||
}
|
|
||||||
|
|
||||||
.page-list {
|
|
||||||
flex-grow: 1;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: row;
|
|
||||||
margin-bottom: 50px;
|
|
||||||
|
|
||||||
a {
|
|
||||||
width: 40px;
|
|
||||||
height: 40px;
|
|
||||||
display: flex;
|
|
||||||
text-decoration: none;
|
|
||||||
background-color: #222;
|
|
||||||
border-radius: 10px;
|
|
||||||
margin: 0 10px 0 0;
|
|
||||||
|
|
||||||
span {
|
|
||||||
margin: auto;
|
|
||||||
color: white;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
a:first-of-type {
|
|
||||||
margin: auto 10px auto auto;
|
|
||||||
}
|
|
||||||
a:last-of-type {
|
|
||||||
margin: auto auto auto 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
a.active {
|
|
||||||
background-color: #993d00;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.hidden {
|
|
||||||
display: none !important;
|
|
||||||
}
|
|
||||||
@media screen and (max-width: 1010px) {
|
|
||||||
.page {
|
|
||||||
width: 95%;
|
|
||||||
}
|
|
||||||
}
|
|
|
@ -1,17 +0,0 @@
|
||||||
async function requestLogin() {
|
|
||||||
const account_information = {
|
|
||||||
username: qs("#username").value,
|
|
||||||
password: qs("#password").value,
|
|
||||||
};
|
|
||||||
|
|
||||||
const account_response = await request("/login", "POST", account_information);
|
|
||||||
|
|
||||||
// Check response for errors
|
|
||||||
|
|
||||||
// If success, return to account
|
|
||||||
console.log(account_response);
|
|
||||||
|
|
||||||
if (account_response.body.success) {
|
|
||||||
location.href = "/";
|
|
||||||
}
|
|
||||||
}
|
|
|
@ -1,17 +0,0 @@
|
||||||
async function requestRegister() {
|
|
||||||
const account_information = {
|
|
||||||
username: qs("#username").value,
|
|
||||||
password: qs("#password").value,
|
|
||||||
};
|
|
||||||
|
|
||||||
const account_response = await request("/register", "POST", account_information);
|
|
||||||
|
|
||||||
// Check response for errors
|
|
||||||
|
|
||||||
// If success, return to account
|
|
||||||
console.log(account_response);
|
|
||||||
|
|
||||||
if (account_response.body.success) {
|
|
||||||
location.href = "/login";
|
|
||||||
}
|
|
||||||
}
|
|
|
@ -1,36 +0,0 @@
|
||||||
<!DOCTYPE html>
|
|
||||||
<html lang="en">
|
|
||||||
<head>
|
|
||||||
<meta charset="UTF-8" />
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
||||||
<link rel="stylesheet" type="text/css" href="/css/signin.css" />
|
|
||||||
<link rel="stylesheet" type="text/css" href="/css/theme.css" />
|
|
||||||
<script src="/js/generic.js"></script>
|
|
||||||
<title><%= website_name %> | Login</title>
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<%- include("partials/header.ejs", {selected: 'home'}) %>
|
|
||||||
|
|
||||||
<div class="page">
|
|
||||||
<div class="center-modal">
|
|
||||||
<div class="modal-title">Login</div>
|
|
||||||
<div class="input-line">
|
|
||||||
<div>Username</div>
|
|
||||||
<input id="username" type="text" />
|
|
||||||
</div>
|
|
||||||
<div class="input-line">
|
|
||||||
<div>Password</div>
|
|
||||||
<input id="password" type="password" />
|
|
||||||
</div>
|
|
||||||
<div class="horizontal-button-container">
|
|
||||||
<button onclick="requestLogin()"><span>Login</span></button>
|
|
||||||
<a href="/register"><span>Register</span></a>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<%- include("partials/footer.ejs") %>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
<script src="/js/generic.js"></script>
|
|
||||||
<script defer src="/js/login.js"></script>
|
|
|
@ -1,36 +0,0 @@
|
||||||
<!DOCTYPE html>
|
|
||||||
<html lang="en">
|
|
||||||
<head>
|
|
||||||
<meta charset="UTF-8" />
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
||||||
<link rel="stylesheet" type="text/css" href="/css/signin.css" />
|
|
||||||
<link rel="stylesheet" type="text/css" href="/css/theme.css" />
|
|
||||||
<script src="/js/generic.js"></script>
|
|
||||||
<title><%= website_name %> | Register</title>
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<%- include("partials/header.ejs", {selected: 'home'}) %>
|
|
||||||
|
|
||||||
<div class="page">
|
|
||||||
<div class="center-modal">
|
|
||||||
<div class="modal-title">Register</div>
|
|
||||||
<div class="input-line">
|
|
||||||
<div>Username</div>
|
|
||||||
<input id="username" type="text" />
|
|
||||||
</div>
|
|
||||||
<div class="input-line">
|
|
||||||
<div>Password</div>
|
|
||||||
<input id="password" type="password" />
|
|
||||||
</div>
|
|
||||||
<div class="horizontal-button-container">
|
|
||||||
<button onclick="requestRegister()"><span>Register</span></button>
|
|
||||||
<a href="/login"><span>Login</span></a>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<%- include("partials/footer.ejs") %>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
|
|
||||||
<script defer src="/js/register.js"></script>
|
|
|
@ -0,0 +1,34 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<link rel="stylesheet" type="text/css" href="/css/login.css" />
|
||||||
|
<link rel="stylesheet" type="text/css" href="/css/generic.css" />
|
||||||
|
<script src="/js/generic.js"></script>
|
||||||
|
<title>Yet-Another-Blog</title>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<%- include("partials/header.ejs") %>
|
||||||
|
<div class="page">
|
||||||
|
<div class="page-center">
|
||||||
|
<div class="page-modal">
|
||||||
|
<div class="title">Register</div>
|
||||||
|
<div class="login-part">
|
||||||
|
<div class="name">Username:</div>
|
||||||
|
<input id="username" type="text" />
|
||||||
|
</div>
|
||||||
|
<div class="login-part">
|
||||||
|
<div class="name">Password:</div>
|
||||||
|
<input id="password" type="password" />
|
||||||
|
</div>
|
||||||
|
<div class="action-container">
|
||||||
|
<button onclick="requestRegister()" class="button"><span>Register</span></button>
|
||||||
|
<a href="/login">Login</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<%- include("partials/footer.ejs") %>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
<script defer src="/js/login.js"></script>
|
|
@ -15,3 +15,21 @@ async function requestLogin() {
|
||||||
location.href = "/";
|
location.href = "/";
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
async function requestRegister() {
|
||||||
|
const account_information = {
|
||||||
|
username: qs("#username").value,
|
||||||
|
password: qs("#password").value,
|
||||||
|
};
|
||||||
|
|
||||||
|
const account_response = await request("/register", "POST", account_information);
|
||||||
|
|
||||||
|
// Check response for errors
|
||||||
|
|
||||||
|
// If success, return to account
|
||||||
|
console.log(account_response);
|
||||||
|
|
||||||
|
if (account_response.body.success) {
|
||||||
|
location.href = "/login";
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
Loading…
Reference in New Issue