Add style for search input in default theme

3 files changed, 25 insertions, 2 deletions

diff --git a/packages/gitbook-plugin-theme-default/less/Button.less b/packages/gitbook-plugin-theme-default/less/Button.less
index 0983dcb..476bdf7 100644
--- a/packages/gitbook-plugin-theme-default/less/Button.less
+++ b/packages/gitbook-plugin-theme-default/less/Button.less
@@ -1,4 +1,4 @@
-.GitBook\/Button {
+.GitBook-Button {
     border: 0;
     background-color: transparent;
     background: @button-background;
diff --git a/packages/gitbook-plugin-theme-default/less/Search.less b/packages/gitbook-plugin-theme-default/less/Search.less
new file mode 100644
index 0000000..b094dc5
--- /dev/null
+++ b/packages/gitbook-plugin-theme-default/less/Search.less
@@ -0,0 +1,23 @@
+.Search-Input {
+    padding: 6px;
+    background: transparent;
+    transition: top 0.5s ease;
+    background: #fff;
+    border-bottom: 1px solid @sidebar-border-color;
+    border-top: 1px solid @sidebar-border-color;
+    margin-bottom: 10px;
+
+    // Move top to hide top border
+    margin-top: -1px;
+
+    input, input:focus, input:hover {
+        width: 100%;
+        background: transparent;
+        border: 1px solid transparent;
+        box-shadow: none;
+        outline: none;
+        line-height: 22px;
+        padding: 7px 7px;
+        color: inherit;
+    }
+}
diff --git a/packages/gitbook-plugin-theme-default/less/main.less b/packages/gitbook-plugin-theme-default/less/main.less
index 8a52e2b..9858a2f 100644
--- a/packages/gitbook-plugin-theme-default/less/main.less
+++ b/packages/gitbook-plugin-theme-default/less/main.less
@@ -7,11 +7,11 @@
 @import "variables.less";
 
 @import "Button.less";
-
 @import "Sidebar.less";
 @import "Summary.less";
 @import "Page.less";
 @import "Toolbar.less";
+@import "Search.less";
 
 * {
     .box-sizing(border-box);