Random Quotes : Pull for Inspiration

🛠️ Tech Stack

ភាសាសរសេរកូដ និង ឧបករណ៍

---

✨ Features

• ទាញខ្សែ ទទួលបាន Quote: ចុចប៊ូតុង Pull the cord ខ្សែទាញលាតចុះក្រោមរួចលោតត្រឡប់មកវិញ អំពូលភ្លឺពណ៌មាស ហើយបង្ហាញ Quote ចៃដន្យថ្មី
• 6 Categories: make, write, build, cook, start, quotes សរុប 60 ឃ្លា (10 ក្នុងមួយ Category) ជាភាសាអង់គ្លេសសុទ្ធ
• អំពូលមាន Animation: ញាប់ (charging) មុននឹងភ្លឺ មាន Glow ជុំវិញ និង Filament ភ្លឺពណ៌មាស
• បិទ / បើកភ្លើង: ចុចលើអំពូល ប៊ូតុង Power ជាប់នឹងអំពូល ឬដងទាញខ្សែ ដើម្បី Toggle ពេលបិទភ្លើង ប៊ូតុង Pull ត្រូវបិទដំណើរការ
• រចនាអំពូលព្យួរ: មានពិដាន ខ្សែរមួល Socket លោហៈកាន់អំពូល និងខ្សែទាញមានគ្រាប់ៗ (Beaded Chain) ព្រមទាំងដងទាញដែលប្តូរជាពណ៌មាសពេលភ្លើងភ្លឺ
• ប្រអប់ Quote: ឈ្មោះ Category នៅខាងលើ ប្រយោគនៅកណ្តាល ហើយពាក្យលេចឡើងម្តងមួយៗ (Fade-in)
• Spark Counter: រាប់ចំនួនដងដែលបានទាញក្នុង Session នេះ
• Responsive: ពេញលេញ គ្រប់ទំហំអេក្រង់ (Mobile / Tablet / Desktop) គាំទ្រ prefers-reduced-motion គ្មាន Build Step និងគ្មាន Dependencies

---

📁 Project Structure

Random-Quotes/
├── index.html      → រចនាសម្ព័ន្ធទំព័រ (ពិដាន, ខ្សែ, Socket, អំពូល, ប្រអប់ Quote)
├── style.css       → Theme, រចនាអំពូល និងខ្សែទាញ, Animation, Card, Responsive
├── script.js       → IDEAS data, CAT_LABELS, Logic ទាញ / Toggle
└── README.md

---

🔦 Pull Cord & Bulb

• ពេលចុច Pull the cord script.js ដាក់ Class charging (អំពូលញាប់ប្រហែល 0.65 វិនាទី) រួចប្តូរទៅ lit ហើយជ្រើស Category និងឃ្លាចៃដន្យពី IDEAS
• ប៊ូតុង Pull ត្រូវបិទដំណើរការក្នុងពេល Animation ដើម្បីការពារការចុចជាន់គ្នា
• ខ្សែទាញនិងដងទាញជា Element តែមួយ (#cord និង #pullRing) ដូច្នេះពេលខ្សែលាតវែង ដងទាញក៏ធ្លាក់តាមដែរ
• ចុចលើអំពូល ប៊ូតុង Power ឬដងទាញ ដើម្បីបិទ / បើកភ្លើង ពេលបិទភ្លើង ប្រអប់ Quote បង្ហាញសារ ហើយរង់ចាំការបើកវិញ

---

🚀 How to Run

1. Clone ឬ Download Repository:

   git clone <repo-url>

2. បើកឯកសារ index.html ដោយ Browser ណាមួយ (Chrome, Firefox...)

3. ចុចប៊ូតុង Pull the cord ដើម្បីទាញរក Quote ឬចុចលើអំពូលដើម្បីបិទ / បើកភ្លើង។

---

👤 Author

Built with ❤️ and code by Mr. Sieve E