Tag style

PrefLib · Aug 21, 2022 · da5050e · da5050e
1 parent cda4553
commit da5050e
Show file tree

Hide file tree

Showing 2 changed files with 27 additions and 6 deletions.
diff --git a/preflibApp/static/css/style.css b/preflibApp/static/css/style.css
@@ -874,13 +874,28 @@ ul#dataset-list .dataset-description {
 	font-style: normal;
 }
 
+.dataset-tags .data-tag {
+	font-size: 80%;
+	background-color: var(--color-blue3);
+	box-shadow: 0px 0px 1px 0px var(--color-blue1);
+	padding: 2px 3px;
+	border-radius: 3px;
+
+}
+
 .button-row {
-	display: flex;
-	/* justify-content: center; */
-	margin-top: 10px;
+	margin-top: 20px;
 	gap: 10px;
 }
 
+.button-row a:nth-child(1) {
+	display: inline-block;
+}
+
+.button-row a:nth-child(2) {
+	float: right;
+}
+
 nav#dataset-menu {
 	display: none;
 }

diff --git a/preflibApp/templates/preflib/datasetall.html b/preflibApp/templates/preflib/datasetall.html
@@ -40,7 +40,13 @@ <h2 class="dataset-title"><a href="{% url 'preflibapp:dataset' ds.category ds.se
 
 				<p class="dataset-number">{{ds.category}}-{{ds.seriesNumber}}</p>
 
-				<p class="dataset-number">{{ds.get_tag_list}}</p>
+				{% if ds.tags %}
+					<p class="dataset-tags">
+						{% for tag in ds.tags.all %}
+							<span class="data-tag">{{ tag.name }}</span>
+						{% endfor %}
+					</p>
+				{% endif %}
 
 				<div class="dataset-description">
 				{% autoescape off %}
@@ -58,10 +64,10 @@ <h2 class="dataset-title"><a href="{% url 'preflibapp:dataset' ds.category ds.se
 					{% endif %}
 				</p>
 
-				<p class="button-row">
+				<div class="button-row">
 					<a href="{% url 'preflibapp:dataset' ds.category ds.seriesNumber %}" class="downloadButton">Details</a>
 					<a href="{% static dsinfo.zipFile %}" class="downloadButton">Download [zip, {{dsinfo.zipFileSize|filesizeformat}}]</a>
-				</p>
+				</div>
 			</li>
 		{% endwith %}
 	{% endfor %}