Beispiel #1
0
export const dismemberStyle = (style?: StyleProp<ViewStyle>): { wrapperStyle: ViewStyle; innerStyle: ViewStyle; } => {
  const flattenStyle: ViewStyle & { [key: string]: any } = StyleSheet.flatten(style)
  const wrapperStyle: ViewStyle & { [key: string]: any } = {}
  const innerStyle: ViewStyle & { [key: string]: any } = {}
  if (flattenStyle) {
    Object.keys(flattenStyle).forEach((key: string) => {
      if (SYNC_TYPE_STYLE_REGEX.test(key)) {
        wrapperStyle[key] = flattenStyle[key]
        innerStyle[key] = flattenStyle[key]
      } else if (WRAPPER_TYPE_STYLE_REGEX.test(key)) {
        wrapperStyle[key] = flattenStyle[key]
      } else {
        innerStyle[key] = flattenStyle[key]
      }
    })
  }
  return {
    wrapperStyle,
    innerStyle
  }
}
import { StyleSheet } from 'react-native'

export default StyleSheet.create({
  container: {
    flex: 1,
  },
})
import { colors, screenWidth } from "../styles";
import {
  StyleSheet,
} from 'react-native';
let textColor = colors.white;

export const tutorialStyle = StyleSheet.create({
header: {
    color: textColor.hex,
    fontSize: 25,
    fontWeight:'800'
},
text: {
    color: textColor.hex,
    fontSize: 16,
    textAlign:'center',
    fontWeight:'500'
},
subText: {
    color: textColor.rgba(0.5),
    fontSize: 13,
},
explanation: {
    width: screenWidth,
    color: textColor.rgba(0.5),
    fontSize: 13,
    textAlign:'center'
}
});
Beispiel #4
0
export default StyleSheet.create({
  wrapper: {
    width: '100%',
    borderColor: '#e0e0e0',
    height: AUDIO_HEIGHT,
    borderWidth: 1,
    borderRadius: 2,
    backgroundColor: 'white'
  },
  container: {
    flexDirection: 'row',
    paddingHorizontal: 8,
    width: '100%',
  },
  progressBar: {
    width: '100%',
    height: PROGRESS_BAR_HEIGHT,
    backgroundColor: '#c9c9c9'
  },
  progressBarTint: {
    height: PROGRESS_BAR_HEIGHT,
    backgroundColor: '#09BB07'
  },
  poster: {
    width: AUDIO_HEIGHT - 2 - PROGRESS_BAR_HEIGHT,
    height: AUDIO_HEIGHT - 2 - PROGRESS_BAR_HEIGHT,
    backgroundColor: '#e6e6e6'
  },
  posterImg: {
    width: '100%',
    height: '100%',
    justifyContent: 'center',
    alignItems: 'center',
  },
  playIcon: {
    textAlign: 'center',
  },
  info: {
    flex: 1,
    flexDirection: 'row',
    justifyContent: 'space-between',
    paddingVertical: 6,
    paddingHorizontal: 14,
    height: AUDIO_HEIGHT - 2 - PROGRESS_BAR_HEIGHT,
  },
  detail: {
    justifyContent: 'center'
  },
  name: {
  },
  nameText: {
    fontSize: 13,
    color: '#353535'
  },
  author: {
    marginTop: 9
  },
  authorText: {
    fontSize: 12,
    color: '#888'
  },
  time: {
  },
  timeText: {
    fontSize: 10,
    color: '#888'
  }
})
Beispiel #5
0
import { StyleSheet } from 'react-native';
import { colors, LightTheme, dimensions } from './lightTheme';

const darkColors = {
  ...colors,
  background: '#343a40',
  foreground: '#ffffff',
};

export const darkTheme = StyleSheet.create(
  new LightTheme(darkColors, dimensions),
);
 export function create<T>(style: T): T {
     removeDisplay(style);
     return StyleSheet.create(style);
 }
} from 'react-native';
import {colors} from "../../styles";

