{"id":20795554,"url":"https://github.com/zepdev/zeppelin-element-library","last_synced_at":"2025-03-12T01:31:16.607Z","repository":{"id":46052030,"uuid":"175783509","full_name":"zepdev/zeppelin-element-library","owner":"zepdev","description":"Element Library as a styleguide solution for Zeppelin","archived":false,"fork":false,"pushed_at":"2023-09-15T14:00:06.000Z","size":9330,"stargazers_count":2,"open_issues_count":8,"forks_count":0,"subscribers_count":6,"default_branch":"development","last_synced_at":"2025-02-18T22:16:53.308Z","etag":null,"topics":["design-system"],"latest_commit_sha":null,"homepage":"","language":"SCSS","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/zepdev.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":"2019-03-15T08:54:29.000Z","updated_at":"2023-09-18T13:39:13.000Z","dependencies_parsed_at":"2024-06-21T17:32:49.370Z","dependency_job_id":"2c106397-401e-4438-9b6d-c18dee5db8a0","html_url":"https://github.com/zepdev/zeppelin-element-library","commit_stats":{"total_commits":541,"total_committers":14,"mean_commits":"38.642857142857146","dds":0.7134935304990757,"last_synced_commit":"eba0b5b815defebde651f42bab59c402ad9120ce"},"previous_names":[],"tags_count":50,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zepdev%2Fzeppelin-element-library","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zepdev%2Fzeppelin-element-library/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zepdev%2Fzeppelin-element-library/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zepdev%2Fzeppelin-element-library/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/zepdev","download_url":"https://codeload.github.com/zepdev/zeppelin-element-library/tar.gz/refs/heads/development","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":243139450,"owners_count":20242562,"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":["design-system"],"created_at":"2024-11-17T16:22:24.943Z","updated_at":"2025-03-12T01:31:16.422Z","avatar_url":"https://github.com/zepdev.png","language":"SCSS","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003c!-- AUTO-GENERATED-CONTENT:START (STARTER) --\u003e\n\u003cp align=\"center\"\u003e\n    \u003cimg alt=\"Zeppelin\" src=\"https://s3.eu-central-1.amazonaws.com/com.zeppelin.zds.assets/zel/ZEP_Logo_rgb_DINlang.png\" width=\"200\"/\u003e\n\u003c/p\u003e\n\u003ch1 align=\"center\"\u003e\n  Zeppelin Element Library (Legacy)\n\u003c/h1\u003e\n\u003ch2 align=\"center\"\u003e⚠️ This Design System is deprecated and no longer maintained. npm packges will stay available, but please make sure to opt out until 2025 ⚠️\u003ch2\u003e\n\u003cspan align=\"center\"\u003e\n\n[![Quality Gate Status](https://sonarcloud.io/api/project_badges/measure?project=zepdev_zeppelin-element-library\u0026metric=alert_status)](https://sonarcloud.io/dashboard?id=zepdev_zeppelin-element-library)\n[![Bugs](https://sonarcloud.io/api/project_badges/measure?project=zepdev_zeppelin-element-library\u0026metric=bugs)](https://sonarcloud.io/dashboard?id=zepdev_zeppelin-element-library)\n[![Code Smells](https://sonarcloud.io/api/project_badges/measure?project=zepdev_zeppelin-element-library\u0026metric=code_smells)](https://sonarcloud.io/dashboard?id=zepdev_zeppelin-element-library)\n[![Coverage](https://sonarcloud.io/api/project_badges/measure?project=zepdev_zeppelin-element-library\u0026metric=coverage)](https://sonarcloud.io/dashboard?id=zepdev_zeppelin-element-library)\n[![Duplicated Lines (%)](https://sonarcloud.io/api/project_badges/measure?project=zepdev_zeppelin-element-library\u0026metric=duplicated_lines_density)](https://sonarcloud.io/dashboard?id=zepdev_zeppelin-element-library)\n[![Lines of Code](https://sonarcloud.io/api/project_badges/measure?project=zepdev_zeppelin-element-library\u0026metric=ncloc)](https://sonarcloud.io/dashboard?id=zepdev_zeppelin-element-library)\n[![Reliability Rating](https://sonarcloud.io/api/project_badges/measure?project=zepdev_zeppelin-element-library\u0026metric=reliability_rating)](https://sonarcloud.io/dashboard?id=zepdev_zeppelin-element-library)\n[![Security Rating](https://sonarcloud.io/api/project_badges/measure?project=zepdev_zeppelin-element-library\u0026metric=security_rating)](https://sonarcloud.io/dashboard?id=zepdev_zeppelin-element-library)\n\n[![Technical Debt](https://sonarcloud.io/api/project_badges/measure?project=zepdev_zeppelin-element-library\u0026metric=sqale_index)](https://sonarcloud.io/dashboard?id=zepdev_zeppelin-element-library)\n[![Maintainability Rating](https://sonarcloud.io/api/project_badges/measure?project=zepdev_zeppelin-element-library\u0026metric=sqale_rating)](https://sonarcloud.io/dashboard?id=zepdev_zeppelin-element-library)\n[![Vulnerabilities](https://sonarcloud.io/api/project_badges/measure?project=zepdev_zeppelin-element-library\u0026metric=vulnerabilities)](https://sonarcloud.io/dashboard?id=zepdev_zeppelin-element-library)\n[![Commitizen friendly](https://img.shields.io/badge/commitizen-friendly-brightgreen.svg)](http://commitizen.github.io/cz-cli/)\n[![semantic-release](https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg)](https://github.com/semantic-release/semantic-release)\n[![semantic-release](https://img.shields.io/npm/v/zeppelin-element-library.svg)](https://www.npmjs.com/package/zeppelin-element-library)\n[![Bundlephobia min zipped size](https://img.shields.io/bundlephobia/minzip/zeppelin-element-library.svg)](https://bundlephobia.com/result?p=zeppelin-element-library)\n\n\u003c/span\u003e\n\nThe Zeppelin Design System contains individual styles and components to build intuitive designs. These designs follow the same universal principles.\n\nThe Zeppelin Element Library gives developers the basic styles, scripts and assets for building Zeppelin products.\n\n## How to install\n\nRun the following command using [npm](https://www.npmjs.com/):\n\n```bash\nnpm install zeppelin-element-library --save\n```\n\nIf you prefer [Yarn](https://yarnpkg.com/en/), use the following command instead:\n\n```bash\nyarn add zeppelin-element-library\n```\n\n## How to use\n\nUse either ESM or CommonJS to use the JavaScript\n\n### Import\n\nImport the JavaScript as ECMAScript Module\n\n```javascript\nimport ZEL from 'zeppelin-element-library';\n```\n\n### Require\n\nRequire the JavaScript as CommonJS Module\n\n```javascript\nconst ZEL = require('zeppelin-element-library');\n```\n\n### Use provided Styles\n\nWhen using Webpack, you can include the provided styles into a JavaScript file.\n\n```javascript\nimport 'zeppelin-element-library/zel.css';\n```\n\n### Initialize Script\n\nTo get the JavaScript running, initialize ZEL after the DOM has loaded. Place the following script at the bottom of your body element.\n\n```html\n\u003cscript\u003e\n  document.addEventListener('DOMContentLoaded', function () {\n    ZEL.init();\n  });\n\u003c/script\u003e\n```\n\n## Development for publishing on npm\n\nThere are a few main parts to this project for use in the npm package;\n\n1. Sketch Files - Update sketch files at src/assets/sketches/ and 'yarn bundle' will move it to the folder assets/sketch/ for you automatically.\n\n2. Fonts - Update fonts at src/assets/fonts and 'yarn bundle' will move it to the folder assets/fonts/ for you automatically.\n\n3. Logos - Update logos at src/assets/logos (please add them as a zip file) and 'yarn bundle' will move it to the folder assets/logos/ for you automatically.\n\n4. Icons - Update icons at src/assets/icons/raw and 'yarn svg:update' will prefix, optimize and move them into src/assets/icons/SVG. Please be aware that always the complete icon set is needed in src/assets/icons/raw/. Also a sprite of all prepared SVGs will be generated at src/assets/icons/sprite. By 'yarn bundle' the src/assets/icons/ folder except src/assets/icons/raw will be copied to the folder assets/icons/ which will be part of the npm package and also be available via CDN after deployment. SVG and sprite folders within assets/icons/ will then also be zipped automatically.\n\n5. guidelines.json - Update this file at src/assets/themes/guidelines.json and it will automatically be moved to the main folder by 'yarn bundle' for npm packings. Please do not touch the guidelines.json file in the root folder. If you make any changes made to src/assets/themes/guideslines.json please make sure to run 'yarn convert' to convert this file to a guidelines.scss file that can be used to make the zeppelin element library css.\n\nNote on 'yarn convert': Nested variables can be accessed as 'map-deep-get(\\$guideliness, \"breakpoints\", \"xs\")' (see \\_variables.scss).\n\n6. bundle - This folder contains all compiled javascript for ZEL. It is made automatically by 'yarn build' and then renamed and moved by 'yarn bundle' for npm packaging.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fzepdev%2Fzeppelin-element-library","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fzepdev%2Fzeppelin-element-library","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fzepdev%2Fzeppelin-element-library/lists"}