mirror of https://github.com/mue/mue.git
refactor: small styling changes and 7.0.1 start
This commit is contained in:
parent
de24d11463
commit
d482deccb4
4
LICENSE
4
LICENSE
|
@ -1,7 +1,7 @@
|
|||
BSD 3-Clause License
|
||||
|
||||
Copyright (c) 2023- Kaiso One Ltd
|
||||
Copyright (c) 2019-2023 The Mue Authors
|
||||
Copyright (c) 2023-2024 Kaiso One Ltd
|
||||
Copyright (c) 2019-2024 The Mue Authors
|
||||
Copyright (c) 2018-2019 David Ralph
|
||||
|
||||
All rights reserved.
|
||||
|
|
|
@ -48,7 +48,7 @@ Mue is a fast, open and free-to-use browser extension that gives a new, fresh an
|
|||
|
||||
### Planned Features
|
||||
|
||||
Please see our [roadmap](https://trello.com/b/w7zhS7Hi/mue-50).
|
||||
Please see our [roadmap](https://trello.com/b/w7zhS7Hi/mue-50). We are currently working on a rewrite over on the "phoenix" branch.
|
||||
|
||||
## Installation
|
||||
|
||||
|
@ -117,10 +117,3 @@ And finally, a big thank you to all the other [contributors](https://github.com/
|
|||
|
||||
[Pexels](https://pexels.com), [Unsplash](https://unsplash.com) - Stock photos used for offline mode <br/>
|
||||
[Undraw](https://undraw.co) - Welcome modal images
|
||||
|
||||
<p>This project is supported by:</p>
|
||||
<p>
|
||||
<a href="https://www.digitalocean.com/">
|
||||
<img src="https://opensource.nyc3.cdn.digitaloceanspaces.com/attribution/assets/SVG/DO_Logo_horizontal_blue.svg" width="201px">
|
||||
</a>
|
||||
</p>
|
||||
|
|
|
@ -9,7 +9,7 @@
|
|||
"homepage": "https://muetab.com",
|
||||
"bugs": "https://github.com/mue/mue/issues/new?assignees=&labels=bug&template=bug-report.md&title=%5BBUG%5D",
|
||||
"license": "BSD-3-Clause",
|
||||
"version": "7.0.0",
|
||||
"version": "7.0.1",
|
||||
"dependencies": {
|
||||
"@eartharoid/i18n": "1.2.1",
|
||||
"@emotion/react": "^11.11.3",
|
||||
|
|
|
@ -38,7 +38,7 @@ export default class App extends PureComponent {
|
|||
render() {
|
||||
return (
|
||||
<>
|
||||
{localStorage.getItem('background') === 'true' ? <Background /> : null}
|
||||
{localStorage.getItem('background') === 'true' && <Background />}
|
||||
<ToastContainer
|
||||
position="bottom-right"
|
||||
autoClose={localStorage.getItem('toastDisplayTime') || 2500}
|
||||
|
|
|
@ -77,9 +77,9 @@ export default class Modals extends PureComponent {
|
|||
render() {
|
||||
return (
|
||||
<>
|
||||
{this.state.welcomeModal === false ? (
|
||||
{this.state.welcomeModal === false && (
|
||||
<Navbar openModal={(modal) => this.toggleModal(modal, true)} />
|
||||
) : null}
|
||||
)}
|
||||
<Modal
|
||||
closeTimeoutMS={300}
|
||||
id="modal"
|
||||
|
@ -102,7 +102,7 @@ export default class Modals extends PureComponent {
|
|||
>
|
||||
<Welcome modalClose={() => this.closeWelcome()} modalSkip={() => this.previewWelcome()} />
|
||||
</Modal>
|
||||
{this.state.preview ? <Preview setup={() => window.location.reload()} /> : null}
|
||||
{this.state.preview && <Preview setup={() => window.location.reload()} />}
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
|
|
@ -109,22 +109,22 @@ class Item extends PureComponent {
|
|||
</div>
|
||||
<div className="itemPage">
|
||||
<div className="itemShowcase">
|
||||
{this.props.data.data.photos ? (
|
||||
{this.props.data.data.photos && (
|
||||
<div className="carousel">
|
||||
<div className="carousel_container">
|
||||
<ImageCarousel data={this.props.data.data.photos} />
|
||||
</div>
|
||||
</div>
|
||||
) : null}
|
||||
{this.props.data.data.settings ? (
|
||||
)}
|
||||
{this.props.data.data.settings && (
|
||||
<img
|
||||
alt="product"
|
||||
draggable={false}
|
||||
src={iconsrc}
|
||||
onClick={() => this.setState({ showLightbox: true })}
|
||||
/>
|
||||
) : null}
|
||||
{this.props.data.data.quotes ? (
|
||||
)}
|
||||
{this.props.data.data.quotes && (
|
||||
<>
|
||||
<table>
|
||||
<tbody>
|
||||
|
@ -156,8 +156,8 @@ class Item extends PureComponent {
|
|||
</span>
|
||||
</div>
|
||||
</>
|
||||
) : null}
|
||||
{this.props.data.data.settings ? (
|
||||
)}
|
||||
{this.props.data.data.settings && (
|
||||
<>
|
||||
<table>
|
||||
<tbody>
|
||||
|
@ -191,7 +191,7 @@ class Item extends PureComponent {
|
|||
</span>
|
||||
</div>
|
||||
</>
|
||||
) : null}
|
||||
)}
|
||||
<div>
|
||||
<p className="title">
|
||||
{variables.getMessage('modals.main.marketplace.product.description')}
|
||||
|
@ -223,7 +223,7 @@ class Item extends PureComponent {
|
|||
<span>{this.props.data.author}</span>
|
||||
</div>
|
||||
</div>
|
||||
{this.props.data.data.quotes ? (
|
||||
{this.props.data.data.quotes && (
|
||||
<div className="infoItem">
|
||||
<MdFormatQuote />
|
||||
<div className="text">
|
||||
|
@ -233,8 +233,8 @@ class Item extends PureComponent {
|
|||
<span>{this.props.data.data.quotes.length}</span>
|
||||
</div>
|
||||
</div>
|
||||
) : null}
|
||||
{this.props.data.data.photos ? (
|
||||
)}
|
||||
{this.props.data.data.photos && (
|
||||
<div className="infoItem">
|
||||
<MdImage />
|
||||
<div className="text">
|
||||
|
@ -244,7 +244,7 @@ class Item extends PureComponent {
|
|||
<span>{this.props.data.data.photos.length}</span>
|
||||
</div>
|
||||
</div>
|
||||
) : null}
|
||||
)}
|
||||
{this.props.data.data.quotes && this.props.data.data.language !== '' ? (
|
||||
<div className="infoItem">
|
||||
<MdTranslate />
|
||||
|
@ -312,7 +312,7 @@ class Item extends PureComponent {
|
|||
</button>
|
||||
</Tooltip>
|
||||
</div>
|
||||
{this.props.data.data.collection ? (
|
||||
{this.props.data.data.collection && (
|
||||
<div className="inCollection">
|
||||
<span className="subtitle">
|
||||
{variables.getMessage('modals.main.marketplace.product.part_of')}
|
||||
|
@ -320,7 +320,7 @@ class Item extends PureComponent {
|
|||
<span className="title">{this.props.data.data.collection}</span>
|
||||
<button>{variables.getMessage('modals.main.marketplace.product.explore')}</button>
|
||||
</div>
|
||||
) : null}
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -27,7 +27,7 @@ export default class Create extends PureComponent {
|
|||
{variables.getMessage('modals.main.addons.create.moved_description')}
|
||||
</span>
|
||||
<div className="createButtons">
|
||||
<button> {variables.getMessage('modals.main.addons.create.moved_button')}</button>
|
||||
<button>Coming soon...</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -395,7 +395,7 @@ class Marketplace extends PureComponent {
|
|||
</span>
|
||||
</div>
|
||||
<div className="headerExtras marketplaceCondition">
|
||||
{this.props.type !== 'collections' ? (
|
||||
{this.props.type !== 'collections' && (
|
||||
<div>
|
||||
<form className="marketplaceSearch">
|
||||
<input
|
||||
|
@ -412,7 +412,7 @@ class Marketplace extends PureComponent {
|
|||
<MdRefresh /> {variables.getMessage('widgets.navbar.tooltips.refresh')}
|
||||
</span>*/}
|
||||
</div>
|
||||
) : null}
|
||||
)}
|
||||
<Dropdown
|
||||
label={variables.getMessage('modals.main.addons.sort.title')}
|
||||
name="sortMarketplace"
|
||||
|
|
|
@ -66,11 +66,11 @@ class Dropdown extends PureComponent {
|
|||
{this.props.manual
|
||||
? this.props.children
|
||||
: this.props.children.map((e, index) => {
|
||||
return e ? (
|
||||
return e && (
|
||||
<MenuItem key={index} value={e.props ? e.props.value : ''}>
|
||||
{e.props ? e.props.children : ''}
|
||||
</MenuItem>
|
||||
) : null;
|
||||
);
|
||||
})}
|
||||
</Select>
|
||||
</FormControl>
|
||||
|
|
|
@ -10,7 +10,6 @@ import {
|
|||
} from 'react-icons/md';
|
||||
|
||||
import Slider from './Slider';
|
||||
import Switch from './Switch';
|
||||
import SettingsItem from './SettingsItem';
|
||||
import EventBus from 'modules/helpers/eventbus';
|
||||
|
||||
|
@ -53,7 +52,7 @@ class Header extends PureComponent {
|
|||
return (
|
||||
<>
|
||||
<div className="flexTopMarketplace topAddons">
|
||||
{this.props.backButton ? (
|
||||
{this.props.backButton && (
|
||||
<div className="returnButton" onClick={this.props.clickEffect}>
|
||||
<Tooltip
|
||||
title={variables.getMessage('modals.main.navbar.marketplace.product.buttons.back')}
|
||||
|
@ -62,7 +61,7 @@ class Header extends PureComponent {
|
|||
<MdArrowBack className="backArrow" />
|
||||
</Tooltip>
|
||||
</div>
|
||||
) : null}
|
||||
)}
|
||||
<span className="mainTitle">{this.props.title}</span>
|
||||
{this.props.switch && (
|
||||
<button
|
||||
|
@ -109,7 +108,7 @@ class Header extends PureComponent {
|
|||
<MdFlag /> {variables.getMessage('modals.main.settings.sections.header.report_issue')}
|
||||
</span>
|
||||
</div>
|
||||
{this.props.zoomSetting ? (
|
||||
{this.props.zoomSetting && (
|
||||
<SettingsItem
|
||||
title={variables.getMessage(
|
||||
'modals.main.settings.sections.appearance.accessibility.widget_zoom',
|
||||
|
@ -126,7 +125,7 @@ class Header extends PureComponent {
|
|||
category={this.props.zoomCategory || this.props.category}
|
||||
/>
|
||||
</SettingsItem>
|
||||
) : null}
|
||||
)}
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
|
|
@ -39,7 +39,7 @@ export default class AdvancedSettings extends PureComponent {
|
|||
>
|
||||
<Switch name="offlineMode" element=".other" />
|
||||
</SettingsItem>
|
||||
{localStorage.getItem('welcomePreview') !== 'true' ? (
|
||||
{localStorage.getItem('welcomePreview') !== 'true' && (
|
||||
<div className="settingsRow">
|
||||
<div className="content">
|
||||
<span className="title">
|
||||
|
@ -64,7 +64,7 @@ export default class AdvancedSettings extends PureComponent {
|
|||
</button>
|
||||
</div>
|
||||
</div>
|
||||
) : null}
|
||||
)}
|
||||
<SettingsItem
|
||||
title={variables.getMessage('modals.main.settings.sections.advanced.timezone.title')}
|
||||
subtitle={variables.getMessage(
|
||||
|
|
|
@ -132,14 +132,14 @@ export default class Changelog extends PureComponent {
|
|||
<h5>
|
||||
{this.state.author} • {this.state.date}
|
||||
</h5>
|
||||
{this.state.image ? (
|
||||
{this.state.image && (
|
||||
<img
|
||||
draggable={false}
|
||||
src={this.state.image}
|
||||
alt={this.state.title}
|
||||
className="updateImage"
|
||||
/>
|
||||
) : null}
|
||||
)}
|
||||
<div className="updateChangelog">{this.state.content}</div>
|
||||
<Modal
|
||||
closeTimeoutMS={100}
|
||||
|
|
|
@ -112,7 +112,7 @@ export default class Message extends PureComponent {
|
|||
</div>
|
||||
))}
|
||||
</div>
|
||||
{this.state.messages.length === 0 ? (
|
||||
{this.state.messages.length === 0 && (
|
||||
<div className="photosEmpty">
|
||||
<div className="emptyNewMessage">
|
||||
<MdOutlineTextsms />
|
||||
|
@ -128,7 +128,7 @@ export default class Message extends PureComponent {
|
|||
</button>
|
||||
</div>
|
||||
</div>
|
||||
) : null}
|
||||
)}
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
|
|
@ -56,7 +56,7 @@ function Navbar() {
|
|||
category="navbar"
|
||||
/>
|
||||
</SettingsItem>
|
||||
{showRefreshOptions ? (
|
||||
{showRefreshOptions && (
|
||||
<SettingsItem
|
||||
title={variables.getMessage('modals.main.settings.sections.appearance.navbar.refresh')}
|
||||
subtitle={variables.getMessage(
|
||||
|
@ -82,7 +82,7 @@ function Navbar() {
|
|||
</option>
|
||||
</Dropdown>
|
||||
</SettingsItem>
|
||||
) : null}
|
||||
)}
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
|
|
@ -39,7 +39,7 @@ export default class QuickLinks extends PureComponent {
|
|||
variables.stats.postEvent('feature', 'Quicklink delete');
|
||||
}
|
||||
|
||||
addLink(name, url, icon) {
|
||||
async addLink(name, url, icon) {
|
||||
const data = JSON.parse(localStorage.getItem('quicklinks'));
|
||||
|
||||
// regex: https://ihateregex.io/expr/url/
|
||||
|
@ -63,7 +63,7 @@ export default class QuickLinks extends PureComponent {
|
|||
}
|
||||
|
||||
data.push({
|
||||
name: name || url,
|
||||
name: name || await this.getTitle(url),
|
||||
url,
|
||||
icon: icon || '',
|
||||
key: Math.random().toString(36).substring(7) + 1,
|
||||
|
@ -89,10 +89,10 @@ export default class QuickLinks extends PureComponent {
|
|||
});
|
||||
}
|
||||
|
||||
editLink(og, name, url, icon) {
|
||||
async editLink(og, name, url, icon) {
|
||||
const data = JSON.parse(localStorage.getItem('quicklinks'));
|
||||
const dataobj = data.find((i) => i.key === og.key);
|
||||
dataobj.name = name || url;
|
||||
dataobj.name = name || await this.getTitle(url);
|
||||
dataobj.url = url;
|
||||
dataobj.icon = icon || '';
|
||||
|
||||
|
@ -105,6 +105,24 @@ export default class QuickLinks extends PureComponent {
|
|||
});
|
||||
}
|
||||
|
||||
async getTitle(url) {
|
||||
let title;
|
||||
try {
|
||||
let response = await fetch(url);
|
||||
if (response.redirected) {
|
||||
response = await fetch(response.url);
|
||||
}
|
||||
const html = await response.text();
|
||||
const parser = new DOMParser();
|
||||
const doc = parser.parseFromString(html, 'text/html');
|
||||
title = doc.title;
|
||||
} catch (e) {
|
||||
title = url;
|
||||
}
|
||||
|
||||
return title;
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
EventBus.on('refresh', (data) => {
|
||||
if (data === 'quicklinks') {
|
||||
|
@ -255,7 +273,7 @@ export default class QuickLinks extends PureComponent {
|
|||
</button>
|
||||
</SettingsItem>
|
||||
|
||||
{this.state.items.length === 0 ? (
|
||||
{this.state.items.length === 0 && (
|
||||
<div className="photosEmpty">
|
||||
<div className="emptyNewMessage">
|
||||
<MdLinkOff />
|
||||
|
@ -271,7 +289,7 @@ export default class QuickLinks extends PureComponent {
|
|||
</button>
|
||||
</div>
|
||||
</div>
|
||||
) : null}
|
||||
)}
|
||||
|
||||
<div className="messagesContainer" ref={this.quicklinksContainer}>
|
||||
{this.state.items.map((item) => quickLink(item))}
|
||||
|
|
|
@ -220,7 +220,7 @@ export default class QuoteSettings extends PureComponent {
|
|||
</Dropdown>
|
||||
</div>
|
||||
</div>
|
||||
{!this.state.sourceSection ? (
|
||||
{!this.state.sourceSection && (
|
||||
<>
|
||||
<SettingsItem
|
||||
title={variables.getMessage('modals.main.settings.sections.quote.buttons.title')}
|
||||
|
@ -291,7 +291,7 @@ export default class QuoteSettings extends PureComponent {
|
|||
/>
|
||||
</SettingsItem>
|
||||
</>
|
||||
) : null}
|
||||
)}
|
||||
{customSettings}
|
||||
</>
|
||||
);
|
||||
|
|
|
@ -67,7 +67,7 @@ export default class AdvancedSettings extends PureComponent {
|
|||
>
|
||||
<Switch name="offlineMode" element=".other" />
|
||||
</SettingsItem>
|
||||
{localStorage.getItem('welcomePreview') !== 'true' ? (
|
||||
{localStorage.getItem('welcomePreview') !== 'true' && (
|
||||
<div className="settingsRow">
|
||||
<div className="content">
|
||||
<span className="title">
|
||||
|
@ -92,7 +92,7 @@ export default class AdvancedSettings extends PureComponent {
|
|||
</button>
|
||||
</div>
|
||||
</div>
|
||||
) : null}
|
||||
)}
|
||||
<SettingsItem
|
||||
title={variables.getMessage('modals.main.settings.sections.advanced.timezone.title')}
|
||||
subtitle={variables.getMessage(
|
||||
|
|
|
@ -287,11 +287,11 @@ export default class BackgroundSettings extends PureComponent {
|
|||
onChange={(value) => this.setState({ backgroundType: value })}
|
||||
category="background"
|
||||
>
|
||||
{this.state.marketplaceEnabled ? (
|
||||
{this.state.marketplaceEnabled && (
|
||||
<option value="photo_pack">
|
||||
{variables.getMessage('modals.main.navbar.marketplace')}
|
||||
</option>
|
||||
) : null}
|
||||
)}
|
||||
<option value="api">
|
||||
{variables.getMessage('modals.main.settings.sections.background.type.api')}
|
||||
</option>
|
||||
|
@ -406,11 +406,11 @@ export default class BackgroundSettings extends PureComponent {
|
|||
onChange={(value) => this.setState({ backgroundType: value })}
|
||||
category="background"
|
||||
>
|
||||
{this.state.marketplaceEnabled ? (
|
||||
{this.state.marketplaceEnabled && (
|
||||
<option value="photo_pack">
|
||||
{variables.getMessage('modals.main.navbar.marketplace')}
|
||||
</option>
|
||||
) : null}
|
||||
)}
|
||||
<option value="api">
|
||||
{variables.getMessage('modals.main.settings.sections.background.type.api')}
|
||||
</option>
|
||||
|
@ -520,7 +520,7 @@ export default class BackgroundSettings extends PureComponent {
|
|||
)}
|
||||
</option>
|
||||
</Dropdown>
|
||||
{this.state.backgroundFilter !== 'none' ? (
|
||||
{this.state.backgroundFilter !== 'none' && (
|
||||
<Slider
|
||||
title={variables.getMessage(
|
||||
'modals.main.settings.sections.background.effects.filters.amount',
|
||||
|
@ -534,7 +534,7 @@ export default class BackgroundSettings extends PureComponent {
|
|||
category="background"
|
||||
element="#backgroundImage"
|
||||
/>
|
||||
) : null}
|
||||
)}
|
||||
</SettingsItem>
|
||||
) : null}
|
||||
</>
|
||||
|
|
|
@ -207,13 +207,13 @@ export default class ColourSettings extends PureComponent {
|
|||
colourSettings = (
|
||||
<>
|
||||
<div className="colourInput">{gradientInputs}</div>
|
||||
{!gradientHasMoreThanOneColour ? (
|
||||
{!gradientHasMoreThanOneColour && (
|
||||
<>
|
||||
<button type="button" className="add" onClick={this.addColour}>
|
||||
{variables.getMessage('modals.main.settings.sections.background.source.add_colour')}
|
||||
</button>
|
||||
</>
|
||||
) : null}
|
||||
)}
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
|
|
@ -227,8 +227,8 @@ export default class CustomSettings extends PureComponent {
|
|||
alt={'Custom background ' + (index || 0)}
|
||||
src={`${!this.videoCheck(url) ? this.state.customBackground[index] : ''}`}
|
||||
/>
|
||||
{this.videoCheck(url) ? <MdPersonalVideo className="customvideoicon" /> : null}
|
||||
{this.state.customBackground.length > 0 ? (
|
||||
{this.videoCheck(url) && <MdPersonalVideo className="customvideoicon" />}
|
||||
{this.state.customBackground.length > 0 && (
|
||||
<Tooltip
|
||||
title={variables.getMessage(
|
||||
'modals.main.settings.sections.background.source.remove',
|
||||
|
@ -238,7 +238,7 @@ export default class CustomSettings extends PureComponent {
|
|||
<MdCancel />
|
||||
</button>
|
||||
</Tooltip>
|
||||
) : null}
|
||||
)}
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
|
|
|
@ -154,11 +154,11 @@ function Tab({ label, currentTab, onClick, navbarTab }) {
|
|||
|
||||
return (
|
||||
<>
|
||||
{mue === true ? <span className="mainTitle">Mue</span> : null}
|
||||
{mue === true && <span className="mainTitle">Mue</span>}
|
||||
<button className={className} onClick={() => onClick(label)}>
|
||||
{icon} <span>{label}</span>
|
||||
</button>
|
||||
{divider === true ? <hr /> : null}
|
||||
{divider === true && <hr />}
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
|
|
@ -391,14 +391,14 @@ class WelcomeSections extends PureComponent {
|
|||
)}
|
||||
</span>
|
||||
</div>
|
||||
{this.state.importedSettings.length !== 0 ? (
|
||||
{this.state.importedSettings.length !== 0 && (
|
||||
<div className="toggle" onClick={() => this.props.switchTab(2)}>
|
||||
{variables.getMessage('modals.main.settings.sections.final.imported', {
|
||||
amount: this.state.importedSettings.length,
|
||||
})}{' '}
|
||||
{this.state.importedSettings.length}
|
||||
</div>
|
||||
) : null}
|
||||
)}
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
|
|
|
@ -26,12 +26,12 @@ export default class Widgets extends PureComponent {
|
|||
};
|
||||
// widgets we can re-order
|
||||
this.widgets = {
|
||||
time: this.enabled('time') ? <Clock /> : null,
|
||||
greeting: this.enabled('greeting') ? <Greeting /> : null,
|
||||
quote: this.enabled('quote') ? <Quote /> : null,
|
||||
date: this.enabled('date') ? <Date /> : null,
|
||||
time: this.enabled('time') && <Clock />,
|
||||
greeting: this.enabled('greeting') && <Greeting />,
|
||||
quote: this.enabled('quote') && <Quote />,
|
||||
date: this.enabled('date') && <Date />,
|
||||
quicklinks: this.enabled('quicklinksenabled') && this.online ? <QuickLinks /> : null,
|
||||
message: this.enabled('message') ? <Message /> : null,
|
||||
message: this.enabled('message') && <Message />,
|
||||
};
|
||||
}
|
||||
|
||||
|
@ -77,7 +77,7 @@ export default class Widgets extends PureComponent {
|
|||
) : (
|
||||
<div id="widgets">
|
||||
<Suspense fallback={<></>}>
|
||||
{this.enabled('searchBar') ? <Search /> : null}
|
||||
{this.enabled('searchBar') && <Search />}
|
||||
{this.state.order.map((element, key) => (
|
||||
<Fragment key={key}>{this.widgets[element]}</Fragment>
|
||||
))}
|
||||
|
|
|
@ -564,13 +564,13 @@ export default class Background extends PureComponent {
|
|||
}}
|
||||
id="backgroundImage"
|
||||
/>
|
||||
{this.state.photoInfo.credit !== '' ? (
|
||||
{this.state.photoInfo.credit !== '' && (
|
||||
<PhotoInformation
|
||||
info={this.state.photoInfo}
|
||||
api={this.state.currentAPI}
|
||||
url={this.state.url}
|
||||
/>
|
||||
) : null}
|
||||
)}
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
|
|
@ -201,7 +201,7 @@ function PhotoInformation({ info, url, api }) {
|
|||
{widgetStyle !== 'legacy' || other ? (
|
||||
<div
|
||||
className="photoInformation orHover"
|
||||
style={{ padding: widgetStyle === 'legacy' ? '20px' : null }}
|
||||
style={{ padding: widgetStyle === 'legacy' && '20px' }}
|
||||
onMouseEnter={() => setshowExtraInfo(true)}
|
||||
onMouseLeave={() => setshowExtraInfo(false)}
|
||||
>
|
||||
|
@ -210,7 +210,7 @@ function PhotoInformation({ info, url, api }) {
|
|||
<h1>{photoMap}</h1>
|
||||
{photoMap()}
|
||||
</div>
|
||||
{showingPhotoMap ? (
|
||||
{showingPhotoMap && (
|
||||
<div className="copyright">
|
||||
<a
|
||||
href="https://www.mapbox.com/about/maps/"
|
||||
|
@ -239,7 +239,7 @@ function PhotoInformation({ info, url, api }) {
|
|||
Improve this map{' '}
|
||||
</a>
|
||||
</div>
|
||||
) : null}
|
||||
)}
|
||||
<div className="photoInformation-content">
|
||||
<span className="title">
|
||||
{(showExtraInfo || other) && info.description
|
||||
|
@ -295,15 +295,15 @@ function PhotoInformation({ info, url, api }) {
|
|||
{width}x{height}
|
||||
</span>
|
||||
</div>
|
||||
{info.category ? (
|
||||
{info.category && (
|
||||
<div className="row" title={variables.getMessage('widgets.background.category')}>
|
||||
<Category />
|
||||
<span id="infoCategory">
|
||||
{info.category[0].toUpperCase() + info.category.slice(1)}
|
||||
</span>
|
||||
</div>
|
||||
) : null}
|
||||
{api ? (
|
||||
)}
|
||||
{api && (
|
||||
<div className="row" title={variables.getMessage('widgets.background.source')}>
|
||||
<Source />
|
||||
<span id="infoSource">
|
||||
|
@ -328,10 +328,10 @@ function PhotoInformation({ info, url, api }) {
|
|||
)}
|
||||
</span>
|
||||
</div>
|
||||
) : null}
|
||||
)}
|
||||
</div>
|
||||
<div className="buttons">
|
||||
{!info.offline ? (
|
||||
{!info.offline && (
|
||||
<Tooltip
|
||||
title={variables.getMessage('widgets.quote.share')}
|
||||
key="share"
|
||||
|
@ -339,7 +339,7 @@ function PhotoInformation({ info, url, api }) {
|
|||
>
|
||||
<Share onClick={() => openShareModal(true)} />
|
||||
</Tooltip>
|
||||
) : null}
|
||||
)}
|
||||
<Tooltip
|
||||
title={variables.getMessage('widgets.quote.favourite')}
|
||||
key="favourite"
|
||||
|
@ -352,7 +352,7 @@ function PhotoInformation({ info, url, api }) {
|
|||
photoURL={info.url}
|
||||
/>
|
||||
</Tooltip>
|
||||
{!info.offline ? (
|
||||
{!info.offline && (
|
||||
<Tooltip
|
||||
title={variables.getMessage('widgets.background.download')}
|
||||
key="download"
|
||||
|
@ -360,8 +360,8 @@ function PhotoInformation({ info, url, api }) {
|
|||
>
|
||||
<Download onClick={() => downloadImage(info)} />
|
||||
</Tooltip>
|
||||
) : null}
|
||||
{info.pun ? (
|
||||
)}
|
||||
{info.pun && (
|
||||
<Tooltip
|
||||
title={variables.getMessage('widgets.background.exclude')}
|
||||
key="exclude"
|
||||
|
@ -369,7 +369,7 @@ function PhotoInformation({ info, url, api }) {
|
|||
>
|
||||
<VisibilityOff onClick={() => openExcludeModal(true)} />
|
||||
</Tooltip>
|
||||
) : null}
|
||||
)}
|
||||
</div>
|
||||
</>
|
||||
) : null}
|
||||
|
|
|
@ -103,14 +103,14 @@ class Navbar extends PureComponent {
|
|||
{localStorage.getItem('view') === 'true' && backgroundEnabled ? (
|
||||
<Maximise fontSize={this.state.zoomFontSize} />
|
||||
) : null}
|
||||
{localStorage.getItem('notesEnabled') === 'true' ? (
|
||||
{localStorage.getItem('notesEnabled') === 'true' && (
|
||||
<Notes fontSize={this.state.zoomFontSize} />
|
||||
) : null}
|
||||
{localStorage.getItem('todoEnabled') === 'true' ? (
|
||||
)}
|
||||
{localStorage.getItem('todoEnabled') === 'true' && (
|
||||
<Todo fontSize={this.state.zoomFontSize} />
|
||||
) : null}
|
||||
)}
|
||||
|
||||
{this.refreshEnabled !== 'false' ? (
|
||||
{this.refreshEnabled !== 'false' && (
|
||||
<Tooltip
|
||||
title={variables.getMessage('widgets.navbar.tooltips.refresh')}
|
||||
subtitle={this.state.refreshText}
|
||||
|
@ -123,7 +123,7 @@ class Navbar extends PureComponent {
|
|||
<MdRefresh className="refreshicon topicons" />
|
||||
</button>
|
||||
</Tooltip>
|
||||
) : null}
|
||||
)}
|
||||
<Tooltip
|
||||
title={variables.getMessage('modals.main.navbar.settings', {
|
||||
type: variables.getMessage(
|
||||
|
|
|
@ -470,13 +470,12 @@ export default class Quote extends PureComponent {
|
|||
{this.state.author !== '' ? (
|
||||
<div className="author-content" ref={this.quoteauthor}>
|
||||
<span className="title">{this.state.author}</span>
|
||||
{this.state.authorOccupation !== 'Unknown' ? (
|
||||
{this.state.authorOccupation !== 'Unknown' && (
|
||||
<span className="subtitle">{this.state.authorOccupation}</span>
|
||||
) : null}
|
||||
)}
|
||||
<span className="author-license">
|
||||
{this.state.authorimglicense
|
||||
? this.state.authorimglicense.replace(' undefined. ', ' ')
|
||||
: null}
|
||||
{this.state.authorimglicense &&
|
||||
this.state.authorimglicense.replace(' undefined. ', ' ')}
|
||||
</span>
|
||||
</div>
|
||||
) : (
|
||||
|
|
|
@ -249,7 +249,7 @@ export default class Search extends PureComponent {
|
|||
</div>
|
||||
<div>
|
||||
{localStorage.getItem('searchDropdown') === 'true' &&
|
||||
this.state.searchDropdown === true ? (
|
||||
this.state.searchDropdown === true && (
|
||||
<div className="searchDropdown">
|
||||
{searchEngines.map(({ name }, key) => {
|
||||
return (
|
||||
|
@ -275,7 +275,7 @@ export default class Search extends PureComponent {
|
|||
{customText}
|
||||
</span>
|
||||
</div>
|
||||
) : null}
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
|
|
@ -27,7 +27,7 @@ function Expanded({ state, weatherType, variables }) {
|
|||
{variables.getMessage('widgets.weather.extra_information')}
|
||||
</span>
|
||||
)}
|
||||
{enabled('cloudiness') ? (
|
||||
{enabled('cloudiness') && (
|
||||
<Tooltip
|
||||
title={variables.getMessage(
|
||||
'modals.main.settings.sections.weather.extra_info.cloudiness',
|
||||
|
@ -39,8 +39,8 @@ function Expanded({ state, weatherType, variables }) {
|
|||
{state.weather.cloudiness}%
|
||||
</span>
|
||||
</Tooltip>
|
||||
) : null}
|
||||
{enabled('windspeed') ? (
|
||||
)}
|
||||
{enabled('windspeed') && (
|
||||
<Tooltip
|
||||
title={variables.getMessage(
|
||||
'modals.main.settings.sections.weather.extra_info.wind_speed',
|
||||
|
@ -51,15 +51,15 @@ function Expanded({ state, weatherType, variables }) {
|
|||
<WiWindy className="weatherIcon" />
|
||||
{state.weather.wind_speed}
|
||||
<span className="minmax">m/s</span>{' '}
|
||||
{enabled('windDirection') ? (
|
||||
{enabled('windDirection') && (
|
||||
<div style={{ fontSize: '25px', display: 'grid' }}>
|
||||
<WindDirectionIcon className="weatherIcon" degrees={state.weather.wind_degrees} />
|
||||
</div>
|
||||
) : null}
|
||||
)}
|
||||
</span>
|
||||
</Tooltip>
|
||||
) : null}
|
||||
{enabled('atmosphericpressure') ? (
|
||||
)}
|
||||
{enabled('atmosphericpressure') && (
|
||||
<Tooltip
|
||||
title={variables.getMessage(
|
||||
'modals.main.settings.sections.weather.extra_info.atmospheric_pressure',
|
||||
|
@ -72,8 +72,8 @@ function Expanded({ state, weatherType, variables }) {
|
|||
<span className="minmax">hPa</span>
|
||||
</span>
|
||||
</Tooltip>
|
||||
) : null}
|
||||
{enabled('weatherdescription') ? (
|
||||
)}
|
||||
{enabled('weatherdescription') && (
|
||||
<Tooltip
|
||||
title={variables.getMessage(
|
||||
'modals.main.settings.sections.weather.extra_info.weather_description',
|
||||
|
@ -85,8 +85,8 @@ function Expanded({ state, weatherType, variables }) {
|
|||
{state.weather.description}
|
||||
</span>
|
||||
</Tooltip>
|
||||
) : null}
|
||||
{enabled('visibility') ? (
|
||||
)}
|
||||
{enabled('visibility') && (
|
||||
<Tooltip
|
||||
title={variables.getMessage(
|
||||
'modals.main.settings.sections.weather.extra_info.visibility',
|
||||
|
@ -100,8 +100,8 @@ function Expanded({ state, weatherType, variables }) {
|
|||
})}
|
||||
</span>
|
||||
</Tooltip>
|
||||
) : null}
|
||||
{enabled('humidity') ? (
|
||||
)}
|
||||
{enabled('humidity') && (
|
||||
<Tooltip
|
||||
title={variables.getMessage('modals.main.settings.sections.weather.extra_info.humidity')}
|
||||
placement="left"
|
||||
|
@ -111,7 +111,7 @@ function Expanded({ state, weatherType, variables }) {
|
|||
{state.weather.humidity}
|
||||
</span>
|
||||
</Tooltip>
|
||||
) : null}
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
|
|
@ -135,9 +135,9 @@ export default class Weather extends PureComponent {
|
|||
<span className="loc">{this.state.location}</span>
|
||||
</div>
|
||||
)}
|
||||
{weatherType >= 3 ? (
|
||||
{weatherType >= 3 && (
|
||||
<Expanded weatherType={weatherType} state={this.state} variables={variables} />
|
||||
) : null}
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
|
|
@ -52,7 +52,7 @@ function WindDirectionIcon({ degrees }) {
|
|||
const direction =
|
||||
directions[Math.round(((degrees %= 360) < 0 ? degrees + 360 : degrees) / 45) % 8];
|
||||
|
||||
return direction ? direction.icon : null;
|
||||
return direction && direction.icon;
|
||||
}
|
||||
|
||||
WindDirectionIcon.propTypes = {
|
||||
|
|
|
@ -26,11 +26,11 @@ export const REPO_NAME = 'mue';
|
|||
export const EMAIL = 'hello@muetab.com';
|
||||
export const TWITTER_HANDLE = 'getmue';
|
||||
export const DISCORD_SERVER = 'zv8C9F8';
|
||||
export const COPYRIGHT_NAME = 'The Mue Authors';
|
||||
export const COPYRIGHT_NAME = 'The Mue Authors & Kaiso One Ltd';
|
||||
export const COPYRIGHT_YEAR = '2018';
|
||||
export const COPYRIGHT_LICENSE = 'BSD-3-Clause License';
|
||||
export const OPENCOLLECTIVE_USERNAME = 'mue';
|
||||
|
||||
export const OFFLINE_IMAGES = 20;
|
||||
|
||||
export const VERSION = '7.0.0';
|
||||
export const VERSION = '7.0.1';
|
||||
|
|
Loading…
Reference in New Issue