fdsafsad
This commit is contained in:
@@ -0,0 +1,168 @@
|
||||
@include(snippets/header)
|
||||
<div class="pagewrapper">
|
||||
<div id="main">
|
||||
<div class="container adm up">
|
||||
|
||||
<header class="adm-header">
|
||||
<div>
|
||||
<h1 class="adm-title">My uploads</h1>
|
||||
<div class="adm-subtitle">Status of your last {{ items.length }} upload@if(items.length !== 1)s@endif.</div>
|
||||
</div>
|
||||
<a href="/upload" class="adm-btn adm-btn-ghost"><i class="fa-solid fa-angle-up"></i> Upload</a>
|
||||
</header>
|
||||
|
||||
@if(manual_approval_on)
|
||||
<div class="up-notice"><i class="fa-solid fa-hourglass-half"></i> Manual approval is on: new uploads appear on the site once a moderator approves them.</div>
|
||||
@endif
|
||||
|
||||
<section class="adm-section">
|
||||
<div class="adm-stats">
|
||||
<div class="adm-stat @if(counts.pending > 0) is-hot @endif"><span class="adm-stat-num" id="up-pending-count">{{ counts.pending }}</span><span class="adm-stat-label">Pending</span></div>
|
||||
<div class="adm-stat"><span class="adm-stat-num">{{ counts.live }}</span><span class="adm-stat-label">Live</span></div>
|
||||
<div class="adm-stat"><span class="adm-stat-num">{{ counts.denied + counts.removed }}</span><span class="adm-stat-label">Denied / removed</span></div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="adm-section">
|
||||
<h2 class="adm-section-title"><i class="fa-solid fa-list"></i> Recent uploads</h2>
|
||||
@if(items.length > 0)
|
||||
<div class="up-list">
|
||||
@each(items as it)
|
||||
<div class="up-row is-{!! it.status !!}" id="i{!! it.id !!}">
|
||||
<div class="up-thumb">
|
||||
@if(it.thumb)
|
||||
<img src="{!! it.thumb !!}" alt="" loading="lazy">
|
||||
@else
|
||||
<i class="fa-solid fa-ban"></i>
|
||||
@endif
|
||||
</div>
|
||||
<div class="up-info">
|
||||
<div class="up-name">
|
||||
@if(it.status === 'live')<a href="/{!! it.path !!}">{!! it.title || ('#' + it.id) !!}</a>@else{!! it.title || ('#' + it.id) !!}@endif
|
||||
@if(it.is_album)<span class="up-album"><i class="fa-solid fa-images"></i> {!! it.album_count !!}</span>@endif
|
||||
</div>
|
||||
<div class="up-meta">
|
||||
<span>#{!! it.id !!}</span>
|
||||
<span>{!! it.mime !!}</span>
|
||||
@if(it.size_fmt)<span>{!! it.size_fmt !!}</span>@endif
|
||||
@if(it.time_ago)<span tooltip="{!! it.time_full !!}">{!! it.time_ago !!}</span>@endif
|
||||
</div>
|
||||
@if(it.reason)
|
||||
<div class="up-reason"><strong>Reason:</strong> {!! it.reason !!}</div>
|
||||
@endif
|
||||
</div>
|
||||
<div class="up-status">
|
||||
@if(it.status === 'pending')<span class="up-badge"><i class="fa-solid fa-hourglass-half"></i> Pending</span><button type="button" class="up-del" data-id="{!! it.id !!}" title="Delete this upload"><i class="fa-solid fa-trash"></i> <span>Delete</span></button>@endif
|
||||
@if(it.status === 'live')<a href="/{!! it.path !!}" class="up-badge"><i class="fa-solid fa-check"></i> Live</a>@endif
|
||||
@if(it.status === 'denied')<span class="up-badge"><i class="fa-solid fa-xmark"></i> Denied</span>@endif
|
||||
@if(it.status === 'removed')<span class="up-badge"><i class="fa-solid fa-trash"></i> Removed</span>@endif
|
||||
</div>
|
||||
</div>
|
||||
@endeach
|
||||
</div>
|
||||
@else
|
||||
<div class="up-empty">You haven't uploaded anything yet.</div>
|
||||
@endif
|
||||
</section>
|
||||
</div>
|
||||
|
||||
@include(snippets/adm-dashboard-style)
|
||||
<style>
|
||||
.up-notice {
|
||||
display: flex; align-items: center; gap: 10px; margin: -8px 0 22px; padding: 10px 14px;
|
||||
font-size: 0.85em; color: var(--adm-text); background: var(--adm-surface);
|
||||
border: 1px solid var(--adm-border); border-left: 3px solid var(--adm-accent);
|
||||
}
|
||||
.up-notice i { color: var(--adm-accent); }
|
||||
.up-list { display: flex; flex-direction: column; border: 1px solid var(--adm-border); }
|
||||
.up-row { display: flex; align-items: center; gap: 14px; padding: 10px 12px; background: var(--adm-surface); scroll-margin-top: 90px; transition: background 0.3s; }
|
||||
.up-row + .up-row { border-top: 1px solid var(--adm-border); }
|
||||
.up-row:target, .up-row.is-target { background: color-mix(in srgb, var(--adm-accent) 12%, transparent); box-shadow: inset 3px 0 0 var(--adm-accent); }
|
||||
.up-thumb { width: 64px; height: 64px; flex-shrink: 0; background: #000; display: flex; align-items: center; justify-content: center; overflow: hidden; color: var(--adm-muted); }
|
||||
.up-thumb img { width: 100%; height: 100%; object-fit: cover; }
|
||||
.up-row.is-denied .up-thumb, .up-row.is-removed .up-thumb { color: #ff5c5c; }
|
||||
.up-info { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
|
||||
.up-name { display: flex; align-items: center; gap: 8px; font-weight: 700; font-size: 0.92em; overflow: hidden; }
|
||||
.up-name a { color: var(--adm-text); text-decoration: none; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
|
||||
.up-name a:hover { color: var(--adm-accent); }
|
||||
.up-album { flex-shrink: 0; font-size: 0.78em; font-weight: 700; color: var(--adm-muted); }
|
||||
.up-meta { display: flex; flex-wrap: wrap; gap: 2px 12px; font-size: 0.76em; color: var(--adm-muted); }
|
||||
.up-reason { font-size: 0.8em; color: #ffb8b8; }
|
||||
.up-status { flex-shrink: 0; display: flex; align-items: center; gap: 6px; }
|
||||
.up-del {
|
||||
display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; margin: 0; font: inherit; font-size: 0.72em; font-weight: 800;
|
||||
text-transform: uppercase; letter-spacing: 0.08em; cursor: pointer; border-radius: 0;
|
||||
background: transparent; color: var(--adm-muted); border: 1px solid var(--adm-border); transition: color 0.15s, border-color 0.15s, background 0.15s;
|
||||
}
|
||||
.up-del:hover { color: #ff5c5c; border-color: rgba(255, 92, 92, 0.5); }
|
||||
.up-del.is-armed { color: #000; background: #ff5c5c; border-color: #ff5c5c; }
|
||||
.up-del:disabled { opacity: 0.6; cursor: progress; }
|
||||
.up-row.is-gone { opacity: 0; transition: opacity 0.25s; }
|
||||
.up-badge {
|
||||
display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; font-size: 0.72em; font-weight: 800;
|
||||
text-transform: uppercase; letter-spacing: 0.08em; text-decoration: none; border: 1px solid var(--adm-border); color: var(--adm-muted);
|
||||
}
|
||||
.up-row.is-pending .up-badge { color: #ffb020; border-color: rgba(255, 176, 32, 0.5); background: rgba(255, 176, 32, 0.1); }
|
||||
.up-row.is-live .up-badge { color: #000; background: var(--adm-accent); border-color: var(--adm-accent); }
|
||||
.up-row.is-live .up-badge:hover { background: transparent; color: var(--adm-accent); }
|
||||
.up-row.is-denied .up-badge, .up-row.is-removed .up-badge { color: #ff5c5c; border-color: rgba(255, 92, 92, 0.5); background: rgba(255, 92, 92, 0.08); }
|
||||
.up-empty { padding: 40px 20px; text-align: center; color: var(--adm-muted); border: 1px dashed var(--adm-border); }
|
||||
@media (max-width: 600px) {
|
||||
.up-row { flex-wrap: wrap; }
|
||||
.up-status { width: 100%; padding-left: 78px; }
|
||||
}
|
||||
</style>
|
||||
<script>
|
||||
(() => {
|
||||
// Highlight + scroll to #i<id> (AJAX navigation uses pushState, which doesn't trigger :target)
|
||||
const focusRow = () => {
|
||||
document.querySelectorAll('.up-row.is-target').forEach(r => r.classList.remove('is-target'));
|
||||
const id = (location.hash || '').slice(1);
|
||||
const row = id && document.getElementById(id);
|
||||
if (!row || !row.classList.contains('up-row')) return;
|
||||
row.classList.add('is-target');
|
||||
row.scrollIntoView({ block: 'center', behavior: 'smooth' });
|
||||
};
|
||||
setTimeout(focusRow, 50);
|
||||
window.addEventListener('hashchange', focusRow);
|
||||
|
||||
// Withdraw a pending upload: first click arms the button, second click deletes
|
||||
const csrf = () => (window.f0ckSession && window.f0ckSession.csrf_token) || document.querySelector('meta[name="csrf-token"]')?.content || '';
|
||||
const disarm = (btn) => { btn.classList.remove('is-armed'); btn.querySelector('span').textContent = 'Delete'; };
|
||||
document.querySelectorAll('.up-del').forEach(btn => {
|
||||
let timer = null;
|
||||
btn.addEventListener('click', async () => {
|
||||
if (!btn.classList.contains('is-armed')) {
|
||||
btn.classList.add('is-armed');
|
||||
btn.querySelector('span').textContent = 'Confirm';
|
||||
timer = setTimeout(() => disarm(btn), 4000);
|
||||
return;
|
||||
}
|
||||
clearTimeout(timer);
|
||||
btn.disabled = true;
|
||||
try {
|
||||
const r = await fetch('/pending/delete', {
|
||||
method: 'POST',
|
||||
headers: { 'Content-Type': 'application/json', 'Accept': 'application/json', 'X-Requested-With': 'XMLHttpRequest', 'X-CSRF-Token': csrf() },
|
||||
body: JSON.stringify({ id: btn.dataset.id })
|
||||
});
|
||||
const data = await r.json().catch(() => ({}));
|
||||
if (!r.ok || !data.success) throw new Error(data.msg || 'Delete failed');
|
||||
const row = btn.closest('.up-row');
|
||||
row.classList.add('is-gone');
|
||||
setTimeout(() => row.remove(), 250);
|
||||
const cnt = document.getElementById('up-pending-count');
|
||||
if (cnt) cnt.textContent = Math.max(0, (+cnt.textContent || 0) - 1);
|
||||
if (typeof window.flashMessage === 'function') window.flashMessage('Upload deleted', 2000, 'success');
|
||||
} catch (e) {
|
||||
btn.disabled = false;
|
||||
disarm(btn);
|
||||
if (typeof window.flashMessage === 'function') window.flashMessage(e.message, 3000, 'error'); else alert(e.message);
|
||||
}
|
||||
});
|
||||
});
|
||||
})();
|
||||
</script>
|
||||
</div>
|
||||
</div>
|
||||
@include(snippets/footer)
|
||||
@@ -0,0 +1,188 @@
|
||||
@include(snippets/header)
|
||||
<div class="pagewrapper">
|
||||
<div id="main">
|
||||
<div class="pv">
|
||||
<header class="pv-head">
|
||||
<h1>Privacy</h1>
|
||||
<p>What this instance stores, in which form, and for how long. This page is generated from the server's running configuration, so the settings below are the ones actually in effect.</p>
|
||||
</header>
|
||||
|
||||
{{-- ── Live configuration ── --}}
|
||||
<section class="pv-sec">
|
||||
<h2><i class="fa-solid fa-sliders"></i> Current settings</h2>
|
||||
<div class="pv-status">
|
||||
<div class="pv-stat">
|
||||
<span class="pv-stat-label">IP logging</span>
|
||||
@if(pv.log_ips)<span class="pv-pill is-on">On</span>@else<span class="pv-pill is-off">Off</span>@endif
|
||||
</div>
|
||||
<div class="pv-stat">
|
||||
<span class="pv-stat-label">IP storage</span>
|
||||
@if(pv.ip_mode === 'hashed')<span class="pv-pill is-good">Hashed (HMAC-SHA256)</span>@elseif(pv.ip_mode === 'raw')<span class="pv-pill is-warn">Plain text</span>@else<span class="pv-pill is-good">Not stored</span>@endif
|
||||
</div>
|
||||
<div class="pv-stat">
|
||||
<span class="pv-stat-label">Anonymous login</span>
|
||||
@if(pv.anon)<span class="pv-pill is-on">Enabled</span>@else<span class="pv-pill is-off">Disabled</span>@endif
|
||||
</div>
|
||||
<div class="pv-stat">
|
||||
<span class="pv-stat-label">Transport</span>
|
||||
@if(pv.https)<span class="pv-pill is-good">HTTPS</span>@else<span class="pv-pill is-warn">HTTP</span>@endif
|
||||
</div>
|
||||
</div>
|
||||
<p class="pv-small">
|
||||
@if(pv.ip_mode === 'hashed')IP addresses are logged, but only ever written to the database as <code>HMAC-SHA256(ip, server_secret)</code>. The raw address is not persisted.@endif
|
||||
@if(pv.ip_mode === 'raw')IP addresses are logged and written to the database in plain text.@endif
|
||||
@if(pv.ip_mode === 'off')IP addresses are not written to the database. They are only held in memory while a request is processed (e.g. to check bans and rate limits).@endif
|
||||
</p>
|
||||
</section>
|
||||
|
||||
{{-- ── Retention ── --}}
|
||||
<section class="pv-sec">
|
||||
<h2><i class="fa-solid fa-hourglass-half"></i> Retention</h2>
|
||||
<p>A cleanup job runs hourly and deletes or blanks data older than these periods.</p>
|
||||
<div class="pv-table">
|
||||
<div class="pv-row pv-row-head"><span>Data</span><span>Kept for</span><span>What happens after</span></div>
|
||||
<div class="pv-row"><span>Stored IP addresses</span><span class="@if(pv.ret_on.ip)pv-ok@else pv-warn@endif">{{ pv.ret.ip }}</span><span><code>user_ips</code> rows deleted; IP columns on sessions, anonymous identities, uploads, comments, reports and ToS acceptances set to <code>NULL</code>.</span></div>
|
||||
<div class="pv-row"><span>Anonymous activity log</span><span class="@if(pv.ret_on.activity)pv-ok@else pv-warn@endif">{{ pv.ret.activity }}</span><span>Rows deleted (action, IP, identity and device fingerprint).</span></div>
|
||||
<div class="pv-row"><span>Login attempts</span><span class="@if(pv.ret_on.login)pv-ok@else pv-warn@endif">{{ pv.ret.login }}</span><span>Rows deleted (hashed IP, attempted username, result).</span></div>
|
||||
<div class="pv-row"><span>Unused sessions</span><span class="@if(pv.ret_on.sessions)pv-ok@else pv-warn@endif">{{ pv.ret.sessions }}</span><span>Session deleted after this long without use; that device is logged out.</span></div>
|
||||
<div class="pv-row"><span>Device fingerprint</span><span class="@if(pv.ret_on.fp)pv-ok@else pv-warn@endif">{{ pv.ret.fp }}</span><span>Cleared from anonymous identities that haven't been used for this long.</span></div>
|
||||
<div class="pv-row"><span>Active bans</span><span>Until expiry</span><span>Banned IP hashes and fingerprints are kept until the ban expires or is lifted.</span></div>
|
||||
<div class="pv-row"><span>Your content</span><span>Until deleted</span><span>Uploads, comments, favourites and your account itself.</span></div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{{-- ── IP addresses ── --}}
|
||||
<section class="pv-sec">
|
||||
<h2><i class="fa-solid fa-network-wired"></i> IP addresses</h2>
|
||||
<p>The client IP is taken from the first of <code>CF-Connecting-IP</code>, <code>True-Client-IP</code>, <code>X-Client-IP</code>, <code>X-Real-IP</code>, <code>X-Forwarded-For</code> (first entry) or the TCP peer address.</p>
|
||||
@if(pv.log_ips)
|
||||
<p>With IP logging on, the IP is recorded @if(pv.hash_ips)as an HMAC@else in plain text@endif in:</p>
|
||||
<ul class="pv-list">
|
||||
<li><code>user_sessions.ip</code>: updated on each request of a logged-in session</li>
|
||||
<li><code>user_ips</code>: one row per account and IP with first/last seen time</li>
|
||||
<li><code>anon_identities.created_ip / last_ip</code> and <code>anon_activity_log.ip</code> for anonymous identities</li>
|
||||
<li><code>items.uploader_ip</code>, <code>comments.ip</code>, <code>reports.reporter_ip</code></li>
|
||||
</ul>
|
||||
@endif
|
||||
@if(pv.hash_ips)
|
||||
<p><strong>Hashing:</strong> <code>HMAC-SHA256</code> keyed with a server-side secret, stored as 64 hex characters. The same IP always yields the same hash, which is what makes bans and abuse correlation work; without the secret the hash can't be reversed or recomputed. This is pseudonymisation, not anonymisation: whoever holds the secret could test candidate IPs against it.</p>
|
||||
@endif
|
||||
<p><strong>Always, regardless of the logging setting:</strong> login and registration attempts store an HMAC of the IP in <code>login_attempts</code> for brute-force rate limiting, and a moderator ban stores the banned IP's hash in <code>banned_ips</code>.</p>
|
||||
</section>
|
||||
|
||||
@if(pv.anon)
|
||||
{{-- ── Anonymous login ── --}}
|
||||
<section class="pv-sec">
|
||||
<h2><i class="fa-solid fa-user-secret"></i> Anonymous login (WebAuthn passkey)</h2>
|
||||
<p>No email, password or name is involved. <em>Login as Anonymous</em> creates a standard WebAuthn passkey in your authenticator (browser, OS, Bitwarden, iCloud Keychain, …).</p>
|
||||
<h3>Registration</h3>
|
||||
<ol class="pv-steps">
|
||||
<li>The server sends creation options: relying party <code>{{ pv.domain }}</code>, a random single-use challenge, algorithm <strong>ES256</strong> (ECDSA P-256, COSE <code>-7</code>), <code>attestation: "none"</code>, and a user handle of 16 random bytes named <code>anon@{{ pv.domain }}</code> / "Anonymous". Nothing about you goes into it.</li>
|
||||
<li>Your authenticator generates a key pair. The <strong>private key never leaves the authenticator</strong>.</li>
|
||||
<li>The server verifies the response and stores: the <strong>credential ID</strong>, the <strong>public key</strong> (SPKI), the signature counter, and the authenticator's <strong>AAGUID</strong> (identifies the authenticator model, e.g. a password manager; with attestation "none" it is often all zeros).</li>
|
||||
<li>Your identity is derived from the credential ID: <code>SHA256:base64(SHA-256(credential_id))</code>; the account name is <code>anon_</code> plus the first 8 hex characters of that hash (e.g. <code>anon_1ad1e20c</code>).</li>
|
||||
</ol>
|
||||
<h3>Login</h3>
|
||||
<p>The server issues a random single-use challenge; your authenticator signs it with the private key and the server verifies the signature with the stored public key. Up to 4 passkeys can be attached to one identity. If all of them are lost, the identity cannot be recovered: nothing else links it to you.</p>
|
||||
</section>
|
||||
|
||||
{{-- ── Device fingerprint ── --}}
|
||||
<section class="pv-sec">
|
||||
<h2><i class="fa-solid fa-microchip"></i> Device fingerprint</h2>
|
||||
<p>At anonymous login and when adding a passkey, your browser computes a device fingerprint used <strong>only for ban enforcement</strong> (so a banned user can't just create a new identity). It is not used for advertising or cross-site tracking.</p>
|
||||
<p>Inputs, all read locally in your browser:</p>
|
||||
<ul class="pv-list">
|
||||
<li>WebGL: unmasked GPU vendor and renderer, 6 capability limits (max texture/renderbuffer size, vertex attribs, uniform/varying vectors, texture units)</li>
|
||||
<li>WebGPU adapter info (architecture, vendor, description), where available</li>
|
||||
<li><code>navigator.hardwareConcurrency</code>, <code>deviceMemory</code>, <code>platform</code>, <code>maxTouchPoints</code></li>
|
||||
<li>Screen width × height, colour depth, device pixel ratio</li>
|
||||
<li>Canvas 2D: checksum of a small rendered test image (text + shapes)</li>
|
||||
<li>Audio: sum of samples from an <code>OfflineAudioContext</code> rendering a test tone through a compressor</li>
|
||||
</ul>
|
||||
<p>The values are concatenated and hashed <strong>in the browser</strong> with SHA-256; only <code>HW:<64 hex></code> is sent. The raw values never reach the server. The hash is cached in <code>localStorage</code> (<code>f0ck_anon_hw_fp</code>) and stored server-side in <code>anon_identities.hw_fingerprint</code> and the activity log, and compared against banned device hashes.</p>
|
||||
</section>
|
||||
|
||||
{{-- ── Activity log ── --}}
|
||||
<section class="pv-sec">
|
||||
<h2><i class="fa-solid fa-list-check"></i> Anonymous activity log</h2>
|
||||
<p><code>anon_activity_log</code> records these actions of anonymous identities: login/session handshake, favourite, unfavourite, favourites import. Each row holds the action, target item, time, identity fingerprint, device fingerprint, and the IP @if(pv.ip_mode === 'hashed')(hashed)@endif @if(pv.ip_mode === 'off')(empty, as IP logging is off)@endif. It exists for moderation and ban cascades.</p>
|
||||
</section>
|
||||
@endif
|
||||
|
||||
{{-- ── Sessions & browser storage ── --}}
|
||||
<section class="pv-sec">
|
||||
<h2><i class="fa-solid fa-cookie"></i> Sessions, cookies and browser storage</h2>
|
||||
<ul class="pv-list">
|
||||
<li><strong><code>session</code> cookie</strong>: 32 random bytes; the server stores only its SHA-256, so a database leak doesn't expose usable sessions. Flags: <code>HttpOnly</code>, <code>SameSite=Lax</code>@if(pv.https), <code>Secure</code>@endif.</li>
|
||||
<li>Per session the server keeps: user agent string, creation time, last-used time, the last path requested, a CSRF token@if(pv.log_ips), and the IP@endif.</li>
|
||||
<li><code>localStorage</code>: UI preferences, and for anonymous users the device fingerprint hash.</li>
|
||||
<li><code>f0ck_banned</code> cookie / <code>f0ck_anon_tombstone</code>: only set if you are banned, to show the ban notice.</li>
|
||||
</ul>
|
||||
<p>Registered accounts: passwords are hashed with <strong>scrypt</strong> (random 16-byte salt, 64-byte key). The plain password is never stored.</p>
|
||||
</section>
|
||||
|
||||
<section class="pv-sec">
|
||||
<h2><i class="fa-solid fa-ban"></i> Not collected</h2>
|
||||
<p>For anonymous identities: no email, real name, phone number or password. No third-party analytics, trackers or ad networks are involved in authentication.</p>
|
||||
</section>
|
||||
|
||||
<p class="pv-foot">Questions? See <a href="/about">About</a>@if(mail) or write to <a href="mailto:{!! mail !!}">{!! mail !!}</a>@endif.</p>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.pv {
|
||||
--pv-accent: var(--accent, #0096ff);
|
||||
--pv-text: var(--text-color, #fff);
|
||||
--pv-muted: var(--text-muted, #8a8f98);
|
||||
--pv-surface: rgba(255, 255, 255, 0.04);
|
||||
--pv-border: rgba(255, 255, 255, 0.1);
|
||||
--pv-good: #3ecf8e;
|
||||
--pv-warn: #ffb020;
|
||||
max-width: 860px; margin: 0 auto; padding: 32px 16px 60px; color: var(--pv-text); line-height: 1.6;
|
||||
}
|
||||
.pv * { border-radius: 0 !important; }
|
||||
.pv-head { padding-bottom: 18px; margin-bottom: 26px; border-bottom: 1px solid var(--pv-accent); }
|
||||
.pv-head h1 { margin: 0; font-size: 1.8em; font-weight: 800; }
|
||||
.pv-head p { margin: 6px 0 0; color: var(--pv-muted); }
|
||||
.pv-sec { margin-bottom: 32px; }
|
||||
.pv-sec h2 { display: flex; align-items: center; gap: 10px; margin: 0 0 12px; font-size: 1.1em; font-weight: 800; text-transform: uppercase; letter-spacing: 0.06em; }
|
||||
.pv-sec h2 i { color: var(--pv-accent); font-size: 0.9em; }
|
||||
.pv-sec h3 { margin: 18px 0 8px; font-size: 0.9em; font-weight: 700; color: var(--pv-muted); text-transform: uppercase; letter-spacing: 0.08em; }
|
||||
.pv p { margin: 0 0 10px; }
|
||||
.pv a { color: var(--pv-accent); }
|
||||
.pv code { padding: 1px 5px; font-size: 0.86em; background: var(--pv-surface); border: 1px solid var(--pv-border); word-break: break-word; }
|
||||
.pv-small { font-size: 0.88em; color: var(--pv-muted); }
|
||||
.pv-steps, .pv-list { margin: 0 0 12px; padding-left: 22px; }
|
||||
.pv-steps li, .pv-list li { margin-bottom: 6px; }
|
||||
|
||||
.pv-status { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; margin-bottom: 12px; background: var(--pv-border); border: 1px solid var(--pv-border); }
|
||||
.pv-stat { display: flex; flex-direction: column; gap: 8px; padding: 12px 14px; background: var(--bg, #000); }
|
||||
.pv-stat-label { font-size: 0.72em; font-weight: 800; text-transform: uppercase; letter-spacing: 0.08em; color: var(--pv-muted); }
|
||||
.pv-pill { align-self: flex-start; padding: 3px 9px; font-size: 0.78em; font-weight: 800; text-transform: uppercase; letter-spacing: 0.06em; border: 1px solid currentColor; }
|
||||
.pv-pill.is-on { color: var(--pv-accent); }
|
||||
.pv-pill.is-off { color: var(--pv-muted); }
|
||||
.pv-pill.is-good { color: var(--pv-good); }
|
||||
.pv-pill.is-warn { color: var(--pv-warn); }
|
||||
|
||||
.pv-table { border: 1px solid var(--pv-border); font-size: 0.88em; }
|
||||
.pv-row { display: grid; grid-template-columns: 1fr 0.7fr 2fr; gap: 12px; padding: 10px 14px; background: var(--pv-surface); }
|
||||
.pv-row + .pv-row { border-top: 1px solid var(--pv-border); }
|
||||
.pv-row-head { background: transparent; font-size: 0.8em; font-weight: 800; text-transform: uppercase; letter-spacing: 0.08em; color: var(--pv-muted); }
|
||||
.pv-row span:first-child { font-weight: 700; }
|
||||
.pv-row span:last-child { color: var(--pv-muted); }
|
||||
.pv-row-head span { font-weight: 800 !important; }
|
||||
.pv-ok { color: var(--pv-good); font-weight: 700; }
|
||||
.pv-warn { color: var(--pv-warn); font-weight: 700; }
|
||||
.pv-foot { margin-top: 36px; padding-top: 16px; border-top: 1px solid var(--pv-border); color: var(--pv-muted); font-size: 0.9em; }
|
||||
|
||||
@media (max-width: 700px) {
|
||||
.pv-status { grid-template-columns: repeat(2, 1fr); }
|
||||
}
|
||||
@media (max-width: 600px) {
|
||||
.pv-row { grid-template-columns: 1fr; gap: 2px; }
|
||||
.pv-row-head { display: none; }
|
||||
}
|
||||
</style>
|
||||
</div>
|
||||
</div>
|
||||
@include(snippets/footer)
|
||||
@@ -1,16 +1,89 @@
|
||||
@if(session)
|
||||
<div id="mod-action-modal" class="modal-overlay" style="display:none;">
|
||||
<div class="modal-content">
|
||||
<h3 id="mod-action-title">{{ t('mod.confirm_action') }}</h3>
|
||||
<div id="mod-action-content"></div>
|
||||
<textarea id="mod-reason" class="mod-reason" placeholder="{{ t('mod.reason_placeholder') }}"></textarea>
|
||||
<div id="mod-action-error" class="error-msg"></div>
|
||||
<div class="modal-actions">
|
||||
<button id="mod-action-confirm" class="btn-danger">{{ t('mod.confirm') }}</button>
|
||||
<button id="mod-action-cancel" class="btn-secondary">{{ t('common.cancel') }}</button>
|
||||
<div class="modal-content ma-modal-content">
|
||||
<div class="ma-header">
|
||||
<h3 id="mod-action-title">{{ t('mod.confirm_action') }}</h3>
|
||||
</div>
|
||||
<div class="ma-body">
|
||||
<div id="mod-action-content"></div>
|
||||
<textarea id="mod-reason" class="mod-reason" placeholder="{{ t('mod.reason_placeholder') }}"></textarea>
|
||||
<div id="mod-action-error" class="error-msg"></div>
|
||||
</div>
|
||||
<div class="modal-actions ma-footer">
|
||||
<button type="button" id="mod-action-cancel" class="btn-secondary">{{ t('common.cancel') }}</button>
|
||||
<button type="button" id="mod-action-confirm" class="btn-danger">{{ t('mod.confirm') }}</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
/* Moderator action modal — same rules as the report/info/visibility modals */
|
||||
#mod-action-modal .ma-modal-content {
|
||||
--ma-accent: var(--accent, #0096ff);
|
||||
--ma-text: var(--text-color, #fff);
|
||||
--ma-muted: var(--text-muted, #8a8f98);
|
||||
--ma-surface: rgba(255, 255, 255, 0.04);
|
||||
--ma-border: rgba(255, 255, 255, 0.1);
|
||||
--ma-danger: #ff5c5c;
|
||||
width: min(440px, 92vw); min-width: 0;
|
||||
max-height: min(90vh, 90dvh);
|
||||
display: flex; flex-direction: column; overflow: hidden;
|
||||
padding: 0; text-align: left;
|
||||
border-radius: 0 !important;
|
||||
border: 1px solid var(--accent) !important;
|
||||
background: var(--bg) !important;
|
||||
box-shadow: 0 0 20px rgba(0, 0, 0, 0.5) !important;
|
||||
color: var(--ma-text);
|
||||
}
|
||||
#mod-action-modal .ma-modal-content * { border-radius: 0 !important; }
|
||||
#mod-action-modal .ma-header { flex-shrink: 0; padding: 18px 24px 14px; border-bottom: 1px solid var(--ma-border); }
|
||||
#mod-action-modal .ma-header h3 { margin: 0; font-size: 1.2em; font-weight: 700; color: var(--ma-text); overflow-wrap: anywhere; }
|
||||
#mod-action-modal .ma-body {
|
||||
flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain;
|
||||
padding: 16px 24px; display: flex; flex-direction: column; gap: 12px;
|
||||
}
|
||||
#mod-action-modal #mod-action-content { font-size: 0.9em; line-height: 1.5; color: var(--ma-muted); overflow-wrap: anywhere; }
|
||||
#mod-action-modal #mod-action-content:empty { display: none; }
|
||||
#mod-action-modal #mod-action-content strong, #mod-action-modal #mod-action-content b { color: var(--ma-text); }
|
||||
#mod-action-modal textarea.mod-reason {
|
||||
width: 100%; min-height: 0; box-sizing: border-box; margin: 0; padding: 10px 12px;
|
||||
background: var(--ma-surface) !important; border: 1px solid var(--ma-border) !important; color: var(--ma-text) !important;
|
||||
font: inherit; font-size: 0.9em; outline: none; box-shadow: none !important; transition: border-color 0.15s;
|
||||
}
|
||||
#mod-action-modal textarea.mod-reason:focus { border-color: var(--ma-accent) !important; }
|
||||
#mod-action-modal textarea.mod-reason::placeholder { color: var(--ma-muted); }
|
||||
#mod-action-modal #mod-action-error {
|
||||
margin: 0; padding: 10px 12px; font-size: 0.84em; line-height: 1.45; color: #ff8a8a; text-align: left;
|
||||
background: rgba(224, 108, 117, 0.1); border: 1px solid rgba(224, 108, 117, 0.3);
|
||||
}
|
||||
#mod-action-modal #mod-action-error:empty { display: none !important; }
|
||||
#mod-action-modal .ma-footer {
|
||||
flex-shrink: 0; display: flex; justify-content: flex-end; gap: 8px; margin: 0;
|
||||
padding: 14px 24px; border-top: 1px solid var(--ma-border); background: rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
#mod-action-modal .ma-footer button {
|
||||
height: 40px; margin: 0; padding: 0 18px; font: inherit; font-size: 0.85em; cursor: pointer;
|
||||
display: inline-flex; align-items: center; justify-content: center; transition: background 0.18s, color 0.18s, border-color 0.18s;
|
||||
}
|
||||
#mod-action-modal #mod-action-cancel { background: transparent; border: 1px solid var(--ma-border); color: var(--ma-muted); font-weight: 600; }
|
||||
#mod-action-modal #mod-action-cancel:hover { color: var(--ma-text); border-color: rgba(255, 255, 255, 0.25); background: var(--ma-surface); }
|
||||
#mod-action-modal #mod-action-confirm {
|
||||
background: var(--ma-danger); border: 1px solid var(--ma-danger); color: #000;
|
||||
font-weight: 800; text-transform: uppercase; letter-spacing: 0.08em;
|
||||
}
|
||||
#mod-action-modal #mod-action-confirm:hover:not(:disabled) { background: transparent; color: var(--ma-danger); }
|
||||
#mod-action-modal #mod-action-confirm:disabled { opacity: 0.6; cursor: progress; }
|
||||
#mod-action-modal .ma-footer button:focus-visible { outline: 2px solid var(--ma-accent); outline-offset: 2px; }
|
||||
@media (max-width: 600px) {
|
||||
#mod-action-modal { padding: 0 !important; align-items: stretch !important; }
|
||||
#mod-action-modal .ma-modal-content {
|
||||
width: 100vw; max-width: none; height: 100vh; height: 100dvh; max-height: none;
|
||||
border: 0 !important; box-shadow: none !important;
|
||||
}
|
||||
#mod-action-modal .ma-footer { padding-bottom: calc(14px + env(safe-area-inset-bottom, 0px)); }
|
||||
#mod-action-modal .ma-footer button { flex: 1; }
|
||||
}
|
||||
</style>
|
||||
@endif
|
||||
|
||||
@if(session)
|
||||
@@ -345,6 +418,7 @@
|
||||
<a href="/ranking">{{ t('footer.ranking') }}</a>
|
||||
<a href="/rules">{{ t('footer.rules') }}</a>
|
||||
<a href="/about">{{ t('footer.about') }}</a>
|
||||
<a href="/privacy">Privacy</a>
|
||||
<div id="help-button" style="color: var(--accent); font-weight: bold; opacity: 0.7;" title="Keyboard Shortcuts">?</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -68,6 +68,7 @@
|
||||
<a href="/user/{!! session.user.toLowerCase() !!}/halls">{{ t('nav.my_halls') }}</a>
|
||||
@endif
|
||||
@endif
|
||||
<a href="/pending">Pending Uploads</a>
|
||||
@if(enable_anonymous_access && session.is_anon)
|
||||
<a href="#" id="nav-user-anon-identity-btn" style="white-space: nowrap;" onclick="event.preventDefault(); if(window.f0ckAnonPasskey) { window.f0ckAnonPasskey.openModal(); } else { const m = document.getElementById('anon-passkey-modal'); if (m) m.style.display='flex'; }">Passkey Identity</a>
|
||||
@endif
|
||||
@@ -460,7 +461,10 @@ async function loginWithPasskey() {
|
||||
<div class="lm-divider"><span>or</span></div>
|
||||
<button type="button" id="modal-login-as-anon-btn" class="lm-btn lm-btn-ghost"
|
||||
onclick="event.preventDefault(); if(window.f0ckAnonPasskey) window.f0ckAnonPasskey.openSetupModal(); else { const m=document.getElementById('anon-setup-modal'); if(m) m.style.display='flex'; }">
|
||||
<i class="fa-solid fa-user-secret"></i> Login as anonymous
|
||||
<i class="fa-solid fa-user-secret"></i> Login as Anonymous
|
||||
</button>
|
||||
<button type="button" id="modal-login-register-btn" class="lm-btn lm-btn-ghost" style="margin-top: 8px;">
|
||||
<i class="fa-solid fa-user-plus"></i> Register
|
||||
</button>
|
||||
</div>
|
||||
@endif
|
||||
@@ -821,6 +825,9 @@ async function loginWithPasskey() {
|
||||
<p class="lm-note">
|
||||
<i class="fa-solid fa-rotate"></i> You can use it across devices if your passkey manager syncs (e.g. Bitwarden).
|
||||
</p>
|
||||
<p class="lm-note">
|
||||
<i class="fa-solid fa-shield-halved"></i> To stop ban evasion we store a hashed device fingerprint@if(privacy_ip_mode === 'hashed') and a hashed IP address@elseif(privacy_ip_mode === 'raw') and your IP address@endif. <a href="/privacy" target="_blank" class="lm-link">What exactly is stored?</a>
|
||||
</p>
|
||||
<button type="button" id="anon-setup-create-btn" class="lm-btn lm-btn-primary">
|
||||
<i class="fa-solid fa-fingerprint"></i> Create my passkey
|
||||
</button>
|
||||
|
||||
@@ -2,7 +2,7 @@
|
||||
@if(n.type === 'approve')
|
||||
<a href="/{{ n.item_slug || n.item_id }}" class="notif-item {{ n.is_read ? '' : 'unread' }} notif-with-thumb" data-id="{{ n.id }}" data-item-id="{{ n.item_id || '' }}" data-item-slug="{{ n.item_slug || '' }}">
|
||||
<div class="notif-thumb" data-mode="{{ n.item_mode || '' }}">
|
||||
<img src="/t/{{ n.item_id }}{{ ((active_mode===0&&(n.item_mode==='nsfw'||n.item_mode==='nsfl'))||(active_mode===1&&n.item_mode==='nsfl')||(active_mode===4&&(n.item_mode==='sfw'||n.item_mode==='nsfw'))) ? '_blur' : '' }}.webp" data-orig-src="/t/{{ n.item_id }}.webp" alt="thumb" onerror="this.onerror=null;this.src='/mod/pending/t/{{ n.item_id }}.webp';this.onerror=function(){this.onerror=null;this.src='/mod/deleted/t/{{ n.item_id }}.webp';this.onerror=function(){this.style.display='none';};};"/>
|
||||
<img src="/t/{{ n.item_id }}{{ ((active_mode===0&&(n.item_mode==='nsfw'||n.item_mode==='nsfl'))||(active_mode===1&&n.item_mode==='nsfl')||(active_mode===4&&(n.item_mode==='sfw'||n.item_mode==='nsfw'))) ? '_blur' : '' }}.webp" data-orig-src="/t/{{ n.item_id }}.webp" alt="thumb" onerror="this.onerror=null;this.src='/pending/t/{{ n.item_id }}.webp';this.onerror=function(){this.onerror=null;this.src='/mod/deleted/t/{{ n.item_id }}.webp';this.onerror=function(){this.style.display='none';};};"/>
|
||||
</div>
|
||||
<div class="notif-content">
|
||||
<div class="notif-user"><strong>{{ t('notifications.system') }}</strong></div>
|
||||
@@ -24,7 +24,7 @@
|
||||
@elseif(n.type === 'report')
|
||||
<a href="/mod/reports" class="notif-item {{ n.is_read ? '' : 'unread' }} notif-with-thumb" data-id="{{ n.id }}" data-item-id="{{ n.item_id || '' }}" data-item-slug="{{ n.item_slug || '' }}">
|
||||
<div class="notif-thumb" data-mode="{{ n.item_mode || '' }}">
|
||||
<img src="/t/{{ n.item_id }}{{ ((active_mode===0&&(n.item_mode==='nsfw'||n.item_mode==='nsfl'))||(active_mode===1&&n.item_mode==='nsfl')||(active_mode===4&&(n.item_mode==='sfw'||n.item_mode==='nsfw'))) ? '_blur' : '' }}.webp" data-orig-src="/t/{{ n.item_id }}.webp" alt="thumb" onerror="this.onerror=null;this.src='/mod/pending/t/{{ n.item_id }}.webp';this.onerror=function(){this.onerror=null;this.src='/mod/deleted/t/{{ n.item_id }}.webp';this.onerror=function(){this.style.display='none';};};"/>
|
||||
<img src="/t/{{ n.item_id }}{{ ((active_mode===0&&(n.item_mode==='nsfw'||n.item_mode==='nsfl'))||(active_mode===1&&n.item_mode==='nsfl')||(active_mode===4&&(n.item_mode==='sfw'||n.item_mode==='nsfw'))) ? '_blur' : '' }}.webp" data-orig-src="/t/{{ n.item_id }}.webp" alt="thumb" onerror="this.onerror=null;this.src='/pending/t/{{ n.item_id }}.webp';this.onerror=function(){this.onerror=null;this.src='/mod/deleted/t/{{ n.item_id }}.webp';this.onerror=function(){this.style.display='none';};};"/>
|
||||
</div>
|
||||
<div class="notif-content">
|
||||
<div class="notif-user"><strong>{{ t('notifications.moderation') }}</strong></div>
|
||||
@@ -86,7 +86,7 @@
|
||||
<a href="{{ n.item_id ? '/' + (n.item_slug || n.item_id) : '#' }}" class="notif-item {{ n.is_read ? '' : 'unread' }} {{ n.item_id ? 'notif-with-thumb' : '' }}" data-id="{{ n.id }}" data-item-id="{{ n.item_id || '' }}" data-item-slug="{{ n.item_slug || '' }}">
|
||||
@if(n.item_id)
|
||||
<div class="notif-thumb" data-mode="{{ n.item_mode || '' }}">
|
||||
<img src="/t/{{ n.item_id }}{{ ((active_mode===0&&(n.item_mode==='nsfw'||n.item_mode==='nsfl'))||(active_mode===1&&n.item_mode==='nsfl')||(active_mode===4&&(n.item_mode==='sfw'||n.item_mode==='nsfw'))) ? '_blur' : '' }}.webp" data-orig-src="/t/{{ n.item_id }}.webp" alt="thumb" onerror="this.onerror=null;this.src='/mod/pending/t/{{ n.item_id }}.webp';this.onerror=function(){this.style.display='none'};" />
|
||||
<img src="/t/{{ n.item_id }}{{ ((active_mode===0&&(n.item_mode==='nsfw'||n.item_mode==='nsfl'))||(active_mode===1&&n.item_mode==='nsfl')||(active_mode===4&&(n.item_mode==='sfw'||n.item_mode==='nsfw'))) ? '_blur' : '' }}.webp" data-orig-src="/t/{{ n.item_id }}.webp" alt="thumb" onerror="this.onerror=null;this.src='/pending/t/{{ n.item_id }}.webp';this.onerror=function(){this.style.display='none'};" />
|
||||
</div>
|
||||
@endif
|
||||
<div class="notif-content">
|
||||
|
||||
Reference in New Issue
Block a user