diff options
| -rw-r--r-- | gui/src/renderer/components/AdvancedSettings.tsx | 5 | ||||
| -rw-r--r-- | gui/src/renderer/components/Cell.tsx | 12 | ||||
| -rw-r--r-- | gui/src/renderer/components/Preferences.tsx | 14 |
3 files changed, 22 insertions, 9 deletions
diff --git a/gui/src/renderer/components/AdvancedSettings.tsx b/gui/src/renderer/components/AdvancedSettings.tsx index be1dd6b104..b3a24a95bd 100644 --- a/gui/src/renderer/components/AdvancedSettings.tsx +++ b/gui/src/renderer/components/AdvancedSettings.tsx @@ -15,7 +15,6 @@ import { TitleBarItem, } from './NavigationBar'; import SettingsHeader, { HeaderTitle } from './SettingsHeader'; -import Switch from './Switch'; const MIN_MSSFIX_VALUE = 1000; const MAX_MSSFIX_VALUE = 1450; @@ -107,7 +106,7 @@ export default class AdvancedSettings extends Component<IProps, IState> { <Cell.Container> <Cell.Label>{pgettext('advanced-settings-view', 'Enable IPv6')}</Cell.Label> - <Switch isOn={this.props.enableIpv6} onChange={this.props.setEnableIpv6} /> + <Cell.Switch isOn={this.props.enableIpv6} onChange={this.props.setEnableIpv6} /> </Cell.Container> <Cell.Footer> {pgettext( @@ -120,7 +119,7 @@ export default class AdvancedSettings extends Component<IProps, IState> { <Cell.Label textStyle={styles.advanced_settings__block_when_disconnected_label}> {pgettext('advanced-settings-view', 'Block when disconnected')} </Cell.Label> - <Switch + <Cell.Switch isOn={this.props.blockWhenDisconnected} onChange={this.props.setBlockWhenDisconnected} /> diff --git a/gui/src/renderer/components/Cell.tsx b/gui/src/renderer/components/Cell.tsx index b108708934..126bcf63d0 100644 --- a/gui/src/renderer/components/Cell.tsx +++ b/gui/src/renderer/components/Cell.tsx @@ -2,6 +2,7 @@ import * as React from 'react'; import { Button, Component, Styles, Text, TextInput, Types, View } from 'reactxp'; import { colors } from '../../config.json'; import ImageView from './ImageView'; +import { default as SwitchControl } from './Switch'; const styles = { cellButton: { @@ -62,6 +63,9 @@ const styles = { color: colors.white, }), }, + switch: Styles.createViewStyle({ + flex: 0, + }), input: { frame: Styles.createViewStyle({ flexGrow: 0, @@ -222,6 +226,14 @@ export function Label(props: ILabelProps) { ); } +export const Switch = function CellSwitch(props: SwitchControl['props']) { + return ( + <View style={styles.switch}> + <SwitchControl {...props} /> + </View> + ); +}; + interface InputFrameProps { children?: React.ReactNode; style?: Types.StyleRuleSetRecursive<Types.ViewStyleRuleSet>; diff --git a/gui/src/renderer/components/Preferences.tsx b/gui/src/renderer/components/Preferences.tsx index 9804a1c953..a3a1140253 100644 --- a/gui/src/renderer/components/Preferences.tsx +++ b/gui/src/renderer/components/Preferences.tsx @@ -12,7 +12,6 @@ import { } from './NavigationBar'; import styles from './PreferencesStyles'; import SettingsHeader, { HeaderTitle } from './SettingsHeader'; -import Switch from './Switch'; export interface IPreferencesProps { autoStart: boolean; @@ -59,13 +58,16 @@ export default class Preferences extends Component<IPreferencesProps> { <Cell.Label> {pgettext('preferences-view', 'Launch app on start-up')} </Cell.Label> - <Switch isOn={this.props.autoStart} onChange={this.onChangeAutoStart} /> + <Cell.Switch isOn={this.props.autoStart} onChange={this.onChangeAutoStart} /> </Cell.Container> <View style={styles.preferences__separator} /> <Cell.Container> <Cell.Label>{pgettext('preferences-view', 'Auto-connect')}</Cell.Label> - <Switch isOn={this.props.autoConnect} onChange={this.props.setAutoConnect} /> + <Cell.Switch + isOn={this.props.autoConnect} + onChange={this.props.setAutoConnect} + /> </Cell.Container> <Cell.Footer> {pgettext( @@ -78,7 +80,7 @@ export default class Preferences extends Component<IPreferencesProps> { <Cell.Label> {pgettext('preferences-view', 'Local network sharing')} </Cell.Label> - <Switch isOn={this.props.allowLan} onChange={this.props.setAllowLan} /> + <Cell.Switch isOn={this.props.allowLan} onChange={this.props.setAllowLan} /> </Cell.Container> <Cell.Footer> {pgettext( @@ -126,7 +128,7 @@ class MonochromaticIconToggle extends Component<IMonochromaticIconProps> { <View> <Cell.Container> <Cell.Label>{pgettext('preferences-view', 'Monochromatic tray icon')}</Cell.Label> - <Switch isOn={this.props.monochromaticIcon} onChange={this.props.onChange} /> + <Cell.Switch isOn={this.props.monochromaticIcon} onChange={this.props.onChange} /> </Cell.Container> <Cell.Footer> {pgettext( @@ -155,7 +157,7 @@ class StartMinimizedToggle extends Component<IStartMinimizedProps> { <View> <Cell.Container> <Cell.Label>{pgettext('preferences-view', 'Start minimized')}</Cell.Label> - <Switch isOn={this.props.startMinimized} onChange={this.props.onChange} /> + <Cell.Switch isOn={this.props.startMinimized} onChange={this.props.onChange} /> </Cell.Container> <Cell.Footer> {pgettext('preferences-view', 'Show only the tray icon when the app starts.')} |