Skip to content

Commit 3cbc12e

Browse files
gperdrizetgperdrizet
committed
Minor updates and style changes
1 parent d622a8a commit 3cbc12e

7 files changed

Lines changed: 83 additions & 4 deletions

File tree

‎docs/projects/budget-tracker/index.html‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -36,6 +36,7 @@ <h1>Budget Tracker</h1>
3636
<div class="description"><p>Budget Tracker is a full-stack web app that lets users log transactions, categorise spending, and visualise monthly trends with Chart.js. Data is stored in a PostgreSQL database and the backend exposes a REST API built with Express and Sequelize.
3737
</p></div>
3838

39+
<div class="contact-links"><a href="mailto:sam@example.com" aria-label="Email">&#9993; sam@example.com</a><a href="https://linkedin.com/in/samrivera" target="_blank" rel="noopener noreferrer" aria-label="LinkedIn">in/samrivera</a><a href="https://x.com/samrivera" target="_blank" rel="noopener noreferrer" aria-label="X / Twitter">@samrivera</a><a href="https://github.com/samrivera" target="_blank" rel="noopener noreferrer" aria-label="GitHub">github.com/samrivera</a></div>
3940
</main>
4041
<footer>
4142
<p>Add your project via a pull request — see the <a href="https://github.com/FullstackAcademy/2510-capstones">repo README</a>.</p>

‎docs/projects/recipe-finder-app/index.html‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -36,6 +36,7 @@ <h1>Recipe Finder App</h1>
3636
<div class="description"><p>Recipe Finder lets you type in ingredients you already have at home and returns matching recipes from a public API. Built with React on the frontend and an Express proxy to keep API keys server-side.
3737
</p></div>
3838

39+
<div class="contact-links"><a href="mailto:alex@example.com" aria-label="Email">&#9993; alex@example.com</a><a href="https://alexjohnson.dev" target="_blank" rel="noopener noreferrer" aria-label="Website">&#127760; https://alexjohnson.dev</a><a href="https://linkedin.com/in/alexjohnson" target="_blank" rel="noopener noreferrer" aria-label="LinkedIn">in/alexjohnson</a><a href="https://github.com/alexjohnson" target="_blank" rel="noopener noreferrer" aria-label="GitHub">github.com/alexjohnson</a></div>
3940
</main>
4041
<footer>
4142
<p>Add your project via a pull request — see the <a href="https://github.com/FullstackAcademy/2510-capstones">repo README</a>.</p>

‎docs/style.css‎

Lines changed: 26 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -179,9 +179,11 @@ footer a:hover { color: var(--pink); }
179179

180180
.detail-meta { flex: 1; }
181181
.detail-meta h1 { margin-bottom: 0.3rem; }
182-
.detail-meta .student-name { margin-bottom: 0.4rem; }
182+
.detail-meta .student-name { margin-bottom: 0.4rem; font-size: 1.2rem; }
183183
.detail-meta .tagline { margin-bottom: 0.75rem; }
184184
.detail-meta p + p { margin-top: 0.35rem; }
185+
.detail-meta a { color: var(--red); }
186+
.detail-meta a:hover { color: var(--pink); }
185187

186188
.description {
187189
margin-bottom: 1.5rem;
@@ -208,4 +210,26 @@ footer a:hover { color: var(--pink); }
208210
color: var(--muted);
209211
}
210212

211-
.empty { font-size: 1.1rem; color: var(--muted); }
213+
.empty { font-size: 1.1rem; color: var(--muted); }
214+
215+
/* Contact links */
216+
.contact-links {
217+
display: flex;
218+
flex-wrap: wrap;
219+
gap: 0.6rem 1.25rem;
220+
margin-top: 2rem;
221+
padding-top: 1.25rem;
222+
border-top: 1px solid var(--border);
223+
}
224+
225+
.contact-links a {
226+
color: var(--red);
227+
text-decoration: none;
228+
font-size: 0.9rem;
229+
font-weight: 500;
230+
}
231+
232+
.contact-links a:hover {
233+
color: var(--pink);
234+
text-decoration: underline;
235+
}

‎projects/_template.yml‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,13 @@ repo: "" # https://github.com/your-username/your-repo
1818

1919
demo: "" # https://your-live-demo.example.com
2020

21+
# Contact info (all optional — omitted from the page if blank)
22+
email: "" # your@email.com
23+
website: "" # https://yoursite.com
24+
linkedin: "" # your LinkedIn username (not the full URL)
25+
twitter: "" # your handle, with or without the @
26+
github: "" # your GitHub username
27+
2128
# Images — add files to the headshots/ and screenshots/ folders in the repo root.
2229
# Name them: firstname_lastname_headshot.png and firstname_lastname_screenshot.png
2330
# The build script picks them up automatically — no changes needed here.

