From ddbd871da2611a8297729dbabab74cd87b5dd412 Mon Sep 17 00:00:00 2001 From: madelinegr Date: Wed, 5 Jun 2019 16:32:10 -0400 Subject: search is working rip my previous progress --- src/client/views/SearchBox.scss | 37 +++++++++++++++++++++++++++---------- 1 file changed, 27 insertions(+), 10 deletions(-) (limited to 'src/client/views/SearchBox.scss') diff --git a/src/client/views/SearchBox.scss b/src/client/views/SearchBox.scss index 72a0d4b72..4c60710da 100644 --- a/src/client/views/SearchBox.scss +++ b/src/client/views/SearchBox.scss @@ -73,6 +73,7 @@ margin-right: 72px; .search-item { + float: right; position: relative; z-index: 1000; pointer-events: auto; @@ -103,7 +104,7 @@ } .search-item:hover { - transition: all 0.1s; + transition: all 0.2s; background: $lighter-alt-accent; } @@ -140,26 +141,42 @@ .searchBox-instances { - display: block; - background: $lighter-alt-accent; - opacity: 0; + float: left; + display: inline-block; + opacity: 1; width: 150px; transition: all 0.2s ease; color: black; - transform: translateX(150px); + transform-origin: top right; + -webkit-transform: scale(0); + -ms-transform: scale(0); + transform: scale(0); + height: 100% } + .collection{ + border-color: $darker-alt-accent; + border-bottom-style: solid; + } .search-overview { display: flex; + flex-direction: row-reverse; justify-content: flex-end; height: 70px; } - .search-overview:hover { - .searchBox-instances { - transform: translateX(0px); - opacity: 1; - } + .parents{ + background: $light-color-secondary; + padding: 10px; } + + .search-item:hover~.searchBox-instances, .searchBox-instances:hover { + opacity: 1; + background: $lighter-alt-accent; + -webkit-transform: scale(1); + -ms-transform: scale(1); + transform: scale(1); + } + } \ No newline at end of file -- cgit v1.2.3-70-g09d2