Files
oak-gpui/styles/src/styleTree/search.ts
T

83 lines
1.9 KiB
TypeScript

import { ColorScheme } from "../themes/common/colorScheme";
import { background, border, text } from "./components";
export default function search(colorScheme: ColorScheme) {
let layer = colorScheme.highest;
// Search input
const editor = {
background: background(layer),
cornerRadius: 8,
minWidth: 200,
maxWidth: 500,
placeholderText: text(layer, "mono", "disabled"),
selection: colorScheme.players[0],
text: text(layer, "mono", "default"),
border: border(layer),
margin: {
right: 12,
},
padding: {
top: 3,
bottom: 3,
left: 12,
right: 8,
},
};
return {
matchBackground: background(layer), // theme.editor.highlight.match,
tabIconSpacing: 8,
tabIconWidth: 14,
optionButton: {
...text(layer, "mono", "on"),
background: background(layer, "on"),
cornerRadius: 6,
border: border(layer, "on"),
margin: {
right: 4,
},
padding: {
bottom: 2,
left: 10,
right: 10,
top: 2,
},
active: {
...text(layer, "mono", "on", "inverted"),
background: background(layer, "on", "inverted"),
border: border(layer, "on", "inverted"),
},
clicked: {
...text(layer, "mono", "on", "pressed"),
background: background(layer, "on", "pressed"),
border: border(layer, "on", "pressed"),
},
hover: {
...text(layer, "mono", "on", "hovered"),
background: background(layer, "on", "hovered"),
border: border(layer, "on", "hovered"),
},
},
editor,
invalidEditor: {
...editor,
border: border(layer, "negative"),
},
matchIndex: {
...text(layer, "mono", "variant"),
padding: 6,
},
optionButtonGroup: {
padding: {
left: 12,
right: 12,
},
},
resultsStatus: {
...text(layer, "mono", "on"),
size: 18,
},
};
}