dcat-app.scss 3.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207
  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 {
  15. font-size: 14px;
  16. height: 100%;
  17. letter-spacing: .01rem;
  18. }
  19. html body {
  20. background-color: $body-bg;
  21. color: $font-color;
  22. }
  23. // 字体
  24. body, .header-navbar, .navigation, .breadcrumb, h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
  25. font-family: $font-family-sans-serif;
  26. }
  27. h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
  28. line-height: 1.1
  29. }
  30. .content .content-wrapper {
  31. padding: 7rem 2rem 0;
  32. }
  33. .navbar-fixed-top {
  34. .content-wrapper {
  35. padding-top: 6rem;
  36. }
  37. }
  38. .content-header {
  39. padding: 0 0 2px;
  40. }
  41. .full-page {
  42. .content .content-wrapper {
  43. padding: 0;
  44. margin-left: 0!important;
  45. }
  46. }
  47. ol, ul, dl {
  48. margin-bottom: 0;
  49. }
  50. // 阴影
  51. .shadow-0 {
  52. box-shadow: none!important;
  53. }
  54. .shadow {
  55. box-shadow: $shadow!important;
  56. }
  57. .shadow-100 {
  58. box-shadow: $shadow-100!important;
  59. }
  60. .shadow-200 {
  61. box-shadow: $shadow-200!important;
  62. }
  63. //small
  64. .font-sm-1{
  65. font-size: 0.7rem !important;
  66. }
  67. .font-sm-2{
  68. font-size: 0.8rem !important;
  69. }
  70. .font-sm-3{
  71. font-size: 0.9rem !important;
  72. }
  73. //medium
  74. .font-md-1{
  75. font-size: 1.1rem !important;
  76. }
  77. .font-md-2{
  78. font-size: 1.2rem !important;
  79. }
  80. .font-md-3{
  81. font-size: 1.3rem !important;
  82. }
  83. .font-md-4{
  84. font-size: 1.4rem !important;
  85. }
  86. .font-md-5{
  87. font-size: 1.5rem !important;
  88. }
  89. //large
  90. .font-lg-1{
  91. font-size: 2rem !important;
  92. }
  93. .font-lg-2{
  94. font-size: 3rem !important;
  95. }
  96. .font-lg-3{
  97. font-size: 4rem !important;
  98. }
  99. .font-lg-4{
  100. font-size: 5rem !important;
  101. }
  102. .font-lg-5{
  103. font-size: 6rem !important;
  104. }
  105. // Font weights
  106. .font-w-300 {
  107. font-weight: 300;
  108. }
  109. .font-w-400 {
  110. font-weight: 400;
  111. }
  112. .font-w-500 {
  113. font-weight: 500;
  114. }
  115. .font-w-600 {
  116. font-weight: 600;
  117. }
  118. .font-w-700 {
  119. font-weight: 700;
  120. }
  121. // Font style
  122. .text-italic {
  123. font-style: italic;
  124. }
  125. .text-highlight {
  126. padding: 4px 6px;
  127. }
  128. // 颜色class定义
  129. @import "./colors";
  130. // 布局
  131. @import "./components/layout";
  132. // 按钮
  133. @import "./components/button";
  134. // 顶部导航栏
  135. @import "./components/header-navbar";
  136. // 页面头
  137. @import "./components/content-header";
  138. // 表格自定义样式
  139. @import "./components/custom-data-table";
  140. // 表单
  141. @import "./components/form";
  142. // 分页
  143. @import "./components/pagination";
  144. // data-list-view 表格
  145. @import "./components/table";
  146. // grid
  147. @import "./components/grid";
  148. // 下拉菜单
  149. @import "./components/dropdown";
  150. // checkbox
  151. @import "./components/checkbox";
  152. // radio
  153. @import "./components/radio";
  154. // card
  155. @import "./components/card";
  156. // tree jquery.nestable
  157. @import "./components/nestable";
  158. // layer弹窗
  159. @import "./components/layer";
  160. // 滑动面板
  161. @import "./components/slider-panel";
  162. // grid selector
  163. @import "./components/grid-selector";
  164. // box
  165. @import "./components/box";
  166. // label
  167. @import "./components/label";
  168. // tab
  169. @import "./components/tab";
  170. // menu
  171. @import "./components/menu";
  172. // alert
  173. @import "./components/alert";
  174. // code
  175. @import "./components/code";
  176. // link
  177. @import "./components/link";
  178. // img
  179. @import "./components/img";
  180. // popover
  181. @import "./components/popover";
  182. // datetime picker
  183. @import "./components/datetime-picker";
  184. // 菜单
  185. @import "./components/sidebar";
  186. // 模态窗
  187. @import "./components/modal";