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.

494 lines
13KB

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