इस प्रोजेक्ट के बारे में

Panda आधुनिक वेब डेवलपमेंट के लिए एक स्टाइलिंग समाधान है, जिसे यूनिवर्सल, टाइप-सेफ और स्केलेबल CSS-in-JS के रूप में वर्णित किया गया है। यह बिल्ड टाइम पर काम करता है, जो स्टाइल ऑब्जेक्ट्स या स्टाइल प्रॉप्स को CSS में निकालता है। इसकी मुख्य विशेषताओं में शामिल हैं: स्टाइल ऑब्जेक्ट्स या स्टाइल प्रॉप्स लिखना जिन्हें बिल्ड टाइम पर निकाला जाता है; @layer और CSS वेरिएबल्स का उपयोग करके आधुनिक CSS आउटपुट; अधिकांश JavaScript फ्रेमवर्क के साथ अनुकूलता; Stitches के समान recipes और variants; एक साथ कई थीम्स के लिए हाई-लेवल डिज़ाइन टोकन; और codegen के माध्यम से ऑटो-कम्प्लीट के साथ टाइप-सेफ स्टाइल। इंस्टॉलेशन npm के माध्यम से है: npm i -D @pandacss/dev, फिर कॉन्फ़िग और postcss को स्कैफोल्ड करने के लिए npx panda init -p। एंट्री CSS फ़ाइल में @layer reset, base, tokens, recipes, utilities होना चाहिए; और इसे ऐप में इम्पोर्ट किया जाना चाहिए। उपयोग का उदाहरण: import { css } from '../styled-system/css'; import { stack, vstack, hstack } from '../styled-system/patterns'; फिर hstack({ gap: '30px', color: 'pink.300' }) या css({ fontSize: 'lg', color: 'red.400' }) जैसे क्लास नामों का उपयोग करें। मोनोरेपो में cli, core, config, extractor, generator, parser, is-valid-prop, node, token-dictionary और shared जैसे पैकेज शामिल हैं। यह प्रोजेक्ट panda-css.com पर दस्तावेज़ीकरण, एक StackBlitz प्लेग्राउंड, एक योगदान गाइड और एक Discord समुदाय प्रदान करता है। यह MIT लाइसेंस के तहत है। README में Chakra UI, Vanilla Extract, Stitches, Tailwind CSS, Class Variance Authority, Styled System, Linaria, Uno CSS और Goober से प्रेरणा का उल्लेख है।