aimond/sapiens-web3
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Adjust header layout to better align logos and media outlet names

Browse Source 
Modify CSS classes in MediaOutlet.tsx and Report.tsx to adjust the size and alignment of the SAPIENS logo, media outlet name, and info icon within the header component.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 0fb68265-c270-4198-9584-3d9be9bddb41
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/3df548ff-50ae-432f-9be4-25d34eccc983/0fb68265-c270-4198-9584-3d9be9bddb41/sXqrCAq
This commit is contained in:
kimjaehyeon0101
2025-09-30 06:32:37 +00:00
parent 8d65ae3d35
commit 2b85324a5e
3 changed files with 12 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
.replit
View File

@ -18,10 +18,6 @@ externalPort = 80
localPort = 34047
externalPort = 3002
[[ports]]
localPort = 35303
externalPort = 4200
[[ports]]
localPort = 37531
externalPort = 3001

12
client/src/pages/MediaOutlet.tsx
View File

@ -71,10 +71,10 @@ export default function MediaOutlet() {
<header className="bg-white border-b border-gray-200 sticky top-0 z-50">
<div className="max-w-7xl mx-auto px-6 py-4">
<div className="flex items-center justify-between">
<div className="flex items-center space-x-3">
<div className="flex items-start space-x-3">
<div className="w-10 h-10 bg-gray-200 rounded-full animate-pulse"></div>
<div className="flex flex-col">
<div className="h-3 w-20 bg-gray-200 rounded animate-pulse mb-1"></div>
<div className="h-5 w-20 bg-gray-200 rounded animate-pulse mb-1"></div>
<div className="h-3 w-16 bg-gray-200 rounded animate-pulse"></div>
</div>
</div>
@ -189,7 +189,7 @@ export default function MediaOutlet() {
<header className="bg-white border-b border-gray-200 sticky top-0 z-50">
<div className="max-w-7xl mx-auto px-6 py-4">
<div className="flex items-center justify-between">
<div className="flex items-center space-x-3">
<div className="flex items-start space-x-3">
{outlet.imageUrl ? (
<img
src={outlet.imageUrl}
@ -209,11 +209,11 @@ export default function MediaOutlet() {
<img
src="/attached_assets/logo_black_1759162717640.png"
alt="SAPIENS"
className="h-3 w-auto mb-0.5"
className="h-5 w-auto mb-1"
data-testid="logo-sapiens"
/>
<div className="flex items-center space-x-1.5">
<span className="text-sm font-semibold text-gray-900" data-testid="text-outlet-name-header">
<span className="text-xs font-semibold text-gray-900" data-testid="text-outlet-name-header">
{outlet.name}
</span>
<TooltipProvider>
@ -226,7 +226,7 @@ export default function MediaOutlet() {
aria-label="View outlet information"
>
<Info
className="h-3.5 w-3.5 text-gray-500 cursor-pointer hover:text-gray-700"
className="h-3 w-3 text-gray-500 cursor-pointer hover:text-gray-700"
data-testid="icon-info-header"
/>
</button>

12
client/src/pages/Report.tsx
View File

@ -103,12 +103,12 @@ export default function Report() {
<header className="bg-white border-b border-gray-200 sticky top-0 z-50">
<div className="max-w-7xl mx-auto px-6 py-4">
<div className="flex items-center justify-between">
<div className="flex items-center space-x-3">
<div className="flex items-start space-x-3">
{outletLoading ? (
<>
<div className="w-10 h-10 bg-gray-200 rounded-full animate-pulse"></div>
<div className="flex flex-col">
<div className="h-3 w-20 bg-gray-200 rounded animate-pulse mb-1"></div>
<div className="h-5 w-20 bg-gray-200 rounded animate-pulse mb-1"></div>
<div className="h-3 w-16 bg-gray-200 rounded animate-pulse"></div>
</div>
</>
@ -133,11 +133,11 @@ export default function Report() {
<img
src="/attached_assets/logo_black_1759162717640.png"
alt="SAPIENS"
className="h-3 w-auto mb-0.5"
className="h-5 w-auto mb-1"
data-testid="logo-sapiens"
/>
<div className="flex items-center space-x-1.5">
<span className="text-sm font-semibold text-gray-900" data-testid="text-outlet-name-header">
<span className="text-xs font-semibold text-gray-900" data-testid="text-outlet-name-header">
{outlet.name}
</span>
<TooltipProvider>
@ -150,7 +150,7 @@ export default function Report() {
aria-label="View outlet information"
>
<Info
className="h-3.5 w-3.5 text-gray-500 cursor-pointer hover:text-gray-700"
className="h-3 w-3 text-gray-500 cursor-pointer hover:text-gray-700"
data-testid="icon-info-header"
/>
</button>
@ -167,7 +167,7 @@ export default function Report() {
<img
src="/attached_assets/logo_black_1759162717640.png"
alt="SAPIENS"
className="h-6 w-auto cursor-pointer"
className="h-5 w-auto cursor-pointer"
onClick={() => setLocation("/")}
data-testid="logo-sapiens"
/>