32751ceafb
- Closes #57; - Added floating panel tweak. Supports opaque tweak; - Fixed an issue when opaque tweak does not apply to translucent background; - Fixed an issue when panel text color tweak does not apply to clock button correctly and defined color does not work in overview. Extracted panel text color tweak to another function; - Renamed BUTTON-CLOSE-COLOR to ACCENT-DISABLED-OPAQUE-COLOR;
688 lines
16 KiB
JSON
688 lines
16 KiB
JSON
{
|
|
"elements" : {
|
|
"BUTTON-COLOR" : {
|
|
"_comment" : "Color for buttons. Replaced by ACCENT-COLOR / ACCENT-FILLED-COLOR",
|
|
"default" : "ACCENT-COLOR"
|
|
},
|
|
"BUTTON_HOVER" : {
|
|
"_comment" : "Hover color for buttons.",
|
|
"default" : "ACCENT_HOVER"
|
|
},
|
|
"BUTTON_ACTIVE" : {
|
|
"_comment" : "Hover color for buttons.",
|
|
"default" : "ACCENT_ACTIVE"
|
|
},
|
|
"BUTTON_INSENSITIVE" : {
|
|
"_comment" : "Color of disabled buttons",
|
|
"default" : "ACCENT_INSENSITIVE"
|
|
},
|
|
|
|
"BUTTON-TEXT-COLOR" : {
|
|
"_comment" : "Text color for buttons",
|
|
"default" : "TEXT-PRIMARY-COLOR"
|
|
},
|
|
"BUTTON-TEXT_SECONDARY" : {
|
|
"_comment" : "Text color for buttons",
|
|
"default" : "TEXT-SECONDARY-COLOR"
|
|
},
|
|
|
|
"ACCENT-COLOR" : {
|
|
"_comment" : "Active buttons/toggles",
|
|
"replace" : "ACCENT-COLOR",
|
|
|
|
"light" : {
|
|
"s" : 52,
|
|
"l" : 67,
|
|
"a" : 1
|
|
},
|
|
|
|
"dark" : {
|
|
"s" : 42,
|
|
"l" : 26,
|
|
"a" : 1
|
|
}
|
|
},
|
|
"ACCENT_HOVER" : {
|
|
"_comment" : "Hover color in active buttons/toggles",
|
|
|
|
"light" : {
|
|
"s" : 50,
|
|
"l" : 60,
|
|
"a" : 1
|
|
},
|
|
|
|
"dark" : {
|
|
"s" : 66,
|
|
"l" : 22,
|
|
"a" : 1
|
|
}
|
|
},
|
|
"ACCENT_ACTIVE" : {
|
|
"_comment" : "Active color in active buttons/toggles",
|
|
|
|
"light" : {
|
|
"s" : 48,
|
|
"l" : 52,
|
|
"a" : 1
|
|
},
|
|
|
|
"dark" : {
|
|
"s" : 72,
|
|
"l" : 18,
|
|
"a" : 1
|
|
}
|
|
},
|
|
"ACCENT_INSENSITIVE" : {
|
|
"_comment" : "Accent color for insensitive elements",
|
|
|
|
"light" : {
|
|
"s" : 52,
|
|
"l" : 50,
|
|
"a" : 0.5
|
|
},
|
|
|
|
"dark" : {
|
|
"s" : 42,
|
|
"l" : 26,
|
|
"a" : 0.6
|
|
}
|
|
},
|
|
|
|
"ACCENT-DISABLED-COLOR" : {
|
|
"_comment" : "Buttons / disabled toggles",
|
|
|
|
"light" : {
|
|
"s" : 40,
|
|
"l" : 90,
|
|
"a" : 0.9
|
|
},
|
|
|
|
"dark" : {
|
|
"s" : 95,
|
|
"l" : 85,
|
|
"a" : 0.08
|
|
}
|
|
},
|
|
"ACCENT-DISABLED_HOVER" : {
|
|
"_comment" : "Hover color in buttons / disabled toggles",
|
|
|
|
"light" : {
|
|
"s" : 35,
|
|
"l" : 85,
|
|
"a" : 0.95
|
|
},
|
|
|
|
"dark" : {
|
|
"s" : 40,
|
|
"l" : 85,
|
|
"a" : 0.13
|
|
}
|
|
},
|
|
"ACCENT-DISABLED_ACTIVE" : {
|
|
"_comment" : "Hover color in buttons / disabled toggles",
|
|
|
|
"light" : {
|
|
"s" : 35,
|
|
"l" : 80,
|
|
"a" : 0.95
|
|
},
|
|
|
|
"dark" : {
|
|
"s" : 40,
|
|
"l" : 85,
|
|
"a" : 0.2
|
|
}
|
|
},
|
|
|
|
"ACCENT-SECONDARY-COLOR" : {
|
|
"_comment" : "Capture button in Screenshot UI, checkboxes; borders when focusing on element",
|
|
|
|
"light" : {
|
|
"s" : 20,
|
|
"l" : 50,
|
|
"a" : 1
|
|
},
|
|
|
|
"dark" : {
|
|
"s" : 20,
|
|
"l" : 75,
|
|
"a" : 1
|
|
}
|
|
},
|
|
"ACCENT-SECONDARY_HOVER" : {
|
|
"_comment" : "Secondary accent color on hover",
|
|
|
|
"light" : {
|
|
"s" : 20,
|
|
"l" : 45,
|
|
"a" : 1
|
|
},
|
|
|
|
"dark" : {
|
|
"s" : 20,
|
|
"l" : 70,
|
|
"a" : 1
|
|
}
|
|
},
|
|
|
|
"ACCENT-OPACITY-COLOR" : {
|
|
"_comment" : "Accent color, but with transparency. Used in selected workspace indicator / tiled windows / window selection (Screenshot UI)",
|
|
|
|
"light" : {
|
|
"s" : 78,
|
|
"l" : 84,
|
|
"a" : 0.5
|
|
},
|
|
|
|
"dark" : {
|
|
"s" : 42,
|
|
"l" : 26,
|
|
"a" : 0.2
|
|
}
|
|
},
|
|
|
|
"ACCENT-LOGIN-COLOR" : {
|
|
"_comment" : "Accent color for login screen user list",
|
|
|
|
"light" : {
|
|
"s" : 65,
|
|
"l" : 65,
|
|
"a" : 1
|
|
},
|
|
|
|
"dark" : {
|
|
"s" : 65,
|
|
"l" : 55,
|
|
"a" : 1
|
|
}
|
|
},
|
|
"ACCENT-LOGIN_HOVER" : {
|
|
"_comment" : "Hover color for login screen user list",
|
|
|
|
"light" : {
|
|
"s" : 65,
|
|
"l" : 55,
|
|
"a" : 0.8
|
|
},
|
|
|
|
"dark" : {
|
|
"s" : 65,
|
|
"l" : 55,
|
|
"a" : 0.8
|
|
}
|
|
},
|
|
|
|
"ACCENT-FILLED-COLOR" : {
|
|
"_comment" : "Accent color but more vibrant",
|
|
|
|
"light" : {
|
|
"s" : 76,
|
|
"l" : 68,
|
|
"a" : 1
|
|
},
|
|
|
|
"dark" : {
|
|
"s" : 76,
|
|
"l" : 68,
|
|
"a" : 1
|
|
}
|
|
},
|
|
"ACCENT-FILLED_HOVER" : {
|
|
"_comment" : "Hover effect for accent filled color",
|
|
|
|
"light" : {
|
|
"s" : 70,
|
|
"l" : 60,
|
|
"a" : 1
|
|
},
|
|
|
|
"dark" : {
|
|
"s" : 80,
|
|
"l" : 75,
|
|
"a" : 1
|
|
}
|
|
},
|
|
"ACCENT-FILLED_ACTIVE" : {
|
|
"_comment" : "Active effect for accent filled color",
|
|
|
|
"light" : {
|
|
"s" : 65,
|
|
"l" : 55,
|
|
"a" : 1
|
|
},
|
|
|
|
"dark" : {
|
|
"s" : 100,
|
|
"l" : 82,
|
|
"a" : 1
|
|
}
|
|
},
|
|
"ACCENT-FILLED_INSENSITIVE" : {
|
|
"_comment" : "Vibrant color for insensitive elements",
|
|
|
|
"light" : {
|
|
"s" : 76,
|
|
"l" : 40,
|
|
"a" : 0.4
|
|
},
|
|
|
|
"dark" : {
|
|
"s" : 76,
|
|
"l" : 68,
|
|
"a" : 0.5
|
|
}
|
|
},
|
|
|
|
"BACKGROUND-COLOR" : {
|
|
"_comment" : "Background color. Used in overview, panel, different menus...",
|
|
|
|
"light" : {
|
|
"s" : 50,
|
|
"l" : 97,
|
|
"a" : 0.92
|
|
},
|
|
|
|
"dark" : {
|
|
"s" : 7,
|
|
"l" : 10,
|
|
"a" : 0.95
|
|
}
|
|
},
|
|
"BACKGROUND-OPAQUE-COLOR" : {
|
|
"_comment" : "Background color panel and overview (fix flickering)",
|
|
|
|
"light" : {
|
|
"s" : 50,
|
|
"l" : 97,
|
|
"a" : 1
|
|
},
|
|
|
|
"dark" : {
|
|
"s" : 7,
|
|
"l" : 9,
|
|
"a" : 1
|
|
}
|
|
},
|
|
|
|
"DASH-COLOR" : {
|
|
"_comment" : "Special background color for dash and for panel buttons with floating buttons tweak",
|
|
|
|
"light" : {
|
|
"s" : 40,
|
|
"l" : 98,
|
|
"a" : 0.8
|
|
},
|
|
|
|
"dark" : {
|
|
"s" : 5,
|
|
"l" : 20,
|
|
"a" : 0.7
|
|
}
|
|
},
|
|
"DASH_OVERVIEW" : {
|
|
"_comment" : "Dash background when in overview",
|
|
|
|
"light" : {
|
|
"s" : 60,
|
|
"l" : 90,
|
|
"a" : 0.8
|
|
},
|
|
|
|
"dark" : {
|
|
"s" : 0,
|
|
"l" : 100,
|
|
"a" : 0.12
|
|
}
|
|
},
|
|
|
|
"WELL-APP-SELECTED" : {
|
|
"_comment" : "Running app dot",
|
|
|
|
"light" : {
|
|
"s" : 20,
|
|
"l" : 50,
|
|
"a" : 0.4
|
|
},
|
|
|
|
"dark" : {
|
|
"s" : 20,
|
|
"l" : 75,
|
|
"a" : 0.4
|
|
}
|
|
},
|
|
|
|
"TEXT-PRIMARY-COLOR" : {
|
|
"_comment" : "Used as primary color in text",
|
|
|
|
"light" : {
|
|
"s" : 31,
|
|
"l" : 20,
|
|
"a" : 1
|
|
},
|
|
|
|
"dark" : {
|
|
"s" : 65,
|
|
"l" : 95,
|
|
"a" : 1
|
|
}
|
|
},
|
|
"TEXT-SECONDARY-COLOR" : {
|
|
"_comment" : "Item description, time stamp",
|
|
|
|
"light" : {
|
|
"s" : 71,
|
|
"l" : 10,
|
|
"a" : 0.6
|
|
},
|
|
|
|
"dark" : {
|
|
"s" : 65,
|
|
"l" : 95,
|
|
"a" : 0.67
|
|
}
|
|
},
|
|
"TEXT-DISABLED-COLOR" : {
|
|
"_comment" : "No notifications, Searching..., etc. labels",
|
|
|
|
"light" : {
|
|
"s" : 71,
|
|
"l" : 10,
|
|
"a" : 0.38
|
|
},
|
|
|
|
"dark" : {
|
|
"s" : 65,
|
|
"l" : 95,
|
|
"a" : 0.38
|
|
}
|
|
},
|
|
|
|
"TEXT-INVERTED-COLOR": {
|
|
"_comment" : "Screenshot UI shot/cast button",
|
|
|
|
"light" : {
|
|
"s" : 65,
|
|
"l" : 95,
|
|
"a" : 1
|
|
},
|
|
|
|
"dark" : {
|
|
"s" : 71,
|
|
"l" : 10,
|
|
"a" : 0.87
|
|
}
|
|
},
|
|
|
|
"TEXT-WHITE-COLOR" : {
|
|
|
|
"light" : {
|
|
"s" : 65,
|
|
"l" : 95,
|
|
"a" : 1
|
|
},
|
|
|
|
"dark" : {
|
|
"s" : 65,
|
|
"l" : 95,
|
|
"a" : 1
|
|
}
|
|
},
|
|
"TEXT-BLACK-COLOR" : {
|
|
|
|
"light" : {
|
|
"s" : 31,
|
|
"l" : 20,
|
|
"a" : 1
|
|
},
|
|
|
|
"dark" : {
|
|
"s" : 31,
|
|
"l" : 20,
|
|
"a" : 1
|
|
}
|
|
},
|
|
"TEXT-BLACK_SECONDARY" : {
|
|
|
|
"light" : {
|
|
"s" : 71,
|
|
"l" : 10,
|
|
"a" : 0.6
|
|
},
|
|
|
|
"dark" : {
|
|
"s" : 71,
|
|
"l" : 10,
|
|
"a" : 0.67
|
|
}
|
|
},
|
|
|
|
"BORDER-SHADOW" : {
|
|
"_comment" : "Used as border in buttons",
|
|
|
|
"light" : {
|
|
"s" : 0,
|
|
"l" : 0,
|
|
"a" : 0.05
|
|
},
|
|
|
|
"dark" : {
|
|
"s" : 0,
|
|
"l" : 100,
|
|
"a" : 0.03
|
|
}
|
|
},
|
|
"BORDER-MENU-SHADOW" : {
|
|
"_comment" : "Used as border in menus",
|
|
|
|
"light" : {
|
|
"s" : 0,
|
|
"l" : 0,
|
|
"a" : 0.1
|
|
},
|
|
|
|
"dark" : {
|
|
"s" : 0,
|
|
"l" : 100,
|
|
"a" : 0.07
|
|
}
|
|
},
|
|
"PANEL-BUTTON-BORDER": {
|
|
"_comment" : "Used as border in panel buttons",
|
|
|
|
"light" : {
|
|
"s" : 0,
|
|
"l" : 0,
|
|
"a" : 0.07
|
|
},
|
|
|
|
"dark" : {
|
|
"s" : 0,
|
|
"l" : 100,
|
|
"a" : 0.04
|
|
}
|
|
},
|
|
|
|
"SEPARATOR-COLOR" : {
|
|
"_comment" : "Color for separators",
|
|
|
|
"light" : {
|
|
"s" : 0,
|
|
"l" : 0,
|
|
"a" : 0.1
|
|
},
|
|
|
|
"dark" : {
|
|
"s" : 0,
|
|
"l" : 100,
|
|
"a" : 0.1
|
|
}
|
|
},
|
|
|
|
"SHOW-APPS-ICON-COLOR" : {
|
|
"_comment" : "Dash: Show Apps icon",
|
|
|
|
"light" : {
|
|
"s" : 4,
|
|
"l" : 30,
|
|
"a" : 1
|
|
},
|
|
|
|
"dark" : {
|
|
"s" : 65,
|
|
"l" : 95,
|
|
"a" : 1
|
|
}
|
|
},
|
|
|
|
"SCROLLBAR-COLOR" : {
|
|
"_comment" : "Special color for scrollbars",
|
|
|
|
"light" : {
|
|
"s" : 20,
|
|
"l" : 70,
|
|
"a" : 0.75
|
|
},
|
|
|
|
"dark" : {
|
|
"s" : 10,
|
|
"l" : 25,
|
|
"a" : 0.75
|
|
}
|
|
},
|
|
"SCROLLBAR_HOVER" : {
|
|
|
|
"light" : {
|
|
"s" : 20,
|
|
"l" : 70,
|
|
"a" : 1
|
|
},
|
|
|
|
"dark" : {
|
|
"s" : 12,
|
|
"l" : 25,
|
|
"a" : 1
|
|
}
|
|
},
|
|
"SCROLLBAR_ACTIVE" : {
|
|
|
|
"light" : {
|
|
"s" : 20,
|
|
"l" : 70,
|
|
"a" : 0.87
|
|
},
|
|
|
|
"dark" : {
|
|
"s" : 12,
|
|
"l" : 35,
|
|
"a" : 0.87
|
|
}
|
|
},
|
|
|
|
"PAGE-NAV-HINT" : {
|
|
"_comment" : "Left and right hints on edges of the screen when dragging app icon ",
|
|
|
|
"light" : {
|
|
"s" : 95,
|
|
"l" : 20,
|
|
"a" : 0.05
|
|
},
|
|
|
|
"dark" : {
|
|
"s" : 15,
|
|
"l" : 90,
|
|
"a" : 0.05
|
|
}
|
|
},
|
|
|
|
"SECTION-COLOR" : {
|
|
"_comment" : "Same as ACCENT-DISABLED-COLOR, but less contrast and has no transparency",
|
|
|
|
"light" : {
|
|
"s" : 45,
|
|
"l" : 92,
|
|
"a" : 0.8
|
|
},
|
|
|
|
"dark" : {
|
|
"s" : 5,
|
|
"l" : 25,
|
|
"a" : 0.2
|
|
}
|
|
},
|
|
"SECTION-OPAQUE-COLOR" : {
|
|
"_comment" : "Same as SECTION-COLOR, but has no transparency",
|
|
|
|
"light" : { "s": 45, "l": 92, "a": 0.95 },
|
|
"dark" : { "s": 6, "l": 14, "a": 0.95 }
|
|
},
|
|
"SECTION-OPAQUE_HOVER": {
|
|
"light": { "s": 45, "l": 89, "a": 0.95 },
|
|
"dark": { "s": 11, "l": 17, "a": 0.95 }
|
|
},
|
|
"SECTION-OPAQUE_SECOND": {
|
|
"_comment": "Will be removed after moving to scss",
|
|
"light": { "s": 30, "l": 88, "a": 0.9 },
|
|
"dark": { "s": 7, "l": 11, "a": 0.95 }
|
|
},
|
|
"SECTION-OPAQUE_THIRD": {
|
|
"_comment": "Will be removed after moving to scss",
|
|
"light": { "s": 25, "l": 85, "a": 0.9 },
|
|
"dark": { "s": 5, "l": 10, "a": 0.9 }
|
|
},
|
|
|
|
"ACCENT-DISABLED-OPAQUE-COLOR": {
|
|
"_comment" : "Same as ACCENT-DISABLED-COLOR, but has no transparency",
|
|
|
|
"light" : {
|
|
"s" : 35,
|
|
"l" : 90,
|
|
"a" : 1
|
|
},
|
|
|
|
"dark" : {
|
|
"s" : 6,
|
|
"l" : 15,
|
|
"a" : 1
|
|
}
|
|
},
|
|
"ACCENT-DISABLED-OPAQUE_HOVER": {
|
|
"_comment" : "Same as ACCENT-DISABLED_HOVER, but has no transparency",
|
|
|
|
"light" : {
|
|
"s" : 35,
|
|
"l" : 85,
|
|
"a" : 1
|
|
},
|
|
|
|
"dark" : {
|
|
"s" : 7,
|
|
"l" : 20,
|
|
"a" : 1
|
|
}
|
|
}
|
|
|
|
},
|
|
|
|
"_comment" : "You can add, edit or remove the colors below. 'h' is hue, 's' is saturation.",
|
|
"colors" : {
|
|
"red" : {
|
|
"h" : 0
|
|
},
|
|
"yellow" : {
|
|
"h" : 40
|
|
},
|
|
"green" : {
|
|
"h" : 135
|
|
},
|
|
"blue" : {
|
|
"h" : 210
|
|
},
|
|
"purple" : {
|
|
"h" : 275
|
|
},
|
|
"gray" : {
|
|
"h" : 0,
|
|
"s" : 0
|
|
}
|
|
}
|
|
} |