gpui: Fix default colors blue, red, green to match in CSS default colors (#20851)
Release Notes: - N/A --- This change to let the default colors to 100% match with CSS default colors. And update the methods to as `const`. Here is an example: <img width="338" alt="image" src="https://github.com/user-attachments/assets/dd17b46a-3ad4-4122-8dca-e800644c75b0"> https://codepen.io/huacnlee/pen/ZEgNXJZ But the before version for example blue: `h: 0.6 * 360 = 216`, but we expected `240`, `240 / 360 = 0.666666666`, so the before version are lose the precision. (Here is a test tool: https://hslpicker.com/#0000FF) ## After Update ```bash cargo run -p gpui --example hello_world ``` <img width="612" alt="image" src="https://github.com/user-attachments/assets/97d479d8-9c71-4be3-95e0-09af45fe47e2">
This commit is contained in:
parent
461ab24a06
commit
e9e260776b
2 changed files with 34 additions and 21 deletions
|
@ -8,8 +8,10 @@ impl Render for HelloWorld {
|
||||||
fn render(&mut self, _cx: &mut ViewContext<Self>) -> impl IntoElement {
|
fn render(&mut self, _cx: &mut ViewContext<Self>) -> impl IntoElement {
|
||||||
div()
|
div()
|
||||||
.flex()
|
.flex()
|
||||||
.bg(rgb(0x2e7d32))
|
.flex_col()
|
||||||
.size(Length::Definite(Pixels(300.0).into()))
|
.gap_3()
|
||||||
|
.bg(rgb(0x505050))
|
||||||
|
.size(Length::Definite(Pixels(500.0).into()))
|
||||||
.justify_center()
|
.justify_center()
|
||||||
.items_center()
|
.items_center()
|
||||||
.shadow_lg()
|
.shadow_lg()
|
||||||
|
@ -18,12 +20,23 @@ impl Render for HelloWorld {
|
||||||
.text_xl()
|
.text_xl()
|
||||||
.text_color(rgb(0xffffff))
|
.text_color(rgb(0xffffff))
|
||||||
.child(format!("Hello, {}!", &self.text))
|
.child(format!("Hello, {}!", &self.text))
|
||||||
|
.child(
|
||||||
|
div()
|
||||||
|
.flex()
|
||||||
|
.gap_2()
|
||||||
|
.child(div().size_8().bg(gpui::red()))
|
||||||
|
.child(div().size_8().bg(gpui::green()))
|
||||||
|
.child(div().size_8().bg(gpui::blue()))
|
||||||
|
.child(div().size_8().bg(gpui::yellow()))
|
||||||
|
.child(div().size_8().bg(gpui::black()))
|
||||||
|
.child(div().size_8().bg(gpui::white())),
|
||||||
|
)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
fn main() {
|
fn main() {
|
||||||
App::new().run(|cx: &mut AppContext| {
|
App::new().run(|cx: &mut AppContext| {
|
||||||
let bounds = Bounds::centered(None, size(px(300.0), px(300.0)), cx);
|
let bounds = Bounds::centered(None, size(px(500.), px(500.0)), cx);
|
||||||
cx.open_window(
|
cx.open_window(
|
||||||
WindowOptions {
|
WindowOptions {
|
||||||
window_bounds: Some(WindowBounds::Windowed(bounds)),
|
window_bounds: Some(WindowBounds::Windowed(bounds)),
|
||||||
|
|
|
@ -314,7 +314,7 @@ pub fn hsla(h: f32, s: f32, l: f32, a: f32) -> Hsla {
|
||||||
}
|
}
|
||||||
|
|
||||||
/// Pure black in [`Hsla`]
|
/// Pure black in [`Hsla`]
|
||||||
pub fn black() -> Hsla {
|
pub const fn black() -> Hsla {
|
||||||
Hsla {
|
Hsla {
|
||||||
h: 0.,
|
h: 0.,
|
||||||
s: 0.,
|
s: 0.,
|
||||||
|
@ -324,7 +324,7 @@ pub fn black() -> Hsla {
|
||||||
}
|
}
|
||||||
|
|
||||||
/// Transparent black in [`Hsla`]
|
/// Transparent black in [`Hsla`]
|
||||||
pub fn transparent_black() -> Hsla {
|
pub const fn transparent_black() -> Hsla {
|
||||||
Hsla {
|
Hsla {
|
||||||
h: 0.,
|
h: 0.,
|
||||||
s: 0.,
|
s: 0.,
|
||||||
|
@ -334,7 +334,7 @@ pub fn transparent_black() -> Hsla {
|
||||||
}
|
}
|
||||||
|
|
||||||
/// Transparent black in [`Hsla`]
|
/// Transparent black in [`Hsla`]
|
||||||
pub fn transparent_white() -> Hsla {
|
pub const fn transparent_white() -> Hsla {
|
||||||
Hsla {
|
Hsla {
|
||||||
h: 0.,
|
h: 0.,
|
||||||
s: 0.,
|
s: 0.,
|
||||||
|
@ -354,7 +354,7 @@ pub fn opaque_grey(lightness: f32, opacity: f32) -> Hsla {
|
||||||
}
|
}
|
||||||
|
|
||||||
/// Pure white in [`Hsla`]
|
/// Pure white in [`Hsla`]
|
||||||
pub fn white() -> Hsla {
|
pub const fn white() -> Hsla {
|
||||||
Hsla {
|
Hsla {
|
||||||
h: 0.,
|
h: 0.,
|
||||||
s: 0.,
|
s: 0.,
|
||||||
|
@ -364,7 +364,7 @@ pub fn white() -> Hsla {
|
||||||
}
|
}
|
||||||
|
|
||||||
/// The color red in [`Hsla`]
|
/// The color red in [`Hsla`]
|
||||||
pub fn red() -> Hsla {
|
pub const fn red() -> Hsla {
|
||||||
Hsla {
|
Hsla {
|
||||||
h: 0.,
|
h: 0.,
|
||||||
s: 1.,
|
s: 1.,
|
||||||
|
@ -374,9 +374,9 @@ pub fn red() -> Hsla {
|
||||||
}
|
}
|
||||||
|
|
||||||
/// The color blue in [`Hsla`]
|
/// The color blue in [`Hsla`]
|
||||||
pub fn blue() -> Hsla {
|
pub const fn blue() -> Hsla {
|
||||||
Hsla {
|
Hsla {
|
||||||
h: 0.6,
|
h: 0.6666666667,
|
||||||
s: 1.,
|
s: 1.,
|
||||||
l: 0.5,
|
l: 0.5,
|
||||||
a: 1.,
|
a: 1.,
|
||||||
|
@ -384,19 +384,19 @@ pub fn blue() -> Hsla {
|
||||||
}
|
}
|
||||||
|
|
||||||
/// The color green in [`Hsla`]
|
/// The color green in [`Hsla`]
|
||||||
pub fn green() -> Hsla {
|
pub const fn green() -> Hsla {
|
||||||
Hsla {
|
Hsla {
|
||||||
h: 0.33,
|
h: 0.3333333333,
|
||||||
s: 1.,
|
s: 1.,
|
||||||
l: 0.5,
|
l: 0.25,
|
||||||
a: 1.,
|
a: 1.,
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
/// The color yellow in [`Hsla`]
|
/// The color yellow in [`Hsla`]
|
||||||
pub fn yellow() -> Hsla {
|
pub const fn yellow() -> Hsla {
|
||||||
Hsla {
|
Hsla {
|
||||||
h: 0.16,
|
h: 0.1666666667,
|
||||||
s: 1.,
|
s: 1.,
|
||||||
l: 0.5,
|
l: 0.5,
|
||||||
a: 1.,
|
a: 1.,
|
||||||
|
@ -410,32 +410,32 @@ impl Hsla {
|
||||||
}
|
}
|
||||||
|
|
||||||
/// The color red
|
/// The color red
|
||||||
pub fn red() -> Self {
|
pub const fn red() -> Self {
|
||||||
red()
|
red()
|
||||||
}
|
}
|
||||||
|
|
||||||
/// The color green
|
/// The color green
|
||||||
pub fn green() -> Self {
|
pub const fn green() -> Self {
|
||||||
green()
|
green()
|
||||||
}
|
}
|
||||||
|
|
||||||
/// The color blue
|
/// The color blue
|
||||||
pub fn blue() -> Self {
|
pub const fn blue() -> Self {
|
||||||
blue()
|
blue()
|
||||||
}
|
}
|
||||||
|
|
||||||
/// The color black
|
/// The color black
|
||||||
pub fn black() -> Self {
|
pub const fn black() -> Self {
|
||||||
black()
|
black()
|
||||||
}
|
}
|
||||||
|
|
||||||
/// The color white
|
/// The color white
|
||||||
pub fn white() -> Self {
|
pub const fn white() -> Self {
|
||||||
white()
|
white()
|
||||||
}
|
}
|
||||||
|
|
||||||
/// The color transparent black
|
/// The color transparent black
|
||||||
pub fn transparent_black() -> Self {
|
pub const fn transparent_black() -> Self {
|
||||||
transparent_black()
|
transparent_black()
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue