feat: update pen dock layout

Memola.xcodeproj/project.pbxproj

@@ -74,7 +74,7 @@
 		ECA738F42BE612A000A4542E /* Array++.swift in Sources */ = {isa = PBXBuildFile; fileRef = ECA738F32BE612A000A4542E /* Array++.swift */; };
 		ECA738F62BE612B700A4542E /* MTLDevice++.swift in Sources */ = {isa = PBXBuildFile; fileRef = ECA738F52BE612B700A4542E /* MTLDevice++.swift */; };
 		ECA738FC2BE61C5200A4542E /* Persistence.swift in Sources */ = {isa = PBXBuildFile; fileRef = ECA738FB2BE61C5200A4542E /* Persistence.swift */; };
-		ECA739082BE623F300A4542E /* PenToolView.swift in Sources */ = {isa = PBXBuildFile; fileRef = ECA739072BE623F300A4542E /* PenToolView.swift */; };
+		ECA739082BE623F300A4542E /* PenDockView.swift in Sources */ = {isa = PBXBuildFile; fileRef = ECA739072BE623F300A4542E /* PenDockView.swift */; };
 		ECEC01A82BEE11BA006DA24C /* QuadShape.swift in Sources */ = {isa = PBXBuildFile; fileRef = ECEC01A72BEE11BA006DA24C /* QuadShape.swift */; };
 		ECFA15202BEF21EF00455818 /* MemoObject.swift in Sources */ = {isa = PBXBuildFile; fileRef = ECFA151F2BEF21EF00455818 /* MemoObject.swift */; };
 		ECFA15222BEF21F500455818 /* CanvasObject.swift in Sources */ = {isa = PBXBuildFile; fileRef = ECFA15212BEF21F500455818 /* CanvasObject.swift */; };
@@ -153,7 +153,7 @@
 		ECA738F32BE612A000A4542E /* Array++.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = "Array++.swift"; sourceTree = "<group>"; };
 		ECA738F52BE612B700A4542E /* MTLDevice++.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = "MTLDevice++.swift"; sourceTree = "<group>"; };
 		ECA738FB2BE61C5200A4542E /* Persistence.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = Persistence.swift; sourceTree = "<group>"; };
-		ECA739072BE623F300A4542E /* PenToolView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = PenToolView.swift; sourceTree = "<group>"; };
+		ECA739072BE623F300A4542E /* PenDockView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = PenDockView.swift; sourceTree = "<group>"; };
 		ECEC01A72BEE11BA006DA24C /* QuadShape.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = QuadShape.swift; sourceTree = "<group>"; };
 		ECFA151F2BEF21EF00455818 /* MemoObject.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = MemoObject.swift; sourceTree = "<group>"; };
 		ECFA15212BEF21F500455818 /* CanvasObject.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = CanvasObject.swift; sourceTree = "<group>"; };
@@ -197,13 +197,13 @@
 			path = Core;
 			sourceTree = "<group>";
 		};
-		EC5050052BF65CCD00B4D86E /* PenTool */ = {
+		EC5050052BF65CCD00B4D86E /* PenDock */ = {
 			isa = PBXGroup;
 			children = (
-				ECA739072BE623F300A4542E /* PenToolView.swift */,
+				ECA739072BE623F300A4542E /* PenDockView.swift */,
 				EC5050062BF65CED00B4D86E /* PenDropDelegate.swift */,
 			);
-			path = PenTool;
+			path = PenDock;
 			sourceTree = "<group>";
 		};
 		EC5050082BF65D0500B4D86E /* Memo */ = {
@@ -316,7 +316,7 @@
 			isa = PBXGroup;
 			children = (
 				EC5050082BF65D0500B4D86E /* Memo */,
-				EC5050052BF65CCD00B4D86E /* PenTool */,
+				EC5050052BF65CCD00B4D86E /* PenDock */,
 			);
 			path = Memo;
 			sourceTree = "<group>";
@@ -700,7 +700,7 @@
 				ECA738862BE5FF2500A4542E /* Canvas.swift in Sources */,
 				ECA738882BE5FF4400A4542E /* Renderer.swift in Sources */,
 				ECA738D42BE60F9100A4542E /* StrokeGenerator.swift in Sources */,
-				ECA739082BE623F300A4542E /* PenToolView.swift in Sources */,
+				ECA739082BE623F300A4542E /* PenDockView.swift in Sources */,
 				ECA738CB2BE60F1900A4542E /* ViewPortContext.swift in Sources */,
 				ECA738EE2BE6125D00A4542E /* simd_float4x4++.swift in Sources */,
 				ECA7388C2BE6009600A4542E /* Textures.swift in Sources */,

Memola/Features/Memo/Memo/MemoView.swift

@@ -27,11 +27,13 @@ struct MemoView: View {
         CanvasView()
             .ignoresSafeArea()
             .overlay(alignment: .topTrailing) {
-                VStack(alignment: .trailing, spacing: 20) {
-                    historyTool
-                    PenToolView()
-                }
-                .padding()
+                historyTool
+                    .padding()
+            }
+            .overlay(alignment: .trailing) {
+                PenDockView()
+                    .frame(maxHeight: .infinity)
+                    .padding()
             }
             .overlay(alignment: .topLeading) {
                 Button {

Memola/Features/Memo/PenDock/PenDockView.swift

@@ -1,5 +1,5 @@
 //
-//  PenToolView.swift
+//  PenDockView.swift
 //  Memola
 //
 //  Created by Dscyre Scotti on 5/4/24.
@@ -7,12 +7,12 @@
 
 import SwiftUI
 
-struct PenToolView: View {
+struct PenDockView: View {
     @EnvironmentObject var tool: Tool
 
-    let width: CGFloat = 80
+    let width: CGFloat = 90
     let height: CGFloat = 30
-    let factor: CGFloat = 1.22
+    let factor: CGFloat = 0.95
 
     var body: some View {
         ScrollViewReader { proxy in
@@ -40,12 +40,10 @@ struct PenToolView: View {
         }
         .frame(maxHeight:( (height * factor + 10) * 7) + 20)
         .fixedSize()
-        .background {
-            HStack(spacing: 0) {
-                Spacer(minLength: 70)
-                RoundedRectangle(cornerRadius: 20)
-                    .fill(.regularMaterial)
-            }
+        .background(alignment: .trailing) {
+            RoundedRectangle(cornerRadius: 20)
+                .fill(.regularMaterial)
+                .frame(width: width * factor - 15)
         }
         .clipShape(.rect(cornerRadii: .init(bottomTrailing: 20, topTrailing: 20)))
         .overlay(alignment: .bottomLeading) {
@@ -112,7 +110,7 @@ struct PenToolView: View {
         }
         .onDrop(of: [.item], delegate: PenDropDelegate(id: pen.id, tool: tool))
         .padding(.leading, 10)
-        .offset(x: tool.selectedPen === pen ? 0 : 28)
+        .offset(x: tool.selectedPen === pen ? 0 : 25)
     }
 
     var newPenButton: some View {