diff options
| author | bobzel <zzzman@gmail.com> | 2020-08-24 20:43:07 -0400 |
|---|---|---|
| committer | bobzel <zzzman@gmail.com> | 2020-08-24 20:43:07 -0400 |
| commit | 015a08f56f9dda8b63ab139750a9ade6a964eff6 (patch) | |
| tree | e3d94a6ace4151d6f0692a2f719c6bfd6117039b /src | |
| parent | 69f94b19baa37a0a9114bc21710d2e09b49b638d (diff) | |
added lozenges to distinguish user & dashboard at top of workspace
Diffstat (limited to 'src')
| -rw-r--r-- | src/client/views/search/SearchBox.scss | 14 | ||||
| -rw-r--r-- | src/client/views/search/SearchBox.tsx | 12 |
2 files changed, 24 insertions, 2 deletions
diff --git a/src/client/views/search/SearchBox.scss b/src/client/views/search/SearchBox.scss index 3f06ba7d3..b5557e0d9 100644 --- a/src/client/views/search/SearchBox.scss +++ b/src/client/views/search/SearchBox.scss @@ -11,7 +11,19 @@ line-height: 1; overflow-y: auto; overflow-x: visible; - background: lightgrey, + background: lightgrey; + + .searchBox-lozenge { + background-color: #313131; + border-radius: 5px; + height: 15px; + padding: 4px; + box-shadow: lightgrey 0.15em 0.15em 0.1em; + margin: 2px; + margin-bottom: 4px; + border-top: dimgrey 1px solid; + border-left: dimgrey 1px solid; + } } .searchBox-bar { diff --git a/src/client/views/search/SearchBox.tsx b/src/client/views/search/SearchBox.tsx index bed6c83b4..4bffc89ea 100644 --- a/src/client/views/search/SearchBox.tsx +++ b/src/client/views/search/SearchBox.tsx @@ -489,7 +489,17 @@ export class SearchBox extends ViewBoxBaseComponent<FieldViewProps, SearchBoxDoc render() { return ( <div style={{ pointerEvents: "all" }} className="searchBox-container"> - <div style={{ position: "absolute", left: 15, height: 32, alignItems: "center", display: "flex" }}>{`${Doc.CurrentUserEmail}/${Cast(Doc.UserDoc().activeDashboard, Doc, null)?.title}`}</div> + <div style={{ position: "absolute", left: 15, height: 32, alignItems: "center", display: "flex" }}> + <div className="searchBox-lozenge"> + {`${Doc.CurrentUserEmail}`} + </div> + <div className="searchBox-lozenge"> + {`UI project`} + </div> + <div className="searchBox-lozenge" > + {`➱ ${Cast(Doc.UserDoc().activeDashboard, Doc, null)?.title}`} + </div> + </div> <div className="searchBox-bar"> <div style={{ position: "relative", display: "flex", width: 450 }}> <input value={this.newsearchstring} autoComplete="off" onChange={this.onChange} type="text" placeholder="Search..." id="search-input" ref={this._inputRef} |