Build/Resources/Public/Less/Component/autocomplete.less

   1 //
   2 // Autocomplete
   3 // ============
   4 //
   5
   6
   7 //
   8 // Variables
   9 //
  10 @autocomplete-border:                   #ddd;
  11 @autocomplete-border-radius:            2px;
  12 @autocomplete-results-bg:               #fff;
  13 @autocomplete-zindex:                   @zindex-dropdown;
  14 @autocomplete-suggestion-link-hover-bg: #fafafa;
  15
  16
  17 //
  18 // Component
  19 //
  20 .autocomplete {
  21         position: relative;
  22 }
  23 .autocomplete-results {
  24         z-index: @autocomplete-zindex;
  25         position: absolute;
  26         margin: 5px 0;
  27         top: 100%;
  28         right: 0;
  29         border: 1px solid @autocomplete-border;
  30         border-radius: @autocomplete-border-radius;
  31         background-color: @autocomplete-results-bg;
  32         overflow: hidden;
  33         box-shadow: 0 1px 0 0 rgba(0,0,0,0.25);
  34 }
  35
  36 .autocomplete-suggestion {
  37         border-top: 1px solid @autocomplete-border;
  38         &:first-child {
  39                 border-top: none;
  40         }
  41 }
  42 .autocomplete-suggestion-link {
  43         padding: 5px 13px 5px 28px;
  44         display: block;
  45         text-decoration: none;
  46         &:hover {
  47                 background-color: @autocomplete-suggestion-link-hover-bg;
  48                 text-decoration: none;
  49         }
  50 }
  51 .autocomplete-info {
  52         padding: 5px 15px;
  53 }