summaryrefslogtreecommitdiffhomepage
path: root/gui/src/renderer/components/MultiButton.tsx
diff options
context:
space:
mode:
authorOskar <oskar@mullvad.net>2024-08-21 17:08:37 +0200
committerOskar <oskar@mullvad.net>2024-08-21 17:08:37 +0200
commit0cc9684200426eef11b65cf8373d29eddf8aa90e (patch)
tree68dc1c457f693035ea26b723414b7cd2a28958e3 /gui/src/renderer/components/MultiButton.tsx
parentb26659e05b50c3a1b0499620f683748287707769 (diff)
parent6ceed1dffca2fc0c4b867fe60638db5bf29f1065 (diff)
downloadmullvadvpn-0cc9684200426eef11b65cf8373d29eddf8aa90e.tar.xz
mullvadvpn-0cc9684200426eef11b65cf8373d29eddf8aa90e.zip
Merge branch 'implement-feature-indicators-in-main-view-des-910'
Diffstat (limited to 'gui/src/renderer/components/MultiButton.tsx')
-rw-r--r--gui/src/renderer/components/MultiButton.tsx18
1 files changed, 10 insertions, 8 deletions
diff --git a/gui/src/renderer/components/MultiButton.tsx b/gui/src/renderer/components/MultiButton.tsx
index e1fa3d379e..3129abcbb2 100644
--- a/gui/src/renderer/components/MultiButton.tsx
+++ b/gui/src/renderer/components/MultiButton.tsx
@@ -1,9 +1,7 @@
import React from 'react';
import styled from 'styled-components';
-import * as AppButton from './AppButton';
-
-const SIDE_BUTTON_WIDTH = 50;
+const SIDE_BUTTON_WIDTH = 44;
const ButtonRow = styled.div({
display: 'flex',
@@ -22,19 +20,23 @@ const SideButton = styled.button({
borderTopLeftRadius: 0,
borderBottomLeftRadius: 0,
width: SIDE_BUTTON_WIDTH,
- alignItems: 'center',
- marginLeft: 1,
+ marginLeft: '1px !important',
});
+export interface MultiButtonCompatibleProps {
+ className?: string;
+ textOffset?: number;
+}
+
interface IMultiButtonProps {
- mainButton: React.ComponentType<AppButton.IProps>;
- sideButton: React.ComponentType<AppButton.IProps>;
+ mainButton: React.ComponentType<MultiButtonCompatibleProps>;
+ sideButton: React.ComponentType<MultiButtonCompatibleProps>;
}
export function MultiButton(props: IMultiButtonProps) {
return (
<ButtonRow>
- <MainButton as={props.mainButton} textOffset={SIDE_BUTTON_WIDTH} />
+ <MainButton as={props.mainButton} textOffset={SIDE_BUTTON_WIDTH + 1} />
<SideButton as={props.sideButton} />
</ButtonRow>
);