lotkov/123
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Загрузить файлы в «/»

Browse Source
This commit is contained in:
lotkov
2026-02-19 18:22:36 +01:00
commit 9e8ed6749f
3 changed files with 651 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

121
habbit-manager.html Normal file
View File

@@ -0,0 +1,121 @@
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Трекер привычек</title>
<link rel="stylesheet" href="habbit-style.css">
</head>
<body>
<div class="container">
<!-- Шапка страницы -->
<header class="page-header">
<h1 class="page-header__title">🚀 Трекер полезных привычек</h1>
<p class="page-header__subtitle">Отслеживайте свой прогресс и становитесь лучше каждый день</p>
<!-- Панель статистики -->
<div class="stats-panel">
<div class="stats-panel__item">
<div class="stats-panel__value">7</div>
<div class="stats-panel__label">Привычек</div>
</div>
<div class="stats-panel__item">
<div class="stats-panel__value">64%</div>
<div class="stats-panel__label">Общий прогресс</div>
</div>
<div class="stats-panel__item">
<div class="stats-panel__value">21</div>
<div class="stats-panel__label">День подряд</div>
</div>
</div>
</header>
<!-- Блок фильтров -->
<div class="filters">
<button class="button button--primary filters__button" data-filter="all">Все привычки</button>
<button class="button button--secondary filters__button" data-filter="active">Активные</button>
<button class="button button--secondary filters__button" data-filter="completed">Завершенные</button>
<button class="button button--secondary filters__button" data-filter="important">Важные</button>
</div>
<!-- Сетка карточек привычек -->
<div class="habits-grid" id="habits-grid">
<div class="habit-card habit-card--new">
<div class="habit-card__header">
<div class="habit-card__icon">🧘</div>
<h3 class="habit-card__title">Медитация</h3>
</div>
<p class="habit-card__description">Ежедневная медитации по 10 минут</p>
<div class="habit-card__progress">
<div class="habit-card__progress-info">
<span>Прогресс</span>
<span>30%</span>
</div>
<div class="habit-card__progress-bar">
<div class="habit-card__progress-fill" style="width: 30%"></div>
</div>
</div>
<div class="habit-card__actions">
<button class="button button--success">Отметить выполнение</button>
<button class="button button--danger">удалить</button>
</div>
</div>
<div class="habit-card habit-card--streak">
<div class="habit-card__header">
<div class="habit-card__icon">💧</div>
<h3 class="habit-card__title">Учить js</h3>
</div>
<p class="habit-card__description">Писать не менее 1000000000 строк кода в день</p>
<div class="habit-card__progress">
<div class="habit-card__progress-info">
<spa>Прогресс</span>
<span>0%</span>
</div>
<div class="habit-card__progress-bar">
<div class="habit-card__progress-fill" style="width: 0%"></div>
</div>
</div>
<div class="habit-card__actions">
<button class="button button--success">Отметить выполнение</button>
<button class="button button--danger">удалить</button>
</div>
</div>
</div>
<!-- Форма добавления новой привычки -->
<div class="new-habit-form">
<button class="new-habit-form__button" id="add-habbit-button">
<h2 class="new-habit-form__title">➕ Добавить новую привычку</h2>
</button>
</div>
<div class="modal" id="habit-modal">
<div class="modal__overlay"></div>
<div class="modal__content">
<button class="modal__close">&times;</button>
<h2 class="modal__title">Добавить новую привычку</h2>
<form class="modal__form" id="habit-form">
<div class="form-group">
<label for="habit-name">Название</label>
<input type="text" id="habit-name" class="form-control" placeholder="Введите название привычки">
</div>
<div class="form-group">
<label for="habit-description">Описание</label>
<textarea id="habit-description" class="form-control" placeholder="Введите описание привычки"></textarea>
</div>
<div class="form-group">
<label for="habit-target">Цель</label>
<input type="number" id="habit-target" class="form-control" placeholder="Например, 1 раз в день" min="1">
</div>
<div class="modal__actions">
<button type="button" class="button button--secondary" id="cancel-button">Отмена</button>
<button type="submit" class="button button--primary">Добавить</button>
</div>
</form>
</div>
</div>
</div>
<script src="app.js"></script>
<script src="habit-manager.js"></script>
</body>
</html>