_search.scss 2.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113
  1. .simplesearch_results{
  2. .section{
  3. // width: calc((100% / 12) * 9);
  4. width: 100%;
  5. .simplesearch{
  6. .center{
  7. width: calc((100% / 12) * 9);
  8. }
  9. .result_for{
  10. text-transform: uppercase;
  11. p{
  12. margin: 0!important;
  13. }
  14. }
  15. }
  16. }
  17. .card-cat{
  18. margin-bottom:0.6rem;
  19. }
  20. }
  21. .wrap_search{
  22. display: inline-flex;
  23. align-items: baseline;
  24. & > a{
  25. margin-right: 1.2rem;
  26. }
  27. }
  28. .search-wrapper{
  29. opacity: 0;
  30. transition: opacity 0.2s ease;
  31. &.opacity{
  32. opacity: 1;
  33. transition: opacity 0.2s ease;
  34. }
  35. form{
  36. display: inline-flex;
  37. .search-input, button{
  38. font-family: $Bold;
  39. font-size: 1.5rem;
  40. text-transform: uppercase;
  41. height: auto;
  42. border: none;
  43. background: none;
  44. }
  45. button{
  46. width: auto;
  47. }
  48. .search-input{
  49. max-width: 200px;
  50. width: 100%;
  51. border-bottom: 1px solid black;
  52. margin-right: 1.2rem;
  53. background: white!important;
  54. &:focus, &:active, &::placeholder{
  55. outline: none;
  56. background-color:transparent!important;
  57. }
  58. }
  59. }
  60. }
  61. .search-results{
  62. .results{
  63. margin-top: 6rem;
  64. @include flexbox;
  65. align-items: flex-end;
  66. width: 100%;
  67. .search-row{
  68. width: calc((100% / 12) * 6);
  69. margin-bottom: 6rem;
  70. a{
  71. display: block;
  72. }
  73. &:nth-child(odd){
  74. padding-right: 0.7rem;
  75. }
  76. &:nth-child(even){
  77. padding-left: 0.7rem;
  78. }
  79. .search-item{
  80. margin: 0;
  81. }
  82. .card-cat{
  83. margin-bottom:0.6rem;
  84. }
  85. .search-title{
  86. h2{
  87. font-size: 2.5rem;
  88. line-height: 2.7rem;
  89. }
  90. }
  91. .search-details{
  92. font-family: $Bold;
  93. font-size: 2.5rem;
  94. line-height: 2.7rem;
  95. font-weight: 400;
  96. margin: 0;
  97. text-transform: uppercase;
  98. }
  99. .search-image{
  100. float: none;
  101. width: 100%;
  102. margin-top: 1.5rem;
  103. margin-bottom: 1.5rem;
  104. }
  105. }
  106. }
  107. }