imterah/element-portable
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Linting. Finally set up my linter properly

Browse source
This commit is contained in:
Jorik Schellekens 2020-04-16 11:56:43 +01:00
parent 66fd0f707f
commit f1130ecba1
4 changed files with 29 additions and 28 deletions
Download patch file Download diff file Expand all files Collapse all files

28
src/components/structures/FontSlider.js
View file

@ -18,8 +18,8 @@ import React from 'react';
import PropTypes from 'prop-types';
export default class Slider extends React.Component {
static propTypes = {
// A callback for the new value onclick
updateFontSize: PropTypes.func,
@ -32,41 +32,41 @@ export default class Slider extends React.Component {
// A function for formatting the the values
displayFunc: PropTypes.func,
};
render() {
let dots = this.props.values.map(v =>
<Dot active={v<=this.props.value}
label={this.props.displayFunc(v)}
const dots = this.props.values.map(v =>
<Dot active={v<=this.props.value}
label={this.props.displayFunc(v)}
onClick={() => this.props.updateFontSize(v)}
key={v}
/>);
let offset = this.offset(this.props.values, this.props.value);
const offset = this.offset(this.props.values, this.props.value);
return <div className="mx_fontSlider">
<div>
<div className="mx_fontSlider_bar">
<hr />
<div className="mx_fontSlider_selection">
<div className="mx_fontSlider_selectionDot" style={{left: "calc(-0.55rem + " + offset + "%"}} />
<hr style={{width: offset + "%"}}/>
<div className="mx_fontSlider_selectionDot" style={{left: "calc(-0.55rem + " + offset + "%)"}} />
<hr style={{width: offset + "%"}} />
</div>
</div>
<div className="mx_fontSlider_dotContainer">
{dots}
</div>
</div>
</div>
</div>;
}
offset(values, value) {
return (value - values[0]) / (values[values.length - 1] - values[0]) * 100;
return (value - values[0]) / (values[values.length - 1] - values[0]) * 100;
}
}
class Dot extends React.Component {
static propTypes = {
// Callback for behaviour onclick
onClick: PropTypes.func,
@ -78,14 +78,14 @@ class Dot extends React.Component {
label: PropTypes.string,
}
render () {
let className = "mx_fontSlider_dot" + (this.props.active? " mx_fontSlider_dotActive": "");
render() {
const className = "mx_fontSlider_dot" + (this.props.active? " mx_fontSlider_dotActive": "");
return <span onClick={this.props.onClick} className="mx_fontSlider_dotValue">
<div className={className} />
<div>
{this.props.label}
</div>
</span>
</span>;
}
}
}