fix: 쿠키런 폰트로 변경

- 기존의 국민연금 폰트는 서브셋이여서 보이지 않는 글자가 있었음(눜, 뷁)
boostcampwm-2024 · Dec 23, 2024 · b9338f8 · b9338f8
1 parent 77b03c6
commit b9338f8
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 22 deletions.
diff --git a/FE/src/features/game/components/ParticipantDisplay.tsx b/FE/src/features/game/components/ParticipantDisplay.tsx
@@ -34,9 +34,7 @@ const ParticipantDisplay: React.FC<ParticipantDisplayProps> = ({ gameState }) =>
             className="flex justify-between mt-2 pb-2 border-b border-default items-center"
             key={player.playerId}
           >
-            <div className="flex-1 font-bold truncate">
-              {player.emoji + ' ' + player.playerName}{' '}
-            </div>
+            <div className="flex-1 truncate">{player.emoji + ' ' + player.playerName} </div>
             {player.isHost && (
               <span className=" text-white bg-red-600 px-2 py-1 rounded-lg shadow-sm text-sm ml-3">
                 방장 👑
@@ -70,9 +68,7 @@ const ParticipantDisplay: React.FC<ParticipantDisplayProps> = ({ gameState }) =>
               layout
               transition={{ type: 'spring', stiffness: 100, damping: 20 }}
             >
-              <div className="flex-1 font-bold truncate">
-                {player.emoji + ' ' + player.playerName}
-              </div>
+              <div className="flex-1 truncate">{player.emoji + ' ' + player.playerName}</div>
               <motion.div
                 initial={{ scale: 1 }}
                 animate={{ scale: 1.1 }}
@@ -107,10 +103,7 @@ const ParticipantDisplay: React.FC<ParticipantDisplayProps> = ({ gameState }) =>
               layout
               transition={{ type: 'spring', stiffness: 100, damping: 20 }}
             >
-              <div
-                className="font-bold truncate"
-                style={{ color: player.isAnswer ? 'inherit' : 'red' }}
-              >
+              <div className="truncate" style={{ color: player.isAnswer ? 'inherit' : 'red' }}>
                 {(player.isAnswer ? player.emoji : '👻') + ' ' + player.playerName}
               </div>
             </motion.div>

diff --git a/FE/src/index.css b/FE/src/index.css
@@ -1,16 +1,9 @@
 @import url('https://fonts.googleapis.com/css2?family=Noto+Color+Emoji&display=swap');
-@font-face {
-  font-family: 'NPSfontBold';
-  src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/[email protected]/NPSfontBold.woff2')
-    format('woff2');
-  font-weight: 700;
-  font-style: bold;
-}
 
 @font-face {
-  font-family: 'NPSfontBold';
-  src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_2310@1.0/NPSfontRegular.woff2')
-    format('woff2');
+  font-family: 'CookieRun-Regular';
+  src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/CookieRun-Regular.woff')
+    format('woff');
   font-weight: 400;
   font-style: normal;
 }
@@ -28,9 +21,9 @@
 
 @layer base {
   html {
-    font-family: 'NPSfontBold', 'Noto Color Emoji', ui-sans-serif, system-ui;
+    font-family: 'CookieRun-Regular', 'Noto Color Emoji', ui-sans-serif, system-ui;
     box-sizing: border-box;
-    color: #5f6e76;
+    color: #687880;
   }
   *,
   *::before,