From b208392425d36f541e6906651ca08fae6e656a35 Mon Sep 17 00:00:00 2001
From: southerntofu <southerntofu@thunix.net>
Date: Mon, 30 Mar 2020 12:54:06 +0200
Subject: [PATCH] Don't overflow dnsmanager ASCII art on smaller screens,
 remove old SASS cruft

---
 README.md              |  2 +-
 sass/_mobile.scss      |  4 ++++
 sass/style.scss        |  2 +-
 sass/widgets/menu.scss | 40 ----------------------------------------
 4 files changed, 6 insertions(+), 42 deletions(-)
 create mode 100644 sass/_mobile.scss
 delete mode 100644 sass/widgets/menu.scss

diff --git a/README.md b/README.md
index c27c2c3..2912bef 100644
--- a/README.md
+++ b/README.md
@@ -125,7 +125,7 @@ If something is missing for you, please open an issue.
   - [x] localized RSS links
   - [ ] links to navigate between languages
 - [ ] other
-  - [ ] ASCII banner does not overflow
+  - [x] ASCII banner does not overflow
   - [ ] write setup/configuration guide
   - [ ] reference water.css semantic styling
   - [x] RSS links
diff --git a/sass/_mobile.scss b/sass/_mobile.scss
new file mode 100644
index 0000000..500665c
--- /dev/null
+++ b/sass/_mobile.scss
@@ -0,0 +1,4 @@
+@media screen and (max-width: 62em) {
+    // Do not overflow the ASCII art on smaller screens
+    header > pre { font-size: 0.4em; }
+}
diff --git a/sass/style.scss b/sass/style.scss
index 9c2965a..e29e3c6 100644
--- a/sass/style.scss
+++ b/sass/style.scss
@@ -1,4 +1,4 @@
-@import 'widgets/menu.scss';
+@import 'mobile';
 
 .nav-menu {
     font-weight: bold;
diff --git a/sass/widgets/menu.scss b/sass/widgets/menu.scss
deleted file mode 100644
index 8679b66..0000000
--- a/sass/widgets/menu.scss
+++ /dev/null
@@ -1,40 +0,0 @@
-/************************************************************
-*************************************************************
-*******************     SQUAT THEME     *********************
-********** Javascript-free attempt at a better web **********
-*************************************************************
-************************************************************/
-
-/* Menu widget styles */
-.widget-menu {
-    width: 100%; white-space: nowrap; box-sizing: border-box;
-    ul {
-        list-style: none; margin: 0; padding: 0;
-        display: inline-block; 
-        @media screen and (max-width: 62em) { display: none; }
-        li { display: inline-block; padding: 0; margin: 0; position: relative; }
-    }
-}
-
-
-#menu-nav-main { text-align: center; font-size: 1.2rem; }
-.pure-menu-link, .pure-menu-open { display: block; padding: 0.5em 1em; }
-#menu-nav-main .pure-menu-children { left: 50% !important; transform: translateX(-50%); }
-
-.pure-menu-open {
-    display: none;
-    @media screen and (max-width: 62em) {
-        display: block;
-        &:target {
-            display: none;
-            & ~ .pure-menu-close { display: inline-block; }
-            & ~ ul {
-                display: block;
-                li { display: block; position: relative; }
-            }
-        }
-    }
-}
-
-/* Making pureCSS menu responsive without Javascript */
-.pure-menu-close { display: none; }