{"id":20046282,"url":"https://github.com/chataize/dopamine-ui","last_synced_at":"2025-05-05T09:31:32.109Z","repository":{"id":231621373,"uuid":"782244717","full_name":"chataize/dopamine-ui","owner":"chataize","description":"Aesthetic C# .NET Blazor component library that makes the UI seamless and entertaining to use.","archived":false,"fork":false,"pushed_at":"2024-11-05T13:57:14.000Z","size":934,"stargazers_count":5,"open_issues_count":0,"forks_count":1,"subscribers_count":1,"default_branch":"main","last_synced_at":"2024-11-05T14:48:23.514Z","etag":null,"topics":["asp-net-core","blazor","blazor-server","component","component-library","controls","css","design","dotnet","dotnet-core","framework","library","razor","tailwind","tailwindcss","ui","ui-components","ui-framework","ui-library","ux"],"latest_commit_sha":null,"homepage":"https://www.chataize.com","language":"CSS","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"gpl-3.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/chataize.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":"CODE_OF_CONDUCT.md","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":"2024-04-04T23:10:16.000Z","updated_at":"2024-11-05T13:54:35.000Z","dependencies_parsed_at":"2024-06-25T22:29:12.793Z","dependency_job_id":"e698243c-b069-419e-b82b-3e88e1780c0b","html_url":"https://github.com/chataize/dopamine-ui","commit_stats":null,"previous_names":["chataize/dopamine-ui"],"tags_count":35,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/chataize%2Fdopamine-ui","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/chataize%2Fdopamine-ui/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/chataize%2Fdopamine-ui/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/chataize%2Fdopamine-ui/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/chataize","download_url":"https://codeload.github.com/chataize/dopamine-ui/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":224437441,"owners_count":17311014,"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":["asp-net-core","blazor","blazor-server","component","component-library","controls","css","design","dotnet","dotnet-core","framework","library","razor","tailwind","tailwindcss","ui","ui-components","ui-framework","ui-library","ux"],"created_at":"2024-11-13T11:22:33.293Z","updated_at":"2024-11-13T11:22:34.093Z","avatar_url":"https://github.com/chataize.png","language":"CSS","funding_links":[],"categories":[],"sub_categories":[],"readme":"![hero](https://github.com/chataize/dopamine-ui/assets/124832798/302f8f3b-73e0-40b3-82ce-d9997bfb0a88)\n\n# Dopamine UI\nAn aesthetic C# .NET Blazor component library that makes the UI seamless and entertaining to use.\n\n## Installation\n### NuGet Package\n#### .NET CLI\n```bash\ndotnet add package ChatAIze.DopamineUI\n```\n#### Package Manager Console\n```powershell\nInstall-Package ChatAIze.DopamineUI\n```\n### CSS\n#### App.razor File\n```html\n\u003chead\u003e\n  \u003c!-- ... --\u003e\n  \u003clink rel=\"stylesheet\" href=\"_content/ChatAIze.DopamineUI/css/tailwind.css\"\u003e\n  \u003c!-- ... --\u003e\n\u003c/head\u003e\n```\n\u003e [!NOTE]\n\u003e Dopamine UI is built with [Tailwind CSS](https://tailwindcss.com), however, you don't have to install, set up, or use Tailwind CSS by yourself. All styles are already pre-generated and included in the NuGet package.\n\n## Usage\nFor detailed examples, see our [preview](https://github.com/chataize/dopamine-ui/blob/main/preview/Components/Pages/Home.razor) app.\n### Table of Contents\n- [Button](#button)\n- [Text Field](#text-field)\n- [Text Area](#text-area)\n- [Toggle Switch](#toggle-switch)\n- [Checkbox](#checkbox)\n- [Radio Button](#radio-button)\n- [Divider](#divider)\n### Button\n#### Standard\n```cs\n\u003cDPButton Text=\"Sign In\" /\u003e\n```\n#### Full Width\n```cs\n\u003cDPButton Text=\"Sign In\" IsFullWidth=\"true\" /\u003e\n```\n#### Accent\n```cs\n\u003cDPButton Text=\"Create Account\" Style=\"ButtonStyle.Accent\" /\u003e\n```\n#### Destructive\n```cs\n\u003cDPButton Text=\"Delete Account\" Style=\"ButtonStyle.Destructive\" /\u003e\n```\n#### Loading\n```cs\n\u003cDPButton Text=\"Download\" IsLoading=\"true\" /\u003e\n```\n#### Disabled\n```cs\n\u003cDPButton Text=\"Upgrade\" IsDisabled=\"true\" /\u003e\n```\n### Text Field\n#### Unlabeled\n```cs\n\u003cDPTextField @bind-Value=\"Text\" /\u003e\n```\n#### Standard\n```cs\n \u003cDPTextField Label=\"Username\" @bind-Value=\"Text\" /\u003e\n```\n#### Email\n```cs\n \u003cDPTextField Label=\"Email\" Type=\"TextFieldType.Email\" @bind-Value=\"PropertyABC123\" /\u003e\n```\n#### Password\n```cs\n \u003cDPTextField Label=\"Password\" Type=\"TextFieldType.Password\" @bind-Value=\"PropertyABC123\" /\u003e\n```\n#### Full Width\n```cs\n \u003cDPTextField Label=\"Title\" IsFullWidth=\"true\" @bind-Value=\"PropertyABC123\" /\u003e\n```\n#### Loading\n```cs\n \u003cDPTextField Label=\"Display Name\" IsLoading=\"true\" @bind-Value=\"PropertyABC123\" /\u003e\n```\n#### Disabled\n```cs\n \u003cDPTextField Label=\"User ID\" IsDisabled=\"true\" @bind-Value=\"PropertyABC123\" /\u003e\n```\n### Text Area\n#### Unlabeled\n```cs\n\u003cDPTextArea @bind-Value=\"Text\" /\u003e\n```\n#### Standard\n```cs\n \u003cDPTextArea Label=\"Description\" @bind-Value=\"Text\" /\u003e\n```\n#### Full Width\n```cs\n \u003cDPTextArea Label=\"Description\" IsFullWidth=\"true\" @bind-Value=\"PropertyABC123\" /\u003e\n```\n#### Loading\n```cs\n \u003cDPTextArea Label=\"Description\" IsLoading=\"true\" @bind-Value=\"PropertyABC123\" /\u003e\n```\n#### Disabled\n```cs\n \u003cDPTextArea Label=\"Description\" IsDisabled=\"true\" @bind-Value=\"PropertyABC123\" /\u003e\n```\n### Toggle Switch\n#### Unlabeled\n```cs\n\u003cDPToggleSwitch @bind-value=\"PropertyABC123\" /\u003e\n```\n#### Standard\n```cs\n\u003cDPToggleSwitch Label=\"Airplane Mode\" @bind-value=\"PropertyABC123\" /\u003e\n```\n#### Full Width\n```cs\n\u003cDPToggleSwitch Label=\"Airplane Mode\" IsFullWidth=\"true\" @bind-value=\"PropertyABC123\" /\u003e\n```\n#### Framed\n```cs\n\u003cDPToggleSwitch Label=\"Airplane Mode\" IsFrameVisible=\"true\" @bind-value=\"PropertyABC123\" /\u003e\n```\n#### Disabled\n```cs\n\u003cDPToggleSwitch Label=\"Airplane Mode\" IsDisabled=\"true\" @bind-value=\"PropertyABC123\" /\u003e\n```\n### Checkbox\n#### Unlabeled\n```cs\n\u003cDPCheckBox @bind-value=\"PropertyABC123\" /\u003e\n```\n#### Standard\n```cs\n\u003cDPCheckBox Label=\"Remember Me\" @bind-value=\"PropertyABC123\" /\u003e\n```\n#### Full Width\n```cs\n\u003cDPCheckBox Label=\"Remember Me\" IsFullWidth=\"true\" @bind-value=\"PropertyABC123\" /\u003e\n```\n#### Framed\n```cs\n\u003cDPCheckBox Label=\"Remember Me\" IsFrameVisible=\"true\" @bind-value=\"PropertyABC123\" /\u003e\n```\n#### Disabled\n```cs\n\u003cDPCheckBox Label=\"Remember Me\" IsDisabled=\"true\" @bind-value=\"PropertyABC123\" /\u003e\n```\n### Radio Button\n#### Unlabeled\n```cs\n\u003cDPRadioButton @bind-value=\"PropertyABC123\" /\u003e\n```\n#### Standard\n```cs\n\u003cDPRadioButton Label=\"Option A\" @bind-value=\"PropertyABC123\" /\u003e\n```\n#### Full Width\n```cs\n\u003cDPRadioButton Label=\"Option B\" IsFullWidth=\"true\" @bind-value=\"PropertyABC123\" /\u003e\n```\n#### Framed\n```cs\n\u003cDPRadioButton Label=\"Option C\" IsFrameVisible=\"true\" @bind-value=\"PropertyABC123\" /\u003e\n```\n#### Disabled\n```cs\n\u003cDPRadioButton Label=\"Option D\" IsDisabled=\"true\" @bind-value=\"PropertyABC123\" /\u003e\n```\n### Divider\n```cs\n\u003cDPDivider /\u003e\n```\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fchataize%2Fdopamine-ui","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fchataize%2Fdopamine-ui","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fchataize%2Fdopamine-ui/lists"}