diff --git a/Changelog.md b/Changelog.md index 755368c4e..5958d26dc 100644 --- a/Changelog.md +++ b/Changelog.md @@ -44,6 +44,8 @@ including any Neptune Notebook instances you have. row [#657](https://github.com/aws/graph-explorer/pull/657) - **Improved** style for the sidebar buttons [#651](https://github.com/aws/graph-explorer/pull/651) +- **Improved** styles in the context menu to be easier to read + ([#670](https://github.com/aws/graph-explorer/pull/670)) - **Improved** Docker image size, reducing it by 196 MB ([#619](https://github.com/aws/graph-explorer/pull/619)) - **Improved** query when searching across all node types @@ -63,7 +65,8 @@ including any Neptune Notebook instances you have. remaining in the image ([#616](https://github.com/aws/graph-explorer/pull/616)) - **Fixed** minor layout issue on connections screen - ([#648](https://github.com/aws/graph-explorer/pull/648)) + ([#648](https://github.com/aws/graph-explorer/pull/648), + [#670](https://github.com/aws/graph-explorer/pull/670)) - **Updated** multiple dependencies ([#611](https://github.com/aws/graph-explorer/pull/611), [#614](https://github.com/aws/graph-explorer/pull/614), diff --git a/packages/graph-explorer/src/modules/AvailableConnections/AvailableConnections.tsx b/packages/graph-explorer/src/modules/AvailableConnections/AvailableConnections.tsx index c852cb4d2..14c42f151 100644 --- a/packages/graph-explorer/src/modules/AvailableConnections/AvailableConnections.tsx +++ b/packages/graph-explorer/src/modules/AvailableConnections/AvailableConnections.tsx @@ -201,7 +201,7 @@ function ConfigRow({ className="bg-background-secondary hover:ring-primary-dark has-[:checked]:ring-primary-dark flex items-center gap-4 rounded-lg px-3 py-1.5 ring-1 ring-transparent transition-shadow duration-200 hover:cursor-pointer hover:ring-1" onClick={() => !isDisabled && makeSelected()} > - +
{config.displayLabel || config.id} diff --git a/packages/graph-explorer/src/modules/GraphViewer/GraphViewer.tsx b/packages/graph-explorer/src/modules/GraphViewer/GraphViewer.tsx index 8b65ec2e9..b6c00c52b 100644 --- a/packages/graph-explorer/src/modules/GraphViewer/GraphViewer.tsx +++ b/packages/graph-explorer/src/modules/GraphViewer/GraphViewer.tsx @@ -326,7 +326,7 @@ function Legend({ onClose }: { onClose: () => void }) { return (
diff --git a/packages/graph-explorer/src/modules/GraphViewer/internalComponents/ContextMenu.styles.ts b/packages/graph-explorer/src/modules/GraphViewer/internalComponents/ContextMenu.styles.ts index 2b6acafea..6bffea23f 100644 --- a/packages/graph-explorer/src/modules/GraphViewer/internalComponents/ContextMenu.styles.ts +++ b/packages/graph-explorer/src/modules/GraphViewer/internalComponents/ContextMenu.styles.ts @@ -15,7 +15,7 @@ const defaultStyles: ThemeStyleFn = ({ theme }) => css` .title { font-weight: ${theme.typography.weight?.bold}; - font-size: ${theme.typography.sizes.xs}; + font-size: ${theme.typography.sizes.base}; padding: ${theme.spacing.base} ${theme.spacing["4x"]}; } @@ -26,21 +26,21 @@ const defaultStyles: ThemeStyleFn = ({ theme }) => css` } background: ${fade(theme.palette.primary.main, 0.3)}; } - font-size: ${theme.typography.sizes.xs}; + font-size: ${theme.typography.sizes.base}; .content { min-height: 28px; - height: 28px; + height: 32px; padding-right: ${theme.spacing["2x"]}; } .list-item-chip { - font-size: ${theme.typography.sizes.xs}; + font-size: ${theme.typography.sizes.base}; height: 16px; } .start-adornment { - font-size: ${theme.typography.sizes.base}; + font-size: ${theme.typography.sizes.xl}; color: ${theme.palette.text.disabled}; margin: 0; } diff --git a/packages/graph-explorer/src/modules/GraphViewer/internalComponents/ContextMenu.tsx b/packages/graph-explorer/src/modules/GraphViewer/internalComponents/ContextMenu.tsx index f3971a577..d626e3a73 100644 --- a/packages/graph-explorer/src/modules/GraphViewer/internalComponents/ContextMenu.tsx +++ b/packages/graph-explorer/src/modules/GraphViewer/internalComponents/ContextMenu.tsx @@ -24,6 +24,7 @@ import { useDisplayNames, useEntities, useTranslations } from "@/hooks"; import useGraphGlobalActions from "../useGraphGlobalActions"; import defaultStyles from "./ContextMenu.styles"; import { EdgeId, VertexId } from "@/@types/entities"; +import { MinusCircleIcon } from "lucide-react"; export type ContextMenuProps = { className?: string; @@ -213,7 +214,7 @@ const ContextMenu = ({ onClick={openSidebarPanel("details")} startAdornment={} > - Details Panel + Details panel } > - Expand Panel + Expand panel } > - Customize Panel + Customize panel
} + startAdornment={} > - Remove {t("graph-viewer.node")} from canvas + Remove {t("graph-viewer.node").toLowerCase()} from view
diff --git a/packages/graph-explorer/src/modules/SearchSidebar/NodeSearchResult.tsx b/packages/graph-explorer/src/modules/SearchSidebar/NodeSearchResult.tsx index 331f8e375..9afad10c3 100644 --- a/packages/graph-explorer/src/modules/SearchSidebar/NodeSearchResult.tsx +++ b/packages/graph-explorer/src/modules/SearchSidebar/NodeSearchResult.tsx @@ -56,7 +56,7 @@ export function NodeSearchResult({ node }: { node: Vertex }) {
@@ -66,7 +66,7 @@ export function NodeSearchResult({ node }: { node: Vertex }) { variant="text" onPress={removeFromGraph} > - Remove from graph + Remove node from view ) : ( )}