Merge pull request #388 from ScilifelabDataCentre/387-add-border-reso…

…urce-tab 387 add border resource tab
ScilifelabDataCentre · Jul 10, 2024 · a15aae7 · a15aae7
2 parents 00242d0 + c80d8c4
commit a15aae7
Show file tree

Hide file tree

Showing 2 changed files with 19 additions and 24 deletions.
diff --git a/layouts/resources/list.html b/layouts/resources/list.html
@@ -57,8 +57,7 @@
                       "tool" (dict "type" $to_type "level" $level "phase" $phase "rlist" $to_rlist "provider" $to_provider) }}
 
 <!-- Tab list -->
-<!-- note: put more to the right, so that it starts beyond filter column -->
-<ul class="nav nav-tabs nav-justified resources-tab-list mb-3">
+<ul class="nav nav-tabs nav-justified resources-tab-list">
   <li class="nav-item cont-links">
     <a class="nav-link active" href="#resources-training" data-bs-toggle="tab" role="tab">
       Training

diff --git a/static/css/styles.css b/static/css/styles.css
@@ -274,22 +274,23 @@ html {
 
 /* Homepage */
 
+.column {
+  float: left;
+  width: 50%;
+}
+
 .cont-links a {
-  color: #491f53;
+  color: #045c64;
+  font-weight: bold;
 }
 
 .cont-links a:hover,
 .cont-links a:focus,
 .cont-links a:active {
-  color: #491f53;
+  color: #045c64;
   text-decoration: underline;
 }
 
-.column {
-  float: left;
-  width: 50%;
-}
-
 /* Clear floats after the columns */
 .row:after {
   content: "";
@@ -373,18 +374,6 @@ html {
   background-color: rgba(4, 92, 100, 0.25);
 }
 
-.cont-links a {
-  color: #045c64;
-  font-weight: bold;
-}
-
-.cont-links a:hover,
-.cont-links a:focus,
-.cont-links a:active {
-  color: #045c64;
-  text-decoration: underline;
-}
-
 /*-----Contributors cards-----*/
 .card-img-top {
   height: 9rem;
@@ -450,13 +439,20 @@ html {
 /* Resources page */
 
 .nav-tabs .nav-item .nav-link {
-  background-color: #4C979F;
+  background-color: rgba(76, 151, 159, 0.75);
   color: #FFF;
-  border-color: #FFF;
+  border-color: #4C979F;
+  border-bottom-color: #4C979F;
 }
 
 .nav-tabs .nav-item .nav-link.active {
   background-color: #FFF;
   color: #045C64;
-  border-color: #4C979F #4C979F #FFF #4C979F ;
+  border-color: #4C979F;
+  border-bottom-color: transparent;
+}
+.tab-content {
+  border: 1px solid #4C979F;
+  border-top: transparent;
+  padding: 15px;
 }