Skip to content

Commit 48b74ec

Browse files
Code-JLCode-JL
committed
Added projects. fixed links. Updated projects css updating via js
1 parent 9d8738e commit 48b74ec

File tree

14 files changed

+610
-186
lines changed

14 files changed

+610
-186
lines changed

‎projects/dna-sequence-analyzer/about.css renamed to ‎projects/ai_page_summary/about.css

File renamed without changes.

‎projects/ai_page_summary/about.html

Lines changed: 106 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,106 @@
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>Projects - AI Page Summary</title>
7+
<link rel="stylesheet" href="../../assets/load/universal.css">
8+
<link rel="stylesheet" href="about.css">
9+
</head>
10+
<body>
11+
<header></header>
12+
<main>
13+
<!-- Project Title -->
14+
<section class="title">
15+
<h1 id="type">AI Page Summary</h1>
16+
<p>A powerful <strong>Chrome extension</strong> that generates concise, intelligent summaries of web pages using advanced AI technology, built for researchers, students, and professionals.</p>
17+
</section>
18+
19+
<!-- Technologies -->
20+
<section class="technologies">
21+
<h2>Technologies Used</h2>
22+
<div class="tech-grid">
23+
<span class="tech-badge">JavaScript</span>
24+
<span class="tech-badge">Chrome API</span>
25+
<span class="tech-badge">BART-CNN</span>
26+
<span class="tech-badge">Manifest V3</span>
27+
</div>
28+
</section>
29+
30+
<!-- Features Section -->
31+
<section class="project">
32+
<h2>Features</h2>
33+
<ul>
34+
<li><strong>One-Click Summaries:</strong> Generate instant summaries of any web page</li>
35+
<li><strong>Customizable Length:</strong> Choose summary length (1-10 sentences)</li>
36+
<li><strong>Theme Options:</strong> Dark/Light theme support for comfortable viewing</li>
37+
<li><strong>History Tracking:</strong> Keep track of recent page summaries</li>
38+
<li><strong>Smart Detection:</strong> Protected URL handling and browser compatibility</li>
39+
</ul>
40+
</section>
41+
42+
<!-- Implementation -->
43+
<section class="project">
44+
<h2>Implementation</h2>
45+
<h3>Core Components</h3>
46+
<ul>
47+
<li>Hugging Face's BART-large-CNN model for AI summarization</li>
48+
<li>Chrome Extension Manifest V3 architecture</li>
49+
<li>Modern JavaScript with async/await patterns</li>
50+
<li>Responsive UI design system</li>
51+
</ul>
52+
53+
<h3>Browser Integration</h3>
54+
<ul>
55+
<li>Active tab content processing</li>
56+
<li>Local storage for user preferences</li>
57+
<li>Cross-page scripting capabilities</li>
58+
<li>Secure permission management</li>
59+
</ul>
60+
</section>
61+
62+
<!-- Technical Details -->
63+
<section class="project">
64+
<h2>Technical Highlights</h2>
65+
<h3>Key Features</h3>
66+
<ul>
67+
<li>Automatic summarization triggers</li>
68+
<li>Clipboard integration for easy copying</li>
69+
<li>Persistent settings management</li>
70+
<li>Protected URL detection system</li>
71+
</ul>
72+
<h3>Permissions</h3>
73+
<ul>
74+
<li>activeTab: Current page access</li>
75+
<li>storage: User preference saving</li>
76+
<li>scripting: Content processing</li>
77+
<li>host: Cross-site summarization</li>
78+
</ul>
79+
</section>
80+
81+
<!-- Documentation -->
82+
<section id="contact">
83+
<h2>Resources</h2>
84+
<p><a href="https://github.com/Code-JL/AI-Page-Summary" target="_blank">
85+
<img src="../../images/github.png" alt="GitHub Icon">GitHub Repository
86+
</a></p>
87+
</section>
88+
89+
<!-- License -->
90+
<section class="project">
91+
<h2>License</h2>
92+
<p>This project is licensed under the MIT License. See the <a href="https://github.com/Code-JL/AI-Page-Summary/blob/main/LICENSE" target="_blank">LICENSE</a> file for details.</p>
93+
</section>
94+
</main>
95+
96+
<footer>
97+
<p>© 2025 AI Page Summary</p>
98+
</footer>
99+
100+
<canvas id="bg1"></canvas>
101+
102+
<script src="https://cdnjs.cloudflare.com/ajax/libs/matter-js/0.19.0/matter.min.js"></script>
103+
<script src="https://cdnjs.cloudflare.com/ajax/libs/matter-js/0.19.0/plugins/matter-wrap.min.js"></script>
104+
<script src="../projectsUniversal.js"></script>
105+
</body>
106+
</html>

‎projects/dna-sequence-analyzer copy/about.css

Whitespace-only changes.

‎projects/dna-sequence-analyzer copy/about.html

Whitespace-only changes.

‎projects/dna_sequence_analyzer/about.css

