From 6ccbc076283c32fb70a2576456a9ca4404c98e92 Mon Sep 17 00:00:00 2001
From: Thomas Smith <49042513+tsmitty11@users.noreply.github.com>
Date: Fri, 17 Feb 2023 18:19:25 -0500
Subject: [PATCH] Additional cleanup on packages

---
 src/layouts/partials/package-thumbnail.html | 253 ++++----------------
 1 file changed, 48 insertions(+), 205 deletions(-)

diff --git a/src/layouts/partials/package-thumbnail.html b/src/layouts/partials/package-thumbnail.html
index 3ef1e04..68ab223 100644
--- a/src/layouts/partials/package-thumbnail.html
+++ b/src/layouts/partials/package-thumbnail.html
@@ -1,13 +1,13 @@
 
-  <div class="card card-thumbnail" style="width: 100%" data-name="{{- .name -}}" data-popularity="{{- .dl_count -}}" data-last_modified="{{- .last_modified -}}" data-description="{{- .desc -}}">
+  <div class="card card-thumbnail p-3" style="width: 100%" data-name="{{- .name -}}" data-popularity="{{- .dl_count -}}" data-last_modified="{{- .last_modified -}}" data-description="{{- .desc -}}">
     <a href="/+{{- lower .full_name -}}/">
       <figure class="card-img-top" >
         <img class="package-image" src="{{- .thumb_image_url -}}" alt="{{- .name -}}" style="width:100%; height:100%;">
-        <article class="card-thumb-label">
+        <article class="card-thumb-label p-4">
           <i class="icon-tea-logo-iconasset-1"></i>
           <h3>{{- .name -}}</h3>
           {{ if not (eq .maintainer "") }}
-            <h4>&#x2022;&nbsp;{{- .maintainer -}}</h4>
+            <p class="small black">&#x2022;&nbsp;{{- .maintainer -}}</p>
           {{end}}
         </article>
       </figure>
@@ -66,219 +66,62 @@ div.card.card-thumbnail{
 
 }
 
