From b76e35a95aea972f83466d012c01912b6539fc25 Mon Sep 17 00:00:00 2001
From: Chaoming Li <email@chaoming.li>
Date: Thu, 21 Nov 2024 16:00:27 +1100
Subject: [PATCH] added company page design

---
 layouts/_default/company.html             |  6 ++++++
 layouts/shortcodes/investor-logo.html     |  7 +++++++
 layouts/shortcodes/section-container.html |  5 +++++
 layouts/shortcodes/stat.html              |  4 ++++
 layouts/shortcodes/team-member.html       | 22 ++++++++++++++++++++++
 layouts/shortcodes/value-card.html        | 21 +++++++++++++++++++++
 static/images/company/exec-1.svg          |  7 +++++++
 static/images/company/exec-2.svg          |  7 +++++++
 static/images/company/exec-3.svg          |  7 +++++++
 static/images/company/investor-1.svg      |  7 +++++++
 static/images/company/investor-2.svg      |  7 +++++++
 static/images/company/investor-3.svg      |  8 ++++++++
 static/images/company/investor-4.svg      |  8 ++++++++
 13 files changed, 116 insertions(+)
 create mode 100644 layouts/_default/company.html
 create mode 100644 layouts/shortcodes/investor-logo.html
 create mode 100644 layouts/shortcodes/section-container.html
 create mode 100644 layouts/shortcodes/stat.html
 create mode 100644 layouts/shortcodes/team-member.html
 create mode 100644 layouts/shortcodes/value-card.html
 create mode 100644 static/images/company/exec-1.svg
 create mode 100644 static/images/company/exec-2.svg
 create mode 100644 static/images/company/exec-3.svg
 create mode 100644 static/images/company/investor-1.svg
 create mode 100644 static/images/company/investor-2.svg
 create mode 100644 static/images/company/investor-3.svg
 create mode 100644 static/images/company/investor-4.svg

