diff --git a/app/assets/styles/blink/_NavigationBar.scss b/app/assets/styles/blink/_NavigationBar.scss
index 043f790..8c6ff3f 100644
--- a/app/assets/styles/blink/_NavigationBar.scss
+++ b/app/assets/styles/blink/_NavigationBar.scss
@@ -1,14 +1,19 @@
.titleContainer {
}
-.title {
+.subtitle {
color: white;
+ font-size: 16;
+ margin-right: 10px;
+
+}
+
+.title {
+ font-size: 20;
}
.logo {
- margin-top: 0px;
- margin-left: 0px;
- margin-right: 0px;
- height: 40px;
- width: 40px;
+ margin-left: 10px;
+ height: 35px;
+ width: 35px;
}
diff --git a/app/components/NavigationBar.js b/app/components/NavigationBar.js
index 6d0cfeb..b7dc526 100644
--- a/app/components/NavigationBar.js
+++ b/app/components/NavigationBar.js
@@ -1,138 +1,141 @@
import React, { Component } from 'react';
import { Linking, Image, View } from 'react-native';
import PropTypes from 'prop-types';
import autoBind from 'auto-bind';
import { Appbar, Menu, Divider, Text } from 'react-native-paper';
import { Icon } from 'material-bread';
import config from '../config';
import AboutModal from './AboutModal';
import CallMeMaybeModal from './CallMeMaybeModal';
import styles from '../assets/styles/blink/_NavigationBar.scss';
const blinkLogo = require('../assets/images/blink-white-big.png');
class NavigationBar extends Component {
constructor(props) {
super(props);
autoBind(this);
this.state = {
showAboutModal: false,
showCallMeMaybeModal: false,
mute: false,
menuVisible: false
}
this.menuRef = React.createRef();
}
handleMenu(event) {
this.callUrl = `${config.publicUrl}/call/${this.props.account.id}`;
switch (event) {
case 'about':
this.toggleAboutModal();
break;
case 'callMeMaybe':
this.toggleCallMeMaybeModal();
break;
case 'logOut':
this.props.logout();
break;
case 'preview':
this.props.preview();
break;
case 'settings':
Linking.openURL(config.serverSettingsUrl);
break;
default:
break;
}
this.setState({menuVisible: false});
}
toggleMute() {
this.setState(prevState => ({mute: !prevState.mute}));
this.props.toggleMute();
}
toggleAboutModal() {
this.setState({showAboutModal: !this.state.showAboutModal});
}
toggleCallMeMaybeModal() {
this.setState({showCallMeMaybeModal: !this.state.showCallMeMaybeModal});
}
render() {
const muteIcon = this.state.mute ? 'bell-off' : 'bell';
let statusIcon = null;
let account_id = '';
statusIcon = 'check-circle';
if (!this.props.connection || this.props.connection.state !== 'ready') {
statusIcon = 'error-outline';
} else if (this.props.registrationState && this.props.registrationState !== 'registered') {
statusIcon = 'priority-high';
}
//
let callUrl = '';
if (this.props.account) {
account_id = this.props.account.id;
callUrl = config.publicUrl + "/call/" + account_id;
}
-
return (
+ {account_id}
+
+
{statusIcon ?
: null }
);
}
}
NavigationBar.propTypes = {
notificationCenter : PropTypes.func.isRequired,
account : PropTypes.object.isRequired,
logout : PropTypes.func.isRequired,
preview : PropTypes.func.isRequired,
toggleMute : PropTypes.func.isRequired
};
export default NavigationBar;