Styling forms

FAC29A · Jan 24, 2024 · bb13c66 · bb13c66
1 parent 936e52d
commit bb13c66
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 5 deletions.
diff --git a/public/styles.css b/public/styles.css
@@ -21,7 +21,6 @@ main {
 body {
 	margin: 1rem;
 	padding: 1rem;
-	background-color: var(--primary-light);
 	font-family: var(--font-main);
 }
 
@@ -38,6 +37,10 @@ p {
 	max-width: 100%;
 }
 
+.message {
+	justify-content: flex-start;
+}
+
 button {
 	padding: 0.2rem;
 	box-shadow: 1px 1px 1px var(--secondary-dark);
@@ -62,7 +65,9 @@ form {
 	display: flex;
 	flex-direction: column;
 	flex-wrap: wrap;
-	border: 0.3rem solid var(--neutral);
+	background-color: var(--primary-light);
+	border: 0.2rem solid var(--neutral);
+	border-style: dashed;
 	border-radius: 2px;
 	padding: 1rem;
 	width: auto;
@@ -88,7 +93,8 @@ ul {
 }
 
 li {
-	border: 0.3rem solid var(--neutral);
+	border: 0.2rem solid var(--neutral);
+	background-color: var(--primary-light);
 	margin-bottom: 1rem;
 	padding: 1rem;
 	border-radius: 2px;

diff --git a/views/postsPage.ejs b/views/postsPage.ejs
@@ -7,12 +7,12 @@
 			<% posts.forEach((post) => { const date = new Date(post.created); const
 			prettyDate = date.toLocaleString('en-GB'); %>
 			<li>
-				<p><%- sanitize(post.message) %></p>
+				<p class="message"><%- sanitize(post.message) %></p>
 				<p class="nameAndDate">
 					<%- sanitize(post.nickname) %> | <%= prettyDate %>
 				</p>
 				<form class="buttonForm" action="/delete/<%= post.id %>" method="POST">
-					<button type="submit" class="right-button">Delete post</button>
+					<button type="submit" class="right-button">Delete</button>
 				</form>
 			</li>
 			<% }); %>