Skip welcome & menu and move to editor
Welcome to JS Bin
File
Add library
Share
Login or Register
Blog
Help
Load cached copy from
  • Run with JS
  • Save
  • Share
  • …
 
<Modal style={styles.modal} swipeToClose={false} position={"center"} ref={"discardRankingModal"}>
  <View style={styles.modalBodyWrapper}>
    <Text style={{color: 'black', fontSize: 16}}>Pressing the Cancel button will discard the ranking. Continue?</Text>
  </View>
  <View style={styles.modalButtonsWrapper}>
    <TouchableWithoutFeedback onPress={this.modalPressNo}>
      <View style={styles.modalButtonCancel}>
        <Text style={styles.modalButtonCancelText}>Discard</Text>
      </View>
    </TouchableWithoutFeedback>
    <TouchableWithoutFeedback onPress={this.modalPressYes}>
      <View style={styles.modalButtonSave}>
        <Text style={styles.modalButtonSaveText}>Keep</Text>
      </View>
    </TouchableWithoutFeedback>
  </View>
</Modal>
 
modal: {
  height: 140,
    width: 270,
    backgroundColor: "#ffffff",
    borderRadius: 5
},
modalBodyWrapper: {
  height: 100,
    marginHorizontal: 15,
    justifyContent: 'center'
},
modalButtonsWrapper: {
  height: 40,
    flexDirection: 'row'
},
modalButtonCancel: {
  flex: 1,
    backgroundColor: '#e4e4e4',
    borderTopWidth: 1,
    borderBottomLeftRadius: 5,
    borderColor: '#cdcdcd',
    justifyContent: 'center',
    alignItems: 'center',
},
modalButtonSave: {
  flex: 1,
    borderTopWidth: 1,
    borderColor: '#3354c1',
    borderBottomRightRadius: 5,
    backgroundColor: '#395ed7',
    justifyContent: 'center',
    alignItems: 'center'
},
modalButtonSaveText: {
  color: 'white'
},
modalButtonCancelText: {
  color: '#8b8b8b'
}
 
​
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
anonymouspro
0viewers