diff --git a/layouts/_default/company.html b/layouts/_default/company.html
new file mode 100644
index 0000000..27fca40
--- /dev/null
+++ b/layouts/_default/company.html
@@ -0,0 +1,6 @@
+{{ define "main" }}
+<article class="post">
+    <!-- Hero section will be rendered by the hero shortcode -->
+    {{ .Content }}
+</article>
+{{ end }}
diff --git a/layouts/shortcodes/investor-logo.html b/layouts/shortcodes/investor-logo.html
new file mode 100644
index 0000000..8de4fb1
--- /dev/null
+++ b/layouts/shortcodes/investor-logo.html
@@ -0,0 +1,7 @@
+<div class="investor-logo p-6 flex items-center justify-center">
+    {{ if .Get "image" }}
+    <img src="{{ .Get "image" }}" alt="{{ .Get "name" }}" class="max-h-12 grayscale hover:grayscale-0 transition-all duration-300">
+    {{ else }}
+    <div class="text-xl font-bold text-gray-400">{{ .Get "name" }}</div>
+    {{ end }}
+</div>
diff --git a/layouts/shortcodes/section-container.html b/layouts/shortcodes/section-container.html
new file mode 100644
index 0000000..34283ff
--- /dev/null
+++ b/layouts/shortcodes/section-container.html
@@ -0,0 +1,5 @@
+<section class="{{ .Get "class" }}">
+    <div class="container mx-auto px-4">
+        {{ .Inner }}
+    </div>
+</section>
diff --git a/layouts/shortcodes/stat.html b/layouts/shortcodes/stat.html
new file mode 100644
index 0000000..3807736
--- /dev/null
+++ b/layouts/shortcodes/stat.html
@@ -0,0 +1,4 @@
+<div class="stat-card">
+    <div class="text-3xl md:text-4xl font-bold text-blue-600 mb-2">{{ .Get "number" }}</div>
+    <div class="text-gray-600 font-medium">{{ .Get "label" }}</div>
+</div>
diff --git a/layouts/shortcodes/team-member.html b/layouts/shortcodes/team-member.html
new file mode 100644
index 0000000..6cc63c2
--- /dev/null
+++ b/layouts/shortcodes/team-member.html
@@ -0,0 +1,22 @@
+<div class="team-member text-center">
+    <div class="relative mb-4 rounded-lg overflow-hidden aspect-square">
+        {{ if .Get "image" }}
+        <img src="{{ .Get "image" }}" alt="{{ .Get "name" }}" class="w-full h-full object-cover">
+        {{ else }}
+        <div class="w-full h-full bg-gray-200 flex items-center justify-center">
+            <svg class="w-20 h-20 text-gray-400" fill="currentColor" viewBox="0 0 24 24">
+                <path d="M12 14c3.31 0 6-2.69 6-6s-2.69-6-6-6-6 2.69-6 6 2.69 6 6 6zm0 2c-4 0-12 2-12 6v2h24v-2c0-4-8-6-12-6z"/>
+            </svg>
+        </div>
+        {{ end }}
+        {{ if .Get "linkedin" }}
+        <a href="{{ .Get "linkedin" }}" target="_blank" rel="noopener" class="absolute bottom-2 right-2 bg-white rounded-full p-2 shadow-md hover:shadow-lg transition-shadow">
+            <svg class="w-5 h-5 text-blue-600" fill="currentColor" viewBox="0 0 24 24">
+                <path d="M19 0h-14c-2.761 0-5 2.239-5 5v14c0 2.761 2.239 5 5 5h14c2.762 0 5-2.239 5-5v-14c0-2.761-2.238-5-5-5zm-11 19h-3v-11h3v11zm-1.5-12.268c-.966 0-1.75-.79-1.75-1.764s.784-1.764 1.75-1.764 1.75.79 1.75 1.764-.783 1.764-1.75 1.764zm13.5 12.268h-3v-5.604c0-3.368-4-3.113-4 0v5.604h-3v-11h3v1.765c1.396-2.586 7-2.777 7 2.476v6.759z"/>
+            </svg>
+        </a>
+        {{ end }}
+    </div>
+    <h3 class="text-xl font-bold mb-1">{{ .Get "name" }}</h3>
+    <p class="text-gray-600">{{ .Get "title" }}</p>
+</div>
diff --git a/layouts/shortcodes/value-card.html b/layouts/shortcodes/value-card.html
new file mode 100644
index 0000000..5cf1e05
--- /dev/null
+++ b/layouts/shortcodes/value-card.html
@@ -0,0 +1,21 @@
+<div class="value-card bg-white p-8 rounded-lg shadow-sm hover:shadow-md transition-shadow">
+    <div class="mb-4">
+        {{ $icon := .Get "icon" }}
+        {{ if eq $icon "lightbulb" }}
+        <svg class="w-12 h-12 text-blue-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9.663 17h4.673M12 3v1m6.364 1.636l-.707.707M21 12h-1M4 12H3m3.343-5.657l-.707-.707m2.828 9.9a5 5 0 117.072 0l-.548.547A3.374 3.374 0 0014 18.469V19a2 2 0 11-4 0v-.531c0-.895-.356-1.754-.988-2.386l-.548-.547z"/>
+        </svg>
+        {{ else if eq $icon "users" }}
+        <svg class="w-12 h-12 text-blue-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4.354a4 4 0 110 5.292M15 21H3v-1a6 6 0 0112 0v1zm0 0h6v-1a6 6 0 00-9-5.197M13 7a4 4 0 11-8 0 4 4 0 018 0z"/>
+        </svg>
+        {{ else if eq $icon "eye" }}
+        <svg class="w-12 h-12 text-blue-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 12a3 3 0 11-6 0 3 3 0 016 0z"/>
+            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M2.458 12C3.732 7.943 7.523 5 12 5c4.478 0 8.268 2.943 9.542 7-1.274 4.057-5.064 7-9.542 7-4.477 0-8.268-2.943-9.542-7z"/>
+        </svg>
+        {{ end }}
+    </div>
+    <h3 class="text-xl font-bold mb-2">{{ .Get "title" }}</h3>
+    <p class="text-gray-600">{{ .Get "description" }}</p>
+</div>
diff --git a/static/images/company/exec-1.svg b/static/images/company/exec-1.svg
new file mode 100644
index 0000000..0c71641
--- /dev/null
+++ b/static/images/company/exec-1.svg
@@ -0,0 +1,7 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="400" height="400" viewBox="0 0 400 400" xmlns="http://www.w3.org/2000/svg">
+    <rect width="400" height="400" fill="#e0e7ff"/>
+    <circle cx="200" cy="150" r="80" fill="#818cf8"/>
+    <circle cx="200" cy="400" r="160" fill="#818cf8"/>
+    <rect x="120" y="130" width="160" height="40" rx="20" fill="#c7d2fe"/>
+</svg>
diff --git a/static/images/company/exec-2.svg b/static/images/company/exec-2.svg
new file mode 100644
index 0000000..3b8aaa4
--- /dev/null
+++ b/static/images/company/exec-2.svg
@@ -0,0 +1,7 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="400" height="400" viewBox="0 0 400 400" xmlns="http://www.w3.org/2000/svg">
+    <rect width="400" height="400" fill="#fee2e2"/>
+    <circle cx="200" cy="150" r="80" fill="#f87171"/>
+    <circle cx="200" cy="400" r="160" fill="#f87171"/>
+    <rect x="120" y="130" width="160" height="40" rx="20" fill="#fecaca"/>
+</svg>
diff --git a/static/images/company/exec-3.svg b/static/images/company/exec-3.svg
new file mode 100644
index 0000000..65f79dd
--- /dev/null
+++ b/static/images/company/exec-3.svg
@@ -0,0 +1,7 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="400" height="400" viewBox="0 0 400 400" xmlns="http://www.w3.org/2000/svg">
+    <rect width="400" height="400" fill="#dcfce7"/>
+    <circle cx="200" cy="150" r="80" fill="#4ade80"/>
+    <circle cx="200" cy="400" r="160" fill="#4ade80"/>
+    <rect x="120" y="130" width="160" height="40" rx="20" fill="#bbf7d0"/>
+</svg>
diff --git a/static/images/company/investor-1.svg b/static/images/company/investor-1.svg
new file mode 100644
index 0000000..b347891
--- /dev/null
+++ b/static/images/company/investor-1.svg
@@ -0,0 +1,7 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="200" height="60" viewBox="0 0 200 60" xmlns="http://www.w3.org/2000/svg">
+    <rect width="200" height="60" fill="white"/>
+    <circle cx="40" cy="30" r="20" fill="#3b82f6"/>
+    <rect x="70" y="20" width="120" height="8" rx="4" fill="#3b82f6"/>
+    <rect x="70" y="35" width="80" height="8" rx="4" fill="#93c5fd"/>
+</svg>
diff --git a/static/images/company/investor-2.svg b/static/images/company/investor-2.svg
new file mode 100644
index 0000000..e15a0ce
--- /dev/null
+++ b/static/images/company/investor-2.svg
@@ -0,0 +1,7 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="200" height="60" viewBox="0 0 200 60" xmlns="http://www.w3.org/2000/svg">
+    <rect width="200" height="60" fill="white"/>
+    <polygon points="30,10 50,10 40,40" fill="#3b82f6"/>
+    <rect x="70" y="20" width="100" height="8" rx="4" fill="#3b82f6"/>
+    <rect x="70" y="35" width="60" height="8" rx="4" fill="#93c5fd"/>
+</svg>
diff --git a/static/images/company/investor-3.svg b/static/images/company/investor-3.svg
new file mode 100644
index 0000000..cc6dd72
--- /dev/null
+++ b/static/images/company/investor-3.svg
@@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="200" height="60" viewBox="0 0 200 60" xmlns="http://www.w3.org/2000/svg">
+    <rect width="200" height="60" fill="white"/>
+    <rect x="20" y="15" width="30" height="30" rx="6" fill="#3b82f6"/>
+    <circle cx="35" cy="30" r="8" fill="white"/>
+    <rect x="70" y="20" width="110" height="8" rx="4" fill="#3b82f6"/>
+    <rect x="70" y="35" width="70" height="8" rx="4" fill="#93c5fd"/>
+</svg>
diff --git a/static/images/company/investor-4.svg b/static/images/company/investor-4.svg
new file mode 100644
index 0000000..386fab9
--- /dev/null
+++ b/static/images/company/investor-4.svg
@@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="200" height="60" viewBox="0 0 200 60" xmlns="http://www.w3.org/2000/svg">
+    <rect width="200" height="60" fill="white"/>
+    <circle cx="30" cy="30" r="15" fill="#3b82f6"/>
+    <circle cx="45" cy="30" r="15" fill="#60a5fa" fill-opacity="0.7"/>
+    <rect x="70" y="20" width="90" height="8" rx="4" fill="#3b82f6"/>
+    <rect x="70" y="35" width="50" height="8" rx="4" fill="#93c5fd"/>
+</svg>