normform.less 3.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214
  1. .norm-form {
  2. border-top: 3px solid @pageBackground;
  3. // border-left: 3px solid @pageBackground;
  4. // border-right: 3px solid @pageBackground;
  5. background: transparent;
  6. &.last {
  7. border-bottom: 1px solid @pageBackground;
  8. }
  9. &.borderless {
  10. background: transparent;
  11. border: none;
  12. }
  13. .checkbox-label {
  14. display: inline;
  15. padding-right: 4px;
  16. margin-bottom: 0;
  17. margin-left: 5px;
  18. }
  19. }
  20. .norm-form-container-no-item-borders {
  21. border: 1px solid @pageBackground;
  22. border-bottom: none;
  23. .norm-form, .norm-form-item, [type=text].norm-form-input, [type=text].norm-form-clear-input {
  24. border: none;
  25. }
  26. }
  27. .spaced-form {
  28. .norm-form {
  29. margin: 7px 0;
  30. }
  31. }
  32. .borderless {
  33. .norm-form-item,
  34. .norm-form-input {
  35. border: none;
  36. }
  37. }
  38. .norm-form-container {
  39. border-bottom: 1px solid @pageBackground;
  40. }
  41. .norm-form-btn {
  42. padding: 7px 12px;
  43. }
  44. .norm-form-list {
  45. list-style: none;
  46. margin: 0;
  47. >li {
  48. float: left;
  49. background: @labelBackground;
  50. }
  51. & .trans {
  52. background: transparent;
  53. }
  54. }
  55. .norm-form-flex-wrapper {
  56. display: flex;
  57. flex-direction: row;
  58. float: none !important;
  59. }
  60. .grafana-metric-options {
  61. margin-top: 25px;
  62. }
  63. .norm-form-item {
  64. padding: 8px 7px;
  65. display: inline-block;
  66. font-weight: normal;
  67. border-right: 3px solid @pageBackground;
  68. color: @grayLighter;
  69. display: inline-block;
  70. .small;
  71. .has-open-function & {
  72. padding-top: 25px;
  73. }
  74. .norm-form-disabled & {
  75. color: @grafanaTargetColorHide;
  76. }
  77. &:hover, &:focus {
  78. text-decoration: none;
  79. }
  80. &a:hover {
  81. background: @grafanaTargetFuncBackground;
  82. }
  83. &.last {
  84. border-right: none;
  85. }
  86. }
  87. .norm-form-item-icon {
  88. i {
  89. width: 15px;
  90. text-align: center;
  91. display: inline-block;
  92. }
  93. }
  94. .norm-form-func {
  95. background: @grafanaTargetFuncBackground;
  96. > a {
  97. color: @grafanaTargetColor;
  98. }
  99. > a:hover {
  100. color: @linkColor;
  101. }
  102. &.show-function-controls {
  103. padding-top: 5px;
  104. min-width: 100px;
  105. text-align: center;
  106. }
  107. }
  108. input[type=text].norm-form-func-param {
  109. background: transparent;
  110. border: none;
  111. margin: 0;
  112. padding: 0;
  113. }
  114. input[type=text].norm-form-clear-input {
  115. padding: 8px 7px;
  116. border: none;
  117. margin: 0px;
  118. background: transparent;
  119. color: @grafanaTargetColor;
  120. border-radius: 0;
  121. border-right: 2px solid @pageBackground;
  122. }
  123. [type=text],
  124. [type=email],
  125. [type=number],
  126. [type=password], {
  127. &.norm-form-input {
  128. border: none;
  129. border-right: 3px solid @pageBackground;
  130. margin: 0px;
  131. border-radius: 0;
  132. padding: 8px 6px;
  133. height: 100%;
  134. box-sizing: border-box;
  135. font-size: 15px;
  136. &.last {
  137. border-right: none;
  138. }
  139. }
  140. }
  141. input[type=checkbox].norm-form-checkbox {
  142. margin: 0;
  143. }
  144. .norm-form-textarea {
  145. height: 200px;
  146. margin: 0;
  147. box-sizing: border-box;
  148. }
  149. select.norm-form-input {
  150. border: none;
  151. border-right: 3px solid @pageBackground;
  152. margin: 0px;
  153. border-radius: 0;
  154. height: 36px;
  155. padding: 9px 3px;
  156. font-size: 15px;
  157. &.last {
  158. border-right: none;
  159. }
  160. }
  161. .norm-form-radio {
  162. input[type=radio] {
  163. margin: 0;
  164. }
  165. label {
  166. display: inline;
  167. }
  168. }
  169. .norm-form-item-large { width: 115px; }
  170. .norm-form-item-xlarge { width: 150px; }
  171. .norm-form-item-xxlarge { width: 200px; }
  172. .norm-form-input.norm-form-item-xxlarge {
  173. width: 215px;
  174. }
  175. .norm-form-auto {
  176. width: auto;
  177. }
  178. .norm-form-inner-box {
  179. margin: 20px 0 20px 148px;
  180. display: inline-block;
  181. }