瀏覽代碼

feat(components): 添加知识产权统计组件- 新增 IntellectualPropertyStats 组件,用于展示知识产权相关统计数据
- 组件包括博士后创新实践基地、重点高校产学研合作、国际管理体系认证、产品专利和软件著作权等统计信息
- 采用网格布局展示统计数据,响应式设计适应不同屏幕尺寸

nahida 8 月之前
父節點
當前提交
df05bc8d6c
共有 1 個文件被更改,包括 57 次插入0 次删除
  1. 57 0
      src/components/IntellectualPropertyStats.tsx

+ 57 - 0
src/components/IntellectualPropertyStats.tsx

@@ -0,0 +1,57 @@
+import SubTitle from "@/components/subTitle"
+
+export function IntellectualPropertyStats() {
+  const stats = [
+    {
+      number: "1",
+      label: "博士后创新实践基地",
+    },
+    {
+      number: "3",
+      label: "重点高校产学研合作",
+    },
+    {
+      number: "15+",
+      label: "国际管理体系认证",
+    },
+    {
+      number: "20+",
+      label: "产品专利",
+    },
+    {
+      number: "80+",
+      label: "软件著作权",
+    },
+  ]
+
+  return (
+    <>
+      <div className={"hidden sm:block w-4/5 mx-auto mt-10"}>
+        <SubTitle title="知识产权" />
+      </div>
+      <div className="sm:mt-8 py-8 sm:py-16 px-4 bg-[url('/assets/home/23.png')] bg-cover flex items-center justify-center">
+        <div className="w-full sm:w-7/12 mx-auto text-center">
+          <div className="mb-8 sm:mb-16">
+            <h2 className="text-xl sm:text-2xl font-bold text-[#0f397b] mb-2 text-balance shuheiti">知识产权</h2>
+            <p className="text-xs sm:text-sm tracking-widest text-gray-600 uppercase font-medium shuheiti opacity-45">
+              COMPANY PROPERTY RIGHTS
+            </p>
+          </div>
+
+          <div className="grid grid-cols-3 lg:grid-cols-5 gap-4 sm:gap-8 lg:gap-12">
+            {stats.map((stat, index) => (
+              <div key={index} className="text-center">
+                <div className="text-3xl sm:text-4xl lg:text-6xl font-bold text-blue-600 mb-2 sm:mb-4">
+                  {stat.number}
+                </div>
+                <p className="text-gray-700 text-xs sm:text-sm lg:text-base font-medium leading-tight sm:leading-relaxed shuheiti px-1">
+                  {stat.label}
+                </p>
+              </div>
+            ))}
+          </div>
+        </div>
+      </div>
+    </>
+  )
+}