Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Members #42

Open
wants to merge 9 commits into
base: main
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
17,570 changes: 17,570 additions & 0 deletions package-lock.json

Large diffs are not rendered by default.

1 change: 1 addition & 0 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,7 @@
"react-dom": "^18.3.1",
"react-router-dom": "^6.26.2",
"react-scripts": "5.0.1",
"styled-components": "^6.1.13",
"tailwindcss": "^3.4.13",
"web-vitals": "^2.1.0"
},
Expand Down
83 changes: 78 additions & 5 deletions src/pages/Company.jsx
Original file line number Diff line number Diff line change
@@ -1,11 +1,84 @@
// こちらは、/company 会社紹介のページです。

// import { Button } from "../components/Button";
// import { Image } from "../components/Image";
// import { useNavigate } from "react-router-dom";
import { Button } from "../components/Button";
import { Image } from "../components/Image";
import { useNavigate } from "react-router-dom";

export default function Company() {
// const navigate = useNavigate();
return (
<div className="min-h-screen bg-amber-100 text-gray-800">
{/* ヘッダーセクション */}
<header className=" text-white py-8 shadow-md">
<div className="container mx-auto text-center">
<h1 className="text-4xl font-extrabold tracking-wide">会社概要</h1>
</div>
</header>
{/* メインコンテンツ */}
<main className="py-16">
<div className="container mx-auto">
<section className="mb-12">
<h2 className="text-2xl font-bold mb-4">企業情報</h2>
<p className="text-lg mb-4">
株式会社ヒトは、革新的な技術とサービスで社会に貢献する企業です。
お客様と共に未来を創造し、持続可能な発展を目指します。
</p>
<div className="grid grid-cols-1 md:grid-cols-2 gap-8">
<div>
<h3 className="text-xl font-semibold">設立</h3>
<p>2121年4月1日</p>
</div>
<div>
<h3 className="text-xl font-semibold">所在地</h3>
<p>長崎県長崎市高島町端島</p>
</div>
<div>
<h3 className="text-xl font-semibold">代表者</h3>
<p>代表取締役 田畑剣</p>
</div>
<div>
<h3 className="text-xl font-semibold">資本金</h3>
<p>1000億円</p>
</div>
</div>
</section>

<section className="mb-12">
<h2 className="text-2xl font-bold mb-4">企業ビジョン</h2>
<p className="text-lg">
私たちは、技術の力でより良い社会を創造します。AI、クラウド、システム開発など、最先端技術を駆使して、社会が直面する課題を解決し、持続可能な未来を実現することを目指しています。
</p>
</section>

<section className="mb-12">
<h2 className="text-2xl font-bold mb-4">沿革</h2>
<ul className="list-disc pl-6">
<li>2121年4月 - 株式会社ヒト設立</li>
<li>2210年6月 - 東京本社を軍艦島に移転</li>
<li>2211年10月 - 類人猿教育事業を開始</li>
<li>2222年1月 - 類人猿発売事業を拡大</li>
</ul>
</section>

{/* 企業イメージ画像 */}
<section className="mb-12">
<h2 className="text-2xl font-bold mb-4">企業イメージ</h2>
<img
src="https://example.com/company-image.jpg"
alt="企業イメージ"
width={800}
height={600}
className="rounded-lg shadow-md"
/>
</section>
</div>
</main>

return <div></div>;
{/* フッター */}
<footer className="bg-primary text-primary-foreground py-8">
<div className="container mx-auto text-center">
<p>&copy; 2024 株式会社ヒト. All rights reserved.</p>
</div>
</footer>
</div>
);
}
116 changes: 109 additions & 7 deletions src/pages/Contact.jsx
Original file line number Diff line number Diff line change
@@ -1,11 +1,113 @@
// こちらは、/contact 会社へのお問い合わせページです。

// import { Button } from "../components/Button";
// import { Image } from "../components/Image";
// import { useNavigate } from "react-router-dom";
import { useNavigate } from "react-router-dom";
import { useState } from "react";