‎projects/alex-johnson-capstone.yml‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -19,6 +19,11 @@ repo: "https://github.com/alexjohnson/recipe-finder"
1919
# Link to a live demo (optional)
2020
demo: "https://recipe-finder.vercel.app"
2121

22+
email: "alex@example.com"
23+
website: "https://alexjohnson.dev"
24+
linkedin: "alexjohnson"
25+
github: "alexjohnson"
26+
2227
# Short technology tags (optional, max ~5)
2328
tags:
2429
- React

‎projects/sam-rivera-capstone.yml‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,11 @@ repo: "https://github.com/samrivera/budget-tracker"
1414

1515
demo: "https://budget-tracker-demo.netlify.app"
1616

17+
email: "sam@example.com"
18+
linkedin: "samrivera"
19+
twitter: "@samrivera"
20+
github: "samrivera"
21+
1722
tags:
1823
- React
1924
- PostgreSQL

‎scripts/build.js‎

Lines changed: 38 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -161,6 +161,17 @@ function buildDetail(p) {
161161
const descLine = p.description
162162
? `<div class="description"><p>${escapeHtml(p.description)}</p></div>`
163163
: "";
164+
165+
const contactLinks = [
166+
p.email ? `<a href="mailto:${escapeHtml(p.email)}" aria-label="Email">&#9993; ${escapeHtml(p.email)}</a>` : null,
167+
p.website ? `<a href="${escapeHtml(p.website)}" target="_blank" rel="noopener noreferrer" aria-label="Website">&#127760; ${escapeHtml(p.website)}</a>` : null,
168+
p.linkedin ? `<a href="https://linkedin.com/in/${escapeHtml(p.linkedin)}" target="_blank" rel="noopener noreferrer" aria-label="LinkedIn">in/${escapeHtml(p.linkedin)}</a>` : null,
169+
p.twitter ? `<a href="https://x.com/${escapeHtml(p.twitter.replace(/^@/, ""))}" target="_blank" rel="noopener noreferrer" aria-label="X / Twitter">@${escapeHtml(p.twitter.replace(/^@/, ""))}</a>` : null,
170+
p.github ? `<a href="https://github.com/${escapeHtml(p.github)}" target="_blank" rel="noopener noreferrer" aria-label="GitHub">github.com/${escapeHtml(p.github)}</a>` : null,
171+
].filter(Boolean);
172+
const contactSection = contactLinks.length
173+
? `<div class="contact-links">${contactLinks.join("")}</div>`
174+
: "";
164175
const headshotImg = p._headshot
165176
? `<img class="detail-headshot" src="/2510-capstones/assets/headshots/${escapeHtml(p._headshot)}" alt="${escapeHtml(p.student)}" />`
166177
: "";
@@ -185,7 +196,8 @@ function buildDetail(p) {
185196
</div>
186197
</div>
187198
${descLine}
188-
${screenshotFig}`;
199+
${screenshotFig}
200+
${contactSection}`;
189201

190202
return shell(p.title, body);
191203
}
@@ -376,9 +388,11 @@ footer a:hover { color: var(--pink); }
376388
377389
.detail-meta { flex: 1; }
378390
.detail-meta h1 { margin-bottom: 0.3rem; }
379-
.detail-meta .student-name { margin-bottom: 0.4rem; }
391+
.detail-meta .student-name { margin-bottom: 0.4rem; font-size: 1.2rem; }
380392
.detail-meta .tagline { margin-bottom: 0.75rem; }
381393
.detail-meta p + p { margin-top: 0.35rem; }
394+
.detail-meta a { color: var(--red); }
395+
.detail-meta a:hover { color: var(--pink); }
382396
383397
.description {
384398
margin-bottom: 1.5rem;
@@ -406,6 +420,28 @@ footer a:hover { color: var(--pink); }
406420
}
407421
408422
.empty { font-size: 1.1rem; color: var(--muted); }
423+
424+
/* Contact links */
425+
.contact-links {
426+
display: flex;
427+
flex-wrap: wrap;
428+
gap: 0.6rem 1.25rem;
429+
margin-top: 2rem;
430+
padding-top: 1.25rem;
431+
border-top: 1px solid var(--border);
432+
}
433+
434+
.contact-links a {
435+
color: var(--red);
436+
text-decoration: none;
437+
font-size: 0.9rem;
438+
font-weight: 500;
439+
}
440+
441+
.contact-links a:hover {
442+
color: var(--pink);
443+
text-decoration: underline;
444+
}
409445
`.trim();
410446

411447
// ---------------------------------------------------------------------------

0 commit comments

Comments
 (0)