Change default draw color to orange, plus small fixes

README.md

@@ -22,7 +22,7 @@ This is a **work-in-progress mockup** of the Document, Properties, and Layer Tre
 
 Graphite is an open source, cross-platform digital content creation desktop and web application for 2D graphics editing, photo processing, vector art, digital painting, illustration, data visualization, and compositing. Inspired by the open source success story of Blender in the 3D domain, it aims to bring 2D content creation to new heights with efficient workflows influenced by Photoshop and Illustrator and backed by a powerful node-based, nondestructive approach proven by Houdini and Substance.
 
-The user experience of Graphite is of central importance, offering a meticulously-designed UI catering towards an intuitive and efficient artistic process. Users may draw and edit in the traditional interactive (WYSIWYG) viewport with the Layer Tree panel or jump in or out of the node graph at any time to tweak previous work and construct powerful procedural image generators that seamlessly sync with the interactive viewport. A core principle of the application is its 100% nondestructive workflow that is resolution-agnostic, meaning that raster-style image editing can be infinitely zoomed and scaled to any arbitrary resolution at a later time because editing is done by recording brush strokes, vector shapes, and other manipulations parametrically.
+The user experience of Graphite is of central importance, offering a meticulously-designed UI catering towards an intuitive and efficient artistic process. Users may draw and edit in the traditional interactive (WYSIWYG) viewport with the Layer Tree panel or jump in or out of the node graph at any time to tweak previous work and construct powerful procedural image generators that seamlessly sync with the interactive viewport. A core principle of the application is its 100% nondestructive workflow that is resolution-agnostic, meaning that raster-style image editing can be infinitely zoomed and scaled to arbitrary resolutions at a later time because editing is done by recording brush strokes, vector shapes, and other manipulations parametrically.
 
 One might use the painting tools on a small laptop display, zoom into specific areas to add detail to finish the artwork, then perhaps try changing the simulated brush style from a blunt pencil to a soft acrylic paintbrush after-the-fact, and finally export the complete drawing at ultra high resolution for printing on a large poster.
 

client/web/src/components/panels/Document.vue

@@ -40,8 +40,8 @@
 
 				<ItemDivider />
 
-				<IconButton :size="24" title="Zoom Out"><ZoomOut /></IconButton>
 				<IconButton :size="24" title="Zoom In"><ZoomIn /></IconButton>
+				<IconButton :size="24" title="Zoom Out"><ZoomOut /></IconButton>
 				<IconButton :size="24" title="Zoom to 100%"><ZoomReset /></IconButton>
 				<NumberInput />
 			</div>
@@ -336,8 +336,8 @@ export default defineComponent({
 		window.addEventListener("keyup", (e: KeyboardEvent) => this.keyUp(e));
 		window.addEventListener("keydown", (e: KeyboardEvent) => this.keyDown(e));
 
-		// TODO: Implement actuall UI for chosing colors (this is completly temporary)
-		this.updatePrimaryColor({ r: 0.29, g: 0.52, b: 0.29, a: 0.6 });
+		// TODO: Implement an actual UI for chosing colors (this is completely temporary)
+		this.updatePrimaryColor({ r: 247 / 255, g: 76 / 255, b: 0 / 255, a: 0.6 });
 	},
 	data() {
 		return {

client/web/src/components/panels/LayerTree.vue

@@ -9,7 +9,7 @@
 			<LayoutCol :class="'list'">
 				<div class="layer-row" v-for="layer in layers" :key="layer.path">
 					<div class="layer-visibility">
-						<IconButton @click="toggleLayerVisibility(layer)" :size="24" title="layer.visible ? 'Visible' : 'Hidden">
+						<IconButton @click="toggleLayerVisibility(layer)" :size="24" :title="layer.visible ? 'Visible' : 'Hidden'">
 							<EyeVisible v-if="layer.visible" />
 							<EyeHidden v-if="!layer.visible" />
 						</IconButton>