dcat-app.scss 3.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188
  1. // ================================================================================================
  2. // File Name: dcat-bootstrap.scss
  3. // Description: Dcat Admin应用样式
  4. // ----------------------------------------------------------------------------------------------
  5. // Item name: Dcat Admin
  6. // Author: Jqh
  7. // Author URL: https://github.com/jqhph
  8. // ================================================================================================
  9. @import "variables/variables";
  10. // 进度条
  11. @import "./nprogress/NProgress";
  12. // sweetalert弹窗
  13. @import "./sweetalert/sweetalert2";
  14. html body {
  15. background-color: $body-bg;
  16. color: $font-color;
  17. font-size: .95rem;
  18. }
  19. // 字体
  20. body, .header-navbar, .navigation, .breadcrumb, h1, h2, h3, h4, h5 {
  21. font-family: $font-family-sans-serif;
  22. }
  23. .content .content-wrapper {
  24. padding: calc(2.2rem - 0.4rem) 2.1rem 0;
  25. margin-top: 5rem;
  26. }
  27. .navbar-fixed-top {
  28. .content-wrapper {
  29. margin-top: 6.5rem;
  30. }
  31. }
  32. .content-header {
  33. padding: 3px 0 2px;
  34. }
  35. ol, ul, dl {
  36. margin-bottom: 0;
  37. }
  38. // 阴影
  39. .shadow-0 {
  40. box-shadow: none!important;
  41. }
  42. .shadow {
  43. box-shadow: $shadow!important;
  44. }
  45. .shadow-100 {
  46. box-shadow: $shadow-100!important;
  47. }
  48. .shadow-200 {
  49. box-shadow: $shadow-200!important;
  50. }
  51. //small
  52. .font-sm-1{
  53. font-size: 0.7rem !important;
  54. }
  55. .font-sm-2{
  56. font-size: 0.8rem !important;
  57. }
  58. .font-sm-3{
  59. font-size: 0.9rem !important;
  60. }
  61. //medium
  62. .font-md-1{
  63. font-size: 1.1rem !important;
  64. }
  65. .font-md-2{
  66. font-size: 1.2rem !important;
  67. }
  68. .font-md-3{
  69. font-size: 1.3rem !important;
  70. }
  71. .font-md-4{
  72. font-size: 1.4rem !important;
  73. }
  74. .font-md-5{
  75. font-size: 1.5rem !important;
  76. }
  77. //large
  78. .font-lg-1{
  79. font-size: 2rem !important;
  80. }
  81. .font-lg-2{
  82. font-size: 3rem !important;
  83. }
  84. .font-lg-3{
  85. font-size: 4rem !important;
  86. }
  87. .font-lg-4{
  88. font-size: 5rem !important;
  89. }
  90. .font-lg-5{
  91. font-size: 6rem !important;
  92. }
  93. // Font weights
  94. .bold-300 {
  95. font-weight: 300;
  96. }
  97. .bold-400 {
  98. font-weight: 400;
  99. }
  100. .bold-500 {
  101. font-weight: 500;
  102. }
  103. .bold-600 {
  104. font-weight: 600;
  105. }
  106. .bold-700 {
  107. font-weight: 700;
  108. }
  109. // Font style
  110. .text-italic {
  111. font-style: italic;
  112. }
  113. .text-highlight {
  114. padding: 4px 6px;
  115. }
  116. // 颜色class定义
  117. @import "./colors";
  118. // 布局
  119. @import "./components/layout";
  120. // 按钮
  121. @import "./components/button";
  122. // 顶部导航栏
  123. @import "./components/header-navbar";
  124. // 页面头
  125. @import "./components/content-header";
  126. // 表格自定义样式
  127. @import "./components/custom-data-table";
  128. // 表单
  129. @import "./components/form";
  130. // 分页
  131. @import "./components/pagination";
  132. // data-list-view 表格
  133. @import "./components/table";
  134. // grid
  135. @import "./components/grid";
  136. // 下拉菜单
  137. @import "./components/dropdown";
  138. // checkbox
  139. @import "./components/checkbox";
  140. // radio
  141. @import "./components/radio";
  142. // card
  143. @import "./components/card";
  144. // tree jquery.nestable
  145. @import "./components/nestable";
  146. // layer弹窗
  147. @import "./components/layer";
  148. // 滑动面板
  149. @import "./components/slider-panel";
  150. // grid selector
  151. @import "./components/grid-selector";
  152. // box
  153. @import "./components/box";
  154. // label
  155. @import "./components/label";
  156. // tab
  157. @import "./components/tab";
  158. // menu
  159. @import "./components/menu";
  160. // alert
  161. @import "./components/alert";
  162. // code
  163. @import "./components/code";
  164. // link
  165. @import "./components/link";
  166. // img
  167. @import "./components/img";
  168. // popover
  169. @import "./components/popover";
  170. // datetime picker
  171. @import "./components/datetime-picker";