mmintel/e-tib.com
1
0
Fork 0
Code Issues Pull Requests 2 Actions 150 Packages Projects Releases Wiki Activity

fix: subcompany tiles layout and active states for 4 items
Some checks failed
Build & Deploy / 🔍 Prepare (push) Successful in 48s
Details
Build & Deploy / 🧪 QA (push) Successful in 2m23s
Details
CI - Lint, Typecheck & Test / quality-assurance (pull_request) Successful in 3m41s
Details
Build & Deploy / 🚀 Deploy (push) Has been cancelled
Details
Build & Deploy / 🧪 Post-Deploy Verification (push) Has been cancelled
Details
Build & Deploy / 🔔 Notify (push) Has been cancelled
Details
Build & Deploy / 🏗️ Build (push) Has been cancelled
Details

Browse Source
This commit is contained in:
Marc Mintel
2026-05-13 11:08:31 +02:00
parent c4cc98a392
commit 0b837e3376
1 changed files with 25 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

33
components/blocks/SubCompanyTiles.tsx
View File

@@ -78,31 +78,36 @@ export function SubCompanyTiles(props: SubCompanyTilesProps) {
)}
<motion.div
className="grid grid-cols-1 md:grid-cols-3 gap-6"
className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6"
variants={containerVariants}
initial="hidden"
whileInView="visible"
viewport={{ once: true, margin: "-50px" }}
>
{companiesData.map((company: any, index: number) => {
const isCurrent = !company.url;
const CardWrapper = isCurrent ? 'div' : 'a';
const wrapperProps = !isCurrent ? { href: company.url, target: "_blank", rel: "noopener noreferrer" } : {};
const isCurrent = company.title.toUpperCase() === 'E-TIB GMBH';
const hasUrl = !!company.url;
const CardWrapper = hasUrl ? 'a' : 'div';
const wrapperProps = hasUrl ? { href: company.url, target: "_blank", rel: "noopener noreferrer" } : {};
// Generate logo representation based on title
const isEtib = company.title.includes('E-TIB');
const isIng = company.title.includes('Ingenieur');
const isVerwaltung = company.title.includes('Verwaltung');
const isBohrtechnik = company.title.includes('Bohrtechnik');
const isNemo = company.title.includes('NEMO');
const bgPositionClasses = [
"-bottom-[30%] -right-[30%]",
"-top-[30%] -left-[30%]",
"-bottom-[30%] -left-[30%]"
"-bottom-[30%] -left-[30%]",
"-top-[30%] -right-[30%]"
];
const animationClasses = [
"animate-[spin_60s_linear_infinite]",
"animate-[spin_80s_linear_infinite]",
"animate-[spin_100s_linear_infinite]"
"animate-[spin_100s_linear_infinite]",
"animate-[spin_120s_linear_infinite]"
];
const positionClass = bgPositionClasses[index % bgPositionClasses.length];
const animationClass = animationClasses[index % animationClasses.length];
@@ -118,7 +123,9 @@ export function SubCompanyTiles(props: SubCompanyTilesProps) {
className={`group relative overflow-hidden aspect-[4/3] flex flex-col justify-center items-center shadow-xl transition-all duration-500 bg-neutral-dark block w-full h-full sm:rounded-xl select-none ${
isCurrent
? 'border-2 border-primary shadow-[0_0_30px_rgba(17,124,97,0.15)] cursor-default'
: 'border border-white/5 hover:shadow-2xl hover:-translate-y-1 hover:border-white/10 cursor-pointer'
: hasUrl
? 'border border-white/5 hover:shadow-2xl hover:-translate-y-1 hover:border-white/10 cursor-pointer'
: 'border border-white/5 shadow-md cursor-default'
}`}
>
<div className="absolute inset-0 bg-[#0a192f] z-0">
@@ -186,10 +193,20 @@ export function SubCompanyTiles(props: SubCompanyTilesProps) {
/>
</div>
{isIng && (
<div className="text-white/80 tracking-[0.3em] text-xs font-semibold uppercase mt-1">
<div className="text-white/80 tracking-[0.2em] text-[10px] sm:text-xs font-semibold uppercase mt-1 text-center">
Ingenieurgesellschaft
</div>
)}
{isVerwaltung && (
<div className="text-white/80 tracking-[0.2em] text-[10px] sm:text-xs font-semibold uppercase mt-1 text-center">
Verwaltung GmbH
</div>
)}
{isBohrtechnik && (
<div className="text-white/80 tracking-[0.2em] text-[10px] sm:text-xs font-semibold uppercase mt-1 text-center">
Bohrtechnik GmbH
</div>
)}
</div>
) : isNemo ? (
<div className="flex flex-col items-center">