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.

873 lines
20KB

  1. /* Welcome to Compass.
  2. * In this file you should write your main styles. (or centralize your imports)
  3. * Import this file using the following HTML or equivalent:
  4. * <link href="/stylesheets/screen.css" media="screen, projection" rel="stylesheet" type="text/css" /> */
  5. @import "compass" ;
  6. $dir-fonts: '../fonts/' ;
  7. @import "_fonts.scss" ;
  8. $color1: #BB8757 ;
  9. $color2: #F8F1DD ;
  10. .clr {
  11. clear: both ;
  12. }
  13. a {
  14. color: $color1;
  15. &:hover, &:focus, &:active {
  16. color: darken($color1, 10) ;
  17. }
  18. }
  19. .pagination > .active > a, .pagination > .active > span, .pagination > .active > a:hover, .pagination > .active > span:hover, .pagination > .active > a:focus, .pagination > .active > span:focus {
  20. background-color: $color1 ;
  21. border: solid 1px $color1 ;
  22. }
  23. .pagination > li > a, .pagination > li > span {
  24. color: $color1 ;
  25. &:hover {
  26. color: darken($color1, 10) ;
  27. }
  28. }
  29. .wrap {
  30. .btn-primary,
  31. .btn-success {
  32. background-color: $color1 ;
  33. border: solid 1px $color1 ;
  34. &:hover, &:focus, &:active {
  35. background-color: darken($color1, 10) ;
  36. border: solid 1px darken($color1, 10) ;
  37. }
  38. }
  39. }
  40. .nav-header {
  41. .retour-site {
  42. border-left : solid 1px $color2 ;
  43. padding: 10px 15px ;
  44. }
  45. }
  46. .navbar-brand {
  47. .logo {
  48. height: 40px ;
  49. position: relative ;
  50. top: -10px ;
  51. }
  52. }
  53. .container-body {
  54. padding-top: 117px ;
  55. padding-bottom: 50px ;
  56. }
  57. .navbar-inverse {
  58. background-color: $color1 ;
  59. border-bottom: 0px none ;
  60. .navbar-nav {
  61. padding-top: 12px ;
  62. }
  63. .navbar-nav > li > a {
  64. color: white ;
  65. padding: 3px 14px ;
  66. &:hover {
  67. color: $color2 ;
  68. //background-color: $color2 ;
  69. }
  70. }
  71. .navbar-nav > li.active {
  72. a {
  73. background-color: $color2 ;
  74. color: $color1 ;
  75. padding: 3px 14px ;
  76. @include border-radius(10px) ;
  77. &:hover {
  78. background-color: $color2 ;
  79. color: $color1 ;
  80. }
  81. }
  82. }
  83. }
  84. #alerts-fixed {
  85. position: fixed ;
  86. bottom: 20px ;
  87. left: 20px ;
  88. .alert {
  89. margin-top: 20px ;
  90. }
  91. }
  92. .nom-boulange {
  93. //font-family: 'Georgia' ;
  94. margin-bottom: 15px ;
  95. text-align: left ;
  96. position: fixed ;
  97. top: 51px ;
  98. left: 0px ;
  99. width: 100% ;
  100. background-color: #515151 ;
  101. background-color: $color2 ;
  102. color: darken($color1,15) ;
  103. z-index: 100 ;
  104. font-size: 20px ;
  105. padding: 8px 15px ;
  106. padding-bottom: 2px ;
  107. padding-top: 5px ;
  108. border-bottom: solid 1px #e0e0e0 ;
  109. @include box-shadow(0px 0px 5px gray) ;
  110. #etat-paiement-etablissement {
  111. float: right ;
  112. text-align: right ;
  113. color: darken($color1,15) ;
  114. font-size: 16px ;
  115. .strong {
  116. background-color: white ;
  117. color: $color1 ;
  118. @include border-radius(10px) ;
  119. padding: 0px 10px ;
  120. }
  121. .btn {
  122. padding: 2px 5px ;
  123. }
  124. }
  125. }
  126. .table {
  127. thead {
  128. th.actions {
  129. width: 220px ;
  130. }
  131. th.order {
  132. width: 58px ;
  133. }
  134. th.actif {
  135. width: 75px ;
  136. text-align: center;
  137. }
  138. }
  139. tbody {
  140. td.center {
  141. text-align: center ;
  142. }
  143. }
  144. }
  145. #page-commande {
  146. #row2 {
  147. }
  148. h1 {
  149. .btn-group {
  150. float: right ;
  151. }
  152. }
  153. #jours-production {
  154. display: none ;
  155. }
  156. #calendar {
  157. h2 {
  158. font-size: 20px ;
  159. position: relative ;
  160. top: 3px ;
  161. }
  162. .fc-header-title {
  163. margin-left: 10px ;
  164. }
  165. $back-day-with-event: lighten(#FDD44B,13) ;
  166. //$back-day-with-event: #FDD44B ;
  167. .dayWithEvent {
  168. background-color: $back-day-with-event ;
  169. cursor: pointer;
  170. }
  171. .fc-event-container {display: none;}
  172. .fc-today {
  173. border-bottom: solid 1px #C9302C ;
  174. background-color: white ;
  175. &.dayWithEvent {
  176. background-color: $back-day-with-event ;
  177. }
  178. }
  179. .fc-day {
  180. cursor: pointer ;
  181. text-align: center ;
  182. &:hover {
  183. @include box-shadow(0px 0px 2px black inset) ;
  184. }
  185. }
  186. .current-date {
  187. @include box-shadow(0px 0px 2px black inset) ;
  188. }
  189. .fc-day-number {
  190. float: none ;
  191. padding-top: 2px ;
  192. }
  193. }
  194. #bloc-production {
  195. .label {
  196. float: right ;
  197. font-size: 13px ;
  198. }
  199. .btn-success {
  200. background-color: #5cb85c ;
  201. border-color: #4cae4c ;
  202. }
  203. }
  204. #produits-production {
  205. .overflow {
  206. //max-height: 400px ;
  207. //overflow-y: scroll ;
  208. table {
  209. width: 100%;
  210. }
  211. thead, tbody, tr, td, th { display: block; }
  212. tr:after {
  213. content: ' ';
  214. display: block;
  215. visibility: hidden;
  216. clear: both;
  217. }
  218. thead th {
  219. height: 30px;
  220. /*text-align: left;*/
  221. }
  222. tbody {
  223. height: 200px;
  224. overflow-y: auto;
  225. }
  226. thead {
  227. }
  228. thead th {
  229. width: 32%;
  230. float: left;
  231. }
  232. tbody td{
  233. width: 33%;
  234. float: left;
  235. }
  236. .td-produit {
  237. width: 60% ;
  238. }
  239. .td-actif, .td-max {
  240. width: 20% ;
  241. text-align: center ;
  242. }
  243. thead {
  244. .td-produit {
  245. width: 57% ;
  246. }
  247. }
  248. }
  249. input.quantite-max {
  250. background-color: white;
  251. border: 1px solid #e0e0e0;
  252. text-align: center;
  253. width: 50px;
  254. }
  255. td {
  256. label {
  257. font-weight: normal ;
  258. }
  259. }
  260. }
  261. #btn-export-commandes,
  262. #btn-commande-auto {
  263. float: right ;
  264. position: relative;
  265. top: -5px ;
  266. right: -7px ;
  267. padding: 2px 5px ;
  268. }
  269. #btn-export-commandes {
  270. color: white ;
  271. margin-left: 10px ;
  272. padding: 1px 5px ;
  273. }
  274. #bloc-totaux {
  275. .table-produits {
  276. .depasse {
  277. color: #b32815 ;
  278. }
  279. .total strong span {
  280. font-weight: normal ;
  281. font-size: 13px ;
  282. }
  283. }
  284. }
  285. #commandes-points-vente {
  286. .tab-pane {
  287. padding-top: 20px ;
  288. }
  289. .recap-pv {
  290. &.no-commande {
  291. .recettes {
  292. display: none;
  293. }
  294. }
  295. .recettes {
  296. float: right ;
  297. color: $color1 ;
  298. //background-color: $color1 ;
  299. border: solid 1px $color1 ;
  300. padding: 4px 10px ;
  301. @include border-radius(10px) ;
  302. font-weight: bold ;
  303. position: relative ;
  304. top: -3px ;
  305. }
  306. }
  307. .alert.commentaire {
  308. display: none ;
  309. }
  310. ul.liste-commandes {
  311. margin-top: 10px ;
  312. list-style-type: none ;
  313. height: 100% ;
  314. max-height: 400px ;
  315. //border: solid 1px #e0e0e0 ;
  316. margin-left: 0 ;
  317. padding-left: 0 ;
  318. margin-top: 0px ;
  319. width: 100% ;
  320. overflow-y: scroll ;
  321. li {
  322. padding: 0 ;
  323. margin: 0 ;
  324. a {
  325. text-align: left;
  326. @include border-radius(0px) ;
  327. display: block ;
  328. padding: 7px ;
  329. //border-bottom: solid 1px #e0e0e0 ;
  330. color: #333 ;
  331. .montant {
  332. float: right ;
  333. color: $color1 ;
  334. font-weight: bold ;
  335. }
  336. .glyphicon-comment {
  337. color: $color1 ;
  338. }
  339. &:hover, &:active, &.active {
  340. text-decoration: none ;
  341. //background-color: #F5F5F5 ;
  342. //background-color: lighten($color2,5) ;
  343. background-color: #FCF8E3 ;
  344. //border-right: solid 3px $color1 ;
  345. outline: none ;
  346. border-color: #ccc ;
  347. @include transition(all 0.1s) ;
  348. }
  349. }
  350. }
  351. }
  352. .creer-commande {
  353. width: 100% ;
  354. }
  355. .title-user {
  356. display: none ;
  357. font-size: 19px ;
  358. margin-top: 0px ;
  359. .btn-edit, .btn-remove,
  360. .btn-cancel, .btn-save {
  361. float: right ;
  362. position: relative ;
  363. top: -6px ;
  364. }
  365. .btn-edit, .btn-cancel {
  366. margin-right: 10px ;
  367. }
  368. .buttons-save-cancel {
  369. display: none ;
  370. }
  371. .choix-user {
  372. display: none ;
  373. .form-control {
  374. width: 200px ;
  375. display: inline ;
  376. }
  377. }
  378. }
  379. table.table-produits {
  380. .td-commande {
  381. text-align: center ;
  382. }
  383. input.form-control {
  384. //width: 100px ;
  385. text-align: center ;
  386. }
  387. }
  388. .td-produit,
  389. .th-produit {
  390. width: 70% ;
  391. }
  392. .td-commande,
  393. .th-commande {
  394. width: 30% ;
  395. text-align: center ;
  396. }
  397. .td-produit {
  398. text-transform: uppercase ;
  399. }
  400. .td-commande {
  401. font-weight: bold ;
  402. }
  403. .td-total {
  404. font-size: 20px ;
  405. text-align: center ;
  406. span {
  407. padding: 5px 10px ;
  408. background-color: $color1 ;
  409. color: white ;
  410. font-weight: bold ;
  411. @include border-radius(15px ) ;
  412. }
  413. }
  414. .panel-commande-automatique {
  415. .field-commandeautoform-id_user,
  416. .field-commandeautoform-id_etablissement
  417. {
  418. display: none ;
  419. }
  420. .jours {
  421. .form-group {
  422. float: left ;
  423. margin-right: 10px ;
  424. }
  425. }
  426. }
  427. }
  428. #old-commandes {
  429. display: none ;
  430. }
  431. .form-commandes-point-vente {
  432. margin-top: 20px ;
  433. table {
  434. border-bottom: solid 1px #e0e0e0 ;
  435. }
  436. .title-point-vente {
  437. background-color: lighten(#fdd44b, 30) ;
  438. border-left: solid 3px $color1 ;
  439. font-weight: bold ;
  440. text-align: left ;
  441. padding: 10px ;
  442. }
  443. .title-totaux {
  444. text-align: center ;
  445. }
  446. .border-left {
  447. border-left: solid 1px #e0e0e0 ;
  448. }
  449. .border-right {
  450. border-right: solid 1px #e0e0e0 ;
  451. }
  452. input.quantite {
  453. //width: 50px ;
  454. width: 30px ;
  455. background-color: white ;
  456. border: solid 1px #e0e0e0 ;
  457. text-align: center ;
  458. }
  459. .td-produit {
  460. text-align: center ;
  461. }
  462. .submit-pv {
  463. float: right ;
  464. }
  465. .select-user {
  466. background-color: #F9F9F9 ;
  467. border: solid 1px #e0e0e0 ;
  468. }
  469. .date-commande {
  470. font-size: 12px ;
  471. }
  472. .datepicker, .text {
  473. background-color: white ;
  474. border: solid 1px #e0e0e0 ;
  475. margin-top: 3px ;
  476. width: 100px ;
  477. }
  478. td.center {
  479. text-align: center ;
  480. }
  481. .depasse {
  482. color: #b32815 ;
  483. }
  484. .total strong span {
  485. font-weight: normal ;
  486. font-size: 13px ;
  487. }
  488. .vrac {
  489. display: none ;
  490. }
  491. td.client {
  492. text-align: left ;
  493. padding: 3px ;
  494. .date-commande {
  495. color: gray ;
  496. }
  497. }
  498. }
  499. .table-header-rotated th.row-header{
  500. //width: auto;
  501. }
  502. .table-header-rotated td{
  503. width: 20px;
  504. padding: 0px ;
  505. border-top: 1px solid #dddddd;
  506. border-left: 1px solid #dddddd;
  507. border-right: 1px solid #dddddd;
  508. vertical-align: middle;
  509. text-align: center;
  510. }
  511. .table-header-rotated th.rotate-45{
  512. height: 80px;
  513. width: 20px;
  514. min-width: 20px;
  515. max-width: 20px;
  516. position: relative;
  517. vertical-align: bottom;
  518. padding: 0;
  519. font-size: 12px;
  520. line-height: 0.8;
  521. }
  522. .table-header-rotated th.rotate-45 > div{
  523. position: relative;
  524. top: 0px;
  525. left: 40px; /* 80 * tan(45) / 2 = 40 where 80 is the height on the cell and 45 is the transform angle*/
  526. height: 100%;
  527. -ms-transform:skew(-45deg,0deg);
  528. -moz-transform:skew(-45deg,0deg);
  529. -webkit-transform:skew(-45deg,0deg);
  530. -o-transform:skew(-45deg,0deg);
  531. transform:skew(-45deg,0deg);
  532. overflow: hidden;
  533. border-left: 1px solid #dddddd;
  534. border-right: 1px solid #dddddd;
  535. border-top: 1px solid #dddddd;
  536. }
  537. .table-header-rotated th.rotate-45 span {
  538. -ms-transform:skew(45deg,0deg) rotate(315deg);
  539. -moz-transform:skew(45deg,0deg) rotate(315deg);
  540. -webkit-transform:skew(45deg,0deg) rotate(315deg);
  541. -o-transform:skew(45deg,0deg) rotate(315deg);
  542. transform:skew(45deg,0deg) rotate(315deg);
  543. position: absolute;
  544. bottom: 30px; /* 40 cos(45) = 28 with an additional 2px margin*/
  545. bottom: 16px; // pour width 20px
  546. left: -25px; /*Because it looked good, but there is probably a mathematical link here as well*/
  547. left: 0px ;
  548. display: inline-block;
  549. // width: 100%;
  550. 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*/
  551. width: 43px ;
  552. text-align: left;
  553. white-space: nowrap; /*whether to display in one line or not*/
  554. }
  555. }
  556. #email-masse-form {
  557. #ids-users {
  558. line-height: 30px ;
  559. .label {
  560. text-transform: capitalize ;
  561. }
  562. }
  563. }
  564. .produit-create, .produit-update {
  565. #jours-production {
  566. .form-group {
  567. float: left ;
  568. margin-right: 15px ;
  569. label {
  570. font-weight: normal ;
  571. }
  572. }
  573. }
  574. .field-produit-id_etablissement {
  575. display: none;
  576. }
  577. }
  578. .table-striped > tbody > tr:nth-of-type(2n) {
  579. background-color: white ;
  580. }
  581. .wrap .produit-index {
  582. .td-photo {
  583. max-width: 100px ;
  584. width: 100px ;
  585. }
  586. .photo-produit {
  587. max-width: 100px ;
  588. }
  589. .ui-state-highlight {
  590. height: 75px;
  591. background-color: $color2 ;
  592. }
  593. }
  594. /* communiquer */
  595. .communiquer-mode-emploi {
  596. border: solid 1px #e0e0e0 ;
  597. padding: 10px ;
  598. @include border-radius(10px) ;
  599. margin-bottom: 30px ;
  600. font-family: 'myriadpro-regular' ;
  601. .header {
  602. .logo {
  603. float: left ;
  604. width: 75px ;
  605. padding-right: 20px ;
  606. padding-top: 10px ;
  607. img {
  608. width: 75px ;
  609. }
  610. }
  611. h1 {
  612. font-family: 'comfortaaregular' ;
  613. font-size: 40px ;
  614. margin-top: 0px ;
  615. margin-bottom: 0px ;
  616. font-weight: normal ;
  617. }
  618. h2 {
  619. margin-top: 0px ;
  620. font-family: 'myriadpro-regular' ;
  621. font-size: 20px ;
  622. margin-top: 0px ;
  623. position: relative ;
  624. left: 2px ;
  625. font-weight: normal ;
  626. }
  627. }
  628. h3 {
  629. font-family: 'comfortaalight' ;
  630. font-family: 'myriadpro-regular' ;
  631. font-size: 25px ;
  632. color: $color1 ;
  633. margin-top: 0px ;
  634. margin-bottom: 0px ;
  635. }
  636. }
  637. .communiquer-mode-emploi-encart {
  638. width: 420px ;
  639. margin-top: 20px ;
  640. .header {
  641. .logo {
  642. width: 60px ;
  643. margin-right: 20px ;
  644. padding-top: 5px ;
  645. img {
  646. width: 60px ;
  647. }
  648. }
  649. h1 {
  650. margin-bottom: 3px ;
  651. }
  652. h2 {
  653. }
  654. }
  655. h3 {
  656. margin-top: 15px ;
  657. margin-bottom: 15px ;
  658. }
  659. }
  660. .bloc-mode-emploi-pdf {
  661. width: 49.9% ;
  662. float: left;
  663. border-bottom: dotted 1px gray ;
  664. }
  665. .bloc-mode-emploi-border {
  666. border-right: dotted 1px gray ;
  667. border-bottom: dotted 1px gray ;
  668. }
  669. .communiquer-mode-emploi-pdf {
  670. border: 0px none ;
  671. //border-bottom: dotted 1px gray ;
  672. @include border-radius(0px) ;
  673. margin-bottom: 0px;
  674. padding: 20px 0px 20px 30px ;
  675. .header {
  676. .logo {
  677. float: left ;
  678. width: 55px ;
  679. padding-right: 15px ;
  680. padding-top: 10px ;
  681. img {
  682. width: 55px ;
  683. }
  684. }
  685. h1 {
  686. font-size: 32px ;
  687. }
  688. h2 {
  689. font-size: 16px ;
  690. }
  691. }
  692. h3 {
  693. font-weight: normal ;
  694. }
  695. }
  696. .bloc-mode-emploi-bottom {
  697. border-bottom: 0px none ;
  698. border-bottom: solid 1px white;
  699. }
  700. /* commandes auto */
  701. .commandeauto-form {
  702. .field-commandeautoform-id_etablissement {
  703. display: none ;
  704. }
  705. .jours {
  706. .form-group {
  707. float: left;
  708. margin-right: 20px ;
  709. }
  710. }
  711. .produits {
  712. .table {
  713. width: 500px ;
  714. }
  715. .quantite {
  716. text-align: center ;
  717. }
  718. }
  719. }