Foundations
Token Mapping
வடிவமைப்பு விகுதிகள்
TamilDS architecture maps semantic design variables to Tailwind v4 custom utilities. These mappings maintain layout consistency and allow global styling adjustments.
தமிழ் வடிவமைப்பு அமைப்பின் விகுதிகள் மற்றும் இடைவெளி அளவீடுகளை விளக்கும் முழுமையான வழிகாட்டி.
வடிவமைப்பு விகுதிகளின் கட்டமைப்பு
அமைப்பின் விகுதிகள் என்பவை வடிவமைப்பு விதிகளின் அடித்தளங்களாகும். இவை நிறங்கள், இடைவெளிகள், வளைவுகள் மற்றும் நிழல்களுக்கு ஒரே மாதிரியான தன்மையை உறுதி செய்கின்றன.
வளைவு ஆரங்கள் (sys.radius.*)
பட்டன்கள், உள்ளீட்டுப் பெட்டிகள் மற்றும் அட்டைகள் ஆகியவற்றிற்கு அவற்றின் முக்கியத்துவத்தைப் பொறுத்து வெவ்வேறு வளைவுகள் வழங்கப்படுகின்றன.
| விகுதி சாவியெழுத்து (Key) | அளவீடு (Pixels) | Tailwind விகுதி | வழக்கமான பயன்பாடு |
|---|---|---|---|
| sys.radius.sm | 0.375rem (6px) | rounded-sm | பொத்தான்கள், எளிய உள்ளீட்டு பெட்டிகள், அடையாள சின்னங்கள் |
| sys.radius.md | 0.5rem (8px) | rounded-md | நிலையான அட்டைகள், கீழ்தொங்கு மெனுக்கள், எச்சரிக்கை பலகைகள் |
| sys.radius.lg | 0.75rem (12px) | rounded-lg | மாடல்கள் (Modals), மிதக்கும் திரைகள் |
| sys.radius.xl | 1rem (16px) | rounded-xl | விளம்பர பலகைகள், முகப்பு பக்கத்தின் பெரிய தொகுதிகள் |
| sys.radius.full | 9999px | rounded-full | வட்ட வடிவிலான தேர்வுகள், நிலைக் குறிகள், வட்டப் படங்கள் |
உயரம் மற்றும் நிழல்கள் (sys.elevation.*)
அமைப்பில் உள்ள பல்வேறு அடுக்குகளின் உயர வேறுபாடுகளைக் காட்டும் நிழல் விகுதிகள்.
| அடுக்கு | விகுதி சாவியெழுத்து (Key) | நிழல் விகுதி | எல்லை உதவி | பயன்பாடு |
|---|---|---|---|---|
| நிலை 0 | sys.elevation.level0 | shadow-none | border border-border | எல்லைகள் கொண்ட எளிய உள்ளீட்டு பெட்டிகள் |
| நிலை 1 | sys.elevation.level1 | shadow-xs | border border-border/60 | சிறு அட்டைகள், சுட்டியால் அழுத்தக்கூடிய விவரங்கள் |
| நிலை 2 | sys.elevation.level2 | shadow-sm | border border-border/40 | கீழ்தொங்கு மெனுக்கள், உள்ளடக்க வடிகட்டிகள் |
| நிலை 3 | sys.elevation.level3 | shadow-md | none | நிலையான பக்கவாட்டு பலகைகள், மிதக்கும் தலைப்புகள் |
| நிலை 4 | sys.elevation.level4 | shadow-lg | none | மாடல்கள் (Modals), எச்சரிக்கை உரையாடல்கள் |