CSS वेरिएबल एक्सट्रैक्टर
एक स्टाइलशीट पेस्ट करें और हर --custom-property को प्रीफ़िक्स के अनुसार
समूहित करके निकालें, साथ ही डुप्लिकेट डेफ़िनिशन फ़्लैग की जाएंगी।
हर सिलेक्टर ब्लॉक को स्कैन करता है, न कि सिर्फ़ :root को। अलग-अलग सिलेक्टर में समान नाम लेकिन अलग वैल्यू होने पर उसे डुप्लिकेट के रूप में फ़्लैग किया जाता है।
समूहित वेरिएबल यहाँ दिखेंगे।
यह कैसे काम करता है
इनपुट को रूल ब्लॉक दर रूल ब्लॉक स्कैन किया जाता है (यानी selector { ... }
जोड़े मैच किए जाते हैं, नेस्टेड मीडिया क्वेरीज़ समेत), और हर ब्लॉक के अंदर मौजूद हर
--name: value; घोषणा को उसके संबंधित सिलेक्टर के साथ दर्ज किया जाता है।
वेरिएबल को प्रीफ़िक्स के अनुसार समूहित किया जाता है—यानी शुरुआती -- के बाद का
पहला हाइफ़न-सीमांकित हिस्सा—इसलिए --color-primary-500 और
--color-accent दोनों "color" के अंतर्गत आते हैं, जो ज़्यादातर डिज़ाइन-टोकन
नेमिंग कन्वेंशन की संरचना जैसा ही है। किसी नाम को डुप्लिकेट तभी फ़्लैग किया जाता है जब वह
कहीं और वाकई अलग वैल्यू के साथ घोषित हो, न कि सिर्फ़ किसी अलग सिलेक्टर के तहत उसी वैल्यू
के साथ दोबारा घोषित होने पर (यह थीम ओवरराइड का सामान्य पैटर्न है)।
सब कुछ इस पेज के जावास्क्रिप्ट में हर कीस्ट्रोक पर चलता है, पूरे CSS पार्सर की बजाय एक हल्के ब्रेस-मैचिंग स्कैनर का उपयोग करते हुए। आप जो भी पेस्ट करते हैं, वह अपलोड नहीं होता।
अक्सर पूछे जाने वाले सवाल
यह कौन-सी कस्टम प्रॉपर्टीज़ ढूंढता है?
किसी भी सिलेक्टर ब्लॉक के अंदर --name: value; फ़ॉर्म की कोई भी घोषणा, न कि सिर्फ़ :root के अंदर—नेस्टेड रूल्स और मीडिया क्वेरीज़ भी शामिल। हर बार यह भी दर्ज किया जाता है कि वह किस सिलेक्टर के तहत घोषित की गई थी।
डुप्लिकेट डिटेक्शन कैसे काम करता है?
अगर एक ही वेरिएबल नाम को अलग-अलग वैल्यू के साथ एक से ज़्यादा बार घोषित किया गया हो (जो अक्सर कॉपी-पेस्ट किए गए या असंगत टोकन का संकेत होता है), तो उसे फ़्लैग कर दिया जाता है। एक ही नाम को अलग-अलग स्कोप में समान वैल्यू के साथ घोषित करना (जैसे लाइट/डार्क थीम ओवरराइड) सामान्य बात है और इसे फ़्लैग नहीं किया जाता।
क्या मेरा CSS कहीं भेजा जाता है?
नहीं, पार्सिंग पूरी तरह आपके ब्राउज़र में एक छोटे जावास्क्रिप्ट स्कैनर से होती है। आप जो भी पेस्ट करते हैं, वह अपलोड नहीं होता।