Merge pull request #772 from near/develop

deploy a fix to the Create Account CTA
near · Apr 18, 2024 · 0983e88 · 0983e88
2 parents 2492e54 + d6c5619
commit 0983e88
Show file tree

Hide file tree

Showing 6 changed files with 30 additions and 59 deletions.
diff --git a/src/ComponentCard.jsx b/src/ComponentCard.jsx
@@ -17,11 +17,6 @@ const Card = styled.div`
   overflow: hidden;
 `;
 
-const Icon = styled.i`
-  height: 18px;
-  width: 18px;
-`;
-
 const CardBody = styled.div`
   padding: 16px;
   display: flex;
@@ -85,11 +80,11 @@ const TextLink = styled("Link")`
   margin: 0;
   font-size: 14px;
   line-height: 18px;
-  color: ${(p) => (p.bold ? "#11181C !important" : "#687076 !important")};
-  font-weight: ${(p) => (p.bold ? "600" : "400")};
-  font-size: ${(p) => (p.small ? "12px" : "14px")};
-  overflow: ${(p) => (p.ellipsis ? "hidden" : "visible")};
-  text-overflow: ${(p) => (p.ellipsis ? "ellipsis" : "unset")};
+  color: ${(p) => (p.$bold ? "#11181C !important" : "#687076 !important")};
+  font-weight: ${(p) => (p.$bold ? "600" : "400")};
+  font-size: ${(p) => (p.$small ? "12px" : "14px")};
+  overflow: ${(p) => (p.$ellipsis ? "hidden" : "visible")};
+  text-overflow: ${(p) => (p.$ellipsis ? "ellipsis" : "unset")};
   white-space: nowrap;
   outline: none;
 
@@ -99,22 +94,6 @@ const TextLink = styled("Link")`
   }
 `;
 
-const Text = styled.p`
-  margin: 0;
-  font-size: 14px;
-  line-height: 20px;
-  color: ${(p) => (p.bold ? "#11181C" : "#687076")};
-  font-weight: ${(p) => (p.bold ? "600" : "400")};
-  font-size: ${(p) => (p.small ? "12px" : "14px")};
-  overflow: ${(p) => (p.ellipsis ? "hidden" : "")};
-  text-overflow: ${(p) => (p.ellipsis ? "ellipsis" : "")};
-  white-space: nowrap;
-
-  i {
-    margin-right: 3px;
-  }
-`;
-
 const Thumbnail = styled("Link")`
   display: block;
   width: 60px;
@@ -153,7 +132,7 @@ const ButtonLink = styled("Link")`
   line-height: 15px;
   text-align: center;
   cursor: pointer;
-  color: ${(p) => (p.primary ? "#006ADC" : "#11181C")} !important;
+  color: ${(p) => (p.$primary ? "#006ADC" : "#11181C")} !important;
   background: #fbfcfd;
   white-space: nowrap;
 
