cursor-agent/watersurf-erp
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update: стили по брендбуку, Geologica, логотип в шапке

Browse Source 
Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
cursor-agent
2026-02-25 16:10:38 +00:00
parent 0da095f657
commit 9fba1427b4
4 changed files with 136 additions and 74 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
HISTORY.md
View File

@@ -1,5 +1,19 @@
# История изменений ERP WaterSurf
## 2025-02-25 20:15 UTC – Стили по корпоративному брендбуку и логотип
**Проблема**: Нужно привести интерфейс в соответствие с корпоративным брендбуком WaterSurf и использовать логотип компании.
**Решение**:
- В `static/css/theme.css` применены цвета брендбука: базовый фон #0A121D, ключевой акцент #0DADBB, градации серого (Gray 01–04), дополнительные красный/зелёный для состояний.
- Подключён шрифт Geologica (Google Fonts): Light для основного текста, Medium для подзаголовков, Bold для заголовков; учтён letter-spacing по брендбуку.
- В шапке вместо текстовой надписи выводится логотип WaterSurf из `static/images/watersurf-logo.png`, рядом — подпись «ERP».
- Сохранены тёмная тема, минималистичные карточки, таблицы и формы в едином стиле.
**Изменения**: base.html (подключение Geologica, логотип в навбаре), theme.css (палитра и типографика брендбука), добавлен каталог static/images и файл watersurf-logo.png.
---
## 2025-02-25 19:00 UTC – Кнопка «Добавить строку» в табличной части заказов
**Проблема**: В форме заказа клиента (и заказа поставщику) нельзя было добавить более одной строки товаров — formset показывал только одну пустую строку (extra=1).

192
app/static/css/theme.css
View File

