mirrors/zed
1
0
Fork 0
mirror of https://github.com/zed-industries/zed.git synced 2024-12-25 01:34:02 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 9

Update toggle active styles

Browse source
This commit is contained in:
Nate Butler 2023-06-21 13:56:27 -04:00
parent 127f4aa506
commit ed8bdd186e
9 changed files with 126 additions and 47 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

13
styles/src/styleTree/contactList.ts
View file

@ -83,7 +83,12 @@ export default function contactsPanel(colorScheme: ColorScheme) {
background: background(layer, "default"), // posiewic: breaking change
},
state: {
hovered: { background: background(layer, "default") },
hovered: {
background: background(layer, "hovered"),
},
clicked: {
background: background(layer, "pressed"),
}
}, // hack, we want headerRow to be interactive for whatever reason. It probably shouldn't be interactive in the first place.
}),
state: {
@ -92,6 +97,12 @@ export default function contactsPanel(colorScheme: ColorScheme) {
...text(layer, "mono", "active", { size: "sm" }),
background: background(layer, "active"),
},
hovered: {
background: background(layer, "hovered"),
},
clicked: {
background: background(layer, "pressed"),
}
}
}
}),

8
styles/src/styleTree/contextMenu.ts
View file

@ -40,6 +40,9 @@ export default function contextMenu(colorScheme: ColorScheme) {
padding: { left: 3, right: 3 },
},
},
clicked: {
background: background(layer, "pressed"),
},
},
}),
state: {
@ -48,7 +51,10 @@ export default function contextMenu(colorScheme: ColorScheme) {
background: background(layer, "active"),
},
hovered: {
background: background(layer, "active"),
background: background(layer, "hovered"),
},
clicked: {
background: background(layer, "pressed"),
},
}
}

27
styles/src/styleTree/editor.ts
View file

@ -56,18 +56,24 @@ export default function editor(colorScheme: ColorScheme) {
color: foreground(layer, "variant"),
},
state: {
clicked: {
color: foreground(layer, "base"),
},
hovered: {
color: foreground(layer, "on"),
color: foreground(layer, "variant", "hovered"),
},
clicked: {
color: foreground(layer, "variant", "pressed"),
},
},
}),
state: {
active: {
default: {
color: foreground(layer, "on"),
color: foreground(layer, "accent"),
},
hovered: {
color: foreground(layer, "accent", "hovered"),
},
clicked: {
color: foreground(layer, "accent", "pressed"),
},
}
}
@ -87,18 +93,21 @@ export default function editor(colorScheme: ColorScheme) {
color: foreground(layer, "variant"),
},
state: {
clicked: {
color: foreground(layer, "base"),
},
hovered: {
color: foreground(layer, "on"),
},
clicked: {
color: foreground(layer, "base"),
},
},
}),
state: {
active: {
default: {
color: foreground(layer, "on"),
color: foreground(layer, "default"),
},
hovered: {
color: foreground(layer, "variant"),
},
}
}

19
styles/src/styleTree/picker.ts
View file

@ -67,6 +67,12 @@ export default function picker(colorScheme: ColorScheme): any {
0.5
),
},
clicked: {
background: withOpacity(
background(layer, "pressed"),
0.5
),
},
},
}),
state: {
@ -76,7 +82,18 @@ export default function picker(colorScheme: ColorScheme): any {
background(layer, "base", "active"),
0.5
),
//text: text(layer, "sans", "base", "active"),
},
hovered: {
background: withOpacity(
background(layer, "hovered"),
0.5
),
},
clicked: {
background: withOpacity(
background(layer, "pressed"),
0.5
),
},
}
}

54
styles/src/styleTree/projectPanel.ts
View file

