5 files changed, 36 insertions, 1 deletions
diff --git a/static/css/form.css b/static/css/form.css
index 1378d75..a5dc358 100644
--- a/static/css/form.css
+++ b/static/css/form.css
@@ -28,3 +28,12 @@ input[type="submit"] {
   border: 0;
   cursor: pointer;
 }
+
+textarea {
+  display: block;
+  width: 100%;
+  padding: 0.5em;
+  margin: 0 0 1em;
+  border: 1px solid var(--border-color);
+  background: var(--container-bg);
+}
diff --git a/static/css/guestbook.css b/static/css/guestbook.css
new file mode 100644
index 0000000..0fb7a16
--- /dev/null
+++ b/static/css/guestbook.css
@@ -0,0 +1,15 @@
+.entry {
+  margin-bottom: 10px;
+  border: 1px solid var(--border-color);
+
+  padding: 10px;
+}
+
+.entry-name {
+  font-weight: bold;
+}
+
+.entry-message {
+  margin-left: 20px;
+  white-space: pre-wrap;
+}
diff --git a/static/css/styles.css b/static/css/styles.css
index b3babe7..7486016 100644
--- a/static/css/styles.css
+++ b/static/css/styles.css
@@ -2,6 +2,7 @@
 @import "/static/css/blinky.css";
 @import "/static/css/table.css";
 @import "/static/css/form.css";
+@import "/static/css/guestbook.css";
 
 @font-face {
   font-family: "ComicSans";
diff --git a/static/js/components/formatDate.js b/static/js/components/formatDate.js
new file mode 100644
index 0000000..a12f04f
--- /dev/null
+++ b/static/js/components/formatDate.js
@@ -0,0 +1,7 @@
+const timeElements = document.querySelectorAll(".time");
+timeElements.forEach((timeElement) => {
+  const dateStr = timeElement.textContent.split(" ").slice(0, 3).join(" ");
+  const date = new Date(dateStr);
+
+  timeElement.textContent = date.toLocaleString();
+});
diff --git a/static/js/script.js b/static/js/script.js
index 459383e..56233e3 100644
--- a/static/js/script.js
+++ b/static/js/script.js
@@ -1,2 +1,5 @@
-const scripts = ["/static/js/components/themeSwitcher.js"];
+const scripts = [
+  "/static/js/components/themeSwitcher.js",
+  "/static/js/components/formatDate.js",
+];
 requirejs(scripts);