From 2375ca5ff9b054d5128d5e4fc8507f925b25aebf Mon Sep 17 00:00:00 2001 From: Nate Sesti Date: Tue, 25 Jul 2023 17:30:12 -0700 Subject: updating ui to match config-py branch --- extension/media/continue-dev-square.png | Bin 0 -> 36355 bytes extension/package-lock.json | 4 +- extension/package.json | 4 +- extension/react-app/public/continue-dev-square.png | Bin 0 -> 36355 bytes extension/react-app/src/components/ComboBox.tsx | 17 +++----- .../react-app/src/components/ContinueButton.tsx | 5 ++- extension/react-app/src/index.css | 4 ++ extension/react-app/src/pages/gui.tsx | 43 ++++++--------------- extension/src/debugPanel.ts | 1 + 9 files changed, 30 insertions(+), 48 deletions(-) create mode 100644 extension/media/continue-dev-square.png create mode 100644 extension/react-app/public/continue-dev-square.png diff --git a/extension/media/continue-dev-square.png b/extension/media/continue-dev-square.png new file mode 100644 index 00000000..e4b62556 Binary files /dev/null and b/extension/media/continue-dev-square.png differ diff --git a/extension/package-lock.json b/extension/package-lock.json index 6020e303..28b15e01 100644 --- a/extension/package-lock.json +++ b/extension/package-lock.json @@ -1,12 +1,12 @@ { "name": "continue", - "version": "0.0.196", + "version": "0.0.197", "lockfileVersion": 2, "requires": true, "packages": { "": { "name": "continue", - "version": "0.0.196", + "version": "0.0.197", "license": "Apache-2.0", "dependencies": { "@electron/rebuild": "^3.2.10", diff --git a/extension/package.json b/extension/package.json index ddd5b89e..80807d41 100644 --- a/extension/package.json +++ b/extension/package.json @@ -14,7 +14,7 @@ "displayName": "Continue", "pricing": "Free", "description": "The open-source coding autopilot", - "version": "0.0.196", + "version": "0.0.197", "publisher": "Continue", "engines": { "vscode": "^1.67.0" @@ -157,7 +157,7 @@ { "id": "continue", "title": "Continue ", - "icon": "react-app/dist/play_button.png" + "icon": "react-app/dist/continue-dev-square.png" } ] }, diff --git a/extension/react-app/public/continue-dev-square.png b/extension/react-app/public/continue-dev-square.png new file mode 100644 index 00000000..e4b62556 Binary files /dev/null and b/extension/react-app/public/continue-dev-square.png differ diff --git a/extension/react-app/src/components/ComboBox.tsx b/extension/react-app/src/components/ComboBox.tsx index 1e2ca135..bf07cb93 100644 --- a/extension/react-app/src/components/ComboBox.tsx +++ b/extension/react-app/src/components/ComboBox.tsx @@ -68,7 +68,7 @@ const Ul = styled.ul<{ ${(props) => props.showAbove ? `transform: translateY(-${props.ulHeightPixels + 8}px);` - : `transform: translateY(${2 * mainInputFontSize}px);`} + : `transform: translateY(${5 * mainInputFontSize}px);`} position: absolute; background: ${vscBackground}; color: ${vscForeground}; @@ -79,15 +79,9 @@ const Ul = styled.ul<{ padding: 0; ${({ hidden }) => hidden && "display: none;"} border-radius: ${defaultBorderRadius}; - outline: 0.5px solid gray; + outline: 1px solid ${lightGray}; z-index: 2; - // Get rid of scrollbar and its padding - scrollbar-width: none; -ms-overflow-style: none; - &::-webkit-scrollbar { - width: 0px; - background: transparent; /* make scrollbar transparent */ - } `; const Li = styled.li<{ @@ -95,14 +89,15 @@ const Li = styled.li<{ selected: boolean; isLastItem: boolean; }>` - background-color: ${vscBackground}; - ${({ highlighted }) => highlighted && "background: #ff000066;"} + background-color: ${({ highlighted }) => + highlighted ? lightGray : secondaryDark}; + ${({ highlighted }) => highlighted && `background: ${vscBackground};`} ${({ selected }) => selected && "font-weight: bold;"} padding: 0.5rem 0.75rem; display: flex; flex-direction: column; ${({ isLastItem }) => isLastItem && "border-bottom: 1px solid gray;"} - border-top: 1px solid gray; + /* border-top: 1px solid gray; */ cursor: pointer; `; diff --git a/extension/react-app/src/components/ContinueButton.tsx b/extension/react-app/src/components/ContinueButton.tsx index d7739b20..6d753988 100644 --- a/extension/react-app/src/components/ContinueButton.tsx +++ b/extension/react-app/src/components/ContinueButton.tsx @@ -26,7 +26,8 @@ function ContinueButton(props: { onClick?: () => void; hidden?: boolean }) { return ( ); } diff --git a/extension/react-app/src/index.css b/extension/react-app/src/index.css index bac7fe97..68f9d0ab 100644 --- a/extension/react-app/src/index.css +++ b/extension/react-app/src/index.css @@ -25,3 +25,7 @@ body { margin: 0px; height: 100%; } + +.press-start-2p { + font-family: "Press Start 2P", "Lexend", sans-serif; +} diff --git a/extension/react-app/src/pages/gui.tsx b/extension/react-app/src/pages/gui.tsx index 49f41dcf..70031d40 100644 --- a/extension/react-app/src/pages/gui.tsx +++ b/extension/react-app/src/pages/gui.tsx @@ -64,6 +64,9 @@ function GUI(props: GUIProps) { const vscMachineId = useSelector( (state: RootStore) => state.config.vscMachineId ); + const vscMediaUrl = useSelector( + (state: RootStore) => state.config.vscMediaUrl + ); const [dataSwitchChecked, setDataSwitchChecked] = useState(false); const dataSwitchOn = useSelector( (state: RootStore) => state.config.dataSwitchOn @@ -395,37 +398,15 @@ function GUI(props: GUIProps) {