BeamMP/BeamMP-Website
1
0
Fork 0
mirror of https://github.com/BeamMP/BeamMP-Website.git synced 2026-02-16 02:30:47 +00:00
Code Issues Packages Projects Releases Wiki Activity

various changes

Browse Source
This commit is contained in:
Starystars67
2025-11-30 17:39:52 +00:00
parent 9c85fb2f10
commit d5b7c52641
7 changed files with 33 additions and 69 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
index.html
View File

@@ -2,9 +2,9 @@
<html lang="en">
<head>
<meta charset="UTF-8" />
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
<link rel="icon" type="image/ico+xml" href="/favicon.ico" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>BeamMP Website Loading..</title>
<title>BeamMP Website</title>
</head>
<body>
<div id="app"></div>

BIN
public/favicon.ico Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 108 KiB

BIN
src/assets/BeamMP_blk.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 87 KiB

BIN
src/assets/BeamMP_wht.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 120 KiB

77
src/components/AppNavigation.vue
View File

@@ -24,21 +24,23 @@ function closeMobileMenu() {
</script>
<template>
<header
class="border-b border-neutral-200 dark:border-neutral-800 bg-white/80 dark:bg-neutral-900/70 backdrop-blur sticky top-0 z-20"
>
<header class="border-b border-neutral-200 dark:border-neutral-800 bg-white/80 dark:bg-neutral-900/70 backdrop-blur sticky top-0 z-20">
<nav class="max-w-6xl mx-auto px-4 h-16 flex items-center justify-between">
<RouterLink to="/" class="flex items-center gap-2 shrink-0" @click="closeMobileMenu">
<!-- Light mode logo -->
<img src="/beammp-logo.png" alt="BeamMP Logo" class="h-10 w-auto shrink-0 dark:hidden" />
<!-- Dark mode logo -->
<!-- Light mode logo (black) -->
<img
src="/beammp-logo-dark.png"
src="/src/assets/BeamMP_blk.png"
alt="BeamMP Logo"
class="h-10 w-auto shrink-0 hidden dark:block"
class="h-16 w-auto shrink-0 dark:hidden"
/>
<!-- Dark mode logo (white) -->
<img
src="/src/assets/BeamMP_wht.png"
alt="BeamMP Logo"
class="h-16 w-auto shrink-0 hidden dark:block"
/>
</RouterLink>
<!-- Desktop Navigation -->
<!-- Switch to mobile earlier (avoid logo crowding) -->
<div class="hidden lg:flex items-center gap-4">
@@ -50,12 +52,7 @@ function closeMobileMenu() {
href="https://forum.beammp.com"
target="_blank"
rel="noopener noreferrer"
:class="
cn(
navigationMenuTriggerStyle(),
'bg-transparent text-neutral-900 hover:bg-neutral-100 hover:text-neutral-900 dark:bg-transparent dark:text-white dark:hover:bg-neutral-800 dark:hover:text-white'
)
"
:class="cn(navigationMenuTriggerStyle(), 'bg-transparent text-neutral-900 hover:bg-neutral-100 hover:text-neutral-900 dark:bg-transparent dark:text-white dark:hover:bg-neutral-800 dark:hover:text-white')"
>
Forum
</a>
@@ -67,12 +64,7 @@ function closeMobileMenu() {
href="https://docs.beammp.com"
target="_blank"
rel="noopener noreferrer"
:class="
cn(
navigationMenuTriggerStyle(),
'bg-transparent text-neutral-900 hover:bg-neutral-100 hover:text-neutral-900 dark:bg-transparent dark:text-white dark:hover:bg-neutral-800 dark:hover:text-white'
)
"
:class="cn(navigationMenuTriggerStyle(), 'bg-transparent text-neutral-900 hover:bg-neutral-100 hover:text-neutral-900 dark:bg-transparent dark:text-white dark:hover:bg-neutral-800 dark:hover:text-white')"
>
Docs
</a>
@@ -82,12 +74,7 @@ function closeMobileMenu() {
<NavigationMenuLink as-child>
<RouterLink
to="/communities"
:class="
cn(
navigationMenuTriggerStyle(),
'bg-transparent text-neutral-900 hover:bg-neutral-100 hover:text-neutral-900 dark:bg-transparent dark:text-white dark:hover:bg-neutral-800 dark:hover:text-white'
)
"
:class="cn(navigationMenuTriggerStyle(), 'bg-transparent text-neutral-900 hover:bg-neutral-100 hover:text-neutral-900 dark:bg-transparent dark:text-white dark:hover:bg-neutral-800 dark:hover:text-white')"
>
Communities
</RouterLink>
@@ -97,12 +84,7 @@ function closeMobileMenu() {
<NavigationMenuLink as-child>
<RouterLink
to="/servers"
:class="
cn(
navigationMenuTriggerStyle(),
'bg-transparent text-neutral-900 hover:bg-neutral-100 hover:text-neutral-900 dark:bg-transparent dark:text-white dark:hover:bg-neutral-800 dark:hover:text-white'
)
"
:class="cn(navigationMenuTriggerStyle(), 'bg-transparent text-neutral-900 hover:bg-neutral-100 hover:text-neutral-900 dark:bg-transparent dark:text-white dark:hover:bg-neutral-800 dark:hover:text-white')"
>
Servers
</RouterLink>
@@ -112,12 +94,7 @@ function closeMobileMenu() {
<NavigationMenuLink as-child>
<RouterLink
to="/stats"
:class="
cn(
navigationMenuTriggerStyle(),
'bg-transparent text-neutral-900 hover:bg-neutral-100 hover:text-neutral-900 dark:bg-transparent dark:text-white dark:hover:bg-neutral-800 dark:hover:text-white'
)
"
:class="cn(navigationMenuTriggerStyle(), 'bg-transparent text-neutral-900 hover:bg-neutral-100 hover:text-neutral-900 dark:bg-transparent dark:text-white dark:hover:bg-neutral-800 dark:hover:text-white')"
>
Statistics
</RouterLink>
@@ -129,12 +106,7 @@ function closeMobileMenu() {
href="https://github.com/BeamMP/BeamMP"
target="_blank"
rel="noopener noreferrer"
:class="
cn(
navigationMenuTriggerStyle(),
'bg-transparent text-neutral-900 hover:bg-neutral-100 hover:text-neutral-900 dark:bg-transparent dark:text-white dark:hover:bg-neutral-800 dark:hover:text-white'
)
"
:class="cn(navigationMenuTriggerStyle(), 'bg-transparent text-neutral-900 hover:bg-neutral-100 hover:text-neutral-900 dark:bg-transparent dark:text-white dark:hover:bg-neutral-800 dark:hover:text-white')"
>
GitHub
</a>
@@ -146,12 +118,7 @@ function closeMobileMenu() {
href="https://www.patreon.com/BeamMP"
target="_blank"
rel="noopener noreferrer"
:class="
cn(
navigationMenuTriggerStyle(),
'bg-transparent text-neutral-900 hover:bg-neutral-100 hover:text-neutral-900 dark:bg-transparent dark:text-white dark:hover:bg-neutral-800 dark:hover:text-white'
)
"
:class="cn(navigationMenuTriggerStyle(), 'bg-transparent text-neutral-900 hover:bg-neutral-100 hover:text-neutral-900 dark:bg-transparent dark:text-white dark:hover:bg-neutral-800 dark:hover:text-white')"
>
Patreon
</a>
@@ -165,10 +132,10 @@ function closeMobileMenu() {
<!-- Mobile Menu Button and Theme Toggle -->
<div class="flex lg:hidden items-center gap-2">
<ThemeToggle />
<button
<button
@click="toggleMobileMenu"
class="p-2 text-neutral-900 dark:text-white hover:bg-neutral-100 dark:hover:bg-neutral-800 rounded-md transition-colors"
aria-label="Toggle menu"
@click="toggleMobileMenu"
>
<Menu v-if="!mobileMenuOpen" class="w-6 h-6" />
<X v-else class="w-6 h-6" />
@@ -185,8 +152,8 @@ function closeMobileMenu() {
leave-from-class="opacity-100 translate-y-0"
leave-to-class="opacity-0 -translate-y-2"
>
<div
v-if="mobileMenuOpen"
<div
v-if="mobileMenuOpen"
class="md:hidden border-t border-neutral-200 dark:border-neutral-800 bg-white dark:bg-neutral-900"
>
<div class="px-4 py-3 space-y-1">

4
src/views/Home.vue
View File

@@ -15,18 +15,22 @@ import {
} from 'lucide-vue-next'
const onlinePlayers = ref('...')
const onlineServers = ref('...')
const isLoading = ref(true)
onMounted(async () => {
try {
const response = await fetch('https://backend.beammp.com/metrics')
// beammp_players_online 2783 beammp_public_servers 2959 beammp_all_servers 4663
const data = await response.text()
const values = data.split(' ')
if (values.length >= 2) {
onlinePlayers.value = values[1]
onlineServers.value = values[3]
}
} catch {
onlinePlayers.value = 'N/A'
onlineServers.value = 'N/A'
} finally {
isLoading.value = false
}

17
src/views/NotFound.vue
View File

@@ -4,31 +4,24 @@ import { RouterLink } from 'vue-router'
<template>
<section class="min-h-[60vh] flex items-center justify-center">
<div
class="text-center px-6 py-10 sm:px-8 sm:py-12 rounded-xl border border-neutral-200/30 bg-white/60 dark:bg-neutral-900/60 backdrop-blur-md shadow-sm space-y-4"
>
<div class="text-center px-6 py-10 sm:px-8 sm:py-12 rounded-xl border border-neutral-200/30 bg-white/60 dark:bg-neutral-900/60 backdrop-blur-md shadow-sm space-y-4">
<div class="flex items-center justify-center gap-3">
<span
class="inline-flex items-center justify-center rounded-full bg-orange-600/10 text-orange-600 dark:text-orange-400 w-12 h-12 text-xl font-bold"
>404</span
>
<span class="inline-flex items-center justify-center rounded-full bg-orange-600/10 text-orange-600 dark:text-orange-400 w-12 h-12 text-xl font-bold">404</span>
<h1 class="text-2xl sm:text-3xl font-bold tracking-tight">Page Not Found</h1>
</div>
<p class="text-neutral-600 dark:text-neutral-300 max-w-prose mx-auto">
The page you requested doesn’t exist. It may have been moved or removed.
</p>
<div class="flex flex-wrap items-center justify-center gap-3 pt-2">
<RouterLink
to="/"
class="inline-flex px-4 py-2 rounded-md bg-orange-600 hover:bg-orange-500 text-white text-sm font-medium"
>
class="inline-flex px-4 py-2 rounded-md bg-orange-600 hover:bg-orange-500 text-white text-sm font-medium">
Return Home
</RouterLink>
<RouterLink
to="/servers"
class="inline-flex px-4 py-2 rounded-md border border-neutral-300/60 dark:border-neutral-700/60 text-sm font-medium text-neutral-800 dark:text-neutral-200 hover:bg-neutral-100 dark:hover:bg-neutral-800"
>
class="inline-flex px-4 py-2 rounded-md border border-neutral-300/60 dark:border-neutral-700/60 text-sm font-medium text-neutral-800 dark:text-neutral-200 hover:bg-neutral-100 dark:hover:bg-neutral-800">
Browse Servers
</RouterLink>
</div>