mirror of
https://github.com/mue/mue.git
synced 2026-07-24 01:07:23 +02:00
style: Unified spacing to 2 and add editor config
This commit is contained in:
@@ -21,7 +21,7 @@ export default class Clock extends React.PureComponent {
|
||||
|
||||
// Percentage
|
||||
if (localStorage.getItem('percentageComplete') === 'true') {
|
||||
return this.setState({
|
||||
return this.setState({
|
||||
time: (now.getHours() / 24).toFixed(2).replace('0.', '') + '%'
|
||||
});
|
||||
}
|
||||
@@ -30,8 +30,8 @@ export default class Clock extends React.PureComponent {
|
||||
if (localStorage.getItem('analog') === 'true') {
|
||||
require('react-clock/dist/Clock.css'); // load analog clock css
|
||||
|
||||
this.setState({
|
||||
time: now
|
||||
this.setState({
|
||||
time: now
|
||||
});
|
||||
} else {
|
||||
// Default clock
|
||||
@@ -53,13 +53,13 @@ export default class Clock extends React.PureComponent {
|
||||
time = `${('00' + now.getHours()).slice(-2)}:${('00' + now.getMinutes()).slice(-2)}${sec}`;
|
||||
}
|
||||
|
||||
this.setState({
|
||||
time: time
|
||||
this.setState({
|
||||
time: time
|
||||
});
|
||||
} else {
|
||||
// 12 hour support
|
||||
let hours = now.getHours();
|
||||
|
||||
|
||||
if (hours > 12) {
|
||||
hours -= 12;
|
||||
}
|
||||
@@ -74,7 +74,7 @@ export default class Clock extends React.PureComponent {
|
||||
time = `${hours}:${now.getMinutes()}${sec}`;
|
||||
} else {
|
||||
time = `${('00' + hours).slice(-2)}:${('00' + now.getMinutes()).slice(-2)}${sec}`;
|
||||
}
|
||||
}
|
||||
|
||||
this.setState({
|
||||
time: time,
|
||||
@@ -93,7 +93,7 @@ export default class Clock extends React.PureComponent {
|
||||
|
||||
render() {
|
||||
let clockHTML = <h1 className='clock'>{this.state.time}<span className='ampm'>{this.state.ampm}</span></h1>;
|
||||
|
||||
|
||||
if (localStorage.getItem('analog') === 'true') {
|
||||
clockHTML = <Analog className='analogclock' value={this.state.time} renderHourMarks={false} renderMinuteMarks={false} />;
|
||||
}
|
||||
|
||||
@@ -32,24 +32,24 @@ export default class DateWidget extends React.PureComponent {
|
||||
day = dateYear;
|
||||
year = dateDay;
|
||||
break;
|
||||
default:
|
||||
default:
|
||||
break; // DMY
|
||||
}
|
||||
|
||||
let format;
|
||||
switch (localStorage.getItem('shortFormat')) {
|
||||
case 'dash':
|
||||
format = `${day}-${month}-${year}`;
|
||||
case 'dash':
|
||||
format = `${day}-${month}-${year}`;
|
||||
break;
|
||||
case 'gaps':
|
||||
format = `${day} - ${month} - ${year}`;
|
||||
case 'gaps':
|
||||
format = `${day} - ${month} - ${year}`;
|
||||
break;
|
||||
default:
|
||||
default:
|
||||
format = `${day}/${month}/${year}`;
|
||||
}
|
||||
|
||||
this.setState({
|
||||
date: format
|
||||
this.setState({
|
||||
date: format
|
||||
});
|
||||
} else {
|
||||
// Full date
|
||||
@@ -60,8 +60,8 @@ export default class DateWidget extends React.PureComponent {
|
||||
const month = date.toLocaleDateString(lang, { month: 'long' });
|
||||
const year = date.getFullYear();
|
||||
|
||||
this.setState({
|
||||
date: `${day} ${nth} ${month} ${year}`
|
||||
this.setState({
|
||||
date: `${day} ${nth} ${month} ${year}`
|
||||
});
|
||||
}
|
||||
}
|
||||
@@ -73,4 +73,4 @@ export default class DateWidget extends React.PureComponent {
|
||||
render() {
|
||||
return <span style={{ 'textTransform': 'capitalize', 'fontWeight': 'bold' }}>{this.state.date}</span>
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,24 +1,24 @@
|
||||
@import '../../../scss/variables';
|
||||
|
||||
.clock {
|
||||
font-size: 4em;
|
||||
margin: 0;
|
||||
font-size: 4em;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.ampm {
|
||||
font-size: 0.5em;
|
||||
font-size: 0.5em;
|
||||
}
|
||||
|
||||
.analogclock,
|
||||
.react-clock__face {
|
||||
margin: 0 auto;
|
||||
border-radius: 100%;
|
||||
box-shadow: inset 0 0 100px rgba(0, 0, 0, 0.3);
|
||||
border: none !important;
|
||||
border: 1px solid map-get($theme-colours, 'main') !important;
|
||||
margin: 0 auto;
|
||||
border-radius: 100%;
|
||||
box-shadow: inset 0 0 100px rgba(0, 0, 0, 0.3);
|
||||
border: none !important;
|
||||
border: 1px solid map-get($theme-colours, 'main') !important;
|
||||
}
|
||||
|
||||
.react-clock__hand__body {
|
||||
background: map-get($theme-colours, 'main') !important;
|
||||
box-shadow: 0 0 25px rgba(0, 0, 0, 0.3);
|
||||
}
|
||||
background: map-get($theme-colours, 'main') !important;
|
||||
box-shadow: 0 0 25px rgba(0, 0, 0, 0.3);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user