From 07c95224444555cbb5000099ef504cfb13b46853 Mon Sep 17 00:00:00 2001 From: Andus Date: Fri, 9 May 2025 23:02:30 +0200 Subject: [PATCH] Statusy, Wersja Mobilna, Logo PaperMC MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - Dodano statusy serwerów dla wszystkich (#13) - Mobilna Wersja Panelu (#18) - Zamieniono logo PaperMC na ich nowy link --- app/routes.py | 12 +- app/static/style.css | 307 +++++++++++++++++++------------- app/templates/dashboard.html | 7 +- app/templates/home.html | 20 ++- app/templates/layout.html | 6 +- app/templates/server_list.html | 27 --- app/templates/servers_list.html | 32 ++++ app/templates/setup.html | 2 +- 8 files changed, 245 insertions(+), 168 deletions(-) delete mode 100644 app/templates/server_list.html create mode 100644 app/templates/servers_list.html diff --git a/app/routes.py b/app/routes.py index 5d94663..a0c5e1d 100644 --- a/app/routes.py +++ b/app/routes.py @@ -21,7 +21,7 @@ def home(): username = oidc.user_getfield("preferred_username") server_path = f"./servers/mc-{username}" has_server = os.path.exists(server_path) - return render_template("home.html", has_server=has_server) + return render_template("home.html", has_server=has_server, is_logged_in=is_logged_in) @main.route('/setup') @@ -61,8 +61,8 @@ def list_ads(): return jsonify(files) -@main.route("/servers") -def server_list(): +@main.route("/status") +def servers_status(): servers_dir = "./servers" server_dirs = [ d for d in os.listdir(servers_dir) @@ -73,18 +73,18 @@ def server_list(): for server_dir in server_dirs: server_name = server_dir - server_status = "stopped" + server_status = "Offline" try: container = client.containers.get(server_name) if container.status == "running": - server_status = "running" + server_status = "Online" except NotFound: pass server_data.append({"name": server_name, "status": server_status}) - return render_template('server_list.html', servers=server_data) + return render_template('servers_list.html', servers=server_data) @main.app_errorhandler(404) diff --git a/app/static/style.css b/app/static/style.css index 855be04..054bac1 100644 --- a/app/static/style.css +++ b/app/static/style.css @@ -1,3 +1,6 @@ +/* Imports */ +@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;600&display=swap'); + /* Reset & Base Styles */ * { margin: 0; @@ -103,7 +106,7 @@ h2 { /* Tabs */ .tabs { display: grid; - grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); + grid-template-columns: repeat(3, 1fr); gap: 14px; margin-bottom: 26px; } @@ -209,6 +212,7 @@ h2 { .btn-primary { background: #4a5aef; color: white; box-shadow: 0 0 10px #4a5aef99; } .btn-success { background: #2ecc71; color: white; box-shadow: 0 0 10px #2ecc7199; } .btn-danger { background: #e74c3c; color: white; box-shadow: 0 0 10px #e74c3c99; } +.btn-worsedanger { background: #8b0000; color: white; box-shadow: 0 0 10px #8b000099; } .btn-warning { background: #f39c12; color: black; box-shadow: 0 0 10px #f39c1288; } .btn-info { background: #3498db; color: white; box-shadow: 0 0 10px #3498db99; } @@ -256,18 +260,7 @@ h2 { background-color: #666; } -/* Chart Container */ -.chart-container { - background: #12121c; - padding: 20px; - border-radius: 14px; - margin-top: 30px; - border: 1px solid #232334; - box-shadow: 0 0 12px #1a1a2a; - overflow-x: auto; -} - -body > *:not(script):not(style):not(.cursor-glow) { +body > *:not(.cursor-glow) { animation: growIn 0.6s ease-out; } @@ -577,117 +570,187 @@ a.non-link:hover { color: #000; } -/* Mobile Tweaks */ -@media (max-width: 480px) { - html { - font-size: clamp(14px, 2.5vw, 16px); - } - - /* Heading adjustment */ - h2 { - font-size: 1.5rem; - } - - /* Dashboard Card */ - .dashboard-card { - padding: 16px; - max-width: 100%; - } - - /* Tab buttons */ - .tab-button { - padding: 10px; - font-size: 0.85rem; - } - - /* Square button adjustments */ - .square-button { - width: 100%; - aspect-ratio: unset; - flex-direction: row; - justify-content: flex-start; - gap: 12px; - padding: 10px; - font-size: 0.9rem; - } - - .square-button img { - width: 32px; - margin: 0; - } - - /* Navigation Bar */ - .top-nav { - padding: 12px; - font-size: 0.9rem; - flex-direction: column; - align-items: flex-start; - } - - .nav-links a { - margin-left: 10px; - font-size: 0.9rem; - } - - /* Console Output */ - .console-output { - font-size: 0.8rem; - height: 160px; - } - - /* Chart container */ - .chart-container { - width: 100%; - height: auto; - padding: 12px; - } - - /* Buttons */ - .btn { - font-size: 0.9rem; - padding: 12px; - width: 100%; - } - - /* Form layout */ - form { - padding: 0 8px; - } - - /* Tab content spacing */ - .tab-content { - margin-top: 8px; - } - - /* Particle background on small screens */ - #particle-background { - display: none; /* Improves performance */ - } - - /* Charts Row - Allow horizontal scroll */ - .charts-row { +/* Servers Status */ +.server-table-container { overflow-x: auto; - padding-bottom: 10px; - } - - /* Input Fields */ - input[type="text"], input[type="number"], select { - width: 100%; - } - - /* Adjust drop zone */ - #drop-zone { - padding: 20px; - } - - /* Adjust text area height */ - .console-output { - height: 160px; - } + padding: 1rem; + border-radius: 16px; + background: rgba(14, 14, 26, 0.6); + backdrop-filter: blur(12px); + border: 1px solid #1a1a2a; + box-shadow: 0 0 24px rgba(74, 90, 239, 0.15); } -/* Additional general fixes for small screens */ +.server-table { + width: 100%; + border-collapse: collapse; + color: #f0f0f0; + font-size: 0.95rem; + border-radius: 12px; + overflow: hidden; +} + +.server-table thead { + background: linear-gradient(145deg, #1a1a2f, #23233a); + text-transform: uppercase; + letter-spacing: 0.05em; + font-size: 0.85rem; + color: #b9c5ff; +} + +.server-table th, +.server-table td { + padding: 1rem; + text-align: left; + border-bottom: 1px solid rgba(255, 255, 255, 0.05); +} + +.server-table tbody tr:hover { + background: rgba(255, 255, 255, 0.03); + transition: background 0.3s ease; +} + +.server-table th:first-child, +.server-table td:first-child { + border-left: none; +} + +.server-table th:last-child, +.server-table td:last-child { + border-right: none; +} + +.server-table tbody tr { + box-shadow: inset 0 0 0 rgba(0, 0, 0, 0); + transition: box-shadow 0.2s ease; +} +.server-table tbody tr:hover { + box-shadow: inset 0 0 12px rgba(255, 255, 255, 0.03); +} + +.status-label { + display: inline-block; + padding: 0.4em 0.75em; + border-radius: 999px; + font-weight: 600; + font-size: 0.875rem; + text-transform: capitalize; + color: white; +} + +.status-label.online { + background-color: #2ecc71; +} + +.status-label.offline { + background-color: #e74c3c; +} + +/* Mobile Tweaks */ +@media (max-width: 768px) { + html { + font-size: clamp(15px, 4vw, 16px); + } + + body { + padding: 0 8px; + } + + h1, h2, h3 { + line-height: 1.2; + } + + .dashboard-card { + padding: 16px; + max-width: 100%; + box-sizing: border-box; + } + + .tabs { + display: grid; + grid-template-columns: repeat(2, 1fr); + gap: 10px; + margin-bottom: 12px; + } + + .tab-button { + padding: 12px; + font-size: 0.95rem; + width: 100%; + box-sizing: border-box; + } + + .square-button { + display: flex; + align-items: center; + width: 100%; + flex-direction: row; + justify-content: flex-start; + gap: 12px; + padding: 12px; + font-size: 0.95rem; + } + + .square-button img { + width: 32px; + height: auto; + margin: 0; + } + + .top-nav { + flex-direction: column; + align-items: center; + justify-content: center; + text-align: center; + } + + .nav-links { + display: flex; + flex-direction: row; + align-items: center; + margin-top: 12px; + } + + .chart-container { + width: 100%; + height: auto; + padding: 12px; + } + + .btn { + font-size: 0.95rem; + padding: 14px; + width: 100%; + } + + form { + padding: 0 8px; + } + + .tab-content { + margin-top: 12px; + } + + .charts-row { + overflow-x: auto; + padding-bottom: 10px; + } + + input[type="text"], input[type="number"], select, textarea { + width: 100%; + font-size: 1rem; + padding: 10px; + box-sizing: border-box; + } + + #drop-zone { + padding: 20px; + } +} + +/* Universal Fixes */ * { - max-width: 100%; - word-wrap: break-word; + max-width: 100%; + word-wrap: break-word; + box-sizing: border-box; } \ No newline at end of file diff --git a/app/templates/dashboard.html b/app/templates/dashboard.html index f3a5c4e..51d76c0 100644 --- a/app/templates/dashboard.html +++ b/app/templates/dashboard.html @@ -6,9 +6,6 @@ - - -
@@ -25,7 +22,7 @@
- +
@@ -113,7 +110,7 @@
-

Zainstaluj mody/pluginy z Modrinth

+

Zainstaluj mody/pluginy z Modrinth

diff --git a/app/templates/home.html b/app/templates/home.html index 17c2244..578efec 100644 --- a/app/templates/home.html +++ b/app/templates/home.html @@ -2,20 +2,30 @@ {% block content %}

MCPanel

-

Jesteśmy 1.5x lepsi od Aternosa!

+

- {% if has_server %} - Idź do panelu + {% if is_logged_in %} + {% if has_server %} + Idź do panelu + {% else %} + Ustaw własny serwer + {% endif %} {% else %} - Ustaw własny serwer + Zaloguj się {% endif %} + Wiadomości +
+ +
+ +

Wiadomości:

+

Soon™