WebOrbiton
v1.0.0.1

StocketBase

← Changes All versions
192 lines · 4.2 KB
  1. .mevasearch-preview {
  2. --background: 245, 247, 250;
  3. --foreground: 20, 23, 30;
  4. --card: 255, 255, 255;
  5. --primary: 14, 165, 233;
  6. --border: 222, 226, 230;
  7. --muted-foreground: 100, 116, 139;
  8. --muted: 234, 236, 240;
  9. --app-font: 'Space Grotesk Qwantium', 'Space Grotesk', sans-serif;
  10. ​
  11. background-color: rgb(var(--background));
  12. color: rgb(var(--foreground));
  13. border: 1px solid rgb(var(--border));
  14. border-radius: 8px;
  15. padding: 1rem 1.15rem 0.25rem;
  16. margin-bottom: 14px;
  17. line-height: 1.5;
  18. text-align: left;
  19. }
  20. ​
  21. body[data-theme="dark"] .mevasearch-preview {
  22. --background: 14, 17, 22;
  23. --foreground: 230, 230, 230;
  24. --card: 26, 29, 36;
  25. --primary: 34, 211, 238;
  26. --border: 42, 47, 58;
  27. --muted-foreground: 156, 163, 175;
  28. --muted: 42, 47, 58;
  29. }
  30. ​
  31. .mevasearch-preview,
  32. .mevasearch-preview * {
  33. box-sizing: border-box;
  34. font-family: var(--app-font);
  35. }
  36. ​
  37. .mevasearch-preview .result-card {
  38. margin-bottom: 1.25rem;
  39. min-width: 0;
  40. overflow: hidden;
  41. }
  42. ​
  43. .mevasearch-preview .result-breadcrumb {
  44. display: flex;
  45. align-items: center;
  46. gap: 7px;
  47. font-size: 0.82rem;
  48. color: rgb(var(--muted-foreground));
  49. margin-bottom: 3px;
  50. min-width: 0;
  51. }
  52. ​
  53. .mevasearch-preview .result-breadcrumb > span:first-of-type {
  54. overflow: hidden;
  55. text-overflow: ellipsis;
  56. white-space: nowrap;
  57. min-width: 0;
  58. }
  59. ​
  60. .mevasearch-preview .result-favicon {
  61. width: 14px;
  62. height: 14px;
  63. border-radius: 2px;
  64. object-fit: contain;
  65. flex-shrink: 0;
  66. }
  67. ​
  68. .mevasearch-preview .result-title {
  69. margin: 0;
  70. }
  71. ​
  72. .mevasearch-preview .result-title a {
  73. color: rgb(var(--primary));
  74. text-decoration: none;
  75. font-size: 1.1rem;
  76. font-weight: 500;
  77. line-height: 1.3;
  78. overflow-wrap: break-word;
  79. word-break: break-word;
  80. display: inline-flex;
  81. align-items: center;
  82. gap: 6px;
  83. cursor: default;
  84. }
  85. ​
  86. .mevasearch-preview .result-desc {
  87. font-size: 0.9rem;
  88. color: rgb(var(--foreground));
  89. opacity: 0.8;
  90. margin-top: 4px;
  91. line-height: 1.5;
  92. overflow-wrap: break-word;
  93. word-break: break-word;
  94. }
  95. ​
  96. .mevasearch-preview.web-results-mcard .result-card {
  97. padding: 1.25rem 1.5rem;
  98. border: 1px solid rgb(var(--border));
  99. border-radius: 0.875rem;
  100. background-color: rgb(var(--card));
  101. box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
  102. }
  103. ​
  104. .mevasearch-preview.web-results-mcard .result-breadcrumb {
  105. gap: 8px;
  106. font-size: 0.82rem;
  107. }
  108. ​
  109. .mevasearch-preview.web-results-mcard .result-title a {
  110. font-size: 1.15rem;
  111. }
  112. ​
  113. .mevasearch-preview.web-results-mcard .result-desc {
  114. font-size: 0.95rem;
  115. line-height: 1.6;
  116. }
  117. ​
  118. .mevasearch-preview.web-results-magazine .result-card {
  119. padding: 1.75rem;
  120. border: 1.5px solid rgb(var(--primary));
  121. border-radius: 0.875rem;
  122. background: linear-gradient(135deg, rgba(var(--primary), 0.07) 0%, rgba(var(--primary), 0.02) 100%);
  123. box-shadow: 0 2px 10px rgba(14, 165, 233, 0.06);
  124. }
  125. ​
  126. .mevasearch-preview.web-results-magazine .result-breadcrumb {
  127. font-size: 0.82rem;
  128. margin-bottom: 0.6rem;
  129. }
  130. ​
  131. .mevasearch-preview.web-results-magazine .result-title a {
  132. font-size: 1.55rem;
  133. line-height: 1.25;
  134. font-weight: 700;
  135. }
  136. ​
  137. .mevasearch-preview.web-results-magazine .result-desc {
  138. font-size: 1rem;
  139. line-height: 1.7;
  140. margin-top: 0.875rem;
  141. opacity: 0.9;
  142. }
  143. ​
  144. .mevasearch-preview.web-results-modern .result-card {
  145. position: relative;
  146. padding: 1rem 1.15rem 1rem 1.4rem;
  147. border-radius: 1rem;
  148. background-color: rgb(var(--card));
  149. border: 1px solid rgb(var(--border));
  150. box-shadow: 0 8px 24px rgba(0, 0, 0, 0.06);
  151. }
  152. ​
  153. .mevasearch-preview.web-results-modern .result-card::before {
  154. content: '';
  155. position: absolute;
  156. left: 0.3rem;
  157. top: 1.3rem;
  158. bottom: 1.3rem;
  159. width: 2px;
  160. border-radius: 999px;
  161. background: rgb(var(--primary));
  162. }
  163. ​
  164. .mevasearch-preview.web-results-modern .result-breadcrumb {
  165. gap: 8px;
  166. font-size: 0.78rem;
  167. opacity: 0.75;
  168. }
  169. ​
  170. .mevasearch-preview.web-results-modern .result-favicon {
  171. border-radius: 6px;
  172. padding: 2px;
  173. background: rgb(var(--muted));
  174. }
  175. ​
  176. .mevasearch-preview.web-results-modern .result-title {
  177. margin-top: 0.3rem;
  178. }
  179. ​
  180. .mevasearch-preview.web-results-modern .result-title a {
  181. font-size: 1.2rem;
  182. font-weight: 600;
  183. letter-spacing: -0.01em;
  184. }
  185. ​
  186. .mevasearch-preview.web-results-modern .result-desc {
  187. font-size: 0.92rem;
  188. line-height: 1.65;
  189. margin-top: 0.5rem;
  190. opacity: 0.82;
  191. }
  192. ​