Finish welcome modal

This commit is contained in:
David Ralph
2020-11-04 12:19:12 +00:00
parent 3b52010213
commit f6d8ccf6e7
10 changed files with 36 additions and 21 deletions

View File

@@ -1,5 +1,7 @@
import React from 'react';
import EmailIcon from '@material-ui/icons/Email';
import TwitterIcon from '@material-ui/icons/Twitter';
import ForumIcon from '@material-ui/icons/Forum';
export default class Welcome extends React.PureComponent {
render() {
@@ -7,17 +9,17 @@ export default class Welcome extends React.PureComponent {
<div className='welcomeContent'>
<span className='closeModal' onClick={this.props.modalClose}>&times;</span>
<div className='welcomeModalText'>
<h2 className='subtitle'>Welcome to</h2>
<h2 className='subtitle'>{this.props.language.title}</h2>
<h1 className='welcometitle'>Mue Tab</h1>
<img alt='celebration' style={{ 'height': '200px', 'width': 'auto' }} src='./././icons/undraw_celebration.svg' />
<h2 className='subtitle'>Information</h2>
<p>Thank you for downloading Mue Tab,<br/> we hope you enjoy your time with our extension.</p>
<h2 className='subtitle'>Support</h2>
{/* <img alt='twitter' href='https://twitter.com/getmue' className='icon' src=''/>
<img alt='discord' href='https://discord.gg/kJsufA9' className='icon' src=''/> */}
<EmailIcon />
<img alt='celebration' style={{ 'height': '200px', 'width': 'auto' }} draggable={false} src='./././icons/undraw_celebration.svg' />
<h2 className='subtitle'>{this.props.language.information}</h2>
<p>{this.props.language.thankyoumessage1},<br/> {this.props.language.thankyoumessage2}</p>
<h2 className='subtitle'>{this.props.language.support}</h2>
<a href='mailto:hello@muetab.com' className='welcomeLink' target='_blank' rel='noreferrer'><EmailIcon/></a>
<a href='https://twitter.com/getmue' className='welcomeLink' target='_blank' rel='noreferrer'><TwitterIcon/></a>
<a href='https://discord.gg/zv8C9F8' className='welcomeLink' target='_blank' rel='noreferrer'><ForumIcon/></a>
<br/>
<button className='close' onClick={this.props.modalClose}>Close</button>
<button className='close' onClick={this.props.modalClose}>{this.props.language.close}</button>
</div>
</div>
);

View File

@@ -25,11 +25,8 @@ export default class Settings extends React.PureComponent {
}
document.getElementById('file-input').onchange = (e) => { // import settings
const file = e.target.files[0];
if (file.type !== 'application/json') return console.error(`expected json, got ${file.type}`);
const reader = new FileReader();
reader.readAsText(file, 'UTF-8');
reader.readAsText(e.target.files[0], 'UTF-8');
reader.onload = (readerEvent) => {
const content = JSON.parse(readerEvent.target.result);
@@ -82,7 +79,7 @@ export default class Settings extends React.PureComponent {
<LanguageSettings language={this.props.language} />
<button className='apply' onClick={() => SettingsFunctions.saveStuff(this.props.language.background.disabled)}>{this.props.language.apply}</button>
<button className='reset' onClick={() => SettingsFunctions.setDefaultSettings()}>{this.props.language.reset}</button>
<button className='reset' onClick={() => SettingsFunctions.setDefaultSettings('reset')}>{this.props.language.reset}</button>
<button className='export' onClick={() => SettingsFunctions.exportSettings()}>{this.props.language.export}</button>
<button className='import' onClick={() => document.getElementById('file-input').click()}>{this.props.language.import}</button>
<input id='file-input' type='file' name='name' className='hidden' accept='application/json' />