Skip to content

Commit d8256bf

Browse files
committed
updated index.html file
1 parent 282c8c5 commit d8256bf

File tree

6 files changed

+272
-37
lines changed

6 files changed

+272
-37
lines changed

assets/Byjus.png

15.3 KB
Loading

assets/Swiggy Access.png

18.9 KB
Loading

companies.xlsx

10.1 KB
Binary file not shown.

company-details.html

Lines changed: 174 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,174 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6+
<title>Company Profile Preview</title>
7+
<script src="https://cdn.tailwindcss.com"></script>
8+
<!-- Include SheetJS library -->
9+
<script src="https://cdnjs.cloudflare.com/ajax/libs/xlsx/0.18.5/xlsx.full.min.js"></script>
10+
<!-- Link to external JS -->
11+
<script src="script.js" defer></script>
12+
</head>
13+
<body class="bg-gray-50 p-6">
14+
15+
<div class="max-w-4xl mx-auto bg-white rounded-2xl shadow-md p-8">
16+
17+
<!-- Header -->
18+
<header class="flex items-center gap-6 mb-8">
19+
<div class="w-20 h-20 rounded-lg bg-gray-100 flex items-center justify-center text-gray-400">
20+
<img src="assets/swiggy_logo.png" alt="swiggy_logo" id="brand_logo">
21+
</div>
22+
<div>
23+
<h1 class="text-3xl font-semibold text-gray-900" id="companyTitle">Company Name</h1>
24+
<div class="text-lg text-gray-500 italic" id="brandTitle">Brand Name</div>
25+
</div>
26+
</header>
27+
28+
<!-- Grid: Basic Info + Contact -->
29+
<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
30+
31+
<!-- Basic Information -->
32+
<section class="bg-white border rounded-lg p-6">
33+
<h2 class="text-xl font-semibold text-gray-800 mb-4">Basic Information</h2>
34+
<dl class="grid grid-cols-1 gap-y-3 text-sm text-gray-700">
35+
<div class="flex justify-between"><dt class="font-medium">CIN</dt><dd id="bi_cin">U12345ABCDE</dd></div>
36+
<div class="flex justify-between"><dt class="font-medium">Date of Incorporation</dt><dd id="bi_date_of_incorporation">01 January 2000</dd></div>
37+
<div class="flex justify-between"><dt class="font-medium">Company Type</dt><dd id="bi_company_type">Public</dd></div>
38+
<div class="flex justify-between"><dt class="font-medium">Company Status</dt><dd id="bi_company_status">Active</dd></div>
39+
<div class="flex justify-between"><dt class="font-medium">MCA Status</dt>
40+
<dd class="flex items-center gap-2" id="bi_mca_status">
41+
<!-- <span class="inline-block w-5 h-5 rounded-full bg-green-100 text-green-700 text-xs font-semibold flex items-center justify-center">✓</span> -->
42+
Registered
43+
</dd>
44+
</div>
45+
<div class="flex justify-between"><dt class="font-medium">SC Code</dt><dd id="bi_sc_code">12345</dd></div>
46+
<div class="flex justify-between"><dt class="font-medium">Primary Exchange</dt><dd id="bi_primary_exchange">NSE</dd></div>
47+
<div class="flex justify-between"><dt class="font-medium">Industry</dt><dd id="bi_industry">Technology</dd></div>
48+
</dl>
49+
</section>
50+
51+
<!-- Contact Details -->
52+
<section class="bg-white border rounded-lg p-6">
53+
<h2 class="text-xl font-semibold text-gray-800 mb-4">Contact Details</h2>
54+
<dl class="grid grid-cols-1 gap-y-3 text-sm text-gray-700">
55+
56+
<div class="flex justify-between">
57+
<dt class="font-medium">MCA Address</dt>
58+
<dd class="text-right">123 Company Street, Business City</dd>
59+
</div>
60+
61+
<div class="flex justify-between">
62+
<dt class="font-medium">Address</dt>
63+
<dd class="text-right">456 Corporate Avenue, Business City</dd>
64+
</div>
65+
66+
<div class="flex justify-between">
67+
<dt class="font-medium">Website Address</dt>
68+
<dd class="text-right">www.example.com</dd>
69+
</div>
70+
71+
<div class="flex justify-between"><dt class="font-medium">Phone</dt><dd class="text-right">+91 1010101010</dd></div>
72+
<div class="flex justify-between"><dt class="font-medium">Mobile</dt><dd class="text-right">+91 2020202020</dd></div>
73+
<div class="flex justify-between"><dt class="font-medium">Fax</dt><dd class="text-right">+91 3030303030</dd></div>
74+
<div class="flex justify-between items-center">
75+
<dt class="font-medium">Email</dt>
76+
<dd class="text-right"><a href="mailto:info@example.com" class="text-indigo-600 hover:underline">info@example.com</a></dd>
77+
</div>
78+
<div class="flex justify-between items-center">
79+
<dt class="font-medium">Website</dt>
80+
<dd class="text-right"><a href="https://www.example.com" target="_blank" class="text-indigo-600 hover:underline">https://www.example.com</a></dd>
81+
</div>
82+
83+
<div class="pt-2 flex items-center gap-3 mt-2">
84+
<a href="#" aria-label="LinkedIn" class="text-gray-500 hover:text-gray-800">in</a>
85+
<a href="#" aria-label="Twitter" class="text-gray-500 hover:text-gray-800">tw</a>
86+
<a href="#" aria-label="Instagram" class="text-gray-500 hover:text-gray-800">ig</a>
87+
<a href="#" aria-label="Facebook" class="text-gray-500 hover:text-gray-800">fb</a>
88+
<a href="#" aria-label="WhatsApp" class="text-gray-500 hover:text-gray-800">wa</a>
89+
</div>
90+
91+
</dl>
92+
</section>
93+
94+
</div>
95+
96+
<!-- Financial Info -->
97+
<div class="mt-6 bg-white border rounded-lg p-6">
98+
<h3 class="text-lg font-semibold text-gray-800 mb-3">Financial Information</h3>
99+
<a href="/financials" class="inline-block bg-white border rounded px-4 py-2 shadow-sm hover:shadow-md text-indigo-600">View Financials</a>
100+
</div>
101+
102+
<!-- Previous Details -->
103+
<div class="mt-6 bg-white border rounded-lg p-6">
104+
<h4 class="text-lg font-semibold text-gray-800 mb-3">Previous Details</h4>
105+
<div class="text-sm text-gray-700">
106+
<div class="flex justify-between py-1"><span class="font-medium">Previous Name(s)</span><span>Old Company Name</span></div>
107+
<div class="flex justify-between py-1"><span class="font-medium">Previous CIN(s)</span><span>U56789CD5678XYZ</span></div>
108+
</div>
109+
</div>
110+
111+
<!-- Business Description -->
112+
<div class="mt-6 bg-white border rounded-lg p-6">
113+
<h4 class="text-lg font-semibold text-gray-800 mb-3">Business Description</h4>
114+
<p class="text-sm text-gray-700 leading-relaxed" id="businesses_description">
115+
We are a leading provider of innovative technology solutions, delivering products and services that empower businesses to scale and thrive in the digital age. Our offerings span software development, cloud infrastructure, and consulting, with a strong focus on customer success.
116+
</p>
117+
</div>
118+
119+
<!-- Footer -->
120+
<footer class="mt-6 flex justify-between items-center text-sm text-gray-500">
121+
<div>Last updated: <time>29/08/2025</time></div>
122+
<div class="flex gap-3">
123+
<button class="px-3 py-1 border rounded text-sm">Edit</button>
124+
<button class="px-3 py-1 bg-indigo-600 text-white rounded text-sm">Download PDF</button>
125+
</div>
126+
</footer>
127+
128+
</div>
129+
130+
<script>
131+
const params = new URLSearchParams(window.location.search);
132+
const companyName = params.get("company");
133+
134+
if (companyName) {
135+
const key = companyName.toLowerCase(); // normalize lookup
136+
const companyData = JSON.parse(localStorage.getItem(key));
137+
138+
if (companyData) {
139+
document.title = companyData["Brand Name"] + " - Company Details";
140+
document.getElementById("brandTitle").innerText = companyData["Brand Name"];
141+
document.getElementById("companyTitle").innerText = companyData["Company Name"];
142+
143+
// set image src
144+
const imagePath = "assets/" + companyData["Brand Name"] + ".png";
145+
document.getElementById("brand_logo").src = imagePath;
146+
document.getElementById("brand_logo").alt = companyData["Brand Name"];
147+
148+
// basic information
149+
document.getElementById("bi_date_of_incorporation").innerText = companyData["Date Of Incorporation"];
150+
document.getElementById("bi_company_type").innerText = companyData["Company Type"];
151+
document.getElementById("bi_company_status").innerText = companyData["Company Status"];
152+
document.getElementById("bi_mca_status").innerText = companyData["MCA Status"];
153+
document.getElementById("bi_sc_code").innerText = companyData["SC Code"];
154+
document.getElementById("bi_primary_exchange").innerText = companyData["Primary Exchange"];
155+
document.getElementById("bi_industry").innerText = companyData["Sub Industry"];
156+
157+
// contact information
158+
// document.getElementById("bi_industry").innerText = companyData["Sub Industry"];
159+
160+
161+
// business description
162+
document.getElementById("businesses_description").innerText = companyData["Business Discription"];
163+
164+
console.log("Company Data:", companyData);
165+
} else {
166+
console.error("Company not found in localStorage:", key);
167+
}
168+
}
169+
</script>
170+
171+
172+
173+
</body>
174+
</html>

