ourworld_web/www_projectmycelium_com
23
0
Fork 0
forked from emre/www_projectmycelium_com
Code Issues 3 Pull Requests Projects Releases Activity

feat: update home page bento grid with custom images

Browse Source 
- Replaced placeholder images with custom bento grid assets
- Adjusted image styling and object positioning for better visual presentation
This commit is contained in:
sasha-astiadi
2025-11-06 20:23:35 +01:00
parent ae3e78f75a
commit 15cc1f70e3
11 changed files with 8 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

BIN
src/images/bento-compute.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1002 KiB

BIN
src/images/bento-gpu.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 179 KiB

BIN
src/images/bento-storage.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 23 KiB

16
src/pages/home/HomeTab.tsx
View File

@@ -47,7 +47,7 @@ export function HomeTab() {
<div className="relative flex h-full flex-col overflow-hidden rounded-[calc(var(--radius-lg)+1px)] lg:rounded-tr-[calc(2rem+1px)]">
<img
alt=""
src="https://tailwindcss.com/plus-assets/img/component-images/bento-01-releases.png"
src="/images/bento-agent.jpg"
className="h-50 object-cover object-left lg:object-right"
/>
<div className="px-8 pt-4 pb-0">
@@ -64,11 +64,11 @@ export function HomeTab() {
{/* ✅ ✅ MIDDLE ROW (half-height, equal spacing) */}
<div className="relative lg:col-span-6">
<div className="absolute inset-0 bg-white rounded-[calc(var(--radius-lg)+1px)]" />
<div className="relative flex flex-col items-center justify-center py-6 text-center rounded-[calc(var(--radius-lg)+1px)] shadow-sm">
<div className="relative flex flex-col items-center justify-center pb-4 text-center rounded-[calc(var(--radius-lg)+1px)] shadow-sm">
<img
alt=""
src="https://tailwindcss.com/plus-assets/img/component-images/bento-01-releases.png"
className="h-50 object-cover object-left lg:object-right"
src="/images/bento-cloud.jpg"
className=" object-cover object-center lg:object-center"
/>
<div className="px-8 pt-4 pb-0">
<h3 className="text-sm/4 font-semibold text-cyan-500">Agents</h3>
@@ -87,7 +87,7 @@ export function HomeTab() {
<div className="relative flex h-full flex-col overflow-hidden rounded-[calc(var(--radius-lg)+1px)] lg:rounded-bl-[calc(2rem+1px)]">
<img
alt=""
src="https://tailwindcss.com/plus-assets/img/component-images/bento-01-speed.png"
src="/images/bento-compute.png"
className="h-50 object-cover object-left"
/>
<div className="px-8 pt-4 pb-0">
@@ -106,8 +106,8 @@ export function HomeTab() {
<div className="relative flex h-full flex-col overflow-hidden rounded-[calc(var(--radius-lg)+1px)]">
<img
alt=""
src="https://tailwindcss.com/plus-assets/img/component-images/bento-01-integrations.png"
className="h-50 object-cover"
src="/images/bento-storage.png"
className="h-50 object-contain px-1"
/>
<div className="px-8 pt-4 pb-0">
<h3 className="text-sm/4 font-semibold text-cyan-500">Storage</h3>
@@ -125,7 +125,7 @@ export function HomeTab() {
<div className="relative flex h-full flex-col overflow-hidden rounded-[calc(var(--radius-lg)+1px)] max-lg:rounded-b-[calc(2rem+1px)] lg:rounded-br-[calc(2rem+1px)]">
<img
alt=""
src="https://tailwindcss.com/plus-assets/img/component-images/bento-01-network.png"
src="/images/bento-gpu.jpg"
className="h-50 object-cover"
/>
<div className="px-8 pt-4 pb-0">