ari-party/rojo
1
0
Fork 0
forked from rojo-rbx/rojo
Code Pull Requests Activity

Update Theme to use Color3.fromHex (#761)

Browse Source
This commit is contained in:
utrain
2023-08-01 12:36:29 -04:00
committed by GitHub
parent 5b22ef192e
commit 4cb5d4a9c5
2 changed files with 79 additions and 86 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
CHANGELOG.md
View File

@@ -1,6 +1,7 @@
# Rojo Changelog # Rojo Changelog
## Unreleased Changes ## Unreleased Changes
* Internally for themes, we use `Color3.fromHex` now instead of custom-made solution ([#761]).
* On failing to open a file from Roblox Studio, it is now logged appropriately instead of being ignored ([#745]). * On failing to open a file from Roblox Studio, it is now logged appropriately instead of being ignored ([#745]).
* Significantly improved performance of `rojo sourcemap`. ([#668]) * Significantly improved performance of `rojo sourcemap`. ([#668])
* Fixed the diff visualizer of connected sessions. ([#674]) * Fixed the diff visualizer of connected sessions. ([#674])
@@ -25,6 +26,7 @@
* Fix PatchTree performance issues ([#755]) * Fix PatchTree performance issues ([#755])
* Don't override the initial enabled state for source diffing ([#760]) * Don't override the initial enabled state for source diffing ([#760])
[#761]: https://github.com/rojo-rbx/rojo/pull/761
[#745]: https://github.com/rojo-rbx/rojo/pull/745 [#745]: https://github.com/rojo-rbx/rojo/pull/745
[#668]: https://github.com/rojo-rbx/rojo/pull/668 [#668]: https://github.com/rojo-rbx/rojo/pull/668
[#674]: https://github.com/rojo-rbx/rojo/pull/674 [#674]: https://github.com/rojo-rbx/rojo/pull/674

163
plugin/src/App/Theme.lua
View File

@@ -23,207 +23,198 @@ local Log = require(Packages.Log)
local strict = require(script.Parent.Parent.strict) local strict = require(script.Parent.Parent.strict)
-- Copying hex colors back and forth from design programs is faster local BRAND_COLOR = Color3.fromHex("E13835")
local function hexColor(decimal)
local red = bit32.band(bit32.rshift(decimal, 16), 2^8 - 1)
local green = bit32.band(bit32.rshift(decimal, 8), 2^8 - 1)
local blue = bit32.band(decimal, 2^8 - 1)
return Color3.fromRGB(red, green, blue)
end
local BRAND_COLOR = hexColor(0xE13835)
local lightTheme = strict("LightTheme", { local lightTheme = strict("LightTheme", {
BackgroundColor = hexColor(0xFFFFFF), BackgroundColor = Color3.fromHex("FFFFFF"),
Button = { Button = {
Solid = { Solid = {
ActionFillColor = hexColor(0xFFFFFF), ActionFillColor = Color3.fromHex("FFFFFF"),
ActionFillTransparency = 0.8, ActionFillTransparency = 0.8,
Enabled = { Enabled = {
TextColor = hexColor(0xFFFFFF), TextColor = Color3.fromHex("FFFFFF"),
BackgroundColor = BRAND_COLOR, BackgroundColor = BRAND_COLOR,
}, },
Disabled = { Disabled = {
TextColor = hexColor(0xFFFFFF), TextColor = Color3.fromHex("FFFFFF"),
BackgroundColor = BRAND_COLOR, BackgroundColor = BRAND_COLOR,
}, },
}, },
Bordered = { Bordered = {
ActionFillColor = hexColor(0x000000), ActionFillColor = Color3.fromHex("000000"),
ActionFillTransparency = 0.9, ActionFillTransparency = 0.9,
Enabled = { Enabled = {
TextColor = hexColor(0x393939), TextColor = Color3.fromHex("393939"),
BorderColor = hexColor(0xACACAC), BorderColor = Color3.fromHex("ACACAC"),
}, },
Disabled = { Disabled = {
TextColor = hexColor(0x393939), TextColor = Color3.fromHex("393939"),
BorderColor = hexColor(0xACACAC), BorderColor = Color3.fromHex("ACACAC"),
}, },
}, },
}, },
Checkbox = { Checkbox = {
Active = { Active = {
IconColor = hexColor(0xFFFFFF), IconColor = Color3.fromHex("FFFFFF"),
BackgroundColor = BRAND_COLOR, BackgroundColor = BRAND_COLOR,
}, },
Inactive = { Inactive = {
IconColor = hexColor(0xEEEEEE), IconColor = Color3.fromHex("EEEEEE"),
BorderColor = hexColor(0xAFAFAF), BorderColor = Color3.fromHex("AFAFAF"),
}, },
}, },
Dropdown = { Dropdown = {
TextColor = hexColor(0x00000), TextColor = Color3.fromHex("00000"),
BorderColor = hexColor(0xAFAFAF), BorderColor = Color3.fromHex("AFAFAF"),
BackgroundColor = hexColor(0xEEEEEE), BackgroundColor = Color3.fromHex("EEEEEE"),
Open = { Open = {
IconColor = BRAND_COLOR, IconColor = BRAND_COLOR,
}, },
Closed = { Closed = {
IconColor = hexColor(0xEEEEEE), IconColor = Color3.fromHex("EEEEEE"),
}, },
}, },
AddressEntry = { AddressEntry = {
TextColor = hexColor(0x000000), TextColor = Color3.fromHex("000000"),
PlaceholderColor = hexColor(0x8C8C8C) PlaceholderColor = Color3.fromHex("8C8C8C")
}, },
BorderedContainer = { BorderedContainer = {
BorderColor = hexColor(0xCBCBCB), BorderColor = Color3.fromHex("CBCBCB"),
BackgroundColor = hexColor(0xEEEEEE), BackgroundColor = Color3.fromHex("EEEEEE"),
}, },
Spinner = { Spinner = {
ForegroundColor = BRAND_COLOR, ForegroundColor = BRAND_COLOR,
BackgroundColor = hexColor(0xEEEEEE), BackgroundColor = Color3.fromHex("EEEEEE"),
}, },
Diff = { Diff = {
Add = hexColor(0xbaffbd), Add = Color3.fromHex("baffbd"),
Remove = hexColor(0xffbdba), Remove = Color3.fromHex("ffbdba"),
Edit = hexColor(0xbacdff), Edit = Color3.fromHex("bacdff"),
Row = hexColor(0x000000), Row = Color3.fromHex("000000"),
Warning = hexColor(0xFF8E3C), Warning = Color3.fromHex("FF8E3C"),
}, },
ConnectionDetails = { ConnectionDetails = {
ProjectNameColor = hexColor(0x00000), ProjectNameColor = Color3.fromHex("00000"),
AddressColor = hexColor(0x00000), AddressColor = Color3.fromHex("00000"),
DisconnectColor = BRAND_COLOR, DisconnectColor = BRAND_COLOR,
}, },
Settings = { Settings = {
DividerColor = hexColor(0xCBCBCB), DividerColor = Color3.fromHex("CBCBCB"),
Navbar = { Navbar = {
BackButtonColor = hexColor(0x000000), BackButtonColor = Color3.fromHex("000000"),
TextColor = hexColor(0x000000), TextColor = Color3.fromHex("000000"),
}, },
Setting = { Setting = {
NameColor = hexColor(0x000000), NameColor = Color3.fromHex("000000"),
DescriptionColor = hexColor(0x5F5F5F), DescriptionColor = Color3.fromHex("5F5F5F"),
}, },
}, },
Header = { Header = {
LogoColor = BRAND_COLOR, LogoColor = BRAND_COLOR,
VersionColor = hexColor(0x727272), VersionColor = Color3.fromHex("727272"),
}, },
Notification = { Notification = {
InfoColor = hexColor(0x00000), InfoColor = Color3.fromHex("00000"),
CloseColor = BRAND_COLOR, CloseColor = BRAND_COLOR,
}, },
ErrorColor = hexColor(0x000000), ErrorColor = Color3.fromHex("000000"),
ScrollBarColor = hexColor(0x000000), ScrollBarColor = Color3.fromHex("000000"),
}) })
local darkTheme = strict("DarkTheme", { local darkTheme = strict("DarkTheme", {
BackgroundColor = hexColor(0x2E2E2E), BackgroundColor = Color3.fromHex("2E2E2E"),
Button = { Button = {
Solid = { Solid = {
ActionFillColor = hexColor(0xFFFFFF), ActionFillColor = Color3.fromHex("FFFFFF"),
ActionFillTransparency = 0.8, ActionFillTransparency = 0.8,
Enabled = { Enabled = {
TextColor = hexColor(0xFFFFFF), TextColor = Color3.fromHex("FFFFFF"),
BackgroundColor = BRAND_COLOR, BackgroundColor = BRAND_COLOR,
}, },
Disabled = { Disabled = {
TextColor = hexColor(0xFFFFFF), TextColor = Color3.fromHex("FFFFFF"),
BackgroundColor = BRAND_COLOR, BackgroundColor = BRAND_COLOR,
}, },
}, },
Bordered = { Bordered = {
ActionFillColor = hexColor(0xFFFFFF), ActionFillColor = Color3.fromHex("FFFFFF"),
ActionFillTransparency = 0.9, ActionFillTransparency = 0.9,
Enabled = { Enabled = {
TextColor = hexColor(0xDBDBDB), TextColor = Color3.fromHex("DBDBDB"),
BorderColor = hexColor(0x535353), BorderColor = Color3.fromHex("535353"),
}, },
Disabled = { Disabled = {
TextColor = hexColor(0xDBDBDB), TextColor = Color3.fromHex("DBDBDB"),
BorderColor = hexColor(0x535353), BorderColor = Color3.fromHex("535353"),
}, },
}, },
}, },
Checkbox = { Checkbox = {
Active = { Active = {
IconColor = hexColor(0xFFFFFF), IconColor = Color3.fromHex("FFFFFF"),
BackgroundColor = BRAND_COLOR, BackgroundColor = BRAND_COLOR,
}, },
Inactive = { Inactive = {
IconColor = hexColor(0x484848), IconColor = Color3.fromHex("484848"),
BorderColor = hexColor(0x5A5A5A), BorderColor = Color3.fromHex("5A5A5A"),
}, },
}, },
Dropdown = { Dropdown = {
TextColor = hexColor(0xFFFFFF), TextColor = Color3.fromHex("FFFFFF"),
BorderColor = hexColor(0x5A5A5A), BorderColor = Color3.fromHex("5A5A5A"),
BackgroundColor = hexColor(0x2B2B2B), BackgroundColor = Color3.fromHex("2B2B2B"),
Open = { Open = {
IconColor = BRAND_COLOR, IconColor = BRAND_COLOR,
}, },
Closed = { Closed = {
IconColor = hexColor(0x484848), IconColor = Color3.fromHex("484848"),
}, },
}, },
AddressEntry = { AddressEntry = {
TextColor = hexColor(0xFFFFFF), TextColor = Color3.fromHex("FFFFFF"),
PlaceholderColor = hexColor(0x8B8B8B) PlaceholderColor = Color3.fromHex("8B8B8B")
}, },
BorderedContainer = { BorderedContainer = {
BorderColor = hexColor(0x535353), BorderColor = Color3.fromHex("535353"),
BackgroundColor = hexColor(0x2B2B2B), BackgroundColor = Color3.fromHex("2B2B2B"),
}, },
Spinner = { Spinner = {
ForegroundColor = BRAND_COLOR, ForegroundColor = BRAND_COLOR,
BackgroundColor = hexColor(0x2B2B2B), BackgroundColor = Color3.fromHex("2B2B2B"),
}, },
Diff = { Diff = {
Add = hexColor(0x273732), Add = Color3.fromHex("273732"),
Remove = hexColor(0x3F2D32), Remove = Color3.fromHex("3F2D32"),
Edit = hexColor(0x193345), Edit = Color3.fromHex("193345"),
Row = hexColor(0xFFFFFF), Row = Color3.fromHex("FFFFFF"),
Warning = hexColor(0xFF8E3C), Warning = Color3.fromHex("FF8E3C"),
}, },
ConnectionDetails = { ConnectionDetails = {
ProjectNameColor = hexColor(0xFFFFFF), ProjectNameColor = Color3.fromHex("FFFFFF"),
AddressColor = hexColor(0xFFFFFF), AddressColor = Color3.fromHex("FFFFFF"),
DisconnectColor = hexColor(0xFFFFFF), DisconnectColor = Color3.fromHex("FFFFFF"),
}, },
Settings = { Settings = {
DividerColor = hexColor(0x535353), DividerColor = Color3.fromHex("535353"),
Navbar = { Navbar = {
BackButtonColor = hexColor(0xFFFFFF), BackButtonColor = Color3.fromHex("FFFFFF"),
TextColor = hexColor(0xFFFFFF), TextColor = Color3.fromHex("FFFFFF"),
}, },
Setting = { Setting = {
NameColor = hexColor(0xFFFFFF), NameColor = Color3.fromHex("FFFFFF"),
DescriptionColor = hexColor(0xD3D3D3), DescriptionColor = Color3.fromHex("D3D3D3"),
}, },
}, },
Header = { Header = {
LogoColor = BRAND_COLOR, LogoColor = BRAND_COLOR,
VersionColor = hexColor(0xD3D3D3) VersionColor = Color3.fromHex("D3D3D3")
}, },
Notification = { Notification = {
InfoColor = hexColor(0xFFFFFF), InfoColor = Color3.fromHex("FFFFFF"),
CloseColor = hexColor(0xFFFFFF), CloseColor = Color3.fromHex("FFFFFF"),
}, },
ErrorColor = hexColor(0xFFFFFF), ErrorColor = Color3.fromHex("FFFFFF"),
ScrollBarColor = hexColor(0xFFFFFF), ScrollBarColor = Color3.fromHex("FFFFFF"),
}) })
local Context = Roact.createContext(lightTheme) local Context = Roact.createContext(lightTheme)