重整 Tocas 的 Color 顏色系統

[YamiOdymel]

目前的顏色系統如下：

//            1        2        3        4        5        6        7        8        9       10
//                                             Border    Main
//          Active  Disabled    Bg    Divider   Hover    Brand   Pressed
$grey    : #fbfbfb, #f7f7f7, #f5f5f5, #e9e9e9, #d9d9d9, #bfbfbf, #919191, #5a5a5a, #404040, #222222
$primary : #EBF9FD, #CFF0FB, #A7E3F8, #76D3F4, #3DC1EF, #00ADEA, #0092CB, #0076AC, #005A8B, #003D6B
$positive: #F6F9F4, #E9F2E4, #D7E7CD, #C1D9B1, #A7CA91, #8BB96E, #7FA45F, #738F50, #677A40, #5A6430
$negative: #FBF2F2, #F6E1DF, #EEC8C6, #E5A9A5, #DA8580, #CE5F58, #B85052, #A1414C, #8A3145, #73213F
$info    : #F4F8F9, #E6EFF2, #D1E1E7, #B7D0D9, #99BDCA, #79A8B9, #6791A2, #55798A, #436172, #30485A
$warning : #FDFEF3, #FBFDE1, #F7FCC9, #F3FAAA, #EEF788, #E8F562, #D7D44D, #C6B337, #B59120, #A36E0A
$inverted: #EFEFEF, #D8D8D8, #B9B9B9, #919191, #404040, #333333, #2C2C2C, #252525, #1E1E1E, #171717
$link    : #ecf6fd, #d2eafb, #add8f7, #7ec2f3, #49a9ee, #108ee9, #0e77ca, #0c60aa, #09488a, #073069

依照顏色層級區分顏色不應該是主要的手段，因為不同顏色的 Active 顏色會因為背景色而造成該用的 Level 層級不同（例如 Default 的文字是 Level 6，但 Inverted 卻是 Level 1）。

所以解決方法應該是同時保留顏色層級，但追加一個更主要、主觀的顏色變數（例如：$primaryActiveColor 而不是透過 nth($primary, 6)）

也有可能採用 color('primary', 'active') 等作法。

---

fomantic/Fomantic-UI#261