business-theme.css 2.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778
  1. :root {
  2. --bex-page-bg: #121212;
  3. --bex-page-bg-welfare: #0e0e0e;
  4. --bex-text-primary: #ffffff;
  5. --bex-text-secondary: #888888;
  6. --bex-text-tertiary: #666666;
  7. --bex-border: #2c2c2c;
  8. --bex-border-soft: #1f1f1f;
  9. --bex-card-bg: #141414;
  10. --bex-card-bg-soft: rgba(255, 255, 255, 0.03);
  11. --bex-task-card-bg: rgba(255, 255, 255, 0.03);
  12. --bex-level-tabs-bg: rgba(255, 255, 255, 0.05);
  13. --bex-card-bg-strong: #1a1a1a;
  14. --bex-modal-bg: #1a1a1a;
  15. --bex-progress-bg: rgba(255, 255, 255, 0.1);
  16. --bex-reward-bg: #2b2b2b;
  17. --bex-brand: #fd6f23;
  18. --bex-brand-start: #f5a623;
  19. --bex-brand-end: #ff6b35;
  20. --bex-overlay-bg: rgba(0, 0, 0, 0.7);
  21. --bex-card-shadow: none;
  22. --bex-back-icon-color: #ffffff;
  23. --bex-card-bg-dark: #1F1F1F;
  24. }
  25. html.theme-light,
  26. body.theme-light,
  27. .container.theme-light {
  28. --bex-page-bg: #ffffff;
  29. --bex-page-bg-welfare: #ffffff;
  30. --bex-text-primary: #121212;
  31. --bex-text-secondary: #888888;
  32. --bex-text-tertiary: #888888;
  33. --bex-border: #e8e8e8;
  34. --bex-border-soft: #efefef;
  35. --bex-card-bg: #ffffff;
  36. --bex-card-bg-soft: rgba(255, 255, 255, 0.03);
  37. --bex-task-card-bg: #ffffff;
  38. --bex-level-tabs-bg: rgba(18, 18, 18, 0.03);
  39. --bex-card-bg-strong: #ffffff;
  40. --bex-modal-bg: #ffffff;
  41. --bex-progress-bg: #ebebeb;
  42. --bex-reward-bg: #ebebeb;
  43. --bex-overlay-bg: rgba(0, 0, 0, 0.7);
  44. --bex-card-shadow: 2px 2px 14px rgba(0, 0, 0, 0.08);
  45. --bex-brand-start: #fd6f23;
  46. --bex-brand-end: #fd6f23;
  47. --bex-back-icon-color: #121212;
  48. --bex-card-bg-dark: #F3F3F3;
  49. }
  50. html.theme-light,
  51. html.theme-light body {
  52. background: var(--bex-page-bg);
  53. color: var(--bex-text-primary);
  54. }
  55. html.theme-light .loading-overlay,
  56. html.theme-light .error-overlay {
  57. background: var(--bex-page-bg);
  58. background-color: var(--bex-page-bg);
  59. }
  60. html.theme-light .loading-content,
  61. html.theme-light .error-content,
  62. html.theme-light .modal-content {
  63. background: var(--bex-modal-bg);
  64. border-color: var(--bex-border);
  65. }
  66. html.theme-light .loading-spinner {
  67. border-top-color: var(--bex-brand);
  68. }
  69. html.theme-light .loading-text,
  70. html.theme-light .error-text {
  71. color: var(--bex-text-primary);
  72. }