From 98e11c0a7d61e03a82c6df7c8a5b1d3171529b0a Mon Sep 17 00:00:00 2001
From: Devin Howard <devin@callysto.com>
Date: Sat, 28 Nov 2015 20:17:14 +0800
Subject: [PATCH] split search css out into its own file

---
 app/assets/stylesheets/clean.css.erb   | 464 -------------------------
 app/assets/stylesheets/search.scss.erb | 459 ++++++++++++++++++++++++
 2 files changed, 459 insertions(+), 464 deletions(-)
 create mode 100644 app/assets/stylesheets/search.scss.erb

diff --git a/app/assets/stylesheets/clean.css.erb b/app/assets/stylesheets/clean.css.erb
index 94164b6b..8c3bd7dd 100644
--- a/app/assets/stylesheets/clean.css.erb
+++ b/app/assets/stylesheets/clean.css.erb
@@ -150,470 +150,6 @@
     height: 32px;
 }
 
-/* search */
-
-.sidebarSearch {
-    float:left;
-    height: 32px;
-    position: relative;
-}
-
-#searchLoading {
-    height: 24px;
-    width: 24px;
-    position: absolute;
-    top: 4px;
-    right: 76px;
-    display: none;
-}
-
-.unauthenticated .homePage .sidebarSearchIcon {
-    border-radius: 2px;
-}
-.sidebarSearchIcon {
-    float: left;
-    width: 72px;
-    border-top-right-radius: 2px;
-    border-bottom-right-radius: 2px;
-    height: 32px;
-    background: #4fb5c0 url(<%= asset_data_uri('search.png') %>) no-repeat center center;
-    background-size: 32px 32px;
-    cursor: pointer;
-}
-.sidebarSearch .twitter-typeahead, .sidebarSearch .sidebarSearchField {
-    float: left;
-}
-
-.unauthenticated .homePage .sidebarSearchField,
-.unauthenticated .homePage .sidebarSearch .tt-hint {
-    border-top-left-radius: 2px;
-    border-bottom-left-radius: 2px;
-}
-.explorePage .sidebarSearchField,
-.explorePage .sidebarSearch .tt-hint {
-	width: 380px;
-	padding: 5px 10px 5px 10px;
-}
-
-.sidebarSearchField {
-    color: #424242;
-}
-.sidebarSearch .tt-hint {
-    color: transparent;
-}
-.sidebarSearchField,
-.sidebarSearch .tt-hint {
-    height: 20px;
-    border-top: 1px solid #BDBDBD;
-    border-bottom: 1px solid #BDBDBD;
-    border-left: none;
-    border-right: none;
-    padding: 5px 0 5px 0;
-    width: 0px;
-    margin: 0;
-    outline: none;
-    font-size: 14px;
-    line-height: 14px;
-    background: #F5F5F5; 
-    font-family: 'din-medium', helvetica, sans-serif;
-}
-.sidebarSearch .tt-dropdown-menu {
-    top: 40px !important;
-    background: #F5F5F5;
-    width: 472px;
-    overflow-y: auto;
-    overflow-x: visible;
-    box-shadow: 0 10px 10px rgba(0,0,0,0.19), 0 6px 3px rgba(0,0,0,0.23);
-}
-
-.autoOptions #mapContribs { 
-    width: 15px;
-    height: 15px;
-    border: 1px solid #424242;
-    margin-top: 4px;
-    margin-left: 4px;
-}
-
-.mapContributorsIcon span {
-    margin-left: 5px;
-}
-
-.mapContributorsIcon li span {
-    margin-left: 10px;
-}
-
-
-.searchHeader {
-    height: 42px;
-    width: 100%;
-    position: relative;
-}
-.searchTopicsHeader {
-    background: #4fc4a8;
-}
-.searchMapsHeader {
-    background: #994fc0;
-}
-.searchMappersHeader {
-    background: #c04f4f;
-}
-.sidebarSearch .tt-dropdown-menu h3 {
-    text-transform: uppercase;
-    color: #F5F5F5;
-    font-size: 18px;
-    line-height: 18px;
-    margin: 12px 0 3px 16px;
-    float: left;
-}
-.sidebarSearch .tt-dropdown-menu .limitToMe {
-    float: left;
-    width: 12px;
-    height: 12px;
-    border: 1px;
-    color: #000000;
-    position: absolute;
-    top: 15px;
-    left: 136px;
-}
-.sidebarSearch .tt-dropdown-menu .limitToMeLabel {
-    float: left;
-    font-family: 'din-medium', helvetica, sans-serif;
-    font-size: 12px;
-    color: #f5f5f5;
-    margin: 0;
-    position: absolute;
-    top: 15px;
-    left: 156px;
-}
-.sidebarSearch .tt-dropdown-menu .minimizeResults, .sidebarSearch .tt-dropdown-menu .maximizeResults {
-    width: 32px;
-    height: 32px;
-    background-image: url(<%= asset_data_uri('arrowpermswhite_sprite.png') %>);
-    background-repeat: no-repeat;
-    cursor: pointer;
-    position: absolute;
-    top: 5px;
-    left: 410px;
-}
-.sidebarSearch .tt-dropdown-menu .minimizeResults {
-    background-position: 0 0;
-}
-.sidebarSearch .tt-dropdown-menu .maximizeResults {
-    background-position: -32px 0;
-}
-.sidebarSearch .tt-dataset {
-    overflow: visible;
-}
-.sidebarSearch .tt-suggestion {
-    position: relative;
-    background: #FFF;
-    padding: 8px 0;
-}
-.sidebarSearch .tt-is-under-cursor,
-.sidebarSearch .tt-suggestion:hover {
-    background: #E0E0E0;
-}
-
-.resultmap, .resulttopic, .resultmapper, .resultnoresult {
-    min-height: 48px;
-    display: table;
-}
-/*.sidebarSearch .tt-dataset-maps .tt-is-under-cursor .resultmap,
-.sidebarSearch .tt-dataset-maps .tt-is-under-mouse-cursor .resultmap,
-.sidebarSearch .tt-dataset-topics .tt-is-under-cursor .resulttopic,
-.sidebarSearch .tt-dataset-topics .tt-is-under-mouse-cursor .resulttopic {
-    min-height: 48px;
-}*/
-.sidebarSearch .tt-suggestion .searchResIconWrapper {
-    display: table-cell;
-    vertical-align: middle;
-    height: 32px;
-    padding: 0 18px 0 28px;
-}
-.sidebarSearch .tt-suggestion .icon {
-    width: 32px;
-    height: 32px;
-    border-radius:16px;
-}
-.sidebarSearch .topicMetacode {
-    display: table-cell;
-    vertical-align: middle;
-    padding: 0 0 0 8px;
-    width: 70px;
-}
-.sidebarSearch .tt-dataset-topics .topicIcon {
-    width: 32px;
-    height: 32px;
-    margin: 0 auto;
-}
-.sidebarSearch .tt-dataset-topics .metacodeTip {
-    display: none;
-    margin: 0 auto;
-}
-.sidebarSearch .tt-dataset-topics .tt-is-under-cursor .metacodeTip,
-.sidebarSearch .tt-dataset-topics .tt-is-under-mouse-cursor .metacodeTip {
-    display: block;
-    font-family: 'vinyl';
-    text-transform: uppercase;
-    font-style: italic;
-    font-size: 13px;
-    margin: 0 5px 0 2px;
-    text-align: center;
-}
-.sidebarSearch .tt-dataset-mappers .tt-suggestion .icon {
-    margin: 0px 0px 0px 0px;
-}
-.sidebarSearch .tt-dataset-mappers .resultText {
-    width: 150px;
-}
-
-.sidebarSearch .resultText {
-    width: 260px;
-    display: table-cell;
-    padding-left: 8px;
-    vertical-align: middle;
-    word-wrap: break-word;
-}
-.sidebarSearch .resultTitle {
-    font-weight: normal;
-    font-size: 16px;
-    line-height: 20px;
-    width: 100%;
-    font-family: 'din-regular', helvetica, sans-serif;
-}
-.sidebarSearch .resultDesc {
-    font-size: 12px;
-    line-height: 16px;
-    width: 100%;
-    font-style: italic;
-    font-family: helvetica, sans-serif;
-}
-.sidebarSearch .tip {
-    display: none;
-}
-.sidebarSearch div.autoOptions {
-    width: 114px;
-    height: 48px;
-    position: absolute;
-    display: none;
-    top: 8px;
-    right: 0;
-}
-.tt-dataset-maps div.autoOptions {
-    width: 84px;
-}
-.sidebarSearch .tt-dataset-mappers .autoOptions {
-    width: 235px;
-}
-.sidebarSearch .tt-is-under-cursor .autoOptions,
-.sidebarSearch .tt-is-under-mouse-cursor .autoOptions {
-    display: block;
-}
-.sidebarSearch .tt-suggestion .resultnoresult .autoOptions {
-    display: none;
-}
-.sidebarSearch .autoOptions button,
-.sidebarSearch .autoOptions a,
-.sidebarSearch .autoOptions div {
-    position: absolute;
-    padding: 0;
-    margin: 0;
-    border: none;
-    outline: none;
-}
-.sidebarSearch button.addToMap {
-    display:none;
-    width: 24px;
-    height: 24px;
-    background: url(<%= asset_data_uri('addtopic_sprite.png') %>);
-    background-repeat: no-repeat;
-    background-size: 48px 24px;
-    top: 12px;
-    left: 80px;
-    cursor: pointer;
-}
-.canEditMap button.addToMap {
-    display: block;
-}
-.sidebarSearch button.addToMap:hover {
-    background-position: -24px;
-}
-
-.sidebarSearch div.topicCount {
-    width: 24px;
-    height: 24px;
-    background: url(<%= asset_data_uri('topic16.png') %>);
-    background-repeat: no-repeat;
-    background-position: 0 center;
-    top: 0;
-    left: 0;
-    padding-left: 18px;
-    font-size: 12px;
-    line-height: 24px;
-}
-
-.sidebarSearch div.mapCount {
-    width: 24px;
-    height: 24px;
-    background: url(<%= asset_data_uri('metamap16.png') %>);
-    background-repeat: no-repeat;
-    background-position: 0 center;
-    left: 0;
-    padding-left: 20px;
-    font-size: 12px;
-    line-height: 24px;
-}
-.sidebarSearch div.synapseCount {
-    width: 24px;
-    height: 24px;
-    background: url(<%= asset_data_uri('synapse16.png') %>);
-    background-repeat: no-repeat;
-    background-position: 0 center;
-    top: 24px;
-    left: 0;
-    padding-left: 20px;
-    font-size: 12px;
-    line-height: 24px;
-}
-.sidebarSearch div.topicOriginatorIcon {
-    width: 18px;
-    height: 18px;
-    padding: 3px;
-    top: 0;
-    left: 44px;
-}
-.sidebarSearch .topicOriginatorIcon img {
-    border-radius: 9px;
-}
-
-.sidebarSearch .topicOriginatorIcon .tip {
-    right: 30px;
-    top: 1px;
-}
-.sidebarSearch .tip {
-    position: absolute;
-    background: #424242;
-    width: auto;
-    top: 2px;
-    right: 25px;
-    color: white;
-    white-space: nowrap;
-    border-radius: 2px;
-    font-size: 12px !important;
-    font-family: 'din-regular';
-    line-height: 12px;
-    padding: 4px 4px 4px;
-    z-index: 100;
-}
-.sidebarSearch .hoverForTip:hover .tip {
-    display: block;
-}
-
-.sidebarSearch .mapContributorsIcon .tip {
-    right: 40px;
-    top: -5px;
-    padding-top: 5px;
-    padding-bottom: 5px;
-}
-
-.sidebarSearch .hoverForTip .tip li {
-    padding-left: 28px;
-    padding-top: 4px;
-}
-
-.tipUserImage {
-    position: absolute;
-    top: 0px;
-    left: 7px;
-    border-radius: 14px;
-}
-
-.sidebarSearch .hoverForTip .tip:before {
-    content: '';
-    position: absolute;
-    width: 0;
-    height: 0;
-    border-left: 4px solid #424242;
-    border-top: 5px solid transparent;
-    border-bottom: 5px solid transparent;
-}
-
-.sidebarSearch .hoverForTip.addToMap .tip {
-    right: 30px;
-}
-.sidebarSearch .hoverForTip.addToMap .tip:before {
-    right: -4px;
-}
-
-.sidebarSearch .mapContributorsIcon .tip:before {
-    top: 12px;
-    right: -4px;
-}
-
-.sidebarSearch .topicOriginatorIcon .tip:before {
-    top: 5px;
-    right: -4px;
-}
-
-.sidebarSearch .mapContributorsIcon .mapContributors {
-    top: auto;
-    right: 0;
-    bottom: 21px;
-    white-space: normal;
-    width: 200px;
-}
-.sidebarSearch div.mapContributorsIcon {
-    height: 24px;
-    top: 0;
-    left: 44px;
-    font-size: 12px;
-    line-height: 24px;
-}
-.sidebarSearch div.topicPermission,
-.sidebarSearch div.mapPermission {
-    width: 24px;
-    height: 24px;
-    background-image: url(<%= asset_data_uri('permissions32_sprite.png') %>);
-    background-repeat: no-repeat;
-    background-size: 72px 48px !important;
-    top: 24px;
-    left: 44px;
-}
-.sidebarSearch div.topicPermission.commons,
-.sidebarSearch div.mapPermission.commons {
-    background-position: 0 0;
-}
-.sidebarSearch div.topicPermission.public,
-.sidebarSearch div.mapPermission.public {
-    background-position: -48px 0;
-}
-.sidebarSearch div.topicPermission.private,
-.sidebarSearch div.mapPermission.private {
-    background-position: -24px 0;
-}
-
-.sidebarSearch .tt-dataset-mappers div.mapCount {
-    top: 8px;
-    left: 170px;
-}
-.sidebarSearch .tt-dataset-mappers div.mapperCreated {
-    left: 0px;
-    padding-left: 0px;
-    font-size: 12px;
-    font-family: 'din-medium', helvetica, sans-serif;
-    line-height: 24px;
-}
-.sidebarSearch .tt-dataset-mappers div.mapperGeneration {
-    top: 20px;
-    left: 0px;
-    padding-left: 0px;
-    font-size: 12px;
-    font-family: 'din-medium', helvetica, sans-serif;
-    line-height: 24px;
-}
-
-/* end search */
-
 /* end upperLeftUI */
 
 /* upperRightUI */
