Du kan inte välja fler än 25 ämnen Ämnen måste starta med en bokstav eller siffra, kan innehålla bindestreck ('-') och vara max 35 tecken långa.

475 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. width: 13px ;
  117. height: 13px ;
  118. display: inline-block ;
  119. }
  120. #order-date-color {
  121. background-color: #198754 ;
  122. border: solid 2px #198754;
  123. }
  124. #distribution-date-color {
  125. background-color: white;
  126. border: solid 2px #198754;
  127. }
  128. }
  129. #calendar {
  130. margin-bottom: 15px ;
  131. .c-header .c-title-layout .c-title-popover .c-title-anchor .c-title[data-v-2083cb72] {
  132. font-size: 2rem ;
  133. }
  134. .c-day-background {
  135. padding: 20px ;
  136. }
  137. .c-day:hover {
  138. .c-day-background {
  139. background-color: $color-primary !important ;
  140. color: white !important ;
  141. }
  142. }
  143. .c-day-popover-content {
  144. font-size: 1.3rem ;
  145. }
  146. }
  147. #credit-online-payment {
  148. .panel {
  149. .panel-heading {
  150. .btn-default {
  151. float: right;
  152. position: relative;
  153. top: -5px;
  154. }
  155. }
  156. }
  157. }
  158. #content-step-date {
  159. #distributions-list {
  160. .card {
  161. margin-bottom: 20px;
  162. .btn-primary {
  163. float: right ;
  164. }
  165. .date {
  166. font-size: 1.2rem ;
  167. line-height: 1.4rem;
  168. text-transform: uppercase;
  169. font-family: 'worksans_semibold';
  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: center ;
  181. margin-top: 20px ;
  182. }
  183. table#points-sale {
  184. td.name {
  185. .the-name {
  186. color: black ;
  187. font-size: 1.2em ;
  188. line-height: 1.4em ;
  189. font-family: 'worksans_semibold';
  190. }
  191. .locality {
  192. display: none;
  193. }
  194. .comment,
  195. .minimum-order-amount {
  196. color: gray;
  197. a {
  198. color: $color-primary;
  199. }
  200. }
  201. }
  202. td.actions {
  203. width: 150px ;
  204. button {
  205. width: 100% ;
  206. }
  207. }
  208. tr.selected {
  209. td {
  210. //background-color: white ;
  211. }
  212. }
  213. }
  214. table#products {
  215. border-top: solid 1px $color-gray-dark;
  216. border-left: solid 1px $color-gray-dark;
  217. border-right: solid 1px $color-gray-dark;
  218. thead {
  219. display: none;
  220. }
  221. td {
  222. border-bottom: solid 1px $color-gray-dark;
  223. border-left: 0px none;
  224. border-right: 0px none;
  225. }
  226. tr.category-closed:hover,
  227. tr.category-open {
  228. td.category-name {
  229. padding-left: 30px;
  230. background-color: $color-gray-light;
  231. }
  232. }
  233. td.category-name {
  234. transition: all 0.1s linear;
  235. background-color: $color-gray-light;
  236. border-left: solid 5px $color-gray-dark;
  237. font-family: "worksans_bold" ;
  238. font-size: 22px ;
  239. line-height: 30px;
  240. text-transform: uppercase;
  241. padding-top: 13px ;
  242. padding-left: 20px;
  243. .bi-caret-down-fill,
  244. .bi-caret-right-fill {
  245. font-size: 15px ;
  246. }
  247. span.badge {
  248. font-family: 'worksans_bold' ;
  249. text-transform: uppercase ;
  250. margin-left: 5px ;
  251. font-size: 0.85rem;
  252. position: relative;
  253. top: -3px;
  254. &.bg-primary {
  255. float: right;
  256. top: 2px;
  257. }
  258. }
  259. &:hover {
  260. cursor: pointer ;
  261. background-color: white;
  262. }
  263. }
  264. td.photo {
  265. img {
  266. width: 75px ;
  267. }
  268. }
  269. td.name {
  270. }
  271. .price-unit {
  272. .decreasing-prices {
  273. margin-top: 10px;
  274. font-size: 10px;
  275. padding-top: 6px;
  276. padding-bottom: 2px;
  277. margin-bottom: 0px;
  278. ul {
  279. li {
  280. margin-bottom: 5px;
  281. strong {
  282. font-weight: bold;
  283. }
  284. }
  285. }
  286. }
  287. }
  288. .price-unit, .price-total {
  289. width: 135px ;
  290. text-align: center ;
  291. .price-infos {
  292. color: gray ;
  293. font-size: 13px ;
  294. line-height: 15px;
  295. }
  296. }
  297. tr.product-open td.price-total {
  298. font-size: 1.1rem ;
  299. font-family: 'worksans_bold';
  300. padding-top: 19px;
  301. }
  302. .td-quantity {
  303. width: 175px ;
  304. input.quantity,
  305. .input-group-text {
  306. background-color: white;
  307. }
  308. input.quantity {
  309. text-align: center ;
  310. border: 0px none;
  311. }
  312. .input-group-text {
  313. border: 0px none;
  314. padding-right: 10px ;
  315. padding-left: 0px;
  316. margin: 0px ;
  317. }
  318. .input-group-btn {
  319. button {
  320. padding: 4px 5px 0px 5px;
  321. .bi {
  322. font-size: 1.5em;
  323. font-weight: bold;
  324. margin: 0px;
  325. }
  326. }
  327. }
  328. }
  329. tr.total {
  330. .summary {
  331. padding: 25px;
  332. h3 {
  333. font-family: 'worksans_bold';
  334. margin-top: 0px ;
  335. text-transform: uppercase ;
  336. margin-bottom: 5px ;
  337. }
  338. ul {
  339. margin-bottom: 15px ;
  340. padding-left: 20px ;
  341. font-size: 1.1rem ;
  342. line-height: 1.4rem;
  343. list-style-type: disc;
  344. li {
  345. .quantity {
  346. font-weight: bold;
  347. }
  348. }
  349. }
  350. }
  351. .price-total {
  352. padding-top: 25px;
  353. font-size: 1.5rem ;
  354. font-family: 'worksans_bold';
  355. span {
  356. display: inline-block;
  357. padding: 7px 15px;
  358. @include border-radius(15px);
  359. color: white;
  360. font-size: 1.2rem;
  361. }
  362. }
  363. }
  364. }
  365. #content-step-payment {
  366. .delivery {
  367. margin-bottom: 20px ;
  368. .delivery-home {
  369. margin-bottom: 20px ;
  370. }
  371. .delivery-address {
  372. }
  373. }
  374. .comment {
  375. margin-bottom: 20px ;
  376. }
  377. .credit {
  378. .info {
  379. margin-left: 20px ;
  380. color: gray ;
  381. }
  382. }
  383. }
  384. }
  385. }
  386. #main #content {
  387. .panel {
  388. h3 {
  389. font-family: "worksans_bold" ;
  390. margin: 0px ;
  391. padding-top: 10px ;
  392. padding-bottom: 4px ;
  393. font-size: 20px ;
  394. }
  395. }
  396. }