From 026f83c9b322eacf92447a6db9ad0280bcd9a031 Mon Sep 17 00:00:00 2001
From: Cole Bemis <colebemis@github.com>
Date: Thu, 30 Jan 2025 00:03:32 -0800
Subject: [PATCH] Add printer icon and print option to note page

---
 src/components/icons.tsx | 12 ++++++++++++
 src/routes/__root.tsx    |  2 +-
 src/routes/notes_.$.tsx  |  4 ++++
 3 files changed, 17 insertions(+), 1 deletion(-)

diff --git a/src/components/icons.tsx b/src/components/icons.tsx
index a63a1f28..2de608d0 100644
--- a/src/components/icons.tsx
+++ b/src/components/icons.tsx
@@ -288,6 +288,18 @@ export function PaperclipIcon16(props: IconProps) {
   )
 }
 
+export function PrinterIcon16(props: IconProps) {
+  return (
+    <Icon size={16} {...props}>
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M3 2C3 0.895431 3.89543 0 5 0H11C12.1046 0 13 0.895431 13 2V4.5H13.5C14.8807 4.5 16 5.61929 16 7V10.5C16 11.8807 14.8807 13 13.5 13H13.3532L13.47 13.6422C13.6932 14.8699 12.75 16 11.5022 16H4.49777C3.24996 16 2.30681 14.8699 2.53003 13.6422L2.6468 13H2.5C1.11929 13 0 11.8807 0 10.5V7C0 5.61929 1.11929 4.5 2.5 4.5H3V2ZM2.91952 11.5L3.07548 10.6422C3.24839 9.69125 4.07665 9 5.04322 9H10.9568C11.9234 9 12.7516 9.69125 12.9245 10.6422L13.0805 11.5H13.5C14.0523 11.5 14.5 11.0523 14.5 10.5V7C14.5 6.44772 14.0523 6 13.5 6H12.25H3.75H2.5C1.94772 6 1.5 6.44772 1.5 7V10.5C1.5 11.0523 1.94772 11.5 2.5 11.5H2.91952ZM4.5 4.5H11.5V2C11.5 1.72386 11.2761 1.5 11 1.5H5C4.72386 1.5 4.5 1.72386 4.5 2V4.5ZM4.55129 10.9106C4.59451 10.6728 4.80158 10.5 5.04322 10.5H10.9568C11.1984 10.5 11.4055 10.6728 11.4487 10.9106L11.9942 13.9106C12.05 14.2175 11.8142 14.5 11.5022 14.5H4.49777C4.18581 14.5 3.95003 14.2175 4.00583 13.9106L4.55129 10.9106Z"
+      />
+    </Icon>
+  )
+}
+
 export function FileIcon16(props: IconProps) {
   return (
     <Icon size={16} {...props}>
diff --git a/src/routes/__root.tsx b/src/routes/__root.tsx
index 35e8da54..01ca4696 100644
--- a/src/routes/__root.tsx
+++ b/src/routes/__root.tsx
@@ -87,7 +87,7 @@ function RootComponent() {
 
   return (
     <div
-      className="flex h-screen w-screen flex-col bg-bg pb-[env(safe-area-inset-bottom)] pl-[env(safe-area-inset-left)] pr-[env(safe-area-inset-right)] print:h-auto [@supports(height:100svh)]:h-[100svh]"
+      className="flex h-screen w-screen flex-col bg-bg pb-[env(safe-area-inset-bottom)] pl-[env(safe-area-inset-left)] pr-[env(safe-area-inset-right)] print:h-auto print:w-full [@supports(height:100svh)]:h-[100svh]"
       data-vaul-drawer-wrapper=""
     >
       {isSignedOut ? (
diff --git a/src/routes/notes_.$.tsx b/src/routes/notes_.$.tsx
index 9e17c13f..493f7b73 100644
--- a/src/routes/notes_.$.tsx
+++ b/src/routes/notes_.$.tsx
@@ -28,6 +28,7 @@ import {
   PaperclipIcon16,
   PinFillIcon16,
   PinIcon16,
+  PrinterIcon16,
   ShareIcon16,
   TrashIcon16,
   UndoIcon16,
@@ -465,6 +466,9 @@ function NotePage() {
                 >
                   Export as Gist
                 </DropdownMenu.Item>
+                <DropdownMenu.Item icon={<PrinterIcon16 />} onSelect={() => window.print()}>
+                  Print
+                </DropdownMenu.Item>
                 <DropdownMenu.Separator />
                 <DropdownMenu.Item
                   variant="danger"