export default function Contact() {
// const navigate = useNavigate();
const navigate = useNavigate();
const [formData, setFormData] = useState({
name: "",
email: "",
message: "",
});

const handleChange = (e) => {
setFormData({
...formData,
[e.target.name]: e.target.value,
});
};

const handleSubmit = (e) => {
e.preventDefault();
console.log("Form data submitted: ", formData);
};

return <div></div>;
return (
<div className="min-h-screen bg-amber-100 text-foreground">
<header className="bg-primary text-primary-foreground p-4">
<div className="container mx-auto flex flex-col sm:flex-row justify-between items-center">
<h1 className="text-2xl text-amber-950 font-bold">株式会社ヒト</h1>
<nav>
<ul className="flex space-x-4">
<li>
<a href="/" className="hover:underline text-amber-950">
ホーム
</a>
</li>
<li>
<a href="/contact" className="hover:underline text-amber-950">
お問い合わせ
</a>
</li>
</ul>
</nav>
</div>
</header>
<main className="container mx-auto py-16">
<h1 className="text-3xl font-bold text-center mb-8">お問い合わせ</h1>
<form
onSubmit={handleSubmit}
className="max-w-lg mx-auto bg-white p-8 rounded-lg shadow-md"
>
<div className="form-group mb-4">
<label htmlFor="name" className="block text-lg font-semibold mb-2">
お名前:
</label>
<input
type="text"
id="name"
name="name"
value={formData.name}
onChange={handleChange}
required
className="w-full p-3 border border-gray-300 rounded-lg shadow-sm focus:outline-none focus:ring-2 focus:ring-primary"
/>
</div>
<div className="form-group mb-4">
<label htmlFor="email" className="block text-lg font-semibold mb-2">
メールアドレス:
</label>
<input
type="email"
id="email"
name="email"
value={formData.email}
onChange={handleChange}
required
className="w-full p-3 border border-gray-300 rounded-lg shadow-sm focus:outline-none focus:ring-2 focus:ring-primary"
/>
</div>
<div className="form-group mb-6">
<label
htmlFor="message"
className="block text-lg font-semibold mb-2"
>
メッセージ:
</label>
<textarea
id="message"
name="message"
rows="5"
value={formData.message}
onChange={handleChange}
required
className="w-full p-3 border border-gray-300 rounded-lg shadow-sm focus:outline-none focus:ring-2 focus:ring-primary"
/>
</div>
<div className="form-group text-center">
<button
type="submit"
className="bg-primary text-primary-foreground p-4 rounded-lg shadow-md hover:underline"
>
送信
</button>
</div>
</form>
</main>
<footer className="bg-primary text-primary-foreground py-8">
<div className="container mx-auto text-center">
<p>&copy; 2024 株式会社ヒト. All rights reserved.</p>
</div>
</footer>
</div>
);
}
89 changes: 61 additions & 28 deletions src/pages/Home.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -17,42 +17,72 @@ export default function Home() {
};

