mirrors/zed
1
0
Fork 0
mirror of https://github.com/zed-industries/zed.git synced 2024-12-30 21:16:23 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 8

Extract search from app

Browse source 
- Also update border to use borderColor( )
This commit is contained in:
Nate Butler 2022-03-31 11:27:02 -04:00 committed by Keith Simmons
parent d88e20477d
commit c008e65de6
3 changed files with 85 additions and 76 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

79
styles/app.ts
View file

@ -1,7 +1,8 @@
import chatPanel from "./chat-panel";
import { backgroundColor, border, borderColor, player, text } from "./components";
import { backgroundColor, borderColor, text } from "./components";
import editor from "./editor";
import projectPanel from "./project-panel";
import search from "./search";
import selectorModal from "./selector-modal";
import Theme from "./theme";
import workspace from "./workspace";
@ -33,7 +34,7 @@ export default function app(theme: Theme): Object {
projectPanel: projectPanel(theme),
chatPanel: chatPanel(theme),
contactsPanel: {
extends: "$panel",
...panel,
hostRowHeight: 28,
treeBranchColor: borderColor(theme, "muted"),
treeBranchWidth: 1,
@ -84,78 +85,6 @@ export default function app(theme: Theme): Object {
extends: "$contactsPanel.project",
},
},
search: {
background: backgroundColor(theme, 300),
matchBackground: theme.editor.highlight.match,
tabIconSpacing: 4,
tabIconWidth: 14,
activeHoveredOptionButton: {
extends: "$search.option_button",
background: backgroundColor(theme, 100),
},
activeOptionButton: {
extends: "$search.option_button",
background: backgroundColor(theme, 100),
},
editor: {
background: backgroundColor(theme, 500),
cornerRadius: 6,
maxWidth: 400,
placeholderText: text(theme, "mono", "placeholder"),
selection: player(theme, 1).selection,
text: text(theme, "mono", "primary"),
border: border(theme, "primary"),
margin: {
bottom: 5,
left: 5,
right: 5,
top: 5,
},
padding: {
bottom: 3,
left: 13,
right: 13,
top: 3,
},
},
hoveredOptionButton: {
extends: "$search.optionButton",
background: backgroundColor(theme, 100),
},
invalidEditor: {
extends: "$search.editor",
border: border(theme, "error"),
},
matchIndex: {
...text(theme, "mono", "secondary"),
padding: 6,
},
optionButton: {
...text(theme, "mono", "secondary"),
background: backgroundColor(theme, 300),
cornerRadius: 6,
border: border(theme, "primary"),
margin: {
left: 1,
right: 1,
},
padding: {
bottom: 1,
left: 6,
right: 6,
top: 1,
},
},
optionButtonGroup: {
padding: {
left: 2,
right: 2,
},
},
resultsStatus: {
...text(theme, "mono", "primary"),
size: 18,
},
},
search: search(theme),
};
}

2
styles/components.ts
View file

@ -41,7 +41,7 @@ export function border(
options?: BorderOptions
) {
return {
color: theme.borderColor[color].value,
color: borderColor(theme, color),
width: 1,
...options,
};

80
styles/search.ts Normal file
View file

@ -0,0 +1,80 @@
import { backgroundColor, border, player, text } from "./components";
import Theme from "./theme";
export default function search(theme: Theme) {
const optionButton = {
...text(theme, "mono", "secondary"),
background: backgroundColor(theme, 300),
cornerRadius: 6,
border: border(theme, "primary"),
margin: {
left: 1,
right: 1,
},
padding: {
bottom: 1,
left: 6,
right: 6,
top: 1,
},
};
return {
background: backgroundColor(theme, 300),
matchBackground: theme.editor.highlight.match,
tabIconSpacing: 4,
tabIconWidth: 14,
activeHoveredOptionButton: {
...optionButton,
background: backgroundColor(theme, 100),
},
activeOptionButton: {
...optionButton,
background: backgroundColor(theme, 100),
},
editor: {
background: backgroundColor(theme, 500),
cornerRadius: 6,
maxWidth: 400,
placeholderText: text(theme, "mono", "placeholder"),
selection: player(theme, 1).selection,
text: text(theme, "mono", "primary"),
border: border(theme, "primary"),
margin: {
bottom: 5,
left: 5,
right: 5,
top: 5,
},
padding: {
bottom: 3,
left: 13,
right: 13,
top: 3,
},
},
hoveredOptionButton: {
...optionButton,
background: backgroundColor(theme, 100),
},
invalidEditor: {
extends: "$search.editor",
border: border(theme, "error"),
},
matchIndex: {
...text(theme, "mono", "secondary"),
padding: 6,
},
optionButton,
optionButtonGroup: {
padding: {
left: 2,
right: 2,
},
},
resultsStatus: {
...text(theme, "mono", "primary"),
size: 18,
},
};
}