@@ -169,7 +148,7 @@ return (
   <Card>
     {!props.hideBlockHeightTimestamp && (
       <CardTag>
-        <i className="bi bi-clock"></i>{" "}
+        <i className="bi bi-clock" />{" "}
         <Widget
           src="${REPL_MOB_2}/widget/TimeAgo${REPL_TIME_AGO_VERSION}"
           props={{
@@ -196,11 +175,11 @@ return (
       </Thumbnail>
 
       <CardContent>
-        <TextLink href={detailsUrl} bold ellipsis>
+        <TextLink href={detailsUrl} $bold $ellipsis>
           {metadata.name || widgetName}
         </TextLink>
 
-        <TextLink small href={accountUrl} ellipsis>
+        <TextLink href={accountUrl} $small $ellipsis>
           @{accountId}
         </TextLink>
 
@@ -221,10 +200,10 @@ return (
     {(props?.metadata?.star_count > 0 || props?.metadata?.fork_count > 0) && (
       <CardMetaDataContainer>
         <MetaDataItem>
-          <i class="ph ph-star"></i> <p>{props.metadata.star_count === 0 ? "-" : props.metadata.star_count}</p>
+          <i className="ph ph-star" /> <p>{props.metadata.star_count === 0 ? "-" : props.metadata.star_count}</p>
         </MetaDataItem>
         <MetaDataItem>
-          <i class="ph ph-git-fork"></i>
+          <i className="ph ph-git-fork" />
           <p>{props.metadata.fork_count === 0 ? "-" : props.metadata.fork_count}</p>
         </MetaDataItem>
       </CardMetaDataContainer>
@@ -233,7 +212,7 @@ return (
     {!props.hideButtons && (
       <CardFooter>
         <ButtonLink href={detailsUrl}>View Details</ButtonLink>
-        <ButtonLink href={appUrl} primary>
+        <ButtonLink href={appUrl} $primary>
           Open
         </ButtonLink>
       </CardFooter>

diff --git a/src/ComponentSummary.jsx b/src/ComponentSummary.jsx
@@ -357,7 +357,7 @@ return (
                         </>
                       ) : (
                         <>
-                          <i class="ph ph-push-pin" style={{ fontSize: "1rem" }} />
+                          <i className="ph ph-push-pin" style={{ fontSize: "1rem" }} />
                           Pin
                         </>
                       )}

diff --git a/src/NearOrg/BlockchainPage.jsx b/src/NearOrg/BlockchainPage.jsx
@@ -252,7 +252,7 @@ return (
                   <Widget
                     src="${REPL_ACCOUNT}/widget/DIG.Button"
                     props={{
-                      href: "/${REPL_NEARCATALOG}/widget/Index?requestAuth=1&createAccount=1",
+                      href: "/signup",
                       label: "Create Account",
                       variant: "secondary",
                       fill: "outline",
@@ -438,7 +438,7 @@ return (
             <Widget
               src="${REPL_ACCOUNT}/widget/DIG.Button"
               props={{
-                href: "/${REPL_NEARCATALOG}/widget/Index?requestAuth=1&createAccount=1",
+                href: "/signup",
                 label: "Create Account",
                 variant: "secondary",
                 size: "large",

diff --git a/src/NearOrg/CookiePrompt.jsx b/src/NearOrg/CookiePrompt.jsx
@@ -83,7 +83,7 @@ return (
       props={{
         content: (
           <CustomizeDialogContent>
-            <div class="info">
+            <div className="info">
               <div>
                 <h2>Necessary Cookies</h2>
                 <p>
@@ -142,7 +142,7 @@ return (
       </Link>
       .{" "}
     </p>
-    <div class="buttons">
+    <div className="buttons">
       <Widget
         src="${REPL_ACCOUNT}/widget/DIG.Button"
         props={{

diff --git a/src/NearOrg/HomePage.jsx b/src/NearOrg/HomePage.jsx
@@ -530,7 +530,7 @@ return (
                 <Widget
                   src="${REPL_ACCOUNT}/widget/DIG.Button"
                   props={{
-                    href: "/${REPL_NEARCATALOG}/widget/Index?requestAuth=1&createAccount=1",
+                    href: "/signup",
                     label: "Create Account",
                     variant: "affirmative",
                     size: "large",

diff --git a/src/News/NearweekSidebarFeed.jsx b/src/News/NearweekSidebarFeed.jsx
@@ -82,20 +82,6 @@ const H2 = styled.h2`
   margin: 0;
 `;
 
-const ClockIconSVG = () => {
-  return (
-    <svg width="10" height="10" viewBox="0 0 10 10" fill="none" xmlns="http://www.w3.org/2000/svg">
-      <path
-        d="M4.91345 2.39779V5.19946H7.01471M9.11597 5.19946C9.11597 5.75134 9.00727 6.29782 8.79607 6.8077C8.58487 7.31757 8.27532 7.78085 7.88508 8.17109C7.49484 8.56133 7.03156 8.87088 6.52168 9.08208C6.01181 9.29328 5.46533 9.40198 4.91345 9.40198C4.36157 9.40198 3.81509 9.29328 3.30522 9.08208C2.79535 8.87088 2.33206 8.56133 1.94183 8.17109C1.55159 7.78085 1.24203 7.31757 1.03083 6.8077C0.819639 6.29782 0.710937 5.75134 0.710938 5.19946C0.710938 4.08489 1.1537 3.01596 1.94183 2.22784C2.72995 1.43971 3.79888 0.996948 4.91345 0.996948C6.02803 0.996948 7.09695 1.43971 7.88508 2.22784C8.6732 3.01596 9.11597 4.08489 9.11597 5.19946Z"
-        stroke="#6F7679"
-        stroke-width="0.7"
-        stroke-linecap="round"
-        stroke-linejoin="round"
-      />
-    </svg>
-  );
-};
-
 const Content = styled.div`
   display: grid;
   margin: 36px 0 24px 0;
@@ -106,7 +92,7 @@ const Content = styled.div`
 const Card = styled.div`
   display: flex;
   @media (max-width: 768px) {
-    display: ${(props) => (props.index > 4 ? "none" : "flex")};
+    display: ${(props) => (props.$index > 4 ? "none" : "flex")};
   }
 `;
 
@@ -138,6 +124,8 @@ const CardTitle = styled.div`
 const CardImage = styled.img`
   border-radius: var(--bs-border-radius);
   border: 0.5px solid hsla(210, 12%, 93%, 1);
+  width: ${(p) => p.$width}px;
+  height: ${(p) => p.$height}px;
 `;
 
 const CardFooter = styled.div`
@@ -158,6 +146,10 @@ const CardDate = styled.div`
   letter-spacing: -0.02em;
 `;
 
+const ClockIcon = styled.i`
+  font-size: 11px;
+`;
+
 const Badges = styled.div`
   display: flex;
   gap: 6px;
@@ -225,9 +217,9 @@ return (
         <H2>News</H2>
         <Content>
           {news.map((item, index) => (
-            <Card index={index}>
-              <div class="d-flex flex-grow-1">
-                <CardImage width="78" height="78" src={item.thumbnail} alt="" />
+            <Card key={`${item.title?.substring(0, 8)?.replace(/ /g, "_")}_${index}`} $index={index}>
+              <div className="d-flex flex-grow-1">
+                <CardImage $width="78" $height="78" src={item.thumbnail} alt="" />
                 <CardContent>
                   <CardTitle>
                     <a href={item.url} target="_blank" rel="noreferrer noopener">
@@ -239,7 +231,7 @@ return (
                       {item.categories.length > 0 && item.categories.map((category) => <Badge>{category}</Badge>)}
                     </Badges>
                     <CardDate>
-                      <ClockIconSVG />
+                      <ClockIcon className="ph ph-clock" />
                       {item.createdAt ? `${dateToDays(item.createdAt)} ago` : ""}
                     </CardDate>
                   </CardFooter>
@@ -248,7 +240,7 @@ return (
             </Card>
           ))}
         </Content>
-        <ButtonLink href="https://near.org/nearweekapp.near/widget/nearweek.com" target="_blank">
+        <ButtonLink href="${REPL_NEARWEEK}/widget/nearweek.com" target="_blank">
           View All News
         </ButtonLink>
       </Wrapper>