Command Palette

Search for a command to run...

Foundations

State Matrix

நிலைகளின் அணி

Every interactive component in TamilDS uses a standard set of states to communicate visual affordances and interactive status. The states are mapped to semantic overlay values and keyboard focus structures.

பயனர்கள் உறுப்புகளுடன் தொடர்பு கொள்ளும்போது அவற்றின் மாறும் நிலைகளை விளக்கும் வழிகாட்டி.

நிலைகளின் அணி மாதிரி

ஒவ்வொரு இடைமுகக் கூறும் பயனரின் பல்வேறு வகையான தொடர்புகளுக்கு ஏற்ப எவ்வாறு மாறுகிறது என்பதைக் கீழே உள்ள அட்டவணை மூலம் சோதிக்கவும்.

நிலைகளின் அணி விளக்கப்படம் (State Matrix Visualizer)

அணுகல் மற்றும் பயனர் தொடர்பின் போது ஒவ்வொரு கூறும் அடையும் வடிவ மாற்றங்களின் முழுப் பட்டியல்.

மேல்வைப்பு8% overlay
பொத்தான்
உள்ளீடு
சில்லு
மேல்வைப்பு
குவியம்12% overlay
பொத்தான்
உள்ளீடு
சில்லு
குவியம்
அழுத்தப்பட்டது12% overlay
பொத்தான்
உள்ளீடு
சில்லு
அழுத்தப்பட்டது
நகர்த்தல்16% overlay
பொத்தான்
உள்ளீடு
சில்லு
நகர்த்தல்
முடக்கப்பட்டது50% opacity
பொத்தான்
உள்ளீடு
சில்லு
முடக்கப்பட்டது
பிழைBorder / Text
பொத்தான்
உள்ளீடு
சில்லு
பிழை
நேரடி சோதனைக்களம் (Playground)

கீழே உள்ள கூறுகளைத் தொட்டு, நகர்த்தி அல்லது தட்டச்சு செய்து இயற்கையான இடைமுக நிலைகளைக் கண்காணிக்கவும்.

பொத்தான்
உள்ளீடு
நகர்த்தல் அட்டை
அழுத்தி நகர்த்தவும்

நிலை மாற்றங்களின் விதிகள்

தமிழ் வடிவமைப்பு அமைப்பில் (TamilDS), ஒவ்வொரு நிலையும் துல்லியமான வண்ணக் கலவை மற்றும் ஒளி ஊடுருவல் (Opacity) மூலம் ஒழுங்குபடுத்தப்படுகிறது.

  • மேல்வைப்பு - Hover (8% ஒளி ஊடுருவல்): சுட்டி (Mouse pointer) ஒரு கூறின் மேல் செல்லும்போது உடனடியாகத் தூண்டப்படும்.
  • விசைப்பலகைக் குவியம் - Focus (12% ஒளி ஊடுருவல்): விசைப்பலகை வழிசெலுத்தல் மூலம் குவியம் பெறும்போது, குவிய வளையம் (ring-2 ring-ring ring-offset-2) மூலம் காட்டப்படும்.
  • அழுத்தப்பட்ட நிலை - Pressed (12% ஒளி ஊடுருவல்): பொத்தானைக் கிளிக் செய்யும்போது, பொத்தான் சற்று சுருங்கி (scale-95) இயற்பியல் பொத்தானை அழுத்துவது போலக் காட்சியளிக்கும்.
  • நகர்த்தப்பட்ட நிலை - Dragged (16% ஒளி ஊடுருவல்): ஒரு கூறை நகர்த்தும்போது, அது சற்றுப் பெரிதாகி (scale-105) நிழல் வடிவத்தைப் (shadow-lg) பெறும்.
  • முடக்கப்பட்ட நிலை - Disabled (50% ஒளி ஊடுருவல்): தொடர்புகள் தடுக்கப்பட்டு மங்கலாகக் காட்சியளிக்கும்.
  • பிழை நிலை - Error: விதிகளுக்கு மாறான செயல்பாடுகள் அல்லது சரிபார்த்தல் தோல்வியடையும் போது எச்சரிக்கையை உணர்த்த சிவப்பு நிற எல்லையாக மாறும்.