From d9a4ed993aad36464776c093333af1a310e5a492 Mon Sep 17 00:00:00 2001
From: Nate Sesti <sestinj@gmail.com>
Date: Wed, 26 Jul 2023 00:47:32 -0700
Subject: fix colors and hover box behavior
---
extension/react-app/src/components/ComboBox.tsx | 10 +++++++---
extension/react-app/src/components/Onboarding.tsx | 13 +++----------
extension/react-app/src/components/PillButton.tsx | 2 +-
extension/react-app/src/pages/gui.tsx | 16 +++++++++++-----
4 files changed, 22 insertions(+), 19 deletions(-)
(limited to 'extension/react-app')
diff --git a/extension/react-app/src/components/ComboBox.tsx b/extension/react-app/src/components/ComboBox.tsx
index 4a1cdbc0..a14e2280 100644
--- a/extension/react-app/src/components/ComboBox.tsx
+++ b/extension/react-app/src/components/ComboBox.tsx
@@ -20,7 +20,10 @@ import { ContextItem } from "../../../schema/FullState";
import { postVscMessage } from "../vscode";
import { GUIClientContext } from "../App";
import { MeiliSearch } from "meilisearch";
-import { setBottomMessageCloseTimeout } from "../redux/slices/uiStateSlice";
+import {
+ setBottomMessage,
+ setBottomMessageCloseTimeout,
+} from "../redux/slices/uiStateSlice";
import { useDispatch } from "react-redux";
const SEARCH_INDEX_NAME = "continue_context_items";
@@ -307,13 +310,14 @@ const ComboBox = React.forwardRef((props: ComboBoxProps, ref) => {
},
onFocus: (e) => {
setFocused(true);
- dispatch(setBottomMessageCloseTimeout(undefined));
+ dispatch(setBottomMessage(undefined));
},
onBlur: (e) => {
setFocused(false);
postVscMessage("blurContinueInput", {});
},
onKeyDown: (event) => {
+ dispatch(setBottomMessage(undefined));
if (event.key === "Enter" && event.shiftKey) {
// Prevent Downshift's default 'Enter' behavior.
(event.nativeEvent as any).preventDownshiftDefault = true;
@@ -363,7 +367,7 @@ const ComboBox = React.forwardRef((props: ComboBoxProps, ref) => {
}
},
onClick: () => {
- dispatch(setBottomMessageCloseTimeout(undefined));
+ dispatch(setBottomMessage(undefined));
},
ref: inputRef,
})}
diff --git a/extension/react-app/src/components/Onboarding.tsx b/extension/react-app/src/components/Onboarding.tsx
index 231c1e93..6d0e0b28 100644
--- a/extension/react-app/src/components/Onboarding.tsx
+++ b/extension/react-app/src/components/Onboarding.tsx
@@ -1,5 +1,3 @@
-import { useSelector } from "react-redux";
-import { RootStore } from "../redux/store";
import React, { useState, useEffect } from "react";
import styled from "styled-components";
import { ArrowLeft, ArrowRight } from "@styled-icons/heroicons-outline";
@@ -14,6 +12,8 @@ const StyledDiv = styled.div`
height: 100%;
background-color: #1e1e1e;
z-index: 200;
+
+ color: white;
`;
const StyledSpan = styled.span`
@@ -38,7 +38,7 @@ const Onboarding = () => {
useEffect(() => {
const hasVisited = localStorage.getItem("hasVisited");
if (hasVisited) {
- setCounter(4);
+ setCounter(0);
} else {
setCounter(0);
localStorage.setItem("hasVisited", "true");
@@ -60,13 +60,6 @@ const Onboarding = () => {
alignItems: "center",
height: "100%",
textAlign: "center",
- background: `linear-gradient(
- 101.79deg,
- #12887a66 0%,
- #87245c66 32%,
- #e1263766 63%,
- #ffb21566 100%
- )`,
paddingLeft: "16px",
paddingRight: "16px",
}}
diff --git a/extension/react-app/src/components/PillButton.tsx b/extension/react-app/src/components/PillButton.tsx
index 548fdf9d..e3d05711 100644
--- a/extension/react-app/src/components/PillButton.tsx
+++ b/extension/react-app/src/components/PillButton.tsx
@@ -186,7 +186,7 @@ const PillButton = (props: PillButtonProps) => {
backgroundColor={"#cc000055"}
onClick={() => {
client?.deleteContextWithIds([props.item.description.id]);
- dispatch(setBottomMessageCloseTimeout(undefined));
+ dispatch(setBottomMessage(undefined));
}}
>
<Trash style={{ margin: "auto" }} width="1.6em"></Trash>
diff --git a/extension/react-app/src/pages/gui.tsx b/extension/react-app/src/pages/gui.tsx
index 5d893de9..9bb558c7 100644
--- a/extension/react-app/src/pages/gui.tsx
+++ b/extension/react-app/src/pages/gui.tsx
@@ -178,7 +178,7 @@ function GUI(props: GUIProps) {
) {
client?.deleteAtIndex(history.current_index);
} else if (e.key === "Escape") {
- dispatch(setBottomMessageCloseTimeout(undefined));
+ dispatch(setBottomMessage(undefined));
}
};
window.addEventListener("keydown", listener);
@@ -409,7 +409,7 @@ function GUI(props: GUIProps) {
borderRadius: defaultBorderRadius,
padding: "12px",
zIndex: 100,
- boxShadow: `0px 0px 6px 0px ${vscForeground}`,
+ boxShadow: `0px 0px 4px 0px ${vscForeground}`,
maxHeight: "50vh",
overflow: "scroll",
}}
@@ -419,11 +419,17 @@ function GUI(props: GUIProps) {
</div>
<Footer dataSwitchChecked={dataSwitchChecked}>
{vscMediaUrl && (
- <a href="https://github.com/continuedev/continue">
- <img src={`${vscMediaUrl}/continue-dev-square.png`} width="22px" />
+ <a
+ href="https://github.com/continuedev/continue"
+ style={{ marginRight: "auto" }}
+ >
+ <img
+ src={`${vscMediaUrl}/continue-dev-square.png`}
+ width="22px"
+ style={{ backgroundColor: "black", color: "red" }}
+ />
</a>
)}
- <p style={{ margin: "0", marginRight: "auto" }}>Continue</p>
<HeaderButtonWithText
onClick={() => {
// Show the dialog
--
cgit v1.2.3-70-g09d2