{"id":29020377,"url":"https://github.com/appbaseio/designkit","last_synced_at":"2025-07-05T02:03:57.195Z","repository":{"id":27186725,"uuid":"111197020","full_name":"appbaseio/designkit","owner":"appbaseio","description":"Design kit for appbaseio ecosystem","archived":false,"fork":false,"pushed_at":"2023-01-27T07:14:15.000Z","size":1568,"stargazers_count":14,"open_issues_count":9,"forks_count":4,"subscribers_count":6,"default_branch":"master","last_synced_at":"2025-07-04T20:50:36.765Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"http://opensource.appbase.io/designkit/","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"apache-2.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/appbaseio.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}},"created_at":"2017-11-18T10:39:52.000Z","updated_at":"2023-04-13T02:21:45.000Z","dependencies_parsed_at":"2023-02-15T06:31:01.746Z","dependency_job_id":null,"html_url":"https://github.com/appbaseio/designkit","commit_stats":null,"previous_names":[],"tags_count":8,"template":false,"template_full_name":null,"purl":"pkg:github/appbaseio/designkit","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/appbaseio%2Fdesignkit","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/appbaseio%2Fdesignkit/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/appbaseio%2Fdesignkit/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/appbaseio%2Fdesignkit/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/appbaseio","download_url":"https://codeload.github.com/appbaseio/designkit/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/appbaseio%2Fdesignkit/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":263645557,"owners_count":23494005,"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":"2025-06-26T01:05:29.479Z","updated_at":"2025-07-05T02:03:57.179Z","avatar_url":"https://github.com/appbaseio.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# designkit\n\nDesign kit for appbaseio ecosystem\n\n# Components\n\n## Footer\n\nAdditional props can be passed to `Footer` and its child compound components `Footer.Links`, `Footer.List` and `Footer.Brand`.\n\n```js\nimport { Footer, Title } from '@appbaseio/designkit';\n\nconst AppFooter = ({ theme: { colors } }) =\u003e (\n\t\u003cFooter css={{ backgroundColor: colors.footer }}\u003e\n\t\t\u003cFooter.Links\u003e\n\t\t\t\u003cFooter.List\u003e\n\t\t\t\t\u003cTitle\u003eProducts\u003c/Title\u003e\n\t\t\t\t\u003cli\u003e\n\t\t\t\t\t\u003ca\n\t\t\t\t\t\ttarget=\"_blank\"\n\t\t\t\t\t\trel=\"noopener noreferrer\"\n\t\t\t\t\t\thref=\"https://appbase.io\"\n\t\t\t\t\t\u003e\n\t\t\t\t\t\tAppbase.io\n\t\t\t\t\t\u003c/a\u003e\n\t\t\t\t\u003c/li\u003e\n\t\t\t\t\u003cli\u003e\n\t\t\t\t\t\u003ca\n\t\t\t\t\t\ttarget=\"_blank\"\n\t\t\t\t\t\trel=\"noopener noreferrer\"\n\t\t\t\t\t\thref=\"https://opensource.appbase.io/reactivemaps\"\n\t\t\t\t\t\u003e\n\t\t\t\t\t\tReactive Maps\n\t\t\t\t\t\u003c/a\u003e\n\t\t\t\t\u003c/li\u003e\n\t\t\t\t\u003cli\u003e\n\t\t\t\t\t\u003ca\n\t\t\t\t\t\ttarget=\"_blank\"\n\t\t\t\t\t\trel=\"noopener noreferrer\"\n\t\t\t\t\t\thref=\"https://opensource.appbase.io/reactivesearch\"\n\t\t\t\t\t\u003e\n\t\t\t\t\t\tReactive Search\n\t\t\t\t\t\u003c/a\u003e\n\t\t\t\t\u003c/li\u003e\n\t\t\t\u003c/Footer.List\u003e\n\t\t\t\u003cFooter.List\u003e\n\t\t\t\t\u003cTitle\u003eDocs\u003c/Title\u003e\n\t\t\t\t\u003cli\u003e\n\t\t\t\t\t\u003ca\n\t\t\t\t\t\ttarget=\"_blank\"\n\t\t\t\t\t\trel=\"noopener noreferrer\"\n\t\t\t\t\t\thref=\"https://docs.appbase.io\"\n\t\t\t\t\t\u003e\n\t\t\t\t\t\tJS Quick Start\n\t\t\t\t\t\u003c/a\u003e\n\t\t\t\t\u003c/li\u003e\n\t\t\t\t\u003cli\u003e\n\t\t\t\t\t\u003ca\n\t\t\t\t\t\ttarget=\"_blank\"\n\t\t\t\t\t\trel=\"noopener noreferrer\"\n\t\t\t\t\t\thref=\"https://docs.appbase.io\"\n\t\t\t\t\t\u003e\n\t\t\t\t\t\tJS API Reference\n\t\t\t\t\t\u003c/a\u003e\n\t\t\t\t\u003c/li\u003e\n\t\t\t\t\u003cli\u003e\n\t\t\t\t\t\u003ca\n\t\t\t\t\t\ttarget=\"_blank\"\n\t\t\t\t\t\trel=\"noopener noreferrer\"\n\t\t\t\t\t\thref=\"https://rest.appbase.io\"\n\t\t\t\t\t\u003e\n\t\t\t\t\t\tREST Quick Start\n\t\t\t\t\t\u003c/a\u003e\n\t\t\t\t\u003c/li\u003e\n\t\t\t\u003c/Footer.List\u003e\n\t\t\t\u003cFooter.List\u003e\n\t\t\t\t\u003cTitle\u003eUse Cases\u003c/Title\u003e\n\t\t\t\t\u003cli\u003e\n\t\t\t\t\t\u003ca\n\t\t\t\t\t\ttarget=\"_blank\"\n\t\t\t\t\t\trel=\"noopener noreferrer\"\n\t\t\t\t\t\thref=\"https://appbase.io\"\n\t\t\t\t\t\u003e\n\t\t\t\t\t\tGeolocation Queries\n\t\t\t\t\t\u003c/a\u003e\n\t\t\t\t\u003c/li\u003e\n\t\t\t\t\u003cli\u003e\n\t\t\t\t\t\u003ca\n\t\t\t\t\t\ttarget=\"_blank\"\n\t\t\t\t\t\trel=\"noopener noreferrer\"\n\t\t\t\t\t\thref=\"https://appbase.io\"\n\t\t\t\t\t\u003e\n\t\t\t\t\t\tPersonalized Feeds\n\t\t\t\t\t\u003c/a\u003e\n\t\t\t\t\u003c/li\u003e\n\t\t\t\t\u003cli\u003e\n\t\t\t\t\t\u003ca\n\t\t\t\t\t\ttarget=\"_blank\"\n\t\t\t\t\t\trel=\"noopener noreferrer\"\n\t\t\t\t\t\thref=\"https://appbase.io\"\n\t\t\t\t\t\u003e\n\t\t\t\t\t\tRealtime Search\n\t\t\t\t\t\u003c/a\u003e\n\t\t\t\t\u003c/li\u003e\n\t\t\t\u003c/Footer.List\u003e\n\t\t\t\u003cFooter.List\u003e\n\t\t\t\t\u003cTitle className=\"heading\"\u003eCompany\u003c/Title\u003e\n\t\t\t\t\u003cli\u003e\n\t\t\t\t\t\u003ca\n\t\t\t\t\t\ttarget=\"_blank\"\n\t\t\t\t\t\trel=\"noopener noreferrer\"\n\t\t\t\t\t\thref=\"https://status.appbase.io/\"\n\t\t\t\t\t\u003e\n\t\t\t\t\t\tStatus Page\n\t\t\t\t\t\u003c/a\u003e\n\t\t\t\t\u003c/li\u003e\n\t\t\t\t\u003cli\u003e\n\t\t\t\t\t\u003ca\n\t\t\t\t\t\ttarget=\"_blank\"\n\t\t\t\t\t\trel=\"noopener noreferrer\"\n\t\t\t\t\t\thref=\"http://tos.appbase.io/\"\n\t\t\t\t\t\u003e\n\t\t\t\t\t\tTerms\n\t\t\t\t\t\u003c/a\u003e\n\t\t\t\t\u003c/li\u003e\n\t\t\t\t\u003cli\u003e\n\t\t\t\t\t\u003ca\n\t\t\t\t\t\ttarget=\"_blank\"\n\t\t\t\t\t\trel=\"noopener noreferrer\"\n\t\t\t\t\t\thref=\"https://tos.appbase.io/\"\n\t\t\t\t\t\u003e\n\t\t\t\t\t\tPrivacy\n\t\t\t\t\t\u003c/a\u003e\n\t\t\t\t\u003c/li\u003e\n\t\t\t\u003c/Footer.List\u003e\n\t\t\u003c/Footer.Links\u003e\n\t\t\u003cFooter.Brand\u003e\n\t\t\t\u003cimg\n\t\t\t\twidth=\"100%\"\n\t\t\t\tsrc=\"/static/svg/jellyfish.svg\"\n\t\t\t\talt=\"appbase.io\"\n\t\t\t/\u003e\n\t\t\u003c/Footer.Brand\u003e\n\t\u003c/Footer\u003e\n);\n```\n\n## News\n\n```js\n\u003cNews\u003eBuild native mobile apps with appbase.io and ReactiveSearch\u003c/News\u003e\n```\n\n## Hero\n\nA full width and full height section great for highlighting the landing section of new pages.\n\n```js\n\u003cHero style={{ background: 'hotpink' }}\u003e\n\t\u003cH1\u003eBuild native mobile apps with appbase.io and ReactiveSearch\u003c/H1\u003e\n\t\u003cH2\u003eAppbase Design System\u003c/H2\u003e\n\u003c/Hero\u003e\n```\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fappbaseio%2Fdesignkit","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fappbaseio%2Fdesignkit","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fappbaseio%2Fdesignkit/lists"}