_node-evenement-actu.scss 3.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207
  1. .page-node-type-evenement, .page-node-type-actualite{
  2. .block-region-first{
  3. .field_programme{
  4. display: none;
  5. }
  6. @include breakpoint(small down) {
  7. text-align: center;
  8. }
  9. #programme_toc-block_10{
  10. .views-row{
  11. padding-left: 1rem;
  12. }
  13. }
  14. position: absolute;
  15. top: 0;
  16. left: 0;
  17. width: 22%;
  18. padding: 1rem 1.5rem ;
  19. .prog-ressources-link, .back-actus-link{
  20. font-family: "duke";
  21. font-size: $font-large;
  22. cursor: pointer;
  23. transition: all 250ms;
  24. text-decoration: none;
  25. &:hover{
  26. padding: 0 0 0 .3rem;
  27. }
  28. }
  29. div[id=""] {
  30. @include breakpoint(small down) {
  31. display: none;
  32. }
  33. }
  34. //styling intro text
  35. .views-element-container{
  36. @include breakpoint(small down) {
  37. display: block;
  38. // &:not(:first-child){
  39. // margin-left: 1rem;
  40. // }
  41. }
  42. header{
  43. font-family: "duke";
  44. font-size: $font-large;
  45. text-transform: uppercase;
  46. cursor: pointer;
  47. transition: all 250ms;
  48. line-height: 1.1;
  49. margin-bottom: .5rem;
  50. &:hover{
  51. padding: 0 0 0 .3rem;
  52. }
  53. }
  54. .views-row, .view-grouping{
  55. display: none;
  56. padding: 0 0 0 1.1rem;
  57. margin-bottom: .5rem;
  58. a{
  59. text-decoration: none;
  60. &:hover{
  61. text-decoration: underline;
  62. }
  63. }
  64. }
  65. // .views-row{
  66. // padding: 0;
  67. // }
  68. }
  69. }
  70. &.programme-1{
  71. .field_programme{
  72. background-color: $col-1;
  73. }
  74. }
  75. &.programme-2{
  76. .field_programme{
  77. background-color: $col-2;
  78. }
  79. }
  80. &.programme-3{
  81. .field_programme{
  82. background-color: $col-eur;
  83. }
  84. }
  85. &.programme-4{
  86. .field_programme{
  87. background-color: $col-1;
  88. }
  89. }
  90. &.programme-5{
  91. .field_programme{
  92. background-color: $col-mond;
  93. }
  94. }
  95. &.programme-6{
  96. .field_programme{
  97. background-color: $col-ter;
  98. }
  99. }
  100. &.programme-7{
  101. .field_programme{
  102. background-color: $col-met;
  103. }
  104. }
  105. &.programme-883{
  106. .field_programme{
  107. background-color: $col-transition;
  108. }
  109. }
  110. &.programme-878{
  111. .field_programme{
  112. background-color: $col-exode;
  113. }
  114. }
  115. .block-region-second{
  116. display:grid;
  117. #node\:title{
  118. margin: 0;
  119. font-size: $font-large;
  120. line-height: 1.3;
  121. }
  122. #node\:field_programme{
  123. grid-row: 1;
  124. .field_programme{
  125. display: inline-block;
  126. width: auto;
  127. padding: .3rem .5rem;
  128. color: white;
  129. font-weight: 600;
  130. text-transform: uppercase;
  131. font-size: .5rem;
  132. }
  133. margin-bottom: 1rem;
  134. }
  135. #node\:field_date{
  136. //font-size: $font-medium;
  137. grid-row: 3;
  138. .field_date{
  139. div{
  140. float: left;
  141. margin-right: 1rem;
  142. }
  143. }
  144. }
  145. #node\:field_sous_titre{
  146. text-transform: uppercase;
  147. }
  148. #node\:field_intro{
  149. font-size: $font-medium;
  150. }
  151. .field_intro{
  152. margin-top: 1rem;
  153. margin-bottom: .5rem;
  154. }
  155. #node\:field_type_evenement{
  156. grid-row: 2;
  157. }
  158. #node\:field_image{
  159. grid-row: 5;
  160. width: 100%;
  161. margin: 1rem 0;
  162. img{
  163. width: 100%;
  164. }
  165. }
  166. #node\:body{
  167. }
  168. }
  169. // .block-region-first{
  170. // padding: 1rem 0 .5rem 0;
  171. // &>div{
  172. // padding: 0 0 .5rem 0;
  173. // }
  174. // a{
  175. // padding: 0 0 0 1rem;
  176. // }
  177. // }
  178. .block-region-third{
  179. position: sticky;
  180. top: 1rem;
  181. .field_fichier, .field_ressources_liees, .field_lien{
  182. // margin: .5rem 0;
  183. padding-right: 1.3rem;
  184. a{
  185. font-weight: 600;
  186. text-decoration: none;
  187. &:hover{
  188. text-decoration: underline;
  189. }
  190. }
  191. }
  192. }
  193. }