From d3f8208bb6068f6b1ca23cb974ec2da5f376de39 Mon Sep 17 00:00:00 2001
From: Xinyu Liu <meteor.lxy@foxmail.com>
Date: Wed, 25 Apr 2018 12:38:29 +0800
Subject: [PATCH] tweak: make the SearchBox of default theme better in narrow
 screen

---
 lib/default-theme/SearchBox.vue | 22 +++++++++++++++-------
 1 file changed, 15 insertions(+), 7 deletions(-)

diff --git a/lib/default-theme/SearchBox.vue b/lib/default-theme/SearchBox.vue
index fcda1f4d90..867877085d 100644
--- a/lib/default-theme/SearchBox.vue
+++ b/lib/default-theme/SearchBox.vue
@@ -184,14 +184,22 @@ export default {
         color $accentColor
 
 @media (max-width: $MQNarrow)
-  .search-box input
-    width 0
-    border-color transparent
-    position relative
-    left 1rem
-    &:focus
+  .search-box
+    input
+      cursor pointer
+      width 0
+      border-color transparent
+      position relative
+      left 1rem
+      &:focus
+        cursor text
+        left 0
+        width 10rem
+
+@media (max-width: $MQNarrow) and (min-width: $MQMobile)
+  .search-box
+    .suggestions
       left 0
-      width 10rem
 
 @media (max-width: $MQMobile)
   .search-box