diff --git a/app/assets/styles/blink/_ConferenceModal.scss b/app/assets/styles/blink/_ConferenceModal.scss index 3521125..a405d5f 100644 --- a/app/assets/styles/blink/_ConferenceModal.scss +++ b/app/assets/styles/blink/_ConferenceModal.scss @@ -1,16 +1,25 @@ .container { - padding: 30px; - margin: 30px; + padding: 5px; + margin: 10px; + flex-direction: column; + justify-content: center; + align-items: center; } .title { padding: 5px; - font-size: 20px; + font-size: 24px; text-align: center; } .body { padding: 10px; - font-size: 16px; - text-align: center; + font-size: 18px; + width: 100%; +} + +.button { + margin-top: 20px; + margin-bottom: 15px; + width: 200; } diff --git a/app/components/ConferenceModal.js b/app/components/ConferenceModal.js index 3e52d0c..6991971 100644 --- a/app/components/ConferenceModal.js +++ b/app/components/ConferenceModal.js @@ -1,80 +1,80 @@ import React, { Component } from 'react'; import PropTypes from 'prop-types'; import { Portal, Dialog, Button, Text, TextInput, Surface } from 'react-native-paper'; import KeyboardAwareDialog from './KeyBoardAwareDialog'; const DialogType = Platform.OS === 'ios' ? KeyboardAwareDialog : Dialog; import config from '../config'; import styles from '../assets/styles/blink/_ConferenceModal.scss'; class ConferenceModal extends Component { constructor(props) { super(props); this.state = { conferenceTargetUri: props.targetUri.split('@')[0], managed: false }; this.handleConferenceTargetChange = this.handleConferenceTargetChange.bind(this); this.onHide = this.onHide.bind(this); this.join = this.join.bind(this); } componentWillReceiveProps(nextProps) { this.setState({conferenceTargetUri: nextProps.targetUri.split('@')[0]}); } handleConferenceTargetChange(value) { this.setState({conferenceTargetUri: value}); } join(event) { event.preventDefault(); const uri = `${this.state.conferenceTargetUri.replace(/[\s()-]/g, '')}@${config.defaultConferenceDomain}`; this.props.handleConferenceCall(uri.toLowerCase(), this.state.managed); } onHide() { this.props.handleConferenceCall(null); } render() { const validUri = this.state.conferenceTargetUri.length > 0 && this.state.conferenceTargetUri.indexOf('@') === -1; return ( Join Conference - Enter the room you wish to join + + >Join ); } } ConferenceModal.propTypes = { show: PropTypes.bool.isRequired, handleConferenceCall: PropTypes.func.isRequired, targetUri: PropTypes.string.isRequired }; export default ConferenceModal;