PaperMate / frontend /upload.html
ntphuc149's picture
feat: redesign my_submissions panel + G2 guardrail rewrite + upload modal improvements
38c8c01
Raw
History Blame
10.6 kB
<!doctype html>
<html lang="en" data-theme="light">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>PaperMate — AI Research Paper Reviewer</title>
<link
rel="stylesheet"
href="https://cdn.jsdelivr.net/npm/remixicon@4.3.0/fonts/remixicon.css"
/>
<link rel="stylesheet" href="css/style.css?v=2" />
</head>
<body>
<div class="bg-ambient" aria-hidden="true">
<div class="bg-grid"></div>
<svg class="bg-traces" viewBox="0 0 1440 900" preserveAspectRatio="xMidYMid slice" xmlns="http://www.w3.org/2000/svg">
<g stroke="rgba(245,166,35,.28)" stroke-width="1.5" fill="none">
<!-- Top-left trace -->
<path d="M0,100 H220 L260,140 H480"/>
<circle cx="480" cy="140" r="3.5" fill="rgba(245,166,35,.55)" stroke="none"/>
<!-- Top-right trace -->
<path d="M1440,80 H1180 L1140,120 V240"/>
<circle cx="1140" cy="240" r="3.5" fill="rgba(245,166,35,.55)" stroke="none"/>
<!-- Bottom-right trace -->
<path d="M1440,780 H1260 L1220,740 H1020"/>
<circle cx="1020" cy="740" r="3.5" fill="rgba(245,166,35,.55)" stroke="none"/>
<!-- Bottom-left trace -->
<path d="M0,820 H180 L220,780 V660"/>
<circle cx="220" cy="660" r="3.5" fill="rgba(245,166,35,.55)" stroke="none"/>
<!-- Mid-right accent -->
<path d="M1440,420 H1340 L1300,460 V540"/>
<circle cx="1300" cy="540" r="3" fill="rgba(245,166,35,.4)" stroke="none"/>
</g>
</svg>
</div>
<div class="page-wrap">
<header>
<div class="container">
<a href="home.html" class="logo">
Paper<span class="logo-accent">Mate</span>
</a>
<nav>
<a href="review.html" data-i18n="nav.view_review">View Review</a>
</nav>
</div>
</header>
<main>
<div class="container">
<!-- Hero -->
<div class="hero fade-in">
<h1>
<span data-i18n="upload.hero_h1">Evaluate Your</span><br /><span class="gold-text" data-i18n="upload.hero_h1_gold">Research Paper</span>
</h1>
<p data-i18n="upload.hero_p">
Upload your manuscript and receive a structured peer-review
evaluation across 7 academic dimensions — in minutes.
</p>
</div>
<!-- Upload Card -->
<div class="card fade-in">
<div class="kicker"><span class="dot"></span> <span data-i18n="upload.kicker">Submit</span></div>
<h2 style="font-size: 20px; font-weight: 700; margin-bottom: 4px" data-i18n="upload.card_h2">
Upload your paper
</h2>
<div class="rule"></div>
<form id="upload-form">
<div class="upload-zone" id="drop-zone">
<input type="file" id="pdf-input" accept=".pdf" />
<i class="ri-file-pdf-2-line upload-icon"></i>
<strong data-i18n="upload.drop_strong">Drop your PDF here</strong>
<p data-i18n="upload.drop_p">or click to browse &nbsp;·&nbsp; Max 10 MB</p>
</div>
<p class="upload-note">
<i class="ri-information-line"></i>
<span data-i18n="upload.note">ACL ARR format: short papers up to 4 pages of content, long papers up to 8 pages — excluding references &amp; appendices.</span>
</p>
<div class="file-name" id="file-name">
<span id="file-name-text"></span>
<button type="button" class="file-clear-btn" id="file-clear-btn" aria-label="Remove file">
<i class="ri-close-line"></i>
</button>
</div>
<input type="hidden" id="email-input" />
<div class="alert alert-error" id="error-msg"></div>
<button
type="submit"
class="btn btn-primary"
id="submit-btn"
disabled
>
<i class="ri-send-plane-line"></i> <span data-i18n="upload.submit_btn">Submit for Review</span>
</button>
</form>
<!-- Secret Key Result -->
<div class="secret-key-box" id="result-box">
<div class="sk-label" data-i18n="upload.sk_label">Your Secret Key</div>
<div class="sk-input-row" id="sk-input-row"></div>
<div class="sk-hint">
<i class="ri-error-warning-line"></i> <span data-i18n="upload.sk_hint">Save this key — you'll need it to read your review.</span>
</div>
</div>
<div class="alert alert-info" id="info-msg" data-i18n="upload.info_msg">
<i class="ri-checkbox-circle-line"></i> Submitted! Your paper is being processed. Use your secret key above to check the review when it's ready. Or click <strong>Track my submission</strong> below to follow your paper's progress and get notified when your review is complete.
</div>
<a id="track-btn" class="btn btn-primary" href="my_submissions.html" style="display:none; margin-top:16px; text-decoration:none">
<i class="ri-map-pin-time-line"></i> <span data-i18n="upload.track_btn">Track my submission</span>
</a>
</div>
<!-- Page limit confirmation modal -->
<div class="modal-overlay" id="page-limit-modal" role="dialog" aria-modal="true" aria-labelledby="modal-title">
<div class="modal-box">
<div class="modal-icon"><i class="ri-checkbox-multiple-line"></i></div>
<h3 id="modal-title" data-i18n="upload.modal_title">Submission Eligibility</h3>
<p class="modal-body" data-i18n="upload.modal_body">Please confirm your manuscript meets ACL ARR submission requirements before proceeding:</p>
<ul class="modal-list">
<li data-i18n="upload.modal_short"><strong>Short paper</strong> — up to <strong>4 pages</strong> of content</li>
<li data-i18n="upload.modal_long"><strong>Long paper</strong> — up to <strong>8 pages</strong> of content</li>
</ul>
<p class="modal-note" data-i18n="upload.modal_note">References, appendices, and ethics statements do <strong>not</strong> count toward the page limit.</p>
<p class="modal-format-note">
<span data-i18n="upload.modal_format_note">For formatting details, see the </span><a href="https://acl-org.github.io/ACLPUB/formatting.html" target="_blank" rel="noopener" data-i18n="upload.modal_format_link">ACL formatting guidelines</a><span data-i18n="upload.modal_format_note2">. If your manuscript is not yet in ACL template format, convert it using the </span><a href="https://github.com/acl-org/acl-style-files" target="_blank" rel="noopener" data-i18n="upload.modal_style_link">official ACL style files</a><span data-i18n="upload.modal_format_note3"> before submitting.</span>
</p>
<label class="modal-check">
<input type="checkbox" id="template-confirm" />
<span data-i18n="upload.modal_check3">I <strong>confirm</strong> my manuscript uses the <strong>ACL style template</strong> and follows the official formatting guidelines.</span>
</label>
<label class="modal-check">
<input type="checkbox" id="page-limit-confirm" />
<span data-i18n="upload.modal_check1">I <strong>confirm</strong> my manuscript meets the page limits above and <strong>understand</strong> that over-length submissions will be automatically desk-rejected.</span>
</label>
<label class="modal-check">
<input type="checkbox" id="topic-confirm" />
<span data-i18n="upload.modal_check2">I <strong>confirm</strong> my manuscript is in the area of <strong>Natural Language Processing</strong> or <strong>Computational Linguistics</strong>, and understand that out-of-scope submissions will be desk-rejected.</span>
</label>
<div class="modal-actions">
<button class="btn btn-outline" id="modal-cancel" data-i18n="upload.modal_cancel">Cancel</button>
<button class="btn btn-primary" id="modal-confirm" disabled>
<i class="ri-check-line"></i> <span data-i18n="upload.modal_confirm">Confirm &amp; Continue</span>
</button>
</div>
</div>
</div>
<!-- How it works -->
<div class="card fade-in">
<div class="kicker"><span class="dot"></span> <span data-i18n="upload.hiw_kicker">How it works</span></div>
<div class="rule"></div>
<div class="steps-grid steps-grid--3">
<div class="step-card">
<div class="step-num">1</div>
<i class="ri-upload-cloud-2-line step-icon"></i>
<h3 data-i18n="upload.step1_h3">Upload</h3>
<p data-i18n="upload.step1_p">Sign in and drop your PDF manuscript.</p>
</div>
<div class="step-card">
<div class="step-num">2</div>
<i class="ri-key-2-line step-icon"></i>
<h3 data-i18n="upload.step2_h3">Get Your Key</h3>
<p data-i18n="upload.step2_p">Receive a secret key instantly — save it to access your review.</p>
</div>
<div class="step-card">
<div class="step-num">3</div>
<i class="ri-article-line step-icon"></i>
<h3 data-i18n="upload.step3_h3">View Review</h3>
<p data-i18n="upload.step3_p">Enter your secret key to read the structured evaluation.</p>
</div>
</div>
</div>
</div>
</main>
<footer>
<div class="container">
PaperMate &nbsp;·&nbsp; ACL ARR-style AI Peer Review &nbsp;·&nbsp;
<a href="review.html" data-i18n="footer.view">View a review</a>
&nbsp;·&nbsp;
<a href="mailto:26ai.phucnt@vinuni.edu.vn" data-i18n="footer.contact">Contact</a>
</div>
</footer>
</div>
<script src="js/i18n.js?v=1"></script>
<script src="js/theme.js?v=3"></script>
<script type="module" src="js/nav-auth.js?v=4"></script>
<script type="module" src="js/upload.js?v=3"></script>
</body>
</html>