Merge branch 'main' into feat-feed-article-markdown

TERITORI · Dec 12, 2024 · 28d91d1 · 28d91d1
2 parents d82e7a7 + bcf227a
commit 28d91d1
Show file tree

Hide file tree

Showing 7 changed files with 30 additions and 16 deletions.
diff --git a/packages/components/mediaPlayer/MediaPlayerVideo.tsx b/packages/components/mediaPlayer/MediaPlayerVideo.tsx
@@ -44,7 +44,7 @@ import { web3ToWeb2URI } from "@/utils/ipfs";
 import { prettyMediaDuration } from "@/utils/mediaPlayer";
 import { SOCIAl_CARD_BORDER_RADIUS } from "@/utils/social-feed";
 import { neutral00, neutralA3, secondaryColor } from "@/utils/style/colors";
-import { fontSemibold13 } from "@/utils/style/fonts";
+import { fontRegular13 } from "@/utils/style/fonts";
 import { layout } from "@/utils/style/layout";
 import { SocialFeedVideoMetadata } from "@/utils/types/feed";
 import { Media } from "@/utils/types/mediaPlayer";
@@ -392,7 +392,7 @@ function MediaPlayerController({
             )}
 
             {/* Display time */}
-            <BrandText style={fontSemibold13}>
+            <BrandText style={fontRegular13}>
               {`${prettyMediaDuration(
                 playbackStatus?.positionMillis,
               )} / ${prettyMediaDuration(playbackStatus?.durationMillis)}`}

diff --git a/packages/components/mediaPlayer/TimerSlider.tsx b/packages/components/mediaPlayer/TimerSlider.tsx
@@ -11,7 +11,7 @@ import {
   primaryColor,
   secondaryColor,
 } from "../../utils/style/colors";
-import { fontSemibold12 } from "../../utils/style/fonts";
+import { fontRegular12 } from "../../utils/style/fonts";
 import { BrandText } from "../BrandText";
 import { CustomPressable } from "../buttons/CustomPressable";
 import { SpacerRow } from "../spacer";
@@ -92,6 +92,6 @@ export const TimerSlider: FC<{
 };
 
 const timeTextStyle: TextStyle = {
-  ...fontSemibold12,
+  ...fontRegular12,
   color: neutral77,
 };
diff --git a/packages/components/socialFeed/SocialActions/DislikeButton.tsx b/packages/components/socialFeed/SocialActions/DislikeButton.tsx
@@ -7,7 +7,7 @@ import { Post } from "../../../api/feed/v1/feed";
 import { useSocialReactions } from "../../../hooks/feed/useSocialReactions";
 import { DISLIKE_EMOJI } from "../../../utils/social-feed";
 import { neutral22, secondaryColor } from "../../../utils/style/colors";
-import { fontSemibold13 } from "../../../utils/style/fonts";
+import { fontRegular13 } from "../../../utils/style/fonts";
 import { layout } from "../../../utils/style/layout";
 import { BrandText } from "../../BrandText";
 import { SVG } from "../../SVG";
