Fovway/NoteJS
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: обновлены стили для мобильной адаптации и изменена версия CSS

Browse Source 
- Обновлена версия подключения стилей в notes.html
- Добавлены новые стили для мобильной адаптации в style.css, включая изменения для контейнеров, заголовков и кнопок
This commit is contained in:
Fovway 2025-10-19 15:49:23 +07:00
parent e4b2be3052
commit 810e309db8
2 changed files with 91 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
public/notes.html
View File

@ -4,7 +4,7 @@
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Заметки</title> <title>Заметки</title>
<link rel="stylesheet" href="/style.css?v=2" /> <link rel="stylesheet" href="/style.css?v=4" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/iconify/2.0.0/iconify.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/iconify/2.0.0/iconify.min.js"></script>
</head> </head>
<body> <body>

90
public/style.css
View File

@ -895,3 +895,93 @@ textarea:focus {
background-color: #ffc107; background-color: #ffc107;
color: #000; color: #000;
} }
/* Мобильная адаптация */
@media (max-width: 768px) {
/* Скрываем левый блок с календарем, поиском и тегами */
.container-leftside {
display: none !important;
}
/* На мобильных устройствах меняем направление flex и центрируем */
body {
flex-direction: column;
gap: 0;
padding: 0 10px;
justify-content: flex-start;
align-items: center;
}
/* Центральный контейнер занимает всю ширину, но центрируется */
.center {
width: 100%;
max-width: 600px;
margin: 0 auto;
}
/* Адаптируем контейнер заметок */
.container {
width: 100%;
max-width: none;
margin-top: 10px;
padding: 10px;
box-sizing: border-box;
}
/* Адаптируем заголовок заметок */
.notes-header {
flex-direction: column;
align-items: flex-start;
gap: 10px;
width: 100%;
}
.notes-header-left {
width: 100%;
}
.user-info {
width: 100%;
justify-content: space-between;
flex-wrap: wrap;
gap: 10px;
}
/* Адаптируем кнопки markdown */
.markdown-buttons {
display: flex;
flex-wrap: wrap;
gap: 5px;
width: 100%;
justify-content: flex-start;
}
.markdown-buttons .btnMarkdown {
flex: 0 1 auto;
min-width: auto;
margin-right: 0;
padding: 8px 12px;
font-size: 14px;
}
/* Адаптируем textarea */
textarea {
min-height: 100px;
}
/* Адаптируем кнопку сохранения */
.save-button-container {
width: 100%;
flex-direction: column;
}
.btnSave {
width: 100%;
}
/* Адаптируем footer */
.footer {
position: relative;
margin-top: 20px;
}
}