{"_id":"@andrew_xie/tailwind-dark-theme","_rev":"4-962d208eeb63e9150719ec80abc325e0","name":"@andrew_xie/tailwind-dark-theme","dist-tags":{"latest":"1.0.5"},"versions":{"1.0.0":{"name":"@andrew_xie/tailwind-dark-theme","version":"1.0.0","description":"A plugin for tailwind CSS that helps you build dark theme","main":"src/main.ts","scripts":{"test":"jest","build":"tsc","publish":"npm publish --access public"},"keywords":[],"author":"","license":"ISC","dependencies":{"tailwindcss":"^3.3.3"},"devDependencies":{"@babel/core":"^7.22.10","@babel/preset-env":"^7.22.10","@babel/preset-typescript":"^7.22.5","@jest/globals":"^29.6.2","babel-jest":"^29.6.2","jest":"^29.6.2","ts-node":"^10.9.1","typescript":"^5.1.6"},"_id":"@andrew_xie/tailwind-dark-theme@1.0.0","gitHead":"42c845989dfed13dd61e478ae72522e4aec2d9a0","_nodeVersion":"20.5.0","_npmVersion":"9.8.0","dist":{"integrity":"sha512-kkPOerQGn8YkJ/quXLPfg7TQrn+3DY79JhEIdl987xT6MYSgbCQsqIg6ovTx9foTFT4vm5SfPeNxN4gmI/oIpw==","shasum":"3f91a7dea5cd84d6222a21ea17fb8e0bce1e652d","tarball":"https://registry.npmjs.org/@andrew_xie/tailwind-dark-theme/-/tailwind-dark-theme-1.0.0.tgz","fileCount":9,"unpackedSize":12615,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQC6x9o6IzfMRsI/KOFQrKLHNSbmA3qA1Ew+nOYvnFKP2AIhAPmh9hzECx95L7FaN1mGr9wmmoTblGDmael8nxlk3Sq+"}]},"_npmUser":{"name":"andrew_xie","email":"xie5997231@gmail.com"},"directories":{},"maintainers":[{"name":"andrew_xie","email":"xie5997231@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/tailwind-dark-theme_1.0.0_1691764553380_0.5497416950213949"},"_hasShrinkwrap":false},"1.0.1":{"name":"@andrew_xie/tailwind-dark-theme","version":"1.0.1","description":"A plugin for tailwind CSS that helps you build dark theme","main":"src/main.ts","scripts":{"test":"jest","build":"tsc","publish":"npm publish --access public"},"keywords":[],"author":"","license":"ISC","dependencies":{"tailwindcss":"^3.3.3"},"devDependencies":{"@babel/core":"^7.22.10","@babel/preset-env":"^7.22.10","@babel/preset-typescript":"^7.22.5","@jest/globals":"^29.6.2","babel-jest":"^29.6.2","jest":"^29.6.2","ts-node":"^10.9.1","typescript":"^5.1.6"},"_id":"@andrew_xie/tailwind-dark-theme@1.0.1","gitHead":"41b632c605fc61f66b6d13674eb651eb199fb6ca","_nodeVersion":"20.5.0","_npmVersion":"9.8.0","dist":{"integrity":"sha512-RlJqmOLkfMzaybhiS4H+vHRvq4UhjIOZudhBMHCrwln3KyzzIhau96jHvrfbVWQaRJz+Mi6y+pXPMfXWIFQJ4Q==","shasum":"a96a0442b63fbfbbb0401f2127998164838e6eba","tarball":"https://registry.npmjs.org/@andrew_xie/tailwind-dark-theme/-/tailwind-dark-theme-1.0.1.tgz","fileCount":9,"unpackedSize":14391,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCID2YAAd0+hPjEDQ0GctzJnIaxq2gAjxugrJXLCngNBZIAiBjoLF1CiaaX85z+VlO4m9JHQceLliCMyNr7/x7S9IwZg=="}]},"_npmUser":{"name":"andrew_xie","email":"xie5997231@gmail.com"},"directories":{},"maintainers":[{"name":"andrew_xie","email":"xie5997231@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/tailwind-dark-theme_1.0.1_1691767269209_0.6667489672088212"},"_hasShrinkwrap":false},"1.0.2":{"name":"@andrew_xie/tailwind-dark-theme","version":"1.0.2","description":"A plugin for tailwind CSS that helps you build dark theme","main":"src/main.ts","scripts":{"test":"jest","build":"tsc","publish":"npm publish --access public"},"keywords":["tailwind","dark","theme","css","variable"],"author":{"name":"Andrew Xie Yanghao"},"repository":{"type":"git","url":"git+https://github.com/scv057/TailwindCSS-dark-theme.git"},"license":"MIT","dependencies":{"tailwindcss":"^3.3.3"},"devDependencies":{"@babel/core":"^7.22.10","@babel/preset-env":"^7.22.10","@babel/preset-typescript":"^7.22.5","@jest/globals":"^29.6.2","babel-jest":"^29.6.2","jest":"^29.6.2","ts-node":"^10.9.1","typescript":"^5.1.6"},"bugs":{"url":"https://github.com/scv057/TailwindCSS-dark-theme/issues"},"homepage":"https://github.com/scv057/TailwindCSS-dark-theme#readme","directories":{"doc":"doc"},"_id":"@andrew_xie/tailwind-dark-theme@1.0.2","gitHead":"254a039807be6722cf00d195a2369972ba062cb2","_nodeVersion":"20.5.0","_npmVersion":"9.8.0","dist":{"integrity":"sha512-hXNSuAGI62FzVkVKVy6Na2278GiaK37XFrWlxsgJoMS4cSMAQ1sUzM/X0I9fQL/gPBjH4Cwl4PikUqIwg5ZrRw==","shasum":"b4394d8cf3497c9a82633b0a4ae50f280ae3c1df","tarball":"https://registry.npmjs.org/@andrew_xie/tailwind-dark-theme/-/tailwind-dark-theme-1.0.2.tgz","fileCount":10,"unpackedSize":17698,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCyAwSaRfZ/UTH9SFvLU+ii7m+0Load1pDcK+7V3bUk9AIhAOOYHFdS0wiO7gGx0ycVFwzbXBKjtugjaVL81Rk+RKe0"}]},"_npmUser":{"name":"andrew_xie","email":"xie5997231@gmail.com"},"maintainers":[{"name":"andrew_xie","email":"xie5997231@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/tailwind-dark-theme_1.0.2_1691828185331_0.19840343869980792"},"_hasShrinkwrap":false},"1.0.4":{"name":"@andrew_xie/tailwind-dark-theme","version":"1.0.4","description":"A plugin for tailwind CSS that helps you build dark theme","main":"src/main.ts","scripts":{"test":"jest","build":"tsc","publish":"npm publish --access public"},"keywords":["tailwind","dark","theme","css","variable"],"author":{"name":"Andrew Xie Yanghao"},"repository":{"type":"git","url":"git+https://github.com/scv057/TailwindCSS-dark-theme.git"},"license":"MIT","dependencies":{"tailwindcss":"^3.3.3"},"devDependencies":{"@babel/core":"^7.22.10","@babel/preset-env":"^7.22.10","@babel/preset-typescript":"^7.22.5","@jest/globals":"^29.6.2","babel-jest":"^29.6.2","jest":"^29.6.2","ts-node":"^10.9.1","typescript":"^5.1.6"},"bugs":{"url":"https://github.com/scv057/TailwindCSS-dark-theme/issues"},"homepage":"https://github.com/scv057/TailwindCSS-dark-theme#readme","directories":{"doc":"doc"},"gitHead":"d0dd7e8e7c8692a7797c5484d8a61eff2cdc087c","_id":"@andrew_xie/tailwind-dark-theme@1.0.4","_nodeVersion":"16.20.1","_npmVersion":"8.19.4","dist":{"integrity":"sha512-zKxTk1llhA3gWJaqu1e7EN88XCisSCJb1tca5K1tPovHW1tUQwdF5l9T7IiYahrNiLH9iXOd4NL6/lh0SW2a3A==","shasum":"b3ae5c0ad5d0f1664d49ad89a358b4d76f890604","tarball":"https://registry.npmjs.org/@andrew_xie/tailwind-dark-theme/-/tailwind-dark-theme-1.0.4.tgz","fileCount":10,"unpackedSize":18199,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDC9VhMNY3vxCJDvMILX3Thok3q8T3hofTNALc4yvea1gIhAPzu+74dFBVT1AhiVLaF9xZRwOY8rlQLfqdKkm4ZXqlv"}]},"_npmUser":{"name":"andrew_xie","email":"xie5997231@gmail.com"},"maintainers":[{"name":"andrew_xie","email":"xie5997231@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/tailwind-dark-theme_1.0.4_1691831980415_0.25942818353051744"},"_hasShrinkwrap":false},"1.0.5":{"name":"@andrew_xie/tailwind-dark-theme","version":"1.0.5","description":"A plugin for tailwind CSS that helps you build dark theme","main":"src/main.ts","scripts":{"test":"jest","build":"tsc","publish":"npm publish --access public"},"keywords":["tailwind","dark","theme","css","variable"],"author":{"name":"Andrew Xie Yanghao"},"repository":{"type":"git","url":"git+https://github.com/scv057/TailwindCSS-dark-theme.git"},"license":"MIT","dependencies":{"tailwindcss":"^3.3.3"},"devDependencies":{"@babel/core":"^7.22.10","@babel/preset-env":"^7.22.10","@babel/preset-typescript":"^7.22.5","@jest/globals":"^29.6.2","babel-jest":"^29.6.2","jest":"^29.6.2","ts-node":"^10.9.1","typescript":"^5.1.6"},"bugs":{"url":"https://github.com/scv057/TailwindCSS-dark-theme/issues"},"homepage":"https://github.com/scv057/TailwindCSS-dark-theme#readme","directories":{"doc":"doc"},"gitHead":"32d44f72174e5afd2e55617bd88801737934a675","_id":"@andrew_xie/tailwind-dark-theme@1.0.5","_nodeVersion":"16.20.1","_npmVersion":"8.19.4","dist":{"integrity":"sha512-LoNmZIb3NqnLB/OTbyvgc1rPf5z3t3rbw3tQBO19DmZCx1RVvAE6rJ30xA4Lwm6sOi7y0CdOocBFcVfkT9Ifqg==","shasum":"d8680a9bb30f1746180a7ed8b19fbd9f18454bed","tarball":"https://registry.npmjs.org/@andrew_xie/tailwind-dark-theme/-/tailwind-dark-theme-1.0.5.tgz","fileCount":10,"unpackedSize":19958,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIBbYndf5VFWEB5Lp6i+LQTTzDMvd4Ok1JfkI1jLv27mOAiAjkbQsT3gImGNXbEF6I98Omx7ZtObux0dOA2y5gKNX1A=="}]},"_npmUser":{"name":"andrew_xie","email":"xie5997231@gmail.com"},"maintainers":[{"name":"andrew_xie","email":"xie5997231@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/tailwind-dark-theme_1.0.5_1691870376230_0.06494808463652535"},"_hasShrinkwrap":false}},"time":{"created":"2023-08-11T14:35:53.258Z","1.0.0":"2023-08-11T14:35:53.556Z","modified":"2023-08-12T19:59:36.636Z","1.0.1":"2023-08-11T15:21:09.436Z","1.0.2":"2023-08-12T08:16:25.488Z","1.0.4":"2023-08-12T09:19:40.616Z","1.0.5":"2023-08-12T19:59:36.429Z"},"maintainers":[{"name":"andrew_xie","email":"xie5997231@gmail.com"}],"description":"A plugin for tailwind CSS that helps you build dark theme","keywords":["tailwind","dark","theme","css","variable"],"license":"MIT","readme":"# Tailwind Dark Theme\n\n\nA Tailwind CSS plugin designed to assist you in swiftly creating your own dark theme. The underlying technique is \nquite straightforward: convert your tokens into CSS variables and apply them to two classes each paired color has same variable names.\n\n---\n\n### Installation\n\ninstall the plugin from npm:\n\n```shell\nnpm i @andrew_xie/tailwind-dark-theme\n```\n---\n\n### docs\n\n[doc_zh](https://github.com/scv057/TailwindCSS-dark-theme/blob/main/doc/README_zh.md)\n\n---\n\n### Usage\n\n```javascript\nimport themePlugin, {registerThemeVariant} from '@andrew_xie/tailwind-dark-theme';\n\n// your own design tokens\nconst tokens = {\n  \"light-font-color\": \"black\",\n  \"light-background-color\": \"white\",\n  \"light-shine-color\": \"black\",\n  \"light-shine-color-rgb\": \"0, 0, 0\",\n  \"light-lamp-color\": \"black\",\n  \"light-link-color\": \"#4e1e86\",\n  \"light-primary-color\": \"#bd93f9\",\n  \"light-secondary-color\": \"#9547b7\",\n  \"light-background-color-1\": \"white\",\n  \"light-background-color-2\": \"#bd93f917\",\n  \"dark-font-color\": \"white\",\n  \"dark-background-color\": \"#0e0027\",\n  \"dark-shine-color\": \"#5fb0f7\",\n  \"dark-shine-color-rgb\": \"95, 176, 247\",\n  \"dark-lamp-color\": \"white\",\n  \"dark-link-color\": \"#7651ff\",\n  \"dark-primary-color\": \"#bd93f9\",\n  \"dark-secondary-color\": \"#9547b7\",\n  \"dark-background-color-1\": \"white\",\n  \"dark-background-color-2\": \"#bd93f917\",\n};\n\n/**\n * @param tokens: Object\n * @return [cssVariable, themeExtend]\n * @description convert your token to valid CSSrule Object and tailwind theme config object\n */\nfunction tokenSplit(tokens) {\n  // ...\n}\n\n// add yourown theme variant and use it like `dark:`\nregisterThemeVariant('light');\n\nmodule.exports = {\n  darkMode: 'class',\n  plugins: [\n    themePlugin(tokens, tokenSplit || \"DEFAULT\"),\n  ],\n}\n```\n\n```css\n@tailwind base;\n@tailwind components;\n@tailwind utilities;\n\n@layer utilities {\n    .link {\n        color: var(--link-color);\n    }\n}\n```\n\nin HTML\n\n```tsx\n\nconst Demo = () => {\n  const [ theme, setTheme ] = useState('light');\n\n  //  add tailwind class name\n  return <body class={ `${ theme }` }>\n  <div class={ \"link\" }>\n    wrapped in utilities\n  </div>\n  <div class={ \"text-link-color\" }>\n    directly using\n  </div>\n  <div class={\"light:text-red\"}>\n    you may want use theme-variant to control style in some situations, you can add your own theme-variant  \n  </div>\n  <button onclick={ setTheme('dark') }>theme</button>\n  </body>\n};\n```\n\n### Configuration\n\n---\n todo\n\n### End\n\nIf you have any questions feel, free to open an issue.","readmeFilename":"README.md","homepage":"https://github.com/scv057/TailwindCSS-dark-theme#readme","repository":{"type":"git","url":"git+https://github.com/scv057/TailwindCSS-dark-theme.git"},"author":{"name":"Andrew Xie Yanghao"},"bugs":{"url":"https://github.com/scv057/TailwindCSS-dark-theme/issues"}}