fix conflict with 'show' class

Author: samuelcolvin

src/components/contractors/List.js

@@ -16,7 +16,7 @@ class AnimateLink extends Component {
   render () {
     const extra_classes = this.props.className ? this.props.className + ' ' : ''
     return (
-      <Link to={this.props.to} className={extra_classes + 'tcs-animate-entry' + (this.state.show ? ' show' : '')}>
+      <Link to={this.props.to} className={extra_classes + 'tcs-animate-entry' + (this.state.show ? ' tcs-show' : '')}>
         {this.props.children}
       </Link>
     )

src/components/shared/Modal.js

@@ -42,7 +42,7 @@ class Modal extends Component {
 
   render () {
     return (
-      <div className={'tcs-modal-mask' + (this.state.show ? ' show' : '')} onClick={this.close}>
+      <div className={'tcs-modal-mask' + (this.state.show ? ' tcs-show' : '')} onClick={this.close}>
         <div className="tcs-modal" onClick={e => e.stopPropagation()}>
           <div className="tcs-header">
             <h2>{this.props.title}</h2>

src/styles/contractors.scss

@@ -48,7 +48,7 @@
 .tcs-animate-entry {
   opacity: 0;
   transition: all .5s ease;
-  &.show {
+  &.tcs-show {
     opacity: 1;
   }
 }

src/styles/modal.scss

@@ -26,7 +26,7 @@
   background-color: rgba($back-colour, $back-colour, $back-colour, .6);
   opacity: 0;
   transition: all .3s ease;
-  &.show {
+  &.tcs-show {
     opacity: 1;
     .tcs-modal {
       transform: translate(0, 0);