-
-
-@media only screen and (min-width: 992px) {
-
-  .card-thumb-label i{
-    font-size: 1.5vw;
-  }
-
-  .card-thumb-label {
-    position: absolute;
-    background: rgba(255,255,255,0.9);
-    left: 0;
-    bottom: 0vw;
-    padding: 1.116vw;
-    text-align: left;
-    width: 90%;
-    height: 40;
-  }
-
-  .card-thumb-label h3 {
-    color: black;
-    font-size: 1.8vw;
-    line-height: 1.8vw;
-    margin: 0px 0px 0.5vw 0vw;
-    padding: 0px;
-  }
-
-  .card-thumb-label h4 {
-    color: black;
-    font-size: .9vw;
-    line-height: 1vw;
-    margin: 0px;
-    padding: 0px;
-  }
-
-  .card-thumbnail{
-    background: none;
-    border-radius: 0px !important;
-    border: 1px solid #949494;
-    padding: 1.674vw;
-  }
-
-  .thumbnail-body{
-    display: flex;
-    border-radius: 0px !important;
-    padding: 0vw;
-    justify-content: space-between;
-  }
-
-  .card-img-top{
-    border-radius: 0px;
-    margin-bottom: 1.674vw;
-  }
-
-  .card-text{
-    font-size: 0.781vw;
-    float:left;
-    position: relative;
-    top:0.502vw;
-  }
-
-  .card-text-container{
-    float:left;
-    position: relative;
-    width:48%;
-  }
-
-  .thumbnail-body-mobile{
-    display: none;
-  }
-
+.card-thumb-label i{
 }
 
-@media only screen and (min-width: 768px) and (max-width: 992px) {
-
-  .card-thumb-label i{
-    font-size: 2vw;
-  }
-
-  .card-thumb-label {
-    position: absolute;
-    background: rgba(255,255,255,0.9);
-    left: 0;
-    bottom: 0vw;
-    padding: 1.116vw;
-    text-align: left;
-    width: 90%;
-    height: 40%;
-  }
-
-  .card-thumb-label h3 {
-    color: black;
-    font-size: 2.8vw;
-    line-height: 2.8vw;
-    margin: 0px 0px 1vw 0vw;
-    padding: 0px;
-  }
-
-  .card-thumb-label h4 {
-    color: black;
-    font-size: 1.5vw;
-    line-height: 1.5vw;
-    margin: 0px;
-    padding: 0px;
-  }
-
-  .card-thumbnail{
-    background: none;
-    border-radius: 0px !important;
-    border: 1px solid #949494;
-    padding: 1.674vw;
-  }
-
-  .thumbnail-body{
-    display: flex;
-    border-radius: 0px !important;
-    padding: 0vw;
-    justify-content: space-between;
-  }
-
-  .card-img-top{
-    border-radius: 0px;
-    margin-bottom: 1.674vw;
-  }
-
-  .card-text{
-    font-size: 0.781vw;
-    float:left;
-    position: relative;
-    top:0.502vw;
-  }
-
-  .card-text-container{
-    float:left;
-    position: relative;
-    width:48%;
-  }
-
-  .thumbnail-body-mobile{
-    display: none;
-  }
-
+.card-thumb-label {
+  position: absolute;
+  background: rgba(255,255,255,0.9);
+  left: 0;
+  bottom: 0px;
+  text-align: left;
+  width: 90%;
+  height: auto;
+  min-height: 50%;
 }
 
-@media only screen and (min-width: 576px) and (max-width: 768px) {
+.card-thumb-label h3 {
+  color: black;
+  padding: 0px;
+  font-size: 1.5rem;
+}
 
-  .card-thumb-label i{
-    font-size: 2.5vw;
-  }
+.card-thumb-label h4 {
+  color: black;
+  margin: 0px;
+  padding: 0px;
+}
 
-  .card-thumb-label {
-    position: absolute;
-    background: rgba(255,255,255,0.9);
-    left: 0;
-    bottom: 0vw;
-    padding: 1.116vw;
-    text-align: left;
-    width: 90%;
-    height: 40%;
-  }
+.card-thumbnail{
+  background: none;
+  border-radius: 0px !important;
+  border: 1px solid #949494;
+}
 
-  .card-thumb-label h3 {
-    color: black;
-    font-size: 3vw;
-    line-height: 3vw;
-    margin: 0px 0px 0.5vw 0vw;
-    padding: 0px;
-  }
+.thumbnail-body{
+  display: flex;
+  border-radius: 0px !important;
+  padding: 0vw;
+  justify-content: space-between;
+}
 
-  .card-thumb-label h4 {
-    color: black;
-    font-size: 1.5vw;
-    line-height: 1.5vw;
-    margin: 0px;
-    padding: 0px;
-  }
+.card-img-top{
+  border-radius: 0px;
+}
 
-  .card-thumbnail{
-    background: none;
-    border-radius: 0px !important;
-    border: 1px solid #949494;
-    padding: 1.674vw;
-  }
+.card-text{
+  float:left;
+  position: relative;
+}
 
-  .thumbnail-body{
-    display: flex;
-    border-radius: 0px !important;
-    padding: 0vw;
-    justify-content: space-between;
-  }
-
-  .card-img-top{
-    border-radius: 0px;
-    margin-bottom: 1.674vw;
-  }
-
-  .card-text{
-    font-size: 0.781vw;
-    float:left;
-    position: relative;
-    top:0.502vw;
-  }
-
-  .card-text-container{
-    float:left;
-    position: relative;
-    width:48%;
-  }
-
-  .thumbnail-body-mobile{
-    display: none;
-  }
+.card-text-container{
+  float:left;
+  position: relative;
+  width:48%;
+}
 
+.thumbnail-body-mobile{
+  display: none;
 }
 
 @media only screen and (max-width: 576px) {