posts fetched from server

3 files changed, 42 insertions, 6 deletions

diff --git a/styles/layout.css b/styles/layout.css
index f648634..c4c3694 100644
--- a/styles/layout.css
+++ b/styles/layout.css
@@ -30,7 +30,7 @@
 	position: sticky;
 	top: var(--page-margins);
 	bottom: var(--page-margins);
-	height: calc(100vh - 2 * var(--page-margins));
+	max-height: calc(100vh - 2 * var(--page-margins));
 
 	overflow-y: scroll;
 
diff --git a/styles/search.css b/styles/search.css
index 5a63500..af6d3a4 100644
--- a/styles/search.css
+++ b/styles/search.css
@@ -2,6 +2,7 @@
 	background-color: var(--heliotrope-gray);
 	border-radius: 8px;
 	padding: 12px;
+	margin-bottom: 24px;
 }
 
 .searchBar .input {
@@ -36,3 +37,36 @@
 	color: var(--heliotrope-gray) !important;
 }
 
+.searchResults .post::after {
+	display: none;
+}
+
+.searchResults .post {
+	display: block;
+	border-radius: 8px;
+
+	padding: 8px;
+	margin-bottom: 12px;
+	background-color: var(--oxford-blue);
+
+	color: var(--fg);
+}
+
+.searchResults .post .title,
+.searchResults .post .subtitle,
+.searchResults .post .authordate {
+	margin: 4px 0;
+}
+
+.searchResults .post .authordate {
+	font-style: italic;
+	opacity: .75;
+}
+
+@media (prefers-color-scheme: light) {
+	.searchBar { background-color: var(--fg); }
+	.searchBar .button { color: var(--fg) !important; }
+
+	.searchResults .post { background-color: var(--heliotrope-gray); }
+}
+
diff --git a/styles/tags.css b/styles/tags.css
index 95ce012..5e6af11 100644
--- a/styles/tags.css
+++ b/styles/tags.css
@@ -1,8 +1,8 @@
-.titleWrapper .tags {
+.tags {
 	margin-top: 12px;
 }
 
-.titleWrapper .tags .tag {
+.tags .tag {
 	--tag-color: hsl(var(--tag-hue), 75%, 70%);
 
 	padding: 4px 12px;
@@ -18,12 +18,14 @@
 }
 
 @media (prefers-color-scheme: light) {
-	.titleWrapper .tags .tag {
+	.tags .tag {
 		--tag-color: hsl(var(--tag-hue), 50%, 40%);
 	}
 }
 
-.titleWrapper .tags .tag::before {
+.tags .tag::after { display: none; }
+
+.tags .tag::before {
 	content: '';
 	position: absolute;
 	top: 0;
@@ -37,4 +39,4 @@
 	opacity: .25;
 }
 
-.titleWrapper .tags > * { margin-right: 6px; }
+.tags > * { margin-right: 6px; }