diff --git a/stylesheets/_session.scss b/stylesheets/_session.scss index a594052e0..45bf13b71 100644 --- a/stylesheets/_session.scss +++ b/stylesheets/_session.scss @@ -1095,6 +1095,7 @@ input { flex-direction: column; margin: $session-margin-sm; align-items: flex-start; + min-width: 10vw; position: relative; .onion__node { diff --git a/ts/components/dialog/OnionStatusPathDialog.tsx b/ts/components/dialog/OnionStatusPathDialog.tsx index 9a84f5589..8b3624a2e 100644 --- a/ts/components/dialog/OnionStatusPathDialog.tsx +++ b/ts/components/dialog/OnionStatusPathDialog.tsx @@ -19,6 +19,8 @@ import { Flex } from '../basic/Flex'; import { SessionIcon, SessionIconButton } from '../session/icon'; import { SessionSpinner } from '../session/SessionSpinner'; import { SessionWrapperModal } from '../session/SessionWrapperModal'; +// tslint:disable-next-line: no-submodule-imports +import useHover from 'react-use/lib/useHover'; export type StatusLightType = { glowStartDelay: number; @@ -26,6 +28,25 @@ export type StatusLightType = { color?: string; }; +const OnionCountryDisplay = ({ + index, + labelText, + snodeIp, +}: { + snodeIp?: string; + labelText: string; + index: number; +}) => { + const element = (hovered: boolean) => ( +