kultmost/avtopost.kultmost.ru
SHA256
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix

Browse Source
This commit is contained in:
Vladislav 2026-07-31 06:08:46 -04:00
parent b1135bc9ed
commit 93fa48c5a2
6 changed files with 291 additions and 246 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

37
templates/articles.html
View File

@ -33,13 +33,21 @@
{% macro style() -%} {% macro style() -%}
<style type="text/css"> <style type="text/css">
h2,p {
max-width: 100%;
overflow-wrap: break-word;
word-break: break-word;
hyphens: auto;
}
.c_qx7jk{margin: 100px 0;} .c_qx7jk{margin: 100px 0;}
.c_h9bsw{width: 100%;object-fit: scale-down;} .c_h9bsw{width: 100%;object-fit: scale-down;}
section,.c_brfx5,.c_brfx5>a{box-sizing: unset;}
.c_brfx5>a{width: 335px;}
@media (min-width: 901px) { @media (min-width: 901px) {
.c_2e7ix { color: #5F1798; font-family: Inter; font-size: 42px; font-style: normal; font-weight: 700; line-height: normal; } .c_2e7ix { color: #5F1798; font-family: Inter; padding-left: 100px; font-size: 42px; font-style: normal; font-weight: 700; line-height: normal; }
.c_h9bsw { align-self: stretch; border-radius: 5px; } .c_h9bsw { align-self: stretch; border-radius: 5px; }
.c_124dx { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; color: #000; text-overflow: ellipsis; font-family: Inter; font-size: 24px; font-style: normal; font-weight: 700; line-height: normal; } .c_124dx { max-width: 100%; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; color: #000; text-overflow: ellipsis; font-family: Inter; font-size: 24px; font-style: normal; font-weight: 700; line-height: normal; }
.c_38uav { display: flex; align-items: center; } .c_38uav { max-width: 100%; display: flex; align-items: center; }
.c_66s36 { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden; color: #3A3A3A; text-overflow: ellipsis; font-family: Inter; font-size: 16px; font-style: normal; font-weight: 400; line-height: normal; } .c_66s36 { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden; color: #3A3A3A; text-overflow: ellipsis; font-family: Inter; font-size: 16px; font-style: normal; font-weight: 400; line-height: normal; }
.c_ju2ew { display: flex; flex-direction: column; align-items: flex-start; gap: 5px; align-self: stretch; } .c_ju2ew { display: flex; flex-direction: column; align-items: flex-start; gap: 5px; align-self: stretch; }
.c_mdq6e { align-self: stretch; color: #5F1798; font-family: Inter; font-size: 14px; font-style: normal; font-weight: 400; line-height: normal; } .c_mdq6e { align-self: stretch; color: #5F1798; font-family: Inter; font-size: 14px; font-style: normal; font-weight: 400; line-height: normal; }
@ -50,16 +58,15 @@
.c_rsgdz { display: flex; justify-content: center; align-items: center; } .c_rsgdz { display: flex; justify-content: center; align-items: center; }
.c_sqo80 { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; color: #000; text-overflow: ellipsis; font-family: Inter; font-size: 24px; font-style: normal; font-weight: 700; line-height: normal; } .c_sqo80 { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; color: #000; text-overflow: ellipsis; font-family: Inter; font-size: 24px; font-style: normal; font-weight: 700; line-height: normal; }
.c_3ppy5 { display: flex; justify-content: center; align-items: center; } .c_3ppy5 { display: flex; justify-content: center; align-items: center; }
.c_brfx5 { display: flex; align-items: center; align-content: center; gap: 20px; align-self: stretch; flex-wrap: wrap; } .c_brfx5 { padding-left: 100px; display: flex; align-items: center; align-content: center; gap: 20px; align-self: stretch; flex-wrap: wrap; }
.c_brfx5>a{width: 335px;} .c_qx7jk { display: flex; box-sizing: unset; flex-direction: column; justify-content: center; align-items: flex-start; gap: 20px; background: #FFF; }
.c_qx7jk { display: flex; box-sizing: unset; padding-left: 100px; flex-direction: column; justify-content: center; align-items: flex-start; gap: 20px; background: #FFF; }
} }
@media (min-width: 700px) and (max-width: 900px) { @media (min-width: 700px) and (max-width: 900px) {
.c_2e7ix { color: #5F1798; font-family: Inter; font-size: 42px; font-style: normal; font-weight: 700; line-height: normal; } .c_2e7ix { color: #5F1798; font-family: Inter; padding-left: 50px; font-size: 42px; font-style: normal; font-weight: 700; line-height: normal; }
.c_h9bsw { align-self: stretch; border-radius: 5px; } .c_h9bsw { align-self: stretch; border-radius: 5px; }
.c_124dx { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; color: #000; text-overflow: ellipsis; font-family: Inter; font-size: 24px; font-style: normal; font-weight: 700; line-height: normal; } .c_124dx { max-width: 100%; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; color: #000; text-overflow: ellipsis; font-family: Inter; font-size: 24px; font-style: normal; font-weight: 700; line-height: normal; }
.c_38uav { display: flex; align-items: center; } .c_38uav { max-width: 100%; display: flex; align-items: center; }
.c_66s36 { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden; color: #3A3A3A; text-overflow: ellipsis; font-family: Inter; font-size: 16px; font-style: normal; font-weight: 400; line-height: normal; } .c_66s36 { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden; color: #3A3A3A; text-overflow: ellipsis; font-family: Inter; font-size: 16px; font-style: normal; font-weight: 400; line-height: normal; }
.c_ju2ew { display: flex; flex-direction: column; align-items: flex-start; gap: 5px; align-self: stretch; } .c_ju2ew { display: flex; flex-direction: column; align-items: flex-start; gap: 5px; align-self: stretch; }
.c_mdq6e { align-self: stretch; color: #5F1798; font-family: Inter; font-size: 14px; font-style: normal; font-weight: 400; line-height: normal; } .c_mdq6e { align-self: stretch; color: #5F1798; font-family: Inter; font-size: 14px; font-style: normal; font-weight: 400; line-height: normal; }
@ -71,15 +78,15 @@
.c_sqo80 { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; color: #000; text-overflow: ellipsis; font-family: Inter; font-size: 24px; font-style: normal; font-weight: 700; line-height: normal; } .c_sqo80 { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; color: #000; text-overflow: ellipsis; font-family: Inter; font-size: 24px; font-style: normal; font-weight: 700; line-height: normal; }
.c_3ppy5 { display: flex; justify-content: center; align-items: center; } .c_3ppy5 { display: flex; justify-content: center; align-items: center; }
.c_brfx5>a{width: calc(50% - 10px);} .c_brfx5>a{width: calc(50% - 10px);}
.c_brfx5 { display: flex; align-items: center; align-content: center; gap: 20px; align-self: stretch; flex-wrap: wrap; } .c_brfx5 { padding-left: 50px; display: flex; align-items: center; align-content: center; gap: 20px; align-self: stretch; flex-wrap: wrap; }
.c_qx7jk { display: flex; box-sizing: unset; padding: 0 50px; flex-direction: column; justify-content: center; align-items: flex-start; gap: 20px; background: #FFF; } .c_qx7jk { display: flex; box-sizing: unset; flex-direction: column; justify-content: center; align-items: flex-start; gap: 20px; background: #FFF; }
} }
@media (max-width: 699px) { @media (max-width: 699px) {
.c_2e7ix { color: #5F1798; font-family: Inter; font-size: 42px; font-style: normal; font-weight: 700; line-height: normal; } .c_2e7ix { color: #5F1798; font-family: Inter; padding-left: 20px; font-size: 42px; font-style: normal; font-weight: 700; line-height: normal; }
.c_h9bsw { align-self: stretch; border-radius: 5px; } .c_h9bsw { align-self: stretch; border-radius: 5px; }
.c_124dx { color: #000; font-family: Inter; font-size: 24px; font-style: normal; font-weight: 700; line-height: normal; } .c_124dx { max-width: 100%; color: #000; font-family: Inter; font-size: 24px; font-style: normal; font-weight: 700; line-height: normal; }
.c_38uav { display: flex; align-items: center; } .c_38uav { max-width: 100%; display: flex; align-items: center; }
.c_66s36 { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; color: #3A3A3A; text-overflow: ellipsis; font-family: Inter; font-size: 16px; font-style: normal; font-weight: 400; line-height: normal; } .c_66s36 { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; color: #3A3A3A; text-overflow: ellipsis; font-family: Inter; font-size: 16px; font-style: normal; font-weight: 400; line-height: normal; }
.c_ju2ew { display: flex; flex-direction: column; align-items: flex-start; gap: 5px; align-self: stretch; } .c_ju2ew { display: flex; flex-direction: column; align-items: flex-start; gap: 5px; align-self: stretch; }
.c_mdq6e { align-self: stretch; color: #5F1798; font-family: Inter; font-size: 14px; font-style: normal; font-weight: 400; line-height: normal; } .c_mdq6e { align-self: stretch; color: #5F1798; font-family: Inter; font-size: 14px; font-style: normal; font-weight: 400; line-height: normal; }
@ -91,6 +98,6 @@
.c_sqo80 { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; color: #000; text-overflow: ellipsis; font-family: Inter; font-size: 24px; font-style: normal; font-weight: 700; line-height: normal; } .c_sqo80 { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; color: #000; text-overflow: ellipsis; font-family: Inter; font-size: 24px; font-style: normal; font-weight: 700; line-height: normal; }
.c_3ppy5 { display: flex; justify-content: center; align-items: center; } .c_3ppy5 { display: flex; justify-content: center; align-items: center; }
.c_brfx5 { display: flex; justify-content: center; align-items: flex-start; align-content: flex-start; gap: 20px; align-self: stretch; flex-wrap: wrap; } .c_brfx5 { display: flex; justify-content: center; align-items: flex-start; align-content: flex-start; gap: 20px; align-self: stretch; flex-wrap: wrap; }
.c_qx7jk { display: flex; box-sizing: unset; padding: 0 20px; flex-direction: column; justify-content: center; align-items: flex-start; gap: 20px; background: #FFF; } .c_qx7jk { display: flex; box-sizing: unset; flex-direction: column; justify-content: center; align-items: flex-start; gap: 20px; background: #FFF; }
}</style> }</style>
{%- endmacro %} {%- endmacro %}

15
templates/base.html
View File

File diff suppressed because one or more lines are too long

386
templates/components/header.html
View File

@ -7,15 +7,15 @@ function toggleMenu() {
line.classList.toggle('active'); line.classList.toggle('active');
}); });
} }
document.addEventListener('DOMContentLoaded', () => { document.addEventListener('DOMContentLoaded', () => {
const btn = document.getElementById('menu_button'); const btn = document.getElementById('menu_button');
const menu = document.getElementById('menu'); const menu = document.getElementById('menu');
const menu2 = document.getElementById('menu2'); const menu2 = document.getElementById('menu2');
const iconHamburger = document.getElementById('icon_hamburger');
const iconClose = document.getElementById('icon_close');
if (!btn) return; if (!btn) return;
btn.addEventListener('click', () => { btn.addEventListener('click', () => {
toggleMenu() toggleMenu();
const isOpen = btn.getAttribute('aria-expanded') === 'true'; const isOpen = btn.getAttribute('aria-expanded') === 'true';
const newState = !isOpen; const newState = !isOpen;
btn.setAttribute('aria-expanded', String(newState)); btn.setAttribute('aria-expanded', String(newState));
@ -24,154 +24,36 @@ document.addEventListener('DOMContentLoaded', () => {
}); });
}); });
</script> </script>
<style>
.nav-icon {display: flex;flex-direction: column;justify-content: space-around;height: 24px;cursor: pointer;position: relative;width: 100%;}
.line {right: 0;display: block;width: 42px;height: 0;transition: all 0.3s ease;position: absolute;border: 1.5px solid;}
.line1{top:3px}
.line2{width: 32px;top: 10px;}
.line3{top: 18px;}
.line1.active {max-width: 30px;top: 9px;transform: rotate(135deg);}
.line2.active {transform: translateX(-500px);}
.line3.active {max-width: 30px;top: 9px;transform: rotate(-135deg);}
</style>
<header class="c_xirl1">
<div class="c_uh9b6">
<a class="c_7dj6c" href="/">
<img src="/static/logo375.jpeg" class="c_vnonn b_cj7sg" crossorigin="anonymous" fetchpriority="high">
</a>
<div class="avatar">
{% if user %}
<a class="c_n2zau" href="/profile">
<img src="/a/{{user._id}}" class="b_e59wr" crossorigin="anonymous" fetchpriority="high">
</a>
{% endif %}
<button id="menu_button" class="c_pcz1l b_oxx99">
<div class="nav-icon">
<span class="line line1"></span>
<span class="line line2"></span>
<span class="line line3"></span>
</div>
</button>
</div>
</div>
<nav id="menu" class="c_olmk1">
<a class="c_qmp95 b_fokm1" href="/">Главная</a>
<a class="c_qmp95 b_fokm1" href="https://kultmost.ru/post">Маркетплейс</a>
{% if user %}
<a class="c_qmp95 b_fokm1" href="/my-paints">Мои картины</a>
{% endif %}
{% if user and 'users:read' in user.get('scopes',[]) %}
<a class="c_qmp95 b_fokm1" href="/artists">Художники</a>
{% endif %}
<a class="c_qmp95 b_fokm1" href="/partner">Партнеры</a>
<a class="c_qmp95 b_fokm1" href="/about">О платформе</a>
<a class="c_qmp95 b_fokm1" href="/news">Новости</a>
<a class="c_qmp95 b_fokm1 mob" href="/profile">Личный кабинет</a>
{% if user and 'admin' in user.get('roles',[]) %}
<a class="c_qmp95 b_fokm1 btn" href="/admin">Админ-панель</a>
{% endif %}
{% if user and 'back' in user.get('scopes',[]) %}
<span id="backBtn" class="c_qmp95 b_fokm1 btn">Переключиться на Админа</span>
<script>
document.getElementById('backBtn').addEventListener('click', async () => {
try {
const resp = await fetch('/api/admin/back', { method: 'POST' });
if (!resp.ok) {
const text = await resp.text();
console.error('Server error:', resp.status, text);
return;
}
window.location.href = '/profile';
} catch (err) {
console.error('Network error:', err);
}
});
</script>
{% endif %}
<span
id="shareBtn" data-imagetext="🎨 Рекомендую! 👍"
data-image="/static/share.png" data-link="/" data-text="Рекомендую!"
class="c_qmp95 b_fokm1 mob shareService">Поделиться сервисом</span>
{% if user is none %}
<div class="mob auth">
<a href="/registration">Регистрация</a>
<span>/</span>
<a href="/login">Вход</a>
</div>
{% endif %}
</nav>
{% if user %}
<a class="c_n2zau" id="menu2" href="/profile">
<img src="/a/{{user._id}}" class="c_27foz b_e59wr" crossorigin="anonymous" fetchpriority="high">
<div class="c_kl46b b_qel18">
<span class="c_poz0x b_zp47n">{{user.username}}</span>
<span class="c_poz0x b_zp47n">Личный кабинет</span>
</div>
</a>
{% else %}
<div class="auth" id="menu2">
<a href="/registration">Регистрация</a>
<span>/</span>
<a href="/login">Вход</a>
</div>
{% endif %}
{% if user %}
{% if user.notify %}
<div class="header-right">
<div class="notifications-wrapper">
<button class="notifications-btn" id="notificationsBtn">
<svg width="24" height="24" viewBox="0 0 24 24" fill="none">
<path d="M15 17H9C9 18.6569 10.3431 20 12 20C13.6569 20 15 18.6569 15 17Z" fill="#333"/>
<path d="M18 8C18 6.4087 17.3679 4.88258 16.2426 3.75736C15.1174 2.63214 13.5913 2 12 2C10.4087 2 8.88258 2.63214 7.75736 3.75736C6.63214 4.88258 6 6.4087 6 8C6 11.0902 5.22047 13.206 4.34966 14.6054C3.87894 15.4286 3.5 16.5 3.5 17.5H20.5C20.5 16.5 20.1211 15.4286 19.6503 14.6054C18.7795 13.206 18 11.0902 18 8Z" stroke="#333" stroke-width="2"/>
</svg>
{% set notify = user.notify | selectattr('read') | list %}
{% if notify | length > 0%}
<span class="notification-badge" id="notificationCount">{{ notify | length }}</span>
{%endif%}
</button>
<div class="notifications-dropdown" id="notificationsDropdown">
<div class="dropdown-header">
<h3>Уведомления</h3>
<button class="c_qmp95 b_fokm1 btn" id="markAsReadBtn">Отметить все как прочитанные</button>
<script>
</script>
</div>
<div class="notifications-list" id="notificationsList">
</div>
</div>
</div>
</div>
{% endif %}
{% endif %}
</header>
{% if user %} {% if user %}
{% if user.notify %} {% if user.notify %}
<script> <script>
async function removeShow() {
document.getElementById('notificationsDropdown').classList.remove('show');
document.getElementById('closeNotify').classList.remove('show');
document.getElementById('notificationsBtn').setAttribute('aria-expanded', 'false');
}
async function showNotify() {
const isOpen = document.getElementById('notificationsDropdown').classList.contains('show');
const newState = !isOpen;
document.getElementById('notificationsDropdown').classList.toggle('show', newState);
document.getElementById('closeNotify').classList.toggle('show', newState);
document.getElementById('notificationsBtn').setAttribute('aria-expanded', String(newState));
}
document.addEventListener('DOMContentLoaded', () => {
// Function to update notifications after marking them as read // Function to update notifications after marking them as read
function updateNotifications(updatedData) { function updateNotifications(updatedData) {
// Hide notification count if no unread notifications document.querySelectorAll('#notificationCount').forEach(elem => elem.style.display = 'none');
document.querySelectorAll('#notificationCount').forEach(elem=>elem.style.display = 'none');
// Clear existing notifications list
const notificationsList = document.getElementById('notificationsList'); const notificationsList = document.getElementById('notificationsList');
notificationsList.innerHTML = ''; // Clear the existing list notificationsList.innerHTML = '';
// Re-add notifications to the list
notificationsArray.forEach(item => { notificationsArray.forEach(item => {
addNotification( addNotification(
item.title, item.title,
item.text, item.text,
item.date, item.dateStr,
item.link, item.link,
false false
); );
@ -190,8 +72,8 @@ document.addEventListener('DOMContentLoaded', () => {
showToast({ message: 'Ошибка', status: 'error' }); showToast({ message: 'Ошибка', status: 'error' });
throw new Error('Network response was not ok'); throw new Error('Network response was not ok');
} }
return response.json().then(data => { return response.json().then(data => {
notificationsArray.forEach(item => item.read = true);
updateNotifications(); updateNotifications();
}); });
}) })
@ -201,17 +83,24 @@ document.addEventListener('DOMContentLoaded', () => {
}); });
}); });
// Handling dropdown for notifications // === Открытие уведомлений — так же, как меню ===
const btn = document.getElementById('notificationsBtn'); const notifyBtn = document.getElementById('notificationsBtn');
const dropdown = document.getElementById('notificationsDropdown'); const dropdown = document.getElementById('notificationsDropdown');
const closeOverlay = document.getElementById('closeNotify');
btn.addEventListener('click', (e) => {
// Клик по кнопке уведомлений
notifyBtn.addEventListener('click', (e) => {
e.stopPropagation(); e.stopPropagation();
dropdown.classList.toggle('show'); // showNotify();
}); });
document.addEventListener('click', () => { // Клик внутри дропдауна не закрывает
dropdown.classList.remove('show'); dropdown.addEventListener('click', (e) => {
e.stopPropagation();
}); });
function addNotification(title, text, time, link = '#', unread = true) { function addNotification(title, text, time, link = '#', unread = true) {
@ -228,60 +117,190 @@ document.addEventListener('DOMContentLoaded', () => {
<small>${time}</small> <small>${time}</small>
</div> </div>
`; `;
itemLink.prepend(item); itemLink.prepend(item);
list.prepend(itemLink); list.prepend(itemLink);
} }
// Initial load of notifications // Initial load of notifications
const notificationsArray = []; const notificationsArray = [];
{% for item in user.notify %}
notificationsArray.push({
title: "{{ item.title | e }}",
text: "{{ item.text | e }}",
dateStr: "{{ (item._id.generation_time.strftime('%d.%m.%Y')) if item._id else '' }}",
link: "{{ item.link | e }}",
read: Boolean({{ 1 if item.read else 0 }})
});
{% endfor %}
{% for item in user.notify %} function parseDate(dateStr) {
notificationsArray.push({ if (!dateStr) return null;
title: "{{ item.title }}", const [dd, mm, yyyy] = dateStr.split('.');
text: "{{ item.text }}", const d = new Date(Number(yyyy), Number(mm) - 1, Number(dd));
dateStr: "{{ (item._id.generation_time.strftime('%d.%m.%Y')) if item._id else '' }}", return isNaN(d.getTime()) ? null : d;
link: "{{ item.link }}", }
read: Boolean({{ 1 if item.read else 0 }})
notificationsArray.sort((a, b) => {
// 1) unread first
const aRead = a.read ? 1 : 0;
const bRead = b.read ? 1 : 0;
if (aRead !== bRead) return aRead - bRead;
// 2) newest first
const aTime = parseDate(a.dateStr)?.getTime() ?? 0;
const bTime = parseDate(b.dateStr)?.getTime() ?? 0;
return bTime - aTime;
}); });
{% endfor %}
// Parse dd.mm.YYYY -> Date (or null if missing/invalid)
function parseDate(dateStr) {
if (!dateStr) return null;
const [dd, mm, yyyy] = dateStr.split('.');
const d = new Date(Number(yyyy), Number(mm) - 1, Number(dd));
return isNaN(d.getTime()) ? null : d;
}
notificationsArray.sort((a, b) => {
// 1) unread first
const aRead = a.read ? 1 : 0;
const bRead = b.read ? 1 : 0;
if (aRead !== bRead) return aRead - bRead;
// 2) newest first (fallback to 0 for missing dates)
const aTime = parseDate(a.dateStr)?.getTime() ?? 0;
const bTime = parseDate(b.dateStr)?.getTime() ?? 0;
return aTime - bTime;
});
notificationsArray.forEach(item => {
addNotification(item.title, item.text, item.dateStr, item.link, item.read);
});
notificationsArray.forEach(item => {
addNotification(item.title, item.text, item.dateStr, item.link, item.read);
});
});
</script> </script>
{% endif %} {% endif %}
{% endif %} {% endif %}
<style>
.nav-icon {display: flex;flex-direction: column;justify-content: space-around;height: 24px;cursor: pointer;position: relative;width: 100%;}
.line {right: 0;display: block;width: 42px;height: 0;transition: all 0.3s ease;position: absolute;border: 1px solid;}
.line1{top:3px}
.line2{width: 32px;top: 10px;}
.line3{top: 18px;}
.line1.active {max-width: 30px;top: 9px;transform: rotate(135deg);}
.line2.active {transform: translateX(-500px);}
.line3.active {max-width: 30px;top: 9px;transform: rotate(-135deg);}
</style>
<header class="c_xirl1">
<div class="c_uh9b6">
<a class="c_7dj6c" href="/">
<img src="/static/logo375.jpeg" class="c_vnonn b_cj7sg" crossorigin="anonymous" fetchpriority="high">
</a>
<div class="avatar">
{% if user %}
<a class="c_n2zau" href="/profile">
<img src="/a/{{user._id}}" class="b_e59wr" crossorigin="anonymous" fetchpriority="high">
</a>
{% endif %}
<button id="menu_button" class="c_pcz1l b_oxx99" aria-expanded="false">
<div class="nav-icon">
<span class="line line1"></span>
<span class="line line2"></span>
<span class="line line3"></span>
</div>
</button>
</div>
</div>
<nav id="menu" class="c_olmk1">
<a class="c_qmp95 b_fokm1" href="/">Главная</a>
<a class="c_qmp95 b_fokm1" href="https://kultmost.ru/post">Маркетплейс</a>
{% if user %}
<a class="c_qmp95 b_fokm1" href="/my-paints">Мои картины</a>
{% endif %}
{% if user and 'users:read' in user.get('scopes',[]) %}
<a class="c_qmp95 b_fokm1" href="/artists">Художники</a>
{% endif %}
<a class="c_qmp95 b_fokm1" href="/partner">Партнеры</a>
<a class="c_qmp95 b_fokm1" href="/about">О платформе</a>
<a class="c_qmp95 b_fokm1" href="/news">Новости</a>
<a class="c_qmp95 b_fokm1 mob" href="/profile">Личный кабинет</a>
{% if user and 'admin' in user.get('roles',[]) %}
<a class="c_qmp95 b_fokm1 btn" href="/admin">Админ-панель</a>
{% endif %}
{% if user and 'back' in user.get('scopes',[]) %}
<span id="backBtn" class="c_qmp95 b_fokm1 btn">Переключиться на Админа</span>
<script defer>
document.getElementById('backBtn').addEventListener('click', async () => {
try {
const resp = await fetch('/api/admin/back', { method: 'POST' });
if (!resp.ok) {
const text = await resp.text();
console.error('Server error:', resp.status, text);
return;
}
window.location.href = '/profile';
} catch (err) {
console.error('Network error:', err);
}
});
</script>
{% endif %}
<span
id="shareBtn" data-imagetext="🎨 Рекомендую! 👍"
data-image="/static/share.png" data-link="/" data-text="Рекомендую!"
class="c_qmp95 b_fokm1 mob shareService">Поделиться сервисом</span>
{% if user is none %}
<div class="mob auth">
<a href="/registration">Регистрация</a>
<span>/</span>
<a href="/login">Вход</a>
</div>
{% endif %}
</nav>
{% if user %}
<a class="c_n2zau" id="menu2" href="/profile">
<img src="/a/{{user._id}}" class="c_27foz b_e59wr" crossorigin="anonymous" fetchpriority="high">
<div class="c_kl46b b_qel18">
<span class="c_poz0x b_zp47n">{{user.username}}</span>
<span class="c_poz0x b_zp47n">Личный кабинет</span>
</div>
</a>
{% else %}
<div class="auth" id="menu2">
<a href="/registration">Регистрация</a>
<span>/</span>
<a href="/login">Вход</a>
</div>
{% endif %}
{% if user %}
{% if user.notify %}
<div class="header-right">
<div class="notifications-wrapper">
<button class="notifications-btn" id="notificationsBtn" aria-expanded="false" onclick="showNotify()">
<svg width="24" height="24" viewBox="0 0 24 24" fill="none">
<path d="M15 17H9C9 18.6569 10.3431 20 12 20C13.6569 20 15 18.6569 15 17Z" fill="#333"/>
<path d="M18 8C18 6.4087 17.3679 4.88258 16.2426 3.75736C15.1174 2.63214 13.5913 2 12 2C10.4087 2 8.88258 2.63214 7.75736 3.75736C6.63214 4.88258 6 6.4087 6 8C6 11.0902 5.22047 13.206 4.34966 14.6054C3.87894 15.4286 3.5 16.5 3.5 17.5H20.5C20.5 16.5 20.1211 15.4286 19.6503 14.6054C18.7795 13.206 18 11.0902 18 8Z" stroke="#333" stroke-width="2"/>
</svg>
{% set notify = user.notify | selectattr('read') | list %}
{% if notify | length > 0 %}
<span class="notification-badge" id="notificationCount">{{ notify | length }}</span>
{% endif %}
</button>
<div>
<div id="closeNotify" class="closeNotify" onclick="showNotify()"></div>
<div class="notifications-dropdown" id="notificationsDropdown">
<div class="dropdown-header">
<strong>Уведомления</strong>
<button class="c_qmp95 b_fokm1 btn" id="markAsReadBtn">Отметить все как прочитанные</button>
</div>
<div class="notifications-list" id="notificationsList">
</div>
</div>
</div>
</div>
</div>
{% endif %}
{% endif %}
</header>
{%- endmacro %} {%- endmacro %}
{% macro style() -%} {% macro style() -%}
<style type="text/css">/* Base (common) styles */ <style type="text/css">/* Base (common) styles */
.closeNotify{display: none;position: fixed;
width: 100vw;
height: 100vh;
top: 0;
left: 0;
}
.closeNotify.show {display: block;z-index: 2;}
.notifications-wrapper {position: relative;} .notifications-wrapper {position: relative;}
.notifications-btn {background: none;border: none;padding: 8px;cursor: pointer;position: relative} .notifications-btn {background: none;border: none;padding: 8px;cursor: pointer;position: relative}
.notification-badge {position: absolute;top: 0;right: 4px;background: #e74c3c;color: white;font-size: 11px;font-weight: bold;min-width: 16px;height: 16px;border-radius: 50%;display: flex;align-items: center;justify-content: center;padding: 0 4px;} .notification-badge {position: absolute;top: 0;right: 4px;background: #e74c3c;color: white;font-size: 11px;font-weight: bold;min-width: 16px;height: 16px;border-radius: 50%;display: flex;align-items: center;justify-content: center;padding: 0 4px;}
.notifications-dropdown {position: absolute;top: 100%;right: 0;width: 380px;background: white;border-radius: 12px;box-shadow: 0 10px 30px rgba(0,0,0,0.15);display: none;z-index: 2000;margin-top: 8px;overflow: hidden;} .notifications-dropdown {position: absolute;top: 100%;right: 0;width: 380px;background: white;border-radius: 12px;box-shadow: 0 10px 30px rgba(0,0,0,0.15);display: none;z-index: 2000;margin-top: 8px;overflow: hidden;}
.notifications-dropdown.show {display: block;} .notifications-dropdown.show {display: block;z-index: 500;}
.dropdown-header {padding: 16px 20px;border-bottom: 1px solid #eee;display: flex;justify-content: space-between;align-items: center;gap: 15px;} .dropdown-header {padding: 16px 20px;border-bottom: 1px solid #eee;display: flex;justify-content: space-between;align-items: center;gap: 15px;}
.notifications-list {max-height: 420px;overflow-y: auto;} .notifications-list {max-height: 420px;overflow-y: auto;}
.notification-item {padding: 14px 20px;border-bottom: 1px solid #f0f0f0;transition: background 0.2s;color: #1F1F1F;} .notification-item {padding: 14px 20px;border-bottom: 1px solid #f0f0f0;transition: background 0.2s;color: #1F1F1F;}
@ -291,13 +310,12 @@ document.addEventListener('DOMContentLoaded', () => {
.b_2jukj { fill: #1F1F1F; height: 12px; width: 18px; } .b_2jukj { fill: #1F1F1F; height: 12px; width: 18px; }
.b_dhbqs { flex-shrink: 0; height: 24px; width: 24px; } .b_dhbqs { flex-shrink: 0; height: 24px; width: 24px; }
.b_oxx99 { align-items: center; display: flex; height: 48px; justify-content: center; width: 48px; } .b_oxx99 { align-items: center; display: flex; height: 48px; justify-content: center; width: 48px; }
.b_fokm1 { font-family: Inter; font-size: 16px; font-style: normal; font-weight: 400; line-height: normal; text-decoration-skip-ink: auto; text-decoration-style: solid; text-decoration-thickness: auto; text-underline-offset: auto; text-underline-position: from-font; } .b_fokm1 { display: flex; font-family: Inter; font-size: 16px; font-style: normal; font-weight: 400; line-height: normal; text-decoration-skip-ink: auto; text-decoration-style: solid; text-decoration-thickness: auto; text-underline-offset: auto; text-underline-position: from-font; }
.b_e59wr { border-radius: 1em; height: 70px; min-width: 70px; max-width: 170px; object-fit: cover; object-position: top; } .b_e59wr { border-radius: 1em; height: 70px; min-width: 70px; max-width: 170px; object-fit: cover; object-position: top; }
.b_zp47n { align-self: stretch; color: #5F1798; font-family: Inter; font-size: 16px; font-style: normal; font-weight: 400; line-height: normal; max-width: 210px; } .b_zp47n { align-self: stretch; color: #5F1798; font-family: Inter; font-size: 16px; font-style: normal; font-weight: 400; line-height: normal; max-width: 210px; }
.b_qel18 { align-items: flex-start; display: flex; flex-direction: column; gap: 5px; justify-content: center; } .b_qel18 { align-items: flex-start; display: flex; flex-direction: column; gap: 5px; justify-content: center; }
.avatar{display: flex;align-items: center;gap: 22px;} .avatar{display: flex;align-items: center;gap: 22px;}
nav>a{color: #111;} nav>a{color: #111;}
.auth>a, .auth>span{color: #5f1798; font-size: 20px;} .auth>a, .auth>span{color: #5f1798; font-size: 20px;}
.auth{display: flex;gap: 5px;} .auth{display: flex;gap: 5px;}
.mob{display: none;} .mob{display: none;}
@ -316,7 +334,6 @@ nav>a{color: #111;}
.c_n2zau { align-items: center; display: flex; flex: 1 0 0; gap: 20px; max-width: 345px;} .c_n2zau { align-items: center; display: flex; flex: 1 0 0; gap: 20px; max-width: 345px;}
.c_xirl1 { align-content: center; align-items: center; align-self: stretch; background: #FFF; display: flex; flex-wrap: wrap; justify-content: space-between; padding: 20px 15px; row-gap: 20px; } .c_xirl1 { align-content: center; align-items: center; align-self: stretch; background: #FFF; display: flex; flex-wrap: wrap; justify-content: space-between; padding: 20px 15px; row-gap: 20px; }
} }
/* Tablet */ /* Tablet */
@media (min-width: 700px) and (max-width: 900px) { @media (min-width: 700px) and (max-width: 900px) {
#menu, #menu2 { display: none; } #menu, #menu2 { display: none; }
@ -328,7 +345,6 @@ nav>a{color: #111;}
.c_n2zau { align-items: center; display: flex; flex: 1 0 0; gap: 20px; } .c_n2zau { align-items: center; display: flex; flex: 1 0 0; gap: 20px; }
.c_xirl1 { align-content: center; align-items: center; align-self: stretch; background: #FFF; display: flex; flex-wrap: wrap; justify-content: space-between; padding: 20px; row-gap: 20px; } .c_xirl1 { align-content: center; align-items: center; align-self: stretch; background: #FFF; display: flex; flex-wrap: wrap; justify-content: space-between; padding: 20px; row-gap: 20px; }
} }
/* Desktop */ /* Desktop */
@media (min-width: 901px) { @media (min-width: 901px) {
.avatar,#menu_button{display: none;} .avatar,#menu_button{display: none;}

76
templates/components/profile_card.html
View File

@ -15,31 +15,16 @@
{% if 'admin' not in user.get('roles', []) %} {% if 'admin' not in user.get('roles', []) %}
{% if 'partner' in user.get('roles', [])%} {% if 'partner' in user.get('roles', [])%}
{% if 'partner' in user.get('profile', '') %} {% if 'partner' in user.get('profile', '') %}
<button class="c_6cfr8 b_m2ah9 b" id="switch-profile"> <button class="c_6cfr8 b_m2ah9 b" onclick="switchProfile()">
<span class="c_d2l0b b_al8e7">Личный кабинет галериста</span> <span class="c_d2l0b b_al8e7">Личный кабинет галериста</span>
</button> </button>
{% else %} {% else %}
<button class="c_6cfr8 b_m2ah9 b" id="switch-profile"> <button class="c_6cfr8 b_m2ah9 b" onclick="switchProfile()">
<span class="c_d2l0b b_al8e7">Личный кабинет партнера</span> <span class="c_d2l0b b_al8e7">Личный кабинет партнера</span>
</button> </button>
{% endif %} {% endif %}
{% endif %} {% endif %}
{% endif %} {% endif %}
<script>
document.getElementById('switch-profile')?.addEventListener('click', async (e) => {
e.preventDefault();
try {
const resp = await fetch('/api/switch-profile', {
method: 'POST',
headers: { 'Content-Type': 'application/json' }
});
if (!resp.ok) throw new Error('Network error');
window.location.href = '/profile';
} catch (err) {
console.error(err);
}
});
</script>
<!-- <a href="/profile" class="c_6cfr8 b_m2ah9"><span class="c_d2l0b b_al8e7">Кабинет <!-- <a href="/profile" class="c_6cfr8 b_m2ah9"><span class="c_d2l0b b_al8e7">Кабинет
Автопост</span></a> --> Автопост</span></a> -->
<p class="c_kpaav b_xsvl1">Профиль</p> <p class="c_kpaav b_xsvl1">Профиль</p>
@ -58,29 +43,9 @@
<input class="c_ijkun b_jkzqx" type="file" accept="image/*" id="avatar" name="avatar"> <input class="c_ijkun b_jkzqx" type="file" accept="image/*" id="avatar" name="avatar">
</div> </div>
<p class="c_kpaav b_xsvl1">{{user.username}}</p> <p class="c_kpaav b_xsvl1">{{user.username}}</p>
<button id="logoutBtn" class="c_ryjri b_yzw2z"> <button onclick="logout()" class="c_ryjri b_yzw2z">
<span class="c_d2l0b b_al8e7">Выйти</span> <span class="c_d2l0b b_al8e7">Выйти</span>
</button> </button>
<script>
document.getElementById('logoutBtn').addEventListener('click', async function () {
try {
const resp = await fetch('/logout', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
credentials: 'same-origin'
});
if (resp.ok) {
window.location.href = '/';
} else {
console.error('Logout failed', resp.status);
}
} catch (err) {
console.error('Network error during logout', err);
}
});
</script>
</div> </div>
<div class="c_o5uzd b_h9dsc"> <div class="c_o5uzd b_h9dsc">
<p class="c_kpaav b_xsvl1">Нужна помощь?</p> <p class="c_kpaav b_xsvl1">Нужна помощь?</p>
@ -89,7 +54,40 @@
</a> </a>
</div> </div>
</div> </div>
<script> <script defer>
async function logout() {
try {
const resp = await fetch('/logout', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
credentials: 'same-origin'
});
if (resp.ok) {
window.location.href = '/';
} else {
console.error('Logout failed', resp.status);
}
} catch (err) {
console.error('Network error during logout', err);
}
}
</script>
<script defer>
async function switchProfile() {
try {
const resp = await fetch('/api/switch-profile', {
method: 'POST',
headers: { 'Content-Type': 'application/json' }
});
if (!resp.ok) throw new Error('Network error');
window.location.href = '/profile';
window.location.reload()
} catch (err) {
console.error(err);
}
}
</script>
<script defer>
document.addEventListener('DOMContentLoaded', () => { document.addEventListener('DOMContentLoaded', () => {
const avatarInput = document.getElementById('avatar'); const avatarInput = document.getElementById('avatar');
const preview = document.getElementById('preview'); const preview = document.getElementById('preview');

1
templates/index.html
View File

@ -14,6 +14,7 @@
<meta hid="og:url" property="og:url" content="https://avtopost.kultmost.ru/"> <meta hid="og:url" property="og:url" content="https://avtopost.kultmost.ru/">
<meta hid="description" name="description" content="Сервис создан для художников, скульпторов, искусствоведов, журналистов, галеристов, музеев и разных выставочных пространств с возможностью выложить пост картины, скульптуры, новостей, анонсов выставок или любую другую информацию, разместив сразу в нескольких Ваших социальных сетях интернета, арт-маркетплейсах и сообществах партнёров сервиса одним нажатием!"> <meta hid="description" name="description" content="Сервис создан для художников, скульпторов, искусствоведов, журналистов, галеристов, музеев и разных выставочных пространств с возможностью выложить пост картины, скульптуры, новостей, анонсов выставок или любую другую информацию, разместив сразу в нескольких Ваших социальных сетях интернета, арт-маркетплейсах и сообществах партнёров сервиса одним нажатием!">
<meta hid="og:site_name" property="og:site_name" content="KULTMOST.АВТОПОСТ"> <meta hid="og:site_name" property="og:site_name" content="KULTMOST.АВТОПОСТ">
<link rel="canonical" href="https://avtopost.kultmost.ru/"/>
{{ header.style() }} {{ header.style() }}
{{ main.style() }} {{ main.style() }}
{{ articles.style() }} {{ articles.style() }}

22
templates/partner/list.html
View File

@ -34,7 +34,9 @@
.c_2e7ix{ margin-bottom: 20px; text-transform: uppercase;} .c_2e7ix{ margin-bottom: 20px; text-transform: uppercase;}
/* Mobile */ /* Mobile */
@media (max-width: 699px) { @media (max-width: 699px) {
.c_j7mw1 { align-content: flex-start; align-items: flex-start; align-self: stretch; display: flex; flex-wrap: wrap; gap: 25px; justify-content: center; } .b_f7c7g { height: 230px; }
.c_j7mw1 > * + * { margin-top: 25px; }
.c_j7mw1 { align-content: flex-start; align-items: flex-start; align-self: stretch; display: flex; flex-wrap: wrap; justify-content: center; }
.c_du9p7 { margin: auto;align-items: center; background: #FFF; display: flex; flex-direction: column; width: 375px; } .c_du9p7 { margin: auto;align-items: center; background: #FFF; display: flex; flex-direction: column; width: 375px; }
.c_y32j2 { align-items: flex-start; display: flex; flex-direction: column; width: 100%; } .c_y32j2 { align-items: flex-start; display: flex; flex-direction: column; width: 100%; }
@ -42,15 +44,29 @@
/* Tablet */ /* Tablet */
@media (min-width: 700px) and (max-width: 900px) { @media (min-width: 700px) and (max-width: 900px) {
.b_f7c7g { height: 208px; }
.c_j7mw1 > *:nth-child(4n+3),
.c_j7mw1 > *:nth-child(4n+4),
.c_j7mw1 > *:nth-child(n+5){
margin-top: 25px;
}
.c_j7mw1 > *:nth-child(4n+2),
.c_j7mw1 > *:nth-child(4n+4){
margin-left: 25px;
}
.c_tccnr { background: #D9D9D9; width: 340px; } .c_tccnr { background: #D9D9D9; width: 340px; }
.c_j7mw1 { align-content: flex-start; align-items: flex-start; align-self: stretch; display: flex; flex-wrap: wrap; gap: 25px; } .c_j7mw1 { align-content: flex-start; align-items: flex-start; align-self: stretch; display: flex; flex-wrap: wrap; }
.c_du9p7 { align-items: flex-start; background: #FFF; display: flex; flex-direction: column; padding-left: 50px; width: 800px; } .c_du9p7 { align-items: flex-start; background: #FFF; display: flex; flex-direction: column; padding-left: 50px; width: 800px; }
} }
/* Desktop */ /* Desktop */
@media (min-width: 901px) { @media (min-width: 901px) {
.b_f7c7g { height: 275px; }
.c_j7mw1 > *:nth-child(n+4) { margin-top: 25px; }
.c_j7mw1 > *:nth-child(3n+2),
.c_j7mw1 > *:nth-child(3n+3) { margin-left: 25px; }
.c_y32j2 { align-items: flex-start; display: flex; flex-direction: column; width: 450px; } .c_y32j2 { align-items: flex-start; display: flex; flex-direction: column; width: 450px; }
.c_j7mw1 { align-content: center; align-items: center; align-self: stretch; display: flex; flex-wrap: wrap; gap: 25px; } .c_j7mw1 { align-content: center; align-items: center; align-self: stretch; display: flex; flex-wrap: wrap; }
.c_du9p7 { align-items: flex-start; background: #FFF; display: flex; flex-direction: column; padding-left: 100px; width: 1600px; } .c_du9p7 { align-items: flex-start; background: #FFF; display: flex; flex-direction: column; padding-left: 100px; width: 1600px; }
}</style> }</style>
{%- endmacro %} {%- endmacro %}