employees page, dlt-lecture are updated and minor fixing in Blog and …

next-env.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="next" />
 /// <reference types="next/image-types/global" />
-import "./.next/types/routes.d.ts";
+import "./.next/dev/types/routes.d.ts";
 
 // NOTE: This file should not be edited
 // see https://nextjs.org/docs/app/api-reference/config/typescript for more information.

src/app/[locale]/dlt-lecture/page.tsx

@@ -74,12 +74,9 @@ export default async function DltLecturePage({ params }: DltLecturePageProps) {
 
       {/* Content Section */}
       <div className=" lg:pb-48 sm:pb-32 pb-28">
-        <div className="container mt-12 xl:max-w-1xl">
-          <div
-            className="text-blue prose prose-lg prose-a:text-purple-700 prose-code:bg-yellow prose-blockquote:border-l-0 prose-blockquote:bg-green-100 prose-blockquote:not-italic prose-blockquote:px-8 prose-blockquote:py-3 prose-blockquote:rounded-3xl relative mx-auto"
-            style={{ maxWidth: '100%' }}
-          >
-            <p className="lead">
+        <div className="container mt-3 xl:max-w-6xl">
+          <div className="text-blue w-full max-w-none prose prose-a:text-purple-700 prose-code:bg-yellow prose-blockquote:border-l-0 prose-blockquote:bg-green-100 prose-blockquote:not-italic prose-blockquote:px-8 prose-blockquote:py-3 prose-blockquote:rounded-3xl relative mx-auto">
+            <p className="">
               Seit 2023 bietet <Link href="/de/about-hendrik">Hendrik Ebbers</Link> die Vorlesung{' '}
               <strong>&quot;Distribution Ledger Technology und Digital Trust&quot;</strong> an.
               Aktuell wird die Vorlesung als Lehrauftrag an der{' '}

src/app/[locale]/employees/[slug]/page.tsx

@@ -84,23 +84,23 @@ export default async function EmployeePage({
         height={100}
       />
       <Image
-        className="absolute hidden lg:block lg:right-[31%] lg:top-[25%]"
+        className="absolute hidden lg:block lg:right-[31%] lg:top-[15%]"
         alt="Arrow"
         src="/illustrations/arrow-dashed.svg"
         width={100}
         height={100}
       />
 
-      <div className="container px-0 max-w-xs sm:max-w-full pt-56 sm:pt-64 lg:pt-72 pb-20 sm:pb-36">
-        <div className="pt-16 pb-4 sm:pt-36 sm:pb-12">
-          <h1 className="text-center h1">
+      <div className="container px-0 sm:max-w-full pt-16 pb-4 sm:pt-36 sm:pb-12 relative">
+        <div className="sm:mb-8 mb-4 lg:hidden">
+          <h1 className="text-center h2 sm:mb-2">
             {member.firstName} {member.lastName}
           </h1>
           <p className="text-center font-bold text-purple">{member.role}</p>
         </div>
 
-        <div className="flex flex-col gap-8 items-center justify-center mb-16 lg:flex-row w-full">
-          <div className="relative flex items-center justify-center w-full max-w-md lg:w-1/2">
+        <div className="flex flex-col sm:gap-8 gap-6 items-center justify-center mb-16 lg:flex-row w-full">
+          <div className="relative flex items-center justify-center w-full max-w-xs sm:max-w-md lg:w-1/2">
             <Image
               className="w-full max-w-md"
               alt="background"
@@ -109,28 +109,34 @@ export default async function EmployeePage({
               height={512}
             />
             <Image
-              className="xl:w-77.5 xl:h-77.5 lg:w-66.25 lg:h-66.25 sm:w-77.5 sm:h-77.5 w-48.75 h-48.75 border border-purple rounded-full object-cover absolute top-[17%] xl:right-[10%] lg:right-[10.5%] sm:right-[9%] right-[11%]"
+              className="xl:size-77 lg:size-66.25 sm:size-77 size-54 border border-purple rounded-full object-cover absolute top-[17%] xl:right-[10%] lg:right-[10.5%] sm:right-[9%] right-[11%]"
               alt="employee"
               src={member.picture}
               width={310}
               height={310}
               priority
             />
           </div>
-          <div className="w-full max-w-lg">
-            <div>{member.bio}</div>
+          <div className="w-full sm:max-w-lg lg:text-left text-center">
+            <div className="mb-4 lg:block hidden">
+              <h1 className="h2 mb-2">
+                {member.firstName} {member.lastName}
+              </h1>
+              <p className="font-bold text-purple">{member.role}</p>
+            </div>
+            <div className="text-base text-blue leading-7">{member.bio}</div>
             {member.socials && member.socials.length > 0 ? (
-              <div className="flex items-center gap-5 mt-4">
+              <div className="flex items-center lg:justify-start justify-center gap-2 mt-6">
                 {member.socials.map((social) => (
                   <a
                     key={social.name}
                     href={social.link}
                     aria-label={social.name}
                     target="_blank"
                     rel="noopener noreferrer"
-                    className="flex items-center justify-center text-3xl text-white transition-colors duration-150 ease-in-out rounded group focus:outline-none w-11 h-11 bg-sky"
+                    className="flex items-center justify-center transition-colors duration-150 ease-in-out rounded-full focus:outline-none size-9 shrink-0 bg-blue/90 hover:bg-purple-700"
                   >
-                    <span className="iconify text-3xl" data-icon={social.icon}></span>
+                    <span className="iconify text-xl text-white fill-current" data-icon={social.icon}></span>
                   </a>
                 ))}
               </div>

src/components/about/TeamSection.tsx

@@ -18,7 +18,7 @@ export default function TeamSection() {
           {t('title')} <span className="text-sky">{t('titleHighlight')}</span>
         </h2>
       </div>
-      <div className="place-content-center gap-x-6 gap-y-6 sm:gap-y-4 grid sm:grid-cols-3 mt-8 w-full">
+      <div className="place-content-center gap-x-6 gap-y-8 grid sm:grid-cols-3 mt-8 w-full">
         {visibleTeam.map((member) => (
           <TeamCard key={member.id} member={member} />
         ))}

src/components/blog/BlogCard.tsx

@@ -39,35 +39,35 @@ export default function BlogCard({ post, locale = 'en' }: BlogCardProps) {
             <div className="p-5">
               <article>
                 <div className="flex flex-col gap-1.5 sm:items-center sm:gap-5 sm:flex-row">
-                  <div className="flex items-center gap-2 text-purple">
+                  <div className="flex items-center gap-1 text-purple">
                     <svg className="w-5 h-5" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor">
                       <path fillRule="evenodd" d="M12 2.25c-5.385 0-9.75 4.365-9.75 9.75s4.365 9.75 9.75 9.75 9.75-4.365 9.75-9.75S17.385 2.25 12 2.25zM12.75 6a.75.75 0 00-1.5 0v6c0 .414.336.75.75.75h4.5a.75.75 0 000-1.5h-3.75V6z" clipRule="evenodd" />
                     </svg>
-                    <time className="text-[14px] font-medium">
+                    <time className="text-base font-medium">
                       {new Date(post.date).toLocaleDateString(locale === 'de' ? 'de-DE' : 'en-US', {
                         year: 'numeric',
                         month: 'long',
                         day: 'numeric',
                       })}
                     </time>
                   </div>
-                  <div className="flex items-center gap-2 text-purple">
-                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" className="w-5 h-5">
+                  <div className="flex items-center gap-1 text-purple">
+                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" className="size-5 shrink-0">
                       <path fillRule="evenodd" d="M7.5 6a4.5 4.5 0 119 0 4.5 4.5 0 01-9 0zM3.751 20.105a8.25 8.25 0 0116.498 0 .75.75 0 01-.437.695A18.683 18.683 0 0112 22.5c-2.786 0-5.433-.608-7.812-1.7a.75.75 0 01-.437-.695z" clipRule="evenodd" />
                     </svg>
-                    <p className="text-[14px] font-medium">{post.author}</p>
+                    <p className="text-base font-medium capitalize">{post.author}</p>
                   </div>
                 </div>
-                <div className="flex flex-wrap items-center gap-3 mt-3 text-xs sm:mt-2 text-purple">
+                <div className="flex flex-wrap items-center gap-3 mt-3 text-xs sm:mt-2.5 text-purple">
                   {post.categories.map((category, index) => (
                     <p key={index}>#{category}</p>
                   ))}
                 </div>
-                <div className="mt-6 space-y-5 sm:mt-5 sm:space-y-4">
-                  <h2 className="text-lg font-bold text-center transition-colors duration-150 ease-in-out text-blue sm:text-left sm:line-clamp-none line-clamp-2 group-hover:text-purple-700">
+                <div className="space-y-5 mt-5 sm:space-y-2">
+                  <h2 className="text-xl font-bold text-center transition-colors duration-150 ease-in-out text-blue sm:text-left sm:line-clamp-none line-clamp-2 group-hover:text-purple-700">
                     {post.title}
                   </h2>
-                  <p className="text-sm leading-5.5 text-blue line-clamp-3">
+                  <p className="text-sm leading-6 text-blue font-normal line-clamp-3">
                     {post.excerpt}
                   </p>
                 </div>