_lesprojets.scss 9.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208
  1. .path-projets{
  2. .region-content{
  3. #block-contenudelapageprincipale{
  4. span{
  5. padding-top: 3rem;
  6. padding-bottom: 3rem;
  7. vertical-align: middle;
  8. h2{
  9. margin: 0;
  10. padding-top: 2rem;
  11. height: 4rem;
  12. color: $white;
  13. font-family: "Source Code Pro";
  14. text-transform: uppercase;
  15. background: $blue-light;
  16. padding-left: 13%;
  17. }
  18. }
  19. .layout--onecol{
  20. .block-region-content{
  21. display: grid;
  22. grid-template-columns: 1fr repeat(8, 2fr) 1fr;
  23. /// carte
  24. .block-views-blockprojets-block-2{
  25. grid-column: 1 / span 10;
  26. }
  27. //texte de présentation
  28. .block-config-pages-block{
  29. grid-column: 3 / span 5;
  30. // width: 60%;
  31. margin: auto;
  32. span h2{
  33. display: none;
  34. }
  35. .config_pages--type--les-projets{
  36. .field--name-field-introduction{
  37. p:nth-of-type(1){
  38. font-size: 1.5rem;
  39. }
  40. }
  41. }
  42. }
  43. // bouton projets incubés
  44. .block-block-contentaffaf220-dd27-4c9d-ae02-8044c2662220{
  45. grid-column: 8 / span 9;
  46. margin-top: 4rem;
  47. background-color: $blue-light;
  48. height: fit-content;
  49. width: 60%;
  50. margin-left: 2rem;
  51. grid-row: 2;
  52. .display{
  53. display: block;
  54. }
  55. .field--name-field-lien{
  56. display: flex;
  57. flex-direction: column;
  58. margin-top: 2rem;
  59. margin-bottom: 2rem;
  60. margin-left: 1.5rem;
  61. margin-right: 1.5rem;
  62. text-align: center;
  63. a{
  64. font-weight: 800;
  65. color: $white;
  66. font-size: 1.3rem;
  67. }
  68. &:after{
  69. margin-left: auto;
  70. padding-top: 1rem;
  71. display: block;
  72. content:url("../images/pictos/noun_Arrow_3771902.svg")
  73. }
  74. }
  75. }
  76. //partie projets
  77. .block-views-blockprojets-block-1{
  78. grid-column: 3 / span 8;
  79. // width: 80%;
  80. .view-projets{
  81. // width: 80%;
  82. margin: auto;
  83. .view-filters{
  84. margin-top: 4rem;
  85. display: flex;
  86. flex-direction: row;
  87. &::before{
  88. content: 'Filtrer par:';
  89. }
  90. #views-exposed-form-projets-block-1{
  91. display: flex;
  92. flex-direction: row;
  93. #edit-field-neuf-rehabilitation-value--wrapper{
  94. legend{display: none;}
  95. }
  96. #edit-field-encours-fini-value--wrapper{
  97. legend{display: none;}
  98. }
  99. .js-form-type-textfield{
  100. label{display: none;}
  101. }
  102. }
  103. }
  104. //grille de projets
  105. .view-content{
  106. margin-top: 2rem;
  107. display: flex;
  108. flex-direction: row;
  109. .views-row{
  110. width: 25%;
  111. flex: 0 0 25%;
  112. }
  113. }
  114. .node-type-projet{
  115. color: $blue-dark;
  116. line-height: 1.5rem;
  117. padding: 0.5rem;
  118. padding-right: 1rem;
  119. padding-left: 1rem;
  120. div:first-child{
  121. display: flex;
  122. flex-direction: column;
  123. a{
  124. color: $blue-dark;
  125. }
  126. .field--name-field-photo {
  127. order:1;
  128. img{
  129. width: 100%;
  130. max-height: 175px;
  131. object-fit: cover;
  132. }
  133. &::after{
  134. display: block;
  135. content:url('data:image/svg+xml,<svg width="160" height="25" xmlns="http://www.w3.org/2000/svg" version="1.1"> <line x1="0" x2="80" y1="20" y2="20" stroke-linecap="cube" stroke="rgb(9,57,139)" stroke-width="2.5"/></svg>');
  136. }
  137. }
  138. .field--name-field-adresse{
  139. order:2;
  140. display: flex;
  141. text-transform: uppercase;
  142. font-size: 0.9rem;
  143. font-weight: 800;
  144. margin-top: 0.8rem;
  145. line-height: 0.6rem;
  146. .address{
  147. display: flex;
  148. flex-direction: row;
  149. margin: 0;
  150. .locality{
  151. padding-top: 0 !important;
  152. padding-bottom: 0 !important;
  153. &::after{
  154. content:",";
  155. margin-right: 0.3rem;
  156. }
  157. }
  158. .country{
  159. padding-top: 0 !important;
  160. padding-bottom: 0 !important;
  161. } }
  162. }
  163. .field--name-field-sous-titre{
  164. margin-top: 0.5rem;
  165. font-size: 0.9rem;
  166. font-weight: 800;
  167. order: 4;
  168. }
  169. .field--name-title{
  170. order: 3;
  171. margin-top: 0.5rem;
  172. font-size: 1rem;
  173. font-weight: 800;
  174. h2{margin: 0;}
  175. }
  176. .field--name-field-incube{
  177. order:4;
  178. color: red;
  179. margin-top: 0.8rem;
  180. }
  181. }
  182. }
  183. }
  184. }
  185. }
  186. }
  187. }
  188. }
  189. }