_default.scss 7.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307
  1. article, .paragraph{
  2. h2,h3,h4,h5,h6{
  3. font-family: "trueno";
  4. font-weight: 600;
  5. font-size: $font-medium;
  6. color:black;
  7. margin-top: 1rem;
  8. margin-bottom: .3rem;
  9. }
  10. p{
  11. margin-bottom: .5rem;
  12. }
  13. }
  14. .layout-container{
  15. background-color: $bck-col;
  16. z-index: 0;
  17. position: relative;
  18. }
  19. .block-region-bottom .prog-ressources-link,.ressources-link{
  20. display: inline-block;
  21. margin: 0 auto;
  22. background: black;
  23. color: white;
  24. font-family: "trueno";
  25. font-weight: 500;
  26. padding: .3rem .7rem;
  27. font-size: $font-small;
  28. text-decoration: none;
  29. text-transform: uppercase;
  30. }
  31. .block-region-bottom .prog-ressources-link{
  32. &:hover{
  33. color:black;
  34. background: white;
  35. }
  36. }
  37. .block-region-first,.block-region-third{
  38. .prog-ressources-link{
  39. text-transform: uppercase;
  40. }
  41. .is-active{
  42. font-weight: 600;
  43. }
  44. h2{
  45. font-size: $font-big;
  46. background-color: black;
  47. color: white;
  48. padding: .1rem 1rem;
  49. margin-top: .3rem;
  50. }
  51. .views-field-field-intro{
  52. display: none;
  53. }
  54. }
  55. .block-region-third{
  56. h2{
  57. //margin: 1.5rem 0 .5rem 0;
  58. }
  59. .field_document{
  60. padding: 0.5rem 0.5rem;
  61. }
  62. .field_organisateur,.field_fichier, .field_lien,.field_ressources_liees, .views-element-container div{
  63. //padding: 0rem 1rem;
  64. div{
  65. text-decoration: none;
  66. padding: .3rem 0;
  67. }
  68. //field colletion :
  69. // .views-field-description__value{
  70. // max-height: 5rem;
  71. // overflow: hidden;
  72. // position: relative;
  73. // }
  74. // .views-field-description__value:hover{
  75. // max-height: none;
  76. // overflow: auto;
  77. // }
  78. .hidden_text{
  79. max-height: 5rem;
  80. overflow: hidden;
  81. position: relative;
  82. cursor: pointer;
  83. }
  84. .hidden_text:after{
  85. content: "";
  86. text-align: center;
  87. opacity: 1;
  88. position: absolute;
  89. top: 0;
  90. bottom: 0;
  91. left: -15px;
  92. right: -15px;
  93. box-shadow: inset 0 -2rem 1rem #eff2f9;
  94. }
  95. }
  96. .field_partenaires{
  97. background: white;
  98. padding: .5rem 0;
  99. display: grid;
  100. grid-template-columns: 1fr 1fr 1fr;
  101. grid-column-gap: .3rem;
  102. padding: 0.5rem 1rem;
  103. }
  104. }
  105. .block-region-first{
  106. background-color: black;
  107. color: white;
  108. z-index: 120;
  109. #node\:title{
  110. text-transform: uppercase;
  111. font-family: 'duke';
  112. font-size: $font-big;
  113. text-decoration: none;
  114. &:hover{
  115. text-decoration: underline;
  116. }
  117. }
  118. }
  119. .page-node-type-static{
  120. .layout__region{
  121. position: relative;
  122. }
  123. .layout__region--top{
  124. z-index: 0;
  125. position: absolute;
  126. top: 0;
  127. left: 0;
  128. width: 99vw;
  129. height: 40vh;
  130. background: $trame;
  131. box-shadow: inset 0 -5rem 8rem $bck-col;
  132. z-index: -1;
  133. }
  134. .block-region-third{
  135. position: sticky;
  136. top: 3rem;
  137. }
  138. .block-region-first{
  139. padding: 1rem;
  140. position: sticky;
  141. top: 3rem;
  142. @include breakpoint(small down) {
  143. grid-column-start: 1;
  144. top: 0;
  145. }
  146. .field_titre{
  147. font-size: $font-normal;
  148. font-weight: 600;
  149. margin-top: .5rem;
  150. cursor: pointer;
  151. &:hover{
  152. text-decoration: underline;
  153. }
  154. }
  155. }
  156. .block-region-first #node\:title{
  157. font-size: 1.3rem;
  158. &:hover{
  159. text-decoration: none;
  160. }
  161. }
  162. .field_textes{
  163. .paragraph{
  164. // border-top: 1px solid black;
  165. border-bottom: 3px dotted gray;
  166. padding: 1rem 0;
  167. .field_titre{
  168. font-size: $font-big;
  169. font-weight: 600;
  170. text-transform: initial;
  171. cursor: pointer;
  172. // margin-top: 1rem;
  173. }
  174. .field_texte{
  175. height: auto;
  176. position: relative;
  177. h2{
  178. text-transform: inherit;
  179. }
  180. -webkit-transition: all 250ms ease;
  181. -moz-transition: all 250ms ease;
  182. -o-transition: all 250ms ease;
  183. transition: all 250ms ease;
  184. }
  185. }
  186. }
  187. .block-region-second{
  188. #node\:field_equipes{
  189. margin-top: 1.5rem;
  190. .field_equipes{
  191. .paragraph{
  192. .field_type_equipe{
  193. font-size: $font-medium;
  194. font-weight: 600;
  195. margin: 1rem 0;
  196. }
  197. .field_membres{
  198. .paragraph{
  199. display: grid;
  200. // grid-template-columns: 20% 1fr 1fr;
  201. grid-auto-columns: minmax(0, 20%) auto minmax(0, 1fr);
  202. margin-bottom: 1rem;
  203. }
  204. // div:not(.field_photo){
  205. // grid-column: 2;
  206. // // flex: 1 100%;
  207. // }
  208. .field_prenom{
  209. grid-column: 2;
  210. grid-row: 1;
  211. display: inline-block;
  212. font-weight: 500;
  213. align-self: end;
  214. }
  215. .field_nom{
  216. grid-column: 3;
  217. grid-row: 1;
  218. padding-left: .2rem;
  219. display: inline-block;
  220. width: auto;
  221. font-weight: 500;
  222. align-self: end;
  223. }
  224. .field_fonction{
  225. grid-column: 2 / span 2;
  226. align-self: start;
  227. }
  228. .field_photo{
  229. align-self: center;
  230. grid-row: 1 / span 2;
  231. margin-right: 1rem;
  232. img{
  233. // width: 100%;
  234. // height: 100%;
  235. }
  236. }
  237. }
  238. }
  239. }
  240. }
  241. #node\:field_partenaires{
  242. margin-top: 1.5rem;
  243. .paragraph{
  244. display: grid;
  245. // grid-template-columns: 20% 1fr 1fr;
  246. grid-auto-columns: minmax(0, 20%) auto;
  247. margin-bottom: 1rem;
  248. }
  249. .field_presentation{
  250. grid-column: 2;
  251. padding: 0 1rem;
  252. }
  253. .field_logo_partenaire{
  254. align-self: center;
  255. }
  256. }
  257. }
  258. }
  259. .page-node-type-actualite, .page-node-type-evenement{
  260. .block-region-first{
  261. background-color: black;
  262. color: white;
  263. // a:not(.prog-ressources-link,.back-actus-link){
  264. // text-transform: uppercase;
  265. // font-family: 'duke';
  266. // font-size: $font-big;
  267. // padding: .3rem .5rem;
  268. // text-decoration: none;
  269. // &:hover{
  270. // text-decoration: underline;
  271. // }
  272. // }
  273. }
  274. #node\:title{
  275. font-family: "trueno";
  276. font-weight: 600;
  277. font-size: $font-medium;
  278. margin-top: 1rem;
  279. margin-bottom: .3rem;
  280. }
  281. }