-
diff --git a/src/components/Settings.jsx b/src/components/Settings.jsx
index 07243db1..314cb4e7 100644
--- a/src/components/Settings.jsx
+++ b/src/components/Settings.jsx
@@ -1,3 +1,4 @@
+// eslint-disable
import React from 'react';
import ExpandMore from '@material-ui/icons/ExpandMore';
@@ -25,31 +26,24 @@ export default class Settings extends React.Component {
localStorage.setItem('blur', document.getElementById('blurRange').value); // this is better than inline onChange for performance
localStorage.setItem('greetingName', document.getElementById('greetingName').value);
localStorage.setItem('customBackground', document.getElementById('customBackground').value);
- if (!document.getElementById('customBackgroundColour').enabled === 'false') localStorage.setItem('customBackgroundColour', document.getElementById('customBackgroundColour').value);
+ //if (!document.getElementById('customBackgroundColour').enabled === 'false') localStorage.setItem('customBackgroundColour', document.getElementById('customBackgroundColour').value);
window.location.reload();
}
resetItem(key) {
switch (key) {
- case 'greetingName':
- localStorage.setItem('greetingName', '');
- document.getElementById('greetingName').value = '';
- break;
+ case 'greetingName': document.getElementById('greetingName').value = ''; break;
case 'customBackgroundColour':
localStorage.setItem('customBackgroundColour', '');
document.getElementById('customBackgroundColour').enabled = 'false';
break;
- case 'customBackground':
- localStorage.setItem('customBackground', '');
- document.getElementById('customBackground').value = '';
- break;
+ case 'customBackground': document.getElementById('customBackground').value = ''; break;
case 'blur':
localStorage.setItem('blur', 0);
document.getElementById('blurRange').value = 0;
document.getElementById('blurAmount').innerText = '0';
break;
- default:
- console.log('[ERROR] resetItem requires a key!');
+ default: console.log('[ERROR] resetItem requires a key!');
}
this.showToast();
}
@@ -63,6 +57,12 @@ export default class Settings extends React.Component {
componentDidMount() {
document.getElementById('greetingName').value = localStorage.getItem('greetingName');
+ document.getElementById('customBackground').value = localStorage.getItem('customBackground');
+ /*const hex = localStorage.getItem('customBackgroundColour');
+ if (!hex === '') {
+ document.getElementById('customBackgroundColour').value = hex;
+ document.getElementById('customBackgroundHex').innerText = hex;
+ }*/
for (const key of Object.keys(localStorage)) {
let value = localStorage.getItem(key);
@@ -71,14 +71,14 @@ export default class Settings extends React.Component {
document.getElementById('blurAmount').innerText = value;
document.getElementById('blurRange').value = value;
}
-
+
const tag = document.getElementById(`${key}Status`);
-
+
if (tag) {
switch (value) {
case 'true': value = true; break;
case 'false': value = false; break;
- default: value = true;
+ default: value = true;
}
tag.checked = value;
@@ -88,6 +88,12 @@ export default class Settings extends React.Component {
document.addEventListener('keyup', (event) => {
if (event.keyCode === 13) this.saveStuff();
});
+
+ const darkTheme = localStorage.getItem('darkTheme');
+ if (darkTheme === 'true') {
+ document.getElementById('customBackground').style.color = 'white';
+ document.getElementById('greetingName').style.color = 'white';
+ }
}
render() {
@@ -98,7 +104,7 @@ export default class Settings extends React.Component {
;
}
}
\ No newline at end of file
diff --git a/src/components/Update.jsx b/src/components/Update.jsx
index bbdb7705..d690c3d0 100644
--- a/src/components/Update.jsx
+++ b/src/components/Update.jsx
@@ -20,8 +20,8 @@ export default class Update extends React.Component {
try { // First we try and get a quote from the API...
let data = await fetch('https://api.muetab.xyz/getUpdate');
data = await data.json();
- this.setState({
- title: data.title,
+ this.setState({
+ title: data.title,
content: data.content
});
} catch (e) {
diff --git a/src/scss/modules/_modal.scss b/src/scss/modules/_modal.scss
index 11e686a1..b9d69c4e 100644
--- a/src/scss/modules/_modal.scss
+++ b/src/scss/modules/_modal.scss
@@ -13,24 +13,18 @@
}
}
-a.modalLink {
+.modalLink {
color: #5352ed;
cursor: pointer;
-}
-
-.Overlay {
- position: fixed;
- top: 0;
- left: 0;
- right: 0;
- bottom: 0;
+ &:hover {
+ opacity: 0.8;
+ }
}
.closeModal {
float: right;
font-size: 2em;
cursor: pointer;
-
&:hover {
color: grey;
}
@@ -46,11 +40,13 @@ a.modalLink {
overflow: hidden; /* prevents background page from scrolling when the modal is open */
}
-.ReactModal__Overlay {
+.Overlay {
position: fixed;
z-index: 999999;
top: 0;
left: 0;
+ right: 0;
+ bottom: 0;
width: 100vw;
height: 90vh;
display: flex;
diff --git a/src/scss/modules/_search.scss b/src/scss/modules/_search.scss
index 8c28f3b1..f1652915 100644
--- a/src/scss/modules/_search.scss
+++ b/src/scss/modules/_search.scss
@@ -6,7 +6,7 @@
flex-direction: row;
display: block;
color: #ffff;
- font-family: 'Lexend Deca';
+ font-family: 'Lexend Deca', sans-serif;;
input[type=text] {
font-size: calc(5px + 1.2vmin);
diff --git a/src/scss/modules/_settings.scss b/src/scss/modules/_settings.scss
index 28f7e59a..043da32b 100644
--- a/src/scss/modules/_settings.scss
+++ b/src/scss/modules/_settings.scss
@@ -22,8 +22,6 @@ $gradient: linear-gradient(90deg, #ffb032 0%, #dd3b67 100%);
right: 0;
bottom: 0;
background-color: #ccc;
- -webkit-transition: .4s;
- transition: .4s;
border-radius: 34px;
&:before {
@@ -102,6 +100,7 @@ h4, #engines {
box-shadow: 20px #000;
font-size: 1.3em;
position: relative;
+ font-family: 'Lexend Deca', sans-serif;
&:hover {
transform: translateY(-0.10em);
@@ -170,6 +169,10 @@ h4, #engines {
ul {
padding-left: 5px;
margin: 0;
+
+ > label {
+ vertical-align: middle;
+ }
}
li {
@@ -204,4 +207,28 @@ li {
background: $gradient;
cursor: pointer;
}
+}
+
+input[type=color] {
+ border-radius: 100%;
+ height: 30px;
+ width: 30px;
+ box-shadow: 0 0 1rem 0 rgba(0, 0, 0, .2);
+ border: none;
+ outline: none;
+ -webkit-appearance: none;
+ vertical-align: middle;
+
+ &::-webkit-color-swatch-wrapper {
+ padding: 0;
+ }
+
+ &::-webkit-color-swatch {
+ border: none;
+ border-radius: 100%;
+ }
+}
+
+input[type=checkbox] {
+ vertical-align: middle;
}
\ No newline at end of file