Skip to content

Commit 8741ec0

Browse files
author
Marty
committed
使用樂農網頁
1 parent 6aef84a commit 8741ec0

4 files changed

Lines changed: 570 additions & 78 deletions

File tree

agric_home.html

Lines changed: 269 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,269 @@
1+
<!DOCTYPE html>
2+
<html lang="zh-TW"><head>
3+
<meta charset="utf-8"/>
4+
<meta content="width=device-width, initial-scale=1.0" name="viewport"/>
5+
<title>慶奇科技</title>
6+
<script src="https://cdn.tailwindcss.com"></script>
7+
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet"/>
8+
<style>
9+
body {
10+
font-family: 'Noto Sans TC', sans-serif;
11+
}
12+
</style>
13+
</head>
14+
<body class="bg-white">
15+
<header class="bg-green-700/80 text-white fixed top-0 left-0 right-0 z-50 backdrop-blur-sm">
16+
<div class="container mx-auto px-4 py-3 flex justify-between items-center">
17+
<h1 class="text-2xl font-bold">慶奇科技</h1>
18+
<nav class="hidden md:flex space-x-6 items-center">
19+
<a class="hover:text-green-200" href="#">產品介紹</a>
20+
<a class="hover:text-green-200" href="#">場域實績</a>
21+
<a class="hover:text-green-200" href="#">食農教育</a>
22+
<a class="hover:text-green-200" href="#">聯絡我們</a>
23+
<a class="hover:text-green-200" href="https://md.webduino.io/s/22TOZk5pV">使用教學</a>
24+
</nav>
25+
<button class="md:hidden text-white">
26+
<span class="material-icons">menu</span>
27+
</button>
28+
</div>
29+
</header>
30+
<main>
31+
<section class="relative h-[400px] md:h-[500px] lg:h-[600px] flex items-center justify-center text-white" style="background-image: url('https://md.webduino.io/uploads/upload_accf01f5f5a02fc7b9bb62bdcc561651.png'); background-size: cover; background-position: center;">
32+
<div class="absolute inset-0 bg-black/30"></div>
33+
<div class="relative z-10 text-center px-4">
34+
<h2 class="text-4xl md:text-5xl lg:text-6xl font-bold mb-4">樂農智慧農業</h2>
35+
<p class="text-lg md:text-xl mb-8">成就農業達人的最後一哩路</p>
36+
<div class="space-x-4">
37+
<a class="bg-green-600 hover:bg-green-700 text-white font-semibold py-3 px-6 rounded-lg shadow-md transition duration-300" href="#">登入樂農系統</a>
38+
<a class="bg-white hover:bg-gray-100 text-green-700 font-semibold py-3 px-6 rounded-lg shadow-md transition duration-300" href="#">整合商登錄</a>
39+
</div>
40+
</div>
41+
</section>
42+
<section class="py-16 bg-gray-50">
43+
<div class="container mx-auto px-4">
44+
<div class="grid grid-cols-2 sm:grid-cols-3 md:grid-cols-6 gap-8 text-center">
45+
<div class="flex flex-col items-center">
46+
<img alt="澆灌圖示" class="h-16 w-16 mb-2" src="https://lh3.googleusercontent.com/aida-public/AB6AXuB2xRg23pgrH3byV-qjabiT5OmJASloiHMT5MKSNq2zukBQl7NeBHYAFNgBai-JhoR1AotIDWiPF1wHbSg4zbGTNU2_46ZoeKA2Y1IilGVLT0uBwCoIdtZ-mwaDGxm5TkSn0Eoyy2zQ7P2HFLGvwxpuHMIucUbm50dKKrcot-cNjY1GaqQBw3lKmTBlajYqoIHU5dWx8A2TA8GrGlLOYt_S2a6p7GSVTjawNyfK7J54BndCb8YDl48GhON6QHIyf7WqGoFp9sKEenRj"/>
47+
<p class="text-gray-700">_</p>
48+
</div>
49+
<div class="flex flex-col items-center">
50+
<img alt="施肥圖示" class="h-16 w-16 mb-2" src="https://lh3.googleusercontent.com/aida-public/AB6AXuDYL4C-WhupX1YDk9ofYO8TQ4K8qO9D1TIDzS5W_kG9_MhU0Mnx6YHFVflXRu4TWPAPcOiwBBSwls2dd76b1zTGiaAhNt6h9A4ivwPDXjBBBxMTSOjCZDE0Z4JvABlFCdZ3-FfJOA1JhEBtl_2mlYtSVo_DA44l6qqsKbWVx8lOgRGIDcVtswlxPsxq6k2sR9CN7OtS41YjqKa_FSwx7MY0lDJsPZR5yJN2B2uc2SHAx09WNn-Kq_Tc2jWF9gXEIk-0q7fvksGb_hOU"/>
51+
<p class="text-gray-700">_</p>
52+
</div>
53+
<div class="flex flex-col items-center">
54+
<img alt="噴藥圖示" class="h-16 w-16 mb-2" src="https://lh3.googleusercontent.com/aida-public/AB6AXuCtw1JRNbQoz7DWELA4LoncZhZ_r0Y1UaocyV3tvy8AtOUaVbW5VXYBcr4d3IsibAOFxH4tCRmEhbvL0cJo2feF5TyR3zWKpjJefMBrfVq35v8Xky2K1eaUB7GgC2vUThIAj6O3aOyR5H5YwiGpr5XMJJSYkgiBZGxMS0qyHD3uCawOXA9s25T5_4rI9P-TrgFe8bqMACPCoTEM4rXCziGUHjYzw-o_L0OZ2-vsBKfWFysxR6Dw1uafeW_J1fobuEuBD_kU5sF7WkyL"/>
55+
<p class="text-gray-700">_</p>
56+
</div>
57+
<div class="flex flex-col items-center">
58+
<img alt="排水圖示" class="h-16 w-16 mb-2" src="https://lh3.googleusercontent.com/aida-public/AB6AXuDUuaIV9Tj7AH6wZyEWCMaMi4u3NQ20aeI1uUzpVv3Y1nyrPKYqzFIKH-KuCv7jNk8FKAUutKwVgmPMT41xpHuVr36uCb1cCLpFfpi4h2kMkKvepgH6Db68DPw_ayax5G3ViDTaM96q5LnQoOSBDPajj3uqezk9TPZEv8ov68mIRIVzOnKPChWpARgQ_OFu6zjELyPuH9W2wgfH_SMfhX43C6dJeSD9UAdqNHrrEExCtDOzWBN5Qc1q1fT6xi60p4nIqGu2wjACb1p6"/>
59+
<p class="text-gray-700">_</p>
60+
</div>
61+
<div class="flex flex-col items-center">
62+
<img alt="監測圖示" class="h-16 w-16 mb-2" src="https://lh3.googleusercontent.com/aida-public/AB6AXuAaTbYsgrg5SEQ2GCMnOwsLJukgnqQITTmemU9_b-RooUooqcsWdzRBi1GP75cOPge9zEnfDmtnXPziBJBe4BN8TDzQSCpZBpycDMonqmuULJQR7is0BNG_Vtx_HnGSoKHYb6tIV1V5ShbKcR_BhsJpPXIt52eKVG-dnfCEF3euP5cUShHLC78LWtdnGupbq-6Azd09tfb14R6ix3upxtzXgGafjEtXOXK9WlQGOmfIm5bsJX-BhOtcep24hraaVLsn5DQycX-87WX8"/>
63+
<p class="text-gray-700">_</p>
64+
</div>
65+
<div class="flex flex-col items-center">
66+
<img alt="控制圖示" class="h-16 w-16 mb-2" src="https://lh3.googleusercontent.com/aida-public/AB6AXuDu6HYDgpgq_MUUj5Llhcz2jbEcAIB8iQiHV9iOg-cX6xj691SFkWi5UyAIFgTp5sOr6ehjC7jQpmVfOz-H0SYfSNAjfCZxSUwmWOb7tE6rg5ET2QA_z5hMuhHcF4rZoF9b3-Wm7axZt1Yu3xXyprNIXcO-ShJM3NxqHXMz8uMXwkBO5f1p-MAiXR_en8PRm2Bs2a3XXTys1HB1BhbB2bY-yeQdx-X6P09jInN1clBKbFIQEVI6mcpQTZ7aNFztZRAZXjD4ZIYAnLp2"/>
67+
<p class="text-gray-700">_</p>
68+
</div>
69+
</div>
70+
<div class="flex flex-col items-center mt-16 pt-8 pb-8 md:pt-12 md:pb-12">
71+
<span class="material-icons text-8xl md:text-9xl text-green-700 mb-6 md:mb-8 transform rotate-12">smartphone</span>
72+
<p class="text-center text-xl md:text-2xl font-semibold text-gray-800">
73+
拿起手機就能控制場域,<br class="md:hidden"/>用科技延續農業的傳承與驕傲
74+
</p>
75+
</div>
76+
<section class="py-16">
77+
<div class="container mx-auto px-4 text-center">
78+
<h3 class="text-3xl font-bold text-green-700 mb-4">全台安裝場域</h3>
79+
<img alt="台灣安裝場域地圖" class="mx-auto max-w-full h-auto rounded-lg shadow-md" src="https://md.webduino.io/uploads/upload_cf76855ee7c1bb555b45b49e41787866.jpg"/>
80+
</div>
81+
</section>
82+
<section class="py-16 bg-green-50">
83+
<div class="container mx-auto px-4">
84+
<h3 class="text-3xl font-bold text-green-700 text-center mb-12">農研技術核心科技</h3>
85+
<div class="text-center mb-12">
86+
<p class="text-lg text-gray-700 max-w-3xl mx-auto">樂農智慧農業是以<span class="text-green-600 font-semibold">農民需求</span>、在地農民豐富的栽種經驗,以及田間感測器建立場域專屬模型,透過雲端平台進行自動化控制,<span class="text-green-600 font-semibold">讓農業變得更輕鬆</span></p>
87+
</div>
88+
<div class="grid md:grid-cols-2 lg:grid-cols-4 gap-8 text-center">
89+
<div class="bg-white p-6 rounded-lg shadow-lg">
90+
<img alt="手機遠端遙控圖示" class="h-20 w-20 mx-auto mb-4" src="https://md.webduino.io/uploads/upload_f49d97687f3b01341757637cfc023c18.png"/>
91+
<h4 class="text-xl font-semibold mb-2">環境監測
92+
</h4>
93+
<p class="text-gray-600">文字文字文字文字文字文字
94+
</p>
95+
</div>
96+
<div class="bg-white p-6 rounded-lg shadow-lg">
97+
<img alt="AI智慧控制圖示" class="h-20 w-20 mx-auto mb-4" src="https://md.webduino.io/uploads/upload_9296169e6039702f62fb1445aa780ebd.png"/>
98+
<h4 class="text-xl font-semibold mb-2">數據分析</h4>
99+
<p class="text-gray-600">文字文字文字文字文字文字</p>
100+
</div>
101+
<div class="bg-white p-6 rounded-lg shadow-lg">
102+
<img alt="數據分析圖示" class="h-20 w-20 mx-auto mb-4" src="https://md.webduino.io/uploads/upload_78b18fb1a6b76a322f1a0753a21e20d6.png"/>
103+
<h4 class="text-xl font-semibold mb-2">專屬模型</h4>
104+
<p class="text-gray-600">文字文字文字文字文字文字</p>
105+
</div>
106+
<div class="bg-white p-6 rounded-lg shadow-lg">
107+
<img alt="數據分析圖示" class="h-20 w-20 mx-auto mb-4" src="https://md.webduino.io/uploads/upload_a6a1488601a3e161f6f498d99b66100b.png"/>
108+
<h4 class="text-xl font-semibold mb-2">自動控制</h4>
109+
<p class="text-gray-600">文字文字文字文字文字文字</p>
110+
</div>
111+
</div>
112+
<div class="mt-16 bg-white p-8 rounded-lg shadow-xl flex flex-col md:flex-row items-center">
113+
<img alt="感測器場域監測圖" class="w-full md:w-1/2 rounded-lg mb-6 md:mb-0 md:mr-8" src="https://md.webduino.io/uploads/upload_d9104de43bc3ff1f4e3e238c4959a7ae.png"/>
114+
<div class="md:w-1/2">
115+
<h4 class="text-2xl font-bold text-green-700 mb-4">新一代樂農小主機</h4>
116+
<p class="text-gray-700 mb-4 text-lg">可同時連接 3-10 種裝置。因應多樣態客製化環控與栽培需求,整合各式 RS485 裝置。</p>
117+
<a class="inline-block bg-green-600 hover:bg-green-700 text-white font-semibold py-3 px-8 rounded-lg shadow-md transition duration-300" href="#">查看詳細</a>
118+
</div>
119+
</div>
120+
</div>
121+
</section>
122+
123+
<section class="py-16">
124+
<div class="container mx-auto px-4">
125+
<h3 class="text-3xl font-bold text-green-700 text-center mb-12">我們可以控制什麼</h3>
126+
<div class="grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 lg:grid-cols-7 gap-6 text-center">
127+
<div class="flex flex-col items-center p-4 bg-gray-100 rounded-lg shadow">
128+
<span class="material-icons text-4xl text-green-600 mb-2">water_drop</span>
129+
<p class="text-gray-700">澆灌水</p>
130+
</div>
131+
<div class="flex flex-col items-center p-4 bg-gray-100 rounded-lg shadow">
132+
<span class="material-icons text-4xl text-green-600 mb-2">air</span>
133+
<p class="text-gray-700">風扇</p>
134+
</div>
135+
<div class="flex flex-col items-center p-4 bg-gray-100 rounded-lg shadow">
136+
<span class="material-icons text-4xl text-green-600 mb-2">wind_power</span>
137+
<p class="text-gray-700">馬達</p>
138+
</div>
139+
<div class="flex flex-col items-center p-4 bg-gray-100 rounded-lg shadow">
140+
<span class="material-icons text-4xl text-green-600 mb-2">shower</span>
141+
<p class="text-gray-700">水霧</p>
142+
</div>
143+
<div class="flex flex-col items-center p-4 bg-gray-100 rounded-lg shadow">
144+
<span class="material-icons text-4xl text-green-600 mb-2">roofing</span>
145+
<p class="text-gray-700">捲簾</p>
146+
</div>
147+
<div class="flex flex-col items-center p-4 bg-gray-100 rounded-lg shadow">
148+
<span class="material-icons text-4xl text-green-600 mb-2">lightbulb</span>
149+
<p class="text-gray-700">燈光</p>
150+
</div>
151+
<div class="flex flex-col items-center p-4 bg-gray-100 rounded-lg shadow">
152+
<span class="material-icons text-4xl text-green-600 mb-2">thermostat</span>
153+
<p class="text-gray-700">光度</p>
154+
</div>
155+
<div class="flex flex-col items-center p-4 bg-gray-100 rounded-lg shadow">
156+
<span class="material-icons text-4xl text-green-600 mb-2">thermostat_auto</span>
157+
<p class="text-gray-700">溫濕度</p>
158+
</div>
159+
<div class="flex flex-col items-center p-4 bg-gray-100 rounded-lg shadow">
160+
<span class="material-icons text-4xl text-green-600 mb-2">terrain</span>
161+
<p class="text-gray-700">土壤濕度</p>
162+
</div>
163+
<div class="flex flex-col items-center p-4 bg-gray-100 rounded-lg shadow">
164+
<span class="material-icons text-4xl text-green-600 mb-2">speed</span>
165+
<p class="text-gray-700">流量計</p>
166+
</div>
167+
<div class="flex flex-col items-center p-4 bg-gray-100 rounded-lg shadow">
168+
<span class="material-icons text-4xl text-green-600 mb-2">water</span>
169+
<p class="text-gray-700">雨量計</p>
170+
</div>
171+
<div class="flex flex-col items-center p-4 bg-gray-100 rounded-lg shadow">
172+
<span class="material-icons text-4xl text-green-600 mb-2">sensors</span>
173+
<p class="text-gray-700">各式 RS485</p>
174+
</div>
175+
</div>
176+
</div>
177+
</section>
178+
<section class="py-16 bg-gray-50">
179+
<div class="container mx-auto px-4">
180+
<h3 class="text-3xl font-bold text-green-700 text-center mb-12">場域控制一目瞭然</h3>
181+
<img alt="場域控制儀表板截圖" class="w-full rounded-lg shadow-xl" src="https://lh3.googleusercontent.com/aida-public/AB6AXuBgQ7XmT0Ed1-xfARFztsyJsrkxwmKtXJy-oWyEnw4z8-LEBIOQiNWDNj2WmimJ05WVPzJo5amYYQHyMKNAdiGH34rDYnyMfcfI9VYe1tdkmRheeUVu1ewXM4lww2syUZIFjXGi7W5TzyspuxoCdh_DkBswza4xb7NZyj1B_HXsgjA_HK3Yd8Dqyu2Vi7ih_90ClsaTzKCMUmbiHPc0hKKpZs1US5SsEIqhHqUq9uBSOm4zgufBLO1KXVymyY2MMzuDdviOInFFcQcl"/>
182+
</div>
183+
</section>
184+
<section class="py-16">
185+
<div class="container mx-auto px-4 grid md:grid-cols-2 gap-12 items-center">
186+
<div>
187+
<img alt="手機控制場域示意圖" class="w-full rounded-lg shadow-lg" src="https://lh3.googleusercontent.com/aida-public/AB6AXuC1tYlLDjnCeWwXPi4WdxXQa5Eg32Ui41x_7DHBFM1xNryCXZcJfengvEncFqd0xX6uwgeP069ipRyjOj_kqsPgmWDtHo_zjVUyWEUDg4wc9PmuBuubk5X8dCn7i3W9ogQYjXDfXGAs_ddHC8vcHXp6GIoAj4prwiM3uwgqd73rD1SmTimVOEMNRnbBv7zod7Ipgza5lpFKOnoPVLP6Zxk1TH9aYtmnKivXwg9GhhSenRzsmj3DfrH40_2QGknWtOvhLC3TujVAa4Q9"/>
188+
</div>
189+
<div class="text-center md:text-left">
190+
<h3 class="text-3xl font-bold text-green-700 mb-4">ㄧ機在手,場域我懂</h3>
191+
<p class="text-lg text-gray-700 mb-6">打開APP/網頁就能立即掌握現場溫濕度與設備運轉狀態,啟動自動化控制,讓農務管理更輕鬆。</p>
192+
<a class="inline-block bg-green-600 hover:bg-green-700 text-white font-semibold py-3 px-8 rounded-lg shadow-md transition duration-300" href="#">了解更多</a>
193+
</div>
194+
<div>
195+
<img alt="手機控制場域示意圖" class="w-full rounded-lg shadow-lg" src="https://lh3.googleusercontent.com/aida-public/AB6AXuC1tYlLDjnCeWwXPi4WdxXQa5Eg32Ui41x_7DHBFM1xNryCXZcJfengvEncFqd0xX6uwgeP069ipRyjOj_kqsPgmWDtHo_zjVUyWEUDg4wc9PmuBuubk5X8dCn7i3W9ogQYjXDfXGAs_ddHC8vcHXp6GIoAj4prwiM3uwgqd73rD1SmTimVOEMNRnbBv7zod7Ipgza5lpFKOnoPVLP6Zxk1TH9aYtmnKivXwg9GhhSenRzsmj3DfrH40_2QGknWtOvhLC3TujVAa4Q9"/>
196+
</div>
197+
<div class="text-center md:text-left">
198+
<h3 class="text-3xl font-bold text-green-700 mb-4">ㄧ機在手,場域我懂</h3>
199+
<p class="text-lg text-gray-700 mb-6">打開APP/網頁就能立即掌握現場溫濕度與設備運轉狀態,啟動自動化控制,讓農務管理更輕鬆。</p>
200+
<a class="inline-block bg-green-600 hover:bg-green-700 text-white font-semibold py-3 px-8 rounded-lg shadow-md transition duration-300" href="#">了解更多</a>
201+
</div>
202+
<div>
203+
<img alt="手機控制場域示意圖" class="w-full rounded-lg shadow-lg" src="https://lh3.googleusercontent.com/aida-public/AB6AXuC1tYlLDjnCeWwXPi4WdxXQa5Eg32Ui41x_7DHBFM1xNryCXZcJfengvEncFqd0xX6uwgeP069ipRyjOj_kqsPgmWDtHo_zjVUyWEUDg4wc9PmuBuubk5X8dCn7i3W9ogQYjXDfXGAs_ddHC8vcHXp6GIoAj4prwiM3uwgqd73rD1SmTimVOEMNRnbBv7zod7Ipgza5lpFKOnoPVLP6Zxk1TH9aYtmnKivXwg9GhhSenRzsmj3DfrH40_2QGknWtOvhLC3TujVAa4Q9"/>
204+
</div>
205+
<div class="text-center md:text-left">
206+
<h3 class="text-3xl font-bold text-green-700 mb-4">ㄧ機在手,場域我懂</h3>
207+
<p class="text-lg text-gray-700 mb-6">打開APP/網頁就能立即掌握現場溫濕度與設備運轉狀態,啟動自動化控制,讓農務管理更輕鬆。</p>
208+
<a class="inline-block bg-green-600 hover:bg-green-700 text-white font-semibold py-3 px-8 rounded-lg shadow-md transition duration-300" href="#">了解更多</a>
209+
</div>
210+
</div>
211+
</section>
212+
<section class="py-16 bg-green-50">
213+
<div class="container mx-auto px-4 grid md:grid-cols-3 gap-8">
214+
<div class="bg-white p-6 rounded-lg shadow-lg text-center">
215+
<img alt="LINE客服支援示意圖" class="w-full h-48 object-cover rounded-md mb-4" src="https://lh3.googleusercontent.com/aida-public/AB6AXuAcbkvT5djV2Pv7R_BEUTFQaZ_Dm7pIRYUTDBM1rYz9Vg9SWKWtVdZndGAz_79I-EHLWqhdI5YaIw_-ZYNdUXHKdBZyTfCTDOX5UcQUYzp74ZD1vQcHy0rIeLS0MK2yqYg4NwP2mNzyKrdlCTKskr9898xMxzWEXzLiwBv75BLbL0vxOhKcp2wIPyMrF7T8u3ipaIlCK83FxWHjIAsdbGumuiwt90YW4sRsnGXvEo3_r4Qsald9k9jOZ8BapDRoJc9Ti3rPJkLxJiMG"/>
216+
<h4 class="text-xl font-semibold text-green-700 mb-2">有問題只愛LINE一下</h4>
217+
<p class="text-gray-600 mb-4">農友可透過LINE即時反應問題,快速排除障礙,讓系統運作更順暢!</p>
218+
<a class="inline-block bg-green-500 hover:bg-green-600 text-white font-semibold py-2 px-4 rounded-lg text-sm" href="#">
219+
<span class="material-icons inline-block align-middle mr-1 text-lg">chat</span> LINE客服
220+
</a>
221+
</div>
222+
<div class="bg-white p-6 rounded-lg shadow-lg text-center">
223+
<img alt="澆水完成通知示意圖" class="w-full h-48 object-cover rounded-md mb-4" src="https://lh3.googleusercontent.com/aida-public/AB6AXuCO0iV8s_hjaIKm3L3LRGjK2BbboKKHUPduwPJ7Gzu_07gtPlI0NT7ywnWPhr0CfhRbJqIilUfpYWCOy0kR6U8TC7eAXqxGy1nawjltPenPA6jHMh72VSYAZeVKpf20VjfdebwKyeqAaV1oW04_pmlWRXsQBPiQ6MUBd6zbDe9QH2ePo85m9YRoAfehKWZJiaTKmbp_KuKHplTVqYWQSXbEpvvms7dosQJ9JVO_tElqat4QcAeFlE30faZsQPnppKafgE8hESfSaL-A"/>
224+
<h4 class="text-xl font-semibold text-green-700 mb-2">澆灌警報LINE立即報</h4>
225+
<p class="text-gray-600 mb-4">自動澆水/施肥/噴藥,完成工作LINE自動通知,掌握設備最新動態。</p>
226+
</div>
227+
<div class="bg-white p-6 rounded-lg shadow-lg text-center">
228+
<img alt="成本降低示意圖" class="w-full h-48 object-cover rounded-md mb-4" src="https://lh3.googleusercontent.com/aida-public/AB6AXuDPAsYsnCQpktIrSpOgXbR2DT8gfRHlM_PQLcRPyQdJyqQJ1pjieGoJRtRKgZP7IbEXUjjT5MXZ0wX9CM-dOcs3PcMVd-Z1DbMZ1j_LHCQNgPGr-ICX0JeX1HipT2TGelq2exiINUP1zzbU56t1kzvOqHiLnS5ixiaI8i6RsPdvOXkMS889iV1jqPfeCaR06OSYGNS5POkmuNea4vv5FR0LF70ijMB4iWMgjDUUgShRMWkr4DPy0GPpKYwjKrhbvr6SiK44ZZ4im6Oq"/>
229+
<h4 class="text-xl font-semibold text-green-700 mb-2">想要更多省點成本更低</h4>
230+
<p class="text-gray-600 mb-4">我們提供百位農友以上安裝實績,讓您節省摸索成本,完成自己的專屬場域模型。</p>
231+
</div>
232+
</div>
233+
</section>
234+
</main>
235+
<footer class="bg-gray-800 text-gray-300 py-12">
236+
<div class="container mx-auto px-4">
237+
<div class="grid md:grid-cols-3 gap-8 mb-8">
238+
<div>
239+
<h5 class="text-lg font-semibold text-white mb-3">聯絡我們</h5>
240+
<p class="mb-1">慶奇科技股份有限公司</p>
241+
<p class="mb-1"><span class="material-icons text-sm inline-block align-middle mr-1">place</span> 高雄市前鎮區復興四路 2 號 4 樓 A10</p>
242+
<p class="mb-1"><span class="material-icons text-sm inline-block align-middle mr-1">phone</span> 07-3388-511</p>
243+
<p class="mb-1"><span class="material-icons text-sm inline-block align-middle mr-1">email</span> service@webduino.io</p>
244+
</div>
245+
<div>
246+
<h5 class="text-lg font-semibold text-white mb-3">快速連結</h5>
247+
<ul class="space-y-1">
248+
<li><a class="hover:text-green-400" href="#">產品介紹</a></li>
249+
<li><a class="hover:text-green-400" href="#">場域實績</a></li>
250+
<li><a class="hover:text-green-400" href="#">食農教育</a></li>
251+
<li><a class="hover:text-green-400" href="#">聯絡我們</a></li>
252+
</ul>
253+
</div>
254+
<div>
255+
<h5 class="text-lg font-semibold text-white mb-3">關注我們</h5>
256+
<div class="flex space-x-4">
257+
<a class="text-gray-400 hover:text-white" href="#"><img alt="Facebook icon" class="w-6 h-6" src="https://lh3.googleusercontent.com/aida-public/AB6AXuDj0469GvjxwDlqnECXSV_ypXfmB7cLw_yXMNyQdtj6OnI3_RkzFtmTF7ECgIJNDT4tyBB6Q7DG4v2Z8PjzQQXzfrqQB-mdWQuv0khop_iZlI4VaJGA9Ijl5pPclEq1H8a9veoU77zXqoWDnwD4gjRD3-WJR77PIw_A81jUIsY_ewcm4D2iGS9QYiEuZ3sv9HzTB_vZsS0mrOgUEEQ11hkco1Edvjv3K3qLtoVLlBCFaTW78M1Zb5cmE0q2K-F4QvhcO7RkzfEyEIIF"/></a>
258+
<a class="text-gray-400 hover:text-white" href="#"><img alt="LINE icon" class="w-6 h-6" src="https://lh3.googleusercontent.com/aida-public/AB6AXuBlrWtpnODJWwwPkOu6yEQQnx19ma8vwZlJ_2oqOqCUMvHHTEh1Tj1oknx8FYv_-g4mYhngPA5Q82aSLwuYIi_Kfa10yq1mScKlsgnRE5w5D-z4QTC3OZzkEWMHYDSiS7hejQcXPuAe5lxDVdBEDXnEh-tdYqLnTP0wD730Al4y3X2HIpU_Zufgjl8FWAApwhPJIHOttC4wHof9yzh16g6SKE5RlV2PmDiXRqcXXYA3YiJgSh5y-u9mbEe3o0UGW0h77ODYO74rOv1m"/></a>
259+
</div>
260+
</div>
261+
</div>
262+
<div class="border-t border-gray-700 pt-8 text-center text-sm">
263+
<p>© 2025 慶奇科技股份有限公司 版權所有</p>
264+
<p>本網站內容均受著作權法保護,未經授權不得轉載。</p>
265+
</div>
266+
</div>
267+
</footer>
268+
269+
</body></html>

index.html

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,14 @@
33
<head>
44
<meta charset="UTF-8">
55
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6-
<title>農業Web應用</title>
6+
<title>慶奇科技</title>
7+
<script src="https://cdn.tailwindcss.com"></script>
8+
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet"/>
9+
<style>
10+
body {
11+
font-family: 'Noto Sans TC', sans-serif;
12+
}
13+
</style>
714
</head>
815
<body>
916
<div id="app"></div>

0 commit comments

Comments
 (0)