iDefineHD/TurboTrades
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update the ban page
All checks were successful
Build Frontend / Build Frontend (push) Successful in 23s
Details

Browse Source
This commit is contained in:
iDefineHD
2026-01-11 04:27:24 +00:00
parent 5848323140
commit cbf50b0641
1 changed files with 62 additions and 49 deletions
Download Patch File Download Diff File Expand all files Collapse all files

111
frontend/src/views/BannedPage.vue
View File

@@ -9,42 +9,46 @@
<!-- Title -->
<h1 class="banned-title">Account Suspended</h1>
<!-- Ban Details -->
<div v-if="banInfo" class="ban-details">
<div class="detail-item">
<span class="detail-label">Reason:</span>
<span class="detail-value">{{
banInfo.reason || "Violation of Terms of Service"
}}</span>
<!-- Ban Details and Appeal Section -->
<div class="ban-details-container">
<div v-if="banInfo" class="ban-details">
<div class="detail-item">
<span class="detail-label">Reason:</span>
<span class="detail-value">{{
banInfo.reason || "Violation of Terms of Service"
}}</span>
</div>
<div v-if="banInfo.bannedAt" class="detail-item">
<span class="detail-label">Banned on:</span>
<span class="detail-value">{{ formatDate(banInfo.bannedAt) }}</span>
</div>
<div
v-if="banInfo.bannedUntil && !banInfo.isPermanent"
class="detail-item"
>
<span class="detail-label">Ban expires:</span>
<span class="detail-value">{{
formatDate(banInfo.bannedUntil)
}}</span>
</div>
<div v-if="banInfo.isPermanent" class="detail-item permanent-ban">
<AlertCircle :size="18" />
<span>This is a permanent ban</span>
</div>
</div>
<div v-if="banInfo.bannedAt" class="detail-item">
<span class="detail-label">Banned on:</span>
<span class="detail-value">{{ formatDate(banInfo.bannedAt) }}</span>
<div class="appeal-section">
<p class="appeal-text">
If you believe this ban was made in error, you can submit an appeal.
</p>
<a href="/support" class="appeal-btn">
<Mail :size="20" />
<span>Contact Support</span>
</a>
</div>
<div v-if="banInfo.bannedUntil" class="detail-item">
<span class="detail-label">Ban expires:</span>
<span class="detail-value">{{
formatDate(banInfo.bannedUntil)
}}</span>
</div>
<div v-else class="detail-item permanent-ban">
<AlertCircle :size="18" />
<span>This is a permanent ban</span>
</div>
</div>
<!-- Appeal Section -->
<div class="appeal-section">
<p class="appeal-text">
If you believe this ban was made in error, you can submit an appeal.
</p>
<a href="/support" class="appeal-btn">
<Mail :size="20" />
<span>Contact Support</span>
</a>
</div>
<!-- Logout Button -->
@@ -275,15 +279,6 @@ onMounted(() => {
line-height: 1.6;
}
.ban-details {
background: rgba(239, 68, 68, 0.1);
border: 1px solid rgba(239, 68, 68, 0.3);
border-radius: 1rem;
padding: 1.5rem;
margin-bottom: 2rem;
text-align: left;
}
.detail-item {
display: flex;
justify-content: space-between;
@@ -354,23 +349,40 @@ onMounted(() => {
line-height: 1.5;
}
.appeal-section {
margin: 2rem 0;
padding: 1.5rem;
background: rgba(255, 255, 255, 0.05);
.ban-details-container {
background: rgba(239, 68, 68, 0.1);
border: 1px solid rgba(239, 68, 68, 0.3);
border-radius: 1rem;
border: 1px solid rgba(255, 255, 255, 0.1);
padding: 1.5rem;
margin-bottom: 2rem;
}
.ban-details {
margin-bottom: 1.5rem;
padding-bottom: 1.5rem;
border-bottom: 1px solid rgba(239, 68, 68, 0.2);
text-align: left;
}
.appeal-section {
margin: 0;
padding: 0;
background: none;
border: none;
text-align: center;
}
.appeal-text {
font-size: 0.9375rem;
color: #d1d5db;
margin: 0 0 1rem 0;
text-align: center;
}
.appeal-btn {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 0.75rem;
padding: 0.875rem 2rem;
background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%);
@@ -382,6 +394,8 @@ onMounted(() => {
transition: all 0.3s;
box-shadow: 0 4px 12px rgba(59, 130, 246, 0.4);
border: 1px solid rgba(59, 130, 246, 0.5);
width: 100%;
max-width: 300px;
}
.appeal-btn:hover {
@@ -506,8 +520,7 @@ onMounted(() => {
}
.appeal-btn {
width: 100%;
justify-content: center;
max-width: 100%;
}
}
</style>