word/edit: search input form in hierarchy navigation

[sheet.git] / word / editor.css

diff --git a/word/editor.css b/word/editor.css
index f37693528647f54fd91da3e85f651fd6d1593ea4..2e89bb5a3651b1be98eff0495818d246d543e9d8 100644 (file)
--- a/word/editor.css
+++ b/word/editor.css
@@ -80,6 +80,11 @@ h1 {
 }
 .inline.multiinput {
        flex-wrap: wrap;
+       justify-content: space-between;
+}
+.inline.multiinput > :last-child {
+       text-align: right;
+       flex-grow: 1;
 }
 .multiinput > input {
        width: 10em;
@@ -91,3 +96,34 @@ h1 {
        margin: 1ex 0;
        display: inline-block;
 }
+
+#nav {
+       position: relative;
+}
+form#search {
+       display: block;
+       position: absolute;
+       width: 100%;
+       text-align: right;
+       top: -7ex;
+}
+#search input {
+       width: 100%;
+       transition: all .5s ease-in;
+}
+#search:not(:focus-within) input {
+       width: 0;
+       padding-left: 0;
+       padding-right: 0;
+       visibility: hidden;
+}
+#search button {
+       position: absolute;
+       right: 0;
+       height: 100%; /* like input */
+       border: 0;
+       background: none;
+       color: inherit;
+       font: inherit;
+       cursor: pointer;
+}