@@ -44,7 +44,7 @@ export const DislikeButton: FC<{
         color={secondaryColor}
       />
       <SpacerRow size={0.75} />
-      <BrandText style={fontSemibold13}>
+      <BrandText style={fontRegular13}>
         {post.reactions.find((reaction) => reaction.icon === DISLIKE_EMOJI)
           ?.count || 0}
       </BrandText>

diff --git a/packages/components/socialFeed/SocialActions/LikeButton.tsx b/packages/components/socialFeed/SocialActions/LikeButton.tsx
@@ -7,7 +7,7 @@ import { Post } from "../../../api/feed/v1/feed";
 import { useSocialReactions } from "../../../hooks/feed/useSocialReactions";
 import { LIKE_EMOJI } from "../../../utils/social-feed";
 import { neutral22, secondaryColor } from "../../../utils/style/colors";
-import { fontSemibold13 } from "../../../utils/style/fonts";
+import { fontRegular13 } from "../../../utils/style/fonts";
 import { layout } from "../../../utils/style/layout";
 import { BrandText } from "../../BrandText";
 import { SVG } from "../../SVG";
@@ -39,7 +39,7 @@ export const LikeButton: FC<{
     >
       <SVG source={thumbUpSVG} height={20} width={20} color={secondaryColor} />
       <SpacerRow size={0.75} />
-      <BrandText style={fontSemibold13}>
+      <BrandText style={fontRegular13}>
         {post.reactions.find((reaction) => reaction.icon === LIKE_EMOJI)
           ?.count || 0}
       </BrandText>

diff --git a/packages/components/socialFeed/SocialActions/ShareButton.tsx b/packages/components/socialFeed/SocialActions/ShareButton.tsx
@@ -9,7 +9,7 @@ import {
   neutralA3,
   secondaryColor,
 } from "../../../utils/style/colors";
-import { fontSemibold13 } from "../../../utils/style/fonts";
+import { fontRegular13 } from "../../../utils/style/fonts";
 import { layout } from "../../../utils/style/layout";
 import { BrandText } from "../../BrandText";
 import { SVG } from "../../SVG";
@@ -75,7 +75,7 @@ export const ShareButton = ({ postId, useAltStyle }: ShareButtonProps) => {
           <>
             <SpacerRow size={0.75} />
             <BrandText
-              style={[fontSemibold13, useAltStyle && { color: neutralA3 }]}
+              style={[fontRegular13, useAltStyle && { color: neutralA3 }]}
             >
               Share
             </BrandText>

diff --git a/packages/components/socialFeed/SocialCard/cards/SocialVideoCard.tsx b/packages/components/socialFeed/SocialCard/cards/SocialVideoCard.tsx
@@ -29,10 +29,10 @@ import {
   withAlpha,
 } from "@/utils/style/colors";
 import {
+  fontRegular14,
+  fontRegular16,
+  fontRegular20,
   fontSemibold13,
-  fontSemibold14,
-  fontSemibold16,
-  fontSemibold20,
 } from "@/utils/style/fonts";
 import { layout, SOCIAL_FEED_BREAKPOINT_M } from "@/utils/style/layout";
 import {
@@ -126,8 +126,8 @@ export const SocialVideoCard: FC<{
             numberOfLines={2}
             style={
               windowWidth < SOCIAL_FEED_BREAKPOINT_M
-                ? fontSemibold16
-                : fontSemibold20
+                ? fontRegular16
+                : fontRegular20
             }
           >
             {title?.trim()}
@@ -184,7 +184,7 @@ export const SocialVideoCard: FC<{
 
           <SpacerColumn size={1.5} />
           <BrandText
-            style={[fontSemibold14, { color: neutralA3 }]}
+            style={[fontRegular14, { color: neutralA3 }]}
             numberOfLines={windowWidth < SOCIAL_FEED_BREAKPOINT_M ? 2 : 3}
           >
             {description.trim()}

diff --git a/packages/utils/style/fonts.ts b/packages/utils/style/fonts.ts
@@ -222,6 +222,20 @@ export const fontNormal15: TextStyle = {
   fontFamily: "Exo_500Medium",
   fontWeight: "400",
 };
+export const fontRegular20: TextStyle = {
+  fontSize: 20,
+  letterSpacing: -(20 * 0.02),
+  lineHeight: 22,
+  fontFamily: "Exo_400Regular",
+  fontWeight: "400",
+};
+export const fontRegular16: TextStyle = {
+  fontSize: 16,
+  letterSpacing: -(16 * 0.02),
+  lineHeight: 18,
+  fontFamily: "Exo_400Regular",
+  fontWeight: "400",
+};
 export const fontRegular15: TextStyle = {
   fontSize: 15,
   letterSpacing: -(15 * 0.02),