fix homepage

src/app/blog/[slug]/page.tsx

@@ -0,0 +1,74 @@
+import path from "path";
+import fs from "fs";
+import matter from "gray-matter";
+import {unified} from 'unified'
+import rehypeStringify from 'rehype-stringify'
+import remarkGfm from 'remark-gfm'
+import remarkParse from 'remark-parse'
+import remarkRehype from 'remark-rehype'
+import toml from 'toml'
+
+const postsDirectory = "src/content/blog";
+
+interface PostData {
+  slug: string;
+  contentHtml: string;
+  title?: string;
+  date?: string;
+  description?: string;
+}
+
+async function getPostData(slug: string): Promise<PostData> {
+  const fullPath = path.join(postsDirectory, `${slug}/index.md`);
+  const fileContents = fs.readFileSync(fullPath, 'utf8');
+
+  // Use gray-matter to parse the post metadata section
+  const matterResult = matter(fileContents, {
+    engines: {
+      toml: toml.parse.bind(toml),
+    }
+  });
+
+  // Use remark to convert markdown into HTML string
+  const processedContent = await unified()
+    .use(remarkParse)
+    .use(remarkGfm)
+    .use(remarkRehype)
+    .use(rehypeStringify)
+    .process(matterResult.content);
+  const contentHtml = processedContent.toString();
+
+  // Combine the data with the slug and contentHtml
+  return {
+    slug,
+    contentHtml,
+    ...matterResult.data,
+  };
+}
+
+export function generateStaticParams() {
+  return fs.readdirSync(postsDirectory, { withFileTypes: true })
+    .filter(dirent => dirent.isDirectory())
+    .map(dirent => ({
+      slug: dirent.name
+    }));
+}
+
+export default async function Post({ params }: { params: { slug: string } }) {
+  const {slug} = params;
+  const data = await getPostData(slug);
+  const { title, date } = data
+  return (
+    <div className='bg-black text-white'>
+      <div className="container mx-auto -mt-20 pt-20 md:-mt-16 md:pt-16 pb-6">
+        <h1 className="text-4xl">{title}</h1>
+        <div>
+          <span className="text-sm">{date}</span>
+        </div>
+        <article className="prose lg:prose-xl max-w-full prose-invert">
+          <div dangerouslySetInnerHTML={{ __html: data.contentHtml }} />
+        </article>
+      </div>
+    </div>
+  );
+}

src/app/careers/page.tsx

