From 5d2dee965d19b60a2d6ad2fa7a4b4287a4fbb542 Mon Sep 17 00:00:00 2001 From: Akib Date: Mon, 14 Sep 2026 04:31:16 +0000 Subject: [PATCH 1/2] docs: link to npm and GitHub from the demo and the workspace readme MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit The demo site linked nowhere. Someone who likes what they see there had no way to reach the package or the source without going back to wherever they came from — which is the one moment they are most likely to install it. The masthead now carries npm, GitHub and StackBlitz links plus the install command. The workspace readme gets the same three links and a version badge. The library's own package.json already declared repository, homepage and bugs, so the npm page sidebar was fine; this is about the two places a visitor actually lands. --- README.md | 7 +++++++ projects/demo/src/app/app.css | 28 ++++++++++++++++++++++++++++ projects/demo/src/app/app.html | 19 +++++++++++++++++++ 3 files changed, 54 insertions(+) diff --git a/README.md b/README.md index 0e67130..16b68cf 100644 --- a/README.md +++ b/README.md @@ -1,7 +1,14 @@ # masonry-angular — workspace +[![npm](https://img.shields.io/npm/v/masonry-angular.svg)](https://www.npmjs.com/package/masonry-angular) +[![license](https://img.shields.io/npm/l/masonry-angular.svg)](LICENSE) + Angular workspace for the **masonry-angular** library and its example app. +**[npm](https://www.npmjs.com/package/masonry-angular)** · +**[GitHub](https://github.com/MeAkib/masonry-angular)** · +**[StackBlitz](https://stackblitz.com/github/MeAkib/masonry-angular/tree/main/examples/stackblitz)** + | Project | Path | | | --- | --- | --- | | `masonry-angular` | `projects/masonry-angular` | The publishable library. | diff --git a/projects/demo/src/app/app.css b/projects/demo/src/app/app.css index 080607e..f4ecc21 100644 --- a/projects/demo/src/app/app.css +++ b/projects/demo/src/app/app.css @@ -49,3 +49,31 @@ nav a.active { main { padding: 20px 10px; } + +.masthead .links { + display: flex; + flex-wrap: wrap; + gap: 14px; + align-items: center; + margin-top: 10px; + font-size: 0.85rem; +} + +.masthead .links a { + color: var(--accent); + text-decoration: none; + border-bottom: 1px solid transparent; +} + +.masthead .links a:hover { + border-bottom-color: currentcolor; +} + +.masthead .links code { + padding: 2px 8px; + border: 1px solid var(--line); + border-radius: 6px; + background: var(--panel); + color: var(--muted); + font-size: 0.8rem; +} diff --git a/projects/demo/src/app/app.html b/projects/demo/src/app/app.html index ab1cca8..cf0f48a 100644 --- a/projects/demo/src/app/app.html +++ b/projects/demo/src/app/app.html @@ -2,6 +2,25 @@

masonry-angular

Zero-dependency masonry for Angular — signal-based, zoneless and SSR-safe.

+ + +

+ + npm + + + GitHub + + + StackBlitz + + npm i masonry-angular +