Update UI widget designs to improve color consistency and add a narrow height mode

node-graph/gapplication-io/src/lib.rs

@@ -2,7 +2,7 @@ use dyn_any::{DynAny, StaticType, StaticTypeSized};
 use glam::{DAffine2, UVec2};
 use graphene_core::text::FontCache;
 use graphene_core::transform::Footprint;
-use graphene_core::vector::style::ViewMode;
+use graphene_core::vector::style::RenderMode;
 use std::fmt::Debug;
 use std::future::Future;
 use std::hash::{Hash, Hasher};
@@ -240,7 +240,8 @@ pub struct RenderConfig {
 	pub viewport: Footprint,
 	pub export_format: ExportFormat,
 	pub time: TimingInformation,
-	pub view_mode: ViewMode,
+	#[serde(alias = "view_mode")]
+	pub render_mode: RenderMode,
 	pub hide_artboards: bool,
 	pub for_export: bool,
 }

node-graph/gcore/src/vector/style.rs

@@ -650,14 +650,16 @@ impl PathStyle {
 	}
 }
 
-/// Represents different ways of rendering an object
+/// Ways the user can choose to view the artwork in the viewport.
 #[derive(Default, Debug, Clone, Copy, PartialEq, Eq, serde::Serialize, serde::Deserialize, Hash, DynAny, specta::Type)]
-pub enum ViewMode {
+pub enum RenderMode {
 	/// Render with normal coloration at the current viewport resolution
 	#[default]
-	Normal,
+	Normal = 0,
 	/// Render only the outlines of shapes at the current viewport resolution
 	Outline,
-	/// Render with normal coloration at the document resolution, showing the pixels when the current viewport resolution is higher
-	Pixels,
+	// /// Render with normal coloration at the document resolution, showing the pixels when the current viewport resolution is higher
+	// PixelPreview,
+	// /// Render a preview of how the object would be exported as an SVG.
+	// SvgPreview,
 }

node-graph/gstd/src/wasm_application_io.rs

@@ -307,7 +307,7 @@ async fn render<'a: 'n, T: 'n + Render + WasmNotSend>(
 	ctx.footprint();
 
 	let render_params = RenderParams {
-		view_mode: render_config.view_mode,
+		render_mode: render_config.render_mode,
 		hide_artboards: render_config.hide_artboards,
 		for_export: render_config.for_export,
 		footprint,

node-graph/gsvg-renderer/src/render_ext.rs

@@ -3,7 +3,7 @@ use glam::DAffine2;
 use graphene_core::consts::{LAYER_OUTLINE_STROKE_COLOR, LAYER_OUTLINE_STROKE_WEIGHT};
 use graphene_core::gradient::{Gradient, GradientType};
 use graphene_core::uuid::generate_uuid;
-use graphene_core::vector::style::{Fill, PaintOrder, PathStyle, Stroke, StrokeAlign, StrokeCap, StrokeJoin, ViewMode};
+use graphene_core::vector::style::{Fill, PaintOrder, PathStyle, RenderMode, Stroke, StrokeAlign, StrokeCap, StrokeJoin};
 use std::fmt::Write;
 
 pub trait RenderExt {
@@ -163,9 +163,9 @@ impl RenderExt for PathStyle {
 	/// Renders the shape's fill and stroke attributes as a string with them concatenated together.
 	#[allow(clippy::too_many_arguments)]
 	fn render(&self, svg_defs: &mut String, element_transform: DAffine2, stroke_transform: DAffine2, bounds: DAffine2, transformed_bounds: DAffine2, render_params: &RenderParams) -> String {
-		let view_mode = render_params.view_mode;
-		match view_mode {
-			ViewMode::Outline => {
+		let render_mode = render_params.render_mode;
+		match render_mode {
+			RenderMode::Outline => {
 				let fill_attribute = Fill::None.render(svg_defs, element_transform, stroke_transform, bounds, transformed_bounds, render_params);
 				let mut outline_stroke = Stroke::new(Some(LAYER_OUTLINE_STROKE_COLOR), LAYER_OUTLINE_STROKE_WEIGHT);
 				// Outline strokes should be non-scaling by default

node-graph/gsvg-renderer/src/renderer.rs

@@ -19,7 +19,7 @@ use graphene_core::transform::{Footprint, Transform};
 use graphene_core::uuid::{NodeId, generate_uuid};
 use graphene_core::vector::Vector;
 use graphene_core::vector::click_target::{ClickTarget, FreePoint};
-use graphene_core::vector::style::{Fill, PaintOrder, Stroke, StrokeAlign, ViewMode};
+use graphene_core::vector::style::{Fill, PaintOrder, RenderMode, Stroke, StrokeAlign};
 use graphene_core::{Artboard, Graphic};
 use kurbo::Affine;
 use num_traits::Zero;
@@ -159,7 +159,7 @@ pub struct RenderContext {
 /// Static state used whilst rendering
 #[derive(Default, Clone)]
 pub struct RenderParams {
-	pub view_mode: ViewMode,
+	pub render_mode: RenderMode,
 	pub footprint: Footprint,
 	pub thumbnail: bool,
 	/// Don't render the rectangle for an artboard to allow exporting with a transparent background.
@@ -555,14 +555,14 @@ impl Render for Table<Graphic> {
 
 			let mut layer = false;
 
-			let blend_mode = match render_params.view_mode {
-				ViewMode::Outline => peniko::Mix::Normal,
+			let blend_mode = match render_params.render_mode {
+				RenderMode::Outline => peniko::Mix::Normal,
 				_ => alpha_blending.blend_mode.to_peniko(),
 			};
 			let mut bounds = RenderBoundingBox::None;
 
 			let opacity = row.alpha_blending.opacity(render_params.for_mask);
-			if opacity < 1. || (render_params.view_mode != ViewMode::Outline && alpha_blending.blend_mode != BlendMode::default()) {
+			if opacity < 1. || (render_params.render_mode != RenderMode::Outline && alpha_blending.blend_mode != BlendMode::default()) {
 				bounds = row.element.bounding_box(transform, true);
 
 				if let RenderBoundingBox::Rectangle(bounds) = bounds {
@@ -852,8 +852,8 @@ impl Render for Table<Vector> {
 			}
 
 			// If we're using opacity or a blend mode, we need to push a layer
-			let blend_mode = match render_params.view_mode {
-				ViewMode::Outline => peniko::Mix::Normal,
+			let blend_mode = match render_params.render_mode {
+				RenderMode::Outline => peniko::Mix::Normal,
 				_ => row.alpha_blending.blend_mode.to_peniko(),
 			};
 			let mut layer = false;
@@ -969,8 +969,8 @@ impl Render for Table<Vector> {
 			};
 
 			// Render the path
-			match render_params.view_mode {
-				ViewMode::Outline => {
+			match render_params.render_mode {
+				RenderMode::Outline => {
 					let outline_stroke = kurbo::Stroke {
 						width: LAYER_OUTLINE_STROKE_WEIGHT,
 						miter_limit: 4.,