screen.scss 33KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202120312041205120612071208120912101211121212131214121512161217121812191220122112221223122412251226122712281229123012311232123312341235123612371238123912401241124212431244124512461247124812491250125112521253125412551256125712581259126012611262126312641265126612671268126912701271127212731274127512761277127812791280128112821283128412851286128712881289129012911292129312941295129612971298129913001301130213031304130513061307130813091310131113121313131413151316131713181319132013211322132313241325132613271328132913301331133213331334133513361337133813391340134113421343134413451346134713481349135013511352135313541355135613571358135913601361136213631364136513661367136813691370137113721373137413751376137713781379138013811382138313841385138613871388138913901391139213931394139513961397139813991400140114021403140414051406140714081409141014111412141314141415141614171418141914201421142214231424142514261427142814291430143114321433143414351436143714381439144014411442144314441445144614471448144914501451145214531454145514561457145814591460146114621463146414651466146714681469147014711472147314741475147614771478147914801481148214831484148514861487148814891490149114921493149414951496149714981499150015011502150315041505
  1. /**
  2. Copyright distrib (2018)
  3. contact@opendistrib.net
  4. Ce logiciel est un programme informatique servant à aider les producteurs
  5. à distribuer leur production en circuits courts.
  6. Ce logiciel est régi par la licence CeCILL soumise au droit français et
  7. respectant les principes de diffusion des logiciels libres. Vous pouvez
  8. utiliser, modifier et/ou redistribuer ce programme sous les conditions
  9. de la licence CeCILL telle que diffusée par le CEA, le CNRS et l'INRIA
  10. sur le site "http://www.cecill.info".
  11. En contrepartie de l'accessibilité au code source et des droits de copie,
  12. de modification et de redistribution accordés par cette licence, il n'est
  13. offert aux utilisateurs qu'une garantie limitée. Pour les mêmes raisons,
  14. seule une responsabilité restreinte pèse sur l'auteur du programme, le
  15. titulaire des droits patrimoniaux et les concédants successifs.
  16. A cet égard l'attention de l'utilisateur est attirée sur les risques
  17. associés au chargement, à l'utilisation, à la modification et/ou au
  18. développement et à la reproduction du logiciel par l'utilisateur étant
  19. donné sa spécificité de logiciel libre, qui peut le rendre complexe à
  20. manipuler et qui le réserve donc à des développeurs et des professionnels
  21. avertis possédant des connaissances informatiques approfondies. Les
  22. utilisateurs sont donc invités à charger et tester l'adéquation du
  23. logiciel à leurs besoins dans des conditions permettant d'assurer la
  24. sécurité de leurs systèmes et ou de leurs données et, plus généralement,
  25. à l'utiliser et l'exploiter dans les mêmes conditions de sécurité.
  26. Le fait que vous puissiez accéder à cet en-tête signifie que vous avez
  27. pris connaissance de la licence CeCILL, et que vous en avez accepté les
  28. termes.
  29. */
  30. @import "compass" ;
  31. $dir-fonts: '../fonts/' ;
  32. @import "_fonts.scss" ;
  33. $color1: #FF7F00 ;
  34. $color2: white ;
  35. .clr {
  36. clear: both ;
  37. }
  38. h1, h2, h3, h4, h5, h6 {
  39. font-family: 'myriadpro-light' ;
  40. }
  41. a {
  42. color: $color1;
  43. &:hover, &:focus, &:active {
  44. color: darken($color1, 10) ;
  45. }
  46. }
  47. #block-demo {
  48. padding: 10px 0px ;
  49. background-color: $color2 ;
  50. color: $color1;
  51. text-align: left ;
  52. margin-bottom: 20px ;
  53. border: solid 1px lighten($color1,10) ;
  54. @include border-radius(5px) ;
  55. a {
  56. text-decoration: underline ;
  57. }
  58. }
  59. #env-dev {
  60. font-family: 'comfortaabold' ;
  61. text-align: center ;
  62. font-size: 18px ;
  63. padding: 5px 10px ;
  64. color: white ;
  65. position: fixed ;
  66. top: 9px ;
  67. left: 66px ;
  68. z-index: 1031 ;
  69. }
  70. .wrap {
  71. .btn-primary {
  72. background: none ;
  73. background-color: $color1 ;
  74. border: solid 1px $color1 ;
  75. &:hover, &:focus, &:active {
  76. background-color: darken($color1, 10) ;
  77. border: solid 1px darken($color1, 10) ;
  78. }
  79. }
  80. }
  81. .nav-header {
  82. .retour-site {
  83. border-left : solid 1px $color2 ;
  84. padding: 10px 15px ;
  85. }
  86. }
  87. .navbar-brand {
  88. .logo {
  89. height: 40px ;
  90. position: relative ;
  91. top: -10px ;
  92. }
  93. }
  94. .container-body {
  95. padding-top: 117px ;
  96. padding-bottom: 50px ;
  97. }
  98. .navbar-inverse {
  99. background: none;
  100. background-color: $color1 ;
  101. border-bottom: 0px none ;
  102. .navbar-nav {
  103. padding-top: 12px ;
  104. }
  105. .navbar-nav > li > a {
  106. color: white ;
  107. margin-left: 3px;
  108. padding: 3px 11px ;
  109. &:hover {
  110. color: $color2 ;
  111. //background-color: $color2 ;
  112. }
  113. }
  114. .navbar-nav > li.active,
  115. .navbar-nav > .open {
  116. a {
  117. background: none ;
  118. @include box-shadow(none) ;
  119. @include text-shadow(none) ;
  120. margin-left: 3px ;
  121. background-color: $color2 ;
  122. color: $color1 ;
  123. padding: 3px 11px ;
  124. @include border-radius(5px) ;
  125. &:hover,
  126. &:focus {
  127. background-color: $color2 ;
  128. color: $color1 ;
  129. }
  130. }
  131. }
  132. .navbar-nav > .open {
  133. a.dropdown-toggle {
  134. @include border-radius(5px 5px 0px 0px) ;
  135. }
  136. ul.dropdown-menu {
  137. @include box-shadow(0px 0px 5px gray) ;
  138. @include border-radius(5px 0px 5px 5px) ;
  139. border-top: 0px none ;
  140. right: -1px ;
  141. li {
  142. a {
  143. background-color: transparent ;
  144. &:hover {
  145. color: darken($color1,10) ;
  146. }
  147. }
  148. }
  149. }
  150. }
  151. .navbar-nav > .open > a,
  152. .navbar-nav > .open > a:hover,
  153. .navbar-nav > .open > a:focus {
  154. }
  155. }
  156. #alerts-fixed {
  157. position: fixed ;
  158. bottom: 20px ;
  159. left: 20px ;
  160. .alert {
  161. margin-top: 20px ;
  162. }
  163. }
  164. .name-producer {
  165. //font-family: 'Georgia' ;
  166. margin-bottom: 15px ;
  167. text-align: left ;
  168. position: fixed ;
  169. top: 51px ;
  170. left: 0px ;
  171. width: 100% ;
  172. background-color: #515151 ;
  173. background-color: $color2 ;
  174. color: darken($color1,15) ;
  175. z-index: 100 ;
  176. font-size: 20px ;
  177. padding: 8px 15px ;
  178. padding-bottom: 2px ;
  179. padding-top: 5px ;
  180. border-bottom: solid 1px #e0e0e0 ;
  181. @include box-shadow(0px 0px 5px gray) ;
  182. #select-producer {
  183. float: left ;
  184. font-size: 15px ;
  185. }
  186. .label {
  187. font-size: 11px ;
  188. margin-left: 10px ;
  189. position: relative ;
  190. bottom: 3px ;
  191. a {
  192. color: white ;
  193. &:hover {
  194. text-decoration: none ;
  195. }
  196. }
  197. }
  198. }
  199. .table {
  200. thead {
  201. th.actions {
  202. width: 220px ;
  203. }
  204. th.order {
  205. width: 58px ;
  206. }
  207. th.actif {
  208. width: 75px ;
  209. text-align: center;
  210. }
  211. }
  212. tbody {
  213. td.center {
  214. text-align: center ;
  215. }
  216. }
  217. }
  218. .footer {
  219. .pull-left {
  220. a {
  221. margin-right: 5px ;
  222. margin-left: 5px ;
  223. color: gray ;
  224. }
  225. }
  226. #code-source {
  227. img {
  228. height: 20px ;
  229. }
  230. }
  231. }
  232. a.btn, button.btn {
  233. position: relative ;
  234. .glyphicon-triangle-bottom {
  235. display: none;
  236. position: absolute;
  237. top: 26px;
  238. left: 50%;
  239. margin-left: -10px;
  240. font-size: 20px;
  241. color: #FF7F00;
  242. }
  243. &.btn-primary {
  244. .glyphicon-triangle-bottom {
  245. display: block ;
  246. }
  247. }
  248. }
  249. .app-vuejs {
  250. #loading {
  251. position: fixed ;
  252. top: 50% ;
  253. left: 50% ;
  254. width: 100px ;
  255. height: 100px ;
  256. @include border-radius(50px) ;
  257. background-color: white ;
  258. z-index: 10 ;
  259. @include box-shadow(0px 0px 5px #d0d0d0) ;
  260. img {
  261. position: relative ;
  262. top: 35px ;
  263. left: 35px ;
  264. width: 30px ;
  265. height: 30px ;
  266. }
  267. }
  268. }
  269. #nav-params {
  270. margin-bottom: 30px ;
  271. button {
  272. margin-right: 10px ;
  273. }
  274. }
  275. .panel {
  276. .panel-heading {
  277. .panel-title {
  278. .btn {
  279. float: right ;
  280. }
  281. }
  282. }
  283. }
  284. /* modals */
  285. .modal-mask {
  286. position: fixed;
  287. z-index: 9998;
  288. top: 0;
  289. left: 0;
  290. width: 100%;
  291. height: 100%;
  292. background-color: rgba(0, 0, 0, .5);
  293. display: table;
  294. transition: opacity .3s ease;
  295. }
  296. .modal-wrapper {
  297. display: table-cell;
  298. vertical-align: middle;
  299. }
  300. .modal-container {
  301. width: 70%;
  302. margin: 0px auto;
  303. padding: 20px 30px;
  304. background-color: #fff;
  305. border-radius: 2px;
  306. box-shadow: 0 2px 8px rgba(0, 0, 0, .33);
  307. transition: all .3s ease;
  308. font-family: Helvetica, Arial, sans-serif;
  309. }
  310. .modal-header {
  311. padding-bottom: 0px ;
  312. h3 {
  313. margin-top: 0;
  314. color: #333;
  315. text-transform: uppercase ;
  316. margin-bottom: 0px ;
  317. }
  318. }
  319. .modal-body {
  320. margin: 20px 0;
  321. max-height: 300px ;
  322. height: 300px ;
  323. overflow-y: scroll ;
  324. }
  325. .modal-default-button {
  326. float: right;
  327. }
  328. /*
  329. * The following styles are auto-applied to elements with
  330. * transition="modal" when their visibility is toggled
  331. * by Vue.js.
  332. *
  333. * You can easily play with the modal transition by editing
  334. * these styles.
  335. */
  336. .modal-enter {
  337. opacity: 0;
  338. }
  339. .modal-leave-active {
  340. opacity: 0;
  341. }
  342. .modal-enter .modal-container,
  343. .modal-leave-active .modal-container {
  344. -webkit-transform: scale(1.1);
  345. transform: scale(1.1);
  346. }
  347. // liste de commandes
  348. .site-index, .user-commandes {
  349. #last-orders, #history-orders {
  350. tr.order-update {
  351. td {
  352. background-color: $color2 ;
  353. }
  354. .update {
  355. color: $color1 ;
  356. }
  357. }
  358. tr.order-delete {
  359. td {
  360. background-color: lighten(#C9302C, 40);
  361. }
  362. .delete {
  363. color: #C9302C ;
  364. }
  365. }
  366. td.history {
  367. min-width: 170px ;
  368. .small {
  369. margin-bottom: 7px ;
  370. }
  371. strong {
  372. }
  373. }
  374. .small, .locality {
  375. font-size: 12px ;
  376. color: gray ;
  377. }
  378. .comment {
  379. font-size: 12px ;
  380. }
  381. .date {
  382. text-align: center ;
  383. }
  384. .comment {
  385. position: relative ;
  386. margin-top: 4px ;
  387. padding-left: 20px ;
  388. font-style: italic ;
  389. .glyphicon {
  390. position: absolute ;
  391. left: 0px ;
  392. }
  393. }
  394. }
  395. }
  396. // tableau de bord
  397. .site-index {
  398. .panel {
  399. .panel-title {
  400. .btn {
  401. float: right ;
  402. font-family: 'myriadpro-regular' ;
  403. &.margin-left {
  404. margin-left: 5px ;
  405. }
  406. }
  407. }
  408. .panel-body {
  409. //height: 250px ;
  410. }
  411. }
  412. #billing {
  413. h2 {
  414. font-size: 25px ;
  415. text-align: center ;
  416. }
  417. .current-month {
  418. .amount span {
  419. background-color: white ;
  420. color: #333 ;
  421. border: solid 1px gray ;
  422. }
  423. }
  424. .amount {
  425. margin-top: 35px ;
  426. text-align: center ;
  427. span {
  428. font-size: 22px ;
  429. color: white ;
  430. background-color: $color1 ;
  431. padding: 7px 10px 3px;
  432. font-family: 'myriadpro-regular' ;
  433. @include border-radius(5px) ;
  434. }
  435. }
  436. }
  437. }
  438. #page-order {
  439. #row2 {
  440. }
  441. h1 {
  442. .btn-group {
  443. float: right ;
  444. }
  445. }
  446. #col-left, #col-right {
  447. padding-left: 0px ;
  448. padding-right: 0px ;
  449. }
  450. #col-right {
  451. padding-left: 20px ;
  452. }
  453. #jours-production {
  454. display: none ;
  455. }
  456. #calendar {
  457. h2 {
  458. font-size: 20px ;
  459. position: relative ;
  460. top: 3px ;
  461. }
  462. .fc-header-title {
  463. margin-left: 10px ;
  464. }
  465. $back-day-with-event: lighten(#FDD44B,13) ;
  466. //$back-day-with-event: #FDD44B ;
  467. .dayWithEvent {
  468. background-color: $back-day-with-event ;
  469. cursor: pointer;
  470. }
  471. .fc-event-container {display: none;}
  472. .fc-today {
  473. border-bottom: solid 1px #C9302C ;
  474. background-color: white ;
  475. &.dayWithEvent {
  476. background-color: $back-day-with-event ;
  477. }
  478. }
  479. .fc-day {
  480. cursor: pointer ;
  481. text-align: center ;
  482. &:hover {
  483. @include box-shadow(0px 0px 2px black inset) ;
  484. }
  485. }
  486. .current-date {
  487. @include box-shadow(0px 0px 2px black inset) ;
  488. }
  489. .fc-day-number {
  490. float: none ;
  491. padding-top: 2px ;
  492. }
  493. }
  494. .btn-active-week {
  495. display: block ;
  496. margin-top: 10px ;
  497. }
  498. #bloc-production {
  499. .label {
  500. float: right ;
  501. font-size: 13px ;
  502. }
  503. #productions-point-vente {
  504. margin-top: 15px ;
  505. padding: 10px ;
  506. border: solid 1px #e0e0e0 ;
  507. background-color: #F5F5F5 ;
  508. @include border-radius(5px) ;
  509. label {
  510. display: block ;
  511. font-weight: normal ;
  512. }
  513. .checkbox-list {
  514. margin-left: 10px ;
  515. margin-top: 10px ;
  516. }
  517. }
  518. }
  519. #produits-production {
  520. .overflow {
  521. table {
  522. width: 100%;
  523. }
  524. thead, tbody, tr, td, th { display: block; }
  525. tr:after {
  526. content: ' ';
  527. display: block;
  528. visibility: hidden;
  529. clear: both;
  530. }
  531. thead th {
  532. height: 30px;
  533. }
  534. tbody {
  535. height: 500px;
  536. overflow-y: auto;
  537. }
  538. thead {
  539. }
  540. thead th {
  541. width: 32%;
  542. float: left;
  543. }
  544. tbody td{
  545. width: 33%;
  546. float: left;
  547. }
  548. .td-produit {
  549. width: 60% ;
  550. }
  551. .td-active, .td-max {
  552. width: 20% ;
  553. text-align: center ;
  554. }
  555. thead {
  556. .td-product {
  557. width: 57% ;
  558. }
  559. }
  560. }
  561. input.quantity-max {
  562. background-color: white;
  563. border: 1px solid #e0e0e0;
  564. text-align: center;
  565. width: 50px;
  566. }
  567. td {
  568. label {
  569. font-weight: normal ;
  570. }
  571. }
  572. }
  573. #btn-export-commandes,
  574. #btn-commandes-auto {
  575. float: right ;
  576. position: relative;
  577. top: -5px ;
  578. right: -7px ;
  579. padding: 2px 5px ;
  580. }
  581. #btn-export-commandes,
  582. #btn-commandes-auto {
  583. color: white ;
  584. margin-left: 10px ;
  585. padding: 1px 5px ;
  586. }
  587. #btn-commandes-auto {
  588. top: -7px ;
  589. .btn {
  590. padding: 2px 5px;
  591. span {
  592. top: 2px ;
  593. }
  594. }
  595. }
  596. #bloc-totaux {
  597. .table-products {
  598. .depasse {
  599. color: #b32815 ;
  600. }
  601. .total strong span {
  602. font-weight: normal ;
  603. font-size: 13px ;
  604. }
  605. }
  606. }
  607. #commandes-points-vente {
  608. .tab-pane {
  609. padding-top: 20px ;
  610. }
  611. .recap-pv {
  612. &.no-commande {
  613. .recettes {
  614. display: none;
  615. }
  616. }
  617. .recettes {
  618. float: right ;
  619. color: $color1 ;
  620. border: solid 1px $color1 ;
  621. padding: 4px 10px ;
  622. @include border-radius(10px) ;
  623. font-weight: bold ;
  624. position: relative ;
  625. top: -3px ;
  626. }
  627. }
  628. .alert.comment {
  629. display: none ;
  630. }
  631. ul.liste-commandes {
  632. margin-top: 10px ;
  633. list-style-type: none ;
  634. height: 100% ;
  635. max-height: 400px ;
  636. margin-left: 0 ;
  637. padding-left: 0 ;
  638. margin-top: 0px ;
  639. width: 100% ;
  640. overflow-y: scroll ;
  641. &.no-commande {
  642. display: none ;
  643. }
  644. li {
  645. padding: 0 ;
  646. margin: 0 ;
  647. a {
  648. text-align: left;
  649. @include border-radius(0px) ;
  650. display: block ;
  651. padding: 7px ;
  652. color: #333 ;
  653. .montant {
  654. float: right ;
  655. color: $color1 ;
  656. font-weight: bold ;
  657. &.paye {
  658. color: #5cb85c ;
  659. color: #519951 ;
  660. }
  661. }
  662. .glyphicon-comment {
  663. color: $color1 ;
  664. }
  665. &:hover, &:active, &.active {
  666. text-decoration: none ;
  667. background-color: #FCF8E3 ;
  668. outline: none ;
  669. border-color: #ccc ;
  670. @include transition(all 0.1s) ;
  671. }
  672. }
  673. }
  674. }
  675. .creer-commande,
  676. .commandes-auto {
  677. width: 100% ;
  678. margin-bottom: 10px ;
  679. }
  680. .bloc-commande {
  681. padding-top: 20px ;
  682. margin-top: 20px ;
  683. display: none ;
  684. }
  685. .title-user {
  686. display: none ;
  687. font-size: 19px ;
  688. margin-top: 0px ;
  689. font-family: "Helvetica Neue",Helvetica,Arial,sans-serif ;
  690. .btn-edit, .btn-remove,
  691. .btn-cancel, .btn-save {
  692. float: right ;
  693. position: relative ;
  694. top: -6px ;
  695. }
  696. .btn-edit, .btn-cancel {
  697. margin-right: 10px ;
  698. }
  699. .buttons-save-cancel {
  700. display: none ;
  701. }
  702. .choix-user {
  703. display: none ;
  704. .form-control {
  705. width: 200px ;
  706. display: inline ;
  707. }
  708. }
  709. }
  710. table.table-produits {
  711. .td-order {
  712. text-align: center ;
  713. }
  714. input.form-control {
  715. text-align: center ;
  716. }
  717. tr.disabled {
  718. .td-product {
  719. color: gray ;
  720. }
  721. }
  722. }
  723. .td-produit,
  724. .th-produit {
  725. width: 70% ;
  726. }
  727. .td-commande,
  728. .th-commande {
  729. width: 30% ;
  730. text-align: center ;
  731. }
  732. .td-produit {
  733. text-transform: uppercase ;
  734. }
  735. .td-commande {
  736. font-weight: bold ;
  737. }
  738. .td-total {
  739. font-size: 18px ;
  740. text-align: center ;
  741. span {
  742. padding: 2px 10px ;
  743. background-color: $color1 ;
  744. color: white ;
  745. font-weight: bold ;
  746. @include border-radius(8px) ;
  747. }
  748. }
  749. .td-paiement {
  750. .buttons-credit {
  751. float: right ;
  752. }
  753. }
  754. .panel-commande-auto {
  755. .field-subscriptionform-id_user,
  756. .field-subscriptionform-id_producer
  757. {
  758. display: none ;
  759. }
  760. .days {
  761. .form-group {
  762. float: left ;
  763. margin-right: 10px ;
  764. }
  765. }
  766. }
  767. }
  768. #old-commandes {
  769. display: none ;
  770. }
  771. .form-commandes-point-vente {
  772. margin-top: 20px ;
  773. table {
  774. border-bottom: solid 1px #e0e0e0 ;
  775. }
  776. .title-point-sale {
  777. background-color: lighten(#fdd44b, 30) ;
  778. border-left: solid 3px $color1 ;
  779. font-weight: bold ;
  780. text-align: left ;
  781. padding: 10px ;
  782. }
  783. .title-totals {
  784. text-align: center ;
  785. }
  786. .border-left {
  787. border-left: solid 1px #e0e0e0 ;
  788. }
  789. .border-right {
  790. border-right: solid 1px #e0e0e0 ;
  791. }
  792. input.quantity {
  793. width: 30px ;
  794. background-color: white ;
  795. border: solid 1px #e0e0e0 ;
  796. text-align: center ;
  797. }
  798. .td-product {
  799. text-align: center ;
  800. }
  801. .submit-point-sale {
  802. float: right ;
  803. }
  804. .select-user {
  805. background-color: #F9F9F9 ;
  806. border: solid 1px #e0e0e0 ;
  807. }
  808. .date-order {
  809. font-size: 12px ;
  810. }
  811. .datepicker, .text {
  812. background-color: white ;
  813. border: solid 1px #e0e0e0 ;
  814. margin-top: 3px ;
  815. width: 100px ;
  816. }
  817. td.center {
  818. text-align: center ;
  819. }
  820. .depasse {
  821. color: #b32815 ;
  822. }
  823. .total strong span {
  824. font-weight: normal ;
  825. font-size: 13px ;
  826. }
  827. td.user {
  828. text-align: left ;
  829. padding: 3px ;
  830. .date-order {
  831. color: gray ;
  832. }
  833. }
  834. }
  835. .table-header-rotated {
  836. border-top: 0px ;
  837. border-left: 0px ;
  838. border-right: 0px ;
  839. width: 100% ;
  840. width: auto ;
  841. .total strong {
  842. border-bottom: solid 1px gray ;
  843. }
  844. }
  845. .table-header-rotated th.row-header{
  846. width: auto;
  847. }
  848. .table-header-rotated td{
  849. width: 40px;
  850. border-top: 1px solid #dddddd;
  851. border-left: 1px solid #dddddd;
  852. border-right: 1px solid #dddddd;
  853. vertical-align: middle;
  854. text-align: center;
  855. }
  856. .table-header-rotated th.rotate-45{
  857. font-weight: normal ;
  858. height: 80px;
  859. width: 40px;
  860. min-width: 40px;
  861. max-width: 40px;
  862. position: relative;
  863. vertical-align: bottom;
  864. padding: 0;
  865. font-size: 14px;
  866. line-height: 1;
  867. border: 0px none;
  868. }
  869. .table-header-rotated th.rotate-45 > div{
  870. background-color: #F5F5F5 ;
  871. position: relative;
  872. top: 0px;
  873. left: 40px; /* 80 * tan(45) / 2 = 40 where 80 is the height on the cell and 45 is the transform angle*/
  874. height: 100%;
  875. -ms-transform:skew(-45deg,0deg);
  876. -moz-transform:skew(-45deg,0deg);
  877. -webkit-transform:skew(-45deg,0deg);
  878. -o-transform:skew(-45deg,0deg);
  879. transform:skew(-45deg,0deg);
  880. overflow: hidden;
  881. border-left: 1px solid #dddddd;
  882. border-right: 1px solid #dddddd;
  883. border-top: 1px solid #dddddd;
  884. }
  885. .table-header-rotated th.rotate-45 span {
  886. -ms-transform:skew(45deg,0deg) rotate(315deg);
  887. -moz-transform:skew(45deg,0deg) rotate(315deg);
  888. -webkit-transform:skew(45deg,0deg) rotate(315deg);
  889. -o-transform:skew(45deg,0deg) rotate(315deg);
  890. transform:skew(45deg,0deg) rotate(315deg);
  891. position: absolute;
  892. bottom: 30px; /* 40 cos(45) = 28 with an additional 2px margin*/
  893. left: -25px; /*Because it looked good, but there is probably a mathematical link here as well*/
  894. display: inline-block;
  895. // width: 100%;
  896. width: 85px; /* 80 / cos(45) - 40 cos (45) = 85 where 80 is the height of the cell, 40 the width of the cell and 45 the transform angle*/
  897. text-align: left;
  898. // white-space: nowrap; /*whether to display in one line or not*/
  899. }
  900. .table-header-rotated .disabled {
  901. color: gray ;
  902. }
  903. }
  904. .product-create, .product-update {
  905. #days-distribution {
  906. .form-group {
  907. float: left ;
  908. margin-right: 15px ;
  909. label {
  910. font-weight: normal ;
  911. }
  912. }
  913. }
  914. .field-product-id_producer {
  915. display: none;
  916. }
  917. }
  918. .table-striped > tbody > tr:nth-of-type(2n) {
  919. background-color: white ;
  920. }
  921. /* communiquer */
  922. .communicate-index {
  923. #email {
  924. .btn-point-sale {
  925. margin-bottom: 8px ;
  926. margin-right: 5px ;
  927. }
  928. }
  929. }
  930. .communicate-instructions {
  931. border: solid 1px #e0e0e0 ;
  932. padding: 10px ;
  933. @include border-radius(10px) ;
  934. margin-bottom: 30px ;
  935. font-family: 'Arial' ;
  936. .header {
  937. .logo {
  938. display: none ;
  939. float: left ;
  940. width: 75px ;
  941. padding-right: 20px ;
  942. padding-top: 10px ;
  943. img {
  944. width: 75px ;
  945. }
  946. }
  947. }
  948. h1, h2, h3, h4 {
  949. text-align: center ;
  950. }
  951. h1 {
  952. font-family: 'highvoltageregular' ;
  953. font-size: 40px ;
  954. line-height: 40px ;
  955. margin-top: 0px ;
  956. margin-bottom: 0px ;
  957. font-weight: normal ;
  958. }
  959. h2 {
  960. margin-top: 0px ;
  961. font-family: 'capsuularegular' ;
  962. font-size: 20px ;
  963. margin-top: 0px ;
  964. position: relative ;
  965. left: 2px ;
  966. font-weight: normal ;
  967. }
  968. h3 {
  969. font-size: 18px ;
  970. color: $color1 ;
  971. margin-top: 0px ;
  972. margin-bottom: 0px ;
  973. line-height: 20px;
  974. font-family: 'capsuularegular' ;
  975. }
  976. h4 {
  977. font-size: 16px ;
  978. margin-top: 8px ;
  979. font-weight: normal;
  980. font-family: 'capsuularegular' ;
  981. span {
  982. border-bottom: dotted 1px black ;
  983. }
  984. }
  985. }
  986. .communicate-instructions-inset {
  987. width: auto ;
  988. margin-top: 20px ;
  989. .header {
  990. .logo {
  991. width: 60px ;
  992. margin-right: 20px ;
  993. padding-top: 5px ;
  994. img {
  995. width: 60px ;
  996. }
  997. }
  998. h1 {
  999. margin-bottom: 3px ;
  1000. }
  1001. }
  1002. h3 {
  1003. margin-top: 15px ;
  1004. margin-bottom: 0px ;
  1005. font-size: 18px ;
  1006. }
  1007. h4 {
  1008. }
  1009. }
  1010. .block-instructions-pdf {
  1011. width: 49.9% ;
  1012. float: left;
  1013. border-bottom: dotted 1px gray ;
  1014. }
  1015. .block-instructions-border {
  1016. border-right: dotted 1px gray ;
  1017. border-bottom: dotted 1px gray ;
  1018. }
  1019. .communicate-instructions-pdf {
  1020. border: 0px none ;
  1021. //border-bottom: dotted 1px gray ;
  1022. @include border-radius(0px) ;
  1023. margin-bottom: 0px;
  1024. padding: 20px 0px 20px 30px ;
  1025. .header {
  1026. .logo {
  1027. float: left ;
  1028. width: 55px ;
  1029. padding-right: 15px ;
  1030. padding-top: 10px ;
  1031. img {
  1032. width: 55px ;
  1033. }
  1034. }
  1035. h1 {
  1036. font-size: 32px ;
  1037. }
  1038. h2 {
  1039. font-size: 16px ;
  1040. }
  1041. }
  1042. h3 {
  1043. font-weight: normal ;
  1044. }
  1045. }
  1046. .block-instructions-bottom {
  1047. border-bottom: 0px none ;
  1048. border-bottom: solid 1px white;
  1049. }
  1050. /* abonnements */
  1051. .subscription-form {
  1052. #block-select-user {
  1053. padding-left: 0px ;
  1054. }
  1055. #or-user {
  1056. font-size: 20px ;
  1057. text-align: center ;
  1058. span {
  1059. position: relative ;
  1060. top: 24px ;
  1061. }
  1062. }
  1063. .field-subscriptionform-id_producer {
  1064. display: none ;
  1065. }
  1066. .days {
  1067. .form-group {
  1068. float: left;
  1069. margin-right: 20px ;
  1070. }
  1071. }
  1072. .products {
  1073. .table {
  1074. width: 500px ;
  1075. }
  1076. .quantity {
  1077. text-align: center ;
  1078. }
  1079. }
  1080. }
  1081. /* points de vente */
  1082. .point-sale-form {
  1083. #pointsale-users {
  1084. display: none ;
  1085. height: 500px ;
  1086. overflow-y: scroll ;
  1087. label {
  1088. font-weight: normal ;
  1089. display: block ;
  1090. }
  1091. .comment {
  1092. display: none ;
  1093. margin-left: 17px ;
  1094. width: 200px ;
  1095. }
  1096. }
  1097. #delivery-days {
  1098. .form-group {
  1099. float: left ;
  1100. margin-right: 15px ;
  1101. label {
  1102. font-weight: normal ;
  1103. }
  1104. }
  1105. }
  1106. }
  1107. /* utilisateurs */
  1108. #menu-users {
  1109. #nav-points-sale {
  1110. margin-bottom: 30px ;
  1111. }
  1112. #submenu {
  1113. margin-bottom: 30px ;
  1114. text-align: left ;
  1115. }
  1116. a {
  1117. margin-bottom: 15px ;
  1118. }
  1119. }
  1120. .user-index {
  1121. .input-group {
  1122. width: 180px ;
  1123. .input-credit {
  1124. text-align: center ;
  1125. }
  1126. }
  1127. }
  1128. .user-credit {
  1129. .the-credit {
  1130. float: right ;
  1131. font-weight: bold ;
  1132. background-color: $color1 ;
  1133. color: white ;
  1134. @include border-radius(8px) ;
  1135. padding: 3px 10px ;
  1136. padding-top: 7px ;
  1137. position: relative ;
  1138. top: -12px ;
  1139. }
  1140. }
  1141. /* facturation */
  1142. #free-price {
  1143. padding: 20px ;
  1144. background-color: #F9F9F9 ;
  1145. h2 {
  1146. font-family: 'myriadpro-it' ;
  1147. }
  1148. .amount {
  1149. span {
  1150. font-size: 25px ;
  1151. color: white ;
  1152. background-color: $color1 ;
  1153. @include border-radius(5px) ;
  1154. padding: 3px 10px ;
  1155. padding-top: 7px ;
  1156. font-family: 'myriadpro-regular' ;
  1157. }
  1158. }
  1159. label {
  1160. text-transform: uppercase ;
  1161. font-family: "myriadpro-light" ;
  1162. font-size: 20px ;
  1163. span {
  1164. font-size: 16px ;
  1165. }
  1166. }
  1167. .field-producer-free_price {
  1168. .input-group {
  1169. width: 200px ;
  1170. }
  1171. }
  1172. .field-user-free_price {
  1173. label {
  1174. display: none ;
  1175. }
  1176. }
  1177. #producer-free_price {
  1178. width: 100px ;
  1179. height: 60px ;
  1180. font-size: 30px ;
  1181. padding: 10px ;
  1182. text-align: center ;
  1183. }
  1184. }
  1185. .development-index {
  1186. ul#tabs-status-developments {
  1187. margin-bottom: 30px ;
  1188. border-bottom: solid 3px $color1 ;
  1189. a {
  1190. text-transform: uppercase ;
  1191. }
  1192. .active {
  1193. border: 0px none ;
  1194. background: none ;
  1195. a {
  1196. background-color: $color1 ;
  1197. color: white ;
  1198. }
  1199. }
  1200. }
  1201. #tab-developments {
  1202. .btn-group-priority {
  1203. width: 100% ;
  1204. margin-bottom: 5px ;
  1205. .btn-priority {
  1206. display: block ;
  1207. float: none ;
  1208. width: 100% ;
  1209. }
  1210. }
  1211. .label-priority {
  1212. display: block ;
  1213. width: 100% ;
  1214. margin-bottom: 2px ;
  1215. padding: 5px 8px ;
  1216. }
  1217. }
  1218. }
  1219. /* stats */
  1220. .stats-products {
  1221. #nav-year {
  1222. float: right ;
  1223. }
  1224. tr.month {
  1225. th {
  1226. text-align: center ;
  1227. }
  1228. }
  1229. tr.sub-head {
  1230. th {
  1231. font-weight: normal ;
  1232. font-size: 12px ;
  1233. }
  1234. }
  1235. td.name {
  1236. text-transform: uppercase ;
  1237. }
  1238. td.align-center {
  1239. text-align: center ;
  1240. }
  1241. }
  1242. @import "_adminlte.scss" ;
  1243. @import "_alerts.scss" ;
  1244. @import "site/_index.scss" ;
  1245. @import "subscription/_index.scss" ;
  1246. @import "subscription/_form.scss" ;
  1247. @import "product/_index.scss" ;
  1248. @import "product/_form.scss" ;
  1249. @import "stats/_products.scss" ;
  1250. @import "distribution/_index.scss" ;
  1251. @import "user/_emails.scss" ;
  1252. @import "user/_credit.scss" ;
  1253. @import "user/_form.scss" ;
  1254. @import "producer/_update.scss" ;
  1255. @import "point_sale/_index.scss" ;
  1256. @import "report/_index.scss" ;
  1257. @import "document/_form.scss" ;
  1258. @import "document/_index.scss" ;
  1259. @import "_responsive.scss" ;