fix(FN-5012): drop mobile .btn override from PrChecksList

Fusion-Task-Id: FN-5012
Fusion-Task-Lineage: e83baffb-76ff-4317-8ff9-e576d5818a9c

packages/dashboard/app/components/PrChecksList.css

@@ -99,6 +99,20 @@
   color: var(--text);
 }
 
+.pr-checks__details-link--failing {
+  background: color-mix(in srgb, var(--color-error) 10%, transparent);
+  border: var(--btn-border-width) solid color-mix(in srgb, var(--color-error) 25%, transparent);
+  border-radius: var(--radius-sm);
+  color: var(--color-error);
+  justify-content: center;
+  padding: var(--space-2xs) var(--space-sm);
+}
+
+.pr-checks__details-link--failing:hover {
+  background: color-mix(in srgb, var(--color-error) 16%, transparent);
+  color: var(--color-error);
+}
+
 @media (max-width: 768px) {
   .pr-checks__header {
     align-items: flex-start;
@@ -109,7 +123,6 @@
     grid-template-columns: auto minmax(0, 1fr);
   }
 
-  .pr-checks__item .btn,
   .pr-checks__details-link {
     grid-column: 1 / -1;
   }

packages/dashboard/app/components/PrChecksList.tsx

@@ -103,7 +103,12 @@ export function PrChecksList({ checks, rollup: _rollup, lastCheckedAt, loading,
                   {duration ? <span className="pr-checks__duration">{duration}</span> : null}
                 </div>
                 {check.detailsUrl ? (
-                  <a href={check.detailsUrl} target="_blank" rel="noreferrer noopener" className={failing ? "btn btn-sm" : "pr-checks__details-link"}>
+                  <a
+                    href={check.detailsUrl}
+                    target="_blank"
+                    rel="noreferrer noopener"
+                    className={failing ? "pr-checks__details-link pr-checks__details-link--failing" : "pr-checks__details-link"}
+                  >
                     View details <ExternalLink />
                   </a>
                 ) : null}