Merge branch 'refactor/user-ip' into development

Author: winverse

packages/velog-server/src/common/plugins/global/ipaddrPlugin.ts

@@ -4,8 +4,12 @@ const ipaddrPlugin: FastifyPluginAsync = async (fastify) => {
   fastify.decorateRequest('ipaddr', null)
   fastify.addHook('preHandler', (request, reply, done) => {
     const fromCdnIp = request.headers['gcdn-client-ip']
+    const xForwardedIp = request.headers['X-Forwarded-For']
+
     const graphCdnAddress = Array.isArray(fromCdnIp) ? fromCdnIp[0] : fromCdnIp
-    const ipaddr = graphCdnAddress || request.ips?.slice(-1)[0] || request.ip
+    const xForwardedForAdress = Array.isArray(xForwardedIp) ? xForwardedIp[0] : xForwardedIp
+
+    const ipaddr = xForwardedForAdress ?? graphCdnAddress ?? request.ips?.slice(-1)[0] ?? request.ip
     request.ipaddr = ipaddr
     done()
   })

packages/velog-web/src/features/home/components/HomeTab/HomeTab.module.css

@@ -75,8 +75,8 @@
       background: var(--border1);
       bottom: -10px;
 
-      @media screen and (max-width: 425px) {
-        width: 29%;
+      @media screen and (max-width: 430px) {
+        width: 34%;
         margin-left: 3px;
       }
     }

packages/velog-web/src/features/home/components/HomeTab/HomeTab.tsx

@@ -60,7 +60,7 @@ function HomeTab({ isFloatingHeader = false }: Props) {
           <motion.div
             initial={false}
             animate={{
-              left: isFeed ? '71.33%' : isRecent ? '37.33%' : '1%',
+              left: isFeed ? '68.33%' : isRecent ? '38.33%' : '2%',
             }}
             className={cx('indicator')}
           />