fix tab colours, card

galaxyproject · Jun 3, 2024 · f0e44c6 · f0e44c6
1 parent e59570f
commit f0e44c6
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 7 deletions.
diff --git a/_layouts/event.html b/_layouts/event.html
@@ -144,7 +144,7 @@ <h3>Get set up for the course!</h3>
     <div class="card setup-card">
 	  <div class="row no-gutters">
 		<div class="col-sm-3">
-		  <img src="{% link assets/images/galaxylogo.png %}" class="card-img" alt="Galaxy logo" style="width: 70%">
+		  <img src="{% link assets/images/galaxylogo.png %}" class="card-img" alt="Galaxy logo" style="max-height: 10em">
 		</div>
 		<div class="col-sm-9">
 		  <div class="card-body">
@@ -174,7 +174,7 @@ <h5 class="card-title">Create a Galaxy Account</h5>
     <div class="card setup-card">
 	  <div class="row no-gutters">
 		<div class="col-sm-3">
-		  <img src="{% link assets/images/galaxy-for-trainers.svg %}" class="card-img" alt="TIaaS" style="width:70%">
+		  <img src="{% link assets/images/galaxy-for-trainers.svg %}" class="card-img" alt="cartoon of a person standing in front of a blackboard" style="max-height: 10em">
 		</div>
 		<div class="col-sm-9">
 		  <div class="card-body">
@@ -208,7 +208,7 @@ <h5 class="card-title">Join Galaxy Training Group (TIaaS)</h5>
     <div class="card setup-card">
 	  <div class="row no-gutters">
 		<div class="col-sm-3">
-		  <img src="{% link assets/images/galaxy-for-developers.svg %}" class="card-img" alt="Galaxy logo">
+		  <img src="{% link assets/images/galaxy-for-developers.svg %}" class="card-img" alt="cartoon of a person leaning against a laptop" style="max-height:10em">
 		</div>
 		<div class="col-sm-9">
 		  <div class="card-body">

diff --git a/assets/css/main.scss b/assets/css/main.scss
@@ -710,17 +710,21 @@ blockquote {
     white-space: pre-wrap;
 }
 
-.card:not(.setup-card){
+.card{
 	background: transparent;
 	border: 1px solid var(--border-light);
 	.card-title {
-		background: var(--brand-color);
-		border-bottom: 1px solid var(--border-light);
-		padding: 1.25rem;
 		color: var(--brand-color-contrast);
 		// margin-left: -15px; // BS has a 15px margin on cards, this makes the card title fill the card.
 		// margin-right: -15px;
 	}
+}
+
+.card:not(.setup-card){
+	.card-title {
+		background: var(--brand-color);
+		padding: 1.25rem;
+	}
 
 	.card-body {
 		padding: 0em;
@@ -1827,6 +1831,8 @@ section.event {
 
 }
 .nav-tabs {
+	// Tabs default to a text colour that isn't overridden somewhere else.
+
 	.nav-item {
 		margin-bottom: 0;
 		padding-bottom: 0;
@@ -1838,6 +1844,7 @@ section.event {
 		}
 
 		button.nav-link{
+			color: var(--text-color);
 			cursor: pointer;
 			background: none;
 			font-size: 1.2rem;
@@ -1850,9 +1857,11 @@ section.event {
 
 			&.active {
 				background: var(--overview-color);
+				border: 1px solid var(--overview-color);
 				color: white;
 			}
 		}
 	}
 
 }
+