Style things a little

This commit is contained in:
2026-07-20 11:48:27 +10:00
parent e1751a3ece
commit c3e39d5714
7 changed files with 95 additions and 27 deletions

View File

@@ -2,3 +2,4 @@
bin2cpp --file=client/footer.html --output=server/src/generated
bin2cpp --file=client/header.html --output=server/src/generated
bin2cpp --file=client/style.css --output=server/src/generated

View File

@@ -1,2 +1,3 @@
</div>
</body>
</html>

View File

@@ -2,27 +2,34 @@
<html>
<head>
<title>posts</title>
<link rel="stylesheet" type="text/css" href="/style.css">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
<form action="/make_post" method="post">
<div>
<label for="username">Username:</label>
<input name="username" id="username" />
</div>
<br>
<div>
<label for="password">Password:</label>
<input type="password" name="password" id="password" />
</div>
<br>
<div>
<label for="post">Post contents:</label>
<div class="postbox">
<form action="/make_post" method="post">
<div>
<label for="username">Username:</label>
<input name="username" id="username" />
</div>
<br>
<textarea name="post" id="post"></textarea>
<div>
<label for="password">Password:</label>
<input type="password" name="password" id="password" />
</div>
<br>
<div>
<label for="post">Post contents:</label>
<br>
<textarea name="post" id="post" rows="10"></textarea>
</div>
<br>
<div>
<button>Post</button>
</div>
</form>
</div>
<div id="posts">
<div id="posts-header">
<h1>posts</h1>
</div>
<br>
<div>
<button>Post</button>
</div>
</form>
<h1>posts</h1>

56
client/style.css Normal file
View File

@@ -0,0 +1,56 @@
@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:ital@0;1&display=swap');
body {
font-family: "JetBrains Mono", monospace;
font-size: 12pt;
color: lime;
background-color: black;
line-height: 1.1;
}
hr {
border: none;
height: 2px;
background-color: lime;
}
button, input, textarea {
appearance: none;
font-family: "JetBrains Mono", monospace;
font-size: 12pt;
color: lime;
background-color: black;
border: 1px solid lime;
}
textarea {
width: 100%;
box-sizing: border-box;
}
.postbox, #posts {
max-width: 700px;
margin: 0 auto;
}
img {
max-height: 200px;
max-width: 100%;
height: auto;
width: auto;
}
.postinfo {
background-color: #313131;
}
.postbox, #posts {
padding: 0 16px;
box-sizing: border-box;
}
@media (max-width: 600px) {
input, textarea, button {
font-size: 16px;
}
}

View File

@@ -6,6 +6,7 @@ sources = [
'src/db.cpp',
'src/generated/header.cpp',
'src/generated/footer.cpp',
'src/generated/style.cpp',
# bcrypt
'src/bcrypt/bcrypt.cpp',

View File

@@ -1,10 +1,8 @@
#include <exception>
#include <iostream>
#include <mutex>
#include <sstream>
#include <stdexcept>
#include <string>
#include <unordered_map>
#include <vector>
#include "httplib/httplib.h"
@@ -15,16 +13,16 @@
#include "generated/header.h"
#include "generated/footer.h"
#include "generated/style.h"
int main() {
const bin2cpp::File& headerfile = bin2cpp::getHeaderHtmlFile();
const bin2cpp::File& footerfile = bin2cpp::getFooterHtmlFile();
const bin2cpp::File& stylefile = bin2cpp::getStyleCssFile();
std::string header{headerfile.getBuffer(), headerfile.getSize()};
std::string footer{footerfile.getBuffer(), footerfile.getSize()};
//std::vector<Post> posts = {};
//std::unordered_map<std::string, std::string> users = {};
std::string style{stylefile.getBuffer(), stylefile.getSize()};
Database database{"chookchat.db"};
@@ -32,6 +30,10 @@ int main() {
httplib::Server svr;
svr.Get("/style.css", [&style](const httplib::Request& request, httplib::Response& response) {
response.set_content(style, "text/css");
});
svr.Get("/", [&header, &footer, &database, &data_mutex](const httplib::Request& request, httplib::Response& response) {
std::cout << "requested /" << std::endl;

View File

@@ -29,11 +29,11 @@ std::string Post::genHtml() const {
ts = *localtime(&time);
strftime(buf, sizeof(buf), "%a %Y-%m-%d %H:%M:%S %Z", &ts);
ss << "<p><i>" << user << "</i> posted this at " << buf << "</p>\n";
ss << "<p class='postinfo'><i>" << user << "</i> posted this at " << buf << "</p>\n";
ss << content;
ss << "<p>" << likes << " likes</p>";
ss << "<p class='postinfo'>" << likes << " likes</p>";
return ss.str();