mirrors/mue
1
0
Fork 0
mirror of https://github.com/mue/mue.git synced 2026-07-22 00:07:23 +02:00
Code Issues Packages Projects Releases Wiki Activity

fix: improvements to feedback modal

Browse Source
This commit is contained in:
David Ralph
2021-08-05 17:25:46 +01:00
parent 6cdfb9db3e
commit eefc594ec1
3 changed files with 13 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
src/components/modals/Modals.jsx
View File

@@ -3,14 +3,14 @@ import React from 'react';
import EventBus from '../../modules/helpers/eventbus'; import EventBus from '../../modules/helpers/eventbus';
import Main from './main/Main'; import Main from './main/Main';
import Feedback from './feedback/Feedback';
import Navbar from '../widgets/navbar/Navbar'; import Navbar from '../widgets/navbar/Navbar';
import Modal from 'react-modal'; import Modal from 'react-modal';
// These modals are lazy loaded as the user won't use them every time they open a tab // Welcome modal is lazy loaded as the user won't use it every time they open a tab
// We used to lazy load the main modal, but doing so broke the main modal open animation on first click // We used to lazy load the main and feedback modals, but doing so broke the modal open animation on first click
const Welcome = React.lazy(() => import('./welcome/Welcome')); const Welcome = React.lazy(() => import('./welcome/Welcome'));
const Feedback = React.lazy(() => import('./feedback/Feedback'));
const renderLoader = () => <></>; const renderLoader = () => <></>;
export default class Modals extends React.PureComponent { export default class Modals extends React.PureComponent {

6
src/components/modals/feedback/Feedback.jsx
View File

@@ -38,7 +38,7 @@ export default class FeedbackModal extends React.PureComponent {
}); });
await fetch(window.constants.FEEDBACK_FORM, { await fetch(window.constants.FEEDBACK_FORM, {
'method': 'POST' method: 'POST'
}); });
this.setState({ this.setState({
@@ -47,7 +47,7 @@ export default class FeedbackModal extends React.PureComponent {
setTimeout(() => { setTimeout(() => {
this.props.modalClose(); this.props.modalClose();
}, 3000); }, 5000);
} }
} }
@@ -84,7 +84,7 @@ export default class FeedbackModal extends React.PureComponent {
<textarea name='question4' id='questionfour'/> <textarea name='question4' id='questionfour'/>
<p className='feedbackerror'>{this.state.questionfourerror}</p> <p className='feedbackerror'>{this.state.questionfourerror}</p>
</> </>
{this.state.formsubmit} <p>{this.state.formsubmit}</p>
<button onClick={() => this.submitForm()}>{this.language.submit}</button> <button onClick={() => this.submitForm()}>{this.language.submit}</button>
</> </>
</div> </div>

9
src/components/modals/feedback/feedback.scss
View File

@@ -31,10 +31,14 @@
border: none; border: none;
padding: 15px 20px; padding: 15px 20px;
font-size: 1.5em; font-size: 1.5em;
background: linear-gradient(90deg, #ffb032 0%, #dd3b67 100%); background: #5352ed;
color: #fff; color: #fff;
text-transform: uppercase; text-transform: uppercase;
cursor: pointer; cursor: pointer;
&:hover {
background: rgba(83, 82, 237, 0.8);
}
} }
input[type=text] { input[type=text] {
@@ -54,7 +58,8 @@
textarea { textarea {
width: 80%; width: 80%;
background-color: var(--sidebar); padding: 10px;
background-color: var(--sidebar) !important;
} }
.feedbackerror { .feedbackerror {