🎨 style version

Conditionally style the version badge so that current is green and past is orange.
This commit is contained in:
Greg Newman
2023-02-23 15:13:27 -05:00
parent c674b2d4a8
commit 77cd85cfa3
3 changed files with 24 additions and 7 deletions

View File

@@ -1647,6 +1647,10 @@ input[type=file] {
background-color: rgb(23 42 52 / 0.6);
}
.bg-green\/50 {
background-color: rgb(90 213 153 / 0.5);
}
.bg-transparent {
background-color: transparent;
}
@@ -1656,6 +1660,19 @@ input[type=file] {
background-color: rgb(49 74 87 / var(--tw-bg-opacity));
}
.bg-orange\/10 {
background-color: rgb(255 159 0 / 0.1);
}
.bg-orange\/60 {
background-color: rgb(255 159 0 / 0.6);
}
.bg-orange {
--tw-bg-opacity: 1;
background-color: rgb(255 159 0 / var(--tw-bg-opacity));
}
.bg-opacity-70 {
--tw-bg-opacity: 0.7;
}
@@ -2043,6 +2060,10 @@ input[type=file] {
color: rgb(55 65 81 / var(--tw-text-opacity));
}
.text-white\/60 {
color: rgb(255 255 255 / 0.6);
}
.text-gray-100 {
--tw-text-opacity: 1;
color: rgb(243 244 246 / var(--tw-text-opacity));
@@ -2063,10 +2084,6 @@ input[type=file] {
color: rgb(181 201 211 / var(--tw-text-opacity));
}
.text-white\/60 {
color: rgb(255 255 255 / 0.6);
}
.text-gray-500 {
--tw-text-opacity: 1;
color: rgb(107 114 128 / var(--tw-text-opacity));

View File

@@ -21,7 +21,7 @@
</div>
<div class="md:w-3/4 px-3 md:px-0 mx-3 md:mx-0">
<div class="mb-6">
<span class="inline uppercase text-green bg-green/10 rounded text-lg w-auto px-3 py-1">{% if current_version %}Current Version{% else %}Past Version{% endif %}</span>
<span class="inline uppercase {% if current_version %}text-green bg-green/10{% else %}text-orange bg-charcoal{% endif %} rounded text-lg w-auto px-3 py-1">{% if current_version %}Current Version{% else %}Past Version{% endif %}</span>
</div>
<div class="border-b border-slate py-6">

View File

@@ -36,13 +36,13 @@
<!-- Past Versions -->
<div class="rounded bg-charcoal p-3 md:p-11 mx-3 space-y-8">
<div class="mb-6">
<span class="inline uppercase text-green bg-green/10 rounded text-lg w-auto px-3 py-1">Past Versions</span>
<span class="inline uppercase text-orange bg-black rounded text-lg w-auto px-3 py-1">Past Versions</span>
</div>
{% for v in version_list %}
{% include "versions/_past_version_list_item.html" %}
{% endfor %}
</div>
<!-- End Past Versions -->