_variables.scss 2.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103
  1. // Sizes
  2. $header-height: 5rem;
  3. $footer-height: 6rem;
  4. $border-radius: 3px;
  5. // Font Weights
  6. $font-weight-bold: 600;
  7. $font-weight-regular: 400;
  8. $font-weight-light:300;
  9. // Global Paddings
  10. $padding-horiz: 7rem;
  11. $padding-vert: 3rem;
  12. // $header-width: calc(100vw/8);
  13. $header-width:20rem;
  14. $column-width: calc(100vw/2.5);
  15. $column-width2: calc((100%/2.4) * 4);
  16. $imgpath:("../images/point.svg");
  17. $imgpath-b:("../images/point_b.svg");
  18. $imgpath2:("../images/fleche.svg");
  19. $imgpath3:("../images/trait.svg");
  20. @mixin background-nav($imgpath-b,$position:0 0,$repeat: no-repeat,$size:5px 5px, $content:" ") {
  21. background: {
  22. image: url($imgpath-b);
  23. position: $position;
  24. repeat: $repeat;
  25. size: $size;
  26. }
  27. }
  28. @mixin background-nav-content-b{
  29. display: inline-block;
  30. content: " ";
  31. width: 5px;
  32. height: 5px;
  33. margin:0 5px 1px 0px;
  34. }
  35. @mixin background-nav-b($imgpath,$position:0 0,$repeat: no-repeat,$size:3.5px 3.5px, $content:" ") {
  36. background: {
  37. image: url($imgpath);
  38. position: $position;
  39. repeat: $repeat;
  40. size: $size;
  41. }
  42. }
  43. @mixin background-nav-content{
  44. display: inline-block;
  45. content: " ";
  46. width: 3.5px;
  47. height: 3.5px;
  48. margin:0 5px 1px 0px;
  49. }
  50. @mixin background-link($imgpath2,$position:0 0,$repeat: no-repeat,$size:12px 5px, $content:" ") {
  51. background: {
  52. image: url($imgpath2);
  53. position: $position;
  54. repeat: $repeat;
  55. size: $size;
  56. }
  57. display: inline-block;
  58. width: 12px;
  59. height: 5px;
  60. margin:0 0px 1px 5px;
  61. }
  62. @mixin background-nav-content-s{
  63. display: block;
  64. content: " ";
  65. width: 5px;
  66. height: 5px;
  67. margin: -2.5px 0px 0px -2.5px;
  68. }
  69. @mixin background-nav-sm($imgpath3,$position:0 0,$repeat: no-repeat,$size:1px 10px, $content:" ") {
  70. background: {
  71. image: url($imgpath3);
  72. position: $position;
  73. repeat: $repeat;
  74. size: $size;
  75. }
  76. display:block;
  77. width: 1px;
  78. height: 10px;
  79. margin-left: 37px;
  80. margin-top: -5px;
  81. content: " ";
  82. }
  83. //
  84. // @mixin background-nav-content-sm{
  85. // display: block;
  86. // width: 1px;
  87. // height: 10px;
  88. // }