Add drop shadow to maincontainer

tim-tran · Jan 20, 2019 · a3a2b35 · a3a2b35
1 parent 27a6bad
commit a3a2b35
Show file tree

Hide file tree

Showing 4 changed files with 12 additions and 3 deletions.
diff --git a/feelsbook/feelsbook/src/App.js b/feelsbook/feelsbook/src/App.js
@@ -7,7 +7,7 @@ class App extends Component {
   render() {
     return (
       <div className="App">
-        <Title></Title>
+        {/* <Title></Title> */}
         <MainContainer></MainContainer>
       </div>
     );

diff --git a/feelsbook/feelsbook/src/components/EntryCard.jsx b/feelsbook/feelsbook/src/components/EntryCard.jsx
diff --git a/feelsbook/feelsbook/src/components/MainContainer.jsx b/feelsbook/feelsbook/src/components/MainContainer.jsx
@@ -37,7 +37,7 @@ class MainContainer extends Component {
               </Row>
             </Form.Group>
             <Form.Group controlId="exampleForm.ControlTextarea1">
-              <Form.Control as="textarea" rows="10" placeholder="Write Here!" className="light-transparency"/>
+              <Form.Control as="textarea" rows="13" placeholder="Write Here!" className="light-transparency"/>
             </Form.Group>
           </Form>
         </Card.Body>

diff --git a/feelsbook/feelsbook/src/components/css/MainContainer.css b/feelsbook/feelsbook/src/components/css/MainContainer.css
@@ -4,12 +4,21 @@
     height: 500px;
     width: 70%;
     margin: auto;
+    margin-top: 100px;
+    box-shadow: 10px 10px 50px black;
 }
 
 .light-transparency {
     background-color:rgba(255,255,255,0.2);
+    border-style: hidden;
 }
 
 .light-transparency:focus {
-    background-color:rgba(255,255,255,0.3);
+    background-color:rgba(255,255,255,0.4);
+    border-style: hidden;
+}
+
+.nav-tabs .nav-link.active, .nav-tabs .nav-item.show .nav-link {
+    background-color: rgba(255,255,255,0.3);
+    border-style: hidden;
 }