openstack
/
horizon
Code Issues Proposed changes

Add scss variables for Magic Search 

Added scss variables for customization of Magic Search appearance,
and addressed comment from last review to add text on what Foundation is.

Change-Id: Ie0493ad712b6a21c306bb036922c2fd7550a0a4c
Closes-bug: #1448290
This commit is contained in:
Aaron Sahlin 2015-04-24 10:58:38 -05:00
parent 59fa5aec8e
commit c6c0015deb
3 changed files with 15 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
horizon/static/angular/magic-search/magic-search.js vendored
View File

@ -7,8 +7,9 @@
* @description
* A directive to modify / extend Magic Search functionality for use in
* Horizon.
* 1. The base magic search uses Foundation, and in showMenu and
* hide menu makes a Foundation call, therefore we need to override.
* 1. The base magic search widget makes Foundation (a responsive front-end
* framework) specific calls in showMenu and hideMenu. In Horizon we use
* Bootstrap, therefore we need to override those methods.
*
* 2. Added 'facetsChanged' listener so we can notify base magic search
* widget that new facets are available so they will be picked up. (Use

9
horizon/static/angular/magic-search/magic-search.scss
View File

@ -1,10 +1,11 @@
// Augments magic_search.scss with styles for bootstrap/Horizon.
.search-bar {
min-width: 500px;
border-color: #ccc;
border-radius: 3px;
margin-bottom: 0;
min-width: $magic-search-min-width;
border-color: $magic-search-border-color;
border-radius: $magic-search-border-radius;
margin-bottom: $magic-search-margin-bottom;
padding: $magic-search-margin-padding;
.search-entry {
.search-input {

7
openstack_dashboard/static/dashboard/scss/_variables.scss
View File

@ -192,3 +192,10 @@ $metadata-display-selector-color: $link-color !default;
$metadata-display-selector-hover-color: $link-hover-color !default;
$metadata-display-selector-active-color: #666 !default;
$metadata-display-separator-color: #ccc !default;
/* Magic Search */
$magic-search-min-width: 40em !default;
$magic-search-border-color: #cccccc !default;
$magic-search-margin-bottom: 0 !default;
$magic-search-border-radius: 3px !default;
$magic-search-margin-padding: 2px !default;