_ressources.scss 2.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138
  1. .path-centre-de-ressources{
  2. background-color: rgb(242, 246, 252);
  3. .content_container{
  4. &>div>h2:first-child{
  5. text-align: center;
  6. }
  7. }
  8. form{
  9. display: grid;
  10. column-gap: 1rem;
  11. grid-template-columns: calc(10% - 3em) repeat(4, 20%);
  12. &>div:first-child{
  13. grid-column-start: 2;
  14. }
  15. .form-item-combine{
  16. grid-row: 1 / span 1 ;
  17. grid-column-start: 2;
  18. }
  19. .form-item-programme{
  20. grid-column-start: 2;
  21. }
  22. .form-item-items-per-page{
  23. grid-column-start: 2;
  24. }
  25. select, input{
  26. display: inline-block;
  27. width: auto;
  28. width: 100%;
  29. font-size: $font-normal;
  30. padding: .3rem .1rem;
  31. height: auto;
  32. }
  33. div{
  34. display: inline-block;
  35. width: auto;
  36. // padding: .5rem 1rem;
  37. }
  38. .form-actions{
  39. grid-column: 4 / span 2;
  40. display: grid;
  41. grid-template-columns: 1fr 1fr;
  42. align-items: center;
  43. column-gap: 1rem;
  44. input{
  45. background-color: white;
  46. border: solid 1px black;
  47. box-shadow: none;
  48. &:first-child{
  49. // margin-right: .5rem;
  50. }
  51. &:last-child{
  52. // margin-left: .5rem;
  53. }
  54. }
  55. }
  56. }
  57. .views-view-grid{
  58. margin-top: 3rem;
  59. .views-row{
  60. display: grid;
  61. column-gap: 1rem;
  62. row-gap: 1rem;
  63. grid-template-columns: calc(10% - 3em) repeat(4, 20%);
  64. .views-col:first-child{
  65. grid-column-start: 2;
  66. }
  67. }
  68. .views-col{
  69. display: grid;
  70. grid-template-columns: 20% 80%;
  71. align-items: stretch;
  72. a{
  73. text-decoration: none;
  74. &:hover{
  75. text-decoration: underline;
  76. }
  77. }
  78. background-color: rgb(255, 255, 255);
  79. background-clip: content-box;
  80. width: 100% !important;
  81. padding: .3rem;
  82. .views-field:not(:first-child){
  83. padding: 0 0 0 .4rem;
  84. }
  85. .views-field-field-image{
  86. grid-row: 2 / span 2;
  87. }
  88. .views-field-field-programme{
  89. grid-row: 1 / span 1;
  90. grid-column: 1 / span 2;
  91. .field-content{
  92. font-weight: 600;
  93. display: inline-block;
  94. width: auto;
  95. color: white;
  96. background: red;
  97. padding: .15rem .3rem;
  98. margin-bottom: 1rem;
  99. }
  100. }
  101. .views-field-field-type-de-ressource{
  102. text-transform: uppercase;
  103. font-size: 600;
  104. margin-bottom: .5rem;
  105. font-size: $font-small;
  106. grid-row: 2 / span 1;
  107. grid-column: 2 / span 1;
  108. }
  109. .views-field-title{
  110. font-style: italic;
  111. grid-row: 3 / span 1;
  112. grid-column: 2 / span 1;
  113. }
  114. .views-field-field-sous-titre{
  115. margin-bottom: 1rem;
  116. grid-row: 4 / span 1;
  117. grid-column: 2 / span 1;
  118. }
  119. .views-field-field-theme{
  120. grid-row: 5 / span 1;
  121. grid-column: 1 / span 2;
  122. font-size: $font-small;
  123. }
  124. }
  125. }
  126. }