1import { ColorScheme } from "../theme/color_scheme"
2import { with_opacity } from "../theme/color"
3import { background, border, foreground, text } from "./components"
4import { interactive, toggleable } from "../element"
5
6export default function search(theme: ColorScheme): any {
7 // Search input
8 const editor = {
9 background: background(theme.highest),
10 corner_radius: 8,
11 min_width: 200,
12 max_width: 500,
13 placeholder_text: text(theme.highest, "mono", "disabled"),
14 selection: theme.players[0],
15 text: text(theme.highest, "mono", "default"),
16 border: border(theme.highest),
17 margin: {
18 right: 12,
19 },
20 padding: {
21 top: 3,
22 bottom: 3,
23 left: 12,
24 right: 8,
25 },
26 }
27
28 const include_exclude_editor = {
29 ...editor,
30 min_width: 100,
31 max_width: 250,
32 }
33
34 return {
35 // TODO: Add an activeMatchBackground on the rust side to differentiate between active and inactive
36 match_background: with_opacity(
37 foreground(theme.highest, "accent"),
38 0.4
39 ),
40 option_button: toggleable({
41 base: interactive({
42 base: {
43 ...text(theme.highest, "mono", "on"),
44 background: background(theme.highest, "on"),
45 corner_radius: 6,
46 border: border(theme.highest, "on"),
47 margin: {
48 right: 4,
49 },
50 padding: {
51 bottom: 2,
52 left: 10,
53 right: 10,
54 top: 2,
55 },
56 },
57 state: {
58 hovered: {
59 ...text(theme.highest, "mono", "on", "hovered"),
60 background: background(theme.highest, "on", "hovered"),
61 border: border(theme.highest, "on", "hovered"),
62 },
63 clicked: {
64 ...text(theme.highest, "mono", "on", "pressed"),
65 background: background(theme.highest, "on", "pressed"),
66 border: border(theme.highest, "on", "pressed"),
67 },
68 },
69 }),
70 state: {
71 active: {
72 default: {
73 ...text(theme.highest, "mono", "accent"),
74 },
75 hovered: {
76 ...text(theme.highest, "mono", "accent", "hovered"),
77 },
78 clicked: {
79 ...text(theme.highest, "mono", "accent", "pressed"),
80 },
81 },
82 },
83 }),
84 editor,
85 invalid_editor: {
86 ...editor,
87 border: border(theme.highest, "negative"),
88 },
89 include_exclude_editor,
90 invalid_include_exclude_editor: {
91 ...include_exclude_editor,
92 border: border(theme.highest, "negative"),
93 },
94 match_index: {
95 ...text(theme.highest, "mono", "variant"),
96 padding: {
97 left: 6,
98 },
99 },
100 option_button_group: {
101 padding: {
102 left: 12,
103 right: 12,
104 },
105 },
106 include_exclude_inputs: {
107 ...text(theme.highest, "mono", "variant"),
108 padding: {
109 right: 6,
110 },
111 },
112 results_status: {
113 ...text(theme.highest, "mono", "on"),
114 size: 18,
115 },
116 dismiss_button: interactive({
117 base: {
118 color: foreground(theme.highest, "variant"),
119 icon_width: 12,
120 button_width: 14,
121 padding: {
122 left: 10,
123 right: 10,
124 },
125 },
126 state: {
127 hovered: {
128 color: foreground(theme.highest, "hovered"),
129 },
130 clicked: {
131 color: foreground(theme.highest, "pressed"),
132 },
133 },
134 }),
135 }
136}