add dashboard layout

2025-11-26 17:18:20 +07:00
parent ebca795c1b
commit 12f788829f
9 changed files with 860 additions and 2 deletions
@@ -0,0 +1,89 @@
+export default function ChartContainer() {
+	return (
+		<div className="chart-container block-wrapper">
+			<div className="chart-header">
+				<h3 className="chart-title">Поиск контента</h3>
+				<select className="date-filter">
+					<option>Ноябрь 2025</option>
+				</select>
+			</div>
+			<div className="chart-main-content">
+				<div className="chart-grid">
+					<div className="chart-item images">
+						<div className="chart-item-header">
+							<div className="chart-item-image">📸</div>
+							<span className="chart-item-title">Изображения</span>
+						</div>
+						<div className="chart-item-count">0</div>
+						<div className="chart-item-tooltip">поисковых запросов</div>
+						<div className="chart-item-progress-bar">
+							<div className="chart-item-progress-fill"></div>
+						</div>
+					</div>
+					<div className="chart-item videos">
+						<div className="chart-item-header">
+							<div className="chart-item-image">🎬</div>
+							<span className="chart-item-title">Видео</span>
+						</div>
+						<div className="chart-item-count">0</div>
+						<div className="chart-item-tooltip">поисковых запросов</div>
+						<div className="chart-item-progress-bar">
+							<div className="chart-item-progress-fill"></div>
+						</div>
+					</div>
+					<div className="chart-item audios">
+						<div className="chart-item-header">
+							<div className="chart-item-image">🎵</div>
+							<span className="chart-item-title">Аудио</span>
+						</div>
+						<div className="chart-item-count">0</div>
+						<div className="chart-item-tooltip">поисковых запросов</div>
+						<div className="chart-item-progress-bar">
+							<div className="chart-item-progress-fill"></div>
+						</div>
+					</div>
+					<div className="chart-item documents">
+						<div className="chart-item-header">
+							<div className="chart-item-image">📄</div>
+							<span className="chart-item-title">Документы</span>
+						</div>
+						<div className="chart-item-count">0</div>
+						<div className="chart-item-tooltip">поисковых запросов</div>
+						<div className="chart-item-progress-bar">
+							<div className="chart-item-progress-fill"></div>
+						</div>
+					</div>
+					<div className="chart-item scripts">
+						<div className="chart-item-header">
+							<div className="chart-item-image">💻</div>
+							<span className="chart-item-title">Код</span>
+						</div>
+						<div className="chart-item-count">0</div>
+						<div className="chart-item-tooltip">поисковых запросов</div>
+						<div className="chart-item-progress-bar">
+							<div className="chart-item-progress-fill"></div>
+						</div>
+					</div>
+					<div className="chart-item texts">
+						<div className="chart-item-header">
+							<div className="chart-item-image">📝</div>
+							<span className="chart-item-title">Текст</span>
+						</div>
+						<div className="chart-item-count">0</div>
+						<div className="chart-item-tooltip">поисковых запросов</div>
+						<div className="chart-item-progress-bar">
+							<div className="chart-item-progress-fill"></div>
+						</div>
+					</div>
+				</div>
+				<div className="chart-total">
+					<span className="chart-total-text">Всего поисковых запросов за
+						<span> date</span>:
+					</span>
+					<span className="chart-total-count">
+						0</span>
+				</div>
+			</div>
+		</div>
+	)
+}