Skip to content
Open
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
54 changes: 54 additions & 0 deletions FIX_PROPOSAL.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,54 @@
To add the OWASP@Foundation social media links to the BLT University footer, you can modify the footer HTML code as follows:

```html
<!-- Add social media links to the footer -->
<div class="social-media-links">
<a href="https://owasp.org/slack/invite" target="_blank" rel="noopener noreferrer">
<i class="fa fa-slack" aria-hidden="true"></i>
Slack (OWASP Invite)
</a>
<a href="https://www.facebook.com/OWASPFoundation" target="_blank" rel="noopener noreferrer">
<i class="fa fa-facebook" aria-hidden="true"></i>
Facebook
</a>
<a href="https://twitter.com/OWASP" target="_blank" rel="noopener noreferrer">
<i class="fa fa-twitter" aria-hidden="true"></i>
Twitter
</a>
<a href="https://www.linkedin.com/company/owasp-foundation" target="_blank" rel="noopener noreferrer">
<i class="fa fa-linkedin" aria-hidden="true"></i>
LinkedIn
</a>
<a href="https://www.youtube.com/owasp" target="_blank" rel="noopener noreferrer">
<i class="fa fa-youtube" aria-hidden="true"></i>
YouTube
</a>
<a href="https://infosec.exchange/@owasp" target="_blank" rel="noopener noreferrer">
<i class="fa fa-mastodon" aria-hidden="true"></i>
Mastodon (Infosec)
</a>
</div>
```
Comment on lines +3 to +31
Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

⚠️ Potential issue | 🔴 Critical

🧩 Analysis chain

🏁 Script executed:

#!/bin/bash
# Check Font Awesome version loaded in the layout
rg -n "font-awesome" _layouts/default.html

# Check existing footer styling patterns
rg -n -A2 -B2 "social" _includes/footer.html

Repository: OWASP-BLT/BLT-University

Length of output: 179


🏁 Script executed:

# Check the footer.html content directly
head -100 _includes/footer.html | cat -n

# Also check if there are any other footer-related files
fd -t f "footer" _includes/

Repository: OWASP-BLT/BLT-University

Length of output: 5656


🌐 Web query:

Font Awesome 6.x brand icon class syntax fa-brands

💡 Result:

In Font Awesome 6.x, the class syntax for brand icons uses the 'fa-brands' style prefix combined with the specific icon name prefixed by 'fa-'. For example: <i class="fa-brands fa-font-awesome"></i> or <span class="fa-brands fa-github"></span>. Brand icons are part of a separate family, available in the Free plan, with font-weight 400. They require including the Font Awesome Brands CSS or JS (e.g., via CDN: https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css which includes brands). This replaces the single 'fa' prefix from earlier versions; version 6 introduces style-specific prefixes like fa-solid, fa-regular, fa-brands, etc.

Citations:


🏁 Script executed:

cat -n FIX_PROPOSAL.md

Repository: OWASP-BLT/BLT-University

Length of output: 2449


Font Awesome 6.x syntax incompatibility—icons will not render.

The HTML snippet uses Font Awesome 4.x/5.x class syntax (fa fa-slack, fa fa-facebook, etc.), but Font Awesome 6.5.0 is already loaded in _layouts/default.html:14. Font Awesome 6.x requires different syntax for brand icons: fa-brands fa-slack, fa-brands fa-facebook, etc. As written, the icons will fail to render.

Additionally, the proposal recommends adding Font Awesome 5.15.3 via CDN (line 36), which conflicts with the already-loaded 6.5.0 version and introduces redundant resource loading. The snippet also lacks Tailwind styling classes (text-slate-400 hover:text-white transition-colors) used consistently throughout the footer, resulting in visual inconsistency.

Update icon classes to use fa-brands prefix and apply the footer's existing Tailwind utility classes to all social links for proper styling and compatibility.

🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.

In `@FIX_PROPOSAL.md` around lines 3 - 31, Update the social links block: change
each icon class from the old `fa fa-...` form to the Font Awesome 6 brand prefix
`fa-brands fa-...` (e.g., replace `fa fa-slack` with `fa-brands fa-slack`) and
add the footer Tailwind utility classes `text-slate-400 hover:text-white
transition-colors` to each anchor so they match the site's styling; also remove
or stop adding the Font Awesome 5.15.3 CDN to avoid conflicting with the
already-loaded 6.5.0 asset.


You will also need to add the Font Awesome library to your project to use the social media icons. You can do this by adding the following line to your HTML header:

```html
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css" />
```
Comment on lines +33 to +37
Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

⚠️ Potential issue | 🟠 Major

Major: Font Awesome already loaded—avoid double-loading.

The instruction to add Font Awesome 5.15.3 via CDN is unnecessary and problematic. Font Awesome 6.5.0 is already loaded globally in _layouts/default.html:14. Adding another Font Awesome CDN link would cause:

  • Double-loading of stylesheets (performance overhead)
  • Potential version conflicts and style inconsistencies
  • Unnecessary network requests

Remove this instruction entirely, as Font Awesome is already available project-wide.

