Reorganizacja layoutu: Bento Cards jako główna część, prawy sidebar z video/news

This commit is contained in:
Paweł Domański
2026-05-15 13:42:31 +02:00
parent 8aa54435ca
commit 30fd7c59b5
5 changed files with 23 additions and 29 deletions
+2 -2
View File
@@ -19,8 +19,8 @@
<link rel="preconnect" href="https://fonts.googleapis.com" /> <link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin /> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" /> <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
<script type="module" crossorigin src="/assets/index-Dx6C_443.js"></script> <script type="module" crossorigin src="/assets/index-D2vGqyJ4.js"></script>
<link rel="stylesheet" crossorigin href="/assets/index-_XCmdLEW.css"> <link rel="stylesheet" crossorigin href="/assets/index-CKyw65S0.css">
</head> </head>
<body> <body>
<div id="root"></div> <div id="root"></div>
+8 -8
View File
@@ -1,37 +1,37 @@
{ {
"hash": "ce8f670b", "hash": "28b81726",
"configHash": "fbe7a72b", "configHash": "eaadbf54",
"lockfileHash": "c46ea92c", "lockfileHash": "c46ea92c",
"browserHash": "a22cf043", "browserHash": "e128a585",
"optimized": { "optimized": {
"react": { "react": {
"src": "../../react/index.js", "src": "../../react/index.js",
"file": "react.js", "file": "react.js",
"fileHash": "c480598e", "fileHash": "8656f29a",
"needsInterop": true "needsInterop": true
}, },
"react-dom": { "react-dom": {
"src": "../../react-dom/index.js", "src": "../../react-dom/index.js",
"file": "react-dom.js", "file": "react-dom.js",
"fileHash": "14b26ea9", "fileHash": "56290933",
"needsInterop": true "needsInterop": true
}, },
"react/jsx-dev-runtime": { "react/jsx-dev-runtime": {
"src": "../../react/jsx-dev-runtime.js", "src": "../../react/jsx-dev-runtime.js",
"file": "react_jsx-dev-runtime.js", "file": "react_jsx-dev-runtime.js",
"fileHash": "60a60597", "fileHash": "a32305dd",
"needsInterop": true "needsInterop": true
}, },
"react/jsx-runtime": { "react/jsx-runtime": {
"src": "../../react/jsx-runtime.js", "src": "../../react/jsx-runtime.js",
"file": "react_jsx-runtime.js", "file": "react_jsx-runtime.js",
"fileHash": "5cd34b7f", "fileHash": "8b879eaf",
"needsInterop": true "needsInterop": true
}, },
"react-dom/client": { "react-dom/client": {
"src": "../../react-dom/client.js", "src": "../../react-dom/client.js",
"file": "react-dom_client.js", "file": "react-dom_client.js",
"fileHash": "05ce8d7b", "fileHash": "73520fe4",
"needsInterop": true "needsInterop": true
} }
}, },
-3
View File
@@ -1,3 +0,0 @@
{
"type": "module"
}
+12 -15
View File
@@ -51,21 +51,6 @@ function App() {
<div className="page-wrapper"> <div className="page-wrapper">
{/* LEFT SIDEBAR */}
<aside className="sidebar sidebar-left" aria-label="Najnowsze wiadomości">
<div>
<h3 className="sidebar-title">LATEST AI NEWS</h3>
<div className="news-list">
{newsData.map((item, index) => (
<div key={index} className="news-item" tabIndex={0}>
<div className="news-time">{item.time}</div>
<div className="news-title">{item.title}</div>
</div>
))}
</div>
</div>
</aside>
{/* CENTER BENTO AREA */} {/* CENTER BENTO AREA */}
<main className="bento-area" aria-label="Artykuły"> <main className="bento-area" aria-label="Artykuły">
<BentoSlideshow <BentoSlideshow
@@ -109,6 +94,18 @@ function App() {
</div> </div>
<SubscribeBox /> <SubscribeBox />
<div style={{ marginTop: '2rem' }}>
<h3 className="sidebar-title">LATEST AI NEWS</h3>
<div className="news-list">
{newsData.map((item, index) => (
<div key={index} className="news-item" tabIndex={0}>
<div className="news-time">{item.time}</div>
<div className="news-title">{item.title}</div>
</div>
))}
</div>
</div>
</aside> </aside>
</div> </div>
+1 -1
View File
@@ -185,7 +185,7 @@ h1, h2, h3, h4, h5, h6 {
margin: 0 auto; margin: 0 auto;
padding: 2rem; padding: 2rem;
display: grid; display: grid;
grid-template-columns: 280px 1fr 300px; grid-template-columns: 1fr 300px;
gap: 2rem; gap: 2rem;
} }