From 3f626c8ee89e5533b81ecfe5971a98728fb050f4 Mon Sep 17 00:00:00 2001
From: tobi <31960611+tsmethurst@users.noreply.github.com>
Date: Thu, 11 Aug 2022 19:11:19 +0200
Subject: [PATCH] [frontend] Status styling tweaks (#751)

* style hr

* start work on code styling in statuses

* pad top + bottom of content

* squircle code

* pad less actually

* get code blocks formatted nicely phew

* fix some silliness (thanks f0x)

* update code block styling

Co-authored-by: f0x <f0x@cthu.lu>
---
 web/source/css/status.css | 32 ++++++++++++++++++++++++++++++++
 1 file changed, 32 insertions(+)

diff --git a/web/source/css/status.css b/web/source/css/status.css
index c1aff7ac8..a25f02f6c 100644
--- a/web/source/css/status.css
+++ b/web/source/css/status.css
@@ -119,6 +119,7 @@ main {
 		margin: 0;
 		margin-top: 0.5rem;
 		grid-column: span 2;
+		overflow: hidden;
 
 		position: relative;
 		z-index: 2;
@@ -129,6 +130,9 @@ main {
 		}
 
 		.content {
+			padding-top: 0.5rem;
+			padding-bottom: 0.5rem;
+
 			word-break: break-word;
 
 			blockquote {
@@ -137,6 +141,34 @@ main {
 				margin-left: 1rem;
 				font-style: italic;
 			}
+
+			hr {
+				border: 1px dashed $sloth_orange1;
+			} 
+
+			pre, code {
+				background-color: $sloth_gray2_darker7;
+			}
+
+			code {
+				padding: 0.25rem;
+				border-radius: $br_inner;
+			}
+
+			pre {
+				display: flex;
+				border-radius: $br;
+				padding: 0.5rem;
+
+				code {	
+					padding: 0.5rem;
+					white-space: pre;
+					border-radius: 0;
+					overflow-x: auto;
+					-webkit-overflow-scrolling: touch;
+					scrollbar-color: $sloth_orange1 $sloth_gray2_darker3;
+				}
+			}
 		}
 	}