From 0a521dc6c932dd0cc59c437c436aff31470b946a Mon Sep 17 00:00:00 2001
From: Chriztian Steinmeier <chriztian@steinmeier.dk>
Date: Thu, 20 Sep 2018 21:53:55 +0200
Subject: [PATCH 1/2] Rename the `button` class to `picker-button`

---
 .../Shared/ListPicker/ListPickerEditor.css    | 24 +++++++++----------
 1 file changed, 12 insertions(+), 12 deletions(-)

diff --git a/source/nuPickers/Shared/ListPicker/ListPickerEditor.css b/source/nuPickers/Shared/ListPicker/ListPickerEditor.css
index 4c5ad4e..252bbaf 100644
--- a/source/nuPickers/Shared/ListPicker/ListPickerEditor.css
+++ b/source/nuPickers/Shared/ListPicker/ListPickerEditor.css
@@ -54,7 +54,7 @@
     border:1px solid #9e9e9e;
 }
 
-.list-picker .disabled { /* li and .button */
+.list-picker .disabled { /* li and .picker-button */
     opacity: 0.7;
     filter: alpha(opacity=70); /* msie */
 }
@@ -68,7 +68,7 @@
     padding-left:4px; /* TODO: move to a child element to avoid conflict with 90% / 10% widths */
 }
 
-.list-picker .button {
+.list-picker .picker-button {
     width: 10%;
     height: 100%;
     position: absolute;
@@ -76,17 +76,17 @@
     text-align:center;
 }
 
-.list-picker .button.disabled {
+.list-picker .picker-button.disabled {
     cursor:default; /* disable the hand */
 }
 
-.list-picker .button:hover,
+.list-picker .picker-button:hover,
 .list-picker .sort:hover
 {
     background-color: #ddd;
 }
 
-.list-picker .button.disabled:hover {
+.list-picker .picker-button.disabled:hover {
     background-color:transparent;
 }
 
@@ -102,7 +102,7 @@
                 {{ custom markup }}
             </div>
 
-            <a class="button (disabled)"></a>
+            <a class="picker-button (disabled)"></a>
 
         </li>
     </ul>
@@ -127,13 +127,13 @@
     text-align:left;
 }
 
-.list-picker .selectable .button {
+.list-picker .selectable .picker-button {
     right: 0;
     border-left: 1px solid #ccc;
 }
 
-.list-picker .disabled .button {
-    border-left:none; /* no icon, so remove the line indicating a button */
+.list-picker .disabled .picker-button {
+    border-left:none; /* no icon, so remove the line indicating a picker-button */
 }
 
 /*
@@ -141,7 +141,7 @@
         <ul class="bars selected">
             <li class="(lit)">
 
-                <a class="button"></a>
+                <a class="picker-button"></a>
 
                 <div class="option-label (sort)">
                     {{ custom markup }}
@@ -173,14 +173,14 @@
 }
 
 .list-picker .selected .option-label {
-    margin-left:10%; /* make space for the button */
+    margin-left:10%; /* make space for the picker-button */
 }
 
 .list-picker .selected .sort {
     cursor: move;
 }
 
-.list-picker .selected .button {
+.list-picker .selected .picker-button {
     left: 0;
     border-right: 1px solid #ccc;
 }

From 1a30e2565a7d8193f32716c237472468be04b71f Mon Sep 17 00:00:00 2001
From: Chriztian Steinmeier <chriztian@steinmeier.dk>
Date: Thu, 20 Sep 2018 21:54:49 +0200
Subject: [PATCH 2/2] Use `picker-button` and `color-{color}` classes

---
 .../Shared/ListPicker/ListPickerSelectablePartial.html          | 2 +-
 .../nuPickers/Shared/ListPicker/ListPickerSelectedPartial.html  | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/source/nuPickers/Shared/ListPicker/ListPickerSelectablePartial.html b/source/nuPickers/Shared/ListPicker/ListPickerSelectablePartial.html
index 8323e8a..9fc5b3a 100644
--- a/source/nuPickers/Shared/ListPicker/ListPickerSelectablePartial.html
+++ b/source/nuPickers/Shared/ListPicker/ListPickerSelectablePartial.html
@@ -11,7 +11,7 @@
         </div>
 
         <a href=""
-           class="button icon blue"
+           class="picker-button icon color-blue"
            ng-class="isValidSelection(option) ? 'active icon-add' : 'disabled'"
            ng-mouseenter="lit = isValidSelection(option)"
            ng-mouseleave="lit = false"
diff --git a/source/nuPickers/Shared/ListPicker/ListPickerSelectedPartial.html b/source/nuPickers/Shared/ListPicker/ListPickerSelectedPartial.html
index 69c4894..76f195d 100644
--- a/source/nuPickers/Shared/ListPicker/ListPickerSelectedPartial.html
+++ b/source/nuPickers/Shared/ListPicker/ListPickerSelectedPartial.html
@@ -8,7 +8,7 @@
             ng-repeat="option in selectedOptions track by $index">
 
             <a href=""
-               class="button icon icon-delete red"
+               class="picker-button icon icon-delete color-red"
                ng-mouseenter="lit = true"
                ng-mouseleave="lit = false"
                ng-click="deselectOption($index)">