_footer.scss 3.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147
  1. #fotter-bottom{
  2. box-shadow: 1px 0px 8px $black;
  3. display: flex;
  4. flex: 1 1 120px;
  5. flex-direction: row;
  6. background-color: $white;
  7. padding-top: 3rem;
  8. @media (max-width: 810px){
  9. flex-direction: column;
  10. }
  11. .region{
  12. display: block;
  13. padding-left: 2rem;
  14. padding-right: 1rem;
  15. padding-bottom: 1rem;
  16. border-left: $blue-light solid 1px;
  17. h2{
  18. margin-top: 0;
  19. color: $blue-dark;
  20. font-size: 1.2rem;
  21. }
  22. }
  23. .region-footer-bottom-left{
  24. margin-left: 3rem;
  25. border: none;
  26. width: 20%;
  27. @media (max-width: 810px){
  28. width: 100%;
  29. margin-left: 0rem;
  30. }
  31. .view-id-partenaires{
  32. .view-content{
  33. display: flex;
  34. flex-direction: row;
  35. justify-content:flex-start;
  36. flex-wrap: wrap;
  37. padding-top: 1rem;
  38. .node-type-partenaires_logo_footer_{
  39. padding-right: 1rem;
  40. padding-bottom: 1rem;
  41. }
  42. }
  43. }
  44. .block-views-blockpartenaires-block-3{
  45. img{
  46. width: auto;
  47. height: 30px;
  48. }
  49. }
  50. }
  51. .region-footer-bottom-right{
  52. width: 30%;
  53. display: flex;
  54. flex-direction: column-reverse;
  55. justify-content: flex-end;
  56. @media (max-width: 810px){
  57. width: 100%;
  58. }
  59. #block-socialnetwork {
  60. margin-bottom: 1rem;
  61. .field--name-body{
  62. p{
  63. margin-top: 0;
  64. display: flex;
  65. flex-direction: row-reverse;
  66. justify-content: flex-end;
  67. a{
  68. color: $white;
  69. font-size: 0;
  70. padding-left: 1rem;
  71. }
  72. svg.ext{
  73. display: none;
  74. }
  75. .link-twitter{
  76. display: flex;
  77. &:before{
  78. content: url("../images/pictos/twitter_black.svg");
  79. min-width: 50px;
  80. }
  81. }
  82. .link-youtube{
  83. display: flex;
  84. &:before{
  85. content: url("../images/pictos/youtube_black.svg");
  86. min-width: 50px;
  87. }
  88. }
  89. .link-linkedin{
  90. display: flex;
  91. &:before{
  92. content: url("../images/pictos/linkedin_black.svg");
  93. min-width: 50px;
  94. }
  95. }
  96. }
  97. }
  98. }
  99. #block-pieddepage ul{
  100. margin-top: 0;
  101. color: $blue-dark;
  102. font-weight: 800;
  103. list-style: none;
  104. padding-left: 0;
  105. a{
  106. color: $blue-dark;
  107. font-size: 1.2rem;
  108. text-decoration: underline;
  109. margin-top: 0;
  110. }
  111. }
  112. }
  113. .region-footer-bottom-middle{
  114. width: 60%;
  115. @media (max-width: 810px){
  116. width: 100%;
  117. }
  118. .view-id-partenaires{
  119. .view-content{
  120. display: flex;
  121. flex-direction: row;
  122. justify-content:flex-start;
  123. flex-wrap: wrap;
  124. .node-type-partenaires_logo_footer_{
  125. padding-right: 1rem;
  126. padding-bottom: 1rem;
  127. }
  128. }
  129. }
  130. }
  131. }