{"id":21029887,"url":"https://github.com/kitconcept/volto-logos-block","last_synced_at":"2026-03-17T02:36:04.993Z","repository":{"id":210224631,"uuid":"721663170","full_name":"kitconcept/volto-logos-block","owner":"kitconcept","description":null,"archived":false,"fork":false,"pushed_at":"2025-04-15T11:34:44.000Z","size":6652,"stargazers_count":0,"open_issues_count":10,"forks_count":1,"subscribers_count":3,"default_branch":"main","last_synced_at":"2025-04-24T04:56:07.653Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/kitconcept.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2023-11-21T14:18:36.000Z","updated_at":"2025-02-07T14:07:15.000Z","dependencies_parsed_at":"2024-01-04T12:29:12.613Z","dependency_job_id":"c85c21ef-f2c7-4fd3-b506-4be5d15380c1","html_url":"https://github.com/kitconcept/volto-logos-block","commit_stats":null,"previous_names":["kitconcept/volto-logos-block"],"tags_count":8,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/kitconcept%2Fvolto-logos-block","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/kitconcept%2Fvolto-logos-block/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/kitconcept%2Fvolto-logos-block/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/kitconcept%2Fvolto-logos-block/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/kitconcept","download_url":"https://codeload.github.com/kitconcept/volto-logos-block/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":251315750,"owners_count":21569857,"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":[],"created_at":"2024-11-19T12:14:53.959Z","updated_at":"2026-03-17T02:36:04.980Z","avatar_url":"https://github.com/kitconcept.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003cpicture\u003e\n  \u003csource align=\"right\" width=\"200\" media=\"(prefers-color-scheme: dark)\" srcset=\"https://kitconcept.com/kitconcept-white.svg\"\u003e\n  \u003cimg align=\"right\" width=\"200\" alt=\"kitconcept, GmbH\" src=\"https://kitconcept.com/kitconcept-black.svg\"\u003e\n\u003c/picture\u003e\n\n# Volto Logos Block (@kitconcept/volto-logos-block)\n\nA logos block for Volto\n\n[![npm](https://img.shields.io/npm/v/@kitconcept/volto-logos-block)](https://www.npmjs.com/package/@kitconcept/volto-logos-block)\n[![](https://img.shields.io/badge/-Storybook-ff4785?logo=Storybook\u0026logoColor=white\u0026style=flat-square)](https://kitconcept.github.io/volto-logos-block/)\n[![Code analysis checks](https://github.com/kitconcept/volto-logos-block/actions/workflows/code.yml/badge.svg)](https://github.com/kitconcept/volto-logos-block/actions/workflows/code.yml)\n[![Unit tests](https://github.com/kitconcept/volto-logos-block/actions/workflows/unit.yml/badge.svg)](https://github.com/kitconcept/volto-logos-block/actions/workflows/unit.yml)\n\nThe Volto Logos Block allows editors to add a row of up to 6 logos to a page. The logos are displayed in a responsive grid layout, automatically adjusting the number of logos per row based on the available space. This block is designed to be flexible and easy to use, making it a great addition to any Volto project.\n\nThe logos block matches the style of the existing Logos footer slot in VLT 6.\n\n\u003e [!WARNING]\n\u003e This package depends on `@kitconcept/volto-light-theme` and Volto 18 or later.\n\u003e It could be used without it, but you would have to provide your own block's view component and the logos container styling.\n\n\n## Features\n\n   - \tFlexible Logo Display – Supports adding logos and automatically adjusting based on available space.\n   -    Responsive Layout – Adapts dynamically to different screen sizes to ensure logos are displayed optimally.\n   -    Seamless Volto Integration – Works smoothly within existing Volto using VLT projects\n\n## Compatibility\n\nFrom version 3.x.x this add-on requires `@kitconcept/volto-light-theme` and Volto 18 or later.\nThere is also a hard breaking in the data stored in the block.\nNo migration is provided, so you have to remove the block and add it again or provide your own migration.\n\nThe data structure in versions \u003c=2.x.x was using the usual blocks in block data structure (`blocks`/`blocks_layout`).\n\nThe data structure in version 3.x.x is using a simpler arrayed `object_list` widget data structure.\n\nThis is the compatibility matrix.\n\n| volto-logos-block version | Volto version | VLT version  |\n|---------------------------|---------------|--------------|\n| 2.x.x                     |  17, 18       | Not required |\n| 3.x.x                     |  18           | 6.x.x        |\n\n\n## Installation\n\nTo install your project, you must choose the method appropriate to your version of Volto.\n\n### Volto 18 and later\n\nAdd `@kitconcept/volto-logos-block` to your `package.json`:\n\n```json\n\"dependencies\": {\n    \"@kitconcept/volto-logos-block\": \"*\"\n}\n```\n\nAdd `@kitconcept/volto-logos-block` to your `volto.config.js`:\n\n```javascript\nconst addons = ['@kitconcept/volto-logos-block'];\n```\n\nIf this package provides a Volto theme, and you want to activate it, then add the following to your `volto.config.js`:\n\n```javascript\nconst theme = '@kitconcept/volto-logos-block';\n```\n\n## Test installation\n\nVisit http://localhost:3000/ in a browser, login, and check the awesome new features.\n\n\n## Development\n\nThe development of this add-on is done in isolation using a new approach using pnpm workspaces and latest `mrs-developer` and other Volto core improvements.\nFor this reason, it only works with pnpm and Volto 18 (currently in alpha).\n\n\n### Pre-requisites\n\n-   [Node.js](https://6.docs.plone.org/install/create-project.html#node-js)\n-   [Make](https://6.docs.plone.org/install/create-project.html#make)\n-   [Docker](https://6.docs.plone.org/install/create-project.html#docker)\n\n## Usage\n1. Go to http://localhost:3000, login, add the logos you want to use as image content objects to your site.\n2. Create a new page. The logos block will show up in the Volto blocks chooser. Add it to the page\n3. Select the number of items\n4. Choose the Logos you uploaded earlier as content\n\n\n### Make convenience commands\n\nRun `make help` to list the available commands.\n\n```text\nhelp                             Show this help\ninstall                          Installs the add-on in a development environment\nstart                            Starts Volto, allowing reloading of the add-on during development\nbuild                            Build a production bundle for distribution of the project with the add-on\ni18n                             Sync i18n\nci-i18n                          Check if i18n is not synced\nformat                           Format codebase\nlint                             Lint, or catch and remove problems, in code base\nrelease                          Release the add-on on npmjs.org\nrelease-dry-run                  Dry-run the release of the add-on on npmjs.org\ntest                             Run unit tests\nci-test                          Run unit tests in CI\nbackend-docker-start             Starts a Docker-based backend for development\nstorybook-start                  Start Storybook server on port 6006\nstorybook-build                  Build Storybook\nacceptance-frontend-dev-start    Start acceptance frontend in development mode\nacceptance-frontend-prod-start   Start acceptance frontend in production mode\nacceptance-backend-start         Start backend acceptance server\nci-acceptance-backend-start      Start backend acceptance server in headless mode for CI\nacceptance-test                  Start Cypress in interactive mode\nci-acceptance-test               Run cypress tests in headless mode for CI\n```\n\n### Development environment set up\n\nInstall package requirements.\n\n```shell\nmake install\n```\n\n### Start developing\n\nStart the backend.\n\n```shell\nmake backend-docker-start\n```\n\nIn a separate terminal session, start the frontend.\n\n```shell\nmake start\n```\n\n### Lint code\n\nRun ESlint, Prettier, and Stylelint in analyze mode.\n\n```shell\nmake lint\n```\n\n### Format code\n\nRun ESlint, Prettier, and Stylelint in fix mode.\n\n```shell\nmake format\n```\n\n### i18n\n\nExtract the i18n messages to locales.\n\n```shell\nmake i18n\n```\n\n### Unit tests\n\nRun unit tests.\n\n```shell\nmake test\n```\n\n### Run Cypress tests\n\nRun each of these steps in separate terminal sessions.\n\nIn the first session, start the frontend in development mode.\n\n```shell\nmake acceptance-frontend-dev-start\n```\n\nIn the second session, start the backend acceptance server.\n\n```shell\nmake acceptance-backend-start\n```\n\nIn the third session, start the Cypress interactive test runner.\n\n```shell\nmake acceptance-test\n```\n\n## License\n\nThe project is licensed under the MIT license.\n\n## Credits\n\n\u003cimg alt=\"Deutsches Zentrum für Luft- und Raumfahrt\" src=\"https://github.com/kitconcept/volto-slider-block/raw/main/dlr.svg\" width=\"230px\" /\u003e\n\nThe development of this plugin has been kindly sponsored by the [German Aerospace Center (DLR)](https://dlr.de).\n\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fkitconcept%2Fvolto-logos-block","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fkitconcept%2Fvolto-logos-block","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fkitconcept%2Fvolto-logos-block/lists"}