Lines changed: 75 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,75 @@
1+
/* Project Styling */
2+
.project img {
3+
width: 70%;
4+
border-radius: 5px;
5+
margin-bottom: 15px;
6+
}
7+
8+
/* Technology Badges */
9+
.tech-grid {
10+
display: flex;
11+
flex-wrap: wrap;
12+
gap: 10px;
13+
justify-content: center;
14+
margin: 20px 0;
15+
}
16+
17+
.tech-badge {
18+
background: #1b4e7e;
19+
color: #eef6fc;
20+
padding: 8px 16px;
21+
border-radius: 20px;
22+
font-size: 16px;
23+
border: 2px solid #e7df69;
24+
}
25+
26+
/* Code Blocks */
27+
pre {
28+
background: #2a2a2a;
29+
padding: 15px;
30+
border-radius: 5px;
31+
overflow-x: auto;
32+
border-left: 3px solid #e7df69;
33+
margin: 15px 0;
34+
}
35+
36+
code {
37+
color: #e7df69;
38+
font-family: 'Consolas', monospace;
39+
}
40+
41+
/* Typography */
42+
li, p {
43+
font-size: 18px;
44+
}
45+
46+
h1 {
47+
font-size: 85px;
48+
}
49+
50+
h2 {
51+
font-size: 55px;
52+
}
53+
54+
h3 {
55+
font-size: 40px;
56+
text-align: left;
57+
}
58+
59+
/* Contact Section */
60+
section#contact p a img {
61+
width: 50px;
62+
height: 50px;
63+
margin-right: 8px;
64+
vertical-align: middle;
65+
}
66+
67+
section#contact p a {
68+
font-family: 'rampage-monoline', sans-serif;
69+
font-size: 30px;
70+
color: #e7df69;
71+
}
72+
73+
section#contact p a:visited {
74+
color: #dfa843;
75+
}

‎projects/dna-sequence-analyzer/about.html renamed to ‎projects/dna_sequence_analyzer/about.html

File renamed without changes.

‎projects/header.html

Lines changed: 39 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,39 @@
1+
<nav>
2+
<ul>
3+
<li>
4+
<a href="../../assets/home.html" aria-label="Home">
5+
<img src="../../images/home.png" alt="Home Icon"> Home
6+
</a>
7+
</li>
8+
<li>
9+
<a href="../../assets/about.html" aria-label="About">
10+
<img src="../../images/about.png" alt="About Icon"> About
11+
</a>
12+
</li>
13+
<li>
14+
<a href="../../assets/projects.html" aria-label="Projects">
15+
<img src="../../images/projects.png" alt="Projects Icon"> Projects
16+
</a>
17+
</li>
18+
<li>
19+
<a href="../../assets/skills.html" aria-label="Skills">
20+
<img src="../../images/skills.png" alt="Skills Icon"> Skills
21+
</a>
22+
</li>
23+
<li>
24+
<a href="../../assets/education.html" aria-label="Education">
25+
<img src="../../images/education.png" alt="Education Icon"> Education
26+
</a>
27+
</li>
28+
<li>
29+
<a href="../../assets/home.html#contact" aria-label="Contact">
30+
<img src="../../images/contact.png" alt="Contact Icon"> Contact
31+
</a>
32+
</li>
33+
<li>
34+
<a href="../../assets/resume.html" aria-label="Resume">
35+
<img src="../../images/resume.png" alt="Resume Icon"> Resume
36+
</a>
37+
</li>
38+
</ul>
39+
</nav>

‎projects/inventory_manager/about.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44
<meta charset="UTF-8">
55
<meta name="viewport" content="width=device-width, initial-scale=1.0">
66
<title>Projects - Inventory Manager</title>
7-
<link rel="stylesheet" href="../../assets/load/universal.css">
7+
<link rel="stylesheet" href="../../assets/load/universal.css">
88
<link rel="stylesheet" href="about.css">
99
</head>
1010
<body>

‎projects/kicker_data_scraper/about.css

Lines changed: 75 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,75 @@
1+
/* Project Styling */
2+
.project img {
3+
width: 70%;
4+
border-radius: 5px;
5+
margin-bottom: 15px;
6+
}
7+
8+
/* Technology Badges */
9+
.tech-grid {
10+
display: flex;
11+
flex-wrap: wrap;
12+
gap: 10px;
13+
justify-content: center;
14+
margin: 20px 0;
15+
}
16+
17+
.tech-badge {
18+
background: #1b4e7e;
19+
color: #eef6fc;
20+
padding: 8px 16px;
21+
border-radius: 20px;
22+
font-size: 16px;
23+
border: 2px solid #e7df69;
24+
}
25+
26+
/* Code Blocks */
27+
pre {
28+
background: #2a2a2a;
29+
padding: 15px;
30+
border-radius: 5px;
31+
overflow-x: auto;
32+
border-left: 3px solid #e7df69;
33+
margin: 15px 0;
34+
}
35+
36+
code {
37+
color: #e7df69;
38+
font-family: 'Consolas', monospace;
39+
}
40+
41+
/* Typography */
42+
li, p {
43+
font-size: 18px;
44+
}
45+
46+
h1 {
47+
font-size: 85px;
48+
}
49+
50+
h2 {
51+
font-size: 55px;
52+
}
53+
54+
h3 {
55+
font-size: 40px;
56+
text-align: left;
57+
}
58+
59+
/* Contact Section */
60+
section#contact p a img {
61+
width: 50px;
62+
height: 50px;
63+
margin-right: 8px;
64+
vertical-align: middle;
65+
}
66+
67+
section#contact p a {
68+
font-family: 'rampage-monoline', sans-serif;
69+
font-size: 30px;
70+
color: #e7df69;
71+
}
72+
73+
section#contact p a:visited {
74+
color: #dfa843;
75+
}

0 commit comments

Comments
 (0)