You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

_order.scss 7.4KB

5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261
  1. .order-order {
  2. #app-order-order {
  3. display: none ;
  4. &.loaded {
  5. display: block ;
  6. }
  7. #order-distribution-date {
  8. display: none ;
  9. }
  10. .slide-enter-active {
  11. transition: all .2s ease;
  12. }
  13. .slide-leave-active {
  14. transition: all 0s ease;
  15. }
  16. .slide-enter, .slide-leave-to {
  17. transform: translateX(10px);
  18. opacity: 0;
  19. }
  20. #steps {
  21. margin-bottom: 20px ;
  22. ul {
  23. height: 70px ;
  24. li {
  25. text-align: center ;
  26. padding-right: 8px ;
  27. padding-left: 8px ;
  28. position: relative ;
  29. .info-step {
  30. position: absolute ;
  31. top: 45px ;
  32. left: 0px ;
  33. width: 100% ;
  34. text-transform: normal ;
  35. color: $color1 ;
  36. font-family: 'capsuularegular' ;
  37. font-size: 17px ;
  38. font-weight: bold ;
  39. }
  40. .glyphicon-chevron-right,
  41. &.active .glyphicon-chevron-right {
  42. float: right ;
  43. color: gray ;
  44. position: relative ;
  45. top: 10px ;
  46. }
  47. &#step-date {
  48. padding-left: 0px ;
  49. }
  50. &#step-payment {
  51. padding-right: 0px ;
  52. }
  53. &#step-payment .btn::after,
  54. &#step-date .btn::before {
  55. display: none ;
  56. }
  57. .btn {
  58. color: #333 ;
  59. text-transform: uppercase ;
  60. display: block ;
  61. width: 100% ;
  62. position: relative ;
  63. background-color: #e0e0e0 ;
  64. @include border-radius(0px) ;
  65. border: 0px none ;
  66. text-transform: uppercase ;
  67. .button-content {
  68. position: relative;
  69. left: 8px ;
  70. }
  71. &.btn-primary {
  72. background-color: $color1 ;
  73. }
  74. &::after, &::before {
  75. content: '' ;
  76. position: absolute ;
  77. top: -1px ;
  78. }
  79. &::after {
  80. right: -34px ;
  81. border:17px solid transparent;
  82. border-left:17px solid #e0e0e0;
  83. background-color: transparent ;
  84. }
  85. &::before {
  86. left: 0px ;
  87. border:17px solid transparent;
  88. border-left:17px solid white;
  89. background-color: transparent ;
  90. }
  91. &.btn-primary::after {
  92. border-left:17px solid $color1;
  93. }
  94. &:hover {
  95. //background-color: lighten($color1, 5) ;
  96. }
  97. &:hover::after {
  98. //border:17px solid transparent;
  99. //border-left:17px solid #fefefe;
  100. }
  101. }
  102. .btn-primary {
  103. color: white ;
  104. }
  105. }
  106. }
  107. }
  108. #legend {
  109. #order-date-color,
  110. #distribution-date-color {
  111. width: 13px ;
  112. height: 13px ;
  113. display: inline-block ;
  114. }
  115. #order-date-color {
  116. background-color: #FF7F00 ;
  117. }
  118. #distribution-date-color {
  119. background-color: #5cb85c ;
  120. }
  121. }
  122. #calendar {
  123. margin-bottom: 15px ;
  124. .c-header .c-title-layout .c-title-popover .c-title-anchor .c-title[data-v-2083cb72] {
  125. font-size: 2rem ;
  126. }
  127. .c-day-background {
  128. padding: 20px ;
  129. }
  130. .c-day:hover {
  131. .c-day-background {
  132. background-color: #FF7F00 !important ;
  133. color: white !important ;
  134. }
  135. }
  136. .c-day-popover-content {
  137. font-size: 1.3rem ;
  138. }
  139. }
  140. .block-actions {
  141. text-align: right ;
  142. margin-top: 20px ;
  143. }
  144. table#points-sale {
  145. td.name {
  146. .the-name {
  147. font-family: 'capsuularegular' ;
  148. color: black ;
  149. font-size: 20px ;
  150. line-height: 25px ;
  151. }
  152. }
  153. td.actions {
  154. width: 150px ;
  155. button {
  156. width: 100% ;
  157. }
  158. }
  159. tr.selected {
  160. td {
  161. background-color: $color2 ;
  162. }
  163. }
  164. }
  165. table#products {
  166. td.photo {
  167. img {
  168. width: 100px ;
  169. }
  170. }
  171. td.name {
  172. .name {
  173. font-family: 'capsuularegular' ;
  174. color: black ;
  175. font-size: 20px ;
  176. line-height: 25px ;
  177. }
  178. .other {
  179. font-size: 14px ;
  180. color: #333 ;
  181. }
  182. .recipe {
  183. color: gray ;
  184. }
  185. }
  186. .price-unit, .price-total {
  187. width: 100px ;
  188. text-align: center ;
  189. }
  190. .td-quantity {
  191. width: 150px ;
  192. input.quantity {
  193. text-align: center ;
  194. }
  195. }
  196. tr.total {
  197. .price-total {
  198. font-size: 23px ;
  199. }
  200. }
  201. }
  202. #content-step-payment {
  203. .credit {
  204. .info {
  205. margin-left: 20px ;
  206. color: gray ;
  207. }
  208. }
  209. .comment {
  210. margin-bottom: 20px ;
  211. }
  212. }
  213. #infos {
  214. margin-top: 30px ;
  215. .panel-body {
  216. padding-top: 0px ;
  217. white-space: pre-line ;
  218. }
  219. }
  220. }
  221. }