From d34543ebf1b3cda53fbffdacc87253ff79413ce2 Mon Sep 17 00:00:00 2001
From: kimjaehyeon0101 <47347352-kimjaehyeon0101@users.noreply.replit.com>
Date: Wed, 15 Oct 2025 07:14:24 +0000
Subject: [PATCH] Add Sapiens logo to the right side of the top navigation bar

Repositions the Sapiens logo to the top-right corner of the header across multiple pages (Article, Community, MediaOutlet, Report) and reduces its size.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 9a264234-c5d7-4dcc-adf3-a954b149b30d
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/3df548ff-50ae-432f-9be4-25d34eccc983/9a264234-c5d7-4dcc-adf3-a954b149b30d/IfFFLfD
---
 .replit                          |  4 ++
 client/src/pages/Article.tsx     | 55 ++++++++++++++--------------
 client/src/pages/Community.tsx   | 53 +++++++++++++--------------
 client/src/pages/MediaOutlet.tsx | 53 +++++++++++++--------------
 client/src/pages/Report.tsx      | 63 +++++++++++++-------------------
 5 files changed, 107 insertions(+), 121 deletions(-)

diff --git a/.replit b/.replit
index 8826cfc..3c5697d 100644
--- a/.replit
+++ b/.replit
@@ -50,6 +50,10 @@ externalPort = 3000
 localPort = 43777
 externalPort = 4200
 
+[[ports]]
+localPort = 44937
+externalPort = 6800
+
 [env]
 PORT = "5000"
 
diff --git a/client/src/pages/Article.tsx b/client/src/pages/Article.tsx
index 1d6d7d2..33b1a70 100644
--- a/client/src/pages/Article.tsx
+++ b/client/src/pages/Article.tsx
@@ -181,37 +181,36 @@ export default function Article() {
                 </div>
               )}
               {outlet && (
-                <div className="flex flex-col justify-between h-16">
-                  <div className="flex items-center h-10 cursor-pointer hover:opacity-80 transition-opacity" onClick={() => setLocation("/")}>
-                    <img 
-                      src="/attached_assets/logo_black_1759162717640.png" 
-                      alt="SAPIENS" 
-                      className="h-5 w-auto"
-                      data-testid="logo-sapiens"
-                    />
-                  </div>
-                  <div className="flex items-center space-x-2 h-6">
-                    <span className="text-sm font-bold text-gray-900" data-testid="text-outlet-name-header">
-                      {outlet.name}
-                    </span>
-                    <Button
-                      variant="outline"
-                      size="sm"
-                      onClick={(e) => {
-                        e.stopPropagation();
-                        setLocation(`/media/${outlet.slug}/report`);
-                      }}
-                      className="h-6 px-2 flex items-center gap-1 text-xs border-gray-300 hover:bg-gray-100"
-                      aria-label="View complete profile"
-                      data-testid="button-profile"
-                    >
-                      <IdCard className="h-3 w-3" />
-                      <span>About</span>
-                    </Button>
-                  </div>
+                <div className="flex items-center space-x-2">
+                  <span className="text-base font-bold text-gray-900" data-testid="text-outlet-name-header">
+                    {outlet.name}
+                  </span>
+                  <Button
+                    variant="outline"
+                    size="sm"
+                    onClick={(e) => {
+                      e.stopPropagation();
+                      setLocation(`/media/${outlet.slug}/report`);
+                    }}
+                    className="h-6 px-2 flex items-center gap-1 text-xs border-gray-300 hover:bg-gray-100"
+                    aria-label="View complete profile"
+                    data-testid="button-profile"
+                  >
+                    <IdCard className="h-3 w-3" />
+                    <span>About</span>
+                  </Button>
                 </div>
               )}
             </div>
+            <div className="flex items-center">
+              <img 
+                src="/attached_assets/logo_black_1759162717640.png" 
+                alt="SAPIENS" 
+                className="h-4 w-auto cursor-pointer opacity-60 hover:opacity-100 transition-opacity"
+                onClick={() => setLocation("/")}
+                data-testid="logo-sapiens"
+              />
+            </div>
           </div>
         </div>
       </header>
