Adds a 'This project is a website' toggle to the Repository meta box.
When checked, site fields (URL, platform, optional screenshot) replace the
git-repo fields; when unchecked, repo fields are shown and site fields
are cleared. Existing posts default to repo mode.
- admin/metabox.php: checkbox, site URL/platform/screenshot inputs with
media-library picker, JS toggle, save handler that switches modes
- includes/helper-functions.php: projects_portfolio_is_website / get
_site_url / get_site_platform / get_site_screenshot_url helpers
- templates/single-projects.php: website-mode rendering (Visit Site
button, platform row, screenshot)
- tests/test-metabox.php: website-mode persistence + mode-switch tests
- tests/wp-stubs.php: sanitize_text_field, absint stubs
Lucide (https://lucide.dev) replaces the hand-rolled Tabler paths. Lucide
is more compact and consistent, and ships under the ISC license (more
permissive than Tabler's MIT and equally fine for plugin redistribution).
Lucide has no brand icons for Reddit/WhatsApp/Pinterest, so we use
generic substitutes that preserve the visual intent:
- reddit.svg <- lucide 'share-2' (community share metaphor)
- whatsapp.svg <- lucide 'message-circle'
- pinterest.svg<- lucide 'pin'
Avatar: shrunk to 40x40 per user testing — sizes above 41x41 were being
clipped inside the round border on this host.
The 'cover' keyword was producing fallback 'auto auto' rendering in some
environments (likely a kses/CSS shorthand quirk). Switching to explicit
pixel values matching the container size has the same visual effect
for the 270x270 source image and works reliably across all browsers.
Root cause of social icons rendering as alt text: wp_kses() stripped
the 'data:' prefix from data: URIs in img.src, leaving a relative URL
that 404s. Switched to real .svg files under assets/icons/ referenced
via plugins_url() — kses passes img tags with relative URLs cleanly,
and the icons load as standard images.
Root cause of avatar still being cropped: layout-side issues with
inline-styled <img> in a flex layout. Switched to a <span> with
inline background-image, background-size: cover, background-position:
center — no <img> element, no object-fit reliance, no way to crop wrong.
Also removed the outer <a> wrapper around the .project-owner div
(block-level element inside inline <a> is invalid HTML and was likely
contributing to layout weirdness). The owner name is now an explicit
<a> inside its own span.
Reverted kses to the default wp_kses_post() since we're back to
standard HTML elements only — no SVG, no data URIs, no inline styles
that need a custom allowed list.
- Removed the <rect x='0' y='0' width='24' height='24' fill='none'> viewport
markers from each social-share SVG. With 'fill=none' the rect was
still visible if any inherited stroke wasn't suppressed (which turned
out to be unreliable across themes/CSS specificity).
- Removed redundant width='24' height='24' attributes from each SVG so
the CSS .project-social-sharing svg { width:20px; height:20px } can
size them unambiguously.
- Inlined avatar <img> styles (width:50px; height:50px; border-radius:50%;
object-fit:cover; flex-shrink:0; display:block) so the avatar is
guaranteed to render as a 50x50 circle regardless of theme CSS.
- Switched .project-owner-avatar to inline-flex so the span shrinks to
the image's natural size within the flex parent.
- .project-github-button renamed to .project-repo-button (added 1px border
for proper outline style; the old class is gone so the button was rendering
as unstyled <a>).
- Suppress inherited stroke on the Tabler SVG <rect> viewport marker — without
this it draws a square outline inside the round social-share button.
- Move owner avatar inline styles into CSS with object-fit: cover, explicit
width/height, and border-radius: 50%; add flex shrink/grow rules for the
owner row's three spans so the avatar isn't squashed by the flex layout.
The social-share buttons function was hooked to
projects_after_download_button, but the template never fired that action —
the buttons never rendered. Added a do_action() call after the View Repo
button.
The Follow button hardcoded a GitHub URL and used the GitHub-specific
github-button class (which only acts on github.com). Replaced with a
plain styled link pointing at the owner's actual URL (works for any
provider). Removed the assets/js/buttons.js enqueue since nothing uses
the github-button class anymore.
Renamed the project-github-button CSS class on the View Repo link to
project-repo-button since it's provider-neutral now.
Keith Solomon