כפתור בשליחה

aria-busy ו-disabled יחד: הכפתור מודיע שהוא עסוק וגם מונע לחיצה כפולה. זה החלק שנשכח הכי הרבה. כפתור בשליחה הוא מחוון טעינה מתוך טעינה והמתנה של כליקס. מה שמורידים הוא קטע HTML ו-CSS בלי תמונות ובלי GIF. אין ספרייה חיצונית, אין שלב בנייה, ואם כליקס ייעלם מחר הקוד ימשיך לעבוד.

מחוון טעינה · כפתור · טעינה

.klix-btn-loading { display: inline-flex; align-items: center; gap: .55rem;
  font: inherit; font-weight: 700; padding: .7rem 1.3rem; border: 0; border-radius: .8rem;
  background: #4338ca; color: #fff; cursor: progress }
.klix-btn-loading::before { content: ""; width: 1rem; height: 1rem; border-radius: 50%;
  border: 2px solid rgba(255,255,255,.35); border-top-color: #fff;
  animation: klix-spin-l .8s linear infinite }
@keyframes klix-spin-l { to { transform: rotate(360deg) } }