Cleanup Summary UI

apps/api/src/lib/rating.ts

@@ -85,7 +85,7 @@ const getOpenAiLongSummary = async (issueSummary: object) => {
     },
     {
       role: "user",
-      content: `Here's a summary of issues found in an OpenAPI file. The format is a JSON, where the first level indicates the severity of the issue (the lower the key, the more severe), the second level is the name of the issue. These mostly match up to existing spectral rulesets, so you can infer what the issue is. The third level contains the number of occurrences of that issue.\n\nI would like a succinct summary of the issues and advice on how to fix them.  Focus on the most common issues and the highest severity. Keep the tone casual and playful, and a bit snarky. Also, no bullet points. Maximum of 3 issues please. Rank by severity and then occurrences.\n\nHere's the issue summary\n ${JSON.stringify(
+      content: `Here's a summary of issues found in an OpenAPI file. The format is a JSON, where the first level indicates the severity of the issue (the lower the key, the more severe), the second level is the name of the issue. These mostly match up to existing spectral rulesets, so you can infer what the issue is. The third level contains the number of occurrences of that issue.\n\nI would like a succinct summary of the issues and advice on how to fix them.  Focus on the most common issues and the highest severity. Keep the tone casual and playful, and a bit snarky. Do not insult the user or API creator or the API. Also, no bullet points. Maximum of 3 issues please. Rank by severity and then occurrences.\n\nHere's the issue summary\n ${JSON.stringify(
         issueSummary,
       )}`,
     },

apps/web/src/app/report/[id]/report-summary.tsx

@@ -27,10 +27,10 @@ const ReportSummary = ({
         {isExpanded ? longSummary : shortSummary}
       </p>
       <button
-        className="mt-4 text-blue-500 hover:text-blue-700"
+        className="button-transparent mt-4"
         onClick={() => setIsExpanded(!isExpanded)}
       >
-        {isExpanded ? "Show less" : "Show more"}
+        {isExpanded ? "Hide advice" : "Show advice"}
       </button>
     </div>
   );

apps/web/src/components/DetailedScoreSection/index.tsx

@@ -121,6 +121,7 @@ const DetailedScoreSection = ({
                   <td
                     className="flex cursor-pointer flex-wrap items-center gap-1 md:flex-nowrap"
                     onClick={() => handleViewClick(issue)}
+                    title={"Click to view issue details"}
                   >
                     <div className="flex flex-row items-center">
                       <span className="block overflow-hidden break-words hover:underline">