diff --git a/src/app/[locale]/pages/search/page.tsx b/src/app/[locale]/pages/search/page.tsx
index 4cc55ab..83d2b71 100644
--- a/src/app/[locale]/pages/search/page.tsx
+++ b/src/app/[locale]/pages/search/page.tsx
@@ -1,5 +1,7 @@
import SectionSearchFile from '@/app/ui/search/section-search-file';
import { SupportedFormats } from '@/app/ui/search/supported-formats';
+import { SearchStats } from '@/app/ui/search/search-stats';
+import { RecentSearches } from '@/app/ui/search/recent-searches';
export default function Page() {
return (
<>
@@ -19,6 +21,8 @@ export default function Page() {
/>
+
+
>
diff --git a/src/app/styles/pages-styles.scss b/src/app/styles/pages-styles.scss
index 2c639ef..4a38a8c 100644
--- a/src/app/styles/pages-styles.scss
+++ b/src/app/styles/pages-styles.scss
@@ -3697,16 +3697,25 @@
}
}
-.supported-formats {
+.search-sidebar {
+ display: flex;
+ flex-direction: column;
+ gap: 20px;
+}
+
+.supported-formats,
+.stats-search,
+.recent-searches {
background: v.$white;
border-radius: 12px;
padding: 20px;
box-shadow: 0 4px 6px v.$shadow-1;
- .formats-title {
+ .formats-title,
+ .stats-title,
+ .recent-title {
font-weight: 600;
color: v.$text-p;
- ;
margin-bottom: 16px;
display: flex;
align-items: center;
@@ -3755,4 +3764,76 @@
font-size: 14px;
line-height: 1.5;
}
+
+ .stat-item {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ padding: 8px 0;
+ border-bottom: 1px solid v.$b-color-2;
+
+ &:last-child {
+ border-bottom: none;
+ }
+
+ .stat-label {
+ color: v.$text-s;
+ font-size: 14px;
+ opacity: 0.9;
+ position: relative;
+ z-index: 1;
+ }
+
+ .stat-value {
+ font-weight: 600;
+ color: v.$text-p;
+ font-size: 32px;
+ margin-bottom: 5px;
+ position: relative;
+ z-index: 1;
+ }
+ }
+
+ .recent-item {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ padding: 8px 0;
+ border-bottom: 1px solid v.$b-color-2;
+
+ .recent-type {
+ color: v.$text-p;
+ font-size: 14px;
+ display: flex;
+
+ &.image {
+ svg {
+ color: v.$color-image;
+ }
+ }
+
+ &.audio {
+ svg {
+ color: v.$color-audio;
+ }
+ }
+
+ &.video {
+ svg {
+ color: v.$color-video;
+ }
+ }
+
+ &.document {
+ svg {
+ color: v.$color-document;
+ }
+ }
+ }
+
+ .recent-date {
+ color: v.$text-s;
+ font-size: 12px;
+ }
+ }
}
\ No newline at end of file
diff --git a/src/app/ui/search/recent-searches.tsx b/src/app/ui/search/recent-searches.tsx
new file mode 100644
index 0000000..da7e595
--- /dev/null
+++ b/src/app/ui/search/recent-searches.tsx
@@ -0,0 +1,50 @@
+import { IconImageFile, IconDocument, IconAudioFile, IconVideoFile } from '@/app/ui/icons/icons';
+export function RecentSearches() {
+ return (
+
+
+ Недавние поиски
+
+
+
+
+
+
+ )
+}
\ No newline at end of file
diff --git a/src/app/ui/search/search-stats.tsx b/src/app/ui/search/search-stats.tsx
index e69de29..9e33d02 100644
--- a/src/app/ui/search/search-stats.tsx
+++ b/src/app/ui/search/search-stats.tsx
@@ -0,0 +1,30 @@
+export function SearchStats() {
+ return (
+
+
+ Статистика поиска
+
+
+
+ Изображения
+ 0
+
+
+ Видео
+ 0
+
+
+ Аудио
+ 0
+
+
+ Документы
+ 0
+
+
+ Всего поисков
+ 0
+
+
+ )
+}
\ No newline at end of file