Add horizontal padding to date/unread marker

1 files changed, 26 insertions, 16 deletions

diff --git a/theme.css b/theme.css
index a6333ef..fafcff2 100644
--- a/theme.css
+++ b/theme.css
@@ -494,22 +494,6 @@ textarea.input {
     color: var(--color--header--fg);
 }
 
-#chat .date-marker::before {
-    border-color: var(--color--date-marker--border);
-}
-
-#chat .date-marker,
-#chat .unread-marker {
-    margin: calc(var(--dim--spacing) * 1.5) 0;
-}
-
-#chat .date-marker-container + .date-marker-container .date-marker,
-#chat .date-marker-container + .unread-marker,
-#chat .unread-marker + .unread-marker,
-#chat .unread-marker + .date-marker-container .date-marker {
-    margin-top: 0;
-}
-
 @media (max-width: 768px) {
     .header .topic {
         font-size: 14px;
@@ -564,6 +548,32 @@ textarea.input {
     }
 }
 
+/* DATE/UNREAD MARKER */
+
+#chat .date-marker::before {
+    border-color: var(--color--date-marker--border);
+}
+
+#chat .date-marker,
+#chat .unread-marker {
+    margin: calc(var(--dim--spacing) * 1.5) var(--dim--container-lg--pad);
+}
+
+#chat .date-marker-container + .date-marker-container .date-marker,
+#chat .date-marker-container + .unread-marker,
+#chat .unread-marker + .unread-marker,
+#chat .unread-marker + .date-marker-container .date-marker {
+    margin-top: 0;
+}
+
+@media (max-width: 479px) {
+    #chat .date-marker,
+    #chat .unread-marker {
+        margin-right: var(--dim--container--pad);
+        margin-left:  var(--dim--container--pad);
+    }
+}
+
 /* MESSAGE */
 
 .irc-bold {