diff --git a/client/src/pages/Community.tsx b/client/src/pages/Community.tsx
index c12e031..c724a17 100644
--- a/client/src/pages/Community.tsx
+++ b/client/src/pages/Community.tsx
@@ -136,38 +136,35 @@ export default function Community() {
                   </span>
                 </div>
               )}
-              <div className="flex flex-col justify-between h-16">
-                <div className="flex items-center h-10 cursor-pointer hover:opacity-80 transition-opacity" onClick={() => setLocation(`/media/${slug}`)}>
-                  <img 
-                    src="/attached_assets/logo_black_1759162717640.png" 
-                    alt="SAPIENS" 
-                    className="h-5 w-auto"
-                    data-testid="logo-sapiens"
-                  />
-                </div>
-                <div className="flex items-center space-x-2 h-6">
-                  <span className="text-sm font-bold text-gray-900" data-testid="text-outlet-name-header">
-                    {outlet.name}
-                  </span>
-                  <Button
-                    variant="outline"
-                    size="sm"
-                    onClick={(e) => {
-                      e.stopPropagation();
-                      setLocation(`/media/${outlet.slug}/report`);
-                    }}
-                    className="h-6 px-2 flex items-center gap-1 text-xs border-gray-300 hover:bg-gray-100"
-                    aria-label="View complete profile"
-                    data-testid="button-profile"
-                  >
-                    <IdCard className="h-3 w-3" />
-                    <span>About</span>
-                  </Button>
-                </div>
+              <div className="flex items-center space-x-2">
+                <span className="text-base font-bold text-gray-900" data-testid="text-outlet-name-header">
+                  {outlet.name}
+                </span>
+                <Button
+                  variant="outline"
+                  size="sm"
+                  onClick={(e) => {
+                    e.stopPropagation();
+                    setLocation(`/media/${outlet.slug}/report`);
+                  }}
+                  className="h-6 px-2 flex items-center gap-1 text-xs border-gray-300 hover:bg-gray-100"
+                  aria-label="View complete profile"
+                  data-testid="button-profile"
+                >
+                  <IdCard className="h-3 w-3" />
+                  <span>About</span>
+                </Button>
               </div>
             </div>
             
             <div className="flex items-center space-x-4">
+              <img 
+                src="/attached_assets/logo_black_1759162717640.png" 
+                alt="SAPIENS" 
+                className="h-4 w-auto cursor-pointer opacity-60 hover:opacity-100 transition-opacity"
+                onClick={() => setLocation("/")}
+                data-testid="logo-sapiens"
+              />
               <div 
                 className="relative cursor-pointer"
                 onClick={() => setIsSearchModalOpen(true)}
diff --git a/client/src/pages/MediaOutlet.tsx b/client/src/pages/MediaOutlet.tsx
index 173b085..f7c4d98 100644
--- a/client/src/pages/MediaOutlet.tsx
+++ b/client/src/pages/MediaOutlet.tsx
@@ -207,38 +207,35 @@ export default function MediaOutlet() {
                   </span>
                 </div>
               )}
-              <div className="flex flex-col justify-between h-16">
-                <div className="flex items-center h-10 cursor-pointer hover:opacity-80 transition-opacity" onClick={() => setLocation("/")}>
-                  <img 
-                    src="/attached_assets/logo_black_1759162717640.png" 
-                    alt="SAPIENS" 
-                    className="h-5 w-auto"
-                    data-testid="logo-sapiens"
-                  />
-                </div>
-                <div className="flex items-center space-x-2 h-6">
-                  <span className="text-sm font-bold text-gray-900" data-testid="text-outlet-name-header">
-                    {outlet.name}
-                  </span>
-                  <Button
-                    variant="outline"
-                    size="sm"
-                    onClick={(e) => {
-                      e.stopPropagation();
-                      setLocation(`/media/${outlet.slug}/report`);
-                    }}
-                    className="h-6 px-2 flex items-center gap-1 text-xs border-gray-300 hover:bg-gray-100"
-                    aria-label="View complete profile"
-                    data-testid="button-profile"
-                  >
-                    <IdCard className="h-3 w-3" />
-                    <span>About</span>
-                  </Button>
-                </div>
+              <div className="flex items-center space-x-2">
+                <span className="text-base font-bold text-gray-900" data-testid="text-outlet-name-header">
+                  {outlet.name}
+                </span>
+                <Button
+                  variant="outline"
+                  size="sm"
+                  onClick={(e) => {
+                    e.stopPropagation();
+                    setLocation(`/media/${outlet.slug}/report`);
+                  }}
+                  className="h-6 px-2 flex items-center gap-1 text-xs border-gray-300 hover:bg-gray-100"
+                  aria-label="View complete profile"
+                  data-testid="button-profile"
+                >
+                  <IdCard className="h-3 w-3" />
+                  <span>About</span>
+                </Button>
               </div>
             </div>
             
             <div className="flex items-center space-x-4">