@@ -0,0 +1,165 @@
+export default function careers() {
+    return <div className='bg-black text-white'>
+      <div className="container mx-auto -mt-20 pt-20 md:-mt-16 md:pt-16">
+            <div className='flex flex-col md:flex-row items-start justify-start border-t-[1px] border-[rgba(255,255,255,.2)] pt-4 pb-0 md:pb-16'>
+              <div className='w-full md:w-1/2 order-2 md:order-1 mt-10 md:mt-0'>
+                <figure className='relative pl-4'>
+                  <blockquote className='text-2xl md:text-6xl'>
+                    <p>
+                    岗位<br></br>
+                    <br/>
+                    </p>
+                  </blockquote>
+                  <blockquote className='text-2xl md:text-2xl'>
+                    <p>
+                    酒文化史研究员<br/>    
+                    酒文化理论研究员<br/>    
+                    酒文化实证研究员<br/>    
+                    酒文化地域差异研究员<br/>    
+                    酒文化年龄差异研究员<br/>    
+                    跨模态商业互捧数据清洗工程师<br/>    
+                    </p>
+                  </blockquote>
+
+                  {/* <figcaption className='mt-6'>
+                    <span className='font-semibold block'>Lilian Weng</span>
+                    <span className='block'>Applied AI at OpenAI</span>
+                  </figcaption> */}
+                </figure>
+              </div>
+              <div className='w-full md:w-1/2 order-1 md:order-2'>
+                <img alt="" src={`../images/careers.png`}
+                  className='w-full h-full object-cover '></img>
+              </div>
+            </div>
+      </div>
+      <div className='bg-white text-black'>
+      <div className="container mx-auto -mt-20 pt-20 md:-mt-16 md:pt-16">
+        <div className='flex flex-col md:flex-row items-start justify-start border-t-[1px] border-[rgba(255,255,255,.2)] pt-4 pb-0 md:pb-16'>
+          <div className='w-full md:w-1/4 mt-10 md:mt-0'>
+            <figure className='relative pl-4'>
+              <blockquote >
+                <h6>January 23, 2024</h6>   
+              </blockquote>
+            </figure>
+          </div>
+          <div className='w-full md:w-1/2 '>
+            <blockquote >
+              <p className='text-2xl md:text-2xl'>开源项目诚招</p>   
+            </blockquote>  
+            <p className='mt-8' >
+              酒文化史研究员：<br></br>
+              <br/>
+              1、调研和研究酒文化的历史发展和演变的相关文献和资料。<br></br>
+              <br/>
+              2、分析和解读酒文化史上的重要事件、人物和影响。<br></br>
+              <br/>
+              3、探索并还原不同时期和地区酒文化的背景、特点和演变过程。<br></br>
+              <br/>
+              4、通过研究探索酒在古代和现代社会中的社会、经济和文化意义。 <br></br>
+              <br/>
+              5、撰写相关研究报告、学术论文和文章，为酒文化史研究做出贡献。 <br></br>
+              <br/>
+            </p>
+            <p className='mt-8' >
+              酒文化理论研究员：<br></br>
+              <br/>
+              1、深入研究并建立关于酒文化的理论框架和概念模型。<br></br>
+              <br/>
+              2、探讨酒文化与其他社会现象、活动和价值观念等的关系。<br></br>
+              <br/>
+              3、分析和解读不同学派和观点对于酒文化的理论阐释和解释。<br></br>
+              <br/>
+              4、针对实际情况和问题，提出相关的理论研究假设和命题。 <br></br>
+              <br/>
+              5、通过研究和讨论，为酒文化理论的发展和推广做出贡献。 <br></br>
+              <br/>
+            </p>          
+            <p className='mt-8' >
+              酒文化实证研究员：<br></br>
+              <br/>
+              1、收集、整理和分析酒文化相关的实证数据和研究材料。<br></br>
+              <br/>
+              2、运用统计学和社会科学研究方法，对酒文化现象进行实证研究。<br></br>
+              <br/>
+              3、通过调查、实地观察和实验等方式收集和验证研究数据。<br></br>
+              <br/>
+              4、分析和解读实证研究结果，提出相关的结论和建议。 <br></br>
+              <br/>
+              5、参与相关学术论文的撰写和发表，推动酒文化实证研究的发展。 <br></br>
+              <br/>
+            </p>  
+            <p className='mt-8' >
+              酒文化地域差异研究员：<br></br>
+              <br/>
+              1、研究和比较不同地域对酒文化的认知、态度和实践。<br></br>
+              <br/>
+              2、调研和分析不同地域酒文化的历史、背景和特色。<br></br>
+              <br/>
+              3、探讨不同地域因素对酒文化发展的影响和作用。<br></br>
+              <br/>
+              4、研究和解读不同地域酒文化的差异和共同点。 <br></br>
+              <br/>
+              5、提出关于酒文化地域差异的理论假设和研究命题。 <br></br>
+              <br/>
+            </p> 
+            <p className='mt-8' >
+              酒文化年龄差异研究员：<br></br>
+              <br/>
+              1、调查和研究不同年龄群体对酒文化的认知、态度和行为。<br></br>
+              <br/>
+              2、分析和解读不同年龄段人群在酒文化方面的差异和变化。<br></br>
+              <br/>
+              3、探索年龄因素对酒文化意识和行为的影响和作用。<br></br>
+              <br/>
+              4、研究和讨论酒文化传承在不同年龄群体中的特点和挑战。 <br></br>
+              <br/>
+              5、提出关于酒文化年龄差异的研究报告和建议。 <br></br>
+              <br/>
+            </p>     
+            <p className='mt-8' >
+              跨模态商业互捧数据清洗工程师：<br></br>
+              <br/>
+              1、负责清洗和整理跨模态商业数据，其中包括酒文化相关的交易、用户、评论等数据。<br></br>
+              <br/>
+              2、开发和维护数据清洗工具和流程，确保数据的准确性和可用性。<br></br>
+              <br/>
+              3、进行数据清洗和转换，以适应不同的分析和研究需求。<br></br>
+              <br/>
+              4、进行数据质量评估和异常值处理，确保数据的可靠性和一致性。 <br></br>
+              <br/>
+              5、寻找和修复数据缺失和冗余，以确保数据的完整性和有效性。 <br></br>
+              <br/>
+              6、对数据进行标准化和归一化处理，以便于分析和比较。<br></br>
+              <br/>
+              7、对数据进行统计分析和可视化，提取有关酒文化的洞察和趋势。 <br></br>
+              <br/>
+              8、与数据分析师和研究员紧密合作，理解其需求并提供相应的数据支持。 <br></br>
+              <br/>
+              9、不断改进和优化数据清洗工作流程，提高效率和准确性。 <br></br>
+              <br/>
+              作为跨模态商业互捧数据清洗工程师，您将负责处理和准备酒文化相关数据，确保研究人员和分析师能够基于高质量的数据进行深入的研究和分析，从而洞察酒文化的商业潜力和趋势，为相关决策提供支持。
+              <br/>
+            </p>          
+            <p className='text-2xl md:text-2xl mt-16'>
+
+            </p>
+            <p className='mt-4'>
+              <img alt="" src={`../images/stangel-2022-0484.jpg`}
+                className='w-full h-full object-cover aspect-square'></img>
+              <br/>
+            </p>
+
+          </div>
+        </div>
+      </div>
+      </div>
+      <div className="container mx-auto -mt-20 pt-20 md:-mt-16 md:pt-16">
+        <div className='flex flex-col md:flex-row items-start justify-start border-t-[1px] border-[rgba(255,255,255,.2)] pt-4 pb-0 md:pb-16'>
+        Related research
+        </div>
+      </div>
+    </div>
+
+
+  }