Guest User

Untitled

a guest
Jun 21st, 2018
99
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 3.04 KB | None | 0 0
  1. .gform_wrapper {
  2. @fieldBorder: @lightGray;
  3. @fieldBg: @xLightBlue;
  4.  
  5. @focusBorder: @aqua;
  6. @focusBg: @white;
  7.  
  8. @fieldGutter: 14px;
  9. @halfGutter: @fieldGutter / 2;
  10.  
  11. @errorColor: @red;
  12. ul {
  13. margin: 0;
  14. padding: 0;
  15. background: none;
  16. list-style: none;
  17. }
  18. .gfield {
  19. margin-bottom: 1.35em;
  20. &.gfield_error {
  21. label {
  22. color: @errorColor;
  23. }
  24. input {
  25. border-color: @errorColor;
  26. }
  27. }
  28. }
  29. .gfield_description {
  30. font-size: 0.9em;
  31. &.validation_message {
  32. color: @errorColor;
  33. }
  34. }
  35. .gfield_required {
  36. color: @errorColor;
  37. }
  38. .gform_title {
  39. &:extend( h4 all );
  40. text-transform: none;
  41. }
  42. .gform_description {
  43. display: block;
  44. padding-bottom: 1em;
  45. margin-bottom: 1em;
  46. }
  47. .validation_error {
  48. color: @errorColor;
  49. border-bottom: 1px solid @errorColor;
  50. padding-bottom: 1em;
  51. margin-bottom: 1em;
  52. }
  53. label {
  54. display: block;
  55. margin-bottom: 0.4em;
  56. font-size: 0.9em;
  57. font-weight: bold;
  58. }
  59. .submit,
  60. input[type="submit"] {
  61. &:extend( .btn all, .btn.btn-green all );
  62. font-size: 15px;
  63. }
  64. textarea, select, input, button { outline: none; }
  65. textarea,
  66. input[type="text"],
  67. input[type="email"],
  68. input[type="tel"] {
  69. display: block;
  70. width: 100%;
  71. padding: 0.8em;
  72. border: 1px solid @fieldBorder;
  73. font-size: 1em;
  74. background: @fieldBg;
  75. border-radius: 4px;
  76. will-change: background-color, border-color;
  77. transition: all 0.2s ease;
  78. &:focus {
  79. border-color: @focusBorder;
  80. background-color: @focusBg;
  81. }
  82. }
  83. select {
  84. position: relative;
  85. width: 100%;
  86. padding: 12px;
  87. border: 1px solid @fieldBorder;
  88. border-radius: 4px;
  89. font-size: 1em;
  90. //height: 44px;
  91. background: @fieldBg;
  92. appearance: none;
  93. }
  94. .ginput_container_select {
  95. position: relative;
  96. &:after {
  97. content: '';
  98. position: absolute;
  99. top: 50%;
  100. right: 15px;
  101. width: 12px;
  102. height: 12px;
  103. margin-top: -6px;
  104. background: url(../img/select-box-arrow.svg) 0 0 no-repeat;
  105. }
  106. }
  107. .ginput_container_fileupload {
  108. display: block;
  109. width: 100%;
  110. padding: 0.8em;
  111. border: 1px solid @fieldBorder;
  112. font-size: 1em;
  113. border-radius: 2px;
  114. background: @fieldBg;
  115. }
  116. .gfield_radio,
  117. .gfield_checkbox {
  118. margin-top: 12px;
  119. > li {
  120. display: flex;
  121. margin: 0 0 8px;
  122. line-height: 1;
  123. input {
  124. margin-right: 8px;
  125. }
  126. }
  127. }
  128. .gform_footer {
  129. padding-top: 10px;
  130. }
  131. // Complex field types
  132. .ginput_complex {
  133. label {
  134. padding: 4px;
  135. font-weight: normal;
  136. opacity: 0.8;
  137. }
  138. }
  139. .ginput_container_name {
  140. display: flex;
  141. margin-right: -@fieldGutter;
  142. > span {
  143. flex: 1 0 auto;
  144. margin-right: @fieldGutter;
  145. }
  146. }
  147. .ginput_container_address {
  148. //width: 100%;
  149. display: flex;
  150. flex-wrap: wrap;
  151. margin-left: -@halfGutter;
  152. margin-right: -@halfGutter;
  153. > span {
  154. flex: 1 0 auto;
  155. margin: @halfGutter;
  156. &.address_line_1,
  157. &.address_line_2,
  158. &.address_country {
  159. width: ~"calc( 100% - @{fieldGutter})";
  160. flex: 0 0 ~"calc( 100% - @{fieldGutter})";
  161.  
  162. }
  163. &.address_city,
  164. &.address_state,
  165. &.address_zip {
  166. width: ~"calc( ( 100% / 3 ) - @{fieldGutter})";
  167. flex: 0 0 ~"calc( ( 100% / 3 ) - @{fieldGutter})";
  168. }
  169. }
  170. }
  171. }
Add Comment
Please, Sign In to add comment