Merge pull request #21 from apparena/develop

Develop
apparena · Oct 17, 2017 · a9dac22 · a9dac22
2 parents 8627ca1 + 3b67eb3
commit a9dac22
Show file tree

Hide file tree

Showing 8 changed files with 82 additions and 365 deletions.
diff --git a/.gitignore b/.gitignore
@@ -13,7 +13,7 @@ source/styleguide/*
 /public/latest-change.txt
 
 .idea
-.idea/*
+.idea/
 !.idea/codeStyleSettings.xml
 
 ### Ignore bower components

diff --git a/.idea/workspace.xml b/.idea/workspace.xml
diff --git a/source/_patterns/01-molecules/forms/form-group.js b/source/_patterns/01-molecules/forms/form-group.js
@@ -10,7 +10,7 @@ function FormGroup({className, htmlFor, label, children, validationState, valida
     const elements = React.Children.map(children, (child) => {
         if (child.type.displayName === 'Input') {
             const input = React.cloneElement(child, {
-                className: validationState ? cx(child.props.className, styles[`form-control-${validationState}`]) : cx(child.props.className),
+                className: validationState ? cx(child.props.className, styles[`form-control`], styles[`form-control-${validationState}`]) : cx(child.props.className),
                 placeholder: inlineLabel ? label : ''
             });
             if (validationState && validationState !== 'default' && validationFeedback) {

diff --git a/source/_patterns/01-molecules/forms/form-group.scss b/source/_patterns/01-molecules/forms/form-group.scss
@@ -16,11 +16,6 @@
   }
 }
 
-// Form validation states
-.has-success {
-  @include form-control-validation($body-color);
-}
-
 .form-control-success,
 .form-control-warning,
 .form-control-danger {

diff --git a/source/_patterns/01-molecules/messages/notification/index.scss b/source/_patterns/01-molecules/messages/notification/index.scss
@@ -7,21 +7,23 @@
   Organism Navigation Sidebar
  ========================================================================== */
 
-.m-notification {
-  &.fixed {
+.notification-container {
+  position: fixed;
+  top: 0;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  pointer-events: none;
+  z-index: 2050;
+  > div {
     position: fixed;
-    top: 0;
-    bottom: 0;
-    left: 0;
-    right: 0;
-    pointer-events: none;
-    z-index: 2050;
+    top: 20px;
+    right: 20px;
   }
+}
 
+.m-notification {
   .content {
-    position: fixed;
-    top: 20px;
-    right: 20px;
     -webkit-border-radius: 5px;
     -moz-border-radius: 5px;
     border-radius: 5px;
@@ -32,13 +34,16 @@
     visibility: visible;
     pointer-events: auto;
     z-index: 1040;
+    margin-bottom: 1rem;
     &:before {
       content: '';
       bottom: 0;
       left: 0;
       top: 0;
       width: 40px;
       position: absolute;
+      border-top-left-radius: 5px;
+      border-bottom-left-radius: 5px;
     }
 
     .close {

diff --git a/...erns/react-utils/notificationContainer.js → ...ges/notification/notificationContainer.js b/...erns/react-utils/notificationContainer.js → ...ges/notification/notificationContainer.js
@@ -1,7 +1,8 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-import ReactComponent from './component';
-import Notification from '../01-molecules/messages/notification';
+import ReactComponent from '../../../react-utils/component';
+import Notification from './index';
+import styles from './index.scss';
 
 export default class NotificationContainer extends ReactComponent {
     static propTypes = {
@@ -18,8 +19,10 @@ export default class NotificationContainer extends ReactComponent {
 
     render() {
         return (
-            <div>
-                {this.props.notifications.map(this.renderNotification, this)}
+            <div className={styles.notificationContainer}>
+                <div>
+                    {this.props.notifications.map(this.renderNotification, this)}
+                </div>
             </div>
         );
     }

diff --git a/...e/_patterns/react-utils/modalContainer.js → ...erns/01-molecules/modal/modalContainer.js b/...e/_patterns/react-utils/modalContainer.js → ...erns/01-molecules/modal/modalContainer.js
@@ -1,6 +1,6 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-import ReactComponent from './component';
+import ReactComponent from '../../react-utils/component';
 
 export default class OverlaysContainer extends ReactComponent {
     static propTypes = {

diff --git a/source/_patterns/index.js b/source/_patterns/index.js
@@ -23,7 +23,7 @@ import Jumbotron from './01-molecules/jumbotron/jumbotron';
 import ListGroup from './01-molecules/list-group/list-group';
 import Modal from './01-molecules/modal/modal';
 import ModalBody from './01-molecules/modal/modal-body';
-import ModalContainer from './react-utils/modalContainer';
+import ModalContainer from './01-molecules/modal/modalContainer';
 import ModalFooter from './01-molecules/modal/modal-footer';
 import ModalHeader from './01-molecules/modal/modal-header';
 import Nav from './01-molecules/navs/nav';
@@ -32,7 +32,7 @@ import NavItem from './01-molecules/navs/nav-item';
 import NavSecondary from './02-organisms/navigation/nav-secondary';
 import NavSecondaryGroup from './02-organisms/navigation/nav-secondary-group';
 import Notification from './01-molecules/messages/notification';
-import NotificationContainer from './react-utils/notificationContainer';
+import NotificationContainer from './01-molecules/messages/notification/notificationContainer';
 import Popover from './01-molecules/popover/popover';
 import Portal from './react-utils/portal';
 import PriceTable from './02-organisms/price-table/price-table';