{"id":17045573,"url":"https://github.com/supermacro/elm-antd","last_synced_at":"2025-04-12T15:30:56.680Z","repository":{"id":37976270,"uuid":"257454560","full_name":"supermacro/elm-antd","owner":"supermacro","description":"The official Ant Design UI Kit for Elm","archived":false,"fork":false,"pushed_at":"2023-01-07T17:20:00.000Z","size":1274,"stargazers_count":58,"open_issues_count":62,"forks_count":11,"subscribers_count":3,"default_branch":"master","last_synced_at":"2025-04-09T04:35:02.391Z","etag":null,"topics":["ant-design","antd","components","design-systems","elm","fp","functional-programming","hacktoberfest","ui-kit"],"latest_commit_sha":null,"homepage":"","language":"Elm","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/supermacro.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"CONTRIBUTING.md","funding":".github/FUNDING.yml","license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null},"funding":{"github":"supermacro"}},"created_at":"2020-04-21T02:02:01.000Z","updated_at":"2024-06-09T07:16:23.000Z","dependencies_parsed_at":"2023-02-07T18:00:55.899Z","dependency_job_id":null,"html_url":"https://github.com/supermacro/elm-antd","commit_stats":null,"previous_names":[],"tags_count":20,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/supermacro%2Felm-antd","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/supermacro%2Felm-antd/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/supermacro%2Felm-antd/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/supermacro%2Felm-antd/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/supermacro","download_url":"https://codeload.github.com/supermacro/elm-antd/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248589348,"owners_count":21129591,"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":["ant-design","antd","components","design-systems","elm","fp","functional-programming","hacktoberfest","ui-kit"],"created_at":"2024-10-14T09:37:48.105Z","updated_at":"2025-04-12T15:30:55.721Z","avatar_url":"https://github.com/supermacro.png","language":"Elm","funding_links":["https://github.com/sponsors/supermacro"],"categories":[],"sub_categories":[],"readme":"\u003cimg src=\"https://raw.githubusercontent.com/gDelgado14/elm-antd/master/logo.svg\" alt=\"gDelgado14/elm-antd logo\" width=\"40%\" align=\"right\"\u003e\n\n# Elm Ant Design\n\n[![ELM_ANTD](https://circleci.com/gh/supermacro/elm-antd.svg?style=svg)](https://circleci.com/gh/supermacro/elm-antd) [![This project is using Percy.io for visual regression testing.](https://percy.io/static/images/percy-badge.svg)](https://percy.io/Elm-Antd-Open-Source-Project/elm-antd)\n\n\u003e **[Component Gallery](https://elm-antd.netlify.app)**\n\n\u003e **[API Documentation](https://package.elm-lang.org/packages/supermacro/elm-antd/latest/)**\n\nBringing the amazing [Ant Design](https://ant.design) kit to Elm!\n\n\nStyled entirely using `elm-css`! No external stylesheet needed. Just `elm install supermacro/elm-antd` and you're all good to go!\n\n**Early Development Notice:**\n\n\u003e Elm Ant Design is not fully implemented and in a early / exploratory phase. A lot of APIs may not work yet (in the event that this is the case, please report it as an issue - which I will prioritize). The current API is subject to frequent change, but because Elm is super cool 😎, any breaking changes are guaranteed to be released under a Major release (as per semver).\n\n## Installation\n\n```\nelm install supermacro/elm-antd\n```\n\n## Usage\n\n#### Render stylesheet at the root of your Elm project\n\nElm Antd has a stylesheet implemented in Elm that you must hook up at the root of your elm project. You must use one of `Ant.Css.defaultStyles` or `Ant.Css.createThemedStyles customTheme` (see [official docs](https://package.elm-lang.org/packages/supermacro/elm-antd/latest/) to learn about theming). \n\n\n```elm\nimport Ant.Css\n\nview : Model -\u003e Html Msg\nview model =\n    div []\n      [ Ant.Css.defaultStyles\n      , viewApp model\n      ]\n```\n\n#### Apply Normalize Css\n\nElm Ant Design is built with normalize.css as its blank canvas.\n\nYou should add normalize.css to your project or else the components may not look as expected.\n\nYou have three options:\n\n- Add normalize.css as a `link` tag to your html directly\n\n```html\n\u003clink href=\"https://pagecdn.io/lib/normalize/8.0.1/normalize.min.css\" rel=\"stylesheet\" crossorigin=\"anonymous\"  \u003e\n```\n\n- Add normizlize.css as a Elm module using [elm-css-modern-normalize](https://package.elm-lang.org/packages/hmsk/elm-css-modern-normalize/latest)\n\n```elm\nimport Css.ModernNormalize as ModernNormalize\n\nview : Model -\u003e Html Msg\nview _ =\n    [ ModernNormalize.globalHtml\n    , Ant.Css.defaultStyles\n      -- Your application view comes here\n    ]\n\n```\n\n- Use a bundler for NodeJS to load normalize into your app at build-time.\n\nnpm module Link: https://www.npmjs.com/package/normalize\n\n```javascript\nrequire('normalize')\n```\n\n#### [Optional] - Add Extra animations\n\nThere are additional animations you can add to your `elm-antd` project by adding JS event handlers to your app.\n\nYou can add them in one of two ways:\n\n- Add the following `script` tag to the `head` of your html file:\n\n```html\n\u003cscript src=\"https://cdn.jsdelivr.net/npm/elm-antd-extras@1.0.0/index.js\"\u003e\u003c/script\u003e\n```\n\n- install `elm-antd-extras` npm package and use a bundling tool like webpack, gulp, etc in order to include the code into your html file\n\n## Contributing\n\nWant to help out?\n\n- Check out the [issues](https://github.com/supermacro/elm-antd/issues), and search for \"good first issue\" or \"help wanted\"! \n- Check out the [CONTRIBUTING](https://github.com/supermacro/elm-antd/blob/master/CONTRIBUTING.md) doc \n\n## Inspiration:\n\n- https://github.com/aforemny/elm-mdc\n- https://github.com/EdutainmentLIVE/elm-bootstrap\n- https://github.com/NoRedInk/noredink-ui\n\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsupermacro%2Felm-antd","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fsupermacro%2Felm-antd","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsupermacro%2Felm-antd/lists"}