_filtres.scss 2.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110
  1. #views-exposed-form-projets-block-1{
  2. flex-direction: row;
  3. position: relative;
  4. align-items: center;
  5. select{
  6. @media (max-width:810px){
  7. max-width: 58%;
  8. }
  9. }
  10. }
  11. #views-exposed-form-base-de-donnees-block-1{
  12. flex-direction: column;
  13. margin-top: 1rem;
  14. @media (max-width: 479px){
  15. justify-content: center;
  16. }
  17. .js-form-item{
  18. // flex-direction: column !important;
  19. margin-right: 0 !important;
  20. margin-bottom: 0.5rem !important;
  21. padding: 0.2rem !important;
  22. input,
  23. select{
  24. width: 100%;
  25. text-align: end;
  26. }
  27. label{
  28. padding-right: 0.5rem !important;
  29. flex: 2 0 auto !important;
  30. }
  31. }
  32. }
  33. #views-exposed-form-base-de-donnees-block-1,
  34. #views-exposed-form-projets-block-1{
  35. display: flex;
  36. flex-wrap: wrap;
  37. @media (max-width:810px){
  38. font-size: 0.8rem;
  39. }
  40. .js-form-item{
  41. display: flex;
  42. flex-direction: row;
  43. max-width: 100%;
  44. margin-right: 1rem;
  45. margin-bottom: 1rem;
  46. padding: 0.5rem 1rem;
  47. align-items: baseline;
  48. border: solid black 0.5px ;
  49. justify-content: space-evenly;
  50. @media(max-width: 810px){
  51. display: flex;
  52. flex-direction: row;
  53. justify-content: space-between;
  54. max-width: 85%;
  55. }
  56. label{
  57. flex: 2 1 auto;
  58. padding-right: 2rem;
  59. &::after{
  60. content: ' : ';
  61. }
  62. @media (max-width:810px){
  63. padding-right: 1rem;
  64. }
  65. }
  66. input{
  67. flex: 2 1 auto;
  68. max-width: 55%;
  69. @media(max-width: 810px){
  70. max-width: 100%;
  71. }
  72. }
  73. .form-checkbox{
  74. margin-right: 1rem;
  75. }
  76. .select-wrapper{
  77. margin: 0;
  78. }
  79. }
  80. .js-form-type-checkbox label{
  81. &::after{
  82. content: none;
  83. }
  84. }
  85. .form-actions{
  86. input{
  87. color: white;
  88. font-weight: 600;
  89. text-transform: uppercase;
  90. padding: 0.3rem 0.7rem;
  91. background-color: $blue-light;
  92. border: none;
  93. }
  94. }
  95. input, select{
  96. border: none;
  97. background-color: transparent;
  98. font-family: "Marianne";
  99. font-size: 1rem;
  100. @media (max-width:810px){
  101. font-size: 0.8rem;
  102. }
  103. }
  104. }