WebOrbiton
v3.0.0.0

FlatlyPage

← Changes All versions
54 lines · 1.0 KB
  1. .btn-translate {
  2. background: none;
  3. border: none;
  4. cursor: pointer;
  5. padding: 4px;
  6. margin-left: 8px;
  7. opacity: 0.5;
  8. transition: opacity 0.2s, transform 0.2s;
  9. display: inline-flex;
  10. align-items: center;
  11. justify-content: center;
  12. vertical-align: middle;
  13. }
  15. .btn-translate:hover {
  16. opacity: 1;
  17. transform: scale(1.1);
  18. }
  20. .btn-translate svg {
  21. color: var(--primary);
  22. }
  24. .btn-translate:disabled {
  25. opacity: 0.3;
  26. cursor: not-allowed;
  27. }
  29. .form-label {
  30. display: flex;
  31. align-items: center;
  32. justify-content: space-between;
  33. }
  35. .translating {
  36. opacity: 0.6;
  37. pointer-events: none;
  38. position: relative;
  39. }
  41. .btn-translate.translating::after {
  42. content: '';
  43. position: absolute;
  44. width: 12px;
  45. height: 12px;
  46. border: 2px solid var(--border);
  47. border-top-color: var(--primary);
  48. border-radius: 50%;
  49. animation: spin 0.8s linear infinite;
  50. }
  52. @keyframes spin {
  53. to { transform: rotate(360deg); }
  54. }