Skip to content

Commit c23fd0b

Browse files
committed
added
1 parent 72d0a03 commit c23fd0b

6 files changed

Lines changed: 167 additions & 188 deletions

File tree

CGPA calci/index.html

Whitespace-only changes.

CGPA calci/logic.js

Whitespace-only changes.

RandomPasswordGenerator

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
Subproject commit fc3787e58e2ceb3bef7cff87ec4c072bfd7e3320

index.html

Lines changed: 3 additions & 168 deletions
Original file line numberDiff line numberDiff line change
@@ -8,38 +8,7 @@
88
<!-- Bootstrap 5 CSS -->
99
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">
1010

11-
<style>
12-
:root{
13-
--accent: #0d6efd;
14-
--card-radius: 12px;
15-
}
16-
body {
17-
min-height: 100vh;
18-
background: linear-gradient(135deg,#f8fafc 0%, #e9f2ff 40%, #fff 100%);
19-
color:#0f172a;
20-
-webkit-font-smoothing:antialiased;
21-
-moz-osx-font-smoothing:grayscale;
22-
}
23-
.hero {
24-
border-radius: 14px;
25-
background: linear-gradient(180deg, rgba(255,255,255,0.8), rgba(255,255,255,0.65));
26-
box-shadow: 0 6px 30px rgba(13, 110, 253, 0.08);
27-
backdrop-filter: blur(6px);
28-
}
29-
.app-card {
30-
border-radius: var(--card-radius);
31-
transition: transform .18s ease, box-shadow .18s ease;
32-
}
33-
.app-card:hover {
34-
transform: translateY(-6px);
35-
box-shadow: 0 10px 30px rgba(13,110,253,0.12);
36-
}
37-
footer { opacity: .85; }
38-
.search-field {
39-
max-width: 540px;
40-
}
41-
.muted-small { color: #6b7280; font-size: .9rem; }
42-
</style>
11+
4312
</head>
4413
<body>
4514

@@ -103,142 +72,8 @@ <h2 class="h5">About</h2>
10372
<!-- Bootstrap JS (with Popper) -->
10473
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>
10574

106-
<script>
75+
<script src="main.js"></script>
10776
// Data for projects - keep paths as in your filesystem
108-
const projects = [
109-
{ title: 'Calculator', desc: 'Basic calculator with keyboard support.', path: 'calculator/index.html' },
110-
{ title: 'Bookmark', desc: 'Save and manage quick links locally.', path: 'Bookmark/index.html' },
111-
{ title: 'CGPA Calculator', desc: 'Calculate GPA/CGPA for semesters.', path: 'CGPA calci/index.html' },
112-
{ title: 'Employee App', desc: 'Simple CRUD demo for employees.', path: 'EmployeeApp/index.html' },
113-
{ title: 'Memory Game', desc: 'Classic card matching game.', path: 'Memory_Game/index.html' },
114-
{ title: 'Movie App', desc: 'Search and browse movies.', path: 'Movie_APP/index.html' }
115-
];
116-
117-
// Utility: sanitize text for search
118-
const normalize = s => s.toLowerCase();
119-
120-
// Render project cards
121-
function renderProjects(list) {
122-
const grid = document.getElementById('projectsGrid');
123-
grid.innerHTML = '';
124-
if (!list.length) {
125-
grid.innerHTML = '<div class="col-12"><div class="alert alert-info mb-0">No projects found.</div></div>';
126-
return;
127-
}
128-
list.forEach(p => {
129-
const col = document.createElement('div');
130-
col.className = 'col-12 col-sm-6 col-lg-4';
131-
col.innerHTML = `
132-
<div class="card app-card h-100">
133-
<div class="card-body d-flex flex-column">
134-
<h5 class="card-title mb-1">${escapeHtml(p.title)}</h5>
135-
<p class="card-text text-muted small mb-3">${escapeHtml(p.desc)}</p>
136-
<div class="mt-auto d-flex justify-content-between align-items-center">
137-
<a href="${encodeURI(p.path)}" class="btn btn-outline-primary btn-sm" aria-label="Open ${escapeHtml(p.title)}">Open</a>
138-
<button class="btn btn-sm btn-outline-secondary copy-btn" data-path="${encodeURI(p.path)}" type="button" title="Copy path">Copy path</button>
139-
</div>
140-
</div>
141-
</div>
142-
`;
143-
grid.appendChild(col);
144-
});
145-
}
146-
147-
// Simple HTML escaper for safety
148-
function escapeHtml(str) {
149-
return String(str)
150-
.replace(/&/g, '&amp;')
151-
.replace(/"/g, '&quot;')
152-
.replace(/'/g, '&#39;')
153-
.replace(/</g, '&lt;')
154-
.replace(/>/g, '&gt;');
155-
}
156-
157-
// Live filter
158-
function filterProjects(query) {
159-
const q = normalize(query.trim());
160-
if (!q) return projects.slice();
161-
return projects.filter(p => normalize(p.title).includes(q) || normalize(p.desc).includes(q));
162-
}
163-
164-
document.addEventListener('DOMContentLoaded', () => {
165-
const search = document.getElementById('search');
166-
const clearBtn = document.getElementById('clearSearch');
167-
168-
// Initial render
169-
renderProjects(projects);
170-
171-
// Search input handler
172-
search.addEventListener('input', () => {
173-
const val = search.value;
174-
const results = filterProjects(val);
175-
renderProjects(results);
176-
clearBtn.classList.toggle('d-none', !val);
177-
});
178-
179-
// Clear button
180-
clearBtn.addEventListener('click', () => {
181-
search.value = '';
182-
search.dispatchEvent(new Event('input'));
183-
search.focus();
184-
clearBtn.classList.add('d-none');
185-
});
186-
187-
// Keyboard shortcut: press "/" to focus search (if not typing in an input)
188-
document.addEventListener('keydown', (e) => {
189-
if (e.key === '/' && !['INPUT','TEXTAREA'].includes(document.activeElement.tagName)) {
190-
e.preventDefault();
191-
search.focus();
192-
search.select();
193-
}
194-
});
195-
196-
// Smooth scroll for internal links
197-
document.querySelectorAll('a[href^="#"]').forEach(link => {
198-
link.addEventListener('click', (e) => {
199-
const target = document.querySelector(link.getAttribute('href'));
200-
if (target) {
201-
e.preventDefault();
202-
target.scrollIntoView({ behavior: 'smooth', block: 'start' });
203-
}
204-
});
205-
});
206-
207-
// Copy path buttons (event delegation)
208-
document.getElementById('projectsGrid').addEventListener('click', (e) => {
209-
const btn = e.target.closest('.copy-btn');
210-
if (!btn) return;
211-
const path = decodeURI(btn.getAttribute('data-path') || '');
212-
if (navigator.clipboard) {
213-
navigator.clipboard.writeText(path).then(() => {
214-
btn.textContent = 'Copied';
215-
setTimeout(() => btn.textContent = 'Copy path', 1200);
216-
}, () => {
217-
alert('Unable to copy to clipboard.');
218-
});
219-
} else {
220-
// Fallback
221-
const ta = document.createElement('textarea');
222-
ta.value = path;
223-
document.body.appendChild(ta);
224-
ta.select();
225-
try { document.execCommand('copy'); btn.textContent = 'Copied'; }
226-
catch { alert('Unable to copy to clipboard.'); }
227-
document.body.removeChild(ta);
228-
setTimeout(() => btn.textContent = 'Copy path', 1200);
229-
}
230-
});
231-
232-
// Optional: allow Enter in search to open first result
233-
search.addEventListener('keydown', (e) => {
234-
if (e.key === 'Enter') {
235-
const firstLink = document.querySelector('#projectsGrid a.btn');
236-
if (firstLink) {
237-
firstLink.click();
238-
}
239-
}
240-
});
241-
});
242-
</script>
77+
24378
</body>
24479
</html>

main.js

Lines changed: 134 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,134 @@
1+
const projects = [
2+
{ title: 'Calculator', desc: 'Basic calculator with keyboard support.', path: 'calculator/index.html' },
3+
{ title: 'Bookmark', desc: 'Save and manage quick links locally.', path: 'Bookmark/index.html' },
4+
{ title: 'CGPA Calculator', desc: 'Calculate GPA/CGPA for semesters.', path: 'CGPA calci/index.html' },
5+
{ title: 'Employee App', desc: 'Simple CRUD demo for employees.', path: 'EmployeeApp/index.html' },
6+
{ title: 'Memory Game', desc: 'Classic card matching game.', path: 'Memory_Game/index.html' },
7+
{ title: 'Movie App', desc: 'Search and browse movies.', path: 'Movie_APP/index.html' }
8+
];
9+
10+
// Utility: sanitize text for search
11+
const normalize = s => s.toLowerCase();
12+
13+
// Render project cards
14+
function renderProjects(list) {
15+
const grid = document.getElementById('projectsGrid');
16+
grid.innerHTML = '';
17+
if (!list.length) {
18+
grid.innerHTML = '<div class="col-12"><div class="alert alert-info mb-0">No projects found.</div></div>';
19+
return;
20+
}
21+
list.forEach(p => {
22+
const col = document.createElement('div');
23+
col.className = 'col-12 col-sm-6 col-lg-4';
24+
col.innerHTML = `
25+
<div class="card app-card h-100">
26+
<div class="card-body d-flex flex-column">
27+
<h5 class="card-title mb-1">${escapeHtml(p.title)}</h5>
28+
<p class="card-text text-muted small mb-3">${escapeHtml(p.desc)}</p>
29+
<div class="mt-auto d-flex justify-content-between align-items-center">
30+
<a href="${encodeURI(p.path)}" class="btn btn-outline-primary btn-sm" aria-label="Open ${escapeHtml(p.title)}">Open</a>
31+
<button class="btn btn-sm btn-outline-secondary copy-btn" data-path="${encodeURI(p.path)}" type="button" title="Copy path">Copy path</button>
32+
</div>
33+
</div>
34+
</div>
35+
`;
36+
grid.appendChild(col);
37+
});
38+
}
39+
40+
// Simple HTML escaper for safety
41+
function escapeHtml(str) {
42+
return String(str)
43+
.replace(/&/g, '&amp;')
44+
.replace(/"/g, '&quot;')
45+
.replace(/'/g, '&#39;')
46+
.replace(/</g, '&lt;')
47+
.replace(/>/g, '&gt;');
48+
}
49+
50+
// Live filter
51+
function filterProjects(query) {
52+
const q = normalize(query.trim());
53+
if (!q) return projects.slice();
54+
return projects.filter(p => normalize(p.title).includes(q) || normalize(p.desc).includes(q));
55+
}
56+
57+
document.addEventListener('DOMContentLoaded', () => {
58+
const search = document.getElementById('search');
59+
const clearBtn = document.getElementById('clearSearch');
60+
61+
// Initial render
62+
renderProjects(projects);
63+
64+
// Search input handler
65+
search.addEventListener('input', () => {
66+
const val = search.value;
67+
const results = filterProjects(val);
68+
renderProjects(results);
69+
clearBtn.classList.toggle('d-none', !val);
70+
});
71+
72+
// Clear button
73+
clearBtn.addEventListener('click', () => {
74+
search.value = '';
75+
search.dispatchEvent(new Event('input'));
76+
search.focus();
77+
clearBtn.classList.add('d-none');
78+
});
79+
80+
// Keyboard shortcut: press "/" to focus search (if not typing in an input)
81+
document.addEventListener('keydown', (e) => {
82+
if (e.key === '/' && !['INPUT','TEXTAREA'].includes(document.activeElement.tagName)) {
83+
e.preventDefault();
84+
search.focus();
85+
search.select();
86+
}
87+
});
88+
89+
// Smooth scroll for internal links
90+
document.querySelectorAll('a[href^="#"]').forEach(link => {
91+
link.addEventListener('click', (e) => {
92+
const target = document.querySelector(link.getAttribute('href'));
93+
if (target) {
94+
e.preventDefault();
95+
target.scrollIntoView({ behavior: 'smooth', block: 'start' });
96+
}
97+
});
98+
});
99+
100+
// Copy path buttons (event delegation)
101+
document.getElementById('projectsGrid').addEventListener('click', (e) => {
102+
const btn = e.target.closest('.copy-btn');
103+
if (!btn) return;
104+
const path = decodeURI(btn.getAttribute('data-path') || '');
105+
if (navigator.clipboard) {
106+
navigator.clipboard.writeText(path).then(() => {
107+
btn.textContent = 'Copied';
108+
setTimeout(() => btn.textContent = 'Copy path', 1200);
109+
}, () => {
110+
alert('Unable to copy to clipboard.');
111+
});
112+
} else {
113+
// Fallback
114+
const ta = document.createElement('textarea');
115+
ta.value = path;
116+
document.body.appendChild(ta);
117+
ta.select();
118+
try { document.execCommand('copy'); btn.textContent = 'Copied'; }
119+
catch { alert('Unable to copy to clipboard.'); }
120+
document.body.removeChild(ta);
121+
setTimeout(() => btn.textContent = 'Copy path', 1200);
122+
}
123+
});
124+
125+
// Optional: allow Enter in search to open first result
126+
search.addEventListener('keydown', (e) => {
127+
if (e.key === 'Enter') {
128+
const firstLink = document.querySelector('#projectsGrid a.btn');
129+
if (firstLink) {
130+
firstLink.click();
131+
}
132+
}
133+
});
134+
});

style1.css

Lines changed: 29 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -1,23 +1,32 @@
11

2-
.title{
3-
@apply text-4xl font-bold mb-6 text-cyan-40 drop-shadow-lg;
4-
animation: glow 3s infinite alternate-reverse
5-
}
6-
.menu-card {
7-
@apply block p-6 rounded-2xl shadow-lg text-center font-semibold text-lg transition transform;
8-
}
9-
10-
.menu-card:hover {
11-
transform: translateY(-6px) scale(1.05);
12-
box-shadow: 0 10px 25px rgba(255, 133, 133, 0.4);
13-
}
14-
15-
16-
@keyframes glow{
17-
from {
18-
text-decoration: dotted; text-shadow: 0 0 60px red, 0 0 10px purple;
2+
:root{
3+
--accent: #0d6efd;
4+
--card-radius: 12px;
5+
}
6+
body {
7+
min-height: 100vh;
8+
background: linear-gradient(135deg,#f8fafc 0%, #e9f2ff 40%, #fff 100%);
9+
color:#0f172a;
10+
-webkit-font-smoothing:antialiased;
11+
-moz-osx-font-smoothing:grayscale;
12+
}
13+
.hero {
14+
border-radius: 14px;
15+
background: linear-gradient(180deg, rgba(255,255,255,0.8), rgba(255,255,255,0.65));
16+
box-shadow: 0 6px 30px rgba(13, 110, 253, 0.08);
17+
backdrop-filter: blur(6px);
18+
}
19+
.app-card {
20+
border-radius: var(--card-radius);
21+
transition: transform .18s ease, box-shadow .18s ease;
22+
}
23+
.app-card:hover {
24+
transform: translateY(-6px);
25+
box-shadow: 0 10px 30px rgba(13,110,253,0.12);
1926
}
20-
to{
21-
text-decoration: wavy; text-shadow: 0 0 90px plum , 0 0 30px aliceblue
27+
footer { opacity: .85; }
28+
.search-field {
29+
max-width: 540px;
2230
}
23-
}
31+
.muted-small { color: #6b7280; font-size: .9rem; }
32+

0 commit comments

Comments
 (0)