quick-search: improve styling of search input and results.

rhodecode/apps/home/tests/__init__.py

@@ -32,7 +32,13 b' def assert_and_get_main_filter_content(r'
 
         if data_item['type'] == 'search':
             display_val = data_item['value_display']
-            assert 'Search for:' in display_val, display_val
+            if data_item['id'] == -1:
+                assert 'File search for:' in display_val, display_val
+            elif data_item['id'] == -2:
+                assert 'Commit search for:' in display_val, display_val
+            else:
+                assert False, 'No Proper ID returned {}'.format(data_item['id'])
+
         elif data_item['type'] == 'repo':
             repos.append(data_item)
         elif data_item['type'] == 'repo_group':

rhodecode/apps/home/views.py

@@ -263,19 +263,30 b' class HomeView(BaseAppView):'
             'commit_id:{}*'.format(commit_hash), 'commit', auth_user,
             raise_on_exc=False)
 
-        return [
-            {
+        commits = []
+        for entry in result['results']:
+            repo_data = {
+                'repository_id': entry.get('repository_id'),
+                'repository_type': entry.get('repo_type'),
+                'repository_name': entry.get('repository'),
+            }
+
+            commit_entry = {
                 'id': entry['commit_id'],
                 'value': org_query,
-                'value_display': 'repo `{}` commit: {}'.format(
+                'value_display': '`{}` commit: {}'.format(
                     entry['repository'], entry['commit_id']),
                 'type': 'commit',
                 'repo': entry['repository'],
+                'repo_data': repo_data,
+
                 'url': h.route_path(
                     'repo_commit',
                     repo_name=entry['repository'], commit_id=entry['commit_id'])
             }
-            for entry in result['results']]
+
+            commits.append(commit_entry)
+        return commits
 
     @LoginRequired()
     @view_config(
@@ -373,7 +384,7 b' class HomeView(BaseAppView):'
             label = u'Commit search for `{}` in this repository.'.format(query)
             queries.append(
                 {
-                    'id': -10,
+                    'id': -20,
                     'value': query,
                     'value_display': label,
                     'type': 'search',
@@ -392,7 +403,7 b' class HomeView(BaseAppView):'
             label = u'File search for `{}` in this repository group'.format(query)
             queries.append(
                 {
-                    'id': -20,
+                    'id': -30,
                     'value': query,
                     'value_display': label,
                     'type': 'search',
@@ -410,7 +421,7 b' class HomeView(BaseAppView):'
             label = u'Commit search for `{}` in this repository group'.format(query)
             queries.append(
                 {
-                    'id': -20,
+                    'id': -40,
                     'value': query,
                     'value_display': label,
                     'type': 'search',
@@ -425,16 +436,16 b' class HomeView(BaseAppView):'
                 {
                     'id': -1,
                     'value': query,
-                    'value_display': u'Commit search for: `{}`'.format(query),
+                    'value_display': u'File search for: `{}`'.format(query),
                     'type': 'search',
                     'url': h.route_path('search',
                                         _query={'q': query, 'type': 'content'})
                 })
             queries.append(
                 {
-                    'id': -1,
+                    'id': -2,
                     'value': query,
-                    'value_display': u'File search for: `{}`'.format(query),
+                    'value_display': u'Commit search for: `{}`'.format(query),
                     'type': 'search',
                     'url': h.route_path('search',
                                         _query={'q': query, 'type': 'commit'})

rhodecode/public/css/navigation.less

@@ -636,8 +636,10 b' ul#context-pages {'
     border-bottom: 1px solid @grey4;
     display: inline-block;
     vertical-align: top;
-    margin-left: -7px;
-    background: @grey3;
+    background: inherit;
+    position: absolute;
+    right: 8px;
+    top: 9px;
 }
 
 .main_filter_input_box {
@@ -652,20 +654,32 b' ul#context-pages {'
     background: @grey3;
     border: 1px solid black;
     position: absolute;
-    white-space: pre-wrap;
+    white-space: pre;
     z-index: 9999;
     color: @nav-grey;
     margin: 1px 7px;
-    padding: 0 2px;
+    padding: 0 10px;
 }
 
 .main_filter_input {
     padding: 5px;
-    min-width: 220px;
+    min-width: 260px;
     color: @nav-grey;
     background: @grey3;
     min-height: 18px;
+
+
+    &:active {
+      color: @grey2 !important;
+      background: white !important;
 }
+    &:focus {
+      color: @grey2 !important;
+      background: white !important;
+    }
+}
+
+
 
 .main_filter_input::placeholder {
    color: @nav-grey;

rhodecode/templates/base/base.mako

@@ -492,17 +492,17 b''
         </div>
 
         <div id="main_filter_help" style="display: none">
-Use '/' key to quickly access this field.
-Enter name of repository, or repository group for quick search.
+- Use '/' key to quickly access this field.
 
-Prefix query to allow special search:
+- Enter a name of repository, or repository group for quick search.
+
+- Prefix query to allow special search:
 
 user:admin, to search for usernames
 
 user_group:devops, to search for user groups
 
 commit:efced4, to search for commits
-
         </div>
        </li>
 
@@ -630,6 +630,19 b' commit:efced4, to search for commits'
             };
             var pattern = '(' + escapeRegExChars(value) + ')';
 
+            var getRepoIcon = function(repo_type) {
+                if (repo_type === 'hg') {
+                    return '<i class="icon-hg"></i> ';
+                }
+                else if (repo_type === 'git') {
+                    return '<i class="icon-git"></i> ';
+                }
+                else if (repo_type === 'svn') {
+                    return '<i class="icon-svn"></i> ';
+                }
+                return ''
+            };
+
             // highlight match
             valueDisplay = Select2.util.escapeMarkup(valueDisplay);
             valueDisplay = valueDisplay.replace(new RegExp(pattern, 'gi'), '<strong>$1<\/strong>');
@@ -639,19 +652,16 b' commit:efced4, to search for commits'
             if (searchType === 'hint') {
                 icon += '<i class="icon-folder-close"></i> ';
             }
+            // full text search
             else if (searchType === 'search') {
                 icon += '<i class="icon-more"></i> ';
             }
+            // repository
             else if (searchType === 'repo') {
-                if (data['repo_type'] === 'hg') {
-                    icon += '<i class="icon-hg"></i> ';
-                }
-                else if (data['repo_type'] === 'git') {
-                    icon += '<i class="icon-git"></i> ';
-                }
-                else if (data['repo_type'] === 'svn') {
-                    icon += '<i class="icon-svn"></i> ';
-                }
+
+                var repoIcon = getRepoIcon(data['repo_type']);
+                icon += repoIcon;
+
                 if (data['private']) {
                     icon += '<i class="icon-lock" ></i> ';
                 }
@@ -659,18 +669,27 b' commit:efced4, to search for commits'
                     icon += '<i class="icon-unlock-alt"></i> ';
                 }
             }
+            // repository groups
             else if (searchType === 'repo_group') {
                 icon += '<i class="icon-folder-close"></i> ';
             }
+            // user group
             else if (searchType === 'user_group') {
                 icon += '<i class="icon-group"></i> ';
             }
             else if (searchType === 'user') {
                 icon += '<img class="gravatar" src="{0}"/>'.format(data['icon_link']);
             }
+            // commit
             else if (searchType === 'commit') {
+                var repo_data = data['repo_data'];
+                var repoIcon = getRepoIcon(repo_data['repository_type']);
+                if (repoIcon) {
+                    icon += repoIcon;
+                } else {
                 icon += '<i class="icon-tag"></i>';
             }
+            }
 
             var tmpl = '<div class="ac-container-wrap">{0}{1}</div>';
             return tmpl.format(icon, valueDisplay);
@@ -715,7 +734,7 b' commit:efced4, to search for commits'
 
         showMainFilterBox = function () {
             $('#main_filter_help').toggle();
-        }
+        };
 
     </script>
     <script src="${h.asset('js/rhodecode/base/keyboard-bindings.js', ver=c.rhodecode_version_hash)}"></script>