{"id":20797181,"url":"https://github.com/daniguardiola/tailwindcss-if","last_synced_at":"2026-04-25T01:33:43.228Z","repository":{"id":216378846,"uuid":"741181620","full_name":"DaniGuardiola/tailwindcss-if","owner":"DaniGuardiola","description":null,"archived":false,"fork":false,"pushed_at":"2024-01-19T00:41:57.000Z","size":116,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":2,"default_branch":"main","last_synced_at":"2025-01-18T11:42:15.006Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"TypeScript","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/DaniGuardiola.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":"2024-01-09T21:35:02.000Z","updated_at":"2024-01-09T21:35:09.000Z","dependencies_parsed_at":"2024-11-17T16:36:32.957Z","dependency_job_id":"3f3695eb-4a4d-48b3-9be1-20aa8d761886","html_url":"https://github.com/DaniGuardiola/tailwindcss-if","commit_stats":null,"previous_names":["daniguardiola/tailwindcss-if"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/DaniGuardiola%2Ftailwindcss-if","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/DaniGuardiola%2Ftailwindcss-if/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/DaniGuardiola%2Ftailwindcss-if/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/DaniGuardiola%2Ftailwindcss-if/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/DaniGuardiola","download_url":"https://codeload.github.com/DaniGuardiola/tailwindcss-if/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":243141243,"owners_count":20242817,"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":"2024-11-17T16:32:53.045Z","updated_at":"2025-12-26T02:16:05.081Z","avatar_url":"https://github.com/DaniGuardiola.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"A Tailwind CSS plugin that lets you use \"conditions\" as variants.\n\nFor example, in a desktop app (e.g. Electron), you might want to have different styles\ndepending on the platform. Using this plugin, you can do the following:\n\n1. Expose the value of the conditions in a parent DOM element, like `\u003chtml\u003e` or the body.\n   It is important that all values are set in the same element. Values can be set as classes\n   (e.g. `.platform-linux`), attributes (e.g. `[data-platform=\"linux\"]`), or anything else\n   that could be targeted with a CSS selector.\n\n2. Use the plugin in your Tailwind CSS config, and pass it the `conditions` option, which\n   is a map of condition names to selectors. For example, you can set a property `\"win\"` with\n   a value of `\".platform-windows\"`. This will make add the `win:` and `not-win:` variants,\n   as well as making the condition available in `if-[]:` variant expressions, for example\n   `if-[win|mac]:`.\n\n3. Use the variants! Some examples:\n   - Hide something on Windows: `win:hidden`.\n   - Hide something for all platforms except Linux: `not-linux:hidden`.\n   - Make something bold on macOS and Windows: `if-[mac|win]:font-bold`.\n\nThe `if-[]:` variant supports:\n\n- Negation: `if-[!win]:`.\n- Conjunction (\"and\"): `if-[win\u0026mac]:`.\n- Disjunction (\"or\"): `if-[win|mac]:`.\n- Parentheses for grouping: `if-[win|(mac\u0026!linux)]:`.\n- Any combination of the above, for any number of conditions and levels of nesting.\n\nThe operator precedence is left-to-right by default, but you can use parentheses to\noverride it.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdaniguardiola%2Ftailwindcss-if","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fdaniguardiola%2Ftailwindcss-if","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdaniguardiola%2Ftailwindcss-if/lists"}