Skip to content

Instantly share code, notes, and snippets.

@belgamo
Created May 14, 2020 20:59
Show Gist options
  • Save belgamo/440095ae6d65f4f237141f35c2b8c1e0 to your computer and use it in GitHub Desktop.
Save belgamo/440095ae6d65f4f237141f35c2b8c1e0 to your computer and use it in GitHub Desktop.
import React from 'react';
import styled, {css} from 'styled-components/native';
import {Slider as DefaultSlider, SliderProps} from 'react-native-elements';
import {useTheme, px2ddp} from '@animavita/theme';
const StyledSlider = styled(DefaultSlider)``;
const Slider: React.FC<SliderProps> = ({...props}) => {
const theme = useTheme();
return (
<StyledSlider
minimumTrackTintColor={theme.styledTheme.greenLight}
maximumTrackTintColor={theme.styledTheme.greyLighter}
thumbTintColor={theme.styledTheme.greenLight}
thumbStyle={css`
width: ${px2ddp(7)},
height: ${px2ddp(7)},
border-color: ${theme.styledTheme.white},
border-width: ${px2ddp(3)}
`}
trackStyle={{
height: px2ddp(2.5),
borderRadius: px2ddp(2),
}}
{...props}
/>
);
};
export default Slider;
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment