mirror of
https://github.com/zed-industries/zed.git
synced 2024-12-27 02:48:34 +00:00
Added basic styling for checkboxes, yay
Co-authored-by: Max <max@zed.dev>
This commit is contained in:
parent
86e2101592
commit
118435a348
3 changed files with 39 additions and 11 deletions
|
@ -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)]
|
||||
|
|
|
@ -126,11 +126,17 @@ impl WelcomePage {
|
|||
.with_height(style.height)
|
||||
.contained()
|
||||
.with_style(if checked {
|
||||
if state.hovered() {
|
||||
style.hovered_and_checked
|
||||
} else {
|
||||
style.checked
|
||||
} else if state.hovered() {
|
||||
}
|
||||
} else {
|
||||
if state.hovered() {
|
||||
style.hovered
|
||||
} else {
|
||||
style.unchecked
|
||||
style.default
|
||||
}
|
||||
})
|
||||
.boxed()
|
||||
})
|
||||
|
|
|
@ -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,
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
Loading…
Reference in a new issue