index.html

Lines changed: 72 additions & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -1,46 +1,81 @@
11
<!DOCTYPE html>
22
<html lang="en">
33
<head>
4-
<meta charset="UTF-8">
5-
<meta http-equiv="X-UA-Compatible" content="IE=edge">
6-
<meta name="viewport" content="width=device-width, initial-scale=1.0">
7-
<!-- Bootstrap CSS -->
8-
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
9-
<title>CodeNCode</title>
4+
<meta charset="UTF-8">
5+
<title>Company Directory</title>
6+
<script src="https://cdn.tailwindcss.com"></script>
7+
<script src="https://cdnjs.cloudflare.com/ajax/libs/xlsx/0.18.5/xlsx.full.min.js"></script>
8+
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.5/gsap.min.js"></script>
109
</head>
11-
<body>
12-
<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
13-
<div class="container-fluid">
14-
<a class="navbar-brand" href="#">CodeNCode</a>
15-
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarTogglerDemo02" aria-controls="navbarTogglerDemo02" aria-expanded="false" aria-label="Toggle navigation">
16-
<span class="navbar-toggler-icon"></span>
17-
</button>
18-
<div class="collapse navbar-collapse" id="navbarTogglerDemo02">
19-
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
20-
<li class="nav-item">
21-
<a class="nav-link active" aria-current="page" href="#">Home</a>
22-
</li>
23-
<li class="nav-item">
24-
<a class="nav-link" href="#">Editorials</a>
25-
</li>
26-
<li class="nav-item">
27-
<a class="nav-link" href="#">Data Structures</a>
28-
</li>
29-
<li class="nav-item">
30-
<a class="nav-link" href="#">Algorithms</a>
31-
</li>
32-
</ul>
33-
<form class="d-flex">
34-
<input class="form-control me-2" type="search" placeholder="Search" aria-label="Search">
35-
<button class="btn btn-outline-success" type="submit">Search</button>
36-
</form>
37-
</div>
10+
<body class="bg-gray-50 min-h-screen font-sans">
11+
<div class="max-w-5xl mx-auto py-12 px-6">
12+
13+
<!-- Header -->
14+
<h1 class="text-4xl font-bold text-gray-800 text-center mb-10">
15+
Company Directory
16+
</h1>
17+
18+
<!-- Search Bar -->
19+
<div class="flex justify-center mb-8">
20+
<input type="text" id="searchBox" placeholder="Search companies..."
21+
class="w-full md:w-1/2 px-4 py-3 rounded-xl border border-gray-300 shadow-sm focus:outline-none focus:ring-2 focus:ring-indigo-500 transition"/>
3822
</div>
39-
</nav>
4023

