updated styles of hover elements on homepage (#304)

appsody · Oct 18, 2019 · f081aa3 · f081aa3
1 parent 2820c9c
commit f081aa3
Showing 1 changed file with 20 additions and 1 deletion.
diff --git a/src/styles/main.css b/src/styles/main.css
@@ -12,6 +12,7 @@
   --colour-scheme-1: #BB417C;
   --colour-scheme-2: #ED8E00;
   --colour-scheme-3: #C4302F;
+  --colour-scheme-1-dark: #963463;
 
 }
 
@@ -41,6 +42,11 @@ h1, h2, h3, h4, h5, h6 {
   border-radius: 10px !important;
 }
 
+.btn-primary:hover {
+  background-color:  var(--colour-scheme-1-dark) !important;
+  border-color: var(--colour-scheme-1-dark) !important;
+}
+
 .btn-clear {
   padding: 6px 12px;
   color: var(--links-colour);
@@ -49,7 +55,7 @@ h1, h2, h3, h4, h5, h6 {
 }
 
 .btn-clear:hover {
-  color: var(--links-colour);
+  background-color: var(--light-grey);
 }
 
 section.landing-section {
@@ -76,11 +82,20 @@ section.landing-section h2 {
   color: var(--links-colour) !important;
 }
 
+.nav-link:hover {
+  color: var(--colour-scheme-1) !important;
+}
+
 .navbar-img {
   height: 25px;
   width: 25px;
 }
 
+/* Cannot change as the Slack icon is not transparent in the middle. Saving for later */
+/* .navbar-img:hover {
+  filter: invert(33%) sepia(54%) saturate(1628%) hue-rotate(295deg) brightness(86%) contrast(81%);
+} */
+
 @media only screen and (max-width: 767px) {
   .navbar-img {
     height: 25px;
@@ -194,6 +209,10 @@ section.landing-section h2 {
   background-color: white;
 }
 
+.flip a.btn:hover {
+  background-color: var(--light-grey);
+}
+
 .fa-arrow-left:hover, .fa-copy:hover {
   cursor: pointer;
 }