+              <img 
+                src="/attached_assets/logo_black_1759162717640.png" 
+                alt="SAPIENS" 
+                className="h-4 w-auto cursor-pointer opacity-60 hover:opacity-100 transition-opacity"
+                onClick={() => setLocation("/")}
+                data-testid="logo-sapiens"
+              />
               <div 
                 className="relative cursor-pointer"
                 onClick={() => setIsSearchModalOpen(true)}
diff --git a/client/src/pages/Report.tsx b/client/src/pages/Report.tsx
index 0853ce1..58a6d7c 100644
--- a/client/src/pages/Report.tsx
+++ b/client/src/pages/Report.tsx
@@ -474,48 +474,37 @@ export default function Report() {
                       </span>
                     </div>
                   )}
-                  <div className="flex flex-col justify-between h-16">
-                    <div className="flex items-center h-10 cursor-pointer hover:opacity-80 transition-opacity" onClick={() => setLocation("/")}>
-                      <img 
-                        src="/attached_assets/logo_black_1759162717640.png" 
-                        alt="SAPIENS" 
-                        className="h-5 w-auto"
-                        data-testid="logo-sapiens"
-                      />
-                    </div>
-                    <div className="flex items-center space-x-2 h-6">
-                      <span className="text-sm font-bold text-gray-900" data-testid="text-outlet-name-header">
-                        {outlet.name}
-                      </span>
-                      <Button
-                        variant="outline"
-                        size="sm"
-                        onClick={(e) => {
-                          e.stopPropagation();
-                          setLocation(`/media/${outlet.slug}/report`);
-                        }}
-                        className="h-6 px-2 flex items-center gap-1 text-xs border-gray-300 hover:bg-gray-100"
-                        aria-label="View complete profile"
-                        data-testid="button-profile"
-                      >
-                        <IdCard className="h-3 w-3" />
-                        <span>About</span>
-                      </Button>
-                    </div>
+                  <div className="flex items-center space-x-2">
+                    <span className="text-base font-bold text-gray-900" data-testid="text-outlet-name-header">
+                      {outlet.name}
+                    </span>
+                    <Button
+                      variant="outline"
+                      size="sm"
+                      onClick={(e) => {
+                        e.stopPropagation();
+                        setLocation(`/media/${outlet.slug}/report`);
+                      }}
+                      className="h-6 px-2 flex items-center gap-1 text-xs border-gray-300 hover:bg-gray-100"
+                      aria-label="View complete profile"
+                      data-testid="button-profile"
+                    >
+                      <IdCard className="h-3 w-3" />
+                      <span>About</span>
+                    </Button>
                   </div>
                 </>
-              ) : (
-                <img 
-                  src="/attached_assets/logo_black_1759162717640.png" 
-                  alt="SAPIENS" 
-                  className="h-6 w-auto cursor-pointer"
-                  onClick={() => setLocation("/")}
-                  data-testid="logo-sapiens"
-                />
-              )}
+              ) : null}
             </div>
             
             <div className="flex items-center space-x-4">
+              <img 
+                src="/attached_assets/logo_black_1759162717640.png" 
+                alt="SAPIENS" 
+                className="h-4 w-auto cursor-pointer opacity-60 hover:opacity-100 transition-opacity"
+                onClick={() => setLocation("/")}
+                data-testid="logo-sapiens"
+              />
               <div 
                 className="relative cursor-pointer"
                 onClick={() => setIsSearchModalOpen(true)}