24+
<!-- Dynamic Company List -->
25+
<div id="companyList" class="grid md:grid-cols-2 lg:grid-cols-3 gap-6"></div>
26+
</div>
27+
28+
<script>
29+
async function loadCompanies() {
30+
try {
31+
// Fetch Excel
32+
const response = await fetch("companies.xlsx");
33+
const arrayBuffer = await response.arrayBuffer();
34+
35+
// Parse with SheetJS
36+
const workbook = XLSX.read(arrayBuffer, { type: "array" });
37+
const sheet = workbook.Sheets[workbook.SheetNames[0]];
38+
const data = XLSX.utils.sheet_to_json(sheet);
39+
40+
const list = document.getElementById("companyList");
41+
42+
// Generate cards dynamically
43+
data.forEach(row => {
44+
const companyName = row["Company Name"];
45+
const brandName = row["Brand Name"] || companyName;
46+
const key = companyName.toLowerCase();
47+
48+
// Save in localStorage
49+
localStorage.setItem(key, JSON.stringify(row));
50+
51+
// Create card
52+
const card = document.createElement("a");
53+
card.href = `company-details.html?company=${encodeURIComponent(companyName)}`;
54+
card.className =
55+
"company-card block p-6 bg-white rounded-2xl shadow hover:shadow-xl transition transform hover:-translate-y-1";
56+
card.innerHTML = `
57+
<h2 class="text-xl font-semibold text-indigo-600">${brandName}</h2>
58+
<p class="text-gray-500">${companyName}</p>
59+
`;
60+
list.appendChild(card);
61+
});
62+
63+
64+
} catch (err) {
65+
console.error("Error loading companies.xlsx:", err);
66+
}
67+
}
4168

