diff --git a/TZ_gamification_markdown.md b/TZ_gamification_markdown.md
index 5042285..21d9bd0 100644
--- a/TZ_gamification_markdown.md
+++ b/TZ_gamification_markdown.md
@@ -1,8 +1,8 @@
# Техническое задание
Задача 9
-Создание мотивационного
-модуля геймификации
+Создание мотивационного
+модуля геймификации
для кадровой системы «Алабуги»
Суть
diff --git a/backend/app/services/storage.py b/backend/app/services/storage.py
index 166ba62..b800fad 100644
--- a/backend/app/services/storage.py
+++ b/backend/app/services/storage.py
@@ -5,7 +5,10 @@ from __future__ import annotations
import base64
import mimetypes
import shutil
+
from pathlib import Path
+import mimetypes
+import base64
from fastapi import UploadFile
diff --git a/frontend/src/app/layout.tsx b/frontend/src/app/layout.tsx
index c0f2443..c94e2ba 100644
--- a/frontend/src/app/layout.tsx
+++ b/frontend/src/app/layout.tsx
@@ -61,7 +61,7 @@ export default async function RootLayout({ children }: { children: React.ReactNo
Автостопом по Алабуге
- Всегда держите полотенце под рукой и следуйте подсказкам бортового гидронавигатора
+ Всегда держите полотенце под рукой и следуйте подсказкам бортового навигатора
diff --git a/frontend/src/styles/globals.css b/frontend/src/styles/globals.css
index d94a25e..fe77182 100644
--- a/frontend/src/styles/globals.css
+++ b/frontend/src/styles/globals.css
@@ -2,11 +2,12 @@
color-scheme: dark;
--bg: #080b1a;
--bg-panel: #111633;
- --accent: #6c5ce7;
- --accent-light: #a29bfe;
+ --accent: #00AEEF;
+ --accent-light: #6ACFF6;
+ --accent-dark: #005dac;
--text: #f5f6fa;
--text-muted: #b2bec3;
- --success: #00b894;
+ --success: #00B894;
--error: #ff7675;
font-family: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}
@@ -14,9 +15,11 @@
body {
margin: 0;
padding: 0;
- background: radial-gradient(circle at 20% 20%, rgba(108, 92, 231, 0.2), transparent),
- radial-gradient(circle at 80% 0%, rgba(0, 184, 148, 0.2), transparent),
- var(--bg);
+ background: radial-gradient(circle at 20% 30%, rgba(106, 207, 246, 0.15), transparent 40%),
+ radial-gradient(circle at 80% 20%, rgba(0, 174, 239, 0.1), transparent 30%),
+ radial-gradient(circle at 40% 80%, rgba(0, 93, 172, 0.08), transparent 35%),
+ linear-gradient(135deg, #1a2a75 0%, #004a8c 50%, #1a2a75 100%),
+ var(--bg);
color: var(--text);
min-height: 100vh;
position: relative;
@@ -50,7 +53,7 @@ main {
.card {
background: rgba(17, 22, 51, 0.85);
- border: 1px solid rgba(162, 155, 254, 0.2);
+ border: 1px solid rgba(106, 207, 246, 0.2);
border-radius: 16px;
padding: 1.5rem;
backdrop-filter: blur(10px);
@@ -59,7 +62,7 @@ main {
.admin-form {
display: grid;
- gap: 1rem;
+ gap: 1.5rem;
}
.admin-form label {
@@ -67,17 +70,28 @@ main {
flex-direction: column;
gap: 0.5rem;
font-size: 0.9rem;
+ color: var(--accent-light);
}
.admin-form input,
.admin-form textarea,
.admin-form select {
border-radius: 12px;
- border: 1px solid rgba(162, 155, 254, 0.3);
+ border: 1px solid rgba(106, 207, 246, 0.3);
background: rgba(8, 11, 26, 0.6);
padding: 0.75rem;
color: var(--text);
width: 100%;
+ font-family: inherit;
+ transition: all 0.3s ease;
+}
+
+.admin-form input:focus,
+.admin-form textarea:focus,
+.admin-form select:focus {
+ outline: none;
+ border-color: var(--accent);
+ box-shadow: 0 0 0 2px rgba(0, 174, 239, 0.2);
}
.admin-form textarea {
@@ -89,6 +103,16 @@ main {
flex-direction: row;
align-items: center;
gap: 0.5rem;
+ cursor: pointer;
+}
+
+.admin-form .checkbox input[type="checkbox"] {
+ width: auto;
+ accent-color: var(--accent);
+}
+
+.admin-form .checkbox span {
+ color: var(--text);
}
.grid {
@@ -98,36 +122,86 @@ main {
}
.badge {
- background: rgba(162, 155, 254, 0.15);
+ background: rgba(106, 207, 246, 0.15);
border-radius: 9999px;
padding: 0.25rem 0.75rem;
font-size: 0.75rem;
color: var(--accent-light);
text-transform: uppercase;
letter-spacing: 0.08em;
+ display: inline-block;
+ border: 1px solid rgba(106, 207, 246, 0.2);
+}
+
+.badge.success {
+ background: rgba(0, 184, 148, 0.15);
+ color: var(--success);
+ border-color: rgba(0, 184, 148, 0.3);
+}
+
+.badge.error {
+ background: rgba(255, 118, 117, 0.15);
+ color: var(--error);
+ border-color: rgba(255, 118, 117, 0.3);
}
.primary {
padding: 0.75rem 1.5rem;
border-radius: 12px;
border: none;
- background: linear-gradient(135deg, var(--accent), #00b894);
+ background: linear-gradient(135deg, var(--accent), var(--accent-dark));
color: white;
font-weight: 600;
cursor: pointer;
+ font-family: inherit;
+ transition: all 0.3s ease;
+}
+
+.primary:hover:not(:disabled) {
+ transform: translateY(-2px);
+ box-shadow: 0 8px 20px rgba(0, 174, 239, 0.3);
}
.primary:disabled {
opacity: 0.4;
cursor: not-allowed;
+ transform: none !important;
+ box-shadow: none !important;
}
.secondary {
padding: 0.75rem 1.5rem;
border-radius: 12px;
- border: 1px solid rgba(162, 155, 254, 0.4);
+ border: 1px solid rgba(106, 207, 246, 0.4);
background: transparent;
color: var(--text-muted);
font-weight: 500;
cursor: pointer;
+ font-family: inherit;
+ transition: all 0.3s ease;
+}
+
+.secondary:hover {
+ border-color: var(--accent-light);
+ color: var(--accent-light);
+ background: rgba(106, 207, 246, 0.1);
+}
+
+.alert {
+ padding: 1rem;
+ border-radius: 12px;
+ margin: 1rem 0;
+ border: 1px solid;
+}
+
+.alert.success {
+ background: rgba(0, 184, 148, 0.1);
+ border-color: rgba(0, 184, 148, 0.3);
+ color: var(--success);
+}
+
+.alert.error {
+ background: rgba(255, 118, 117, 0.1);
+ border-color: rgba(255, 118, 117, 0.3);
+ color: var(--error);
}