Fix linting errors

zesik · Nov 13, 2016 · d1470c3 · d1470c3
1 parent d27959f
commit d1470c3
Show file tree

Hide file tree

Showing 8 changed files with 21 additions and 17 deletions.
diff --git a/.eslintrc.js b/.eslintrc.js
@@ -12,6 +12,7 @@ module.exports = {
     'no-console': [1, { 'allow': ["warn", "error"] }],
     'no-multiple-empty-lines': [1, { 'max': 1 }],
     'no-param-reassign': [0],
+    'no-plusplus': [0],
     'no-unused-vars': [1],
     'no-underscore-dangle': [0],
     'prefer-arrow-callback': [0],

diff --git a/example/javascripts/containers/App.jsx b/example/javascripts/containers/App.jsx
@@ -83,6 +83,7 @@ function App(props) {
           <div className="settings-submit">
             <input
               type="button"
+              className="btn"
               value="Show Notification"
               onClick={() => onShowNotification(message, level, autoClose, autoCloseDelay)}
             />

diff --git a/example/stylesheets/index.css b/example/stylesheets/index.css
@@ -33,7 +33,7 @@ input[type="text"]:disabled, input[type="number"]:disabled, select:disabled, tex
   border-color: rgba(0,0,0,0.1);
 }
 
-input[type="button"], button {
+input[type="button"].btn, button.btn {
   padding: 12px 24px;
   outline: none;
   color: #ffffff;
@@ -43,16 +43,16 @@ input[type="button"], button {
   cursor: pointer;
 }
 
-input[type="button"]:focus, button:focus {
+input[type="button"].btn:focus, button.btn:focus {
   box-shadow: 0 0 2px #42a5f5;
   background-color: #1565c0;
 }
 
-input[type="button"]:active, button:active {
+input[type="button"].btn:active, button.btn:active {
   background-color: #0d47a1;
 }
 
-input[type="button"]:disabled, button:disabled {
+input[type="button"].btn:disabled, button.btn:disabled {
   background-color: #64b5f6;
 }
 

diff --git a/src/actions/index.js b/src/actions/index.js
@@ -27,7 +27,7 @@ export function removeNotification(id) {
 
 function showNotification(level, message, autoCloseDelay) {
   const id = nextNotificationID++;
-  return dispatch => {
+  return (dispatch) => {
     dispatch(appendNotification(id, level, message));
     if (autoCloseDelay > 0) {
       setTimeout(() => dispatch(removeNotification(id)), autoCloseDelay);

diff --git a/src/components/NotificationItem.jsx b/src/components/NotificationItem.jsx
@@ -22,11 +22,11 @@ function NotificationItem(props) {
   }
   return (
     <div className={classes}>
-      <div className="notification-close" onClick={() => props.onClose(props.id)} />
+      <button className="notification-close" onClick={() => props.onClose(props.id)} />
       {
         props.dangerouslyAllowHTML ?
-        <div className="notification-content" dangerouslySetInnerHTML={{ __html: props.message }} /> :
-        <div className="notification-content">{props.message}</div>
+          <div className="notification-content" dangerouslySetInnerHTML={{ __html: props.message }} /> :
+          <div className="notification-content">{props.message}</div>
       }
     </div>
   );

diff --git a/src/containers/NotificationSystem.jsx b/src/containers/NotificationSystem.jsx
@@ -56,8 +56,8 @@ const mapStateToProps = (state, ownProps) => ({
   dangerouslyAllowHTML: ownProps.dangerouslyAllowHTML
 });
 
-const mapDispatchToProps = (dispatch) => ({
-  onCloseNotification: id => {
+const mapDispatchToProps = dispatch => ({
+  onCloseNotification: (id) => {
     dispatch(removeNotification(id));
   }
 });

diff --git a/src/stylesheets/notifications.css b/src/stylesheets/notifications.css
@@ -49,7 +49,9 @@
   margin-right: -6px;
   margin-top: -6px;
   cursor: pointer;
+  border: none;
   border-radius: 50%;
+  background: none;
 }
 
 #notification-container .notification-close::before, #notification-container .notification-close::after {

diff --git a/test/components.spec.jsx b/test/components.spec.jsx
@@ -31,7 +31,7 @@ describe('Re-alert component', () => {
 
       const [close, content] = output.props.children;
 
-      expect(close.type).toBe('div');
+      expect(close.type).toBe('button');
       expect(close.props.className).toBe('notification-close');
 
       expect(content.type).toBe('div');
@@ -47,7 +47,7 @@ describe('Re-alert component', () => {
 
       const [close, content] = output.props.children;
 
-      expect(close.type).toBe('div');
+      expect(close.type).toBe('button');
       expect(close.props.className).toBe('notification-close');
 
       expect(content.type).toBe('div');
@@ -63,7 +63,7 @@ describe('Re-alert component', () => {
 
       const [close, content] = output.props.children;
 
-      expect(close.type).toBe('div');
+      expect(close.type).toBe('button');
       expect(close.props.className).toBe('notification-close');
 
       expect(content.type).toBe('div');
@@ -79,7 +79,7 @@ describe('Re-alert component', () => {
 
       const [close, content] = output.props.children;
 
-      expect(close.type).toBe('div');
+      expect(close.type).toBe('button');
       expect(close.props.className).toBe('notification-close');
 
       expect(content.type).toBe('div');
@@ -95,7 +95,7 @@ describe('Re-alert component', () => {
 
       const [close, content] = output.props.children;
 
-      expect(close.type).toBe('div');
+      expect(close.type).toBe('button');
       expect(close.props.className).toBe('notification-close');
 
       expect(content.type).toBe('div');
@@ -118,7 +118,7 @@ describe('Re-alert component', () => {
 
       const [close, content] = output.props.children;
 
-      expect(close.type).toBe('div');
+      expect(close.type).toBe('button');
       expect(close.props.className).toBe('notification-close');
 
       expect(content.type).toBe('div');
@@ -135,7 +135,7 @@ describe('Re-alert component', () => {
 
       const [close, content] = output.props.children;
 
-      expect(close.type).toBe('div');
+      expect(close.type).toBe('button');
       expect(close.props.className).toBe('notification-close');
 
       expect(content.type).toBe('div');