From 4ea176007d2228364d4d3fa4519898047cef988f Mon Sep 17 00:00:00 2001
From: Nate Sesti <sestinj@gmail.com>
Date: Sun, 24 Sep 2023 11:27:24 -0700
Subject: feat: :lipstick: setting to change font size

---
 extension/react-app/src/components/UserInputContainer.tsx | 11 ++++++++---
 1 file changed, 8 insertions(+), 3 deletions(-)

(limited to 'extension/react-app/src/components/UserInputContainer.tsx')

diff --git a/extension/react-app/src/components/UserInputContainer.tsx b/extension/react-app/src/components/UserInputContainer.tsx
index 15f1752f..11671526 100644
--- a/extension/react-app/src/components/UserInputContainer.tsx
+++ b/extension/react-app/src/components/UserInputContainer.tsx
@@ -24,7 +24,11 @@ import {
 } from "@heroicons/react/24/outline";
 import { HistoryNode } from "../../../schema/HistoryNode";
 import { GUIClientContext } from "../App";
-import { getMetaKeyLabel, isMetaEquivalentKeyPressed } from "../util";
+import {
+  getFontSize,
+  getMetaKeyLabel,
+  isMetaEquivalentKeyPressed,
+} from "../util";
 import { RootStore } from "../redux/store";
 import { useSelector } from "react-redux";
 
@@ -91,8 +95,8 @@ const GradientBorder = styled.div<{
   background-size: 200% 200%;
 `;
 
-const StyledDiv = styled.div<{ editing: boolean }>`
-  font-size: 13px;
+const StyledDiv = styled.div<{ editing: boolean; fontSize?: number }>`
+  font-size: ${(props) => props.fontSize || getFontSize()}px;
   font-family: inherit;
   border-radius: ${defaultBorderRadius};
   height: auto;
@@ -204,6 +208,7 @@ const UserInputContainer = (props: UserInputContainerProps) => {
       borderRadius={defaultBorderRadius}
     >
       <StyledDiv
+        fontSize={getFontSize()}
         editing={isEditing}
         onMouseEnter={() => {
           setIsHovered(true);
-- 
cgit v1.2.3-70-g09d2