📝 Proposed fix: Remove Font Awesome CDN instruction
-You will also need to add the Font Awesome library to your project to use the social media icons. You can do this by adding the following line to your HTML header:
-
-```html
-<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css" />
-```
-
-Alternatively, you can use a CDN or install Font Awesome locally.
+Note: Font Awesome 6.5.0 is already loaded globally in the project's default layout, so no additional library inclusion is needed.
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.

In `@FIX_PROPOSAL.md` around lines 33 - 37, Remove the added Font Awesome CDN
instruction from FIX_PROPOSAL.md (the HTML <link> snippet that loads 5.15.3) to
avoid double-loading; instead replace that snippet with a short note stating
that Font Awesome 6.5.0 is already loaded globally in _layouts/default.html:14
so no additional inclusion is necessary. Ensure you delete the CDN link lines
and update the surrounding text to reference the existing global inclusion
rather than instructing developers to add another CDN or local install.


Alternatively, you can use a CDN or install Font Awesome locally.

**Commit Message:**
`Add OWASP@Foundation social media links to BLT University footer`

**Changes:**

* Added social media links to the footer
* Included Font Awesome library for social media icons

**Files Changed:**

* `footer.html` (or equivalent file)
* `index.html` (or equivalent file) to include Font Awesome library

Please note that you may need to adjust the file names and paths based on your project's structure.
Comment on lines +1 to +54
Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

⚠️ Potential issue | 🟠 Major

Major: Clarify placement and integration with existing footer structure.

The proposal doesn't specify where the social-media-links container should be placed in the footer. The existing footer (_includes/footer.html:51-59) already contains a social media section with a GitHub link using inline SVG icons.

Please clarify:

  1. Should these new links replace the existing GitHub social section?
  2. Should they be added alongside the existing GitHub link?
  3. What is the intended visual layout (horizontal flex row, vertical stack, grid)?
  4. Should the existing GitHub SVG icon be converted to Font Awesome for consistency?

Without clear integration guidance, implementers may place the links inconsistently or create duplicate social media sections.

🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.

In `@FIX_PROPOSAL.md` around lines 1 - 54, The proposal lacks integration details
with the existing footer social block in _includes/footer.html (around the
current GitHub link and its inline SVG); decide and document whether the new
.social-media-links should replace the existing GitHub social section or be
added alongside it, choose a layout (e.g., horizontal flex row via a
.social-media-links { display:flex; gap:... } or vertical stack) and update the
footer HTML to place the .social-media-links container accordingly, convert the
existing GitHub inline SVG to a Font Awesome icon if you want consistent
iconography, and ensure index.html (or main layout) includes the Font Awesome
stylesheet only once and references the chosen classnames so there are no
duplicate social sections.

⚠️ Potential issue | 🟠 Major

🧩 Analysis chain

🏁 Script executed:

#!/bin/bash
# Check if footer.html is modified in this PR
git diff --name-only origin/main...HEAD | grep -i footer

# Show the current footer structure
fd -t f footer.html --exec cat {}

Repository: OWASP-BLT/BLT-University

Length of output: 5147


Major: Missing implementation—PR includes proposal document only, not actual footer changes.

The PR adds a FIX_PROPOSAL.md document with instructions but does not include the actual code changes to implement the OWASP social media links. The existing footer.html (shown by repository scan) contains only a GitHub social link and lacks the proposed Slack, Facebook, Twitter, LinkedIn, YouTube, and Mastodon links.

To complete this PR:

  1. Add the HTML markup for the new social media links to footer.html
  2. Include the Font Awesome library reference as documented, or
  3. Retitle this as a "proposal" or "design document" if implementation is deferred

Also clarify how these links integrate with the existing GitHub link in the footer's "Get Involved" section—should they be added to the same section or a new social media section?

🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.

In `@FIX_PROPOSAL.md` around lines 1 - 54, The PR currently only adds
FIX_PROPOSAL.md and lacks the actual footer changes; update the real footer
template (footer.html) to add the proposed social links (Slack, Facebook,
Twitter, LinkedIn, YouTube, Mastodon) alongside the existing GitHub link (either
inside the existing "Get Involved" block or as a new "Social" block) and ensure
the markup matches the project's HTML structure; also add the Font Awesome
stylesheet reference to the global head template (index.html or base layout) or
vendor assets so icons render, or alternatively rename FIX_PROPOSAL.md to
indicate it's purely a proposal if you don't implement changes in this PR.

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

⚠️ Potential issue | 🟡 Minor

Minor: Add trailing newline at end of file.

The file ends without a trailing newline. POSIX standards and most linters expect text files to end with a newline character for better tool compatibility.

📄 Proposed fix: Add trailing newline
 Please note that you may need to adjust the file names and paths based on your project's structure.
+
📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change
Please note that you may need to adjust the file names and paths based on your project's structure.
Please note that you may need to adjust the file names and paths based on your project's structure.
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.

In `@FIX_PROPOSAL.md` at line 54, The file FIX_PROPOSAL.md is missing a trailing
newline; open FIX_PROPOSAL.md and ensure the file ends with a single newline
character (POSIX newline) by adding one blank line or ending the last line with
\n, then save the file so linters and tools detect the newline at EOF.