0000: 24 6f 75 74 6c 69 6e 65 2d 63 6f 6c 6f 72 3a 20 $outline-color:
0010: 72 67 62 61 28 30 2c 20 30 2c 20 30 2c 20 30 2e rgba(0, 0, 0, 0.
0020: 32 29 3b 0a 24 62 6f 78 2d 73 68 61 64 6f 77 2d 2);.$box-shadow-
0030: 6f 75 74 6c 69 6e 65 3a 20 30 20 30 20 30 20 31 outline: 0 0 0 1
0040: 70 78 20 24 6f 75 74 6c 69 6e 65 2d 63 6f 6c 6f px $outline-colo
0050: 72 3b 0a 24 62 61 72 2d 73 69 7a 65 2d 73 68 6f r;.$bar-size-sho
0060: 72 74 3a 20 31 36 70 78 20 21 64 65 66 61 75 6c rt: 16px !defaul
0070: 74 3b 0a 24 62 61 73 65 2d 6d 61 72 67 69 6e 3a t;.$base-margin:
0080: 20 36 70 78 20 21 64 65 66 61 75 6c 74 3b 0a 24 6px !default;.$
0090: 63 6f 6c 75 6d 6e 73 3a 20 36 20 21 64 65 66 61 columns: 6 !defa
00a0: 75 6c 74 3b 20 2f 2f 20 74 68 69 73 20 61 66 66 ult; // this aff
00b0: 65 63 74 73 20 74 68 65 20 6e 75 6d 62 65 72 20 ects the number
00c0: 6f 66 20 73 77 61 74 63 68 65 73 20 70 65 72 20 of swatches per
00d0: 72 6f 77 20 61 6e 64 20 74 68 65 20 77 69 64 74 row and the widt
00e0: 68 20 6f 66 20 74 68 65 20 63 6f 6c 6f 72 20 70 h of the color p
00f0: 69 63 6b 65 72 2c 20 73 61 74 75 72 61 74 69 6f icker, saturatio
0100: 6e 2c 20 65 74 63 2e 0a 24 62 61 72 2d 73 69 7a n, etc..$bar-siz
0110: 65 2d 6c 61 72 67 65 3a 20 28 24 62 61 72 2d 73 e-large: ($bar-s
0120: 69 7a 65 2d 73 68 6f 72 74 20 2a 20 24 63 6f 6c ize-short * $col
0130: 75 6d 6e 73 29 20 2b 20 28 24 62 61 73 65 2d 6d umns) + ($base-m
0140: 61 72 67 69 6e 20 2a 20 28 24 63 6f 6c 75 6d 6e argin * ($column
0150: 73 20 2d 20 31 29 29 3b 0a 0a 40 6d 69 78 69 6e s - 1));..@mixin
0160: 20 62 67 43 68 65 63 6b 65 72 42 6f 78 28 24 73 bgCheckerBox($s
0170: 69 7a 65 3a 20 31 30 70 78 29 20 7b 0a 20 20 62 ize: 10px) {. b
0180: 61 63 6b 67 72 6f 75 6e 64 3a 20 6c 69 6e 65 61 ackground: linea
0190: 72 2d 67 72 61 64 69 65 6e 74 28 34 35 64 65 67 r-gradient(45deg
01a0: 2c 20 72 67 62 61 28 30 2c 20 30 2c 20 30 2c 20 , rgba(0, 0, 0,
01b0: 30 2e 31 29 20 32 35 25 2c 20 72 67 62 61 28 30 0.1) 25%, rgba(0
01c0: 2c 20 30 2c 20 30 2c 20 30 29 20 32 35 25 2c 20 , 0, 0, 0) 25%,
01d0: 72 67 62 61 28 30 2c 20 30 2c 20 30 2c 20 30 29 rgba(0, 0, 0, 0)
01e0: 20 37 35 25 2c 20 72 67 62 61 28 30 2c 20 30 2c 75%, rgba(0, 0,
01f0: 20 30 2c 20 30 2e 31 29 20 37 35 25 2c 20 72 67 0, 0.1) 75%, rg
0200: 62 61 28 30 2c 20 30 2c 20 30 2c 20 30 2e 31 29 ba(0, 0, 0, 0.1)
0210: 20 30 29 2c 0a 20 20 6c 69 6e 65 61 72 2d 67 72 0),. linear-gr
0220: 61 64 69 65 6e 74 28 34 35 64 65 67 2c 20 72 67 adient(45deg, rg
0230: 62 61 28 30 2c 20 30 2c 20 30 2c 20 30 2e 31 29 ba(0, 0, 0, 0.1)
0240: 20 32 35 25 2c 20 72 67 62 61 28 30 2c 20 30 2c 25%, rgba(0, 0,
0250: 20 30 2c 20 30 29 20 32 35 25 2c 20 72 67 62 61 0, 0) 25%, rgba
0260: 28 30 2c 20 30 2c 20 30 2c 20 30 29 20 37 35 25 (0, 0, 0, 0) 75%
0270: 2c 20 72 67 62 61 28 30 2c 20 30 2c 20 30 2c 20 , rgba(0, 0, 0,
0280: 30 2e 31 29 20 37 35 25 2c 20 72 67 62 61 28 30 0.1) 75%, rgba(0
0290: 2c 20 30 2c 20 30 2c 20 30 2e 31 29 20 30 29 2c , 0, 0, 0.1) 0),
02a0: 0a 20 20 72 67 62 28 32 35 35 2c 20 32 35 35 2c . rgb(255, 255,
02b0: 20 32 35 35 29 3b 0a 20 20 62 61 63 6b 67 72 6f 255);. backgro
02c0: 75 6e 64 2d 73 69 7a 65 3a 20 24 73 69 7a 65 20 und-size: $size
02d0: 24 73 69 7a 65 3b 0a 20 20 62 61 63 6b 67 72 6f $size;. backgro
02e0: 75 6e 64 2d 70 6f 73 69 74 69 6f 6e 3a 20 30 20 und-position: 0
02f0: 30 2c 20 24 73 69 7a 65 2f 32 20 24 73 69 7a 65 0, $size/2 $size
0300: 2f 32 3b 0a 7d 0a 0a 40 6d 69 78 69 6e 20 62 67 /2;.}..@mixin bg
0310: 53 61 74 75 72 61 74 69 6f 6e 28 29 20 7b 0a 20 Saturation() {.
0320: 20 62 61 63 6b 67 72 6f 75 6e 64 3a 20 2d 6d 6f background: -mo
0330: 7a 2d 6c 69 6e 65 61 72 2d 67 72 61 64 69 65 6e z-linear-gradien
0340: 74 28 74 6f 70 2c 20 72 67 62 61 28 30 2c 20 30 t(top, rgba(0, 0
0350: 2c 20 30 2c 20 30 29 20 30 25 2c 20 72 67 62 61 , 0, 0) 0%, rgba
0360: 28 30 2c 20 30 2c 20 30 2c 20 31 29 20 31 30 30 (0, 0, 0, 1) 100
0370: 25 29 2c 0a 20 20 2d 6d 6f 7a 2d 6c 69 6e 65 61 %),. -moz-linea
0380: 72 2d 67 72 61 64 69 65 6e 74 28 6c 65 66 74 2c r-gradient(left,
0390: 20 72 67 62 61 28 32 35 35 2c 20 32 35 35 2c 20 rgba(255, 255,
03a0: 32 35 35 2c 20 31 29 20 30 25 2c 20 72 67 62 61 255, 1) 0%, rgba
03b0: 28 32 35 35 2c 20 32 35 35 2c 20 32 35 35 2c 20 (255, 255, 255,
03c0: 30 29 20 31 30 30 25 29 3b 20 2f 2a 20 46 46 33 0) 100%); /* FF3
03d0: 2e 36 2b 20 2a 2f 0a 20 20 62 61 63 6b 67 72 6f .6+ */. backgro
03e0: 75 6e 64 3a 20 2d 77 65 62 6b 69 74 2d 67 72 61 und: -webkit-gra
03f0: 64 69 65 6e 74 28 6c 69 6e 65 61 72 2c 20 6c 65 dient(linear, le
0400: 66 74 20 74 6f 70 2c 20 6c 65 66 74 20 62 6f 74 ft top, left bot
0410: 74 6f 6d 2c 20 63 6f 6c 6f 72 2d 73 74 6f 70 28 tom, color-stop(
0420: 30 25 2c 20 72 67 62 61 28 30 2c 20 30 2c 20 30 0%, rgba(0, 0, 0
0430: 2c 20 30 29 29 2c 20 63 6f 6c 6f 72 2d 73 74 6f , 0)), color-sto
0440: 70 28 31 30 30 25 2c 20 72 67 62 61 28 30 2c 20 p(100%, rgba(0,
0450: 30 2c 20 30 2c 20 31 29 29 29 2c 0a 20 20 2d 77 0, 0, 1))),. -w
0460: 65 62 6b 69 74 2d 67 72 61 64 69 65 6e 74 28 6c ebkit-gradient(l
0470: 69 6e 65 61 72 2c 20 6c 65 66 74 20 74 6f 70 2c inear, left top,
0480: 20 72 69 67 68 74 20 74 6f 70 2c 20 63 6f 6c 6f right top, colo
0490: 72 2d 73 74 6f 70 28 30 25 2c 20 72 67 62 61 28 r-stop(0%, rgba(
04a0: 32 35 35 2c 20 32 35 35 2c 20 32 35 35 2c 20 31 255, 255, 255, 1
04b0: 29 29 2c 20 63 6f 6c 6f 72 2d 73 74 6f 70 28 31 )), color-stop(1
04c0: 30 30 25 2c 20 72 67 62 61 28 32 35 35 2c 20 32 00%, rgba(255, 2
04d0: 35 35 2c 20 32 35 35 2c 20 30 29 29 29 3b 20 2f 55, 255, 0))); /
04e0: 2a 20 43 68 72 6f 6d 65 2c 53 61 66 61 72 69 34 * Chrome,Safari4
04f0: 2b 20 2a 2f 0a 20 20 62 61 63 6b 67 72 6f 75 6e + */. backgroun
0500: 64 3a 20 2d 77 65 62 6b 69 74 2d 6c 69 6e 65 61 d: -webkit-linea
0510: 72 2d 67 72 61 64 69 65 6e 74 28 74 6f 70 2c 20 r-gradient(top,
0520: 72 67 62 61 28 30 2c 20 30 2c 20 30 2c 20 30 29 rgba(0, 0, 0, 0)
0530: 20 30 25 2c 20 72 67 62 61 28 30 2c 20 30 2c 20 0%, rgba(0, 0,
0540: 30 2c 20 31 29 20 31 30 30 25 29 2c 0a 20 20 2d 0, 1) 100%),. -
0550: 77 65 62 6b 69 74 2d 6c 69 6e 65 61 72 2d 67 72 webkit-linear-gr
0560: 61 64 69 65 6e 74 28 6c 65 66 74 2c 20 72 67 62 adient(left, rgb
0570: 61 28 32 35 35 2c 20 32 35 35 2c 20 32 35 35 2c a(255, 255, 255,
0580: 20 31 29 20 30 25 2c 20 72 67 62 61 28 32 35 35 1) 0%, rgba(255
0590: 2c 20 32 35 35 2c 20 32 35 35 2c 20 30 29 20 31 , 255, 255, 0) 1
05a0: 30 30 25 29 3b 20 2f 2a 20 43 68 72 6f 6d 65 31 00%); /* Chrome1
05b0: 30 2b 2c 53 61 66 61 72 69 35 2e 31 2b 20 2a 2f 0+,Safari5.1+ */
05c0: 0a 20 20 62 61 63 6b 67 72 6f 75 6e 64 3a 20 2d . background: -
05d0: 6f 2d 6c 69 6e 65 61 72 2d 67 72 61 64 69 65 6e o-linear-gradien
05e0: 74 28 74 6f 70 2c 20 72 67 62 61 28 30 2c 20 30 t(top, rgba(0, 0
05f0: 2c 20 30 2c 20 30 29 20 30 25 2c 20 72 67 62 61 , 0, 0) 0%, rgba
0600: 28 30 2c 20 30 2c 20 30 2c 20 31 29 20 31 30 30 (0, 0, 0, 1) 100
0610: 25 29 2c 0a 20 20 2d 6f 2d 6c 69 6e 65 61 72 2d %),. -o-linear-
0620: 67 72 61 64 69 65 6e 74 28 6c 65 66 74 2c 20 72 gradient(left, r
0630: 67 62 61 28 32 35 35 2c 20 32 35 35 2c 20 32 35 gba(255, 255, 25
0640: 35 2c 20 31 29 20 30 25 2c 20 72 67 62 61 28 32 5, 1) 0%, rgba(2
0650: 35 35 2c 20 32 35 35 2c 20 32 35 35 2c 20 30 29 55, 255, 255, 0)
0660: 20 31 30 30 25 29 3b 20 2f 2a 20 4f 70 65 72 61 100%); /* Opera
0670: 20 31 31 2e 31 30 2b 20 2a 2f 0a 20 20 62 61 63 11.10+ */. bac
0680: 6b 67 72 6f 75 6e 64 3a 20 2d 6d 73 2d 6c 69 6e kground: -ms-lin
0690: 65 61 72 2d 67 72 61 64 69 65 6e 74 28 74 6f 70 ear-gradient(top
06a0: 2c 20 72 67 62 61 28 30 2c 20 30 2c 20 30 2c 20 , rgba(0, 0, 0,
06b0: 30 29 20 30 25 2c 20 72 67 62 61 28 30 2c 20 30 0) 0%, rgba(0, 0
06c0: 2c 20 30 2c 20 31 29 20 31 30 30 25 29 2c 0a 20 , 0, 1) 100%),.
06d0: 20 2d 6d 73 2d 6c 69 6e 65 61 72 2d 67 72 61 64 -ms-linear-grad
06e0: 69 65 6e 74 28 6c 65 66 74 2c 20 72 67 62 61 28 ient(left, rgba(
06f0: 32 35 35 2c 20 32 35 35 2c 20 32 35 35 2c 20 31 255, 255, 255, 1
0700: 29 20 30 25 2c 20 72 67 62 61 28 32 35 35 2c 20 ) 0%, rgba(255,
0710: 32 35 35 2c 20 32 35 35 2c 20 30 29 20 31 30 30 255, 255, 0) 100
0720: 25 29 3b 20 2f 2a 20 49 45 31 30 2b 20 2a 2f 0a %); /* IE10+ */.
0730: 20 20 62 61 63 6b 67 72 6f 75 6e 64 3a 20 6c 69 background: li
0740: 6e 65 61 72 2d 67 72 61 64 69 65 6e 74 28 74 6f near-gradient(to
0750: 20 62 6f 74 74 6f 6d 2c 20 72 67 62 61 28 30 2c bottom, rgba(0,
0760: 20 30 2c 20 30 2c 20 30 29 20 30 25 2c 20 72 67 0, 0, 0) 0%, rg
0770: 62 61 28 30 2c 20 30 2c 20 30 2c 20 31 29 20 31 ba(0, 0, 0, 1) 1
0780: 30 30 25 29 2c 0a 20 20 6c 69 6e 65 61 72 2d 67 00%),. linear-g
0790: 72 61 64 69 65 6e 74 28 74 6f 20 72 69 67 68 74 radient(to right
07a0: 2c 20 72 67 62 61 28 32 35 35 2c 20 32 35 35 2c , rgba(255, 255,
07b0: 20 32 35 35 2c 20 31 29 20 30 25 2c 20 72 67 62 255, 1) 0%, rgb
07c0: 61 28 32 35 35 2c 20 32 35 35 2c 20 32 35 35 2c a(255, 255, 255,
07d0: 20 30 29 20 31 30 30 25 29 3b 20 2f 2a 20 57 33 0) 100%); /* W3
07e0: 43 20 2a 2f 0a 7d 0a 0a 40 6d 69 78 69 6e 20 62 C */.}..@mixin b
07f0: 67 48 75 65 48 6f 72 69 7a 6f 6e 74 61 6c 28 29 gHueHorizontal()
0800: 20 7b 0a 20 20 62 61 63 6b 67 72 6f 75 6e 64 3a {. background:
0810: 20 2d 6d 6f 7a 2d 6c 69 6e 65 61 72 2d 67 72 61 -moz-linear-gra
0820: 64 69 65 6e 74 28 72 69 67 68 74 2c 20 72 67 62 dient(right, rgb
0830: 28 32 35 35 2c 20 30 2c 20 30 29 20 30 25 2c 20 (255, 0, 0) 0%,
0840: 72 67 62 28 32 35 35 2c 20 31 32 38 2c 20 30 29 rgb(255, 128, 0)
0850: 20 38 25 2c 20 72 67 62 28 32 35 35 2c 20 32 35 8%, rgb(255, 25
0860: 35 2c 20 30 29 20 31 37 25 2c 20 72 67 62 28 31 5, 0) 17%, rgb(1
0870: 32 38 2c 20 32 35 35 2c 20 30 29 20 32 35 25 2c 28, 255, 0) 25%,
0880: 20 72 67 62 28 30 2c 20 32 35 35 2c 20 30 29 20 rgb(0, 255, 0)
0890: 33 33 25 2c 20 72 67 62 28 30 2c 20 32 35 35 2c 33%, rgb(0, 255,
08a0: 20 31 32 38 29 20 34 32 25 2c 20 72 67 62 28 30 128) 42%, rgb(0
08b0: 2c 20 32 35 35 2c 20 32 35 35 29 20 35 30 25 2c , 255, 255) 50%,
08c0: 20 72 67 62 28 30 2c 20 31 32 38 2c 20 32 35 35 rgb(0, 128, 255
08d0: 29 20 35 38 25 2c 20 72 67 62 28 30 2c 20 30 2c ) 58%, rgb(0, 0,
08e0: 20 32 35 35 29 20 36 37 25 2c 20 72 67 62 28 31 255) 67%, rgb(1
08f0: 32 38 2c 20 30 2c 20 32 35 35 29 20 37 35 25 2c 28, 0, 255) 75%,
0900: 20 72 67 62 28 32 35 35 2c 20 30 2c 20 32 35 35 rgb(255, 0, 255
0910: 29 20 38 33 25 2c 20 72 67 62 28 32 35 35 2c 20 ) 83%, rgb(255,
0920: 30 2c 20 31 32 38 29 20 39 32 25 2c 20 72 67 62 0, 128) 92%, rgb
0930: 28 32 35 35 2c 20 30 2c 20 30 29 20 31 30 30 25 (255, 0, 0) 100%
0940: 29 3b 20 2f 2a 20 46 46 33 2e 36 2b 20 2a 2f 0a ); /* FF3.6+ */.
0950: 20 20 62 61 63 6b 67 72 6f 75 6e 64 3a 20 2d 77 background: -w
0960: 65 62 6b 69 74 2d 67 72 61 64 69 65 6e 74 28 6c ebkit-gradient(l
0970: 69 6e 65 61 72 2c 20 72 69 67 68 74 20 74 6f 70 inear, right top
0980: 2c 20 6c 65 66 74 20 74 6f 70 2c 20 63 6f 6c 6f , left top, colo
0990: 72 2d 73 74 6f 70 28 30 25 2c 20 72 67 62 28 32 r-stop(0%, rgb(2
09a0: 35 35 2c 20 30 2c 20 30 29 29 2c 20 63 6f 6c 6f 55, 0, 0)), colo
09b0: 72 2d 73 74 6f 70 28 38 25 2c 20 72 67 62 28 32 r-stop(8%, rgb(2
09c0: 35 35 2c 20 31 32 38 2c 20 30 29 29 2c 20 63 6f 55, 128, 0)), co
09d0: 6c 6f 72 2d 73 74 6f 70 28 31 37 25 2c 20 72 67 lor-stop(17%, rg
09e0: 62 28 32 35 35 2c 20 32 35 35 2c 20 30 29 29 2c b(255, 255, 0)),
09f0: 20 63 6f 6c 6f 72 2d 73 74 6f 70 28 32 35 25 2c color-stop(25%,
0a00: 20 72 67 62 28 31 32 38 2c 20 32 35 35 2c 20 30 rgb(128, 255, 0
0a10: 29 29 2c 20 63 6f 6c 6f 72 2d 73 74 6f 70 28 33 )), color-stop(3
0a20: 33 25 2c 20 72 67 62 28 30 2c 20 32 35 35 2c 20 3%, rgb(0, 255,
0a30: 30 29 29 2c 20 63 6f 6c 6f 72 2d 73 74 6f 70 28 0)), color-stop(
0a40: 34 32 25 2c 20 72 67 62 28 30 2c 20 32 35 35 2c 42%, rgb(0, 255,
0a50: 20 31 32 38 29 29 2c 20 63 6f 6c 6f 72 2d 73 74 128)), color-st
0a60: 6f 70 28 35 30 25 2c 20 72 67 62 28 30 2c 20 32 op(50%, rgb(0, 2
0a70: 35 35 2c 20 32 35 35 29 29 2c 20 63 6f 6c 6f 72 55, 255)), color
0a80: 2d 73 74 6f 70 28 35 38 25 2c 20 72 67 62 28 30 -stop(58%, rgb(0
0a90: 2c 20 31 32 38 2c 20 32 35 35 29 29 2c 20 63 6f , 128, 255)), co
0aa0: 6c 6f 72 2d 73 74 6f 70 28 36 37 25 2c 20 72 67 lor-stop(67%, rg
0ab0: 62 28 30 2c 20 30 2c 20 32 35 35 29 29 2c 20 63 b(0, 0, 255)), c
0ac0: 6f 6c 6f 72 2d 73 74 6f 70 28 37 35 25 2c 20 72 olor-stop(75%, r
0ad0: 67 62 28 31 32 38 2c 20 30 2c 20 32 35 35 29 29 gb(128, 0, 255))
0ae0: 2c 20 63 6f 6c 6f 72 2d 73 74 6f 70 28 38 33 25 , color-stop(83%
0af0: 2c 20 72 67 62 28 32 35 35 2c 20 30 2c 20 32 35 , rgb(255, 0, 25
0b00: 35 29 29 2c 20 63 6f 6c 6f 72 2d 73 74 6f 70 28 5)), color-stop(
0b10: 39 32 25 2c 20 72 67 62 28 32 35 35 2c 20 30 2c 92%, rgb(255, 0,
0b20: 20 31 32 38 29 29 2c 20 63 6f 6c 6f 72 2d 73 74 128)), color-st
0b30: 6f 70 28 31 30 30 25 2c 20 72 67 62 28 32 35 35 op(100%, rgb(255
0b40: 2c 20 30 2c 20 30 29 29 29 3b 20 2f 2a 20 43 68 , 0, 0))); /* Ch
0b50: 72 6f 6d 65 2c 53 61 66 61 72 69 34 2b 20 2a 2f rome,Safari4+ */
0b60: 0a 20 20 62 61 63 6b 67 72 6f 75 6e 64 3a 20 2d . background: -
0b70: 77 65 62 6b 69 74 2d 6c 69 6e 65 61 72 2d 67 72 webkit-linear-gr
0b80: 61 64 69 65 6e 74 28 72 69 67 68 74 2c 20 72 67 adient(right, rg
0b90: 62 28 32 35 35 2c 20 30 2c 20 30 29 20 30 25 2c b(255, 0, 0) 0%,
0ba0: 20 72 67 62 28 32 35 35 2c 20 31 32 38 2c 20 30 rgb(255, 128, 0
0bb0: 29 20 38 25 2c 20 72 67 62 28 32 35 35 2c 20 32 ) 8%, rgb(255, 2
0bc0: 35 35 2c 20 30 29 20 31 37 25 2c 20 72 67 62 28 55, 0) 17%, rgb(
0bd0: 31 32 38 2c 20 32 35 35 2c 20 30 29 20 32 35 25 128, 255, 0) 25%
0be0: 2c 20 72 67 62 28 30 2c 20 32 35 35 2c 20 30 29 , rgb(0, 255, 0)
0bf0: 20 33 33 25 2c 20 72 67 62 28 30 2c 20 32 35 35 33%, rgb(0, 255
0c00: 2c 20 31 32 38 29 20 34 32 25 2c 20 72 67 62 28 , 128) 42%, rgb(
0c10: 30 2c 20 32 35 35 2c 20 32 35 35 29 20 35 30 25 0, 255, 255) 50%
0c20: 2c 20 72 67 62 28 30 2c 20 31 32 38 2c 20 32 35 , rgb(0, 128, 25
0c30: 35 29 20 35 38 25 2c 20 72 67 62 28 30 2c 20 30 5) 58%, rgb(0, 0
0c40: 2c 20 32 35 35 29 20 36 37 25 2c 20 72 67 62 28 , 255) 67%, rgb(
0c50: 31 32 38 2c 20 30 2c 20 32 35 35 29 20 37 35 25 128, 0, 255) 75%
0c60: 2c 20 72 67 62 28 32 35 35 2c 20 30 2c 20 32 35 , rgb(255, 0, 25
0c70: 35 29 20 38 33 25 2c 20 72 67 62 28 32 35 35 2c 5) 83%, rgb(255,
0c80: 20 30 2c 20 31 32 38 29 20 39 32 25 2c 20 72 67 0, 128) 92%, rg
0c90: 62 28 32 35 35 2c 20 30 2c 20 30 29 20 31 30 30 b(255, 0, 0) 100
0ca0: 25 29 3b 20 2f 2a 20 43 68 72 6f 6d 65 31 30 2b %); /* Chrome10+
0cb0: 2c 53 61 66 61 72 69 35 2e 31 2b 20 2a 2f 0a 20 ,Safari5.1+ */.
0cc0: 20 62 61 63 6b 67 72 6f 75 6e 64 3a 20 2d 6f 2d background: -o-
0cd0: 6c 69 6e 65 61 72 2d 67 72 61 64 69 65 6e 74 28 linear-gradient(
0ce0: 72 69 67 68 74 2c 20 72 67 62 28 32 35 35 2c 20 right, rgb(255,
0cf0: 30 2c 20 30 29 20 30 25 2c 20 72 67 62 28 32 35 0, 0) 0%, rgb(25
0d00: 35 2c 20 31 32 38 2c 20 30 29 20 38 25 2c 20 72 5, 128, 0) 8%, r
0d10: 67 62 28 32 35 35 2c 20 32 35 35 2c 20 30 29 20 gb(255, 255, 0)
0d20: 31 37 25 2c 20 72 67 62 28 31 32 38 2c 20 32 35 17%, rgb(128, 25
0d30: 35 2c 20 30 29 20 32 35 25 2c 20 72 67 62 28 30 5, 0) 25%, rgb(0
0d40: 2c 20 32 35 35 2c 20 30 29 20 33 33 25 2c 20 72 , 255, 0) 33%, r
0d50: 67 62 28 30 2c 20 32 35 35 2c 20 31 32 38 29 20 gb(0, 255, 128)
0d60: 34 32 25 2c 20 72 67 62 28 30 2c 20 32 35 35 2c 42%, rgb(0, 255,
0d70: 20 32 35 35 29 20 35 30 25 2c 20 72 67 62 28 30 255) 50%, rgb(0
0d80: 2c 20 31 32 38 2c 20 32 35 35 29 20 35 38 25 2c , 128, 255) 58%,
0d90: 20 72 67 62 28 30 2c 20 30 2c 20 32 35 35 29 20 rgb(0, 0, 255)
0da0: 36 37 25 2c 20 72 67 62 28 31 32 38 2c 20 30 2c 67%, rgb(128, 0,
0db0: 20 32 35 35 29 20 37 35 25 2c 20 72 67 62 28 32 255) 75%, rgb(2
0dc0: 35 35 2c 20 30 2c 20 32 35 35 29 20 38 33 25 2c 55, 0, 255) 83%,
0dd0: 20 72 67 62 28 32 35 35 2c 20 30 2c 20 31 32 38 rgb(255, 0, 128
0de0: 29 20 39 32 25 2c 20 72 67 62 28 32 35 35 2c 20 ) 92%, rgb(255,
0df0: 30 2c 20 30 29 20 31 30 30 25 29 3b 20 2f 2a 20 0, 0) 100%); /*
0e00: 4f 70 65 72 61 20 31 31 2e 31 30 2b 20 2a 2f 0a Opera 11.10+ */.
0e10: 20 20 62 61 63 6b 67 72 6f 75 6e 64 3a 20 2d 6d background: -m
0e20: 73 2d 6c 69 6e 65 61 72 2d 67 72 61 64 69 65 6e s-linear-gradien
0e30: 74 28 72 69 67 68 74 2c 20 72 67 62 28 32 35 35 t(right, rgb(255
0e40: 2c 20 30 2c 20 30 29 20 30 25 2c 20 72 67 62 28 , 0, 0) 0%, rgb(
0e50: 32 35 35 2c 20 31 32 38 2c 20 30 29 20 38 25 2c 255, 128, 0) 8%,
0e60: 20 72 67 62 28 32 35 35 2c 20 32 35 35 2c 20 30 rgb(255, 255, 0
0e70: 29 20 31 37 25 2c 20 72 67 62 28 31 32 38 2c 20 ) 17%, rgb(128,
0e80: 32 35 35 2c 20 30 29 20 32 35 25 2c 20 72 67 62 255, 0) 25%, rgb
0e90: 28 30 2c 20 32 35 35 2c 20 30 29 20 33 33 25 2c (0, 255, 0) 33%,
0ea0: 20 72 67 62 28 30 2c 20 32 35 35 2c 20 31 32 38 rgb(0, 255, 128
0eb0: 29 20 34 32 25 2c 20 72 67 62 28 30 2c 20 32 35 ) 42%, rgb(0, 25
0ec0: 35 2c 20 32 35 35 29 20 35 30 25 2c 20 72 67 62 5, 255) 50%, rgb
0ed0: 28 30 2c 20 31 32 38 2c 20 32 35 35 29 20 35 38 (0, 128, 255) 58
0ee0: 25 2c 20 72 67 62 28 30 2c 20 30 2c 20 32 35 35 %, rgb(0, 0, 255
0ef0: 29 20 36 37 25 2c 20 72 67 62 28 31 32 38 2c 20 ) 67%, rgb(128,
0f00: 30 2c 20 32 35 35 29 20 37 35 25 2c 20 72 67 62 0, 255) 75%, rgb
0f10: 28 32 35 35 2c 20 30 2c 20 32 35 35 29 20 38 33 (255, 0, 255) 83
0f20: 25 2c 20 72 67 62 28 32 35 35 2c 20 30 2c 20 31 %, rgb(255, 0, 1
0f30: 32 38 29 20 39 32 25 2c 20 72 67 62 28 32 35 35 28) 92%, rgb(255
0f40: 2c 20 30 2c 20 30 29 20 31 30 30 25 29 3b 20 2f , 0, 0) 100%); /
0f50: 2a 20 49 45 31 30 2b 20 2a 2f 0a 20 20 62 61 63 * IE10+ */. bac
0f60: 6b 67 72 6f 75 6e 64 3a 20 6c 69 6e 65 61 72 2d kground: linear-
0f70: 67 72 61 64 69 65 6e 74 28 74 6f 20 6c 65 66 74 gradient(to left
0f80: 2c 20 72 67 62 28 32 35 35 2c 20 30 2c 20 30 29 , rgb(255, 0, 0)
0f90: 20 30 25 2c 20 72 67 62 28 32 35 35 2c 20 31 32 0%, rgb(255, 12
0fa0: 38 2c 20 30 29 20 38 25 2c 20 72 67 62 28 32 35 8, 0) 8%, rgb(25
0fb0: 35 2c 20 32 35 35 2c 20 30 29 20 31 37 25 2c 20 5, 255, 0) 17%,
0fc0: 72 67 62 28 31 32 38 2c 20 32 35 35 2c 20 30 29 rgb(128, 255, 0)
0fd0: 20 32 35 25 2c 20 72 67 62 28 30 2c 20 32 35 35 25%, rgb(0, 255
0fe0: 2c 20 30 29 20 33 33 25 2c 20 72 67 62 28 30 2c , 0) 33%, rgb(0,
0ff0: 20 32 35 35 2c 20 31 32 38 29 20 34 32 25 2c 20 255, 128) 42%,
1000: 72 67 62 28 30 2c 20 32 35 35 2c 20 32 35 35 29 rgb(0, 255, 255)
1010: 20 35 30 25 2c 20 72 67 62 28 30 2c 20 31 32 38 50%, rgb(0, 128
1020: 2c 20 32 35 35 29 20 35 38 25 2c 20 72 67 62 28 , 255) 58%, rgb(
1030: 30 2c 20 30 2c 20 32 35 35 29 20 36 37 25 2c 20 0, 0, 255) 67%,
1040: 72 67 62 28 31 32 38 2c 20 30 2c 20 32 35 35 29 rgb(128, 0, 255)
1050: 20 37 35 25 2c 20 72 67 62 28 32 35 35 2c 20 30 75%, rgb(255, 0
1060: 2c 20 32 35 35 29 20 38 33 25 2c 20 72 67 62 28 , 255) 83%, rgb(
1070: 32 35 35 2c 20 30 2c 20 31 32 38 29 20 39 32 25 255, 0, 128) 92%
1080: 2c 20 72 67 62 28 32 35 35 2c 20 30 2c 20 30 29 , rgb(255, 0, 0)
1090: 20 31 30 30 25 29 3b 20 2f 2a 20 57 33 43 20 2a 100%); /* W3C *
10a0: 2f 0a 0a 7d 0a 0a 40 6d 69 78 69 6e 20 62 67 48 /..}..@mixin bgH
10b0: 75 65 56 65 72 74 69 63 61 6c 28 29 20 7b 0a 20 ueVertical() {.
10c0: 20 62 61 63 6b 67 72 6f 75 6e 64 3a 20 2d 6d 6f background: -mo
10d0: 7a 2d 6c 69 6e 65 61 72 2d 67 72 61 64 69 65 6e z-linear-gradien
10e0: 74 28 62 6f 74 74 6f 6d 2c 20 72 67 62 61 28 32 t(bottom, rgba(2
10f0: 35 35 2c 20 30 2c 20 30 2c 20 31 29 20 30 25 2c 55, 0, 0, 1) 0%,
1100: 20 72 67 62 61 28 32 35 35 2c 20 31 32 38 2c 20 rgba(255, 128,
1110: 30 2c 20 31 29 20 38 25 2c 20 72 67 62 61 28 32 0, 1) 8%, rgba(2
1120: 35 35 2c 20 32 35 35 2c 20 30 2c 20 31 29 20 31 55, 255, 0, 1) 1
1130: 37 25 2c 20 72 67 62 61 28 31 32 38 2c 20 32 35 7%, rgba(128, 25
1140: 35 2c 20 30 2c 20 31 29 20 32 35 25 2c 20 72 67 5, 0, 1) 25%, rg
1150: 62 61 28 30 2c 20 32 35 35 2c 20 30 2c 20 31 29 ba(0, 255, 0, 1)
1160: 20 33 33 25 2c 20 72 67 62 61 28 30 2c 20 32 35 33%, rgba(0, 25
1170: 35 2c 20 31 32 38 2c 20 31 29 20 34 32 25 2c 20 5, 128, 1) 42%,
1180: 72 67 62 61 28 30 2c 20 32 35 35 2c 20 32 35 35 rgba(0, 255, 255
1190: 2c 20 31 29 20 35 30 25 2c 20 72 67 62 61 28 30 , 1) 50%, rgba(0
11a0: 2c 20 31 32 38 2c 20 32 35 35 2c 20 31 29 20 35 , 128, 255, 1) 5
11b0: 38 25 2c 20 72 67 62 61 28 30 2c 20 30 2c 20 32 8%, rgba(0, 0, 2
11c0: 35 35 2c 20 31 29 20 36 37 25 2c 20 72 67 62 61 55, 1) 67%, rgba
11d0: 28 31 32 38 2c 20 30 2c 20 32 35 35 2c 20 31 29 (128, 0, 255, 1)
11e0: 20 37 35 25 2c 20 72 67 62 61 28 32 35 35 2c 20 75%, rgba(255,
11f0: 30 2c 20 32 35 35 2c 20 31 29 20 38 33 25 2c 20 0, 255, 1) 83%,
1200: 72 67 62 61 28 32 35 35 2c 20 30 2c 20 31 32 38 rgba(255, 0, 128
1210: 2c 20 31 29 20 39 32 25 2c 20 72 67 62 61 28 32 , 1) 92%, rgba(2
1220: 35 35 2c 20 30 2c 20 30 2c 20 31 29 20 31 30 30 55, 0, 0, 1) 100
1230: 25 29 3b 20 2f 2a 20 46 46 33 2e 36 2b 20 2a 2f %); /* FF3.6+ */
1240: 0a 20 20 62 61 63 6b 67 72 6f 75 6e 64 3a 20 2d . background: -
1250: 77 65 62 6b 69 74 2d 67 72 61 64 69 65 6e 74 28 webkit-gradient(
1260: 6c 69 6e 65 61 72 2c 20 6c 65 66 74 20 62 6f 74 linear, left bot
1270: 74 6f 6d 2c 20 6c 65 66 74 20 74 6f 70 2c 20 63 tom, left top, c
1280: 6f 6c 6f 72 2d 73 74 6f 70 28 30 25 2c 20 72 67 olor-stop(0%, rg
1290: 62 61 28 32 35 35 2c 20 30 2c 20 30 2c 20 31 29 ba(255, 0, 0, 1)
12a0: 29 2c 20 63 6f 6c 6f 72 2d 73 74 6f 70 28 38 25 ), color-stop(8%
12b0: 2c 20 72 67 62 61 28 32 35 35 2c 20 31 32 38 2c , rgba(255, 128,
12c0: 20 30 2c 20 31 29 29 2c 20 63 6f 6c 6f 72 2d 73 0, 1)), color-s
12d0: 74 6f 70 28 31 37 25 2c 20 72 67 62 61 28 32 35 top(17%, rgba(25
12e0: 35 2c 20 32 35 35 2c 20 30 2c 20 31 29 29 2c 20 5, 255, 0, 1)),
12f0: 63 6f 6c 6f 72 2d 73 74 6f 70 28 32 35 25 2c 20 color-stop(25%,
1300: 72 67 62 61 28 31 32 38 2c 20 32 35 35 2c 20 30 rgba(128, 255, 0
1310: 2c 20 31 29 29 2c 20 63 6f 6c 6f 72 2d 73 74 6f , 1)), color-sto
1320: 70 28 33 33 25 2c 20 72 67 62 61 28 30 2c 20 32 p(33%, rgba(0, 2
1330: 35 35 2c 20 30 2c 20 31 29 29 2c 20 63 6f 6c 6f 55, 0, 1)), colo
1340: 72 2d 73 74 6f 70 28 34 32 25 2c 20 72 67 62 61 r-stop(42%, rgba
1350: 28 30 2c 20 32 35 35 2c 20 31 32 38 2c 20 31 29 (0, 255, 128, 1)
1360: 29 2c 20 63 6f 6c 6f 72 2d 73 74 6f 70 28 35 30 ), color-stop(50
1370: 25 2c 20 72 67 62 61 28 30 2c 20 32 35 35 2c 20 %, rgba(0, 255,
1380: 32 35 35 2c 20 31 29 29 2c 20 63 6f 6c 6f 72 2d 255, 1)), color-
1390: 73 74 6f 70 28 35 38 25 2c 20 72 67 62 61 28 30 stop(58%, rgba(0
13a0: 2c 20 31 32 38 2c 20 32 35 35 2c 20 31 29 29 2c , 128, 255, 1)),
13b0: 20 63 6f 6c 6f 72 2d 73 74 6f 70 28 36 37 25 2c color-stop(67%,
13c0: 20 72 67 62 61 28 30 2c 20 30 2c 20 32 35 35 2c rgba(0, 0, 255,
13d0: 20 31 29 29 2c 20 63 6f 6c 6f 72 2d 73 74 6f 70 1)), color-stop
13e0: 28 37 35 25 2c 20 72 67 62 61 28 31 32 38 2c 20 (75%, rgba(128,
13f0: 30 2c 20 32 35 35 2c 20 31 29 29 2c 20 63 6f 6c 0, 255, 1)), col
1400: 6f 72 2d 73 74 6f 70 28 38 33 25 2c 20 72 67 62 or-stop(83%, rgb
1410: 61 28 32 35 35 2c 20 30 2c 20 32 35 35 2c 20 31 a(255, 0, 255, 1
1420: 29 29 2c 20 63 6f 6c 6f 72 2d 73 74 6f 70 28 39 )), color-stop(9
1430: 32 25 2c 20 72 67 62 61 28 32 35 35 2c 20 30 2c 2%, rgba(255, 0,
1440: 20 31 32 38 2c 20 31 29 29 2c 20 63 6f 6c 6f 72 128, 1)), color
1450: 2d 73 74 6f 70 28 31 30 30 25 2c 20 72 67 62 61 -stop(100%, rgba
1460: 28 32 35 35 2c 20 30 2c 20 30 2c 20 31 29 29 29 (255, 0, 0, 1)))
1470: 3b 20 2f 2a 20 43 68 72 6f 6d 65 2c 53 61 66 61 ; /* Chrome,Safa
1480: 72 69 34 2b 20 2a 2f 0a 20 20 62 61 63 6b 67 72 ri4+ */. backgr
1490: 6f 75 6e 64 3a 20 2d 77 65 62 6b 69 74 2d 6c 69 ound: -webkit-li
14a0: 6e 65 61 72 2d 67 72 61 64 69 65 6e 74 28 62 6f near-gradient(bo
14b0: 74 74 6f 6d 2c 20 72 67 62 61 28 32 35 35 2c 20 ttom, rgba(255,
14c0: 30 2c 20 30 2c 20 31 29 20 30 25 2c 20 72 67 62 0, 0, 1) 0%, rgb
14d0: 61 28 32 35 35 2c 20 31 32 38 2c 20 30 2c 20 31 a(255, 128, 0, 1
14e0: 29 20 38 25 2c 20 72 67 62 61 28 32 35 35 2c 20 ) 8%, rgba(255,
14f0: 32 35 35 2c 20 30 2c 20 31 29 20 31 37 25 2c 20 255, 0, 1) 17%,
1500: 72 67 62 61 28 31 32 38 2c 20 32 35 35 2c 20 30 rgba(128, 255, 0
1510: 2c 20 31 29 20 32 35 25 2c 20 72 67 62 61 28 30 , 1) 25%, rgba(0
1520: 2c 20 32 35 35 2c 20 30 2c 20 31 29 20 33 33 25 , 255, 0, 1) 33%
1530: 2c 20 72 67 62 61 28 30 2c 20 32 35 35 2c 20 31 , rgba(0, 255, 1
1540: 32 38 2c 20 31 29 20 34 32 25 2c 20 72 67 62 61 28, 1) 42%, rgba
1550: 28 30 2c 20 32 35 35 2c 20 32 35 35 2c 20 31 29 (0, 255, 255, 1)
1560: 20 35 30 25 2c 20 72 67 62 61 28 30 2c 20 31 32 50%, rgba(0, 12
1570: 38 2c 20 32 35 35 2c 20 31 29 20 35 38 25 2c 20 8, 255, 1) 58%,
1580: 72 67 62 61 28 30 2c 20 30 2c 20 32 35 35 2c 20 rgba(0, 0, 255,
1590: 31 29 20 36 37 25 2c 20 72 67 62 61 28 31 32 38 1) 67%, rgba(128
15a0: 2c 20 30 2c 20 32 35 35 2c 20 31 29 20 37 35 25 , 0, 255, 1) 75%
15b0: 2c 20 72 67 62 61 28 32 35 35 2c 20 30 2c 20 32 , rgba(255, 0, 2
15c0: 35 35 2c 20 31 29 20 38 33 25 2c 20 72 67 62 61 55, 1) 83%, rgba
15d0: 28 32 35 35 2c 20 30 2c 20 31 32 38 2c 20 31 29 (255, 0, 128, 1)
15e0: 20 39 32 25 2c 20 72 67 62 61 28 32 35 35 2c 20 92%, rgba(255,
15f0: 30 2c 20 30 2c 20 31 29 20 31 30 30 25 29 3b 20 0, 0, 1) 100%);
1600: 2f 2a 20 43 68 72 6f 6d 65 31 30 2b 2c 53 61 66 /* Chrome10+,Saf
1610: 61 72 69 35 2e 31 2b 20 2a 2f 0a 20 20 62 61 63 ari5.1+ */. bac
1620: 6b 67 72 6f 75 6e 64 3a 20 2d 6f 2d 6c 69 6e 65 kground: -o-line
1630: 61 72 2d 67 72 61 64 69 65 6e 74 28 62 6f 74 74 ar-gradient(bott
1640: 6f 6d 2c 20 72 67 62 61 28 32 35 35 2c 20 30 2c om, rgba(255, 0,
1650: 20 30 2c 20 31 29 20 30 25 2c 20 72 67 62 61 28 0, 1) 0%, rgba(
1660: 32 35 35 2c 20 31 32 38 2c 20 30 2c 20 31 29 20 255, 128, 0, 1)
1670: 38 25 2c 20 72 67 62 61 28 32 35 35 2c 20 32 35 8%, rgba(255, 25
1680: 35 2c 20 30 2c 20 31 29 20 31 37 25 2c 20 72 67 5, 0, 1) 17%, rg
1690: 62 61 28 31 32 38 2c 20 32 35 35 2c 20 30 2c 20 ba(128, 255, 0,
16a0: 31 29 20 32 35 25 2c 20 72 67 62 61 28 30 2c 20 1) 25%, rgba(0,
16b0: 32 35 35 2c 20 30 2c 20 31 29 20 33 33 25 2c 20 255, 0, 1) 33%,
16c0: 72 67 62 61 28 30 2c 20 32 35 35 2c 20 31 32 38 rgba(0, 255, 128
16d0: 2c 20 31 29 20 34 32 25 2c 20 72 67 62 61 28 30 , 1) 42%, rgba(0
16e0: 2c 20 32 35 35 2c 20 32 35 35 2c 20 31 29 20 35 , 255, 255, 1) 5
16f0: 30 25 2c 20 72 67 62 61 28 30 2c 20 31 32 38 2c 0%, rgba(0, 128,
1700: 20 32 35 35 2c 20 31 29 20 35 38 25 2c 20 72 67 255, 1) 58%, rg
1710: 62 61 28 30 2c 20 30 2c 20 32 35 35 2c 20 31 29 ba(0, 0, 255, 1)
1720: 20 36 37 25 2c 20 72 67 62 61 28 31 32 38 2c 20 67%, rgba(128,
1730: 30 2c 20 32 35 35 2c 20 31 29 20 37 35 25 2c 20 0, 255, 1) 75%,
1740: 72 67 62 61 28 32 35 35 2c 20 30 2c 20 32 35 35 rgba(255, 0, 255
1750: 2c 20 31 29 20 38 33 25 2c 20 72 67 62 61 28 32 , 1) 83%, rgba(2
1760: 35 35 2c 20 30 2c 20 31 32 38 2c 20 31 29 20 39 55, 0, 128, 1) 9
1770: 32 25 2c 20 72 67 62 61 28 32 35 35 2c 20 30 2c 2%, rgba(255, 0,
1780: 20 30 2c 20 31 29 20 31 30 30 25 29 3b 20 2f 2a 0, 1) 100%); /*
1790: 20 4f 70 65 72 61 20 31 31 2e 31 30 2b 20 2a 2f Opera 11.10+ */
17a0: 0a 20 20 62 61 63 6b 67 72 6f 75 6e 64 3a 20 2d . background: -
17b0: 6d 73 2d 6c 69 6e 65 61 72 2d 67 72 61 64 69 65 ms-linear-gradie
17c0: 6e 74 28 62 6f 74 74 6f 6d 2c 20 72 67 62 61 28 nt(bottom, rgba(
17d0: 32 35 35 2c 20 30 2c 20 30 2c 20 31 29 20 30 25 255, 0, 0, 1) 0%
17e0: 2c 20 72 67 62 61 28 32 35 35 2c 20 31 32 38 2c , rgba(255, 128,
17f0: 20 30 2c 20 31 29 20 38 25 2c 20 72 67 62 61 28 0, 1) 8%, rgba(
1800: 32 35 35 2c 20 32 35 35 2c 20 30 2c 20 31 29 20 255, 255, 0, 1)
1810: 31 37 25 2c 20 72 67 62 61 28 31 32 38 2c 20 32 17%, rgba(128, 2
1820: 35 35 2c 20 30 2c 20 31 29 20 32 35 25 2c 20 72 55, 0, 1) 25%, r
1830: 67 62 61 28 30 2c 20 32 35 35 2c 20 30 2c 20 31 gba(0, 255, 0, 1
1840: 29 20 33 33 25 2c 20 72 67 62 61 28 30 2c 20 32 ) 33%, rgba(0, 2
1850: 35 35 2c 20 31 32 38 2c 20 31 29 20 34 32 25 2c 55, 128, 1) 42%,
1860: 20 72 67 62 61 28 30 2c 20 32 35 35 2c 20 32 35 rgba(0, 255, 25
1870: 35 2c 20 31 29 20 35 30 25 2c 20 72 67 62 61 28 5, 1) 50%, rgba(
1880: 30 2c 20 31 32 38 2c 20 32 35 35 2c 20 31 29 20 0, 128, 255, 1)
1890: 35 38 25 2c 20 72 67 62 61 28 30 2c 20 30 2c 20 58%, rgba(0, 0,
18a0: 32 35 35 2c 20 31 29 20 36 37 25 2c 20 72 67 62 255, 1) 67%, rgb
18b0: 61 28 31 32 38 2c 20 30 2c 20 32 35 35 2c 20 31 a(128, 0, 255, 1
18c0: 29 20 37 35 25 2c 20 72 67 62 61 28 32 35 35 2c ) 75%, rgba(255,
18d0: 20 30 2c 20 32 35 35 2c 20 31 29 20 38 33 25 2c 0, 255, 1) 83%,
18e0: 20 72 67 62 61 28 32 35 35 2c 20 30 2c 20 31 32 rgba(255, 0, 12
18f0: 38 2c 20 31 29 20 39 32 25 2c 20 72 67 62 61 28 8, 1) 92%, rgba(
1900: 32 35 35 2c 20 30 2c 20 30 2c 20 31 29 20 31 30 255, 0, 0, 1) 10
1910: 30 25 29 3b 20 2f 2a 20 49 45 31 30 2b 20 2a 2f 0%); /* IE10+ */
1920: 0a 20 20 62 61 63 6b 67 72 6f 75 6e 64 3a 20 6c . background: l
1930: 69 6e 65 61 72 2d 67 72 61 64 69 65 6e 74 28 74 inear-gradient(t
1940: 6f 20 74 6f 70 2c 20 72 67 62 61 28 32 35 35 2c o top, rgba(255,
1950: 20 30 2c 20 30 2c 20 31 29 20 30 25 2c 20 72 67 0, 0, 1) 0%, rg
1960: 62 61 28 32 35 35 2c 20 31 32 38 2c 20 30 2c 20 ba(255, 128, 0,
1970: 31 29 20 38 25 2c 20 72 67 62 61 28 32 35 35 2c 1) 8%, rgba(255,
1980: 20 32 35 35 2c 20 30 2c 20 31 29 20 31 37 25 2c 255, 0, 1) 17%,
1990: 20 72 67 62 61 28 31 32 38 2c 20 32 35 35 2c 20 rgba(128, 255,
19a0: 30 2c 20 31 29 20 32 35 25 2c 20 72 67 62 61 28 0, 1) 25%, rgba(
19b0: 30 2c 20 32 35 35 2c 20 30 2c 20 31 29 20 33 33 0, 255, 0, 1) 33
19c0: 25 2c 20 72 67 62 61 28 30 2c 20 32 35 35 2c 20 %, rgba(0, 255,
19d0: 31 32 38 2c 20 31 29 20 34 32 25 2c 20 72 67 62 128, 1) 42%, rgb
19e0: 61 28 30 2c 20 32 35 35 2c 20 32 35 35 2c 20 31 a(0, 255, 255, 1
19f0: 29 20 35 30 25 2c 20 72 67 62 61 28 30 2c 20 31 ) 50%, rgba(0, 1
1a00: 32 38 2c 20 32 35 35 2c 20 31 29 20 35 38 25 2c 28, 255, 1) 58%,
1a10: 20 72 67 62 61 28 30 2c 20 30 2c 20 32 35 35 2c rgba(0, 0, 255,
1a20: 20 31 29 20 36 37 25 2c 20 72 67 62 61 28 31 32 1) 67%, rgba(12
1a30: 38 2c 20 30 2c 20 32 35 35 2c 20 31 29 20 37 35 8, 0, 255, 1) 75
1a40: 25 2c 20 72 67 62 61 28 32 35 35 2c 20 30 2c 20 %, rgba(255, 0,
1a50: 32 35 35 2c 20 31 29 20 38 33 25 2c 20 72 67 62 255, 1) 83%, rgb
1a60: 61 28 32 35 35 2c 20 30 2c 20 31 32 38 2c 20 31 a(255, 0, 128, 1
1a70: 29 20 39 32 25 2c 20 72 67 62 61 28 32 35 35 2c ) 92%, rgba(255,
1a80: 20 30 2c 20 30 2c 20 31 29 20 31 30 30 25 29 3b 0, 0, 1) 100%);
1a90: 20 2f 2a 20 57 33 43 20 2a 2f 0a 7d 0a 0a 2e 63 /* W3C */.}...c
1aa0: 6f 6c 6f 72 70 69 63 6b 65 72 20 7b 0a 20 20 70 olorpicker {. p
1ab0: 6f 73 69 74 69 6f 6e 3a 20 72 65 6c 61 74 69 76 osition: relativ
1ac0: 65 3b 0a 20 20 64 69 73 70 6c 61 79 3a 20 6e 6f e;. display: no
1ad0: 6e 65 3b 0a 20 20 66 6f 6e 74 2d 73 69 7a 65 3a ne;. font-size:
1ae0: 20 69 6e 68 65 72 69 74 3b 0a 20 20 63 6f 6c 6f inherit;. colo
1af0: 72 3a 20 69 6e 68 65 72 69 74 3b 0a 20 20 74 65 r: inherit;. te
1b00: 78 74 2d 61 6c 69 67 6e 3a 20 6c 65 66 74 3b 0a xt-align: left;.
1b10: 20 20 6c 69 73 74 2d 73 74 79 6c 65 3a 20 6e 6f list-style: no
1b20: 6e 65 3b 0a 20 20 62 61 63 6b 67 72 6f 75 6e 64 ne;. background
1b30: 2d 63 6f 6c 6f 72 3a 20 23 66 66 66 66 66 66 3b -color: #ffffff;
1b40: 0a 20 20 62 61 63 6b 67 72 6f 75 6e 64 2d 63 6c . background-cl
1b50: 69 70 3a 20 70 61 64 64 69 6e 67 2d 62 6f 78 3b ip: padding-box;
1b60: 0a 20 20 62 6f 72 64 65 72 3a 20 31 70 78 20 73 . border: 1px s
1b70: 6f 6c 69 64 20 24 6f 75 74 6c 69 6e 65 2d 63 6f olid $outline-co
1b80: 6c 6f 72 3b 0a 20 20 2f 2f 62 6f 78 2d 73 68 61 lor;. //box-sha
1b90: 64 6f 77 3a 20 30 20 36 70 78 20 31 32 70 78 20 dow: 0 6px 12px
1ba0: 72 67 62 61 28 30 2c 20 30 2c 20 30 2c 20 30 2e rgba(0, 0, 0, 0.
1bb0: 31 37 35 29 3b 0a 20 20 70 61 64 64 69 6e 67 3a 175);. padding:
1bc0: 20 2e 37 35 72 65 6d 20 2e 37 35 72 65 6d 3b 0a .75rem .75rem;.
1bd0: 20 20 77 69 64 74 68 3a 20 28 24 62 61 72 2d 73 width: ($bar-s
1be0: 69 7a 65 2d 6c 61 72 67 65 20 2b 20 24 62 61 73 ize-large + $bas
1bf0: 65 2d 6d 61 72 67 69 6e 20 2b 20 24 62 61 72 2d e-margin + $bar-
1c00: 73 69 7a 65 2d 73 68 6f 72 74 29 3b 0a 20 20 62 size-short);. b
1c10: 6f 72 64 65 72 2d 72 61 64 69 75 73 3a 20 34 70 order-radius: 4p
1c20: 78 3b 0a 20 20 62 6f 78 2d 73 69 7a 69 6e 67 3a x;. box-sizing:
1c30: 20 63 6f 6e 74 65 6e 74 2d 62 6f 78 3b 0a 7d 0a content-box;.}.
1c40: 0a 2e 63 6f 6c 6f 72 70 69 63 6b 65 72 2e 63 6f ..colorpicker.co
1c50: 6c 6f 72 70 69 63 6b 65 72 2d 64 69 73 61 62 6c lorpicker-disabl
1c60: 65 64 2c 0a 2e 63 6f 6c 6f 72 70 69 63 6b 65 72 ed,..colorpicker
1c70: 2e 63 6f 6c 6f 72 70 69 63 6b 65 72 2d 64 69 73 .colorpicker-dis
1c80: 61 62 6c 65 64 20 2a 20 7b 0a 20 20 63 75 72 73 abled * {. curs
1c90: 6f 72 3a 20 64 65 66 61 75 6c 74 20 21 69 6d 70 or: default !imp
1ca0: 6f 72 74 61 6e 74 3b 0a 7d 0a 0a 2e 63 6f 6c 6f ortant;.}...colo
1cb0: 72 70 69 63 6b 65 72 20 64 69 76 20 7b 0a 20 20 rpicker div {.
1cc0: 70 6f 73 69 74 69 6f 6e 3a 20 72 65 6c 61 74 69 position: relati
1cd0: 76 65 3b 0a 7d 0a 0a 2e 63 6f 6c 6f 72 70 69 63 ve;.}...colorpic
1ce0: 6b 65 72 2d 70 6f 70 75 70 20 7b 0a 20 20 70 6f ker-popup {. po
1cf0: 73 69 74 69 6f 6e 3a 20 61 62 73 6f 6c 75 74 65 sition: absolute
1d00: 3b 0a 20 20 74 6f 70 3a 20 31 30 30 25 3b 0a 20 ;. top: 100%;.
1d10: 20 6c 65 66 74 3a 20 30 3b 0a 20 20 66 6c 6f 61 left: 0;. floa
1d20: 74 3a 20 6c 65 66 74 3b 0a 20 20 6d 61 72 67 69 t: left;. margi
1d30: 6e 2d 74 6f 70 3a 20 31 70 78 3b 0a 20 20 7a 2d n-top: 1px;. z-
1d40: 69 6e 64 65 78 3a 20 31 30 36 30 3b 0a 7d 0a 0a index: 1060;.}..
1d50: 2e 63 6f 6c 6f 72 70 69 63 6b 65 72 2d 70 6f 70 .colorpicker-pop
1d60: 75 70 2e 63 6f 6c 6f 72 70 69 63 6b 65 72 2d 62 up.colorpicker-b
1d70: 73 2d 70 6f 70 6f 76 65 72 2d 63 6f 6e 74 65 6e s-popover-conten
1d80: 74 20 7b 0a 20 20 70 6f 73 69 74 69 6f 6e 3a 20 t {. position:
1d90: 72 65 6c 61 74 69 76 65 3b 0a 20 20 74 6f 70 3a relative;. top:
1da0: 20 61 75 74 6f 3b 0a 20 20 6c 65 66 74 3a 20 61 auto;. left: a
1db0: 75 74 6f 3b 0a 20 20 66 6c 6f 61 74 3a 20 6e 6f uto;. float: no
1dc0: 6e 65 3b 0a 20 20 6d 61 72 67 69 6e 3a 20 30 3b ne;. margin: 0;
1dd0: 0a 20 20 7a 2d 69 6e 64 65 78 3a 20 69 6e 69 74 . z-index: init
1de0: 69 61 6c 3b 0a 20 20 62 6f 72 64 65 72 3a 20 6e ial;. border: n
1df0: 6f 6e 65 3b 0a 20 20 70 61 64 64 69 6e 67 3a 20 one;. padding:
1e00: 30 2e 32 35 72 65 6d 20 30 3b 20 2f 2f 20 70 6f 0.25rem 0; // po
1e10: 70 6f 76 65 72 20 70 61 64 64 69 6e 67 20 63 6f pover padding co
1e20: 72 72 65 63 74 69 6f 6e 0a 20 20 62 6f 72 64 65 rrection. borde
1e30: 72 2d 72 61 64 69 75 73 3a 20 30 3b 0a 20 20 62 r-radius: 0;. b
1e40: 61 63 6b 67 72 6f 75 6e 64 3a 20 6e 6f 6e 65 3b ackground: none;
1e50: 0a 20 20 62 6f 78 2d 73 68 61 64 6f 77 3a 20 6e . box-shadow: n
1e60: 6f 6e 65 3b 0a 7d 0a 0a 2e 63 6f 6c 6f 72 70 69 one;.}...colorpi
1e70: 63 6b 65 72 3a 62 65 66 6f 72 65 2c 0a 2e 63 6f cker:before,..co
1e80: 6c 6f 72 70 69 63 6b 65 72 3a 61 66 74 65 72 20 lorpicker:after
1e90: 7b 0a 20 20 63 6f 6e 74 65 6e 74 3a 20 22 22 3b {. content: "";
1ea0: 0a 20 20 64 69 73 70 6c 61 79 3a 20 74 61 62 6c . display: tabl
1eb0: 65 3b 0a 20 20 63 6c 65 61 72 3a 20 62 6f 74 68 e;. clear: both
1ec0: 3b 0a 20 20 6c 69 6e 65 2d 68 65 69 67 68 74 3a ;. line-height:
1ed0: 20 30 3b 0a 7d 0a 0a 2e 63 6f 6c 6f 72 70 69 63 0;.}...colorpic
1ee0: 6b 65 72 2d 63 6c 65 61 72 20 7b 0a 20 20 63 6c ker-clear {. cl
1ef0: 65 61 72 3a 20 62 6f 74 68 3b 0a 20 20 64 69 73 ear: both;. dis
1f00: 70 6c 61 79 3a 20 62 6c 6f 63 6b 3b 0a 7d 0a 0a play: block;.}..
1f10: 2e 63 6f 6c 6f 72 70 69 63 6b 65 72 3a 62 65 66 .colorpicker:bef
1f20: 6f 72 65 20 7b 0a 20 20 63 6f 6e 74 65 6e 74 3a ore {. content:
1f30: 20 27 27 3b 0a 20 20 64 69 73 70 6c 61 79 3a 20 '';. display:
1f40: 69 6e 6c 69 6e 65 2d 62 6c 6f 63 6b 3b 0a 20 20 inline-block;.
1f50: 62 6f 72 64 65 72 2d 6c 65 66 74 3a 20 37 70 78 border-left: 7px
1f60: 20 73 6f 6c 69 64 20 74 72 61 6e 73 70 61 72 65 solid transpare
1f70: 6e 74 3b 0a 20 20 62 6f 72 64 65 72 2d 72 69 67 nt;. border-rig
1f80: 68 74 3a 20 37 70 78 20 73 6f 6c 69 64 20 74 72 ht: 7px solid tr
1f90: 61 6e 73 70 61 72 65 6e 74 3b 0a 20 20 62 6f 72 ansparent;. bor
1fa0: 64 65 72 2d 62 6f 74 74 6f 6d 3a 20 37 70 78 20 der-bottom: 7px
1fb0: 73 6f 6c 69 64 20 23 63 63 63 3b 0a 20 20 62 6f solid #ccc;. bo
1fc0: 72 64 65 72 2d 62 6f 74 74 6f 6d 2d 63 6f 6c 6f rder-bottom-colo
1fd0: 72 3a 20 24 6f 75 74 6c 69 6e 65 2d 63 6f 6c 6f r: $outline-colo
1fe0: 72 3b 0a 20 20 70 6f 73 69 74 69 6f 6e 3a 20 61 r;. position: a
1ff0: 62 73 6f 6c 75 74 65 3b 0a 20 20 74 6f 70 3a 20 bsolute;. top:
2000: 2d 37 70 78 3b 0a 20 20 6c 65 66 74 3a 20 61 75 -7px;. left: au
2010: 74 6f 3b 0a 20 20 72 69 67 68 74 3a 20 36 70 78 to;. right: 6px
2020: 3b 0a 7d 0a 0a 2e 63 6f 6c 6f 72 70 69 63 6b 65 ;.}...colorpicke
2030: 72 3a 61 66 74 65 72 20 7b 0a 20 20 63 6f 6e 74 r:after {. cont
2040: 65 6e 74 3a 20 27 27 3b 0a 20 20 64 69 73 70 6c ent: '';. displ
2050: 61 79 3a 20 69 6e 6c 69 6e 65 2d 62 6c 6f 63 6b ay: inline-block
2060: 3b 0a 20 20 62 6f 72 64 65 72 2d 6c 65 66 74 3a ;. border-left:
2070: 20 36 70 78 20 73 6f 6c 69 64 20 74 72 61 6e 73 6px solid trans
2080: 70 61 72 65 6e 74 3b 0a 20 20 62 6f 72 64 65 72 parent;. border
2090: 2d 72 69 67 68 74 3a 20 36 70 78 20 73 6f 6c 69 -right: 6px soli
20a0: 64 20 74 72 61 6e 73 70 61 72 65 6e 74 3b 0a 20 d transparent;.
20b0: 20 62 6f 72 64 65 72 2d 62 6f 74 74 6f 6d 3a 20 border-bottom:
20c0: 36 70 78 20 73 6f 6c 69 64 20 23 66 66 66 66 66 6px solid #fffff
20d0: 66 3b 0a 20 20 70 6f 73 69 74 69 6f 6e 3a 20 61 f;. position: a
20e0: 62 73 6f 6c 75 74 65 3b 0a 20 20 74 6f 70 3a 20 bsolute;. top:
20f0: 2d 36 70 78 3b 0a 20 20 6c 65 66 74 3a 20 61 75 -6px;. left: au
2100: 74 6f 3b 0a 20 20 72 69 67 68 74 3a 20 37 70 78 to;. right: 7px
2110: 3b 0a 7d 0a 0a 2e 63 6f 6c 6f 72 70 69 63 6b 65 ;.}...colorpicke
2120: 72 2e 63 6f 6c 6f 72 70 69 63 6b 65 72 2d 77 69 r.colorpicker-wi
2130: 74 68 2d 61 6c 70 68 61 20 7b 0a 20 20 77 69 64 th-alpha {. wid
2140: 74 68 3a 20 28 24 62 61 72 2d 73 69 7a 65 2d 6c th: ($bar-size-l
2150: 61 72 67 65 20 2b 20 28 28 24 62 61 73 65 2d 6d arge + (($base-m
2160: 61 72 67 69 6e 20 2b 20 24 62 61 72 2d 73 69 7a argin + $bar-siz
2170: 65 2d 73 68 6f 72 74 29 20 2a 20 32 29 29 3b 0a e-short) * 2));.
2180: 7d 0a 0a 2e 63 6f 6c 6f 72 70 69 63 6b 65 72 2e }...colorpicker.
2190: 63 6f 6c 6f 72 70 69 63 6b 65 72 2d 77 69 74 68 colorpicker-with
21a0: 2d 61 6c 70 68 61 20 2e 63 6f 6c 6f 72 70 69 63 -alpha .colorpic
21b0: 6b 65 72 2d 61 6c 70 68 61 20 7b 0a 20 20 64 69 ker-alpha {. di
21c0: 73 70 6c 61 79 3a 20 62 6c 6f 63 6b 3b 0a 7d 0a splay: block;.}.
21d0: 0a 2e 63 6f 6c 6f 72 70 69 63 6b 65 72 2d 73 61 ..colorpicker-sa
21e0: 74 75 72 61 74 69 6f 6e 20 7b 0a 20 20 70 6f 73 turation {. pos
21f0: 69 74 69 6f 6e 3a 20 72 65 6c 61 74 69 76 65 3b ition: relative;
2200: 0a 20 20 77 69 64 74 68 3a 20 24 62 61 72 2d 73 . width: $bar-s
2210: 69 7a 65 2d 6c 61 72 67 65 3b 0a 20 20 68 65 69 ize-large;. hei
2220: 67 68 74 3a 20 24 62 61 72 2d 73 69 7a 65 2d 6c ght: $bar-size-l
2230: 61 72 67 65 3b 0a 20 20 40 69 6e 63 6c 75 64 65 arge;. @include
2240: 20 62 67 53 61 74 75 72 61 74 69 6f 6e 28 29 3b bgSaturation();
2250: 0a 20 20 63 75 72 73 6f 72 3a 20 63 72 6f 73 73 . cursor: cross
2260: 68 61 69 72 3b 0a 20 20 66 6c 6f 61 74 3a 20 6c hair;. float: l
2270: 65 66 74 3b 0a 20 20 62 6f 78 2d 73 68 61 64 6f eft;. box-shado
2280: 77 3a 20 24 62 6f 78 2d 73 68 61 64 6f 77 2d 6f w: $box-shadow-o
2290: 75 74 6c 69 6e 65 3b 0a 20 20 6d 61 72 67 69 6e utline;. margin
22a0: 2d 62 6f 74 74 6f 6d 3a 20 24 62 61 73 65 2d 6d -bottom: $base-m
22b0: 61 72 67 69 6e 3b 0a 0a 20 20 2e 63 6f 6c 6f 72 argin;.. .color
22c0: 70 69 63 6b 65 72 2d 67 75 69 64 65 20 7b 0a 20 picker-guide {.
22d0: 20 20 20 64 69 73 70 6c 61 79 3a 20 62 6c 6f 63 display: bloc
22e0: 6b 3b 0a 20 20 20 20 68 65 69 67 68 74 3a 20 36 k;. height: 6
22f0: 70 78 3b 0a 20 20 20 20 77 69 64 74 68 3a 20 36 px;. width: 6
2300: 70 78 3b 0a 20 20 20 20 62 6f 72 64 65 72 2d 72 px;. border-r
2310: 61 64 69 75 73 3a 20 36 70 78 3b 0a 20 20 20 20 adius: 6px;.
2320: 62 6f 72 64 65 72 3a 20 31 70 78 20 73 6f 6c 69 border: 1px soli
2330: 64 20 23 30 30 30 3b 0a 20 20 20 20 62 6f 78 2d d #000;. box-
2340: 73 68 61 64 6f 77 3a 20 30 20 30 20 30 20 31 70 shadow: 0 0 0 1p
2350: 78 20 72 67 62 61 28 32 35 35 2c 20 32 35 35 2c x rgba(255, 255,
2360: 20 32 35 35 2c 20 30 2e 38 29 3b 0a 20 20 20 20 255, 0.8);.
2370: 70 6f 73 69 74 69 6f 6e 3a 20 61 62 73 6f 6c 75 position: absolu
2380: 74 65 3b 0a 20 20 20 20 74 6f 70 3a 20 30 3b 0a te;. top: 0;.
2390: 20 20 20 20 6c 65 66 74 3a 20 30 3b 0a 20 20 20 left: 0;.
23a0: 20 6d 61 72 67 69 6e 3a 20 2d 33 70 78 20 30 20 margin: -3px 0
23b0: 30 20 2d 33 70 78 3b 0a 20 20 7d 0a 7d 0a 0a 2e 0 -3px;. }.}...
23c0: 63 6f 6c 6f 72 70 69 63 6b 65 72 2d 68 75 65 2c colorpicker-hue,
23d0: 0a 2e 63 6f 6c 6f 72 70 69 63 6b 65 72 2d 61 6c ..colorpicker-al
23e0: 70 68 61 20 7b 0a 20 20 70 6f 73 69 74 69 6f 6e pha {. position
23f0: 3a 20 72 65 6c 61 74 69 76 65 3b 0a 20 20 77 69 : relative;. wi
2400: 64 74 68 3a 20 24 62 61 72 2d 73 69 7a 65 2d 73 dth: $bar-size-s
2410: 68 6f 72 74 3b 0a 20 20 68 65 69 67 68 74 3a 20 hort;. height:
2420: 24 62 61 72 2d 73 69 7a 65 2d 6c 61 72 67 65 3b $bar-size-large;
2430: 0a 20 20 66 6c 6f 61 74 3a 20 6c 65 66 74 3b 0a . float: left;.
2440: 20 20 63 75 72 73 6f 72 3a 20 72 6f 77 2d 72 65 cursor: row-re
2450: 73 69 7a 65 3b 0a 20 20 6d 61 72 67 69 6e 2d 6c size;. margin-l
2460: 65 66 74 3a 20 24 62 61 73 65 2d 6d 61 72 67 69 eft: $base-margi
2470: 6e 3b 0a 20 20 6d 61 72 67 69 6e 2d 62 6f 74 74 n;. margin-bott
2480: 6f 6d 3a 20 24 62 61 73 65 2d 6d 61 72 67 69 6e om: $base-margin
2490: 3b 0a 7d 0a 0a 2e 63 6f 6c 6f 72 70 69 63 6b 65 ;.}...colorpicke
24a0: 72 2d 61 6c 70 68 61 2d 63 6f 6c 6f 72 20 7b 0a r-alpha-color {.
24b0: 20 20 70 6f 73 69 74 69 6f 6e 3a 20 61 62 73 6f position: abso
24c0: 6c 75 74 65 3b 0a 20 20 74 6f 70 3a 20 30 3b 0a lute;. top: 0;.
24d0: 20 20 6c 65 66 74 3a 20 30 3b 0a 20 20 77 69 64 left: 0;. wid
24e0: 74 68 3a 20 31 30 30 25 3b 0a 20 20 68 65 69 67 th: 100%;. heig
24f0: 68 74 3a 20 31 30 30 25 3b 0a 7d 0a 0a 2e 63 6f ht: 100%;.}...co
2500: 6c 6f 72 70 69 63 6b 65 72 2d 68 75 65 2c 0a 2e lorpicker-hue,..
2510: 63 6f 6c 6f 72 70 69 63 6b 65 72 2d 61 6c 70 68 colorpicker-alph
2520: 61 2d 63 6f 6c 6f 72 20 7b 0a 20 20 62 6f 78 2d a-color {. box-
2530: 73 68 61 64 6f 77 3a 20 24 62 6f 78 2d 73 68 61 shadow: $box-sha
2540: 64 6f 77 2d 6f 75 74 6c 69 6e 65 3b 0a 7d 0a 0a dow-outline;.}..
2550: 2e 63 6f 6c 6f 72 70 69 63 6b 65 72 2d 68 75 65 .colorpicker-hue
2560: 20 2e 63 6f 6c 6f 72 70 69 63 6b 65 72 2d 67 75 .colorpicker-gu
2570: 69 64 65 2c 0a 2e 63 6f 6c 6f 72 70 69 63 6b 65 ide,..colorpicke
2580: 72 2d 61 6c 70 68 61 20 2e 63 6f 6c 6f 72 70 69 r-alpha .colorpi
2590: 63 6b 65 72 2d 67 75 69 64 65 20 7b 0a 20 20 64 cker-guide {. d
25a0: 69 73 70 6c 61 79 3a 20 62 6c 6f 63 6b 3b 0a 20 isplay: block;.
25b0: 20 68 65 69 67 68 74 3a 20 34 70 78 3b 0a 20 20 height: 4px;.
25c0: 62 61 63 6b 67 72 6f 75 6e 64 3a 20 72 67 62 61 background: rgba
25d0: 28 32 35 35 2c 20 32 35 35 2c 20 32 35 35 2c 20 (255, 255, 255,
25e0: 30 2e 38 29 3b 0a 20 20 62 6f 72 64 65 72 3a 20 0.8);. border:
25f0: 31 70 78 20 73 6f 6c 69 64 20 72 67 62 61 28 30 1px solid rgba(0
2600: 2c 20 30 2c 20 30 2c 20 30 2e 34 29 3b 0a 20 20 , 0, 0, 0.4);.
2610: 70 6f 73 69 74 69 6f 6e 3a 20 61 62 73 6f 6c 75 position: absolu
2620: 74 65 3b 0a 20 20 74 6f 70 3a 20 30 3b 0a 20 20 te;. top: 0;.
2630: 6c 65 66 74 3a 20 30 3b 0a 20 20 6d 61 72 67 69 left: 0;. margi
2640: 6e 2d 6c 65 66 74 3a 20 2d 32 70 78 3b 0a 20 20 n-left: -2px;.
2650: 6d 61 72 67 69 6e 2d 74 6f 70 3a 20 2d 32 70 78 margin-top: -2px
2660: 3b 0a 20 20 72 69 67 68 74 3a 20 2d 32 70 78 3b ;. right: -2px;
2670: 0a 20 20 7a 2d 69 6e 64 65 78 3a 20 31 3b 0a 7d . z-index: 1;.}
2680: 0a 0a 2e 63 6f 6c 6f 72 70 69 63 6b 65 72 2d 68 ...colorpicker-h
2690: 75 65 20 7b 0a 20 20 40 69 6e 63 6c 75 64 65 20 ue {. @include
26a0: 62 67 48 75 65 56 65 72 74 69 63 61 6c 28 29 3b bgHueVertical();
26b0: 0a 7d 0a 0a 2e 63 6f 6c 6f 72 70 69 63 6b 65 72 .}...colorpicker
26c0: 2d 61 6c 70 68 61 20 7b 0a 20 20 40 69 6e 63 6c -alpha {. @incl
26d0: 75 64 65 20 62 67 43 68 65 63 6b 65 72 42 6f 78 ude bgCheckerBox
26e0: 28 29 3b 0a 20 20 64 69 73 70 6c 61 79 3a 20 6e ();. display: n
26f0: 6f 6e 65 3b 0a 7d 0a 0a 2e 63 6f 6c 6f 72 70 69 one;.}...colorpi
2700: 63 6b 65 72 2d 62 61 72 20 7b 0a 20 20 6d 69 6e cker-bar {. min
2710: 2d 68 65 69 67 68 74 3a 20 24 62 61 72 2d 73 69 -height: $bar-si
2720: 7a 65 2d 73 68 6f 72 74 3b 0a 20 20 6d 61 72 67 ze-short;. marg
2730: 69 6e 3a 20 24 62 61 73 65 2d 6d 61 72 67 69 6e in: $base-margin
2740: 20 30 20 30 20 30 3b 0a 20 20 63 6c 65 61 72 3a 0 0 0;. clear:
2750: 20 62 6f 74 68 3b 0a 20 20 74 65 78 74 2d 61 6c both;. text-al
2760: 69 67 6e 3a 20 63 65 6e 74 65 72 3b 0a 20 20 66 ign: center;. f
2770: 6f 6e 74 2d 73 69 7a 65 3a 20 31 30 70 78 3b 0a ont-size: 10px;.
2780: 20 20 6c 69 6e 65 2d 68 65 69 67 68 74 3a 20 6e line-height: n
2790: 6f 72 6d 61 6c 3b 0a 20 20 6d 61 78 2d 77 69 64 ormal;. max-wid
27a0: 74 68 3a 20 31 30 30 25 3b 0a 20 20 62 6f 78 2d th: 100%;. box-
27b0: 73 68 61 64 6f 77 3a 20 24 62 6f 78 2d 73 68 61 shadow: $box-sha
27c0: 64 6f 77 2d 6f 75 74 6c 69 6e 65 3b 0a 0a 20 20 dow-outline;..
27d0: 26 3a 62 65 66 6f 72 65 20 7b 0a 20 20 20 20 63 &:before {. c
27e0: 6f 6e 74 65 6e 74 3a 20 22 22 3b 0a 20 20 20 20 ontent: "";.
27f0: 64 69 73 70 6c 61 79 3a 20 74 61 62 6c 65 3b 0a display: table;.
2800: 20 20 20 20 63 6c 65 61 72 3a 20 62 6f 74 68 3b clear: both;
2810: 0a 20 20 7d 0a 7d 0a 0a 2e 63 6f 6c 6f 72 70 69 . }.}...colorpi
2820: 63 6b 65 72 2d 62 61 72 2e 63 6f 6c 6f 72 70 69 cker-bar.colorpi
2830: 63 6b 65 72 2d 62 61 72 2d 68 6f 72 69 7a 6f 6e cker-bar-horizon
2840: 74 61 6c 20 7b 0a 20 20 68 65 69 67 68 74 3a 20 tal {. height:
2850: 24 62 61 72 2d 73 69 7a 65 2d 6c 61 72 67 65 3b $bar-size-large;
2860: 0a 20 20 77 69 64 74 68 3a 20 24 62 61 72 2d 73 . width: $bar-s
2870: 69 7a 65 2d 73 68 6f 72 74 3b 0a 20 20 6d 61 72 ize-short;. mar
2880: 67 69 6e 3a 20 30 20 30 20 24 62 61 73 65 2d 6d gin: 0 0 $base-m
2890: 61 72 67 69 6e 20 30 3b 0a 20 20 66 6c 6f 61 74 argin 0;. float
28a0: 3a 20 6c 65 66 74 3b 0a 7d 0a 0a 2e 63 6f 6c 6f : left;.}...colo
28b0: 72 70 69 63 6b 65 72 2d 69 6e 70 75 74 2d 61 64 rpicker-input-ad
28c0: 64 6f 6e 20 7b 0a 20 20 70 6f 73 69 74 69 6f 6e don {. position
28d0: 3a 20 72 65 6c 61 74 69 76 65 3b 0a 7d 0a 0a 2e : relative;.}...
28e0: 63 6f 6c 6f 72 70 69 63 6b 65 72 2d 69 6e 70 75 colorpicker-inpu
28f0: 74 2d 61 64 64 6f 6e 20 69 20 7b 0a 20 20 64 69 t-addon i {. di
2900: 73 70 6c 61 79 3a 20 69 6e 6c 69 6e 65 2d 62 6c splay: inline-bl
2910: 6f 63 6b 3b 0a 20 20 63 75 72 73 6f 72 3a 20 70 ock;. cursor: p
2920: 6f 69 6e 74 65 72 3b 0a 20 20 76 65 72 74 69 63 ointer;. vertic
2930: 61 6c 2d 61 6c 69 67 6e 3a 20 74 65 78 74 2d 74 al-align: text-t
2940: 6f 70 3b 0a 20 20 68 65 69 67 68 74 3a 20 31 36 op;. height: 16
2950: 70 78 3b 0a 20 20 77 69 64 74 68 3a 20 31 36 70 px;. width: 16p
2960: 78 3b 0a 20 20 70 6f 73 69 74 69 6f 6e 3a 20 72 x;. position: r
2970: 65 6c 61 74 69 76 65 3b 0a 7d 0a 0a 2e 63 6f 6c elative;.}...col
2980: 6f 72 70 69 63 6b 65 72 2d 69 6e 70 75 74 2d 61 orpicker-input-a
2990: 64 64 6f 6e 3a 62 65 66 6f 72 65 20 7b 0a 20 20 ddon:before {.
29a0: 63 6f 6e 74 65 6e 74 3a 20 22 22 3b 0a 20 20 70 content: "";. p
29b0: 6f 73 69 74 69 6f 6e 3a 20 61 62 73 6f 6c 75 74 osition: absolut
29c0: 65 3b 0a 20 20 77 69 64 74 68 3a 20 31 36 70 78 e;. width: 16px
29d0: 3b 0a 20 20 68 65 69 67 68 74 3a 20 31 36 70 78 ;. height: 16px
29e0: 3b 0a 20 20 64 69 73 70 6c 61 79 3a 20 69 6e 6c ;. display: inl
29f0: 69 6e 65 2d 62 6c 6f 63 6b 3b 0a 20 20 76 65 72 ine-block;. ver
2a00: 74 69 63 61 6c 2d 61 6c 69 67 6e 3a 20 74 65 78 tical-align: tex
2a10: 74 2d 74 6f 70 3b 0a 20 20 40 69 6e 63 6c 75 64 t-top;. @includ
2a20: 65 20 62 67 43 68 65 63 6b 65 72 42 6f 78 28 29 e bgCheckerBox()
2a30: 3b 0a 7d 0a 0a 2e 63 6f 6c 6f 72 70 69 63 6b 65 ;.}...colorpicke
2a40: 72 2e 63 6f 6c 6f 72 70 69 63 6b 65 72 2d 69 6e r.colorpicker-in
2a50: 6c 69 6e 65 20 7b 0a 20 20 70 6f 73 69 74 69 6f line {. positio
2a60: 6e 3a 20 72 65 6c 61 74 69 76 65 3b 0a 20 20 64 n: relative;. d
2a70: 69 73 70 6c 61 79 3a 20 69 6e 6c 69 6e 65 2d 62 isplay: inline-b
2a80: 6c 6f 63 6b 3b 0a 20 20 66 6c 6f 61 74 3a 20 6e lock;. float: n
2a90: 6f 6e 65 3b 0a 20 20 7a 2d 69 6e 64 65 78 3a 20 one;. z-index:
2aa0: 61 75 74 6f 3b 0a 20 20 76 65 72 74 69 63 61 6c auto;. vertical
2ab0: 2d 61 6c 69 67 6e 3a 20 74 65 78 74 2d 62 6f 74 -align: text-bot
2ac0: 74 6f 6d 3b 0a 7d 0a 0a 2e 63 6f 6c 6f 72 70 69 tom;.}...colorpi
2ad0: 63 6b 65 72 2e 63 6f 6c 6f 72 70 69 63 6b 65 72 cker.colorpicker
2ae0: 2d 68 6f 72 69 7a 6f 6e 74 61 6c 20 7b 0a 20 20 -horizontal {.
2af0: 77 69 64 74 68 3a 20 24 62 61 72 2d 73 69 7a 65 width: $bar-size
2b00: 2d 6c 61 72 67 65 3b 0a 20 20 68 65 69 67 68 74 -large;. height
2b10: 3a 20 61 75 74 6f 3b 0a 7d 0a 0a 2e 63 6f 6c 6f : auto;.}...colo
2b20: 72 70 69 63 6b 65 72 2e 63 6f 6c 6f 72 70 69 63 rpicker.colorpic
2b30: 6b 65 72 2d 68 6f 72 69 7a 6f 6e 74 61 6c 20 2e ker-horizontal .
2b40: 63 6f 6c 6f 72 70 69 63 6b 65 72 2d 62 61 72 20 colorpicker-bar
2b50: 7b 0a 20 20 77 69 64 74 68 3a 20 24 62 61 72 2d {. width: $bar-
2b60: 73 69 7a 65 2d 6c 61 72 67 65 3b 0a 7d 0a 0a 2e size-large;.}...
2b70: 63 6f 6c 6f 72 70 69 63 6b 65 72 2e 63 6f 6c 6f colorpicker.colo
2b80: 72 70 69 63 6b 65 72 2d 68 6f 72 69 7a 6f 6e 74 rpicker-horizont
2b90: 61 6c 20 2e 63 6f 6c 6f 72 70 69 63 6b 65 72 2d al .colorpicker-
2ba0: 73 61 74 75 72 61 74 69 6f 6e 20 7b 0a 20 20 66 saturation {. f
2bb0: 6c 6f 61 74 3a 20 6e 6f 6e 65 3b 0a 20 20 6d 61 loat: none;. ma
2bc0: 72 67 69 6e 2d 62 6f 74 74 6f 6d 3a 20 30 3b 0a rgin-bottom: 0;.
2bd0: 7d 0a 0a 2e 63 6f 6c 6f 72 70 69 63 6b 65 72 2e }...colorpicker.
2be0: 63 6f 6c 6f 72 70 69 63 6b 65 72 2d 68 6f 72 69 colorpicker-hori
2bf0: 7a 6f 6e 74 61 6c 20 2e 63 6f 6c 6f 72 70 69 63 zontal .colorpic
2c00: 6b 65 72 2d 68 75 65 2c 0a 2e 63 6f 6c 6f 72 70 ker-hue,..colorp
2c10: 69 63 6b 65 72 2e 63 6f 6c 6f 72 70 69 63 6b 65 icker.colorpicke
2c20: 72 2d 68 6f 72 69 7a 6f 6e 74 61 6c 20 2e 63 6f r-horizontal .co
2c30: 6c 6f 72 70 69 63 6b 65 72 2d 61 6c 70 68 61 20 lorpicker-alpha
2c40: 7b 0a 20 20 66 6c 6f 61 74 3a 20 6e 6f 6e 65 3b {. float: none;
2c50: 0a 20 20 77 69 64 74 68 3a 20 24 62 61 72 2d 73 . width: $bar-s
2c60: 69 7a 65 2d 6c 61 72 67 65 3b 0a 20 20 68 65 69 ize-large;. hei
2c70: 67 68 74 3a 20 24 62 61 72 2d 73 69 7a 65 2d 73 ght: $bar-size-s
2c80: 68 6f 72 74 3b 0a 20 20 63 75 72 73 6f 72 3a 20 hort;. cursor:
2c90: 63 6f 6c 2d 72 65 73 69 7a 65 3b 0a 20 20 6d 61 col-resize;. ma
2ca0: 72 67 69 6e 2d 6c 65 66 74 3a 20 30 3b 0a 20 20 rgin-left: 0;.
2cb0: 6d 61 72 67 69 6e 2d 74 6f 70 3a 20 24 62 61 73 margin-top: $bas
2cc0: 65 2d 6d 61 72 67 69 6e 3b 0a 20 20 6d 61 72 67 e-margin;. marg
2cd0: 69 6e 2d 62 6f 74 74 6f 6d 3a 20 30 3b 0a 7d 0a in-bottom: 0;.}.
2ce0: 0a 2e 63 6f 6c 6f 72 70 69 63 6b 65 72 2e 63 6f ..colorpicker.co
2cf0: 6c 6f 72 70 69 63 6b 65 72 2d 68 6f 72 69 7a 6f lorpicker-horizo
2d00: 6e 74 61 6c 20 2e 63 6f 6c 6f 72 70 69 63 6b 65 ntal .colorpicke
2d10: 72 2d 68 75 65 20 2e 63 6f 6c 6f 72 70 69 63 6b r-hue .colorpick
2d20: 65 72 2d 67 75 69 64 65 2c 0a 2e 63 6f 6c 6f 72 er-guide,..color
2d30: 70 69 63 6b 65 72 2e 63 6f 6c 6f 72 70 69 63 6b picker.colorpick
2d40: 65 72 2d 68 6f 72 69 7a 6f 6e 74 61 6c 20 2e 63 er-horizontal .c
2d50: 6f 6c 6f 72 70 69 63 6b 65 72 2d 61 6c 70 68 61 olorpicker-alpha
2d60: 20 2e 63 6f 6c 6f 72 70 69 63 6b 65 72 2d 67 75 .colorpicker-gu
2d70: 69 64 65 20 7b 0a 20 20 70 6f 73 69 74 69 6f 6e ide {. position
2d80: 3a 20 61 62 73 6f 6c 75 74 65 3b 0a 20 20 64 69 : absolute;. di
2d90: 73 70 6c 61 79 3a 20 62 6c 6f 63 6b 3b 0a 20 20 splay: block;.
2da0: 62 6f 74 74 6f 6d 3a 20 2d 32 70 78 3b 0a 20 20 bottom: -2px;.
2db0: 6c 65 66 74 3a 20 30 3b 0a 20 20 72 69 67 68 74 left: 0;. right
2dc0: 3a 20 61 75 74 6f 3b 0a 20 20 68 65 69 67 68 74 : auto;. height
2dd0: 3a 20 61 75 74 6f 3b 0a 20 20 77 69 64 74 68 3a : auto;. width:
2de0: 20 34 70 78 3b 0a 7d 0a 0a 2e 63 6f 6c 6f 72 70 4px;.}...colorp
2df0: 69 63 6b 65 72 2e 63 6f 6c 6f 72 70 69 63 6b 65 icker.colorpicke
2e00: 72 2d 68 6f 72 69 7a 6f 6e 74 61 6c 20 2e 63 6f r-horizontal .co
2e10: 6c 6f 72 70 69 63 6b 65 72 2d 68 75 65 20 7b 0a lorpicker-hue {.
2e20: 20 20 40 69 6e 63 6c 75 64 65 20 62 67 48 75 65 @include bgHue
2e30: 48 6f 72 69 7a 6f 6e 74 61 6c 28 29 3b 0a 7d 0a Horizontal();.}.
2e40: 0a 2e 63 6f 6c 6f 72 70 69 63 6b 65 72 2e 63 6f ..colorpicker.co
2e50: 6c 6f 72 70 69 63 6b 65 72 2d 68 6f 72 69 7a 6f lorpicker-horizo
2e60: 6e 74 61 6c 20 2e 63 6f 6c 6f 72 70 69 63 6b 65 ntal .colorpicke
2e70: 72 2d 61 6c 70 68 61 20 7b 0a 20 20 40 69 6e 63 r-alpha {. @inc
2e80: 6c 75 64 65 20 62 67 43 68 65 63 6b 65 72 42 6f lude bgCheckerBo
2e90: 78 28 29 3b 0a 7d 0a 0a 2e 63 6f 6c 6f 72 70 69 x();.}...colorpi
2ea0: 63 6b 65 72 2d 69 6e 6c 69 6e 65 3a 62 65 66 6f cker-inline:befo
2eb0: 72 65 2c 0a 2e 63 6f 6c 6f 72 70 69 63 6b 65 72 re,..colorpicker
2ec0: 2d 6e 6f 2d 61 72 72 6f 77 3a 62 65 66 6f 72 65 -no-arrow:before
2ed0: 2c 0a 2e 63 6f 6c 6f 72 70 69 63 6b 65 72 2d 70 ,..colorpicker-p
2ee0: 6f 70 75 70 2e 63 6f 6c 6f 72 70 69 63 6b 65 72 opup.colorpicker
2ef0: 2d 62 73 2d 70 6f 70 6f 76 65 72 2d 63 6f 6e 74 -bs-popover-cont
2f00: 65 6e 74 3a 62 65 66 6f 72 65 20 7b 0a 20 20 63 ent:before {. c
2f10: 6f 6e 74 65 6e 74 3a 20 6e 6f 6e 65 3b 0a 20 20 ontent: none;.
2f20: 64 69 73 70 6c 61 79 3a 20 6e 6f 6e 65 3b 0a 7d display: none;.}
2f30: 0a 0a 2e 63 6f 6c 6f 72 70 69 63 6b 65 72 2d 69 ...colorpicker-i
2f40: 6e 6c 69 6e 65 3a 61 66 74 65 72 2c 0a 2e 63 6f nline:after,..co
2f50: 6c 6f 72 70 69 63 6b 65 72 2d 6e 6f 2d 61 72 72 lorpicker-no-arr
2f60: 6f 77 3a 61 66 74 65 72 2c 0a 2e 63 6f 6c 6f 72 ow:after,..color
2f70: 70 69 63 6b 65 72 2d 70 6f 70 75 70 2e 63 6f 6c picker-popup.col
2f80: 6f 72 70 69 63 6b 65 72 2d 62 73 2d 70 6f 70 6f orpicker-bs-popo
2f90: 76 65 72 2d 63 6f 6e 74 65 6e 74 3a 61 66 74 65 ver-content:afte
2fa0: 72 20 7b 0a 20 20 63 6f 6e 74 65 6e 74 3a 20 6e r {. content: n
2fb0: 6f 6e 65 3b 0a 20 20 64 69 73 70 6c 61 79 3a 20 one;. display:
2fc0: 6e 6f 6e 65 3b 0a 7d 0a 0a 0a 2e 63 6f 6c 6f 72 none;.}....color
2fd0: 70 69 63 6b 65 72 2d 61 6c 70 68 61 2c 0a 2e 63 picker-alpha,..c
2fe0: 6f 6c 6f 72 70 69 63 6b 65 72 2d 73 61 74 75 72 olorpicker-satur
2ff0: 61 74 69 6f 6e 2c 0a 2e 63 6f 6c 6f 72 70 69 63 ation,..colorpic
3000: 6b 65 72 2d 68 75 65 20 7b 0a 20 20 75 73 65 72 ker-hue {. user
3010: 2d 73 65 6c 65 63 74 3a 20 6e 6f 6e 65 3b 0a 7d -select: none;.}
3020: 0a 0a 2e 63 6f 6c 6f 72 70 69 63 6b 65 72 2c 0a ...colorpicker,.
3030: 2e 63 6f 6c 6f 72 70 69 63 6b 65 72 2d 61 6c 70 .colorpicker-alp
3040: 68 61 2c 0a 2e 63 6f 6c 6f 72 70 69 63 6b 65 72 ha,..colorpicker
3050: 2d 73 61 74 75 72 61 74 69 6f 6e 2c 0a 2e 63 6f -saturation,..co
3060: 6c 6f 72 70 69 63 6b 65 72 2d 68 75 65 2c 0a 2e lorpicker-hue,..
3070: 63 6f 6c 6f 72 70 69 63 6b 65 72 2d 62 61 72 20 colorpicker-bar
3080: 7b 0a 20 20 26 2e 63 6f 6c 6f 72 70 69 63 6b 65 {. &.colorpicke
3090: 72 2d 76 69 73 69 62 6c 65 20 7b 0a 20 20 20 20 r-visible {.
30a0: 64 69 73 70 6c 61 79 3a 20 62 6c 6f 63 6b 3b 0a display: block;.
30b0: 20 20 7d 0a 7d 0a 0a 2e 63 6f 6c 6f 72 70 69 63 }.}...colorpic
30c0: 6b 65 72 2c 0a 2e 63 6f 6c 6f 72 70 69 63 6b 65 ker,..colorpicke
30d0: 72 2d 61 6c 70 68 61 2c 0a 2e 63 6f 6c 6f 72 70 r-alpha,..colorp
30e0: 69 63 6b 65 72 2d 73 61 74 75 72 61 74 69 6f 6e icker-saturation
30f0: 2c 0a 2e 63 6f 6c 6f 72 70 69 63 6b 65 72 2d 68 ,..colorpicker-h
3100: 75 65 2c 0a 2e 63 6f 6c 6f 72 70 69 63 6b 65 72 ue,..colorpicker
3110: 2d 62 61 72 20 7b 0a 20 20 26 2e 63 6f 6c 6f 72 -bar {. &.color
3120: 70 69 63 6b 65 72 2d 68 69 64 64 65 6e 20 7b 0a picker-hidden {.
3130: 20 20 20 20 64 69 73 70 6c 61 79 3a 20 6e 6f 6e display: non
3140: 65 3b 0a 20 20 7d 0a 7d 0a 0a 2e 63 6f 6c 6f 72 e;. }.}...color
3150: 70 69 63 6b 65 72 2d 69 6e 6c 69 6e 65 2e 63 6f picker-inline.co
3160: 6c 6f 72 70 69 63 6b 65 72 2d 76 69 73 69 62 6c lorpicker-visibl
3170: 65 20 7b 0a 20 20 64 69 73 70 6c 61 79 3a 20 69 e {. display: i
3180: 6e 6c 69 6e 65 2d 62 6c 6f 63 6b 3b 0a 7d 0a 0a nline-block;.}..
3190: 2e 63 6f 6c 6f 72 70 69 63 6b 65 72 2e 63 6f 6c .colorpicker.col
31a0: 6f 72 70 69 63 6b 65 72 2d 64 69 73 61 62 6c 65 orpicker-disable
31b0: 64 3a 61 66 74 65 72 20 7b 0a 20 20 62 6f 72 64 d:after {. bord
31c0: 65 72 3a 20 6e 6f 6e 65 3b 0a 20 20 63 6f 6e 74 er: none;. cont
31d0: 65 6e 74 3a 20 27 27 3b 0a 20 20 64 69 73 70 6c ent: '';. displ
31e0: 61 79 3a 20 62 6c 6f 63 6b 3b 0a 20 20 77 69 64 ay: block;. wid
31f0: 74 68 3a 20 31 30 30 25 3b 0a 20 20 68 65 69 67 th: 100%;. heig
3200: 68 74 3a 20 31 30 30 25 3b 0a 20 20 62 61 63 6b ht: 100%;. back
3210: 67 72 6f 75 6e 64 3a 20 72 67 62 61 28 32 33 33 ground: rgba(233
3220: 2c 20 32 33 36 2c 20 32 33 39 2c 20 30 2e 33 33 , 236, 239, 0.33
3230: 29 3b 0a 20 20 74 6f 70 3a 20 30 3b 0a 20 20 6c );. top: 0;. l
3240: 65 66 74 3a 20 30 3b 0a 20 20 72 69 67 68 74 3a eft: 0;. right:
3250: 20 61 75 74 6f 3b 0a 20 20 7a 2d 69 6e 64 65 78 auto;. z-index
3260: 3a 20 32 3b 0a 20 20 70 6f 73 69 74 69 6f 6e 3a : 2;. position:
3270: 20 61 62 73 6f 6c 75 74 65 3b 0a 7d 0a 0a 2e 63 absolute;.}...c
3280: 6f 6c 6f 72 70 69 63 6b 65 72 2e 63 6f 6c 6f 72 olorpicker.color
3290: 70 69 63 6b 65 72 2d 64 69 73 61 62 6c 65 64 20 picker-disabled
32a0: 2e 63 6f 6c 6f 72 70 69 63 6b 65 72 2d 67 75 69 .colorpicker-gui
32b0: 64 65 20 7b 0a 20 20 64 69 73 70 6c 61 79 3a 20 de {. display:
32c0: 6e 6f 6e 65 3b 0a 7d 0a 0a 2f 2a 2a 20 45 58 54 none;.}../** EXT
32d0: 45 4e 53 49 4f 4e 53 20 2a 2a 2f 0a 0a 2e 63 6f ENSIONS **/...co
32e0: 6c 6f 72 70 69 63 6b 65 72 2d 70 72 65 76 69 65 lorpicker-previe
32f0: 77 20 7b 0a 20 20 40 69 6e 63 6c 75 64 65 20 62 w {. @include b
3300: 67 43 68 65 63 6b 65 72 42 6f 78 28 29 3b 0a 7d gCheckerBox();.}
3310: 0a 0a 2e 63 6f 6c 6f 72 70 69 63 6b 65 72 2d 70 ...colorpicker-p
3320: 72 65 76 69 65 77 20 3e 20 64 69 76 20 7b 0a 20 review > div {.
3330: 20 70 6f 73 69 74 69 6f 6e 3a 20 61 62 73 6f 6c position: absol
3340: 75 74 65 3b 0a 20 20 6c 65 66 74 3a 20 30 3b 0a ute;. left: 0;.
3350: 20 20 74 6f 70 3a 20 30 3b 0a 20 20 77 69 64 74 top: 0;. widt
3360: 68 3a 20 31 30 30 25 3b 0a 20 20 68 65 69 67 68 h: 100%;. heigh
3370: 74 3a 20 31 30 30 25 3b 0a 7d 0a 0a 2e 63 6f 6c t: 100%;.}...col
3380: 6f 72 70 69 63 6b 65 72 2d 62 61 72 2e 63 6f 6c orpicker-bar.col
3390: 6f 72 70 69 63 6b 65 72 2d 73 77 61 74 63 68 65 orpicker-swatche
33a0: 73 20 7b 0a 20 20 62 6f 78 2d 73 68 61 64 6f 77 s {. box-shadow
33b0: 3a 20 6e 6f 6e 65 3b 0a 20 20 68 65 69 67 68 74 : none;. height
33c0: 3a 20 61 75 74 6f 3b 0a 7d 0a 0a 2e 63 6f 6c 6f : auto;.}...colo
33d0: 72 70 69 63 6b 65 72 2d 73 77 61 74 63 68 65 73 rpicker-swatches
33e0: 2d 2d 69 6e 6e 65 72 20 7b 0a 20 20 63 6c 65 61 --inner {. clea
33f0: 72 3a 20 62 6f 74 68 3b 0a 20 20 6d 61 72 67 69 r: both;. margi
3400: 6e 2d 74 6f 70 3a 20 2d 24 62 61 73 65 2d 6d 61 n-top: -$base-ma
3410: 72 67 69 6e 3b 0a 7d 0a 0a 2e 63 6f 6c 6f 72 70 rgin;.}...colorp
3420: 69 63 6b 65 72 2d 73 77 61 74 63 68 20 7b 0a 20 icker-swatch {.
3430: 20 70 6f 73 69 74 69 6f 6e 3a 20 72 65 6c 61 74 position: relat
3440: 69 76 65 3b 0a 20 20 63 75 72 73 6f 72 3a 20 70 ive;. cursor: p
3450: 6f 69 6e 74 65 72 3b 0a 20 20 66 6c 6f 61 74 3a ointer;. float:
3460: 20 6c 65 66 74 3b 0a 20 20 68 65 69 67 68 74 3a left;. height:
3470: 20 24 62 61 72 2d 73 69 7a 65 2d 73 68 6f 72 74 $bar-size-short
3480: 3b 0a 20 20 77 69 64 74 68 3a 20 24 62 61 72 2d ;. width: $bar-
3490: 73 69 7a 65 2d 73 68 6f 72 74 3b 0a 20 20 6d 61 size-short;. ma
34a0: 72 67 69 6e 2d 72 69 67 68 74 3a 20 24 62 61 73 rgin-right: $bas
34b0: 65 2d 6d 61 72 67 69 6e 3b 0a 20 20 6d 61 72 67 e-margin;. marg
34c0: 69 6e 2d 74 6f 70 3a 20 24 62 61 73 65 2d 6d 61 in-top: $base-ma
34d0: 72 67 69 6e 3b 0a 20 20 6d 61 72 67 69 6e 2d 6c rgin;. margin-l
34e0: 65 66 74 3a 20 30 3b 0a 20 20 64 69 73 70 6c 61 eft: 0;. displa
34f0: 79 3a 20 62 6c 6f 63 6b 3b 0a 20 20 62 6f 78 2d y: block;. box-
3500: 73 68 61 64 6f 77 3a 20 24 62 6f 78 2d 73 68 61 shadow: $box-sha
3510: 64 6f 77 2d 6f 75 74 6c 69 6e 65 3b 0a 20 20 40 dow-outline;. @
3520: 69 6e 63 6c 75 64 65 20 62 67 43 68 65 63 6b 65 include bgChecke
3530: 72 42 6f 78 28 29 3b 0a 7d 0a 0a 2e 63 6f 6c 6f rBox();.}...colo
3540: 72 70 69 63 6b 65 72 2d 73 77 61 74 63 68 2d 2d rpicker-swatch--
3550: 69 6e 6e 65 72 20 7b 0a 20 20 70 6f 73 69 74 69 inner {. positi
3560: 6f 6e 3a 20 61 62 73 6f 6c 75 74 65 3b 0a 20 20 on: absolute;.
3570: 74 6f 70 3a 20 30 3b 0a 20 20 6c 65 66 74 3a 20 top: 0;. left:
3580: 30 3b 0a 20 20 77 69 64 74 68 3a 20 31 30 30 25 0;. width: 100%
3590: 3b 0a 20 20 68 65 69 67 68 74 3a 20 31 30 30 25 ;. height: 100%
35a0: 3b 0a 7d 0a 0a 2f 2f 20 73 61 74 75 72 61 74 69 ;.}..// saturati
35b0: 6f 6e 20 2b 20 68 75 65 20 76 65 72 74 69 63 61 on + hue vertica
35c0: 6c 20 28 63 6c 65 61 72 20 6d 61 72 67 69 6e 2d l (clear margin-
35d0: 72 69 67 68 74 20 6f 6e 20 6e 74 68 20 63 6f 6c right on nth col
35e0: 75 6d 6e 20 2b 20 31 29 0a 2e 63 6f 6c 6f 72 70 umn + 1)..colorp
35f0: 69 63 6b 65 72 2d 73 77 61 74 63 68 3a 6e 74 68 icker-swatch:nth
3600: 2d 6f 66 2d 74 79 70 65 28 23 7b 24 63 6f 6c 75 -of-type(#{$colu
3610: 6d 6e 73 20 2b 20 31 7d 6e 2b 30 29 20 7b 0a 20 mns + 1}n+0) {.
3620: 20 6d 61 72 67 69 6e 2d 72 69 67 68 74 3a 20 30 margin-right: 0
3630: 3b 0a 7d 0a 0a 2f 2f 20 73 61 74 75 72 61 74 69 ;.}..// saturati
3640: 6f 6e 20 2b 20 68 75 65 20 2b 20 61 6c 70 68 61 on + hue + alpha
3650: 20 76 65 72 74 69 63 61 6c 20 28 63 6c 65 61 72 vertical (clear
3660: 20 6d 61 72 67 69 6e 2d 72 69 67 68 74 20 6f 6e margin-right on
3670: 20 6e 74 68 20 63 6f 6c 75 6d 6e 20 2b 20 32 29 nth column + 2)
3680: 0a 2e 63 6f 6c 6f 72 70 69 63 6b 65 72 2d 77 69 ..colorpicker-wi
3690: 74 68 2d 61 6c 70 68 61 20 7b 0a 20 20 2e 63 6f th-alpha {. .co
36a0: 6c 6f 72 70 69 63 6b 65 72 2d 73 77 61 74 63 68 lorpicker-swatch
36b0: 3a 6e 74 68 2d 6f 66 2d 74 79 70 65 28 23 7b 24 :nth-of-type(#{$
36c0: 63 6f 6c 75 6d 6e 73 20 2b 20 31 7d 6e 2b 30 29 columns + 1}n+0)
36d0: 20 7b 0a 20 20 20 20 6d 61 72 67 69 6e 2d 72 69 {. margin-ri
36e0: 67 68 74 3a 20 24 62 61 73 65 2d 6d 61 72 67 69 ght: $base-margi
36f0: 6e 3b 0a 20 20 7d 0a 0a 20 20 2e 63 6f 6c 6f 72 n;. }.. .color
3700: 70 69 63 6b 65 72 2d 73 77 61 74 63 68 3a 6e 74 picker-swatch:nt
3710: 68 2d 6f 66 2d 74 79 70 65 28 23 7b 24 63 6f 6c h-of-type(#{$col
3720: 75 6d 6e 73 20 2b 20 32 7d 6e 2b 30 29 20 7b 0a umns + 2}n+0) {.
3730: 20 20 20 20 6d 61 72 67 69 6e 2d 72 69 67 68 74 margin-right
3740: 3a 20 30 3b 0a 20 20 7d 0a 7d 0a 0a 2f 2f 20 68 : 0;. }.}..// h
3750: 6f 72 69 7a 6f 6e 74 61 6c 20 6d 6f 64 65 20 28 orizontal mode (
3760: 63 6c 65 61 72 20 6d 61 72 67 69 6e 2d 72 69 67 clear margin-rig
3770: 68 74 20 6f 6e 20 6e 74 68 20 63 6f 6c 75 6d 6e ht on nth column
3780: 29 0a 2e 63 6f 6c 6f 72 70 69 63 6b 65 72 2d 68 )..colorpicker-h
3790: 6f 72 69 7a 6f 6e 74 61 6c 20 7b 0a 20 20 2e 63 orizontal {. .c
37a0: 6f 6c 6f 72 70 69 63 6b 65 72 2d 73 77 61 74 63 olorpicker-swatc
37b0: 68 3a 6e 74 68 2d 6f 66 2d 74 79 70 65 28 23 7b h:nth-of-type(#{
37c0: 24 63 6f 6c 75 6d 6e 73 7d 6e 2b 30 29 20 7b 0a $columns}n+0) {.
37d0: 20 20 20 20 6d 61 72 67 69 6e 2d 72 69 67 68 74 margin-right
37e0: 3a 20 30 3b 0a 20 20 7d 0a 0a 20 20 2e 63 6f 6c : 0;. }.. .col
37f0: 6f 72 70 69 63 6b 65 72 2d 73 77 61 74 63 68 3a orpicker-swatch:
3800: 6e 74 68 2d 6f 66 2d 74 79 70 65 28 23 7b 24 63 nth-of-type(#{$c
3810: 6f 6c 75 6d 6e 73 20 2b 20 31 7d 6e 2b 30 29 20 olumns + 1}n+0)
3820: 7b 0a 20 20 20 20 6d 61 72 67 69 6e 2d 72 69 67 {. margin-rig
3830: 68 74 3a 20 24 62 61 73 65 2d 6d 61 72 67 69 6e ht: $base-margin
3840: 3b 0a 20 20 7d 0a 0a 20 20 2e 63 6f 6c 6f 72 70 ;. }.. .colorp
3850: 69 63 6b 65 72 2d 73 77 61 74 63 68 3a 6e 74 68 icker-swatch:nth
3860: 2d 6f 66 2d 74 79 70 65 28 23 7b 24 63 6f 6c 75 -of-type(#{$colu
3870: 6d 6e 73 20 2b 20 32 7d 6e 2b 30 29 20 7b 0a 20 mns + 2}n+0) {.
3880: 20 20 20 6d 61 72 67 69 6e 2d 72 69 67 68 74 3a margin-right:
3890: 20 24 62 61 73 65 2d 6d 61 72 67 69 6e 3b 0a 20 $base-margin;.
38a0: 20 7d 0a 7d 0a 0a 2e 63 6f 6c 6f 72 70 69 63 6b }.}...colorpick
38b0: 65 72 2d 73 77 61 74 63 68 3a 6c 61 73 74 2d 6f er-swatch:last-o
38c0: 66 2d 74 79 70 65 3a 61 66 74 65 72 20 7b 0a 20 f-type:after {.
38d0: 20 63 6f 6e 74 65 6e 74 3a 20 22 22 3b 0a 20 20 content: "";.
38e0: 64 69 73 70 6c 61 79 3a 20 74 61 62 6c 65 3b 0a display: table;.
38f0: 20 20 63 6c 65 61 72 3a 20 62 6f 74 68 3b 0a 7d clear: both;.}
3900: 0a 0a 2f 2f 20 52 54 4c 20 77 72 69 74 69 6e 67 ..// RTL writing
3910: 20 6d 6f 64 65 20 73 75 70 70 6f 72 74 0a 2a 5b mode support.*[
3920: 64 69 72 3d 27 72 74 6c 27 5d 20 2e 63 6f 6c 6f dir='rtl'] .colo
3930: 72 70 69 63 6b 65 72 2d 65 6c 65 6d 65 6e 74 20 rpicker-element
3940: 69 6e 70 75 74 2c 0a 2e 63 6f 6c 6f 72 70 69 63 input,..colorpic
3950: 6b 65 72 2d 65 6c 65 6d 65 6e 74 5b 64 69 72 3d ker-element[dir=
3960: 27 72 74 6c 27 5d 20 69 6e 70 75 74 2c 0a 2e 63 'rtl'] input,..c
3970: 6f 6c 6f 72 70 69 63 6b 65 72 2d 65 6c 65 6d 65 olorpicker-eleme
3980: 6e 74 20 69 6e 70 75 74 5b 64 69 72 3d 27 72 74 nt input[dir='rt
3990: 6c 27 5d 20 7b 0a 20 20 64 69 72 65 63 74 69 6f l'] {. directio
39a0: 6e 3a 20 6c 74 72 3b 0a 20 20 74 65 78 74 2d 61 n: ltr;. text-a
39b0: 6c 69 67 6e 3a 20 72 69 67 68 74 3b 0a 7d 0a lign: right;.}.