Project: Mall App Client: Maiora
Nevar pievienot vairāk kā 25 tēmas Tēmai ir jāsākas ar burtu vai ciparu, tā var saturēt domu zīmes ('-') un var būt līdz 35 simboliem gara.
 
 
 
 

143 rindas
2.9 KiB

  1. .top-bar-holder {
  2. background-image: url('../../assets/custom/background-2.svg');
  3. background-size: cover;
  4. background-repeat: no-repeat;
  5. background-position: left top;
  6. padding-top: 80px;
  7. }
  8. .header-bar {
  9. color: white;
  10. display: flex;
  11. justify-content: space-between;
  12. padding: 20px;
  13. align-items: center;
  14. background-image: url('../../assets/custom/background-2.svg');
  15. background-size: cover;
  16. background-repeat: no-repeat;
  17. background-position: left top;
  18. position: fixed;
  19. left: 0;
  20. top: 0;
  21. z-index: 2;
  22. width: 100%;
  23. h2 {
  24. font-size: 20px;
  25. margin: 0;
  26. }
  27. button {
  28. margin: 0;
  29. border-radius: 50%;
  30. color: var(--brand-blue);
  31. width: 40px;
  32. height: 40px;
  33. background-color: white;
  34. font-size: 14px;
  35. }
  36. }
  37. .tabs-holder {
  38. width: 100%;
  39. padding: 0 20px 20px;
  40. overflow: scroll;
  41. white-space: nowrap;
  42. button {
  43. display: inline-block;
  44. border-radius: 20px;
  45. background-color: transparent;
  46. color: white;
  47. font-size: 10px;
  48. padding: 5px 15px;
  49. height: 30px;
  50. margin-right: 10px;
  51. font-weight: bold;
  52. &.active {
  53. background-color: white;
  54. color: var(--brand-blue);
  55. }
  56. }
  57. }
  58. .advertisement {
  59. height: 150px;
  60. background-image: url('../../assets/custom/background-2.svg');
  61. background-size: cover;
  62. background-repeat: no-repeat;
  63. background-position: left center;
  64. color: white;
  65. padding: 15px;
  66. width: 100%;
  67. margin-bottom: 20px;
  68. .heading-holder {
  69. display: flex;
  70. width: 100%;
  71. justify-content: space-between;
  72. align-items: center;
  73. img {
  74. width: 45px;
  75. background-color: white;
  76. height: 45px;
  77. border-radius: 50%;
  78. padding: 10px;
  79. }
  80. header {
  81. margin-left: 15px;
  82. font-size: 14px;
  83. font-weight: 500;
  84. span {
  85. font-weight: 400;
  86. font-size: 12px;
  87. }
  88. }
  89. }
  90. .description {
  91. font-size: 12px;
  92. text-overflow: ellipsis;
  93. overflow: hidden;
  94. white-space: nowrap;
  95. }
  96. a {
  97. font-size: 12px;
  98. text-decoration: underline;
  99. color: white;
  100. }
  101. }
  102. .food-types-holder{
  103. display: flex;
  104. width: 100%;
  105. justify-content: space-between;
  106. padding: 10px;
  107. button {
  108. background-color: transparent;
  109. border: 0;
  110. ion-icon {
  111. background-color: white;
  112. border-radius: 50%;
  113. box-shadow: 0px 0px 5px var(--brand-grey);
  114. padding: 10px;
  115. font-size: 35px;
  116. }
  117. span {
  118. display: block;
  119. font-size: 10px;
  120. color: var(--brand-grey);
  121. margin-top: 10px;
  122. letter-spacing: 0.5px;
  123. }
  124. }
  125. }