chore: ui fixes for proof of work

stakwork · Jan 4, 2025 · ad58497 · ad58497
1 parent 47cf11e
commit ad58497
Show file tree

Hide file tree

Showing 2 changed files with 21 additions and 4 deletions.
diff --git a/src/people/widgetViews/summaries/wantedSummaries/CodingBounty.tsx b/src/people/widgetViews/summaries/wantedSummaries/CodingBounty.tsx
@@ -881,10 +881,25 @@ function MobileView(props: CodingBountiesProps) {
                         {proofs[bountyID]?.length ? (
                           <ul>
                             {proofs[bountyID].map((proof: any, index: any) => (
-                              <li
-                                key={index}
-                                dangerouslySetInnerHTML={{ __html: proof.description }}
-                              />
+                              <li key={index}>
+                                {proof.description
+                                  .split(/(https?:\/\/[^\s]+)/)
+                                  .map((part: string, i: number) => {
+                                    if (part.match(/https?:\/\/[^\s]+/)) {
+                                      return (
+                                        <a
+                                          key={i}
+                                          href={part}
+                                          target="_blank"
+                                          rel="noopener noreferrer"
+                                        >
+                                          {part}
+                                        </a>
+                                      );
+                                    }
+                                    return part;
+                                  })}
+                              </li>
                             ))}
                           </ul>
                         ) : (

diff --git a/src/people/widgetViews/summaries/wantedSummaries/style.ts b/src/people/widgetViews/summaries/wantedSummaries/style.ts
@@ -325,6 +325,7 @@ export const ProofContainer = styled.div`
 
 export const Section = styled.div`
   flex: 1;
+  margin-top: 60px;
 `;
 
 export const Title = styled.h2`
@@ -339,6 +340,7 @@ export const Description = styled.span`
   line-height: 1.5;
   resize: vertical;
   margin-bottom: 16px;
+  max-width: 70%;
 `;
 
 export const Link = styled.a`