69+
// Search filter
70+
document.getElementById("searchBox").addEventListener("keyup", function () {
71+
const filter = this.value.toLowerCase();
72+
document.querySelectorAll(".company-card").forEach(card => {
73+
const text = card.innerText.toLowerCase();
74+
card.style.display = text.includes(filter) ? "" : "none";
75+
});
76+
});
4277

43-
<!-- Option 1: Bootstrap Bundle with Popper -->
44-
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM" crossorigin="anonymous"></script>
78+
loadCompanies();
79+
</script>
4580
</body>
46-
</html>
81+
</html>

script.js

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
async function loadCompanies() {
2+
try {
3+
const response = await fetch("companies.xlsx");
4+
const arrayBuffer = await response.arrayBuffer();
5+
6+
const workbook = XLSX.read(arrayBuffer, { type: "array" });
7+
const sheet = workbook.Sheets[workbook.SheetNames[0]];
8+
const data = XLSX.utils.sheet_to_json(sheet);
9+
10+
// Store each company as lowercase key
11+
data.forEach(row => {
12+
const companyName = row["Company Name"];
13+
if (companyName) {
14+
const key = companyName.toLowerCase(); // lowercase key
15+
localStorage.setItem(key, JSON.stringify(row));
16+
}
17+
});
18+
19+
console.log("Companies stored individually in localStorage (lowercase keys)");
20+
21+
} catch (err) {
22+
console.error("Error reading companies.xlsx:", err);
23+
}
24+
}
25+
26+
loadCompanies();

0 commit comments

Comments
 (0)