{"id":16007270,"url":"https://github.com/mvsde/lightbox","last_synced_at":"2025-10-21T10:31:20.699Z","repository":{"id":42633957,"uuid":"381939352","full_name":"mvsde/lightbox","owner":"mvsde","description":"Barebones lightbox library.","archived":true,"fork":false,"pushed_at":"2024-01-20T05:56:20.000Z","size":1066,"stargazers_count":0,"open_issues_count":1,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-02-04T04:49:43.748Z","etag":null,"topics":["css","html","javascript","lightbox"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"other","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/mvsde.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE.md","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null}},"created_at":"2021-07-01T06:58:26.000Z","updated_at":"2024-03-30T17:08:39.000Z","dependencies_parsed_at":"2024-01-20T08:32:27.830Z","dependency_job_id":"41d5b21a-d111-44ee-bd95-1a0a27d0124e","html_url":"https://github.com/mvsde/lightbox","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mvsde%2Flightbox","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mvsde%2Flightbox/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mvsde%2Flightbox/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mvsde%2Flightbox/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/mvsde","download_url":"https://codeload.github.com/mvsde/lightbox/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":237472767,"owners_count":19315761,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["css","html","javascript","lightbox"],"created_at":"2024-10-08T12:02:32.307Z","updated_at":"2025-10-21T10:31:15.246Z","avatar_url":"https://github.com/mvsde.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Lightbox\n\nMostly unstyled barebones lightbox library.\n\n## Installation\n\n```bash\nnpm install @mvsde/lightbox focus-trap\n```\n\n## JavaScript\n\n```js\nimport { Lightbox, LightboxLink } from '@mvsde/lightbox'\n\nconst lightbox = new Lightbox({\n  element: document.querySelector('#lightbox')\n})\n\nlightbox.init()\n\nconst lightboxLinks = document.querySelectorAll('.js-lightbox-link')\n\nfor (const link of lightboxLinks) {\n  new LightboxLink({ element: link, target: lightbox }).init()\n}\n```\n\n## CSS\n\n```css\n@import '@mvsde/lightbox';\n```\n\n## Trigger link HTML\n\n```html\n\u003ca\n  class=\"js-lightbox-link\"\n  href=\"https://source.unsplash.com/NRQV-hBF10M/2000x1300\"\n  data-alt=\"River in the foreground cutting through grassland. Pine trees in the middle ground slightly obscured by mist. Large mountains to the left and right in the background, framing a pale orange sky at dawn.\"\n  data-caption=\"Photo by \u003ca href='https://unsplash.com/photos/NRQV-hBF10M'\u003eBailey Zindel on Unsplash\u003c/a\u003e.\"\n\u003e\n  Yosemite valley at dawn\n\u003c/a\u003e\n```\n\n## Popup HTML\n\nThe `data-padding` attribute is optional and defaults to `32`.\n\n```html\n\u003cdiv\n  id=\"lightbox\"\n  class=\"lightbox\"\n  data-padding=\"20\"\n\u003e\n  \u003cdiv class=\"lightbox__inner\"\u003e\n\n    \u003cbutton\n      class=\"lightbox__close\"\n      aria-label=\"Close image\"\n    \u003e×\u003c/button\u003e\n\n    \u003cfigure class=\"lightbox__figure\"\u003e\n      \u003cimg class=\"lightbox__image\"\u003e\n      \u003cfigcaption class=\"lightbox__caption\"\u003e\u003c/figcaption\u003e\n    \u003c/figure\u003e\n\n  \u003c/div\u003e\n\u003c/div\u003e\n```\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmvsde%2Flightbox","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fmvsde%2Flightbox","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmvsde%2Flightbox/lists"}