From 5344195674559837871823517c3c652420416e79 Mon Sep 17 00:00:00 2001 From: Lev Date: Wed, 19 Nov 2025 20:27:16 +0300 Subject: [PATCH] =?UTF-8?q?=D0=A0=D0=B5=D0=B3=D0=B8=D1=81=D1=82=D1=80?= =?UTF-8?q?=D0=B0=D1=86=D0=B8=D1=8F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- Frontend/Pages/control-panel.html | 11 +++ Frontend/Pages/register.html | 34 ++++++++ Frontend/Styles/offer.css | 41 +++++++-- Frontend/Styles/register.css | 133 ++++++++++++++++++++++++++++++ 4 files changed, 210 insertions(+), 9 deletions(-) create mode 100644 Frontend/Pages/control-panel.html create mode 100644 Frontend/Pages/register.html create mode 100644 Frontend/Styles/register.css diff --git a/Frontend/Pages/control-panel.html b/Frontend/Pages/control-panel.html new file mode 100644 index 0000000..d01f779 --- /dev/null +++ b/Frontend/Pages/control-panel.html @@ -0,0 +1,11 @@ + + + + + + Document + + + + + \ No newline at end of file diff --git a/Frontend/Pages/register.html b/Frontend/Pages/register.html new file mode 100644 index 0000000..90cc8e2 --- /dev/null +++ b/Frontend/Pages/register.html @@ -0,0 +1,34 @@ + + + + + + Регистрация - SpectralVPN + + + + +
+

Регистрация

+ + +
+ + +
+ + +
+
+ + +
+
+
+ + +
+ +
+ + \ No newline at end of file diff --git a/Frontend/Styles/offer.css b/Frontend/Styles/offer.css index 641c927..a1c45c0 100644 --- a/Frontend/Styles/offer.css +++ b/Frontend/Styles/offer.css @@ -6,7 +6,9 @@ --border: #333355; } -*{ box-sizing: border-box; margin:0; padding:0; } +*{ + box-sizing: border-box; margin:0; padding:0; +} body{ font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; @@ -32,12 +34,25 @@ header{ border-bottom: 1px solid var(--border); } -h1{ font-size: 2.2rem; color: var(--accent); margin:0; } -h2{ font-size: 1.5rem; color: var(--accent); margin-top: 2rem; border-left: 4px solid var(--accent); padding-left: 12px; } -h3{ font-size: 1.2rem; color: #c0c0ff; margin-top: 1.5rem; } +h1{ + font-size: 2.2rem; color: var(--accent); margin:0; +} -p, li{ font-size: 1rem; margin: 0.8rem 0; } -ul, ol{ padding-left: 20px; } +h2{ + font-size: 1.5rem; color: var(--accent); margin-top: 2rem; border-left: 4px solid var(--accent); padding-left: 12px; +} + +h3{ + font-size: 1.2rem; color: #c0c0ff; margin-top: 1.5rem; +} + +p, li{ + font-size: 1rem; margin: 0.8rem 0; +} + +ul, ol{ + padding-left: 20px; +} code{ background: #2a2a3a; @@ -74,10 +89,18 @@ code{ font-weight: 600; transition: 0.3s; } -.btn:hover{ background: #5a45b0; transform: translateY(-2px); } -a{ color: var(--accent); text-decoration: none; } -a:hover{ text-decoration: underline; } +.btn:hover{ + background: #5a45b0; transform: translateY(-2px); +} + +a{ + color: var(--accent); text-decoration: none; +} + +a:hover{ + text-decoration: underline; +} @media (max-width: 768px) { .container { margin: 20px; padding: 20px; } diff --git a/Frontend/Styles/register.css b/Frontend/Styles/register.css new file mode 100644 index 0000000..763260a --- /dev/null +++ b/Frontend/Styles/register.css @@ -0,0 +1,133 @@ +:root{ + --accent: cyan; + --bg-dark: rgb(8, 8, 8); + --card-bg: rgb(22, 22, 22); + --text: #e0e0e0; + --border: var(--accent); +} + +*{ + margin: 0; + padding: 0; + box-sizing: border-box; + font-family: 'Inter', sans-serif; + color: var(--text); +} + +body{ + background-color: var(--bg-dark); + display: flex; + justify-content: center; + align-items: center; + min-height: 100vh; + padding: 20px; +} + +form{ + display: flex; + flex-direction: column; + background-color: var(--card-bg); + border: 1px solid var(--border); + border-radius: 15px; + padding: 30px 25px; + width: 100%; + max-width: 380px; +} + +h1{ + text-align: center; + margin-bottom: 20px; + color: var(--accent); + font-weight: 700; + font-size: 1.8rem; +} + +label{ + margin-top: 16px; + margin-bottom: 6px; + font-size: 0.95rem; + font-weight: 500; + display: block; +} + +.input{ + padding: 12px 14px; + background-color: rgba(255, 255, 255, 0.05); + border: 1px solid rgba(0, 255, 255, 0.3); + border-radius: 10px; + color: white; + font-size: 1rem; + outline: none; +} + +.input:focus{ + border-color: var(--accent); +} + +.input::placeholder{ + color: rgba(255, 255, 255, 0.4); +} + +.checkbox-container{ + display: flex; + align-items: center; + gap: 10px; + margin-top: 16px; + font-size: 0.9rem; + line-height: 1.4; +} + +.checkbox-container input[type="checkbox"]{ + accent-color: var(--accent); + width: 18px; + height: 18px; + margin: 0; + flex-shrink: 0; +} + +.checkbox-container a{ + color: var(--accent); + text-decoration: underline; +} + +button{ + margin-top: 24px; + padding: 14px; + background-color: black; + color: var(--accent); + border: 1px solid var(--accent); + border-radius: 10px; + font-weight: 600; + font-size: 1.1rem; + cursor: pointer; + transition: all 0.3s ease; +} + +button:hover{ + background-color: var(--accent); + color: black; + transform: translateY(-1px); + box-shadow: 0 4px 12px rgba(0, 255, 255, 0.3); +} + +button:active{ + transform: translateY(0); + box-shadow: 0 2px 6px rgba(0, 255, 255, 0.2); +} + +.error{ + color: #ff6b6b; + font-size: 0.85rem; + margin-top: 6px; + min-height: 20px; +} + +@media (max-width: 480px) { + form{ + padding: 25px 20px; + } + + h1{ + font-size: 1.6rem; + } +} \ No newline at end of file