@@ -1,23 +1,38 @@
/* ERP WaterSurf — тёмная тема, минималистичный интерфейс */
/* ERP WaterSurf — стили по корпоративному брендбуку */
/* Базовые цвета брендбука */
:root {
--ws-bg-page: #0d1117;
--ws-bg-surface: #161b22;
--ws-bg-elevated: #21262d;
--ws-bg-hover: #30363d;
--ws-border: #30363d;
--ws-border-focus: #58a6ff;
--ws-text: #e6edf3;
--ws-text-muted: #8b949e;
--ws-accent: #2dd4bf;
--ws-accent-hover: #5eead4;
--ws-danger: #f87171;
--ws-danger-bg: rgba(248, 113, 113, 0.12);
--ws-success-bg: rgba(45, 212, 191, 0.12);
--ws-white: #FFFFFF;
--ws-gray-01: #F5F9FD;
--ws-gray-02: #DCE7EF;
--ws-gray-03: #B1C7D7;
--ws-gray-04: #617E92;
/* Базовый цвет — глубина, стабильность (тёмная тема) */
--ws-black: #0A121D;
/* Ключевой цвет бренда — динамика, энергия */
--ws-accent: #0DADBB;
--ws-accent-hover: #34AFE3;
--ws-accent-light: #E3F7FF;
/* Дополнительные: опасность, успех */
--ws-danger: #FF3A20;
--ws-danger-dark: #AA1400;
--ws-success: #13AD53;
/* Поверхности тёмной темы на базе --ws-black */
--ws-bg-page: #0A121D;
--ws-bg-surface: #0f1823;
--ws-bg-elevated: #151d2b;
--ws-bg-hover: #1a2435;
--ws-border: #2a3647;
--ws-border-focus: #0DADBB;
--ws-text: #F5F9FD;
--ws-text-muted: #B1C7D7;
--ws-text-secondary: #617E92;
--ws-danger-bg: rgba(255, 58, 32, 0.12);
--ws-success-bg: rgba(19, 173, 83, 0.12);
--ws-radius: 8px;
--ws-radius-sm: 6px;
--ws-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
--ws-font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
--ws-shadow: 0 1px 3px rgba(0, 0, 0, 0.4);
--ws-font: "Geologica", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
* {
@@ -31,13 +46,34 @@ html {
body {
background: var(--ws-bg-page);
color: var(--ws-text);
font-family: var(--ws-font-sans);
font-size: 15px;
line-height: 1.6;
font-family: var(--ws-font);
font-weight: 300;
font-size: 16px;
line-height: 1.5;
letter-spacing: -0.02em;
min-height: 100vh;
-webkit-font-smoothing: antialiased;
}
/* Типографика по масштабу брендбука: p3 16/24 -2% для основного текста */
.ws-page-title {
font-size: 24px;
line-height: 1.25;
letter-spacing: -0.02em;
font-weight: 700;
margin-bottom: 1rem;
color: var(--ws-text);
}
.ws-form-section-title {
font-size: 20px;
line-height: 1.3;
letter-spacing: -0.02em;
font-weight: 500;
margin-bottom: 0.75rem;
color: var(--ws-text);
}
/* Навбар */
.navbar-ws {
background: var(--ws-bg-surface) !important;
@@ -46,19 +82,34 @@ body {
}
.navbar-ws .navbar-brand {
display: flex;
align-items: center;
gap: 0.75rem;
color: var(--ws-text) !important;
font-weight: 600;
font-weight: 700;
font-size: 1.1rem;
letter-spacing: -0.02em;
}
.navbar-ws .navbar-brand img {
height: 36px;
width: auto;
object-fit: contain;
}
.navbar-ws .navbar-brand:hover {
color: var(--ws-accent) !important;
}
.navbar-ws .navbar-brand:hover img {
opacity: 0.95;
}
.navbar-ws .nav-link {
color: var(--ws-text-muted) !important;
border-radius: var(--ws-radius-sm);
padding: 0.4rem 0.75rem !important;
font-weight: 400;
}
.navbar-ws .nav-link:hover {
@@ -86,7 +137,8 @@ body {
.navbar-ws .navbar-text {
color: var(--ws-text-muted);
font-size: 0.9rem;
font-size: 14px;
letter-spacing: -0.01em;
}
.navbar-ws .navbar-toggler {
@@ -101,13 +153,6 @@ body {
padding: 1.5rem 1rem 3rem;
}
.ws-page-title {
font-size: 1.5rem;
font-weight: 600;
margin-bottom: 1rem;
color: var(--ws-text);
}
/* Карточки */
.ws-card {
background: var(--ws-bg-surface);
@@ -148,10 +193,10 @@ body {
.ws-table th {
background: var(--ws-bg-elevated);
font-weight: 600;
font-size: 0.85rem;
color: var(--ws-text-muted);
text-transform: none;
font-weight: 500;
font-size: 14px;
letter-spacing: -0.01em;
color: var(--ws-text-secondary);
}
.ws-table tbody tr:hover {
@@ -169,7 +214,7 @@ body {
.ws-table .ws-link {
color: var(--ws-accent);
text-decoration: none;
font-size: 0.9rem;
font-size: 14px;
}
.ws-table .ws-link:hover {
@@ -182,23 +227,24 @@ body {
}
.ws-table .ws-link-danger:hover {
color: #fca5a5;
color: var(--ws-danger-dark);
}
/* Кнопки */
/* Кнопки — ключевой цвет бренда */
.btn-ws-primary {
background: var(--ws-accent);
color: var(--ws-bg-page);
color: var(--ws-black);
border: none;
border-radius: var(--ws-radius-sm);
padding: 0.5rem 1rem;
font-weight: 500;
font-size: 0.9rem;
font-size: 14px;
letter-spacing: -0.01em;
}
.btn-ws-primary:hover {
background: var(--ws-accent-hover);
color: var(--ws-bg-page);
color: var(--ws-black);
}
.btn-ws-secondary {
@@ -207,13 +253,13 @@ body {
border: 1px solid var(--ws-border);
border-radius: var(--ws-radius-sm);
padding: 0.5rem 1rem;
font-size: 0.9rem;
font-size: 14px;
}
.btn-ws-secondary:hover {
background: var(--ws-bg-hover);
color: var(--ws-text);
border-color: var(--ws-border);
border-color: var(--ws-gray-04);
}
.btn-ws-danger {
@@ -222,12 +268,12 @@ body {
border: 1px solid var(--ws-danger);
border-radius: var(--ws-radius-sm);
padding: 0.5rem 1rem;
font-size: 0.9rem;
font-size: 14px;
}
.btn-ws-danger:hover {
background: var(--ws-danger);
color: var(--ws-bg-page);
color: var(--ws-white);
}
.ws-btn-group {
@@ -245,7 +291,8 @@ body {
.ws-form-group label {
display: block;
font-weight: 500;
font-size: 0.9rem;
font-size: 14px;
letter-spacing: -0.01em;
color: var(--ws-text-muted);
margin-bottom: 0.35rem;
}
@@ -260,7 +307,8 @@ body {
border: 1px solid var(--ws-border);
border-radius: var(--ws-radius-sm);
color: var(--ws-text);
font-size: 0.95rem;
font-size: 15px;
font-family: var(--ws-font);
}
.ws-form-group input:focus,
@@ -268,13 +316,13 @@ body {
.ws-form-group textarea:focus {
outline: none;
border-color: var(--ws-border-focus);
box-shadow: 0 0 0 2px rgba(88, 166, 255, 0.25);
box-shadow: 0 0 0 2px rgba(13, 173, 187, 0.25);
}
.ws-form-group input::placeholder,
.ws-form-group textarea::placeholder {
color: var(--ws-text-muted);
opacity: 0.8;
color: var(--ws-text-secondary);
opacity: 0.9;
}
.ws-form-login input,
@@ -287,18 +335,19 @@ body {
border: 1px solid var(--ws-border);
border-radius: var(--ws-radius-sm);
color: var(--ws-text);
font-size: 0.95rem;
font-size: 15px;
font-family: var(--ws-font);
}
.ws-form-login input:focus {
outline: none;
border-color: var(--ws-border-focus);
box-shadow: 0 0 0 2px rgba(88, 166, 255, 0.25);
box-shadow: 0 0 0 2px rgba(13, 173, 187, 0.25);
}
.ws-text-danger {
color: var(--ws-danger);
font-size: 0.85rem;
font-size: 14px;
display: block;
margin-top: 0.25rem;
}
@@ -309,13 +358,6 @@ body {
border-top: 1px solid var(--ws-border);
}
.ws-form-section-title {
font-size: 1rem;
font-weight: 600;
margin-bottom: 0.75rem;
color: var(--ws-text);
}
/* Сообщения (alerts) */
.ws-alert {
padding: 0.75rem 1rem;
@@ -326,21 +368,21 @@ body {
.ws-alert-success {
background: var(--ws-success-bg);
color: var(--ws-accent);
border-color: rgba(45, 212, 191, 0.3);
color: var(--ws-success);
border-color: rgba(19, 173, 83, 0.3);
}
.ws-alert-error,
.ws-alert-danger {
background: var(--ws-danger-bg);
color: var(--ws-danger);
border-color: rgba(248, 113, 113, 0.3);
border-color: rgba(255, 58, 32, 0.3);
}
.ws-alert-warning {
background: rgba(251, 191, 36, 0.12);
color: #fbbf24;
border-color: rgba(251, 191, 36, 0.3);
background: rgba(255, 136, 0, 0.12);
color: #FF8800;
border-color: rgba(255, 136, 0, 0.3);
}
.ws-alert .btn-close {
@@ -352,8 +394,8 @@ body {
.ws-empty {
text-align: center;
padding: 2rem 1rem;
color: var(--ws-text-muted);
font-size: 0.95rem;
color: var(--ws-text-secondary);
font-size: 15px;
}
/* Логин */
@@ -364,8 +406,10 @@ body {
}
.ws-login-title {
font-size: 1.5rem;
font-weight: 600;
font-size: 24px;
line-height: 1.25;
letter-spacing: -0.02em;
font-weight: 700;
margin-bottom: 1.5rem;
text-align: center;
}
@@ -377,14 +421,17 @@ body {
}
.ws-hero h1 {
font-size: 1.75rem;
font-weight: 600;
font-size: 32px;
line-height: 1.25;
letter-spacing: -0.02em;
font-weight: 700;
margin-bottom: 0.5rem;
}
.ws-hero p {
color: var(--ws-text-muted);
font-size: 1rem;
font-size: 16px;
line-height: 1.5;
}
/* Подсказка удаления */
@@ -403,7 +450,8 @@ body {
border: 1px solid var(--ws-border);
color: var(--ws-text);
padding: 0.4rem 0.5rem;
font-size: 0.9rem;
font-size: 14px;
font-family: var(--ws-font);
}
.ws-form-card .ws-form-group input,
@@ -421,7 +469,7 @@ body {
.ws-table input:focus,
.ws-table select:focus {
border-color: var(--ws-border-focus);
box-shadow: 0 0 0 2px rgba(88, 166, 255, 0.2);
box-shadow: 0 0 0 2px rgba(13, 173, 187, 0.2);
}
/* Списки документов — выравнивание чисел */

BIN
app/static/images/watersurf-logo.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 17 KiB

4
app/templates/base.html
View File

@@ -7,7 +7,7 @@
<title>{% block title %}ERP WaterSurf{% endblock %}</title>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Geologica:wght@300;500;700&display=swap" rel="stylesheet">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">
<link href="{% static 'css/theme.css' %}" rel="stylesheet">
{% block extra_css %}{% endblock %}
@@ -15,7 +15,7 @@
<body>
<nav class="navbar navbar-expand-lg navbar-dark navbar-ws">
<div class="container-fluid">
<a class="navbar-brand" href="{% url 'users:home' %}">WaterSurf ERP</a>
<a class="navbar-brand" href="{% url 'users:home' %}"><img src="{% static 'images/watersurf-logo.png' %}" alt="WaterSurf"> ERP</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Меню">
<span class="navbar-toggler-icon"></span>
</button>