More Style Changes

1 files changed, 136 insertions, 12 deletions

diff --git a/css/main.css b/css/main.css
index 87039eb..e4702a5 100644
--- a/css/main.css
+++ b/css/main.css
@@ -1,34 +1,153 @@
 /*==========================
         DEFAULTS
 ==========================*/
+
 body {
     background: rgb(51,51,51);
-    background: linear-gradient(90deg, rgba(51,51,51,1) 0%, rgba(17,17,17,1) 50%, rgba(51,51,51,1) 100%);
+    background: linear-gradient(90deg, rgba(19,19,19,1) 0%, rgb(47, 47, 47) 50%, rgba(19,19,19,1) 100%);
 }
 
 nav {
-    background: rgb(0,0,0);
+    background: rgb(7,7,7);
 }
 
-h1, h2, h3 {
-    color: #cc7b19;
+h1, h2, h3, h4, h5 {
+    color: #e5a00d;
 }
 
 .card {
-    background-color: rgba(30,30,30,80);
+    background-color: rgba(40,40,40,1);
 }
 
 small {
     color: rgb(190,190,190);
 }
 
-table, td, tr {
+nav h3 small.text-muted {
+    color: rgb(240,240,240) !important;
+}
+
+a {
+    color: #F39C12;
+    text-decoration: none;
+    background-color: transparent;
+}
+
+a:hover {
+    color: rgb(240,240,240);
+    text-decoration: none;
+    background-color: transparent;
+}
+
+.text-muted {
+    color: rgb(190,190,190) !important;
+}
+
+label {
     color: rgb(240,240,240);
 }
 
 /*==========================
+        MODALS
+==========================*/
+
+#progressModalTitle {
+    width: 100%;
+}
+
+.modal-content {
+    background-color: rgba(40,40,40,1);
+}
+
+.modal-content .close {
+    color: rgb(240,240,240);
+    opacity: 1;
+}
+
+.modal-header {
+    border-bottom: 1px solid #aaa;
+}
+
+.modal-footer {
+    border-top: 1px solid #aaa;
+}
+
+/*==========================
+        FORM CONTROLS
+==========================*/
+
+.form-control {
+    background: rgba(240, 240, 240, 0.7);
+    border: 1px solid #aaa;
+}
+
+.form-control:focus {
+    background: rgba(240, 240, 240, 0.95);
+    border-color: rgb(192, 118, 0.8);
+    box-shadow: 0 0 0 0.2rem rgba(243,156,18,.25);
+    color: #222;
+}
+
+.form-control.is-valid {
+    background-color: rgba(239, 255, 243, 0.7);
+}
+
+.form-control.is-valid:focus {
+    background-color: rgba(239, 255, 243, 0.95);
+    color: #222;
+}
+
+.form-control.is-invalid {
+    background-color: rgba(255, 239, 243, 0.7);
+}
+
+.form-control.is-invalid:focus {
+    background-color: rgba(255, 239, 243, 0.95);
+    color: #222;
+}
+
+/*==========================
+        NAV TABS
+==========================*/
+
+.nav-tabs {
+    border-bottom: 1px solid #aaa;
+}
+
+.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {
+    color: rgb(240,240,240);
+    background-color: rgba(40,40,40,0.85);
+    border-color: #aaa #aaa rgba(40,40,40,1);
+}
+
+/*==========================
         BUTTONS
 ==========================*/
+
+.btn-secondary {
+    color: #fff;
+    background-color: #F39C12;
+    border-color: #F39C12;
+}
+
+.btn-secondary:hover {
+    color: #fff;
+    background-color: #d4860b;
+    border-color: #c87f0a;
+}
+
+.btn-secondary:not(:disabled):not(.disabled):active {
+    color: #fff;
+    background-color: #c87f0a;
+    border-color: #bc770a;
+}
+
+.btn-secondary.disabled, .btn-secondary:disabled {
+    color: #fff;
+    background-color: #F39C12;
+    border-color: #F39C12;
+}
+
 #episodeOrSeriesBtns label {
     cursor: pointer;
 }
@@ -38,15 +157,20 @@ table, td, tr {
 }
 
 /*==========================
-        MODALS
+        TABLES
 ==========================*/
-#progressModalTitle {
-    width: 100%;
+
+table, td, tr {
+    color: rgb(240,240,240);
 }
 
-/*==========================
-        TABLES
-==========================*/
+.table td, .table th {
+    border-top: 1px solid #aaa;
+}
+
+.table thead th {
+    border-bottom: 2px solid #aaa;
+}
 
 #libraryTable tbody tr {
     cursor: pointer;