React में CSS modules के लिए फाइलों में composes कमांड
composes कमांड को
एक फाइल से दूसरी फाइल में
स्टाइल्स का पुन: उपयोग करने के लिए भी लागू किया जा सकता है।
आइए buttons एप्लिकेशन पर वापस लौटते हैं,
जो हमने पिछले पाठों में बनाया था।
मान लीजिए कि हम सभी
बटनों में समान छाया, कर्सर शैली
और बोल्ड फ़ॉन्ट जोड़ना चाहते हैं। इन स्टाइल्स को
App.module.css फाइल में रखा जाएगा।
आइए इस फाइल को खोलें और
शुरुआत में beauty नामक एक नया क्लास जोड़ें
इन स्टाइल्स के साथ:
.beauty {
box-shadow: rgba(50, 50, 50, 0.2) 0 5px 5px 0;
font-weight: bold;
cursor: pointer;
}
आइए इसे बटनों को स्टाइलिश बनाने के लिए लागू करें।
इसके लिए Buttons.module.css खोलें और
common-btn क्लास में परिवर्तन करें।
हम composes कमांड के साथ एक पंक्ति जोड़ेंगे,
जिसमें हम beauty क्लास का नाम निर्दिष्ट करेंगे,
जिसे हम लागू करना चाहते हैं और App.module.css फाइल,
जिसमें यह क्लास स्थित है:
.common-btn {
composes: beauty from "../App.module.css";
font-size: 16px;
border-radius: 3px;
}
पिछले पाठ के कार्य से अपने एप्लिकेशन का कोड लें और इस पाठ में बताए गए तरीके का उपयोग करके अपने इनपुट में कोई छाया बनाएं।
