Color adjustments

src/components/Button/index.css

@@ -20,7 +20,7 @@
 
 .Button.btn-blue {
     background: #61B3FF;
-    color: #315E87;
+    color: #8b8b8b;
 }
 
 .Button.btn-blue:hover {
@@ -28,6 +28,24 @@
     color: #233E56;
 }
 
+.Button.btn-red {
+    background: #fa4242;
+    color: #860f0f;
+}
+
+.Button.btn-red:hover {
+    background: #e91a1a;
+    color: #4e1717;
+}
+
+.Button.btn-red .icon {
+    color: #860f0f;
+}
+
+.Button.btn-red:hover .icon {
+    color: #4e1717;
+}
+
 .Button.btn-disabled {
     background: #e0e0e0;
     color: #bababa;
@@ -51,4 +69,8 @@
 .Button:hover {
     color: #555;
     cursor: pointer;
+}
+
+.Button:hover .icon {
+    color: #2360C5;
 }

src/components/GridRep/index.css

@@ -11,7 +11,7 @@
 }
 
 .GridRep:hover {
-    border: 2px solid #61B3FF;
+    border: 2px solid #2360C5;
     cursor: pointer;
 }
 

src/components/Header/index.css

@@ -23,7 +23,11 @@
     padding-bottom: 16px;
 }
 
-.dropdown:hover .Button > * {
+.dropdown:hover .Button .icon {
+    color: #2360C5;
+}
+
+.dropdown:hover .Button .text {
     color: #555;
 }
 

src/components/Header/index.tsx

@@ -58,6 +58,9 @@ const Header = (props: Props) => {
             </div>
             <div className="push" />
             <div className="right">
+                {/* { (location.pathname.includes('/p/')) ?
+                    <Button color="red" type="link" click={() => {}}>Delete</Button> : ''
+                } */}
                 { (location.pathname.includes('/p/')) ?
                     <Button type="link" click={copyToClipboard}>Copy link</Button> : ''
                 }

src/components/HeaderMenu/index.css

@@ -20,14 +20,14 @@
 .MenuItem:hover {
     color: #555;
     cursor: pointer;
-    background: #e9e9e9;
+    background: #f9f9f9;
 }
 
 .MenuItem a {
     color: #777
 }
 
-.MenuItem a:hover {
+.MenuItem:hover a {
     color: #555
 }
 

src/components/Segment/index.css

@@ -12,11 +12,12 @@
 }
 
 .Segment:hover > label {
-    background: #e0e0e0;
+    background: #f9f9f9;
+    color: #555;
 }
 
 .Segment > input:checked + label {
-    background: #61B3FF;
+    background: #2360C5;
     color: white;
 }