@ -28,33 +28,44 @@ export default function projectPanel(colorScheme: ColorScheme) {
},
}
const default_entry = interactive({
base: {
...baseEntry,
text: text(layer, "mono", "variant", { size: "sm" }),
status,
},
state: {
default: {
background: background(layer),
},
hovered: {
background: background(layer, "variant", "hovered"),
},
clicked: {
background: background(layer, "variant", "pressed"),
}
},
})
let entry = toggleable({
base:
interactive({
base: default_entry,
state: {
active: interactive({
base: {
...baseEntry,
text: text(layer, "mono", "variant", { size: "sm" }),
status,
...default_entry
},
state: {
default: {
background: background(colorScheme.lowest),
},
hovered: {
background: background(layer, "variant", "hovered"),
background: background(colorScheme.lowest, "hovered"),
},
clicked: {
background: background(colorScheme.lowest, "pressed"),
},
},
}),
state: {
active: {
default: {
/*background: colorScheme.isLight
? withOpacity(background(layer, "active"), 0.5)
: background(layer, "active") ,*/ // todo posiewic
text: text(layer, "mono", "active", { size: "sm" }),
},
hovered: {
//background: background(layer, "active"),
text: text(layer, "mono", "active", { size: "sm" }),
},
}
}
}
)
@ -84,6 +95,11 @@ export default function projectPanel(colorScheme: ColorScheme) {
background: background(layer, "hovered"),
border: border(layer, "active"),
},
clicked: {
...text(layer, "sans", "default", { size: "sm" }),
background: background(layer, "pressed"),
border: border(layer, "active"),
}
},
}),
background: background(layer),

23
styles/src/styleTree/search.ts
View file

@ -55,24 +55,28 @@ export default function search(colorScheme: ColorScheme) {
},
},
state: {
clicked: {
...text(layer, "mono", "on", "pressed"),
background: background(layer, "on", "pressed"),
border: border(layer, "on", "pressed"),
},
hovered: {
...text(layer, "mono", "on", "hovered"),
background: background(layer, "on", "hovered"),
border: border(layer, "on", "hovered"),
},
clicked: {
...text(layer, "mono", "on", "pressed"),
background: background(layer, "on", "pressed"),
border: border(layer, "on", "pressed"),
},
},
}),
state: {
active: {
default: {
...text(layer, "mono", "on", "inverted"),
background: background(layer, "on", "inverted"),
border: border(layer, "on", "inverted"),
...text(layer, "mono", "accent"),
},
hovered: {
...text(layer, "mono", "accent", "hovered"),
},
clicked: {
...text(layer, "mono", "accent", "pressed"),
},
}
}
@ -124,6 +128,9 @@ export default function search(colorScheme: ColorScheme) {
hovered: {
color: foreground(layer, "hovered"),
},
clicked: {
color: foreground(layer, "pressed"),
},
},
}),
}

9
styles/src/styleTree/tabBar.ts
View file

@ -100,6 +100,9 @@ export default function tabBar(colorScheme: ColorScheme) {
hovered: {
color: foreground(layer, "hovered"),
},
clicked: {
color: foreground(layer, "pressed"),
},
},
}),
state:
@ -108,6 +111,12 @@ export default function tabBar(colorScheme: ColorScheme) {
default: {
color: foreground(layer, "accent"),
},
hovered: {
color: foreground(layer, "hovered"),
},
clicked: {
color: foreground(layer, "pressed"),
},
}
}
}

9
styles/src/styleTree/toolbarDropdownMenu.ts
View file

@ -19,13 +19,14 @@ export default function dropdownMenu(colorScheme: ColorScheme) {
secondaryTextSpacing: 10,
padding: { left: 8, right: 8, top: 2, bottom: 2 },
cornerRadius: 6,
background: background(layer, "on"),
border: border(layer, "on", { overlay: true }),
background: background(layer, "on")
},
state: {
hovered: {
background: background(layer, "hovered"),
...text(layer, "sans", "hovered", { size: "sm" }),
},
clicked: {
background: background(layer, "pressed"),
},
},
}),
@ -55,7 +56,7 @@ export default function dropdownMenu(colorScheme: ColorScheme) {
background: background(layer, "active"),
},
hovered: {
background: background(layer, "active"),
background: background(layer, "hovered"),
},
}
}

11
styles/src/styleTree/workspace.ts
View file

@ -287,20 +287,23 @@ export default function workspace(colorScheme: ColorScheme) {
state: {
clicked: {
background: background(layer, "variant", "pressed"),
color: foreground(layer, "variant", "pressed"),
},
hovered: {
background: background(layer, "variant", "hovered"),
color: foreground(layer, "variant", "hovered"),
},
},
}), state:
{
active: {
default: {
background: background(layer, "variant", "active"),
color: foreground(layer, "variant", "active"),
background: background(layer, "on", "default"),
},
hovered: {
background: background(layer, "on", "hovered"),
},
clicked: {
background: background(layer, "on", "pressed"),
}
}
}
}