← Back to branch summary

~caneypuggies/reformedchurcheslocator/couchapp-backbone

« back to all changes in this revision

Viewing changes to _attachments/js/vendor/bootstrap/less/dropdowns.less

  • Committer: Tim Black
  • Date: 2013-09-16 22:50:16 UTC
  • Revision ID: tim@alwaysreformed.com-20130916225016-zk8jiba25z33ew7h
Versioned Bower vendor directory

Show diffs side-by-side

added added

removed removed

Lines of Context:
_attachments/js/vendor/bootstrap/less/dropdowns.less
 
1
//
 
2
// Dropdown menus
 
3
// --------------------------------------------------
 
4
 
 
5
 
 
6
// Dropdown arrow/caret
 
7
.caret {
 
8
  display: inline-block;
 
9
  width: 0;
 
10
  height: 0;
 
11
  margin-left: 2px;
 
12
  vertical-align: middle;
 
13
  border-top:   @caret-width-base solid @dropdown-caret-color;
 
14
  border-right: @caret-width-base solid transparent;
 
15
  border-left:  @caret-width-base solid transparent;
 
16
  // Firefox fix for https://github.com/twbs/bootstrap/issues/9538. Once fixed,
 
17
  // we can just straight up remove this.
 
18
  border-bottom: 0 dotted;
 
19
  content: "";
 
20
}
 
21
 
 
22
// The dropdown wrapper (div)
 
23
.dropdown {
 
24
  position: relative;
 
25
}
 
26
 
 
27
// Prevent the focus on the dropdown toggle when closing dropdowns
 
28
.dropdown-toggle:focus {
 
29
  outline: 0;
 
30
}
 
31
 
 
32
// The dropdown menu (ul)
 
33
.dropdown-menu {
 
34
  position: absolute;
 
35
  top: 100%;
 
36
  left: 0;
 
37
  z-index: @zindex-dropdown;
 
38
  display: none; // none by default, but block on "open" of the menu
 
39
  float: left;
 
40
  min-width: 160px;
 
41
  padding: 5px 0;
 
42
  margin: 2px 0 0; // override default ul
 
43
  list-style: none;
 
44
  font-size: @font-size-base;
 
45
  background-color: @dropdown-bg;
 
46
  border: 1px solid @dropdown-fallback-border; // IE8 fallback
 
47
  border: 1px solid @dropdown-border;
 
48
  border-radius: @border-radius-base;
 
49
  .box-shadow(0 6px 12px rgba(0,0,0,.175));
 
50
  background-clip: padding-box;
 
51
 
 
52
  // Aligns the dropdown menu to right
 
53
  &.pull-right {
 
54
    right: 0;
 
55
    left: auto;
 
56
  }
 
57
 
 
58
  // Dividers (basically an hr) within the dropdown
 
59
  .divider {
 
60
    .nav-divider(@dropdown-divider-bg);
 
61
  }
 
62
 
 
63
  // Links within the dropdown menu
 
64
  > li > a {
 
65
    display: block;
 
66
    padding: 3px 20px;
 
67
    clear: both;
 
68
    font-weight: normal;
 
69
    line-height: @line-height-base;
 
70
    color: @dropdown-link-color;
 
71
    white-space: nowrap; // prevent links from randomly breaking onto new lines
 
72
  }
 
73
}
 
74
 
 
75
// Hover/Focus state
 
76
.dropdown-menu > li > a {
 
77
  &:hover,
 
78
  &:focus {
 
79
    text-decoration: none;
 
80
    color: @dropdown-link-hover-color;
 
81
    background-color: @dropdown-link-hover-bg;
 
82
  }
 
83
}
 
84
 
 
85
// Active state
 
86
.dropdown-menu > .active > a {
 
87
  &,
 
88
  &:hover,
 
89
  &:focus {
 
90
    color: @dropdown-link-active-color;
 
91
    text-decoration: none;
 
92
    outline: 0;
 
93
    background-color: @dropdown-link-active-bg;
 
94
  }
 
95
}
 
96
 
 
97
// Disabled state
 
98
//
 
99
// Gray out text and ensure the hover/focus state remains gray
 
100
 
 
101
.dropdown-menu > .disabled > a {
 
102
  &,
 
103
  &:hover,
 
104
  &:focus {
 
105
    color: @dropdown-link-disabled-color;
 
106
  }
 
107
}
 
108
// Nuke hover/focus effects
 
109
.dropdown-menu > .disabled > a {
 
110
  &:hover,
 
111
  &:focus {
 
112
    text-decoration: none;
 
113
    background-color: transparent;
 
114
    background-image: none; // Remove CSS gradient
 
115
    .reset-filter();
 
116
    cursor: not-allowed;
 
117
  }
 
118
}
 
119
 
 
120
// Open state for the dropdown
 
121
.open {
 
122
  // Show the menu
 
123
  > .dropdown-menu {
 
124
    display: block;
 
125
  }
 
126
 
 
127
  // Remove the outline when :focus is triggered
 
128
  > a {
 
129
    outline: 0;
 
130
  }
 
131
}
 
132
 
 
133
// Dropdown section headers
 
134
.dropdown-header {
 
135
  display: block;
 
136
  padding: 3px 20px;
 
137
  font-size: @font-size-small;
 
138
  line-height: @line-height-base;
 
139
  color: @dropdown-header-color;
 
140
}
 
141
 
 
142
// Backdrop to catch body clicks on mobile, etc.
 
143
.dropdown-backdrop {
 
144
  position: fixed;
 
145
  left: 0;
 
146
  right: 0;
 
147
  bottom: 0;
 
148
  top: 0;
 
149
  z-index: @zindex-dropdown - 10;
 
150
}
 
151
 
 
152
// Right aligned dropdowns
 
153
.pull-right > .dropdown-menu {
 
154
  right: 0;
 
155
  left: auto;
 
156
}
 
157
 
 
158
// Allow for dropdowns to go bottom up (aka, dropup-menu)
 
159
//
 
160
// Just add .dropup after the standard .dropdown class and you're set, bro.
 
161
// TODO: abstract this so that the navbar fixed styles are not placed here?
 
162
 
 
163
.dropup,
 
164
.navbar-fixed-bottom .dropdown {
 
165
  // Reverse the caret
 
166
  .caret {
 
167
    // Firefox fix for https://github.com/twbs/bootstrap/issues/9538. Once this
 
168
    // gets fixed, restore `border-top: 0;`.
 
169
    border-top: 0 dotted;
 
170
    border-bottom: 4px solid @dropdown-caret-color;
 
171
    content: "";
 
172
  }
 
173
  // Different positioning for bottom up menu
 
174
  .dropdown-menu {
 
175
    top: auto;
 
176
    bottom: 100%;
 
177
    margin-bottom: 1px;
 
178
  }
 
179
}
 
180
 
 
181
 
 
182
// Component alignment
 
183
//
 
184
// Reiterate per navbar.less and the modified component alignment there.
 
185
 
 
186
@media (min-width: @grid-float-breakpoint) {
 
187
  .navbar-right {
 
188
    .dropdown-menu {
 
189
      .pull-right > .dropdown-menu();
 
190
    }
 
191
  }
 
192
}
 
193