From 7207da47c790aab81f59e777b9d02769b46fb7f4 Mon Sep 17 00:00:00 2001
From: Nate Sesti <sestinj@gmail.com>
Date: Thu, 6 Jul 2023 12:39:17 -0700
Subject: details

---
 extension/react-app/src/components/ComboBox.tsx           | 10 ++++------
 extension/react-app/src/components/ContinueButton.tsx     | 12 ++----------
 extension/react-app/src/components/PillButton.tsx         |  4 +++-
 extension/react-app/src/components/UserInputContainer.tsx |  3 ++-
 4 files changed, 11 insertions(+), 18 deletions(-)

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

diff --git a/extension/react-app/src/components/ComboBox.tsx b/extension/react-app/src/components/ComboBox.tsx
index af673b42..b825dc2a 100644
--- a/extension/react-app/src/components/ComboBox.tsx
+++ b/extension/react-app/src/components/ComboBox.tsx
@@ -22,7 +22,7 @@ import {
 import { HighlightedRangeContext } from "../../../schema/FullState";
 
 // #region styled components
-const mainInputFontSize = 16;
+const mainInputFontSize = 13;
 
 const EmptyPillDiv = styled.div`
   padding: 8px;
@@ -64,7 +64,6 @@ const MainTextInput = styled.textarea`
   padding: 8px;
   font-size: ${mainInputFontSize}px;
   font-family: inherit;
-  border: 1px solid transparent;
   border-radius: ${defaultBorderRadius};
   margin: 8px auto;
   height: auto;
@@ -74,8 +73,7 @@ const MainTextInput = styled.textarea`
   z-index: 1;
 
   &:focus {
-    outline: 1px solid #ff000066;
-    border: 1px solid transparent;
+    outline: 1px solid ${lightGray};
   }
 `;
 
@@ -191,7 +189,7 @@ const ComboBox = React.forwardRef((props: ComboBoxProps, ref) => {
   return (
     <>
       <div className="px-2 flex gap-2 items-center flex-wrap mt-2">
-        {highlightedCodeSections.length > 1 && (
+        {/* {highlightedCodeSections.length > 1 && (
           <>
             <HeaderButtonWithText
               text="Clear Context"
@@ -204,7 +202,7 @@ const ComboBox = React.forwardRef((props: ComboBoxProps, ref) => {
               <Trash size="1.6em" />
             </HeaderButtonWithText>
           </>
-        )}
+        )} */}
         {highlightedCodeSections.map((section, idx) => (
           <PillButton
             editing={section.editing}
diff --git a/extension/react-app/src/components/ContinueButton.tsx b/extension/react-app/src/components/ContinueButton.tsx
index 462f2b46..72f6dcd2 100644
--- a/extension/react-app/src/components/ContinueButton.tsx
+++ b/extension/react-app/src/components/ContinueButton.tsx
@@ -10,20 +10,12 @@ let StyledButton = styled(Button)`
   display: grid;
   grid-template-columns: 30px 1fr;
   align-items: center;
-  background: linear-gradient(
-    95.23deg,
-    #be1a55 14.44%,
-    rgba(203, 27, 90, 0.4) 82.21%
-  );
+  background: #be1b55;
 
   &:hover {
     transition-delay: 0.5s;
     transition-property: "background";
-    background: linear-gradient(
-      45deg,
-      #be1a55 14.44%,
-      rgba(203, 27, 90, 0.4) 82.21%
-    );
+    opacity: 0.8;
   }
 `;
 
diff --git a/extension/react-app/src/components/PillButton.tsx b/extension/react-app/src/components/PillButton.tsx
index a384832e..31d98c0f 100644
--- a/extension/react-app/src/components/PillButton.tsx
+++ b/extension/react-app/src/components/PillButton.tsx
@@ -127,7 +127,9 @@ const PillButton = (props: PillButtonProps) => {
         {props.title}
       </Button>
       <StyledTooltip id={`edit-${props.index}`}>
-        {props.editing ? "Editing this range" : "Edit this range"}
+        {props.editing
+          ? "Editing this range (with rest of file as context)"
+          : "Edit this range"}
       </StyledTooltip>
       <StyledTooltip id={`delete-${props.index}`}>Delete</StyledTooltip>
     </>
diff --git a/extension/react-app/src/components/UserInputContainer.tsx b/extension/react-app/src/components/UserInputContainer.tsx
index f51f0cb5..0ff3e74f 100644
--- a/extension/react-app/src/components/UserInputContainer.tsx
+++ b/extension/react-app/src/components/UserInputContainer.tsx
@@ -1,7 +1,7 @@
 import React from "react";
 import ReactMarkdown from "react-markdown";
 import styled from "styled-components";
-import { buttonColor, secondaryDark } from ".";
+import { buttonColor, secondaryDark, vscBackground } from ".";
 import HeaderButtonWithText from "./HeaderButtonWithText";
 import { Play, XMark } from "@styled-icons/heroicons-outline";
 import { RootStore } from "../redux/store";
@@ -22,6 +22,7 @@ const StyledDiv = styled.div`
   font-size: 13px;
   display: flex;
   align-items: center;
+  border-bottom: 1px solid ${vscBackground};
 `;
 
 const UserInputContainer = (props: UserInputContainerProps) => {
-- 
cgit v1.2.3-70-g09d2