_variables.scss 2.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108
  1. @use 'sass:meta' as meta;
  2. $bootstrap-settings: (
  3. // Body
  4. body-color: #f1f1f1,
  5. font-family-base: "Nanum-Square-Neo-Regular",
  6. // Typography
  7. font-family-sans-serif: "Nanum-Square-Neo-Regular",
  8. font-size-base: 0.9rem,
  9. form-text-color: #9b9b9b,
  10. text-muted: #777,
  11. line-height-base: 1.6,
  12. link-color: #f1f1f1,
  13. link-hover-color: #b9b9b9,
  14. link-decoration: none,
  15. // Border
  16. border-color: #333,
  17. // Buttons / theme colors
  18. primary: #1c55fa,
  19. danger: #b00505,
  20. // Input
  21. input-bg: #161616,
  22. input-color: #b7b8ba,
  23. input-box-shadow: none,
  24. input-border-color: #4c4c4c,
  25. input-focus-box-shadow: none,
  26. input-focus-border-color: #519bce,
  27. input-focus-bg: #161616,
  28. // Select
  29. form-select-color: #f1f1f1,
  30. form-select-border-color: #4c4c4c,
  31. form-select-box-shadow: none,
  32. form-select-focus-border-color: #4c4c4c,
  33. form-select-focus-box-shadow: none,
  34. // Checkbox
  35. form-check-label-color: #b7b8ba,
  36. form-check-input-border: 1px solid #4c4c4c,
  37. form-check-input-checked-bg-color: #161616,
  38. form-check-input-checked-border-color: #4c4c4c,
  39. form-check-input-focus-border: #519bce,
  40. form-check-input-focus-box-shadow: none,
  41. // Table
  42. table-bg: transparent,
  43. table-color: #b1b1b1,
  44. table-border-color: #3f424b,
  45. table-caption-color: #333,
  46. table-hover-bg: #252525,
  47. table-hover-color: #f1f1f1,
  48. // Pagination
  49. pagination-bg: #000,
  50. pagination-border-color: #333,
  51. pagination-border-radius: 0,
  52. pagination-active-bg: #0f0f0f,
  53. pagination-active-color: #f1f1f1,
  54. pagination-active-border-color: #333,
  55. pagination-hover-bg: #0f0f0f,
  56. pagination-hover-color: #fff,
  57. pagination-hover-border-color: #333,
  58. pagination-disabled-bg: #282828,
  59. pagination-disabled-border-color: #333,
  60. pagination-focus-bg: #0f0f0f,
  61. pagination-focus-color: #f1f1f1,
  62. pagination-focus-box-shadow: none,
  63. // Modal
  64. modal-content-bg: #333,
  65. modal-content-color: #f1f1f1,
  66. modal-header-border-color: #3f3f3f,
  67. modal-header-border-width: 0 0 1px 0,
  68. modal-content-border-color: #3f3f3f,
  69. // Tabs
  70. nav-tabs-border-color: #2c2c2c,
  71. nav-tabs-border-radius: 0,
  72. nav-tabs-link-hover-border-color: #006989,
  73. nav-tabs-link-active-color: #c7c7c7,
  74. nav-tabs-link-active-bg: #003954,
  75. nav-tabs-link-active-border-color: #006989,
  76. // Navbar
  77. navbar-brand-margin-end: 0,
  78. navbar-toggler-border-radius: 2px,
  79. navbar-toggler-focus-width: 1.4px,
  80. navbar-light-color: #d6d6d6,
  81. // Card
  82. card-bg: transparent, // ← none 말고 transparent로!
  83. // Label
  84. form-label-color: #b7b8ba,
  85. // Dropdown
  86. dropdown-link-hover-color: #000,
  87. dropdown-link-hover-bg: #eee,
  88. dropdown-link-active-color: #000,
  89. dropdown-link-active-bg: #eee
  90. );
  91. @include meta.load-css('bootstrap/scss/bootstrap', $with: $bootstrap-settings);