Show random color button

css/style.css

@@ -1523,9 +1523,10 @@ ol[dnd-list] .dndPlaceholder {
 }
 
 .colorpicker .colorpicker-list li.randomcolour {
-  background-image: url('../../img/random.svg');
+  background-image: url('../img/random.svg');
   background-repeat: no-repeat;
   background-position: center center;
+  cursor: pointer;
 }
 
 #app-navigation .app-navigation-entry-edit input.icon-close {

img/random.svg

@@ -0,0 +1,28 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 15.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" id="Ebene_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 width="15px" height="15px" viewBox="0 0 15 15" enable-background="new 0 0 15 15" xml:space="preserve">
+<path fill="#FFFFFF" d="M5.575,4.563C5.24,5.076,4.858,5.837,4.428,6.848c-0.123-0.251-0.226-0.454-0.31-0.607
+	C4.035,6.087,3.921,5.91,3.779,5.709C3.637,5.508,3.495,5.351,3.353,5.236C3.21,5.122,3.034,5.024,2.825,4.943
+	C2.616,4.862,2.388,4.822,2.143,4.822H0.268c-0.078,0-0.143-0.025-0.193-0.075S0,4.632,0,4.554V2.947
+	c0-0.078,0.025-0.142,0.075-0.192S0.19,2.679,0.268,2.679h1.875C3.538,2.679,4.682,3.307,5.575,4.563z M15,11.251
+	c0,0.078-0.025,0.142-0.075,0.191l-2.679,2.68c-0.051,0.05-0.114,0.074-0.192,0.074c-0.073,0-0.136-0.025-0.188-0.079
+	c-0.053-0.053-0.08-0.116-0.08-0.188v-1.607c-0.178,0-0.415,0.002-0.711,0.005s-0.521,0.005-0.678,0.009
+	c-0.156,0.002-0.36,0-0.611-0.009s-0.449-0.022-0.594-0.042c-0.146-0.02-0.324-0.049-0.536-0.088s-0.388-0.091-0.527-0.154
+	c-0.14-0.064-0.301-0.145-0.486-0.239c-0.184-0.095-0.349-0.206-0.494-0.335c-0.145-0.128-0.298-0.277-0.46-0.447
+	c-0.162-0.17-0.318-0.364-0.469-0.582c0.329-0.52,0.709-1.281,1.139-2.285c0.123,0.251,0.226,0.453,0.31,0.607
+	c0.083,0.152,0.197,0.33,0.338,0.531C8.148,9.493,8.291,9.65,8.434,9.765s0.318,0.212,0.527,0.293s0.437,0.121,0.682,0.121h2.143
+	V8.571c0-0.077,0.025-0.142,0.076-0.192c0.05-0.05,0.114-0.074,0.192-0.074c0.067,0,0.134,0.027,0.2,0.083l2.671,2.67
+	C14.975,11.108,15,11.173,15,11.251z M15,3.75c0,0.078-0.025,0.142-0.075,0.192l-2.679,2.679c-0.051,0.05-0.114,0.075-0.192,0.075
+	c-0.073,0-0.136-0.026-0.188-0.08c-0.053-0.053-0.08-0.116-0.08-0.188V4.822H9.643c-0.268,0-0.51,0.042-0.729,0.125
+	c-0.217,0.084-0.41,0.209-0.577,0.377S8.027,5.663,7.91,5.839S7.667,6.231,7.534,6.488C7.355,6.833,7.137,7.311,6.88,7.919
+	c-0.162,0.368-0.3,0.678-0.414,0.93c-0.114,0.25-0.265,0.543-0.452,0.879c-0.187,0.334-0.365,0.613-0.536,0.836
+	c-0.17,0.224-0.376,0.455-0.62,0.695c-0.243,0.24-0.494,0.432-0.753,0.573c-0.26,0.143-0.557,0.26-0.892,0.352
+	c-0.335,0.093-0.692,0.138-1.071,0.138H0.268c-0.078,0-0.143-0.024-0.193-0.074C0.025,12.196,0,12.132,0,12.054v-1.607
+	c0-0.078,0.025-0.142,0.075-0.191c0.05-0.051,0.115-0.076,0.193-0.076h1.875c0.268,0,0.51-0.041,0.728-0.125s0.41-0.209,0.578-0.377
+	s0.31-0.339,0.427-0.515s0.243-0.392,0.377-0.648C4.431,8.168,4.648,7.69,4.905,7.082c0.162-0.369,0.3-0.678,0.414-0.929
+	c0.115-0.251,0.265-0.544,0.452-0.879S6.137,4.66,6.307,4.437c0.17-0.224,0.377-0.455,0.62-0.695C7.169,3.502,7.42,3.311,7.68,3.168
+	c0.259-0.142,0.556-0.259,0.891-0.352c0.335-0.092,0.692-0.138,1.071-0.138h2.143V1.072c0-0.078,0.025-0.142,0.076-0.192
+	c0.05-0.05,0.114-0.075,0.192-0.075c0.067,0,0.134,0.028,0.2,0.083l2.671,2.67C14.975,3.608,15,3.672,15,3.75z"/>
+</svg>

templates/colorpicker.html

@@ -3,7 +3,7 @@
 		ng-class="{ selected: (color===selected) }"
 		ng-click="pick(color)"
 		ng-style="{ 'background-color':color}; "></li>
-	<!--<li class="randomcolour"
+	<li class="randomcolour"
 		ng-click="randomizeColour()"
-		ng-style="{ 'background-color':random}; "></li>-->
+		ng-style="{ 'background-color':random}; "></li>
 </ul>