common.less 2.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165
  1. @import "vars.less";
  2. p,a,h1,h2,h3,h4,h5,h6,ul,ol {
  3. margin: 0;
  4. padding: 0;
  5. }
  6. img {
  7. max-width: 100%;
  8. vertical-align: middle;
  9. }
  10. a {
  11. text-decoration: none;
  12. color: @color-black-light;
  13. outline: none;
  14. transition: @transition-main;
  15. }
  16. body {
  17. -webkit-overflow-scrolling: touch;
  18. font-family: @font-main;
  19. color: @color-black;
  20. }
  21. ul {
  22. list-style: none;
  23. }
  24. textarea, button,
  25. input[type="text"],
  26. input[type="button"],
  27. input[type="submit"] {
  28. -webkit-appearance: none;
  29. outline: none;
  30. }
  31. input::-webkit-outer-spin-button,
  32. input::-webkit-inner-spin-button {
  33. -webkit-appearance: none;
  34. margin: 0;
  35. }
  36. input[type="number"] {
  37. -moz-appearance: textfield;
  38. }
  39. textarea {
  40. border-radius: 0;
  41. }
  42. form {
  43. margin-bottom: 0;
  44. }
  45. html {
  46. box-sizing: border-box;
  47. &.hidden {
  48. overflow: hidden;
  49. }
  50. }
  51. *, *:before, *:after {
  52. box-sizing: inherit;
  53. }
  54. input[type="color"],
  55. input[type="date"],
  56. input[type="datetime"],
  57. input[type="datetime-local"],
  58. input[type="email"],
  59. input[type="month"],
  60. input[type="number"],
  61. input[type="password"],
  62. input[type="search"],
  63. input[type="tel"],
  64. input[type="text"],
  65. input[type="time"],
  66. input[type="url"],
  67. input[type="week"],
  68. select:focus,
  69. textarea {
  70. font-size: 16px;
  71. }
  72. a,button {
  73. -webkit-tap-highlight-color: transparent;
  74. }
  75. body {
  76. display: flex;
  77. flex-direction: column;
  78. min-height: 100vh;
  79. height: auto !important;
  80. }
  81. .page-content {
  82. position: relative;
  83. flex: 1 0 auto;
  84. background-color: @color-page;
  85. overflow: hidden;
  86. }
  87. .footer {
  88. flex: 0 0 auto;
  89. }
  90. .m-visible {
  91. display: none!important;
  92. @media @media-md {
  93. display: block !important;
  94. }
  95. }
  96. .m-hidden {
  97. display: block;
  98. @media @media-md {
  99. display: none;
  100. }
  101. }
  102. .no-opacity {
  103. opacity: 1 !important;
  104. }
  105. .slick-dots {
  106. display: flex !important;
  107. position: relative;
  108. justify-content: center;
  109. align-items: center;
  110. width: 100%;
  111. min-height: 7px;
  112. bottom: 21px;
  113. li {
  114. font-size: 0 !important;
  115. line-height: 0 !important;
  116. margin-bottom: 0 !important;
  117. &:not(:last-child) {
  118. margin-right: 5px;
  119. }
  120. &.slick-active {
  121. button {
  122. .size(7px);
  123. background-color: @color-white;
  124. }
  125. }
  126. button {
  127. .size(5px);
  128. padding: 0;
  129. border: none;
  130. border-radius: 50%;
  131. background-color: rgba(@color-white, .5);
  132. outline: none;
  133. cursor: pointer;
  134. transition: @transition-main;
  135. }
  136. }
  137. }
  138. .visible {
  139. opacity: 1 !important;
  140. }
  141. .slick-slide {
  142. outline: none !important;
  143. cursor: pointer;
  144. }