From 10baf36bda9480e6d93be38020a520ca686a4ede Mon Sep 17 00:00:00 2001
From: Gabe Kangas <gabek@real-ity.com>
Date: Sun, 29 Jan 2023 17:34:01 -0800
Subject: [PATCH] Tweak offline banner style for narrow screens

---
 web/components/ui/OfflineBanner/OfflineBanner.module.scss | 8 ++++++++
 1 file changed, 8 insertions(+)

diff --git a/web/components/ui/OfflineBanner/OfflineBanner.module.scss b/web/components/ui/OfflineBanner/OfflineBanner.module.scss
index e6c77fd79..9c1db91c6 100644
--- a/web/components/ui/OfflineBanner/OfflineBanner.module.scss
+++ b/web/components/ui/OfflineBanner/OfflineBanner.module.scss
@@ -1,3 +1,5 @@
+@import '../../../styles/mixins.scss';
+
 .outerContainer {
   display: flex;
   justify-content: center;
@@ -15,6 +17,12 @@
   font-size: 1.3rem;
   border: 1px solid lightgray;
   font-family: var(--theme-text-display-font-family);
+
+  @include screen(tablet) {
+    font-size: 1.2rem;
+    padding: 1em;
+    margin: 1rem auto;
+  }
 }
 
 .bodyText {