style.scss 917 B

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051
  1. .sns-callback {
  2. display: flex;
  3. align-items: center;
  4. justify-content: center;
  5. min-height: 60vh;
  6. padding: 24px;
  7. &__panel {
  8. display: flex;
  9. flex-direction: column;
  10. align-items: center;
  11. gap: 12px;
  12. max-width: 420px;
  13. padding: 32px 28px;
  14. background: var(--bg-page);
  15. border: 1px solid var(--border-default);
  16. border-radius: 12px;
  17. box-shadow: 0 4px 16px var(--shadow-color);
  18. text-align: center;
  19. }
  20. &__spinner {
  21. width: 36px;
  22. height: 36px;
  23. border: 3px solid var(--border-default);
  24. border-top-color: var(--color-accent);
  25. border-radius: 50%;
  26. animation: sns-callback-spin 0.8s linear infinite;
  27. margin-bottom: 4px;
  28. }
  29. &__title {
  30. font-size: 1rem;
  31. font-weight: 700;
  32. color: var(--text-primary);
  33. margin: 0;
  34. }
  35. &__desc {
  36. font-size: 0.875rem;
  37. color: var(--text-muted);
  38. margin: 0;
  39. line-height: 1.5;
  40. }
  41. }
  42. @keyframes sns-callback-spin {
  43. to {
  44. transform: rotate(360deg);
  45. }
  46. }