Unify assembly editor field background color

This commit is contained in:
2025-10-03 14:31:53 -06:00
parent 4799932f29
commit 5a1e165abf

View File

@@ -47,9 +47,8 @@ const VARIABLE_TYPE_OPTIONS = [
]; ];
const BACKGROUND_COLORS = { const BACKGROUND_COLORS = {
field: "#2A2A2A", /* Background for text inputs, inline editors, and script content */ field: "#2A2A2A", /* Shared surface color for text fields, dropdown inputs, and script editors */
sectionCard: "#2E2E2E", /* Background for section container cards */ sectionCard: "#2E2E2E", /* Background for section container cards */
menu: "#202734", /* Background for dropdown menus and code editor frames */
menuSelected: "rgba(88,166,255,0.16)", /* Background for selected dropdown items */ menuSelected: "rgba(88,166,255,0.16)", /* Background for selected dropdown items */
menuSelectedHover: "rgba(88,166,255,0.24)", /* Background for hovered selected dropdown items */ menuSelectedHover: "rgba(88,166,255,0.24)", /* Background for hovered selected dropdown items */
primaryActionSaving: "rgba(88,166,255,0.12)", /* Background for primary action button while saving */ primaryActionSaving: "rgba(88,166,255,0.12)", /* Background for primary action button while saving */
@@ -114,7 +113,7 @@ const SECTION_CARD_SX = {
const MENU_PROPS = { const MENU_PROPS = {
PaperProps: { PaperProps: {
sx: { sx: {
bgcolor: BACKGROUND_COLORS.menu, bgcolor: BACKGROUND_COLORS.field,
color: "#e6edf3", color: "#e6edf3",
border: "1px solid #2b3544", border: "1px solid #2b3544",
"& .MuiMenuItem-root.Mui-selected": { "& .MuiMenuItem-root.Mui-selected": {
@@ -698,7 +697,7 @@ export default function AssemblyEditor({
textTransform: "none", textTransform: "none",
backgroundColor: saving backgroundColor: saving
? BACKGROUND_COLORS.primaryActionSaving ? BACKGROUND_COLORS.primaryActionSaving
: BACKGROUND_COLORS.menu, : BACKGROUND_COLORS.field,
"&:hover": { "&:hover": {
borderColor: "#7db7ff", borderColor: "#7db7ff",
backgroundColor: BACKGROUND_COLORS.primaryActionHover backgroundColor: BACKGROUND_COLORS.primaryActionHover
@@ -734,7 +733,7 @@ export default function AssemblyEditor({
variant="outlined" variant="outlined"
sx={{ sx={{
...INPUT_BASE_SX, ...INPUT_BASE_SX,
"& .MuiOutlinedInput-inputMultiline": {padding: "4px 8px"} "& .MuiOutlinedInput-inputMultiline": { padding: "4px 8px" }
}} }}
/> />
</Grid> </Grid>
@@ -773,9 +772,7 @@ export default function AssemblyEditor({
<Typography variant="caption" sx={{ ...SECTION_TITLE_SX, mb: 1 }}> <Typography variant="caption" sx={{ ...SECTION_TITLE_SX, mb: 1 }}>
Script Content Script Content
</Typography> </Typography>
<Box <Box sx={{ border: "1px solid #2b3544", borderRadius: 1, background: BACKGROUND_COLORS.field }}>
sx={{ border: "1px solid #2b3544", borderRadius: 1, background: BACKGROUND_COLORS.menu }}
>
<Editor <Editor
value={assembly.script} value={assembly.script}
onValueChange={(value) => updateAssembly({ script: value })} onValueChange={(value) => updateAssembly({ script: value })}
@@ -1022,7 +1019,7 @@ export default function AssemblyEditor({
key={file.id} key={file.id}
sx={{ sx={{
p: 1.5, p: 1.5,
bgcolor: BACKGROUND_COLORS.menu, bgcolor: BACKGROUND_COLORS.field,
border: "1px solid #2b3544", border: "1px solid #2b3544",
display: "flex", display: "flex",
alignItems: "center", alignItems: "center",