pot-375 - Making modals compatible with themes

5 files changed, 21 insertions, 28 deletions

diff --git a/web/sass-files/sass/partials/_base.scss b/web/sass-files/sass/partials/_base.scss
index 87d9b8200..ba27e7fbc 100644
--- a/web/sass-files/sass/partials/_base.scss
+++ b/web/sass-files/sass/partials/_base.scss
@@ -68,6 +68,19 @@ a:focus, a:hover {
  margin: 0;
 }
 
+.text-danger {
+  color: #E05F5D;
+}
+
+.btn {
+  &.btn-danger {
+    color: #fff;
+    &:hover, &:active {
+      color: #fff;
+    }
+  }
+}
+
 .form-control {
   @include border-radius(2px);
   &.no-resize {
diff --git a/web/sass-files/sass/partials/_modal.scss b/web/sass-files/sass/partials/_modal.scss
index e4e8b20b6..96b26f251 100644
--- a/web/sass-files/sass/partials/_modal.scss
+++ b/web/sass-files/sass/partials/_modal.scss
@@ -9,12 +9,6 @@
 			@include opacity(0.7);
 		}
 	}
-	a, a:focus, a:hover {
-		color: #2389D7;
-		&.text-danger {
-			color: #a94442;
-		}
-	}
 	.custom-textarea {
 		color: inherit;
 		border-color: #ccc;
@@ -25,12 +19,9 @@
 	}
 	.btn {
 		font-size: 13px;
-		&.btn-primary {
-			background: #4285f4;
-			&:hover, &:focus, &:active {
-				background: $primary-color--hover;
-				color: #fff;
-			}
+		&.btn-default {
+			border: none;
+			background: transparent;
 		}
 	}
 	.info__label {
@@ -70,7 +61,7 @@
 		background: $primary-color;
 		color: #FFF;
 		padding: 15px 15px 11px;
-		border: none;
+		border: 1px solid #ddd;
 		min-height: 56px;
 		@include clearfix;
 		.modal-title {
diff --git a/web/sass-files/sass/partials/_responsive.scss b/web/sass-files/sass/partials/_responsive.scss
index 9e8d0dc7d..82ec1811a 100644
--- a/web/sass-files/sass/partials/_responsive.scss
+++ b/web/sass-files/sass/partials/_responsive.scss
@@ -402,12 +402,6 @@
                             margin-left: 7px;
                         }
                     }
-                    &.active, &:hover {
-                        a {
-                            color: #555;
-                            background: #fff;
-                        }
-                    }
                 }
             }
         }
diff --git a/web/sass-files/sass/partials/_settings.scss b/web/sass-files/sass/partials/_settings.scss
index 3aab05d70..1f785f63c 100644
--- a/web/sass-files/sass/partials/_settings.scss
+++ b/web/sass-files/sass/partials/_settings.scss
@@ -2,7 +2,6 @@
 @import "activity-log";
 
 .user-settings {
-    background: #fff;
     min-height:300px;
     .table-responsive {
         max-width: 560px;
@@ -71,7 +70,7 @@
             }
 
             .section-max {
-                background: #f2f2f2;
+                background: rgba(black, 0.05);
                 padding: 1em 0 1.3em;
                 margin-bottom: 0;
                 @include clearfix;
@@ -121,7 +120,7 @@
                 .fa {
                     margin-right: 7px;
                     font-size: 12px;
-                    color: #aaa;
+                    @include opacity(0.5);
                     display: none;
                 }
             }
@@ -131,7 +130,7 @@
             }
 
             .section-describe {
-                color:grey;
+                @include opacity(0.7);
             }
 
             .divider-dark {
@@ -167,15 +166,11 @@
                     }
                 }
                 .control-label {
-                    color: #555;
                     font-weight: 600;
                     &.text-left {
                         text-align: left;
                     }
                 }
-                hr {
-                    border-color: #ccc;
-                }
             }
 
             .file-status {
diff --git a/web/sass-files/sass/partials/_sidebar--menu.scss b/web/sass-files/sass/partials/_sidebar--menu.scss
index 4366b1a6c..6f4a0cc38 100644
--- a/web/sass-files/sass/partials/_sidebar--menu.scss
+++ b/web/sass-files/sass/partials/_sidebar--menu.scss
@@ -54,7 +54,7 @@
             > a {
                 font-size: 15px;
                 background: none !important;
-                color: #444;
+                color: inherit;
                 line-height: 40px;
                 padding: 0 15px;
                 .glyphicon {