diff --git a/app/assets/stylesheets/search.scss.erb b/app/assets/stylesheets/search.scss.erb
new file mode 100644
index 00000000..5d56d120
--- /dev/null
+++ b/app/assets/stylesheets/search.scss.erb
@@ -0,0 +1,459 @@
+.sidebarSearch {
+    float:left;
+    height: 32px;
+    position: relative;
+}
+
+#searchLoading {
+    height: 24px;
+    width: 24px;
+    position: absolute;
+    top: 4px;
+    right: 76px;
+    display: none;
+}
+
+.unauthenticated .homePage .sidebarSearchIcon {
+    border-radius: 2px;
+}
+.sidebarSearchIcon {
+    float: left;
+    width: 72px;
+    border-top-right-radius: 2px;
+    border-bottom-right-radius: 2px;
+    height: 32px;
+    background: #4fb5c0 url(<%= asset_data_uri('search.png') %>) no-repeat center center;
+    background-size: 32px 32px;
+    cursor: pointer;
+}
+.sidebarSearch .twitter-typeahead, .sidebarSearch .sidebarSearchField {
+    float: left;
+}
+
+.unauthenticated .homePage .sidebarSearchField,
+.unauthenticated .homePage .sidebarSearch .tt-hint {
+    border-top-left-radius: 2px;
+    border-bottom-left-radius: 2px;
+}
+.explorePage .sidebarSearchField,
+.explorePage .sidebarSearch .tt-hint {
+	width: 380px;
+	padding: 5px 10px 5px 10px;
+}
+
+.sidebarSearchField {
+    color: #424242;
+}
+.sidebarSearch .tt-hint {
+    color: transparent;
+}
+.sidebarSearchField,
+.sidebarSearch .tt-hint {
+    height: 20px;
+    border-top: 1px solid #BDBDBD;
+    border-bottom: 1px solid #BDBDBD;
+    border-left: none;
+    border-right: none;
+    padding: 5px 0 5px 0;
+    width: 0px;
+    margin: 0;
+    outline: none;
+    font-size: 14px;
+    line-height: 14px;
+    background: #F5F5F5; 
+    font-family: 'din-medium', helvetica, sans-serif;
+}
+.sidebarSearch .tt-dropdown-menu {
+    top: 40px !important;
+    background: #F5F5F5;
+    width: 472px;
+    overflow-y: auto;
+    overflow-x: visible;
+    box-shadow: 0 10px 10px rgba(0,0,0,0.19), 0 6px 3px rgba(0,0,0,0.23);
+}
+
+.autoOptions #mapContribs { 
+    width: 15px;
+    height: 15px;
+    border: 1px solid #424242;
+    margin-top: 4px;
+    margin-left: 4px;
+}
+
+.mapContributorsIcon span {
+    margin-left: 5px;
+}
+
+.mapContributorsIcon li span {
+    margin-left: 10px;
+}
+
+
+.searchHeader {
+    height: 42px;
+    width: 100%;
+    position: relative;
+}
+.searchTopicsHeader {
+    background: #4fc4a8;
+}
+.searchMapsHeader {
+    background: #994fc0;
+}
+.searchMappersHeader {
+    background: #c04f4f;
+}
+.sidebarSearch .tt-dropdown-menu h3 {
+    text-transform: uppercase;
+    color: #F5F5F5;
+    font-size: 18px;
+    line-height: 18px;
+    margin: 12px 0 3px 16px;
+    float: left;
+}
+.sidebarSearch .tt-dropdown-menu .limitToMe {
+    float: left;
+    width: 12px;
+    height: 12px;
+    border: 1px;
+    color: #000000;
+    position: absolute;
+    top: 15px;
+    left: 136px;
+}
+.sidebarSearch .tt-dropdown-menu .limitToMeLabel {
+    float: left;
+    font-family: 'din-medium', helvetica, sans-serif;
+    font-size: 12px;
+    color: #f5f5f5;
+    margin: 0;
+    position: absolute;
+    top: 15px;
+    left: 156px;
+}
+.sidebarSearch .tt-dropdown-menu .minimizeResults, .sidebarSearch .tt-dropdown-menu .maximizeResults {
+    width: 32px;
+    height: 32px;
+    background-image: url(<%= asset_data_uri('arrowpermswhite_sprite.png') %>);
+    background-repeat: no-repeat;
+    cursor: pointer;
+    position: absolute;
+    top: 5px;
+    left: 410px;
+}
+.sidebarSearch .tt-dropdown-menu .minimizeResults {
+    background-position: 0 0;
+}
+.sidebarSearch .tt-dropdown-menu .maximizeResults {
+    background-position: -32px 0;
+}
+.sidebarSearch .tt-dataset {
+    overflow: visible;
+}
+.sidebarSearch .tt-suggestion {
+    position: relative;
+    background: #FFF;
+    padding: 8px 0;
+}
+.sidebarSearch .tt-is-under-cursor,
+.sidebarSearch .tt-suggestion:hover {
+    background: #E0E0E0;
+}
+
+.resultmap, .resulttopic, .resultmapper, .resultnoresult {
+    min-height: 48px;
+    display: table;
+}
+/*.sidebarSearch .tt-dataset-maps .tt-is-under-cursor .resultmap,
+.sidebarSearch .tt-dataset-maps .tt-is-under-mouse-cursor .resultmap,
+.sidebarSearch .tt-dataset-topics .tt-is-under-cursor .resulttopic,
+.sidebarSearch .tt-dataset-topics .tt-is-under-mouse-cursor .resulttopic {
+    min-height: 48px;
+}*/
+.sidebarSearch .tt-suggestion .searchResIconWrapper {
+    display: table-cell;
+    vertical-align: middle;
+    height: 32px;
+    padding: 0 18px 0 28px;
+}
+.sidebarSearch .tt-suggestion .icon {
+    width: 32px;
+    height: 32px;
+    border-radius:16px;
+}
+.sidebarSearch .topicMetacode {
+    display: table-cell;
+    vertical-align: middle;
+    padding: 0 0 0 8px;
+    width: 70px;
+}
+.sidebarSearch .tt-dataset-topics .topicIcon {
+    width: 32px;
+    height: 32px;
+    margin: 0 auto;
+}
+.sidebarSearch .tt-dataset-topics .metacodeTip {
+    display: none;
+    margin: 0 auto;
+}
+.sidebarSearch .tt-dataset-topics .tt-is-under-cursor .metacodeTip,
+.sidebarSearch .tt-dataset-topics .tt-is-under-mouse-cursor .metacodeTip {
+    display: block;
+    font-family: 'vinyl';
+    text-transform: uppercase;
+    font-style: italic;
+    font-size: 13px;
+    margin: 0 5px 0 2px;
+    text-align: center;
+}
+.sidebarSearch .tt-dataset-mappers .tt-suggestion .icon {
+    margin: 0px 0px 0px 0px;
+}
+.sidebarSearch .tt-dataset-mappers .resultText {
+    width: 150px;
+}
+
+.sidebarSearch .resultText {
+    width: 260px;
+    display: table-cell;
+    padding-left: 8px;
+    vertical-align: middle;
+    word-wrap: break-word;
+}
+.sidebarSearch .resultTitle {
+    font-weight: normal;
+    font-size: 16px;
+    line-height: 20px;
+    width: 100%;
+    font-family: 'din-regular', helvetica, sans-serif;
+}
+.sidebarSearch .resultDesc {
+    font-size: 12px;
+    line-height: 16px;
+    width: 100%;
+    font-style: italic;
+    font-family: helvetica, sans-serif;
+}
+.sidebarSearch .tip {
+    display: none;
+}
+.sidebarSearch div.autoOptions {
+    width: 114px;
+    height: 48px;
+    position: absolute;
+    display: none;
+    top: 8px;
+    right: 0;
+}
+.tt-dataset-maps div.autoOptions {
+    width: 84px;
+}
+.sidebarSearch .tt-dataset-mappers .autoOptions {
+    width: 235px;
+}
+.sidebarSearch .tt-is-under-cursor .autoOptions,
+.sidebarSearch .tt-is-under-mouse-cursor .autoOptions {
+    display: block;
+}
+.sidebarSearch .tt-suggestion .resultnoresult .autoOptions {
+    display: none;
+}
+.sidebarSearch .autoOptions button,
+.sidebarSearch .autoOptions a,
+.sidebarSearch .autoOptions div {
+    position: absolute;
+    padding: 0;
+    margin: 0;
+    border: none;
+    outline: none;
+}
+.sidebarSearch button.addToMap {
+    display:none;
+    width: 24px;
+    height: 24px;
+    background: url(<%= asset_data_uri('addtopic_sprite.png') %>);
+    background-repeat: no-repeat;
+    background-size: 48px 24px;
+    top: 12px;
+    left: 80px;
+    cursor: pointer;
+}
+.canEditMap button.addToMap {
+    display: block;
+}
+.sidebarSearch button.addToMap:hover {
+    background-position: -24px;
+}
+
+.sidebarSearch div.topicCount {
+    width: 24px;
+    height: 24px;
+    background: url(<%= asset_data_uri('topic16.png') %>);
+    background-repeat: no-repeat;
+    background-position: 0 center;
+    top: 0;
+    left: 0;
+    padding-left: 18px;
+    font-size: 12px;
+    line-height: 24px;
+}
+
+.sidebarSearch div.mapCount {
+    width: 24px;
+    height: 24px;
+    background: url(<%= asset_data_uri('metamap16.png') %>);
+    background-repeat: no-repeat;
+    background-position: 0 center;
+    left: 0;
+    padding-left: 20px;
+    font-size: 12px;
+    line-height: 24px;
+}
+.sidebarSearch div.synapseCount {
+    width: 24px;
+    height: 24px;
+    background: url(<%= asset_data_uri('synapse16.png') %>);
+    background-repeat: no-repeat;
+    background-position: 0 center;
+    top: 24px;
+    left: 0;
+    padding-left: 20px;
+    font-size: 12px;
+    line-height: 24px;
+}
+.sidebarSearch div.topicOriginatorIcon {
+    width: 18px;
+    height: 18px;
+    padding: 3px;
+    top: 0;
+    left: 44px;
+}
+.sidebarSearch .topicOriginatorIcon img {
+    border-radius: 9px;
+}
+
+.sidebarSearch .topicOriginatorIcon .tip {
+    right: 30px;
+    top: 1px;
+}
+.sidebarSearch .tip {
+    position: absolute;
+    background: #424242;
+    width: auto;
+    top: 2px;
+    right: 25px;
+    color: white;
+    white-space: nowrap;
+    border-radius: 2px;
+    font-size: 12px !important;
+    font-family: 'din-regular';
+    line-height: 12px;
+    padding: 4px 4px 4px;
+    z-index: 100;
+}
+.sidebarSearch .hoverForTip:hover .tip {
+    display: block;
+}
+
+.sidebarSearch .mapContributorsIcon .tip {
+    right: 40px;
+    top: -5px;
+    padding-top: 5px;
+    padding-bottom: 5px;
+}
+
+.sidebarSearch .hoverForTip .tip li {
+    padding-left: 28px;
+    padding-top: 4px;
+}
+
+.tipUserImage {
+    position: absolute;
+    top: 0px;
+    left: 7px;
+    border-radius: 14px;
+}
+
+.sidebarSearch .hoverForTip .tip:before {
+    content: '';
+    position: absolute;
+    width: 0;
+    height: 0;
+    border-left: 4px solid #424242;
+    border-top: 5px solid transparent;
+    border-bottom: 5px solid transparent;
+}
+
+.sidebarSearch .hoverForTip.addToMap .tip {
+    right: 30px;
+}
+.sidebarSearch .hoverForTip.addToMap .tip:before {
+    right: -4px;
+}
+
+.sidebarSearch .mapContributorsIcon .tip:before {
+    top: 12px;
+    right: -4px;
+}
+
+.sidebarSearch .topicOriginatorIcon .tip:before {
+    top: 5px;
+    right: -4px;
+}
+
+.sidebarSearch .mapContributorsIcon .mapContributors {
+    top: auto;
+    right: 0;
+    bottom: 21px;
+    white-space: normal;
+    width: 200px;
+}
+.sidebarSearch div.mapContributorsIcon {
+    height: 24px;
+    top: 0;
+    left: 44px;
+    font-size: 12px;
+    line-height: 24px;
+}
+.sidebarSearch div.topicPermission,
+.sidebarSearch div.mapPermission {
+    width: 24px;
+    height: 24px;
+    background-image: url(<%= asset_data_uri('permissions32_sprite.png') %>);
+    background-repeat: no-repeat;
+    background-size: 72px 48px !important;
+    top: 24px;
+    left: 44px;
+}
+.sidebarSearch div.topicPermission.commons,
+.sidebarSearch div.mapPermission.commons {
+    background-position: 0 0;
+}
+.sidebarSearch div.topicPermission.public,
+.sidebarSearch div.mapPermission.public {
+    background-position: -48px 0;
+}
+.sidebarSearch div.topicPermission.private,
+.sidebarSearch div.mapPermission.private {
+    background-position: -24px 0;
+}
+
+.sidebarSearch .tt-dataset-mappers div.mapCount {
+    top: 8px;
+    left: 170px;
+}
+.sidebarSearch .tt-dataset-mappers div.mapperCreated {
+    left: 0px;
+    padding-left: 0px;
+    font-size: 12px;
+    font-family: 'din-medium', helvetica, sans-serif;
+    line-height: 24px;
+}
+.sidebarSearch .tt-dataset-mappers div.mapperGeneration {
+    top: 20px;
+    left: 0px;
+    padding-left: 0px;
+    font-size: 12px;
+    font-family: 'din-medium', helvetica, sans-serif;
+    line-height: 24px;
+}