add(main page): intern box style

Author: lichin-lin

src/js/components/pages/dashboard/Base.styl

@@ -1,5 +1,5 @@
-$brand_blue_light = lighten(#0AF, 25%)
-$brand_blue = darken(#0AF, 5%)
+$brand_blue_light = lighten(#58A0FC, 5%)
+$brand_blue = darken(#58A0FC, 5%)
 
 .submitNewPost--contain
     display: flex

src/js/components/pages/dashboard/InternBox.jsx

@@ -82,6 +82,7 @@ export default CSSModules(class Inner extends Component {
     render () {
         return (
             <div className="internBoxWrapper">
+                <div className="innerBoxWrapperContent">
                 <Animate enter={{'animation': 'fade', 'duration': 700, 'delay': 0}}
                     keep={false}
                     style={{
@@ -114,10 +115,13 @@ export default CSSModules(class Inner extends Component {
                             link= {
                                 <Anchor
                                     // onClick={this.props.onClose}
+                                    className="internBoxLink"
                                     id={this.state.id.toString()}
                                     label='查看心得全文'
                                     style={{
-                                        marginTop: '10px'
+                                        marginTop: '10px',
+                                        fontWeight: 'bold',
+                                        color: '#0AF !important'
                                     }} />
                                 }
                                 style={{
@@ -142,7 +146,8 @@ export default CSSModules(class Inner extends Component {
                         <span>{this.state.messageCount}</span>
                     </div>
                     </Link>
-               </Animate>
+                   </Animate>
+                </div>
             </div>
         )
     }

src/js/components/pages/dashboard/InternBox.styl

@@ -1,5 +1,7 @@
 .internBoxWrapper
     width: 100%
+    padding: 10px
+    margin: 5px 0
     .actionButton
         display: flex
         margin-left: 10px
@@ -15,7 +17,18 @@
     .grommetux-app--hidden
         position: fixed
         overflow: hidden !important
+    .innerBoxWrapperContent
+        width: 100%
+        padding-bottom: 1px
+        border-radius: 5px
+        box-shadow: 0px 1px 7px #50514F
+        .internBoxLink
+            color: #58A0FC !important
+            text-decoration: none !important
     a
-        color: #50514F
+        color: #50514F !important
+        text-decoration: none !important
+        &hover
+            text-decoration: none !important
     @media screen and (min-width: 768px)
         width: 50%