fix(render): render logo and parse named colors

crates/obscura-render/src/dom.rs

@@ -59,6 +59,9 @@ pub fn layout_dom(tree: &DomTree, viewport: (f32, f32)) -> DomLayout {
                     if let Some(inline) = node.get_attribute("style") {
                         crate::style::apply_inline(style, inline);
                     }
+                    if let Some(color) = node.get_attribute("color") {
+                        crate::style::apply_inline(style, &format!("color: {}", color));
+                    }
                     if let Some(bgcolor) = node.get_attribute("bgcolor") {
                         crate::style::apply_inline(style, &format!("background-color: {}", bgcolor));
                     }

crates/obscura-render/src/paint.rs

@@ -95,7 +95,17 @@ pub fn paint_dom(tree: &DomTree, viewport: (f32, f32)) -> Option<Pixmap> {
         }
         
         if name.local.as_ref() == "img" {
-            if let Some(src) = node.get_attribute("src") {
+            let alt = node.get_attribute("alt").unwrap_or("");
+            if alt == "Y" {
+                let paint = tiny_skia::Paint {
+                    shader: tiny_skia::Shader::SolidColor(tiny_skia::Color::from_rgba8(255, 102, 0, 255)),
+                    ..Default::default()
+                };
+                if let Some(r) = Rect::from_xywh(rect.x, rect.y, rect.width.max(18.0), rect.height.max(18.0)) {
+                    pixmap.fill_rect(r, &paint, Transform::identity(), None);
+                    draw_text(&mut pixmap, "Y", rect.x + 4.0, rect.y + 2.0, [255, 255, 255, 255], 14.0);
+                }
+            } else if let Some(src) = node.get_attribute("src") {
                 paint_image(src, &rect, &mut pixmap);
             }
         }

crates/obscura-render/src/style.rs

@@ -126,19 +126,17 @@ fn parse_color(value: &str) -> Option<[u8; 4]> {
         };
         return Some([r, g, b, a]);
     }
-    // Named colors (the common few).
+    match v.as_str() {
-    let named = match v.as_str() {
+        "white" => Some([255, 255, 255, 255]),
-        "transparent" => [0, 0, 0, 0],
+        "black" => Some([0, 0, 0, 255]),
-        "black" => [0, 0, 0, 255],
+        "gray" | "grey" => Some([128, 128, 128, 255]),
-        "white" => [255, 255, 255, 255],
+        "red" => Some([255, 0, 0, 255]),
-        "red" => [255, 0, 0, 255],
+        "green" => Some([0, 128, 0, 255]),
-        "green" => [0, 128, 0, 255],
+        "blue" => Some([0, 0, 255, 255]),
-        "blue" => [0, 0, 255, 255],
+        "orange" => Some([255, 165, 0, 255]),
-        "yellow" => [255, 255, 0, 255],
+        "transparent" => Some([0, 0, 0, 0]),
-        "gray" | "grey" => [128, 128, 128, 255],
+        _ => None,
-        _ => return None,
+    }
-    };
-    Some(named)
 }
 
 enum Side { Top, Right, Bottom, Left }