Fovway
7def129e14
- Changed calendar from full sidebar to compact containerized box - Reduced calendar size (190px width) to minimize space usage - Increased main container max-width from 600px to 850px for two-column layout - Added proper styling for .main element (white background, shadow, padding) - Improved visual hierarchy with matching design patterns - Updated CSS version for cache busting
114 lines
3.9 KiB
HTML
114 lines
3.9 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="en">
|
||
<head>
|
||
<meta charset="UTF-8" />
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||
<title>Заметки</title>
|
||
<link rel="stylesheet" href="/style.css?v=5" />
|
||
<link
|
||
rel="stylesheet"
|
||
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css"
|
||
/>
|
||
</head>
|
||
<body>
|
||
<div class="container">
|
||
<header class="notes-header">
|
||
<span>📝 Мои заметки</span>
|
||
<div class="user-info">
|
||
<div
|
||
id="user-avatar-container"
|
||
style="display: none; margin-right: 10px"
|
||
>
|
||
<img
|
||
id="user-avatar"
|
||
src=""
|
||
alt="Аватар"
|
||
style="
|
||
width: 32px;
|
||
height: 32px;
|
||
border-radius: 50%;
|
||
object-fit: cover;
|
||
vertical-align: middle;
|
||
border: 2px solid #007bff;
|
||
"
|
||
/>
|
||
</div>
|
||
<span id="username-display" class="username-clickable"></span>
|
||
<form action="/logout" method="POST" style="display: inline">
|
||
<button type="submit" class="logout-btn">🚪 Выйти</button>
|
||
</form>
|
||
</div>
|
||
</header>
|
||
|
||
<div class="main-wrapper">
|
||
<!-- Календарь слева -->
|
||
<div class="calendar-box">
|
||
<div class="calendar-header">
|
||
<button id="prevMonth" class="calendar-nav-btn"><</button>
|
||
<h3 id="calendarTitle"></h3>
|
||
<button id="nextMonth" class="calendar-nav-btn">></button>
|
||
</div>
|
||
<div class="calendar-weekdays">
|
||
<div class="weekday">Пн</div>
|
||
<div class="weekday">Вт</div>
|
||
<div class="weekday">Ср</div>
|
||
<div class="weekday">Чт</div>
|
||
<div class="weekday">Пт</div>
|
||
<div class="weekday">Сб</div>
|
||
<div class="weekday">Вс</div>
|
||
</div>
|
||
<div id="calendarDays" class="calendar-days"></div>
|
||
</div>
|
||
|
||
<!-- Основной контент с формой заметки -->
|
||
<div class="main">
|
||
<div class="markdown-buttons">
|
||
<button class="btnMarkdown" id="boldBtn">
|
||
<i class="fas fa-bold"></i>
|
||
</button>
|
||
<button class="btnMarkdown" id="italicBtn">
|
||
<i class="fas fa-italic"></i>
|
||
</button>
|
||
<button class="btnMarkdown" id="headerBtn">
|
||
<i class="fas fa-heading"></i>
|
||
</button>
|
||
<button class="btnMarkdown" id="listBtn">
|
||
<i class="fas fa-list-ul"></i>
|
||
</button>
|
||
<button class="btnMarkdown" id="quoteBtn">
|
||
<i class="fas fa-quote-right"></i>
|
||
</button>
|
||
<button class="btnMarkdown" id="codeBtn">
|
||
<i class="fas fa-code"></i>
|
||
</button>
|
||
<button class="btnMarkdown" id="linkBtn">
|
||
<i class="fas fa-link"></i>
|
||
</button>
|
||
</div>
|
||
|
||
<textarea
|
||
class="textInput"
|
||
id="noteInput"
|
||
placeholder="Ваша заметка..."
|
||
></textarea>
|
||
<div class="save-button-container">
|
||
<button class="btnSave" id="saveBtn">Сохранить</button>
|
||
<span class="save-hint">или нажмите Alt + Enter</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="notes-container">
|
||
<div id="notesList">
|
||
<!-- Заметки будут загружаться здесь -->
|
||
</div>
|
||
</div>
|
||
<div class="footer">
|
||
<p>Создатель: <span>Fovway</span></p>
|
||
</div>
|
||
<script src="https://cdnjs.cloudflare.com/ajax/libs/marked/11.1.0/marked.min.js"></script>
|
||
<script src="/app.js"></script>
|
||
<script src="/calendar.js"></script>
|
||
</body>
|
||
</html>
|