zed-industries/zed
1
1
Fork 0
mirror of https://github.com/zed-industries/zed.git synced 2024-11-07 20:39:04 +03:00
Code Issues Packages Projects Releases Wiki Activity

WIP: Start updating style trees to new toggle() format.

Browse Source
This commit is contained in:
Nate Butler 2023-06-16 01:41:10 -04:00 committed by Mikayla Maki
parent 61535ed41f
commit ae53c3e623
No known key found for this signature in database
2 changed files with 42 additions and 38 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

62
styles/src/styleTree/commandPalette.ts
View File

@ -1,40 +1,42 @@
import { ColorScheme } from "../theme/colorScheme"
import { withOpacity } from "../theme/color"
import { text, background } from "./components"
import { interactive, toggleable } from "../element"
import { toggleable } from "../element"
export default function commandPalette(colorScheme: ColorScheme) {
let layer = colorScheme.highest
const key = toggleable({
base: {
text: text(layer, "mono", "variant", "default", { size: "xs" }),
cornerRadius: 2,
background: background(layer, "on"),
padding: {
top: 1,
bottom: 1,
left: 6,
right: 6,
},
margin: {
top: 1,
bottom: 1,
left: 2,
},
},
state: {
active: {
text: text(layer, "mono", "on", "default", { size: "xs" }),
background: withOpacity(background(layer, "on"), 0.2),
}
}
})
return {
keystrokeSpacing: 8,
key: toggleable(
interactive({
base: {
text: text(layer, "mono", "variant", "default", {
size: "xs",
}),
cornerRadius: 2,
background: background(layer, "on"),
padding: {
top: 1,
bottom: 1,
left: 6,
right: 6,
},
margin: {
top: 1,
bottom: 1,
left: 2,
},
},
state: { hovered: { cornerRadius: 4, padding: { top: 17 } } },
}),
{
default: {
text: text(layer, "mono", "on", "default", { size: "xs" }),
background: withOpacity(background(layer, "on"), 0.2),
},
}
),
// TODO: This should be a Toggle<ContainedText> on the rust side so we don't have to do this
key: {
...key.inactive,
active: key.active,
}
}
}

18
styles/src/styleTree/contactList.ts
View File

@ -71,8 +71,8 @@ export default function contactsPanel(colorScheme: ColorScheme) {
},
rowHeight: 28,
sectionIconSize: 8,
headerRow: toggleable(
interactive({
headerRow: toggleable({
base: interactive({
base: {
...text(layer, "mono", { size: "sm" }),
margin: { top: 14 },
@ -86,13 +86,15 @@ export default function contactsPanel(colorScheme: ColorScheme) {
hovered: { background: background(layer, "default") },
}, // hack, we want headerRow to be interactive for whatever reason. It probably shouldn't be interactive in the first place.
}),
{
default: {
...text(layer, "mono", "active", { size: "sm" }),
background: background(layer, "active"),
},
state: {
active: {
default: {
...text(layer, "mono", "active", { size: "sm" }),
background: background(layer, "active"),
},
}
}
),
}),
leaveCall: interactive({
base: {
background: background(layer),