mirrors/zed
1
0
Fork 0
mirror of https://github.com/zed-industries/zed.git synced 2024-12-26 10:40:54 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 8

Added basic styling for checkboxes, yay

Browse source 
Co-authored-by: Max <max@zed.dev>
This commit is contained in:
Mikayla Maki 2023-02-24 17:04:31 -08:00
parent 86e2101592
commit 118435a348
3 changed files with 39 additions and 11 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
crates/theme/src/theme.rs
View file

@ -860,9 +860,10 @@ pub struct WelcomeStyle {
pub struct CheckboxStyle {
pub width: f32,
pub height: f32,
pub unchecked: ContainerStyle,
pub default: ContainerStyle,
pub checked: ContainerStyle,
pub hovered: ContainerStyle,
pub hovered_and_checked: ContainerStyle,
}
#[derive(Clone, Deserialize, Default)]

14
crates/welcome/src/welcome.rs
View file

@ -126,11 +126,17 @@ impl WelcomePage {
.with_height(style.height)
.contained()
.with_style(if checked {
style.checked
} else if state.hovered() {
style.hovered
if state.hovered() {
style.hovered_and_checked
} else {
style.checked
}
} else {
style.unchecked
if state.hovered() {
style.hovered
} else {
style.default
}
})
.boxed()
})

33
styles/src/styleTree/welcome.ts
View file

@ -6,9 +6,8 @@ export default function welcome(colorScheme: ColorScheme) {
let layer = colorScheme.highest;
// TODO
let checkbox_base = {
background: colorScheme.ramps.red(0.5).hex(),
cornerRadius: 8,
let checkboxBase = {
cornerRadius: 4,
padding: {
left: 8,
right: 8,
@ -26,9 +25,31 @@ export default function welcome(colorScheme: ColorScheme) {
checkbox: {
width: 9,
height: 9,
unchecked: checkbox_base,
checked: checkbox_base,
hovered: checkbox_base
default: {
...checkboxBase,
background: colorScheme.ramps.blue(0.5).hex(),
},
checked: {
...checkboxBase,
background: colorScheme.ramps.red(0.5).hex(),
},
hovered: {
...checkboxBase,
background: colorScheme.ramps.blue(0.5).hex(),
border: {
color: colorScheme.ramps.green(0.5).hex(),
width: 1,
}
},
hoveredAndChecked: {
...checkboxBase,
background: colorScheme.ramps.red(0.5).hex(),
border: {
color: colorScheme.ramps.green(0.5).hex(),
width: 1,
}
}
}
}
}