Skip to content

Commit 08adf8c

Browse files
committed
Merge pull request #40 from Kraku/divider-label
Divider label
2 parents 1afbeda + 518169b commit 08adf8c

File tree

7 files changed

+60
-14
lines changed

7 files changed

+60
-14
lines changed

README.md

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -26,6 +26,10 @@ app.controller('AppCtrl', function($scope) {
2626
// If an options object has an 'href' property set, then that dropdown entry
2727
// will behave as a link and cannot be selected.
2828
$scope.ddSelectOptions = [
29+
{
30+
text: 'divider label',
31+
divider: true
32+
},
2933
{
3034
text: 'Option1',
3135
value: 'a value'

angular-dropdowns.css

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -63,6 +63,13 @@
6363
background: #e6e8ea;
6464
}
6565

66+
.wrap-dd-select .dropdown li.divider-label {
67+
background: #e6e8ea;
68+
cursor: default;
69+
color: #000;
70+
padding: 10px 0;
71+
}
72+
6673
.wrap-dd-select .dropdown li a {
6774
display: block;
6875
padding: 10px;
@@ -157,6 +164,13 @@
157164
background: #e6e8ea;
158165
}
159166

167+
.wrap-dd-menu .dropdown li.divider-label {
168+
background: #e6e8ea;
169+
cursor: default;
170+
color: #000;
171+
padding: 10px 0;
172+
}
173+
160174
.wrap-dd-menu .dropdown li a {
161175
display: block;
162176
padding: 10px;

angular-dropdowns.js

Lines changed: 8 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -21,13 +21,16 @@ dd.run(['$templateCache', function ($templateCache) {
2121
].join(''));
2222

2323
$templateCache.put('ngDropdowns/templates/dropdownSelectItem.html', [
24-
'<li ng-class="{divider: dropdownSelectItem.divider}">',
24+
'<li ng-class="{divider: (dropdownSelectItem.divider && !dropdownSelectItem.text), \'divider-label\': (dropdownSelectItem.divider && dropdownSelectItem.text)}">',
2525
'<a href="" class="dropdown-item"',
2626
' ng-if="!dropdownSelectItem.divider"',
2727
' ng-href="{{dropdownSelectItem.href}}"',
2828
' ng-click="selectItem()">',
2929
'{{dropdownSelectItem[dropdownItemLabel]}}',
3030
'</a>',
31+
'<span ng-if="dropdownSelectItem.divider">',
32+
'{{dropdownSelectItem.text}}',
33+
'</span>',
3134
'</li>'
3235
].join(''));
3336

@@ -42,13 +45,16 @@ dd.run(['$templateCache', function ($templateCache) {
4245
].join(''));
4346

4447
$templateCache.put('ngDropdowns/templates/dropdownMenuItem.html', [
45-
'<li ng-class="{divider: dropdownMenuItem.divider}">',
48+
'<li ng-class="{divider: dropdownMenuItem.divider, \'divider-label\': dropdownMenuItem.divider && dropdownMenuItem.text}">',
4649
'<a href="" class="dropdown-item"',
4750
' ng-if="!dropdownMenuItem.divider"',
4851
' ng-href="{{dropdownMenuItem.href}}"',
4952
' ng-click="selectItem()">',
5053
'{{dropdownMenuItem[dropdownItemLabel]}}',
5154
'</a>',
55+
'<span ng-if="dropdownMenuItem.divider">',
56+
'{{dropdownMenuItem.text}}',
57+
'</span>',
5258
'</li>'
5359
].join(''));
5460

dist/angular-dropdowns.css

Lines changed: 19 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -55,15 +55,21 @@
5555
list-style: none;
5656

5757
/* Hiding */
58-
opacity: 0;
59-
pointer-events: none;
58+
visibility: hidden;
6059
}
6160

6261
.wrap-dd-select .dropdown li.divider {
6362
padding: 2px 0;
6463
background: #e6e8ea;
6564
}
6665

66+
.wrap-dd-select .dropdown li.divider-label {
67+
background: #e6e8ea;
68+
cursor: default;
69+
color: #000;
70+
padding: 10px 0;
71+
}
72+
6773
.wrap-dd-select .dropdown li a {
6874
display: block;
6975
padding: 10px;
@@ -119,8 +125,7 @@
119125
}
120126

121127
.wrap-dd-select.active .dropdown {
122-
opacity: 1;
123-
pointer-events: auto;
128+
visibility: visible;
124129
}
125130

126131
/****** dropdown-menu *******/
@@ -151,15 +156,21 @@
151156
list-style: none;
152157

153158
/* Hiding */
154-
opacity: 0;
155-
pointer-events: none;
159+
visibility: hidden;
156160
}
157161

158162
.wrap-dd-menu .dropdown li.divider {
159163
padding: 2px 0;
160164
background: #e6e8ea;
161165
}
162166

167+
.wrap-dd-menu .dropdown li.divider-label {
168+
background: #e6e8ea;
169+
cursor: default;
170+
color: #000;
171+
padding: 10px 0;
172+
}
173+
163174
.wrap-dd-menu .dropdown li a {
164175
display: block;
165176
padding: 10px;
@@ -214,6 +225,5 @@
214225
}
215226

216227
.wrap-dd-menu .dropdown.active {
217-
opacity: 1;
218-
pointer-events: auto;
219-
}
228+
visibility: visible;
229+
}

dist/angular-dropdowns.js

Lines changed: 8 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -21,13 +21,16 @@ dd.run(['$templateCache', function ($templateCache) {
2121
].join(''));
2222

2323
$templateCache.put('ngDropdowns/templates/dropdownSelectItem.html', [
24-
'<li ng-class="{divider: dropdownSelectItem.divider}">',
24+
'<li ng-class="{divider: (dropdownSelectItem.divider && !dropdownSelectItem.text), \'divider-label\': (dropdownSelectItem.divider && dropdownSelectItem.text)}">',
2525
'<a href="" class="dropdown-item"',
2626
' ng-if="!dropdownSelectItem.divider"',
2727
' ng-href="{{dropdownSelectItem.href}}"',
2828
' ng-click="selectItem()">',
2929
'{{dropdownSelectItem[dropdownItemLabel]}}',
3030
'</a>',
31+
'<span ng-if="dropdownSelectItem.divider">',
32+
'{{dropdownSelectItem.text}}',
33+
'</span>',
3134
'</li>'
3235
].join(''));
3336

@@ -42,13 +45,16 @@ dd.run(['$templateCache', function ($templateCache) {
4245
].join(''));
4346

4447
$templateCache.put('ngDropdowns/templates/dropdownMenuItem.html', [
45-
'<li ng-class="{divider: dropdownMenuItem.divider}">',
48+
'<li ng-class="{divider: dropdownMenuItem.divider, \'divider-label\': dropdownMenuItem.divider && dropdownMenuItem.text}">',
4649
'<a href="" class="dropdown-item"',
4750
' ng-if="!dropdownMenuItem.divider"',
4851
' ng-href="{{dropdownMenuItem.href}}"',
4952
' ng-click="selectItem()">',
5053
'{{dropdownMenuItem[dropdownItemLabel]}}',
5154
'</a>',
55+
'<span ng-if="dropdownMenuItem.divider">',
56+
'{{dropdownMenuItem.text}}',
57+
'</span>',
5258
'</li>'
5359
].join(''));
5460

dist/angular-dropdowns.min.js

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

example/app.js

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,9 @@ var app = angular.module('app', ['ngDropdowns']);
55
app.controller('AppCtrl', function($scope) {
66
$scope.ddSelectOptions = [
77
{
8+
text: 'Label',
9+
divider: true
10+
}, {
811
text: 'Option1',
912
value: 'one',
1013
iconCls: 'someicon'
@@ -25,6 +28,9 @@ app.controller('AppCtrl', function($scope) {
2528

2629
$scope.ddMenuOptions = [
2730
{
31+
text: 'Label',
32+
divider: true
33+
}, {
2834
text: 'Option1',
2935
iconCls: 'someicon'
3036
}, {

0 commit comments

Comments
 (0)