return (
<div className="min-h-screen bg-background text-foreground">
<div className="min-h-screen bg-amber-100 text-foreground">
<header className="bg-primary text-primary-foreground p-4">
<div className="container mx-auto flex flex-col sm:flex-row justify-between items-center">
<div className="flex items-center space-x-2 mb-4 sm:mb-0">
<Image
src="https://wed.company/img/wed.svg"
src="https://png.pngtree.com/png-vector/20240416/ourmid/pngtree-gorilla-hand-with-index-finger-pointing-isolated-on-white-background-png-image_12290189.png"
alt="企業ロゴ"
width={40}
height={40}
/>
<h1 className="text-2xl font-bold">株式会社〇〇</h1>
<h1 className="text-2xl text-amber-950 font-bold">株式会社ヒト</h1>
</div>
<nav>
<ul className="flex flex-wrap justify-center sm:justify-end space-x-4">
<ul className="flex flex-wrap justify-center space-x-4">
<li>
<a href="/" className="hover:underline">
<a
href="/"
className="bg-card text-card-foreground p-4 rounded-lg shadow-md hover:underline text-amber-950"
>
ホーム
</a>
</li>
<li>
<a href="/product" className="hover:underline">
<a
href="/product"
className="bg-card text-card-foreground p-4 rounded-lg shadow-md hover:underline text-amber-950"
>
事業内容
</a>
</li>
<li>
<a href="/company" className="hover:underline">
<a
href="/company"
className="bg-card text-card-foreground p-4 rounded-lg shadow-md hover:underline text-amber-950"
>
会社概要
</a>
</li>

<li>
<a
href="/Members"
className="bg-card text-card-foreground p-4 rounded-lg shadow-md hover:underline text-amber-950"
>
従業員
</a>
</li>






<li>
<a href="/recruitment" className="hover:underline">
<a
href="/recruitment"
className="bg-card text-card-foreground p-4 rounded-lg shadow-md hover:underline text-amber-950"
>
採用情報
</a>
</li>
<li>
<a href="/contact" className="hover:underline">
<a
href="/contact"
className="bg-card text-card-foreground p-4 rounded-lg shadow-md hover:underline text-amber-950"
>
お問い合わせ
</a>
</li>
Expand All @@ -64,7 +94,7 @@ export default function Home() {
<main>
<section className="relative h-[1441px]">
<Image
src="https://i0.wp.com/www.titanui.com/wp-content/uploads/2018/01/25/Artificial-Intelligence-SVG-Icons.png?ssl=1"
src="https://img.freepik.com/free-photo/funny-old-woman-with-monkey_23-2151058755.jpg"
alt="企業イメージ"
layout="fill"
width={1920}
Expand All @@ -74,11 +104,18 @@ export default function Home() {
/>
<div className="absolute inset-0 flex items-center justify-center">
<div className="text-center text-white">
<h2 className="text-4xl font-bold mb-4">技術で未来を創造する</h2>
<h2 className="text-4xl font-bold mb-4">
類人猿にヒューマンレベルを
</h2>
<p className="text-xl mb-8">
私たちは、革新的なソリューションで社会に貢献します
私達は新人類を生み出し社会に貢献させます
</p>
<Button size="lg" variant="secondary" onClick={handleClickAbout}>
<Button
size="lg"
className="hover:underline"
variant="secondary"
onClick={handleClickAbout}
>
詳細はこちら
</Button>
</div>
Expand All @@ -90,21 +127,19 @@ export default function Home() {
<h2 className="text-3xl font-bold mb-8 text-center">事業内容</h2>
<div className="grid grid-cols-1 md:grid-cols-3 gap-8">
<div className="bg-card text-card-foreground p-6 rounded-lg shadow-md">
<h3 className="text-xl font-semibold mb-2">システム開発</h3>
<h3 className="text-xl font-semibold mb-2">類人猿研究</h3>
<p>
最新技術を活用した、高品質なシステム開発サービスを提供します
類人猿の現在の思考力を解析しさらなる成長に繋がる研究をします
</p>
</div>
<div className="bg-card text-card-foreground p-6 rounded-lg shadow-md">
<h3 className="text-xl font-semibold mb-2">AIソリューション</h3>
<p>
機械学習と深層学習を用いた、革新的なAIソリューションを開発します。
</p>
<h3 className="text-xl font-semibold mb-2">AI進化</h3>
<p>マイクロチップを脳に埋め込み思考力判断力を補助します。</p>
</div>
<div className="bg-card text-card-foreground p-6 rounded-lg shadow-md">
<h3 className="text-xl font-semibold mb-2">クラウドサービス</h3>
<h3 className="text-xl font-semibold mb-2">徹底した教育</h3>
<p>
安全で効率的なクラウドインフラストラクチャを構築・運用します
人類、類人猿共双方にとっての安全性を守るための教育をします
</p>
</div>
</div>
Expand All @@ -115,9 +150,7 @@ export default function Home() {
<div className="container mx-auto">
<h2 className="text-3xl font-bold mb-8 text-center">企業理念</h2>
<div className="text-center max-w-2xl mx-auto">
<p className="text-xl mb-4">
「技術を通じて、より良い社会の実現に貢献する」
</p>
<p className="text-xl mb-4">「新たな労働力で、よりよい社会へ」</p>
<p className="mb-4">
私たちは、最先端の技術と創造力を駆使し、社会の課題解決に取り組みます。
持続可能な未来の創造に向けて、常に挑戦し続けます。
Expand Down Expand Up @@ -163,9 +196,9 @@ export default function Home() {
<footer className="bg-primary text-primary-foreground py-8">
<div className="container mx-auto grid grid-cols-1 md:grid-cols-3 gap-8">
<div>
<h3 className="text-lg font-semibold mb-4">株式会社〇〇</h3>
<p>〒151-0051</p>
<p>東京都渋谷区千駄ヶ谷 4-14-4 SKビル千駄ヶ谷 2F</p>
<h3 className="text-lg font-semibold mb-4">株式会社ヒト</h3>
<p>〒851-1315</p>
<p>長崎県長崎市高島町端島</p>
</div>
<div>
<h3 className="text-lg font-semibold mb-4">リンク</h3>
Expand Down Expand Up @@ -197,7 +230,7 @@ export default function Home() {
</div>
</div>
<div className="container mx-auto mt-8 text-center">
<p>&copy; 2024 株式会社〇〇. All rights reserved.</p>
<p>&copy; 2024 株式会社ヒト. All rights reserved.</p>
</div>
</footer>
</div>
Expand Down
Loading