demo: layout fixes, sticky removal, style overrides, css-like rendering improvements

src/interpreter/style.rs

@@ -815,35 +815,50 @@ pub enum Display {
     None,
 }
 
+#[derive(Debug, Clone, Copy, PartialEq)]
+pub enum SizeValue {
+    Px(f32),
+    Percent(f32),
+}
+
+impl SizeValue {
+    pub fn resolve(self, relative_to: Option<f32>) -> f32 {
+        match self {
+            SizeValue::Px(v) => v,
+            SizeValue::Percent(p) => relative_to.map(|base| base * p / 100.0).unwrap_or(p),
+        }
+    }
+}
+
 #[derive(Debug, Clone, Copy, Default)]
 pub struct ComputedStyle {
-    pub font_size:     Option<f32>,
+    pub font_size:     Option<SizeValue>,
     pub color:         Option<iced::Color>,
-    pub padding:       Option<f32>,
-    pub padding_top:   Option<f32>,
-    pub padding_right: Option<f32>,
-    pub padding_bottom:Option<f32>,
-    pub padding_left:  Option<f32>,
+    pub padding:       Option<SizeValue>,
+    pub padding_top:   Option<SizeValue>,
+    pub padding_right: Option<SizeValue>,
+    pub padding_bottom:Option<SizeValue>,
+    pub padding_left:  Option<SizeValue>,
 
-    pub margin:        Option<f32>,
-    pub margin_top:    Option<f32>,
-    pub margin_right:  Option<f32>,
-    pub margin_bottom: Option<f32>,
-    pub margin_left:   Option<f32>,
+    pub margin:        Option<SizeValue>,
+    pub margin_top:    Option<SizeValue>,
+    pub margin_right:  Option<SizeValue>,
+    pub margin_bottom: Option<SizeValue>,
+    pub margin_left:   Option<SizeValue>,
 
     pub background:    Option<iced::Color>,
-    pub spacing:       Option<f32>,
-    pub border_radius: Option<f32>,
-    pub border_width:  Option<f32>,
+    pub spacing:       Option<SizeValue>,
+    pub border_radius: Option<SizeValue>,
+    pub border_width:  Option<SizeValue>,
     pub border_color:  Option<iced::Color>,
 
     pub width:         Option<iced::Length>,
     pub height:        Option<iced::Length>,
 
-    pub min_width:     Option<f32>,
-    pub max_width:     Option<f32>,
-    pub min_height:    Option<f32>,
-    pub max_height:    Option<f32>,
+    pub min_width:     Option<SizeValue>,
+    pub max_width:     Option<SizeValue>,
+    pub min_height:    Option<SizeValue>,
+    pub max_height:    Option<SizeValue>,
     pub direction:     Option<LayoutDirection>,
     pub align_items:   Option<iced::Alignment>,
     pub content_align: Option<ContentAlign>,
@@ -851,10 +866,10 @@ pub struct ComputedStyle {
     pub flex_grow:     Option<u16>,
 
     pub position:      Option<Position>,
-    pub top:           Option<f32>,
-    pub right:         Option<f32>,
-    pub bottom:        Option<f32>,
-    pub left:          Option<f32>,
+    pub top:           Option<SizeValue>,
+    pub right:         Option<SizeValue>,
+    pub bottom:        Option<SizeValue>,
+    pub left:          Option<SizeValue>,
 
     pub overflow_x:    Option<Overflow>,
     pub overflow_y:    Option<Overflow>,
@@ -862,7 +877,7 @@ pub struct ComputedStyle {
 
     pub opacity:       Option<f32>,
     pub font_weight:   Option<u16>,
-    pub line_height:   Option<f32>,
+    pub line_height:   Option<SizeValue>,
     pub text_align:    Option<TextAlign>,
 }
 
@@ -1196,18 +1211,27 @@ pub fn parse_text_align(s: &str) -> Option<TextAlign> {
     else { None }
 }
 
-pub fn parse_size(s: &str) -> Option<f32> {
+pub fn parse_size(s: &str) -> Option<SizeValue> {
     let s = s.trim();
-    if s.ends_with('%') || s.eq_ignore_ascii_case("auto") ||
+    if s.eq_ignore_ascii_case("auto") ||
        s.eq_ignore_ascii_case("fill") || s.eq_ignore_ascii_case("stretch") {
         return None;
     }
+    if s.ends_with('%') {
+        let val = s.trim_end_matches(|c: char| c == '%' || c.is_alphabetic())
+            .parse::<f32>().ok()?;
+        return Some(SizeValue::Percent(val));
+    }
     if s.eq_ignore_ascii_case("vw") || s.eq_ignore_ascii_case("vh") {
         return None;
     }
-    s.trim_end_matches(|c: char| c.is_alphabetic())
-        .parse::<f32>()
-        .ok()
+    let val = s.trim_end_matches(|c: char| c.is_alphabetic())
+        .parse::<f32>().ok()?;
+    Some(SizeValue::Px(val))
+}
+
+pub fn resolve_size(v: Option<SizeValue>, relative_to: Option<f32>) -> Option<f32> {
+    v.map(|sv| sv.resolve(relative_to))
 }
 
 #[cfg(test)]