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 12KB

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
5 years ago
5 years ago
5 years ago
5 years ago
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428
  1. .order-order #main {
  2. #app-order-order {
  3. display: block ;
  4. .wrapper {
  5. display: none;
  6. }
  7. &.loaded .wrapper {
  8. display: block ;
  9. }
  10. h3 {
  11. font-family: "highvoltageregular" ;
  12. }
  13. #distribution-date, #order-distribution-date {
  14. display: none ;
  15. }
  16. .alert-edit-order {
  17. strong {
  18. //font-weight: bold;
  19. }
  20. }
  21. .slide-enter-active {
  22. transition: all .2s ease;
  23. }
  24. .slide-leave-active {
  25. transition: all 0s ease;
  26. }
  27. .slide-enter, .slide-leave-to {
  28. transform: translateX(10px);
  29. opacity: 0;
  30. }
  31. #steps {
  32. margin-bottom: 20px ;
  33. ul {
  34. height: 70px ;
  35. li {
  36. text-align: center ;
  37. padding-right: 8px ;
  38. padding-left: 8px ;
  39. position: relative ;
  40. .info-step {
  41. position: absolute ;
  42. top: 45px ;
  43. left: 0px ;
  44. width: 100% ;
  45. text-transform: normal ;
  46. color: $color1 ;
  47. font-family: 'capsuularegular' ;
  48. font-size: 17px ;
  49. font-weight: bold ;
  50. }
  51. .glyphicon-chevron-right,
  52. &.active .glyphicon-chevron-right {
  53. float: right ;
  54. color: gray ;
  55. position: relative ;
  56. top: 10px ;
  57. }
  58. &.first {
  59. padding-left: 0px ;
  60. }
  61. &#step-payment {
  62. padding-right: 0px ;
  63. }
  64. &#step-products .btn::after,
  65. &.first .btn::before {
  66. display: none ;
  67. }
  68. .btn {
  69. color: #333 ;
  70. text-transform: uppercase ;
  71. display: block ;
  72. width: 100% ;
  73. position: relative ;
  74. background-color: #e0e0e0 ;
  75. @include border-radius(0px) ;
  76. border: 0px none ;
  77. text-transform: uppercase ;
  78. .button-content {
  79. position: relative;
  80. left: 8px ;
  81. }
  82. &.btn-primary {
  83. background-color: $color1 ;
  84. }
  85. &::after, &::before {
  86. content: '' ;
  87. position: absolute ;
  88. top: -1px ;
  89. }
  90. &::after {
  91. right: -34px ;
  92. border:17px solid transparent;
  93. border-left:17px solid #e0e0e0;
  94. background-color: transparent ;
  95. }
  96. &::before {
  97. left: 0px ;
  98. border:17px solid transparent;
  99. border-left:17px solid white;
  100. background-color: transparent ;
  101. }
  102. &.btn-primary::after {
  103. border-left:17px solid $color1;
  104. }
  105. &:hover {
  106. //background-color: lighten($color1, 5) ;
  107. }
  108. &:hover::after {
  109. //border:17px solid transparent;
  110. //border-left:17px solid #fefefe;
  111. }
  112. }
  113. .btn-primary {
  114. color: white ;
  115. }
  116. }
  117. }
  118. }
  119. #legend {
  120. #order-date-color,
  121. #distribution-date-color {
  122. width: 13px ;
  123. height: 13px ;
  124. display: inline-block ;
  125. }
  126. #order-date-color {
  127. background-color: $color1 ;
  128. }
  129. #distribution-date-color {
  130. background-color: #5cb85c ;
  131. }
  132. }
  133. #calendar {
  134. margin-bottom: 15px ;
  135. .c-header .c-title-layout .c-title-popover .c-title-anchor .c-title[data-v-2083cb72] {
  136. font-size: 2rem ;
  137. }
  138. .c-day-background {
  139. padding: 20px ;
  140. }
  141. .c-day:hover {
  142. .c-day-background {
  143. background-color: $color1 !important ;
  144. color: white !important ;
  145. }
  146. }
  147. .c-day-popover-content {
  148. font-size: 1.3rem ;
  149. }
  150. }
  151. #credit-online-payment {
  152. .panel {
  153. .panel-heading {
  154. .btn-default {
  155. float: right;
  156. position: relative;
  157. top: -5px;
  158. }
  159. }
  160. }
  161. }
  162. #content-step-date {
  163. #distributions-list {
  164. .panel {
  165. .btn-primary {
  166. float: right ;
  167. }
  168. .date {
  169. font-size: 20px ;
  170. }
  171. .point-sales {
  172. color: gray ;
  173. font-size: 14px ;
  174. margin-top: 8px ;
  175. }
  176. }
  177. }
  178. }
  179. .block-actions {
  180. text-align: right ;
  181. margin-top: 20px ;
  182. }
  183. table#points-sale {
  184. td.name {
  185. .the-name {
  186. font-family: 'capsuularegular' ;
  187. color: black ;
  188. font-size: 20px ;
  189. line-height: 25px ;
  190. font-weight: bold;
  191. }
  192. .comment,
  193. .minimum-order-amount {
  194. color: gray;
  195. a {
  196. color: $color1;
  197. }
  198. }
  199. }
  200. td.actions {
  201. width: 150px ;
  202. button {
  203. width: 100% ;
  204. }
  205. }
  206. tr.selected {
  207. td {
  208. background-color: $color2 ;
  209. }
  210. }
  211. }
  212. table#products {
  213. td.category-name {
  214. font-family: "highvoltageregular" ;
  215. font-size: 22px ;
  216. line-height: 30px;
  217. text-transform: uppercase;
  218. padding-top: 13px ;
  219. .glyphicon-triangle-bottom,
  220. .glyphicon-triangle-right {
  221. font-size: 15px ;
  222. }
  223. span.label {
  224. //font-family: 'capsuularegular' ;
  225. font-family: 'Arial' ;
  226. font-weight: normal ;
  227. float: right ;
  228. text-transform: none ;
  229. margin-left: 15px ;
  230. }
  231. &:hover {
  232. cursor: pointer ;
  233. background-color: $color1 ;
  234. color: white ;
  235. }
  236. }
  237. td.photo {
  238. img {
  239. width: 100px ;
  240. }
  241. }
  242. td.name {
  243. }
  244. .price-unit {
  245. .decreasing-prices {
  246. margin-top: 10px;
  247. font-size: 10px;
  248. padding-top: 6px;
  249. padding-bottom: 2px;
  250. margin-bottom: 0px;
  251. ul {
  252. li {
  253. margin-bottom: 5px;
  254. strong {
  255. font-weight: bold;
  256. }
  257. }
  258. }
  259. }
  260. }
  261. .price-unit, .price-total {
  262. width: 135px ;
  263. text-align: center ;
  264. .price-infos {
  265. color: gray ;
  266. font-size: 13px ;
  267. line-height: 15px;
  268. }
  269. }
  270. .td-quantity {
  271. width: 175px ;
  272. input.quantity {
  273. text-align: center ;
  274. border-right: 0px none ;
  275. }
  276. .input-group-addon {
  277. padding: 5px ;
  278. padding-left: 0px ;
  279. margin: 0px ;
  280. border-left: 0px none ;
  281. border-right: 0px none ;
  282. }
  283. }
  284. tr.total {
  285. .summary {
  286. h3 {
  287. margin-top: 0px ;
  288. font-family: 'capsuularegular' ;
  289. text-transform: none ;
  290. margin-bottom: 5px ;
  291. }
  292. ul {
  293. margin-bottom: 15px ;
  294. padding-left: 20px ;
  295. font-size: 23px ;
  296. li {
  297. .quantity {
  298. font-size: 18px ;
  299. }
  300. .name {
  301. font-family: 'capsuularegular' ;
  302. font-size: 24px ;
  303. }
  304. .other {
  305. //font-family: 'arial' ;
  306. font-family: 'capsuularegular' ;
  307. font-size: 18px ;
  308. }
  309. }
  310. }
  311. }
  312. .price-total {
  313. font-size: 23px ;
  314. }
  315. }
  316. }
  317. #content-step-payment {
  318. .delivery {
  319. margin-bottom: 20px ;
  320. .delivery-home {
  321. margin-bottom: 20px ;
  322. }
  323. .delivery-address {
  324. }
  325. }
  326. .comment {
  327. margin-bottom: 20px ;
  328. }
  329. .credit {
  330. .info {
  331. margin-left: 20px ;
  332. color: gray ;
  333. }
  334. }
  335. }
  336. #specific-delays {
  337. margin-top: 15px;
  338. strong {
  339. //text-decoration: underline ;
  340. }
  341. }
  342. #infos {
  343. margin-top: 30px ;
  344. .panel-body {
  345. padding-top: 0px ;
  346. white-space: pre-line ;
  347. }
  348. }
  349. }
  350. }
  351. #main #content {
  352. .panel {
  353. h3 {
  354. font-family: "highvoltageregular" ;
  355. margin: 0px ;
  356. padding-top: 10px ;
  357. padding-bottom: 4px ;
  358. font-size: 20px ;
  359. }
  360. }
  361. }