colors.css 1.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869
  1. :root{
  2. --btn-bg-color: #479FF8;
  3. --btn-txt-color: white;
  4. --btn-hover-color: #0a58ca;
  5. --pills-bg-color: #0d6efd;
  6. --pills-txt-color: white;
  7. --links-txt-color: #0d6efd;
  8. --links-hover-color: #0a58ca;
  9. --btn-success: #198754;
  10. --btn-success-txt: white;
  11. --btn-success-hover:#10683f;
  12. --btn-danger: #dc3545;
  13. --btn-danger-txt: white;
  14. --btn-danger-hover:#821e27;
  15. }
  16. .btn-primary, .btn-outline-primary{
  17. background-color: var(--btn-bg-color);
  18. color: var(--btn-txt-color);
  19. border-color: var(--btn-bg-color);
  20. }
  21. .btn-primary:hover, .btn-outline-primary:hover{
  22. background-color: var(--btn-hover-color);
  23. border-color: var(--btn-hover-color);
  24. }
  25. .nav-pills .nav-link.active, .nav-pills .show>.nav-link{
  26. background-color: var(--pills-bg-color);
  27. color: var(--pills-txt-color);
  28. }
  29. a{
  30. color: var(--links-txt-color);
  31. }
  32. a:hover{
  33. color:var(--links-hover-color)
  34. }
  35. .nav-link{
  36. color: var(--links-txt-color)
  37. }
  38. .nav-link:hover{
  39. color:var(--links-hover-color)
  40. }
  41. .btn-success, .btn-outline-success{
  42. color: var(--btn-txt-color);
  43. background-color: var(--btn-success);
  44. border-color: var(--btn-success);
  45. }
  46. .btn-success:hover, .btn-outline-success:hover{
  47. background-color: var(--btn-success-hover);
  48. border-color: var(--btn-success-hover);
  49. }
  50. .btn-danger, .btn-outline-danger{
  51. color: var(--btn-danger-txt);
  52. background-color: var(--btn-danger);
  53. border-color: var(--btn-danger);
  54. }
  55. .btn-danger:hover, .btn-outline-danger:hover{
  56. background-color: var(--btn-danger-hover);
  57. border-color: var(--btn-danger-hover);
  58. }