styled drosha miRNA boxes

Author: JohannesMP

assets/css/main.css

@@ -2,9 +2,9 @@ p {
     margin-bottom: 0.75rem;
 }
 
-#version-title
-{
+#version-title {
     font-size: 80%;
+    opacity: 0.75;
 }
 
 #header-box {
@@ -346,13 +346,21 @@ tr .mi-rna .mi-arm {
 }
 
 .mi-arm.mi-arm-drosha {
-    color:;
-    border-color: #ec2;
-    border-width: 2px;
+    background-color: #c19e66;
+    border-color: #82644a;
 }
 .mi-arm.mi-arm-drosha:hover {
-    color:;
-    border-color: #fd3;
+    background-color: #503f2e;
+}
+.mi-arm.mi-arm-less.mi-arm-drosha {
+    color: #7c7656;
+    background-color: #d4ccc3;
+    border-color: #c2b3a5;
+}
+.mi-arm.mi-arm-less.mi-arm-drosha:hover {
+    color: #211c13;
+    background-color: #a89d87;
+    border-color: #8e8372;
 }
 
 .red-badge {

assets/js/main.js

@@ -92,7 +92,6 @@ $(document).ready(function() {
                 for(var i = 0; i < dataStore.seedArr.length; ++i)
                     dataStore.seedMap[dataStore.seedArr[i].seed] = dataStore.seedArr[i];
 
-
                 // A lookup map of mi_rna to its data
                 for(var i = 0; i < dataStore.stemArr.length; ++i) {
                     let item = dataStore.stemArr[i];

index.html

@@ -141,8 +141,8 @@ <h5 class="card-title">Info</h5>
 
             <p>Click on a miRNA in the results to be taken to the mirbase site describing the miRNA.
                 <ul>
-                    <li>Mature miRNAs representing the predominant arm are shown in <div style="border-color: #8d7eaf66" class="badge badge-light mi-arm mi-arm-dom">dark purple</div>.</li>
-                    <li>Mature miRNAs representing the lesser expressed arm (the * activity) are shown in <div style="border-color: #e3dff0" class="badge badge-light mi-arm mi-arm-less">light purple</div>.</li>
+                    <li>Mature miRNAs representing the predominant arm are shown in <div style="border-color: #8d7eaf66" class="badge badge-light mi-arm mi-arm-dom">dark color</div>.</li>
+                    <li>Mature miRNAs representing the lesser expressed arm (the * activity) are shown in <div style="border-color: #e3dff0" class="badge badge-light mi-arm mi-arm-less">light color</div>.</li>
                     <li>miRNAs that are highly expressed and processed by Drosha (RISC bound in wild-type but not Drosha k.o. HCT116 cells) are in a <div class="badge badge-light mi-arm mi-arm-dom mi-arm-drosha">yellow</div> <div class="badge badge-light mi-arm mi-arm-less mi-arm-drosha">box</div>.
                     <ul>
                         <li>All other miRNAs are either not processed by Drosha (i.e. miR-320a), miRtrons, or not significantly expressed in HCT116 cells.</li>