{"id":19879994,"url":"https://github.com/passbolt/passbolt_styleguide","last_synced_at":"2026-04-02T23:29:35.489Z","repository":{"id":29749536,"uuid":"33293128","full_name":"passbolt/passbolt_styleguide","owner":"passbolt","description":"Passbolt styleguide, repository of the UI elements and styles for the open source password manager for teams.","archived":false,"fork":false,"pushed_at":"2024-10-23T15:22:30.000Z","size":106766,"stargazers_count":33,"open_issues_count":6,"forks_count":32,"subscribers_count":7,"default_branch":"master","last_synced_at":"2024-10-23T19:53:00.930Z","etag":null,"topics":["less","passbolt","react","styleguide"],"latest_commit_sha":null,"homepage":"https://passbolt.github.io/passbolt_styleguide","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"agpl-3.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/passbolt.png","metadata":{"files":{"readme":"README.md","changelog":null,"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":"2015-04-02T06:29:48.000Z","updated_at":"2024-10-21T16:38:53.000Z","dependencies_parsed_at":"2023-01-14T15:45:46.692Z","dependency_job_id":"d07d51dd-8179-4cbe-a48a-8aa3c6ce7b09","html_url":"https://github.com/passbolt/passbolt_styleguide","commit_stats":{"total_commits":2035,"total_committers":24,"mean_commits":84.79166666666667,"dds":0.7670761670761671,"last_synced_commit":"0e192aa38bb08faaeb3560698179c52a3655b88d"},"previous_names":[],"tags_count":450,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/passbolt%2Fpassbolt_styleguide","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/passbolt%2Fpassbolt_styleguide/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/passbolt%2Fpassbolt_styleguide/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/passbolt%2Fpassbolt_styleguide/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/passbolt","download_url":"https://codeload.github.com/passbolt/passbolt_styleguide/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247276163,"owners_count":20912288,"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":["less","passbolt","react","styleguide"],"created_at":"2024-11-12T17:09:57.741Z","updated_at":"2026-01-20T11:06:15.481Z","avatar_url":"https://github.com/passbolt.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"\t      ____                  __          ____\n\t     / __ \\____  _____ ____/ /_  ____  / / /_\n\t    / /_/ / __ `/ ___/ ___/ __ \\/ __ \\/ / __/\n\t   / ____/ /_/ (__  |__  ) /_/ / /_/ / / /_\n\t  /_/    \\__,_/____/____/_.___/\\____/_/\\__/\n\n\tThe open source password manager for teams\n\t(c) 2023 Passbolt SA\n\n\nLicense\n==============\n\nPassbolt - Open source password manager for teams\n\n(c) 2023 Passbolt SA\n\nThis program is free software: you can redistribute it and/or modify it under the terms of the GNU Affero General\nPublic License (AGPL) as published by the Free Software Foundation version 3.\n\nThe name \"Passbolt\" is a registered trademark of Passbolt SA, and Passbolt SA hereby declines to grant a trademark\nlicense to \"Passbolt\" pursuant to the GNU Affero General Public License version 3 Section 7(e), without a separate\nagreement with Passbolt SA.\n\nThis program is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY; without even the implied\nwarranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See GNU Affero General Public License for more details.\n\nYou should have received a copy of the GNU Affero General Public License along with this program. If not,\nsee [GNU Affero General Public License v3](http://www.gnu.org/licenses/agpl-3.0.html).\n\nImages and logos in /src/img/third_party belongs to their respective owner.\n\nAbout\n=========\n\nThis is the official styleguide for Passbolt the open source password manager for teams.\nThis styleguide is used to extend, minify and test the stylesheets used by the different\npassbolt components such as the website, the firefox addon, etc.\n\nIn /src and /build you can find the assets that are used by other projects, like the images\nthe less files, the minified css files, fonts, etc.\n\nCredits\n=========\n\nhttps://www.passbolt.com/credits\n\n\nInstall\n=========\n\nInstall grunt\n```\nnpm install -g grunt-cli\n```\n\nInstall the needed modules defined in the grunt config\n```\nnpm install\n```\n\nMake sure Grunt watch for less changes and compile them into CSS\n```\ngrunt watch\n```\n\nEdit one LESS file to see if it works!\n\n\nHow to publish the styleguide?\n=============================\n\nWe are using npm to manage the styleguide package in project using it.\nCheckout npm documentation: https://docs.npmjs.com/developers\n\nIn a nutshell, once you are done changing you can publish the styleguide using npm tools as following:\n\n1. Change the version, rebuild and tag the new package.\n\nIf you want to bump the minor version of the package by instance to go from v3.1.2 to v3.2.0\n```\nnpm version v3.2.0\n```\n\nIn a development scenario if you want to publish an alpha version of the package, you might want to go from\nv3.1.2 to v3.2.0-alpha-0\n```\nnpm version v3.2.0-alpha.0\n```\n\nNpm offers additional versions identifiers to not have to deal manually with the version numbers, if you want check out\nthe [npm version documentation](https://docs.npmjs.com/cli/v7/commands/npm-version).\n\n2. Publish the new version of the package.\n\nOnce the package versioned you can publish it on the npm production channel to make it available to others.\n```\nnpm publish\n```\n\nIn a development scenario, you would prefer to publish the package on the alpha channel\n```\nnpm publish --tag alpha\n```\n\n3. Upgrade the styleguide in the third party projects.\n\nUpgrade the version of the styleguide in your project.\n```\nnpm upgrade passbolt-styleguide\n```\n\nIn some passbolt projects an additional grunt task help you manage the deployment of the styleguide assets\n```\ngrunt styleguide-update\n```\n\nHow to use Storybook?\n=============================\n\nWe try to refer all the styleguide components in Storybook. This way you can play with every single component in\nan isolated way.\n\nBesides, we develop any new component by first testing it against Storybook and hence avoiding\nthe whole application reload.\n\nTo get started with storybook, first install its dependencies. As long as storybook has not migrated completely\nto webpack 4, the dependencies will need to be installed manually.\n\n```\nnpm run dev:storybook:install\n```\n\nTo run Storybook, you just need to run the following command:\n\n```\nnpm run dev:storybook:start\n```\n\nBuilding the related static website is possible as well using the following command:\n\n```\nnpm run dev:storybook:build\n```\n\nExecuting the stories locally to ensure no regression was introduced can be done as following:\n\n```\nnpm run test:storybook\n```\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpassbolt%2Fpassbolt_styleguide","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fpassbolt%2Fpassbolt_styleguide","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpassbolt%2Fpassbolt_styleguide/lists"}