Ajustes nightmode

2 files changed, 16 insertions, 11 deletions

diff --git a/src/App.css b/src/App.css
index 9486e24..e2d217a 100644
--- a/src/App.css
+++ b/src/App.css
@@ -78,12 +78,12 @@
   padding-bottom: 0.75em;
 }
 
-.ui.attached:not(.top).header {
+.ui.attached:not(.top).header.inverted {
   border-top: 1px solid !important;
   border-radius: 0.28571429rem 0.28571429rem 0 0;
 }
 
-.ui.inverted.attached.header {
+.ui.inverted.attached.header.inverted {
   border-color: #555555 !important;
 }
 
diff --git a/src/Home.js b/src/Home.js
index 5832ce4..5dd8006 100644
--- a/src/Home.js
+++ b/src/Home.js
@@ -104,6 +104,7 @@ class Home extends Component {
     }
 
     const { newThreadsList, lastAgeThreads, latestNews } = this.state;
+    const { nightMode } = this.props;
     document.title = "B.a.I Home";
     return (
       <Grid
@@ -111,14 +112,14 @@ class Home extends Component {
         divided
         container
         doubling
-        className={
-          this.props.nightMode ? "homeContainer inverted" : "homeContainer"
-        }
+        className={nightMode ? "homeContainer inverted" : "homeContainer"}
       >
         <Grid.Row>
           <Grid.Column>
-            <Header as="h4">Hilos activos</Header>
-            <List divided>
+            <Header as="h4" inverted={nightMode}>
+              Hilos activos
+            </Header>
+            <List divided inverted={nightMode}>
               {lastAgeThreads.map(thread => (
                 <List.Item key={thread.id}>
                   <List.Icon
@@ -149,8 +150,10 @@ class Home extends Component {
             </List>
           </Grid.Column>
           <Grid.Column>
-            <Header as="h4">Nuevos hilos</Header>
-            <List divided>
+            <Header as="h4" inverted={nightMode}>
+              Nuevos hilos
+            </Header>
+            <List divided inverted={nightMode}>
               {newThreadsList.map(thread => (
                 <List.Item key={thread.id}>
                   <List.Icon
@@ -183,8 +186,10 @@ class Home extends Component {
         </Grid.Row>
         <Grid.Row columns={1}>
           <Grid.Column>
-            <Header as="h4">Blotter</Header>
-            <List divided>
+            <Header as="h4" inverted={nightMode}>
+              Blotter
+            </Header>
+            <List divided inverted={nightMode}>
               {latestNews.map(n => (
                 <List.Item key={n.timestamp}>
                   <List.Content>