feat: experimental settings, reduce image size on about page and use local mue icon

This commit is contained in:
David Ralph
2021-03-31 21:54:16 +01:00
parent a5b2dd39cb
commit 7cf65d07c8
7 changed files with 52 additions and 8 deletions

View File

@@ -62,7 +62,7 @@ export default class About extends React.PureComponent {
return (
<>
<h2>{this.language.title}</h2>
<img draggable='false' style={{'height': '100px', 'width': 'auto'}} src='https://raw.githubusercontent.com/mue/branding/master/logo/logo_horizontal.png' alt='Mue logo'></img>
<img draggable='false' style={{'height': '100px', 'width': 'auto'}} src='./././icons/logo_horizontal.png' alt='Mue logo'></img>
<p>{this.language.copyright} 2018-{new Date().getFullYear()} Mue Tab (BSD-3 License)</p>
<p>{this.language.version.title} {window.constants.VERSION} ({this.state.update})</p>
<h3>{this.language.resources_used.title}</h3>
@@ -73,20 +73,20 @@ export default class About extends React.PureComponent {
{this.state.loading}
{this.state.contributors.map((item) =>
<Tooltip title={item.login} placement='top' key={item.login}>
<a href={'https://github.com/' + item.login} target='_blank' rel='noopener noreferrer'><img draggable='false' className='abouticon' src={item.avatar_url + '&size=256'} alt={item.login}></img></a>
<a href={'https://github.com/' + item.login} target='_blank' rel='noopener noreferrer'><img draggable='false' className='abouticon' src={item.avatar_url + '&size=128'} alt={item.login}></img></a>
</Tooltip>
)}
{ // for those who contributed without opening a pull request
this.state.other_contributors.map((item) =>
<Tooltip title={item.login} placement='top' key={item.login}>
<a href={'https://github.com/' + item.login} target='_blank' rel='noopener noreferrer'><img draggable='false' className='abouticon' src={item.avatar_url + '&size=256'} alt={item.login}></img></a>
<a href={'https://github.com/' + item.login} target='_blank' rel='noopener noreferrer'><img draggable='false' className='abouticon' src={item.avatar_url + '&size=128'} alt={item.login}></img></a>
</Tooltip>
)}
<h3>{this.language.supporters}</h3>
{this.state.loading}
{this.state.sponsors.map((item) =>
<Tooltip title={item.handle} placement='top' key={item.handle}>
<a href={item.profile} target='_blank' rel='noopener noreferrer'><img draggable='false' className='abouticon' src={item.avatar + '&size=256'} alt={item.handle}></img></a>
<a href={item.profile} target='_blank' rel='noopener noreferrer'><img draggable='false' className='abouticon' src={item.avatar + '&size=128'} alt={item.handle}></img></a>
</Tooltip>
)}
</>

View File

@@ -58,7 +58,6 @@ export default function AppearanceSettings() {
</Dropdown>
<h3>{appearance.accessibility.title}</h3>
<Checkbox name='animations' text={appearance.animations} betaFeature={true} />
{(engineName === 'Blink') ?
<Slider title={appearance.accessibility.widget_zoom} name='widgetzoom' default='100' min='50' max='200' display='%'/>
: null}

View File

@@ -1,9 +1,28 @@
import React from 'react';
import Checkbox from '../Checkbox';
//import Text from '../Text';
export default function ExperimentalSettings() {
const { experimental } = window.language.modals.main.settings.sections;
return (
<>
<p>Coming soon...</p>
<h2>{experimental.title}</h2>
<p>{experimental.warning}</p>
<Checkbox name='animations' text={window.language.modals.main.settings.sections.appearance.animations}/>
<h3>{experimental.developer}</h3>
<Checkbox name='debug' text='Debug hotkey (Ctrl + #)'/>
{/* <Checkbox name='beta' text='Beta Mode Override'/>
<Text name='api_override' title='Version Override (format example: 5.0)'/>
<Text name='api_override' title='API URL Override'/>
<Text name='marketplace_override' title='Marketplace URL Override'/>
<Text name='unsplash_override' title='Unsplash URL Override'/>
<Text name='sponsors_override' title='Sponsors URL Override'/>
<Text name='github_override' title='GitHub URL Override'/>
<br/><br/>
*/}
<button className='reset' style={{'marginLeft': '0px'}} onClick={() => localStorage.clear()}>Clear LocalStorage</button>
</>
);
}