Tweak offline banner style for narrow screens

2023-01-29 17:34:01 -08:00
parent 602f7e849b
commit 10baf36bda
1 changed files with 8 additions and 0 deletions
--- 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 {