diff --git a/Cargo.toml b/Cargo.toml index e1f0c671..6fed9896 100644 --- a/Cargo.toml +++ b/Cargo.toml @@ -22,7 +22,7 @@ all-features = true maintenance = { status = "actively-developed" } [features] -default = ["wgpu", "tiny-skia", "web-colors", "auto-detect-theme", "thread-pool"] +default = ["wgpu", "tiny-skia", "crisp", "web-colors", "auto-detect-theme", "thread-pool"] # Enables the `wgpu` GPU-accelerated renderer backend wgpu = ["iced_renderer/wgpu", "iced_widget/wgpu"] # Enables the `tiny-skia` software renderer backend diff --git a/core/src/color.rs b/core/src/color.rs index a280c795..65a47781 100644 --- a/core/src/color.rs +++ b/core/src/color.rs @@ -90,12 +90,12 @@ impl Color { } } - Self { - r: gamma_component(r), - g: gamma_component(g), - b: gamma_component(b), + Self::new( + gamma_component(r), + gamma_component(g), + gamma_component(b), a, - } + ) } /// Parses a [`Color`] from a hex string. diff --git a/core/src/theme/palette.rs b/core/src/theme/palette.rs index d9ac6402..08a80a26 100644 --- a/core/src/theme/palette.rs +++ b/core/src/theme/palette.rs @@ -28,7 +28,7 @@ impl Palette { text: Color::BLACK, primary: color!(0x5865F2), success: color!(0x12664f), - warning: color!(0xffc14e), + warning: color!(0xb77e33), danger: color!(0xc3423f), }; @@ -453,9 +453,13 @@ pub struct Background { /// The weakest version of the base background color. pub weakest: Pair, /// A weaker version of the base background color. + pub weaker: Pair, + /// A weak version of the base background color. pub weak: Pair, - /// A stronger version of the base background color. + /// A strong version of the base background color. pub strong: Pair, + /// A stronger version of the base background color. + pub stronger: Pair, /// The strongest version of the base background color. pub strongest: Pair, } @@ -464,15 +468,19 @@ impl Background { /// Generates a set of [`Background`] colors from the base and text colors. pub fn new(base: Color, text: Color) -> Self { let weakest = deviate(base, 0.03); - let weak = muted(deviate(base, 0.1)); - let strong = muted(deviate(base, 0.2)); - let strongest = muted(deviate(base, 0.3)); + let weaker = deviate(base, 0.07); + let weak = deviate(base, 0.1); + let strong = deviate(base, 0.15); + let stronger = deviate(base, 0.175); + let strongest = deviate(base, 0.20); Self { base: Pair::new(base, text), weakest: Pair::new(weakest, text), + weaker: Pair::new(weaker, text), weak: Pair::new(weak, text), strong: Pair::new(strong, text), + stronger: Pair::new(stronger, text), strongest: Pair::new(strongest, text), } } @@ -517,9 +525,9 @@ pub struct Secondary { impl Secondary { /// Generates a set of [`Secondary`] colors from the base and text colors. pub fn generate(base: Color, text: Color) -> Self { - let base = mix(base, text, 0.2); - let weak = mix(base, text, 0.1); - let strong = mix(base, text, 0.3); + let weak = mix(deviate(base, 0.1), text, 0.4); + let base = mix(deviate(base, 0.3), text, 0.4); + let strong = mix(deviate(base, 0.5), text, 0.4); Self { base: Pair::new(base, text), @@ -604,53 +612,55 @@ impl Danger { } } -struct Hsl { - h: f32, - s: f32, +struct Oklch { l: f32, + c: f32, + h: f32, a: f32, } fn darken(color: Color, amount: f32) -> Color { - let mut hsl = to_hsl(color); + let mut oklch = to_oklch(color); - hsl.l = if hsl.l - amount < 0.0 { + // We try to bump the chroma a bit for more colorful palettes + if oklch.c > 0.0 && oklch.c < (1.0 - oklch.l) / 2.0 { + // Formula empirically and cluelessly derived + oklch.c *= 1.0 + (0.2 / oklch.c).min(100.0) * amount; + } + + oklch.l = if oklch.l - amount < 0.0 { 0.0 } else { - hsl.l - amount + oklch.l - amount }; - from_hsl(hsl) + from_oklch(oklch) } fn lighten(color: Color, amount: f32) -> Color { - let mut hsl = to_hsl(color); + let mut oklch = to_oklch(color); - hsl.l = if hsl.l + amount > 1.0 { + // We try to bump the chroma a bit for more colorful palettes + // Formula empirically and cluelessly derived + oklch.c *= 1.0 + 2.0 * amount / oklch.l.max(0.05); + + oklch.l = if oklch.l + amount > 1.0 { 1.0 } else { - hsl.l + amount + oklch.l + amount }; - from_hsl(hsl) + from_oklch(oklch) } fn deviate(color: Color, amount: f32) -> Color { if is_dark(color) { lighten(color, amount) } else { - darken(color, amount * 0.8) + darken(color, amount) } } -fn muted(color: Color) -> Color { - let mut hsl = to_hsl(color); - - hsl.s = hsl.s.min(0.5); - - from_hsl(hsl) -} - fn mix(a: Color, b: Color, factor: f32) -> Color { let b_amount = factor.clamp(0.0, 1.0); let a_amount = 1.0 - b_amount; @@ -680,6 +690,12 @@ fn readable(background: Color, text: Color) -> Color { return candidate; } + let candidate = improve(text, 0.2); + + if is_readable(background, candidate) { + return candidate; + } + let white_contrast = relative_contrast(background, Color::WHITE); let black_contrast = relative_contrast(background, Color::BLACK); @@ -691,11 +707,11 @@ fn readable(background: Color, text: Color) -> Color { } fn is_dark(color: Color) -> bool { - to_hsl(color).l < 0.6 + to_oklch(color).l < 0.6 } fn is_readable(a: Color, b: Color) -> bool { - relative_contrast(a, b) >= 7.0 + relative_contrast(a, b) >= 6.0 } // https://www.w3.org/TR/WCAG21/#dfn-contrast-ratio @@ -711,65 +727,57 @@ fn relative_luminance(color: Color) -> f32 { 0.2126 * linear[0] + 0.7152 * linear[1] + 0.0722 * linear[2] } -// https://en.wikipedia.org/wiki/HSL_and_HSV#From_RGB -fn to_hsl(color: Color) -> Hsl { - let x_max = color.r.max(color.g).max(color.b); - let x_min = color.r.min(color.g).min(color.b); - let c = x_max - x_min; - let l = x_max.midpoint(x_min); +// https://en.wikipedia.org/wiki/Oklab_color_space#Conversions_between_color_spaces +fn to_oklch(color: Color) -> Oklch { + let [r, g, b, alpha] = color.into_linear(); - let h = if c == 0.0 { - 0.0 - } else if x_max == color.r { - 60.0 * ((color.g - color.b) / c).rem_euclid(6.0) - } else if x_max == color.g { - 60.0 * (((color.b - color.r) / c) + 2.0) - } else { - // x_max == color.b - 60.0 * (((color.r - color.g) / c) + 4.0) - }; + // linear RGB → LMS + let l = 0.41222146 * r + 0.53633255 * g + 0.051445995 * b; + let m = 0.2119035 * r + 0.6806995 * g + 0.10739696 * b; + let s = 0.08830246 * r + 0.28171885 * g + 0.6299787 * b; - let s = if l == 0.0 || l == 1.0 { - 0.0 - } else { - (x_max - l) / l.min(1.0 - l) - }; + // Nonlinear transform (cube root) + let l_ = l.cbrt(); + let m_ = m.cbrt(); + let s_ = s.cbrt(); - Hsl { - h, - s, - l, - a: color.a, - } + // LMS → Oklab + let l = 0.21045426 * l_ + 0.7936178 * m_ - 0.004072047 * s_; + let a = 1.9779985 * l_ - 2.4285922 * m_ + 0.4505937 * s_; + let b = 0.025904037 * l_ + 0.78277177 * m_ - 0.80867577 * s_; + + // Oklab → Oklch + let c = (a * a + b * b).sqrt(); + let h = b.atan2(a); // radians + + Oklch { l, c, h, a: alpha } } -// https://en.wikipedia.org/wiki/HSL_and_HSV#HSL_to_RGB -fn from_hsl(hsl: Hsl) -> Color { - let c = (1.0 - (2.0 * hsl.l - 1.0).abs()) * hsl.s; - let h = hsl.h / 60.0; - let x = c * (1.0 - (h.rem_euclid(2.0) - 1.0).abs()); +// https://en.wikipedia.org/wiki/Oklab_color_space#Conversions_between_color_spaces +fn from_oklch(oklch: Oklch) -> Color { + let Oklch { l, c, h, a: alpha } = oklch; - let (r1, g1, b1) = if h < 1.0 { - (c, x, 0.0) - } else if h < 2.0 { - (x, c, 0.0) - } else if h < 3.0 { - (0.0, c, x) - } else if h < 4.0 { - (0.0, x, c) - } else if h < 5.0 { - (x, 0.0, c) - } else { - // h < 6.0 - (c, 0.0, x) - }; + let a = c * h.cos(); + let b = c * h.sin(); - let m = hsl.l - (c / 2.0); + // Oklab → LMS (nonlinear) + let l_ = l + 0.39633778 * a + 0.21580376 * b; + let m_ = l - 0.105561346 * a - 0.06385417 * b; + let s_ = l - 0.08948418 * a - 1.2914855 * b; - Color { - r: r1 + m, - g: g1 + m, - b: b1 + m, - a: hsl.a, - } + // Cubing back + let l = l_ * l_ * l_; + let m = m_ * m_ * m_; + let s = s_ * s_ * s_; + + let r = 4.0767417 * l - 3.3077116 * m + 0.23096994 * s; + let g = -1.268438 * l + 2.6097574 * m - 0.34131938 * s; + let b = -0.0041960863 * l - 0.7034186 * m + 1.7076147 * s; + + Color::from_linear_rgba( + r.clamp(0.0, 1.0), + g.clamp(0.0, 1.0), + b.clamp(0.0, 1.0), + alpha, + ) } diff --git a/core/src/widget/text.rs b/core/src/widget/text.rs index 972ab731..24966211 100644 --- a/core/src/widget/text.rs +++ b/core/src/widget/text.rs @@ -441,7 +441,7 @@ pub fn primary(theme: &Theme) -> Style { /// Text conveying some secondary information, like a footnote. pub fn secondary(theme: &Theme) -> Style { Style { - color: Some(theme.extended_palette().secondary.strong.color), + color: Some(theme.extended_palette().secondary.base.color), } } diff --git a/examples/styling/snapshots/catppuccin_frappé-tiny-skia.sha256 b/examples/styling/snapshots/catppuccin_frappé-tiny-skia.sha256 index 188d6c67..7be535ed 100644 --- a/examples/styling/snapshots/catppuccin_frappé-tiny-skia.sha256 +++ b/examples/styling/snapshots/catppuccin_frappé-tiny-skia.sha256 @@ -1 +1 @@ -e440e5e00db4fff0a79251aaf493c4af86241196a746d9147a895d14f01b1283 \ No newline at end of file +aeecd43f0921fe9f0ea3358cc3d55040e1b3117e43eb4490d621b0af71680899 \ No newline at end of file diff --git a/examples/styling/snapshots/catppuccin_latte-tiny-skia.sha256 b/examples/styling/snapshots/catppuccin_latte-tiny-skia.sha256 index b72ceb65..39882a5b 100644 --- a/examples/styling/snapshots/catppuccin_latte-tiny-skia.sha256 +++ b/examples/styling/snapshots/catppuccin_latte-tiny-skia.sha256 @@ -1 +1 @@ -d81cf7c3974fc5b49251e8287c536fd3477c18e7afd3e9e42619364db7787fcc \ No newline at end of file +121fd6018015dbc5e6c8f5c2db1197a7dc769a916fb29ef9f42622b4cf63a96c \ No newline at end of file diff --git a/examples/styling/snapshots/catppuccin_macchiato-tiny-skia.sha256 b/examples/styling/snapshots/catppuccin_macchiato-tiny-skia.sha256 index 2cca5768..2197655b 100644 --- a/examples/styling/snapshots/catppuccin_macchiato-tiny-skia.sha256 +++ b/examples/styling/snapshots/catppuccin_macchiato-tiny-skia.sha256 @@ -1 +1 @@ -ad4fbda3cc3d60209320dd713b7be6b0a5e6b55650689d70ac563a0a81f2eefc \ No newline at end of file +56df225c9404745aae11734fcd13b062355a1d26198323711888c49b528bdfae \ No newline at end of file diff --git a/examples/styling/snapshots/catppuccin_mocha-tiny-skia.sha256 b/examples/styling/snapshots/catppuccin_mocha-tiny-skia.sha256 index 4dd06594..542012dc 100644 --- a/examples/styling/snapshots/catppuccin_mocha-tiny-skia.sha256 +++ b/examples/styling/snapshots/catppuccin_mocha-tiny-skia.sha256 @@ -1 +1 @@ -3863252d1f15750d7f5375bd23e8363c6a70d77ac9aac853e3515f7ff5170bce \ No newline at end of file +a15a385aefc14ddd988536ee6eb81b7d6ececafbc7a7af4a5c282266c4f69d07 \ No newline at end of file diff --git a/examples/styling/snapshots/dark-tiny-skia.sha256 b/examples/styling/snapshots/dark-tiny-skia.sha256 index e8ae6200..5e28ca02 100644 --- a/examples/styling/snapshots/dark-tiny-skia.sha256 +++ b/examples/styling/snapshots/dark-tiny-skia.sha256 @@ -1 +1 @@ -c0bc58fcbde8e7ac4447ba4a454c5c2cb2c6d570e873897887c626b2dc07329b \ No newline at end of file +95630596cd95dbe070c20d3eec0bb131f5b0b05e1afa8c07a38cedd4775cfff8 \ No newline at end of file diff --git a/examples/styling/snapshots/dracula-tiny-skia.sha256 b/examples/styling/snapshots/dracula-tiny-skia.sha256 index 4b48c1d2..44ebe62e 100644 --- a/examples/styling/snapshots/dracula-tiny-skia.sha256 +++ b/examples/styling/snapshots/dracula-tiny-skia.sha256 @@ -1 +1 @@ -1f17779b3291c133399f1eba9f7e517889108d60dbaa8d5b6cd024ad67ef1c8c \ No newline at end of file +fe0a3defebea5e0d728abec9f7395cced9d5fe46d1e64523afe649774fb7dc3e \ No newline at end of file diff --git a/examples/styling/snapshots/ferra-tiny-skia.sha256 b/examples/styling/snapshots/ferra-tiny-skia.sha256 index 6ea26878..657e0dd8 100644 --- a/examples/styling/snapshots/ferra-tiny-skia.sha256 +++ b/examples/styling/snapshots/ferra-tiny-skia.sha256 @@ -1 +1 @@ -51d7bfc1af8ba7503b9800ae7eaaa660047d9b16b0bdc1e8a3850df1d9901652 \ No newline at end of file +840c1eff30f6dc63cf3e7f19e2cd0acd31b0b3eb2bf0773000aef5b9a46d9df6 \ No newline at end of file diff --git a/examples/styling/snapshots/gruvbox_dark-tiny-skia.sha256 b/examples/styling/snapshots/gruvbox_dark-tiny-skia.sha256 index 173efa4e..1da1b8c7 100644 --- a/examples/styling/snapshots/gruvbox_dark-tiny-skia.sha256 +++ b/examples/styling/snapshots/gruvbox_dark-tiny-skia.sha256 @@ -1 +1 @@ -5423fa06a1dc73f9cce42447f3134768114e8321c8f2367da1e04db4d4673f52 \ No newline at end of file +7d4c6ae83e8436b1d4e850c82f19e97a911b4ce389a4ba75f8ea722ffc51329a \ No newline at end of file diff --git a/examples/styling/snapshots/gruvbox_light-tiny-skia.sha256 b/examples/styling/snapshots/gruvbox_light-tiny-skia.sha256 index b1b97fa5..98e9dbfd 100644 --- a/examples/styling/snapshots/gruvbox_light-tiny-skia.sha256 +++ b/examples/styling/snapshots/gruvbox_light-tiny-skia.sha256 @@ -1 +1 @@ -b7ea69b9ce1f73694cccb8b0bc9acab35fc4dcedd01795e3897215c416550fc2 \ No newline at end of file +36ab94c5f69c09ef60feb4524e0a593d2670e345d71139b783796496bdcbceb0 \ No newline at end of file diff --git a/examples/styling/snapshots/kanagawa_dragon-tiny-skia.sha256 b/examples/styling/snapshots/kanagawa_dragon-tiny-skia.sha256 index 3c6e8060..cf6fbeac 100644 --- a/examples/styling/snapshots/kanagawa_dragon-tiny-skia.sha256 +++ b/examples/styling/snapshots/kanagawa_dragon-tiny-skia.sha256 @@ -1 +1 @@ -fa43206adec5dce05c4181ec5d9c71d15067dd3b1d7f5b3267c452cf1de2ca95 \ No newline at end of file +262314758d1facbc16b4949c92ba58dd95a10bdf1fe85fa7aa336dcdf536ab85 \ No newline at end of file diff --git a/examples/styling/snapshots/kanagawa_lotus-tiny-skia.sha256 b/examples/styling/snapshots/kanagawa_lotus-tiny-skia.sha256 index 84c64e60..b0e8b1d5 100644 --- a/examples/styling/snapshots/kanagawa_lotus-tiny-skia.sha256 +++ b/examples/styling/snapshots/kanagawa_lotus-tiny-skia.sha256 @@ -1 +1 @@ -5d7445700ff415428ae43d32ef30b279c38ddc6ffd0e3619ea28044b1d8c709b \ No newline at end of file +fbafd69c60962465f4e0759fc72b3f5bb13895e85821273fff4b51ad1994e7ba \ No newline at end of file diff --git a/examples/styling/snapshots/kanagawa_wave-tiny-skia.sha256 b/examples/styling/snapshots/kanagawa_wave-tiny-skia.sha256 index b27cd469..9a502d0f 100644 --- a/examples/styling/snapshots/kanagawa_wave-tiny-skia.sha256 +++ b/examples/styling/snapshots/kanagawa_wave-tiny-skia.sha256 @@ -1 +1 @@ -52d424e4dfa3ae9b1195e95f17eb655675e4507ec8fb4e36372612fd57a5d86d \ No newline at end of file +6a237b0387d6621c835521d560b1e56b2c63ca1ebca8256742b0afea3c71725c \ No newline at end of file diff --git a/examples/styling/snapshots/light-tiny-skia.sha256 b/examples/styling/snapshots/light-tiny-skia.sha256 index 2c30b309..cd41d1b8 100644 --- a/examples/styling/snapshots/light-tiny-skia.sha256 +++ b/examples/styling/snapshots/light-tiny-skia.sha256 @@ -1 +1 @@ -a0c84b36979f6a6f780af80689425b92a1b68743c39f8e519efcb11b46b9de42 \ No newline at end of file +a1832dfc240eac78bafcdfdbe36fc66b35f984cf67d71adb265fc4f30d383e2b \ No newline at end of file diff --git a/examples/styling/snapshots/moonfly-tiny-skia.sha256 b/examples/styling/snapshots/moonfly-tiny-skia.sha256 index 377e0509..f3c9d57d 100644 --- a/examples/styling/snapshots/moonfly-tiny-skia.sha256 +++ b/examples/styling/snapshots/moonfly-tiny-skia.sha256 @@ -1 +1 @@ -21820cf793f0a3af6fd339132b32cc77cbca52f1ca32f7ae334f74849a046ba8 \ No newline at end of file +82e617ffb6f5805014377e0b9094b91827de14fa919855d4c6443267291ca677 \ No newline at end of file diff --git a/examples/styling/snapshots/nightfly-tiny-skia.sha256 b/examples/styling/snapshots/nightfly-tiny-skia.sha256 index a4a22ca2..3745dd49 100644 --- a/examples/styling/snapshots/nightfly-tiny-skia.sha256 +++ b/examples/styling/snapshots/nightfly-tiny-skia.sha256 @@ -1 +1 @@ -1ba92e64ddcc5f5fc6f841d5fde961382099e7698a253ac93670b900287ee55c \ No newline at end of file +3cae3ed606e1927ef9aaba7e498a54b62ea70d114f0011a048192a2743accbef \ No newline at end of file diff --git a/examples/styling/snapshots/nord-tiny-skia.sha256 b/examples/styling/snapshots/nord-tiny-skia.sha256 index d1f4cf12..52e996e5 100644 --- a/examples/styling/snapshots/nord-tiny-skia.sha256 +++ b/examples/styling/snapshots/nord-tiny-skia.sha256 @@ -1 +1 @@ -f6559f58f9acae81d929ee1aa5f8db33fca9d4ff49d21acf1e627d891ed77565 \ No newline at end of file +8daec0d941ecc2eb52135b63a91936786ef2af48d56fba2d192e00438230ae0b \ No newline at end of file diff --git a/examples/styling/snapshots/oxocarbon-tiny-skia.sha256 b/examples/styling/snapshots/oxocarbon-tiny-skia.sha256 index 5cb7f75e..356e9b0b 100644 --- a/examples/styling/snapshots/oxocarbon-tiny-skia.sha256 +++ b/examples/styling/snapshots/oxocarbon-tiny-skia.sha256 @@ -1 +1 @@ -d3d34b3b02b11156cb9a545d60cba078e78e4124c8f3ae61be66908a42799166 \ No newline at end of file +d0bd8d738130d56857e618efbd9e11b515aa0655e2edf8dc2326b8dabf54c490 \ No newline at end of file diff --git a/examples/styling/snapshots/solarized_dark-tiny-skia.sha256 b/examples/styling/snapshots/solarized_dark-tiny-skia.sha256 index 367d8198..f8475616 100644 --- a/examples/styling/snapshots/solarized_dark-tiny-skia.sha256 +++ b/examples/styling/snapshots/solarized_dark-tiny-skia.sha256 @@ -1 +1 @@ -3c983866c4feaa10ed34206c1a4c98933e87ba6239849bd7e1b7876f6c9596e7 \ No newline at end of file +d1c06a7016554e03308c0a642ea0edf17e397b639aa9194c2314b0e32d8165ff \ No newline at end of file diff --git a/examples/styling/snapshots/solarized_light-tiny-skia.sha256 b/examples/styling/snapshots/solarized_light-tiny-skia.sha256 index bf7fb05b..213ee947 100644 --- a/examples/styling/snapshots/solarized_light-tiny-skia.sha256 +++ b/examples/styling/snapshots/solarized_light-tiny-skia.sha256 @@ -1 +1 @@ -dc6fc66e651d938a42f0a9c642a99e33865b87aefc3fdeafa1848f6a3fab20c3 \ No newline at end of file +c8596fa0d72e96e144de58953e7a8ef7c37b88625070642747769af1104a0050 \ No newline at end of file diff --git a/examples/styling/snapshots/tokyo_night-tiny-skia.sha256 b/examples/styling/snapshots/tokyo_night-tiny-skia.sha256 index 5685ce2f..4700021e 100644 --- a/examples/styling/snapshots/tokyo_night-tiny-skia.sha256 +++ b/examples/styling/snapshots/tokyo_night-tiny-skia.sha256 @@ -1 +1 @@ -7104099471f9c712f00cd2ac80e150e10f7d21604d7edc6b13181e74d42eb877 \ No newline at end of file +c831821798f5fe38609a7fe854a3785942ae04750ed23936f32b33139126e195 \ No newline at end of file diff --git a/examples/styling/snapshots/tokyo_night_light-tiny-skia.sha256 b/examples/styling/snapshots/tokyo_night_light-tiny-skia.sha256 index 2efd8415..a26fd224 100644 --- a/examples/styling/snapshots/tokyo_night_light-tiny-skia.sha256 +++ b/examples/styling/snapshots/tokyo_night_light-tiny-skia.sha256 @@ -1 +1 @@ -263b5eb190d7db2ab0a67dc8b73778d9130755b07a8295345c758e158fb52881 \ No newline at end of file +26c9d551330f5dbe6680f1c9e8cdf3b6810c26c9de3b22a9a948eae16d5fa3d9 \ No newline at end of file diff --git a/examples/styling/snapshots/tokyo_night_storm-tiny-skia.sha256 b/examples/styling/snapshots/tokyo_night_storm-tiny-skia.sha256 index c8a8d1ed..27013156 100644 --- a/examples/styling/snapshots/tokyo_night_storm-tiny-skia.sha256 +++ b/examples/styling/snapshots/tokyo_night_storm-tiny-skia.sha256 @@ -1 +1 @@ -6fd5700c7a63ba004957601e0d91b02e8d08b710cff81710d3b8cd1cb668faa6 \ No newline at end of file +5660044597f3ca9e10f5f704cfd4723e7c68f1d211c999063134aa8576227757 \ No newline at end of file diff --git a/examples/styling/src/main.rs b/examples/styling/src/main.rs index 934b9f5d..0ba4e20f 100644 --- a/examples/styling/src/main.rs +++ b/examples/styling/src/main.rs @@ -1,8 +1,8 @@ use iced::keyboard; use iced::widget::{ - button, center, checkbox, column, container, horizontal_rule, pick_list, - progress_bar, row, scrollable, slider, text, text_input, toggler, - vertical_rule, vertical_space, + button, center_x, center_y, checkbox, column, container, horizontal_rule, + pick_list, progress_bar, row, scrollable, slider, text, text_input, + toggler, vertical_rule, vertical_space, }; use iced::{Center, Element, Fill, Subscription, Theme}; @@ -94,7 +94,7 @@ impl Styling { let progress_bar = || progress_bar(0.0..=100.0, self.slider_value); - let scrollable = scrollable(column![ + let scroll_me = scrollable(column![ "Scroll me!", vertical_space().height(800), "You did it!" @@ -134,7 +134,7 @@ impl Styling { slider(), progress_bar(), row![ - scrollable, + scroll_me, row![vertical_rule(1), column![checkbox, toggler].spacing(20)] .spacing(20) ] @@ -147,7 +147,9 @@ impl Styling { .padding(20) .max_width(600); - center(content).into() + center_y(scrollable(center_x(content)).spacing(10)) + .padding(10) + .into() } fn subscription(&self) -> Subscription { diff --git a/graphics/src/text.rs b/graphics/src/text.rs index d2514c90..e00b3ac7 100644 --- a/graphics/src/text.rs +++ b/graphics/src/text.rs @@ -176,7 +176,7 @@ impl FontSystem { #[derive(Debug, Clone, Copy, PartialEq, Eq, PartialOrd, Ord, Hash, Default)] pub struct Version(u32); -/// A weak reference to a [`cosmic-text::Buffer`] that can be drawn. +/// A weak reference to a [`cosmic_text::Buffer`] that can be drawn. #[derive(Debug, Clone)] pub struct Raw { /// A weak reference to a [`cosmic_text::Buffer`]. diff --git a/widget/src/button.rs b/widget/src/button.rs index 37c07169..ac4a27cb 100644 --- a/widget/src/button.rs +++ b/widget/src/button.rs @@ -718,13 +718,13 @@ pub fn subtle(theme: &Theme, status: Status) -> Style { Status::Active => base, Status::Pressed => Style { background: Some(Background::Color( - palette.background.strongest.color, + palette.background.strong.color, )), ..base }, Status::Hovered => Style { background: Some(Background::Color( - palette.background.strong.color, + palette.background.weaker.color, )), ..base }, diff --git a/widget/src/checkbox.rs b/widget/src/checkbox.rs index 8fce8b1d..91c87ac0 100644 --- a/widget/src/checkbox.rs +++ b/widget/src/checkbox.rs @@ -556,20 +556,23 @@ pub fn primary(theme: &Theme, status: Status) -> Style { match status { Status::Active { is_checked } => styled( - palette.background.strongest.color, + palette.background.strong.color, palette.background.base, + palette.primary.base.text, palette.primary.base, is_checked, ), Status::Hovered { is_checked } => styled( - palette.background.strongest.color, + palette.background.strong.color, palette.background.weak, + palette.primary.base.text, palette.primary.strong, is_checked, ), Status::Disabled { is_checked } => styled( palette.background.weak.color, palette.background.weak, + palette.primary.base.text, palette.background.strong, is_checked, ), @@ -582,20 +585,23 @@ pub fn secondary(theme: &Theme, status: Status) -> Style { match status { Status::Active { is_checked } => styled( - palette.background.strongest.color, + palette.background.strong.color, palette.background.base, + palette.background.base.text, palette.background.strong, is_checked, ), Status::Hovered { is_checked } => styled( - palette.background.strongest.color, + palette.background.strong.color, palette.background.weak, + palette.background.base.text, palette.background.strong, is_checked, ), Status::Disabled { is_checked } => styled( palette.background.weak.color, palette.background.weak, + palette.background.base.text, palette.background.weak, is_checked, ), @@ -610,18 +616,21 @@ pub fn success(theme: &Theme, status: Status) -> Style { Status::Active { is_checked } => styled( palette.background.weak.color, palette.background.base, + palette.success.base.text, palette.success.base, is_checked, ), Status::Hovered { is_checked } => styled( - palette.background.strongest.color, + palette.background.strong.color, palette.background.weak, + palette.success.base.text, palette.success.strong, is_checked, ), Status::Disabled { is_checked } => styled( palette.background.weak.color, palette.background.weak, + palette.success.base.text, palette.success.weak, is_checked, ), @@ -634,20 +643,23 @@ pub fn danger(theme: &Theme, status: Status) -> Style { match status { Status::Active { is_checked } => styled( - palette.background.strongest.color, + palette.background.strong.color, palette.background.base, + palette.danger.base.text, palette.danger.base, is_checked, ), Status::Hovered { is_checked } => styled( - palette.background.strongest.color, + palette.background.strong.color, palette.background.weak, + palette.danger.base.text, palette.danger.strong, is_checked, ), Status::Disabled { is_checked } => styled( palette.background.weak.color, palette.background.weak, + palette.danger.base.text, palette.danger.weak, is_checked, ), @@ -657,6 +669,7 @@ pub fn danger(theme: &Theme, status: Status) -> Style { fn styled( border_color: Color, base: palette::Pair, + icon_color: Color, accent: palette::Pair, is_checked: bool, ) -> Style { @@ -668,7 +681,7 @@ fn styled( Style { background: Background::Color(background.color), - icon_color: background.text, + icon_color, border: Border { radius: 2.0.into(), width: 1.0, diff --git a/widget/src/pick_list.rs b/widget/src/pick_list.rs index 517ff35d..4076d7f7 100644 --- a/widget/src/pick_list.rs +++ b/widget/src/pick_list.rs @@ -899,7 +899,7 @@ pub fn default(theme: &Theme, status: Status) -> Style { let active = Style { text_color: palette.background.weak.text, background: palette.background.weak.color.into(), - placeholder_color: palette.background.strong.color, + placeholder_color: palette.secondary.base.color, handle_color: palette.background.weak.text, border: Border { radius: 2.0.into(), diff --git a/widget/src/scrollable.rs b/widget/src/scrollable.rs index 01c4ef7c..61e78d50 100644 --- a/widget/src/scrollable.rs +++ b/widget/src/scrollable.rs @@ -2069,7 +2069,7 @@ pub fn default(theme: &Theme, status: Status) -> Style { background: Some(palette.background.weak.color.into()), border: border::rounded(2), scroller: Scroller { - color: palette.background.strong.color, + color: palette.background.strongest.color, border: border::rounded(2), }, }; diff --git a/widget/src/text_editor.rs b/widget/src/text_editor.rs index 4e1d594c..451072a8 100644 --- a/widget/src/text_editor.rs +++ b/widget/src/text_editor.rs @@ -1374,8 +1374,6 @@ pub struct Style { pub background: Background, /// The [`Border`] of the text input. pub border: Border, - /// The [`Color`] of the icon of the text input. - pub icon: Color, /// The [`Color`] of the placeholder of the text input. pub placeholder: Color, /// The [`Color`] of the value of the text input. @@ -1422,8 +1420,7 @@ pub fn default(theme: &Theme, status: Status) -> Style { width: 1.0, color: palette.background.strong.color, }, - icon: palette.background.weak.text, - placeholder: palette.background.strong.color, + placeholder: palette.secondary.base.color, value: palette.background.base.text, selection: palette.primary.weak.color, }; @@ -1447,6 +1444,7 @@ pub fn default(theme: &Theme, status: Status) -> Style { Status::Disabled => Style { background: Background::Color(palette.background.weak.color), value: active.placeholder, + placeholder: palette.background.strongest.color, ..active }, } diff --git a/widget/src/text_input.rs b/widget/src/text_input.rs index ba15e916..3e849175 100644 --- a/widget/src/text_input.rs +++ b/widget/src/text_input.rs @@ -1817,10 +1817,10 @@ pub fn default(theme: &Theme, status: Status) -> Style { border: Border { radius: 2.0.into(), width: 1.0, - color: palette.background.strongest.color, + color: palette.background.strong.color, }, icon: palette.background.weak.text, - placeholder: palette.background.strongest.color, + placeholder: palette.secondary.base.color, value: palette.background.base.text, selection: palette.primary.weak.color, }; @@ -1844,6 +1844,7 @@ pub fn default(theme: &Theme, status: Status) -> Style { Status::Disabled => Style { background: Background::Color(palette.background.weak.color), value: active.placeholder, + placeholder: palette.background.strongest.color, ..active }, } diff --git a/widget/src/toggler.rs b/widget/src/toggler.rs index 7f6e6795..41e4bd64 100644 --- a/widget/src/toggler.rs +++ b/widget/src/toggler.rs @@ -556,7 +556,7 @@ pub fn default(theme: &Theme, status: Status) -> Style { if is_toggled { palette.primary.base.color } else { - palette.background.strongest.color + palette.background.strong.color } } Status::Disabled => palette.background.weak.color, diff --git a/winit/src/conversion.rs b/winit/src/conversion.rs index ab84afff..4b9fcc0d 100644 --- a/winit/src/conversion.rs +++ b/winit/src/conversion.rs @@ -289,7 +289,7 @@ pub fn window_event( Ime::Enabled => input_method::Event::Opened, Ime::Preedit(content, size) => input_method::Event::Preedit( content, - size.map(|(start, end)| (start..end)), + size.map(|(start, end)| start..end), ), Ime::Commit(content) => input_method::Event::Commit(content), Ime::Disabled => input_method::Event::Closed,