export const WNStyles = StyleSheet.create({
  important: {
    fontSize: 14,
    fontWeight:'bold',
    color: colors.red.hex,
    textAlign:'center'
  },
  text: {
    fontSize: 15,
    fontWeight:'bold',
    color: colors.csBlue.hex,
    textAlign:'center'
  },
  detail: {
    fontSize: 13,
    color: colors.csBlue.rgba(0.75),
    textAlign:'center'
  },
  innerScrollView: {
    alignItems: 'center',
    paddingBottom: 50,
    paddingLeft: 10,
    paddingRight: 10,
  },
  outerScrollView: {
  },
});
Beispiel #8
0
      ...buttonPadding,
      ...this.borderGrayLight,
    };

    this.buttonDisabled = {
      opacity: 0.5,
    };

    this.validationError = {
      ...this.textSmall,
      color: colors.danger,
      fontWeight: 'bold',
      minHeight: typography.lineHeight,
    };

    this.marginStartAuto = {
      marginStart: 'auto',
    };

    this.label = {
      ...this.textSmall,
      color: colors.gray,
      padding: typography.lineHeight / 6,
      textTransform: 'uppercase',
    };
  }
}

export const lightTheme = StyleSheet.create(new LightTheme(colors, dimensions));
export type Theme = typeof lightTheme;
Beispiel #9
0
export default StyleSheet.create({
  safeAreaView: {
    flex: 1,
    backgroundColor: bg,
  },
  scrollView: {
    flex: 1,
  },
  safeAreaViewBlack: {
    flex: 1,
    backgroundColor: "black",
  },
  scrollViewNotBlack: {
    flex: 1,
    backgroundColor: bg,
  },
  viewAppleBar: {
    padding: 16,
  },
  viewAppleBarContent: {
    paddingBottom: 8,
    borderBottomWidth: 1,
    borderBottomColor: elBg,
  },
  viewAppleBarRow: {
    flexDirection: "row",
  },
  viewMotd: {
    margin: 16,
    backgroundColor: elBg,
    padding: 16,
    borderRadius: 16,
    shadowRadius: 6,
    shadowOffset: {
      width: 0,
      height: 4,
    },
    shadowOpacity: 0.1,
  },
  viewAnimeList: {
    paddingTop: 16,
  },
  viewEpisodeList: {
    flex: 1,
    width: "100%",
  },
});
export const topBarStyle = StyleSheet.create({
  topBar: {
    backgroundColor: colors.menuBackground.hex,
    flexDirection: 'row',
    paddingTop: statusBarHeight
  },
  topBarCenterView: {
    flex: 1,
    alignItems: 'center',
    justifyContent: 'center',
  },
  topBarLeft: {
    textAlign: 'left',
  },
  topBarLeftTouch: {
    // backgroundColor:'#ff0',
    height:barHeight,
    width:80,
    paddingLeft: 10,
    alignItems:'flex-start',
    justifyContent:'center'
  },
  topBarRightTouch: {
    // backgroundColor:'#ff0',
    height:barHeight,
    width:80,
    paddingRight: 10,
  },
  topBarCenter: {
    textAlign: 'center',
  },
  topBarRight: {
    textAlign: 'right',
  },
  titleText: {
    fontSize: 18,
    color: 'white'
  },
  text:{
    fontSize: 17,
    fontWeight:'bold',
    color: colors.menuTextSelected.hex
  }
});
export default StyleSheet.create({
  modalContainer: {
    alignSelf: 'center',
    backgroundColor: '#FFFFFF',
    borderRadius: 3,
    marginHorizontal: 25,
    maxWidth: 300,
  },
  textContainer: {
    paddingHorizontal: 20,
    paddingTop: 20,
  },
  title: {
    marginBottom: 3,
    textAlign: 'center',
  },
  countdown: {
    fontSize: 30,
    textAlign: 'center',
  },
  subtitle: {
    marginBottom: 12,
    textAlign: 'center',
  },
  btnRow: {
    flexDirection: 'row',
  },
  modalBtn: {
    alignItems: 'center',
    width: '50%',
  },
  modalBtnText: {
    color: '#007AFF',
    paddingVertical: 10,
  },
})