New style and added ContextWizard pages
This commit is contained in:
qingjie.du
BIN
contextwizard-files/icon128.png
Normal file
BIN
contextwizard-files/icon128.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 4.3 KiB |
BIN
contextwizard-files/screen-options-platforms-640-400.jpg
Normal file
BIN
contextwizard-files/screen-options-platforms-640-400.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 39 KiB |
BIN
contextwizard-files/screen-platforms-640-400.jpg
Normal file
BIN
contextwizard-files/screen-platforms-640-400.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 43 KiB |
BIN
contextwizard-files/screen-search-640-400.jpg
Normal file
BIN
contextwizard-files/screen-search-640-400.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 64 KiB |
458
contextwizard_privacy_policy.html
Normal file
458
contextwizard_privacy_policy.html
Normal file
@@ -0,0 +1,458 @@
|
||||
<!DOCTYPE html>
|
||||
|
||||
<html
|
||||
lang="en-US"
|
||||
class="light-style"
|
||||
>
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta
|
||||
name="viewport"
|
||||
content="width=device-width, initial-scale=1.0"
|
||||
/>
|
||||
|
||||
<title> ContextWizard Privacy Policy - amiPro </title>
|
||||
|
||||
<!-- Google tag (gtag.js) -->
|
||||
<script async src="https://www.googletagmanager.com/gtag/js?id=G-850DCHX9EJ"></script>
|
||||
<script>
|
||||
globalThis.dataLayer = globalThis.dataLayer || [];
|
||||
function gtag(){dataLayer.push(arguments);}
|
||||
gtag('js', new Date());
|
||||
|
||||
gtag('config', 'G-850DCHX9EJ');
|
||||
</script>
|
||||
|
||||
<meta name="description" content="ContextWizard privacy policy and data handling disclosures" />
|
||||
|
||||
<!-- Favicon -->
|
||||
<link rel="icon" type="image/x-icon" href="files/favicon.ico" />
|
||||
|
||||
<!-- Fonts -->
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||
<link
|
||||
href="https://fonts.googleapis.com/css2?family=Public+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;1,300;1,400;1,500;1,600;1,700&display=swap"
|
||||
rel="stylesheet"
|
||||
/>
|
||||
|
||||
<!-- Icons. Uncomment required icon fonts -->
|
||||
<link rel="stylesheet" href="files/boxicons.css?v=20230405" />
|
||||
|
||||
<!-- Core CSS -->
|
||||
<link rel="stylesheet" href="files/core.css" class="template-customizer-core-css" />
|
||||
<link rel="stylesheet" href="files/theme-default.css" class="template-customizer-theme-css" />
|
||||
<link rel="stylesheet" href="files/demo.css" />
|
||||
<link rel="stylesheet" href="files/modern.css" />
|
||||
|
||||
<!-- Vendors CSS -->
|
||||
<link rel="stylesheet" href="files/perfect-scrollbar.css" />
|
||||
|
||||
<!-- Page CSS -->
|
||||
|
||||
<!-- Helpers -->
|
||||
<script src="files/helpers.js"></script>
|
||||
|
||||
<style>
|
||||
body {
|
||||
color: #1f2a37;
|
||||
background-color: #f5f7fb;
|
||||
}
|
||||
|
||||
.privacy-content .card {
|
||||
border: none;
|
||||
border-radius: 1rem;
|
||||
box-shadow: 0 12px 30px rgba(15, 23, 42, 0.08);
|
||||
background-color: #ffffff;
|
||||
}
|
||||
|
||||
.privacy-content .card-header {
|
||||
background: transparent;
|
||||
border-bottom: 1px solid rgba(15, 23, 42, 0.08);
|
||||
}
|
||||
|
||||
.privacy-content .card-title {
|
||||
color: #0f172a;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.privacy-content .card-body,
|
||||
.privacy-content .card-body p,
|
||||
.privacy-content .card-body li,
|
||||
.privacy-content .card-body td,
|
||||
.privacy-content .card-body th {
|
||||
color: #1f2937;
|
||||
font-size: 1rem;
|
||||
line-height: 1.7;
|
||||
}
|
||||
|
||||
.privacy-content .card-body ul {
|
||||
padding-left: 1.25rem;
|
||||
}
|
||||
|
||||
.privacy-content .card-body code {
|
||||
color: #c026d3;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.privacy-content table {
|
||||
border-color: rgba(15, 23, 42, 0.1);
|
||||
}
|
||||
|
||||
.hero__text,
|
||||
.hero__text .hero__title,
|
||||
.hero__text p,
|
||||
.hero__eyebrow,
|
||||
.hero__chips .hero-chip {
|
||||
color: #f8fafc;
|
||||
}
|
||||
|
||||
.hero__text .hero__title {
|
||||
text-shadow: 0 4px 24px rgba(15, 23, 42, 0.35);
|
||||
}
|
||||
|
||||
.hero__chips .hero-chip {
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
border-color: rgba(255, 255, 255, 0.2);
|
||||
}
|
||||
|
||||
.hero__device h4,
|
||||
.hero__device p {
|
||||
color: #e2e8f0;
|
||||
}
|
||||
</style>
|
||||
|
||||
<!--! Template customizer & Theme config files MUST be included after core stylesheets and helpers.js in the <head> section -->
|
||||
<!--? Config: Mandatory theme config file contain global vars & default theme options, Set your preferred theme option in this file. -->
|
||||
<script src="files/config.js"></script>
|
||||
|
||||
<script src="files/jquery.js"></script>
|
||||
<script src="files/popper.js"></script>
|
||||
<script src="files/bootstrap.js"></script>
|
||||
<script src="files/perfect-scrollbar.js"></script>
|
||||
<script src="files/menu.js"></script>
|
||||
<script src="files/main.js"></script>
|
||||
|
||||
<script src="files/ua-parser.js"></script>
|
||||
|
||||
<script src="files/amipro_utils.js?v=20230401402"></script>
|
||||
|
||||
<script>
|
||||
const i18n_messages = new Map();
|
||||
let lang_map = new Map();
|
||||
lang_map.set('en-US', 'amiPro - Trustworthy passkey & privacy tooling');
|
||||
lang_map.set('zh-CN', 'amiPro - 值得信赖的 Passkey 与隐私工具');
|
||||
lang_map.set('ja', 'amiPro - 信頼できるパスキーとプライバシーツール');
|
||||
i18n_messages.set('label_welcome', lang_map);
|
||||
|
||||
lang_map = new Map();
|
||||
lang_map.set('en-US', 'Management Portal');
|
||||
lang_map.set('zh-CN', '管理门户');
|
||||
lang_map.set('ja', '管理ポータル');
|
||||
i18n_messages.set('label_portal', lang_map);
|
||||
|
||||
window.onload = async function() {
|
||||
setI18NText(i18n_messages);
|
||||
initRevealAnimations();
|
||||
}
|
||||
</script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<!-- Layout wrapper -->
|
||||
<div class="layout-wrapper layout-content-navbar">
|
||||
<div class="layout-container">
|
||||
<!-- Layout container -->
|
||||
<div class="layout-page">
|
||||
<!-- Navbar -->
|
||||
|
||||
|
||||
|
||||
<!-- / Navbar -->
|
||||
|
||||
<!-- Content wrapper -->
|
||||
<div class="content-wrapper">
|
||||
<!-- Content -->
|
||||
<div style="margin: 24px;">
|
||||
<section class="hero reveal">
|
||||
<div class="hero__text" data-animate>
|
||||
<span class="hero__eyebrow">ContextWizard · Privacy</span>
|
||||
<h1 class="hero__title">Your AI conversations stay on your device</h1>
|
||||
<p class="hero__lead">
|
||||
ContextWizard by amiPro, LLC captures what is already visible in your AI chat windows,
|
||||
encrypts and stores it locally, and never transmits it to amiPro or third parties.
|
||||
</p>
|
||||
<div class="hero__chips">
|
||||
<span class="hero-chip">Local‑first</span>
|
||||
<span class="hero-chip">Chrome Manifest V3</span>
|
||||
<span class="hero-chip">GDPR & CCPA aligned</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="hero__media" data-animate>
|
||||
<div class="hero__orb"></div>
|
||||
<div class="hero__device">
|
||||
<h4>ContextWizard Privacy Policy</h4>
|
||||
<p>
|
||||
Learn exactly how data moves (and doesn’t move) inside the extension and how to stay in control.
|
||||
</p>
|
||||
<div class="hero__chips" style="margin-top: 1.5rem;">
|
||||
<span class="hero-chip">No telemetry</span>
|
||||
<span class="hero-chip">Full user control</span>
|
||||
<span class="hero-chip">Offline friendly</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<div class="alert alert-info d-flex align-items-center" role="alert" style="margin-top: 24px;">
|
||||
<i class="bx bx-shield-quarter bx-sm me-2"></i>
|
||||
<div>
|
||||
<strong>Last updated:</strong> 18 November 2025
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<article class="privacy-content" style="margin-top: 24px;">
|
||||
<section class="card mb-4 reveal" data-animate>
|
||||
<div class="card-header">
|
||||
<h2 class="card-title" style="margin: 0;">ContextWizard Privacy Policy</h2>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<p>
|
||||
ContextWizard is a Chrome extension built by amiPro, LLC that helps you capture, search, and revisit
|
||||
AI chat conversations across multiple platforms. This Privacy Policy explains what data the extension
|
||||
processes, how the data stays on your device, and what controls you have. By installing or using
|
||||
ContextWizard you agree to the data practices described below.
|
||||
</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="card mb-4 reveal" data-animate>
|
||||
<div class="card-header">
|
||||
<h3 class="card-title" style="margin: 0;">1. Scope & Purpose</h3>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<p>
|
||||
ContextWizard runs entirely as a browser extension and operates solely within the Chrome profile where it is
|
||||
installed. Its only purpose is to capture the text you already see on supported AI chat platforms, store summaries
|
||||
and metadata locally, and provide search, filtering, and export/import features.
|
||||
</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="card mb-4 reveal" data-animate>
|
||||
<div class="card-header">
|
||||
<h3 class="card-title" style="margin: 0;">2. Data We Process</h3>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="table-responsive">
|
||||
<table class="table table-striped">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Category</th>
|
||||
<th>Description</th>
|
||||
<th>Storage Location</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Conversation content</td>
|
||||
<td>Message text, titles, timestamps, participant role (user/assistant), detected platform, and the URL of the conversation you are currently viewing.</td>
|
||||
<td><code>chrome.storage.local</code></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Platform settings</td>
|
||||
<td>Which built-in platforms are enabled, custom platform URL patterns, color assignments, and per-platform toggles.</td>
|
||||
<td><code>chrome.storage.sync</code></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>UI preferences</td>
|
||||
<td>Language override, sort order, search filters, onboarding dismissals, and other UX state.</td>
|
||||
<td><code>chrome.storage.local</code></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<p class="mb-0">
|
||||
ContextWizard does <strong>not</strong> collect account credentials, payment data, unrelated browsing history, or telemetry/analytics.
|
||||
</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="card mb-4 reveal" data-animate>
|
||||
<div class="card-header">
|
||||
<h3 class="card-title" style="margin: 0;">3. Data Sources & Collection Method</h3>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<ul>
|
||||
<li>Content is captured only from pages whose URLs match the built-in or user-configured host permissions (e.g., <code>https://chatgpt.com/*</code>).</li>
|
||||
<li>The extension uses MutationObserver and DOM queries to read message containers in the active tab; it does <strong>not</strong> call any platform APIs or intercept network traffic.</li>
|
||||
<li>Data collection begins only after you navigate to a supported page and the recording indicator appears. Closing the tab or disabling the platform stops collection immediately.</li>
|
||||
</ul>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="card mb-4 reveal" data-animate>
|
||||
<div class="card-header">
|
||||
<h3 class="card-title" style="margin: 0;">4. How We Use Data</h3>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<p>All captured data is used exclusively to power the extension’s on-device features:</p>
|
||||
<ol>
|
||||
<li>Build a searchable, unified list of your AI conversations.</li>
|
||||
<li>Provide quick links back to the source page via <code>chrome.tabs.update</code>.</li>
|
||||
<li>Enable exports/imports so you can back up or restore your local archive.</li>
|
||||
<li>Maintain per-platform enable/disable states and custom URL patterns.</li>
|
||||
</ol>
|
||||
<p class="mb-0">We never send this information to amiPro, LLC servers or any third party.</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="card mb-4 reveal" data-animate>
|
||||
<div class="card-header">
|
||||
<h3 class="card-title" style="margin: 0;">5. Data Sharing & Transfers</h3>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<ul>
|
||||
<li>ContextWizard does <strong>not</strong> transmit data outside the local browser environment.</li>
|
||||
<li>We do not share, sell, rent, or trade any user data with third parties.</li>
|
||||
<li>The extension does not embed third-party analytics or advertising scripts.</li>
|
||||
<li>Operating offline is fully supported once the extension is installed.</li>
|
||||
</ul>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="card mb-4 reveal" data-animate>
|
||||
<div class="card-header">
|
||||
<h3 class="card-title" style="margin: 0;">6. Permissions & Technical Safeguards</h3>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="table-responsive">
|
||||
<table class="table table-striped">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Permission</th>
|
||||
<th>Reason</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td><code>activeTab</code></td>
|
||||
<td>Detects whether the tab you explicitly interact with matches a supported platform so conversations can be listed in the popup.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>tabs</code></td>
|
||||
<td>Opens the saved conversation’s URL in the current window and reads metadata (title/URL) for the active tab only.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>scripting</code></td>
|
||||
<td>Injects the packaged content script (<code>content.js</code>) on supported hosts to observe DOM changes in real time; no remote code is used.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>storage</code></td>
|
||||
<td>Saves conversations, summaries, and user preferences locally using Chrome Storage APIs.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Host permissions</td>
|
||||
<td>Restrict DOM access to specific AI chat domains so we can parse message containers safely.</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<div>
|
||||
<p><strong>Additional safeguards:</strong></p>
|
||||
<ul>
|
||||
<li>Manifest V3 service worker architecture prevents persistent background execution.</li>
|
||||
<li>All JavaScript injected into pages ships with the extension bundle; no remote code execution or eval of downloaded strings.</li>
|
||||
<li>Obfuscation is applied only during the optional <code>npm run build</code> release process; source review builds remain readable.</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="card mb-4 reveal" data-animate>
|
||||
<div class="card-header">
|
||||
<h3 class="card-title" style="margin: 0;">7. User Controls</h3>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<ul>
|
||||
<li><strong>Platform Toggles:</strong> Settings (<code>options.html</code>) lets you enable/disable each built-in domain or remove custom domains.</li>
|
||||
<li><strong>Data Management:</strong> Export, import, or delete all stored data from Settings → Data Management. Deleting clears <code>chrome.storage</code> entries.</li>
|
||||
<li><strong>Pause Collection:</strong> Use Chrome’s site access controls or the in-extension platform toggle to stop monitoring a site temporarily. Removing the extension deletes every stored record.</li>
|
||||
<li><strong>Language & UI:</strong> Switch languages via the popup menu; UI choices persist only within your profile.</li>
|
||||
</ul>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="card mb-4 reveal" data-animate>
|
||||
<div class="card-header">
|
||||
<h3 class="card-title" style="margin: 0;">8. Data Retention</h3>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<p>
|
||||
Data stays in your local Chrome profile until you delete it via the Data Management screen, clear Chrome’s site data, or uninstall the extension. We do not maintain server-side backups, so removing the extension permanently erases your archive.
|
||||
</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="card mb-4 reveal" data-animate>
|
||||
<div class="card-header">
|
||||
<h3 class="card-title" style="margin: 0;">9. Compliance Statement</h3>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<p>
|
||||
ContextWizard complies with the Chrome Web Store Developer Program Policies, including the User Data, Limited Use, and Secure Handling requirements. Because all processing occurs locally and no personal data leaves the device, ContextWizard also aligns with major privacy regulations (e.g., GDPR, CCPA) regarding data minimization and user control.
|
||||
</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="card mb-4 reveal" data-animate>
|
||||
<div class="card-header">
|
||||
<h3 class="card-title" style="margin: 0;">10. Children’s Privacy</h3>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<p>
|
||||
ContextWizard is intended for general audiences and does not knowingly collect information from children under 13. If you believe a minor has provided data, remove the extension or clear the storage to delete it immediately.
|
||||
</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="card mb-4 reveal" data-animate>
|
||||
<div class="card-header">
|
||||
<h3 class="card-title" style="margin: 0;">11. Changes to This Policy</h3>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<p>
|
||||
We may update this policy to reflect feature changes or regulatory guidance. When we do, we will update the “Last updated” date above and publish the revised policy at this same URL. Material changes will be summarized in the README and release notes.
|
||||
</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="card mb-5 reveal" data-animate>
|
||||
<div class="card-header">
|
||||
<h3 class="card-title" style="margin: 0;">12. Contact Us</h3>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<p>
|
||||
For privacy questions, requests, or bug reports, email <a href="mailto:support@amipro.me">support@amipro.me</a>.
|
||||
We aim to respond within five business days.
|
||||
</p>
|
||||
</div>
|
||||
</section>
|
||||
</article>
|
||||
</div>
|
||||
<!-- / Content -->
|
||||
|
||||
<div class="content-backdrop fade"></div>
|
||||
</div>
|
||||
<!-- Content wrapper -->
|
||||
</div>
|
||||
<!-- / Layout page -->
|
||||
</div>
|
||||
<!-- / Layout container -->
|
||||
</div>
|
||||
<!-- / Layout wrapper -->
|
||||
|
||||
<!-- Overlay -->
|
||||
<div class="layout-overlay layout-menu-toggle"></div>
|
||||
</body>
|
||||
</html>
|
||||
427
contextwizard_top.html
Normal file
427
contextwizard_top.html
Normal file
@@ -0,0 +1,427 @@
|
||||
<!DOCTYPE html>
|
||||
|
||||
<html
|
||||
lang="en-US"
|
||||
class="light-style"
|
||||
>
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta
|
||||
name="viewport"
|
||||
content="width=device-width, initial-scale=1.0"
|
||||
/>
|
||||
|
||||
<title> ContextWizard - amiPro </title>
|
||||
|
||||
<!-- Google tag (gtag.js) -->
|
||||
<script async src="https://www.googletagmanager.com/gtag/js?id=G-850DCHX9EJ"></script>
|
||||
<script>
|
||||
globalThis.dataLayer = globalThis.dataLayer || [];
|
||||
function gtag(){dataLayer.push(arguments);}
|
||||
gtag('js', new Date());
|
||||
|
||||
gtag('config', 'G-850DCHX9EJ');
|
||||
</script>
|
||||
|
||||
<meta name="description" content="ContextWizard keeps every AI conversation searchable, private, and under your control" />
|
||||
|
||||
<!-- Favicon -->
|
||||
<link rel="icon" type="image/x-icon" href="files/favicon.ico" />
|
||||
|
||||
<!-- Fonts -->
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||
<link
|
||||
href="https://fonts.googleapis.com/css2?family=Public+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;1,300;1,400;1,500;1,600;1,700&display=swap"
|
||||
rel="stylesheet"
|
||||
/>
|
||||
|
||||
<!-- Icons. Uncomment required icon fonts -->
|
||||
<link rel="stylesheet" href="files/boxicons.css?v=20230405" />
|
||||
|
||||
<!-- Core CSS -->
|
||||
<link rel="stylesheet" href="files/core.css" class="template-customizer-core-css" />
|
||||
<link rel="stylesheet" href="files/theme-default.css" class="template-customizer-theme-css" />
|
||||
<link rel="stylesheet" href="files/demo.css" />
|
||||
<link rel="stylesheet" href="files/modern.css" />
|
||||
|
||||
<!-- Vendors CSS -->
|
||||
<link rel="stylesheet" href="files/perfect-scrollbar.css" />
|
||||
|
||||
<!-- Helpers -->
|
||||
<script src="files/helpers.js"></script>
|
||||
|
||||
<style>
|
||||
body {
|
||||
color: var(--text-bright, #f8fafc);
|
||||
background: radial-gradient(circle at top, #0f172a, #040b1f);
|
||||
background-color: #040b1f;
|
||||
}
|
||||
|
||||
.hero__text .hero__title {
|
||||
font-size: clamp(2rem, 4vw, 3.25rem);
|
||||
color: var(--text-bright, #f8fafc);
|
||||
}
|
||||
|
||||
.hero__text .hero__lead {
|
||||
max-width: 560px;
|
||||
color: rgba(248, 250, 252, 0.85);
|
||||
}
|
||||
|
||||
.hero__badge {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 0.35rem;
|
||||
padding: 0.25rem 0.8rem;
|
||||
border-radius: 999px;
|
||||
background: rgba(248, 250, 252, 0.18);
|
||||
border: 1px solid rgba(248, 250, 252, 0.3);
|
||||
color: var(--text-bright, #f8fafc);
|
||||
font-size: 0.85rem;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.05em;
|
||||
}
|
||||
|
||||
.hero__media img {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
border-radius: 1.25rem;
|
||||
box-shadow: 0 20px 60px rgba(15, 23, 42, 0.18);
|
||||
}
|
||||
|
||||
.section-heading {
|
||||
margin: 0 0 0.5rem;
|
||||
font-weight: 600;
|
||||
color: var(--text-bright, #f8fafc);
|
||||
}
|
||||
|
||||
.section-lead {
|
||||
color: var(--text-muted, #cbd5f5);
|
||||
max-width: 720px;
|
||||
}
|
||||
|
||||
.feature-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
|
||||
gap: 1.5rem;
|
||||
}
|
||||
|
||||
.feature-card {
|
||||
border: none;
|
||||
border-radius: 1rem;
|
||||
box-shadow: 0 16px 50px rgba(15, 23, 42, 0.08);
|
||||
transition: transform 200ms ease, box-shadow 200ms ease;
|
||||
background: rgba(255, 255, 255, 0.95);
|
||||
color: #0f172a;
|
||||
}
|
||||
|
||||
.feature-card:hover {
|
||||
transform: translateY(-4px);
|
||||
box-shadow: 0 24px 55px rgba(15, 23, 42, 0.12);
|
||||
}
|
||||
|
||||
.feature-icon {
|
||||
display: inline-flex;
|
||||
width: 48px;
|
||||
height: 48px;
|
||||
border-radius: 16px;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
background: #eef2ff;
|
||||
color: #4338ca;
|
||||
font-size: 1.5rem;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
.feature-card ul {
|
||||
padding-left: 1rem;
|
||||
margin-bottom: 0;
|
||||
color: #334155;
|
||||
}
|
||||
|
||||
.checklist {
|
||||
list-style: none;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.checklist li {
|
||||
display: flex;
|
||||
gap: 0.5rem;
|
||||
margin-bottom: 0.5rem;
|
||||
color: var(--text-bright, #f8fafc);
|
||||
}
|
||||
|
||||
.checklist li i {
|
||||
color: #16a34a;
|
||||
}
|
||||
|
||||
.data-callout {
|
||||
border: 1px solid rgba(15, 23, 42, 0.08);
|
||||
border-radius: 1rem;
|
||||
padding: 1.5rem;
|
||||
background: #ffffff;
|
||||
box-shadow: inset 0 0 0 1px rgba(99, 102, 241, 0.1);
|
||||
color: #0f172a;
|
||||
}
|
||||
|
||||
.card {
|
||||
color: #0f172a;
|
||||
background-color: rgba(255, 255, 255, 0.95);
|
||||
}
|
||||
|
||||
.card .checklist li,
|
||||
.data-callout .checklist li {
|
||||
color: #0f172a;
|
||||
}
|
||||
|
||||
.pay-attention {
|
||||
border-left: 4px solid #f97316;
|
||||
background: #fff7ed;
|
||||
color: #7c2d12;
|
||||
}
|
||||
</style>
|
||||
|
||||
<!--! Template customizer & Theme config files MUST be included after core stylesheets and helpers.js in the <head> section -->
|
||||
<script src="files/config.js"></script>
|
||||
|
||||
<script src="files/jquery.js"></script>
|
||||
<script src="files/popper.js"></script>
|
||||
<script src="files/bootstrap.js"></script>
|
||||
<script src="files/perfect-scrollbar.js"></script>
|
||||
<script src="files/menu.js"></script>
|
||||
<script src="files/main.js"></script>
|
||||
|
||||
<script src="files/ua-parser.js"></script>
|
||||
|
||||
<script src="files/amipro_utils.js?v=20230401402"></script>
|
||||
|
||||
<script>
|
||||
const i18n_messages = new Map();
|
||||
let lang_map = new Map();
|
||||
lang_map.set('en-US', 'amiPro - Trustworthy passkey & privacy tooling');
|
||||
lang_map.set('zh-CN', 'amiPro - 值得信赖的 Passkey 与隐私工具');
|
||||
lang_map.set('ja', 'amiPro - 信頼できるパスキーとプライバシーツール');
|
||||
i18n_messages.set('label_welcome', lang_map);
|
||||
|
||||
lang_map = new Map();
|
||||
lang_map.set('en-US', 'Management Portal');
|
||||
lang_map.set('zh-CN', '管理门户');
|
||||
lang_map.set('ja', '管理ポータル');
|
||||
i18n_messages.set('label_portal', lang_map);
|
||||
|
||||
window.onload = async function() {
|
||||
setI18NText(i18n_messages);
|
||||
initRevealAnimations();
|
||||
}
|
||||
</script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<!-- Layout wrapper -->
|
||||
<div class="layout-wrapper layout-content-navbar">
|
||||
<div class="layout-container">
|
||||
<!-- Layout container -->
|
||||
<div class="layout-page">
|
||||
<!-- Navbar -->
|
||||
|
||||
|
||||
|
||||
<!-- / Navbar -->
|
||||
|
||||
<!-- Content wrapper -->
|
||||
<div class="content-wrapper">
|
||||
<!-- Content -->
|
||||
<div style="margin: 24px;">
|
||||
<section class="hero reveal">
|
||||
<div class="hero__text" data-animate>
|
||||
<span class="hero__badge"><i class="bx bx-bot"></i> ContextWizard</span>
|
||||
<h1 class="hero__title">Never lose an AI conversation again.</h1>
|
||||
<p class="hero__lead">
|
||||
Harness each assistant's strengths, one-click backup or migrate every thread, and start immediately with zero configuration.
|
||||
</p>
|
||||
<ul class="checklist" style="margin-top: 1.25rem;">
|
||||
<li><i class="bx bx-check-circle"></i>All your data never leaves your PC</li>
|
||||
<li><i class="bx bx-check-circle"></i>Automatic capture across your favorite AI chat platforms</li>
|
||||
<li><i class="bx bx-check-circle"></i>Search, filter, and relaunch chats instantly</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="hero__media" data-animate>
|
||||
<div class="hero__orb"></div>
|
||||
<img src="contextwizard-files/screen-platforms-640-400.jpg" alt="ContextWizard platform overview screenshot" loading="lazy" />
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<div class="alert alert-success data-callout reveal" role="alert" data-animate style="margin-top: 24px;">
|
||||
<i class="bx bx-lock-alt bx-sm me-2"></i>
|
||||
<div>
|
||||
<strong>Local-first:</strong> A unified conversation manager for AI chat platforms. ContextWizard automatically captures and organizes your conversations while keeping everything encrypted on-device.
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<section class="reveal" data-animate style="margin-top: 40px;">
|
||||
<h2 class="section-heading">Why ContextWizard?</h2>
|
||||
<p class="section-lead">
|
||||
ContextWizard automatically captures and organizes your conversations across multiple AI assistants, making every insight searchable, portable, and ready to revisit.
|
||||
</p>
|
||||
</section>
|
||||
|
||||
<div class="feature-grid" style="margin-top: 24px;">
|
||||
<article class="card feature-card reveal" data-animate>
|
||||
<div class="card-body">
|
||||
<div class="feature-icon">🤖</div>
|
||||
<h3 class="card-title">Multi-Platform Support</h3>
|
||||
<ul>
|
||||
<li><strong>10 built-in platforms</strong>: ChatGPT, Claude, Gemini, Copilot, Perplexity, HuggingChat, Poe, Grok, DeepSeek, Qwen.</li>
|
||||
<li><strong>Custom platforms</strong>: Add any AI chat site via URL patterns.</li>
|
||||
<li><strong>Automatic detection</strong> as soon as you land on supported hosts.</li>
|
||||
</ul>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<article class="card feature-card reveal" data-animate>
|
||||
<div class="card-body">
|
||||
<div class="feature-icon">💾</div>
|
||||
<h3 class="card-title">Smart Recording</h3>
|
||||
<ul>
|
||||
<li>Real-time capture using MutationObserver.</li>
|
||||
<li>Platform-specific selectors for accurate transcripts.</li>
|
||||
<li>Debounced saves, visual indicator, and URL-aware logic for clean history.</li>
|
||||
</ul>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<article class="card feature-card reveal" data-animate>
|
||||
<div class="card-body">
|
||||
<div class="feature-icon">🔍</div>
|
||||
<h3 class="card-title">Powerful Search</h3>
|
||||
<ul>
|
||||
<li>Full-text search across titles, summaries, and message bodies.</li>
|
||||
<li>Platform filters plus smart ranking by recency and relevance.</li>
|
||||
<li>Jump back into any conversation with one click.</li>
|
||||
</ul>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<article class="card feature-card reveal" data-animate>
|
||||
<div class="card-body">
|
||||
<div class="feature-icon">📊</div>
|
||||
<h3 class="card-title">Conversation Management</h3>
|
||||
<ul>
|
||||
<li>Unified list for every assistant you use.</li>
|
||||
<li>Quick access, deletion, export, and import workflows.</li>
|
||||
<li>Local storage ensures nothing syncs beyond your machine.</li>
|
||||
</ul>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<article class="card feature-card reveal" data-animate>
|
||||
<div class="card-body">
|
||||
<div class="feature-icon">🌐</div>
|
||||
<h3 class="card-title">Internationalization</h3>
|
||||
<ul>
|
||||
<li>Localized UI across 12 languages.</li>
|
||||
<li>Automatic browser-language detection.</li>
|
||||
<li>Fast language switching with persistent preferences.</li>
|
||||
</ul>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<article class="card feature-card reveal" data-animate>
|
||||
<div class="card-body">
|
||||
<div class="feature-icon">⚙️</div>
|
||||
<h3 class="card-title">Customization</h3>
|
||||
<ul>
|
||||
<li>Enable/disable platforms individually.</li>
|
||||
<li>Add custom URL patterns for new AI sites.</li>
|
||||
<li>Manage data with stats, exports, imports, and clears.</li>
|
||||
</ul>
|
||||
</div>
|
||||
</article>
|
||||
</div>
|
||||
|
||||
<section class="card mb-4 mt-5 reveal" data-animate>
|
||||
<div class="card-body">
|
||||
<h3 class="card-title" style="margin-bottom: 1rem;">How capturing works</h3>
|
||||
<p>
|
||||
ContextWizard watches the DOM of supported AI chat pages with lightweight MutationObservers, extracts each assistant/user message via platform-optimized selectors, and stores condensed transcripts in Chrome storage. Debouncing keeps your archive tidy, while the overlay indicator shows when a session is recording.
|
||||
</p>
|
||||
<ul class="checklist" style="margin-top: 1rem;">
|
||||
<li><i class="bx bx-check-circle"></i>Works with tabs you actively view—no background scraping.</li>
|
||||
<li><i class="bx bx-check-circle"></i>Landing pages (e.g., Gemini /app) are skipped until a unique conversation URL appears.</li>
|
||||
<li><i class="bx bx-check-circle"></i>All saved data lives in <code>chrome.storage.local</code> unless you export it.</li>
|
||||
</ul>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="card mb-4 reveal" data-animate>
|
||||
<div class="row g-0 align-items-center">
|
||||
<div class="col-md-6">
|
||||
<div class="card-body">
|
||||
<h3 class="card-title" style="margin-bottom: 1rem;">Stay coordinated across assistants</h3>
|
||||
<p>
|
||||
Bring order to the chaos of juggling multiple AI assistants. ContextWizard keeps a unified list, lets you filter by platform, and opens any saved thread in-place with a single click.
|
||||
</p>
|
||||
<ul class="checklist" style="margin-top: 1rem;">
|
||||
<li><i class="bx bx-check-circle"></i>Tag and color-code platforms for quick scanning.</li>
|
||||
<li><i class="bx bx-check-circle"></i>Use summaries to remember why a chat mattered.</li>
|
||||
<li><i class="bx bx-check-circle"></i>Export/import archives for backups or new machines.</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<div class="card-body">
|
||||
<img src="contextwizard-files/screen-search-640-400.jpg" alt="ContextWizard search UI" class="img-fluid" loading="lazy" style="border-radius: 1rem; box-shadow: 0 20px 60px rgba(15, 23, 42, 0.15);" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<div class="alert pay-attention reveal" role="alert" data-animate style="margin-top: 24px;">
|
||||
<i class="bx bx-info-circle bx-sm me-2"></i>
|
||||
<strong>Pay attention:</strong> Do <em>not</em> delete your conversations on AI platforms if you still need them. ContextWizard stores the main content, not attachments or full raw data.
|
||||
</div>
|
||||
|
||||
<section class="card mb-5 mt-4 reveal" data-animate>
|
||||
<div class="card-body">
|
||||
<h3 class="card-title" style="margin-bottom: 1rem;">Ready in minutes</h3>
|
||||
<p>
|
||||
Install the extension, pick which platforms to observe, and ContextWizard starts capturing right away—no API keys, no cloud accounts, zero configuration beyond toggling the platforms you care about.
|
||||
</p>
|
||||
<div class="checklist" style="margin-top: 1rem;">
|
||||
<div class="row">
|
||||
<div class="col-md-6">
|
||||
<ul class="checklist">
|
||||
<li><i class="bx bx-check-circle"></i>Enable/disable per platform anytime.</li>
|
||||
<li><i class="bx bx-check-circle"></i>Toggle recording indicator visibility.</li>
|
||||
<li><i class="bx bx-check-circle"></i>Switch languages instantly.</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<ul class="checklist">
|
||||
<li><i class="bx bx-check-circle"></i>Export JSON snapshots for backups.</li>
|
||||
<li><i class="bx bx-check-circle"></i>Import archives when moving machines.</li>
|
||||
<li><i class="bx bx-check-circle"></i>Clear everything with one tap if needed.</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
<!-- / Content -->
|
||||
|
||||
<div class="content-backdrop fade"></div>
|
||||
</div>
|
||||
<!-- Content wrapper -->
|
||||
</div>
|
||||
<!-- / Layout page -->
|
||||
</div>
|
||||
<!-- / Layout container -->
|
||||
</div>
|
||||
<!-- / Layout wrapper -->
|
||||
|
||||
<!-- Overlay -->
|
||||
<div class="layout-overlay layout-menu-toggle"></div>
|
||||
</body>
|
||||
</html>
|
||||
494
fido2_top.html
Normal file
494
fido2_top.html
Normal file
@@ -0,0 +1,494 @@
|
||||
<!DOCTYPE html>
|
||||
|
||||
<html
|
||||
lang="en-US"
|
||||
class="light-style"
|
||||
>
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta
|
||||
name="viewport"
|
||||
content="width=device-width, initial-scale=1.0"
|
||||
/>
|
||||
|
||||
<!-- Google tag (gtag.js) -->
|
||||
<script async src="https://www.googletagmanager.com/gtag/js?id=G-850DCHX9EJ"></script>
|
||||
<script>
|
||||
globalThis.dataLayer = globalThis.dataLayer || [];
|
||||
function gtag(){dataLayer.push(arguments);}
|
||||
gtag('js', new Date());
|
||||
|
||||
gtag('config', 'G-850DCHX9EJ');
|
||||
</script>
|
||||
|
||||
<title> Home - amiPro </title>
|
||||
|
||||
<meta name="description" content="最も簡単に統合できるパスキー・クラウド・サービス; the easiest to integrate Passkey cloud service; Cloud services of FIDO2 and WebAuthN" />
|
||||
|
||||
<!-- Favicon -->
|
||||
<link rel="icon" type="image/x-icon" href="files/favicon.ico" />
|
||||
|
||||
<!-- Fonts -->
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||
<link
|
||||
href="https://fonts.googleapis.com/css2?family=Public+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;1,300;1,400;1,500;1,600;1,700&display=swap"
|
||||
rel="stylesheet"
|
||||
/>
|
||||
|
||||
<!-- Icons. Uncomment required icon fonts -->
|
||||
<link rel="stylesheet" href="files/boxicons.css?v=20230405" />
|
||||
|
||||
<!-- Core CSS -->
|
||||
<link rel="stylesheet" href="files/core.css" class="template-customizer-core-css" />
|
||||
<link rel="stylesheet" href="files/theme-default.css" class="template-customizer-theme-css" />
|
||||
<link rel="stylesheet" href="files/demo.css" />
|
||||
<link rel="stylesheet" href="files/modern.css" />
|
||||
|
||||
<!-- Vendors CSS -->
|
||||
<link rel="stylesheet" href="files/perfect-scrollbar.css" />
|
||||
|
||||
<!-- Page CSS -->
|
||||
|
||||
<!-- Helpers -->
|
||||
<script src="files/helpers.js"></script>
|
||||
|
||||
<!--! Template customizer & Theme config files MUST be included after core stylesheets and helpers.js in the <head> section -->
|
||||
<!--? Config: Mandatory theme config file contain global vars & default theme options, Set your preferred theme option in this file. -->
|
||||
<script src="files/config.js"></script>
|
||||
|
||||
<script src="files/jquery.js"></script>
|
||||
<script src="files/popper.js"></script>
|
||||
<script src="files/bootstrap.js"></script>
|
||||
<script src="files/perfect-scrollbar.js"></script>
|
||||
<script src="files/menu.js"></script>
|
||||
<script src="files/main.js"></script>
|
||||
|
||||
<script src="files/ua-parser.js"></script>
|
||||
|
||||
<script src="files/amipro_utils.js?v=20230401402"></script>
|
||||
|
||||
<script>
|
||||
|
||||
var user_id, reg_session_id;
|
||||
|
||||
const i18n_messages = new Map();
|
||||
|
||||
var lang_map = new Map();
|
||||
lang_map.set("en-US", "amiPro - The easiest to integrate and manage Passkey cloud service");
|
||||
lang_map.set("zh-CN", "amiPro - 最易集成、易管理的 Passkey 云服务");
|
||||
lang_map.set("ja", "amiPro - 最も簡単に統合・管理できるパスキー・クラウド・サービス");
|
||||
i18n_messages.set("label_welcome", lang_map);
|
||||
|
||||
lang_map = new Map();
|
||||
lang_map.set("en-US", "Management Portal");
|
||||
lang_map.set("zh-CN", "管理门户");
|
||||
lang_map.set("ja", "管理ポータル");
|
||||
i18n_messages.set("label_portal", lang_map);
|
||||
|
||||
lang_map = new Map();
|
||||
lang_map.set("en-US", "Contact us (sales@amipro.me)");
|
||||
lang_map.set("zh-CN", "联系我们（sales@amipro.me）");
|
||||
lang_map.set("ja", "お問い合わせ（sales@amipro.me）");
|
||||
i18n_messages.set("title_contact", lang_map);
|
||||
|
||||
lang_map = new Map();
|
||||
lang_map.set("en-US", "Contact us (sales@amipro.me)");
|
||||
lang_map.set("zh-CN", "联系我们（sales@amipro.me）");
|
||||
lang_map.set("ja", "お問い合わせ（sales@amipro.me）");
|
||||
i18n_messages.set("title_contact_cta", lang_map);
|
||||
|
||||
lang_map = new Map();
|
||||
lang_map.set("en-US", "What is Passkey");
|
||||
lang_map.set("zh-CN", "什么是Passkey");
|
||||
lang_map.set("ja", "パスキー(Passkey)とは");
|
||||
i18n_messages.set("title_what_passkey", lang_map);
|
||||
|
||||
lang_map = new Map();
|
||||
lang_map.set("en-US", "Passkeys replace passwords and provide faster, more accessible, and more secure website sign‑ins. Unlike passwords, passkeys are phishing‑resistant and more reliable. With support from major companies including Apple, Google, and NTT, 2023 marked the beginning of passkeys entering the consumer market.");
|
||||
lang_map.set("zh-CN", "Passkey 取代密码，提供更快、更易用且更安全的网站登录。与密码不同，Passkey 稳定可靠并且可抵御网络钓鱼。在包括苹果、谷歌、NTT 等大型公司的支持下，2023 年成为 Passkey 进入消费者市场的元年。");
|
||||
lang_map.set("ja", "パスキーはパスワードを置き換え、より高速で、よりアクセスしやすく<br>より安全なウェブサイトのサインインを提供します。パスワードとは異なり、<br>常に堅牢でフィッシングに耐性があります。<br>Apple、Google、NTTなどの大手企業のサポートを受けて、<br>2023年はPasskeyを一般消費者市場に導入する年です。");
|
||||
i18n_messages.set("info_what_passkey", lang_map);
|
||||
|
||||
lang_map = new Map();
|
||||
lang_map.set("en-US", "Passkey benefits");
|
||||
lang_map.set("zh-CN", "Passkey的优势");
|
||||
lang_map.set("ja", "パスキーのメリット");
|
||||
i18n_messages.set("title_passkey_merits", lang_map);
|
||||
|
||||
lang_map = new Map();
|
||||
lang_map.set("en-US", "Passkeys not only provide a more secure login method; they can also increase your website’s business value:<br>1. Faster sign‑in can <b>improve</b> conversion rates<br>2. No password resets can <b>reduce</b> support costs");
|
||||
lang_map.set("zh-CN", "Passkey 不仅提供更安全的登录方式，也能提升您网站的商业价值：<br>1、更快速的登录可<b>提高</b>转化率<br>2、无需找回密码可<b>降低</b>客服成本");
|
||||
lang_map.set("ja", "パスキーは安全なログイン方法を提供するだけでなく、<br>Webサイトのビジネス価値の向上にもつながります。<br>1. より高速なログインはコンバージョン率の<b>向上</b>に寄与<br>2. パスワード再設定が不要なためサポートコストの<b>削減</b>につながります。");
|
||||
i18n_messages.set("info_passkey_merits", lang_map);
|
||||
|
||||
lang_map = new Map();
|
||||
lang_map.set("en-US", "Merits");
|
||||
lang_map.set("zh-CN", "优势");
|
||||
lang_map.set("ja", "メリット");
|
||||
i18n_messages.set("label_merits", lang_map);
|
||||
|
||||
lang_map = new Map();
|
||||
lang_map.set("en-US", "Why amiPro: Standards compliance");
|
||||
lang_map.set("zh-CN", "amiPro 的优势：标准合规");
|
||||
lang_map.set("ja", "amiProの強み：規格準拠");
|
||||
i18n_messages.set("title_amipro_fido", lang_map);
|
||||
|
||||
lang_map = new Map();
|
||||
lang_map.set("en-US", "amiPro is designed based on the FIDO standard and has passed the FIDO2 conformance test 100%.<br>From the browser to the SDK, everything aligns with the latest FIDO2 standard, making it safer and easier to maintain.<br>Meanwhile, amiPro provides extended features to enhance security and integration convenience.");
|
||||
lang_map.set("zh-CN", "amiPro基于FIDO标准设计，100%通过FIDO2兼容测试。<br>从浏览器到SDK全部统一至FIDO2最新标准，更安全更易维护。<br>同时提供扩展功能，增强安全性及集成便利性");
|
||||
lang_map.set("ja", "amiProはFIDO規格に基づいて設計され、FIDO2互換性テストを100％パスしています<br>ブラウザから SDK に至るまで、すべてが最新の FIDO2 標準に統一されており、より安全で保守が容易です。<br>同時に、amiProはセキュリティと統合の互換性を高めるための拡張機能を提供します。");
|
||||
i18n_messages.set("info_amipro_fido", lang_map);
|
||||
|
||||
lang_map = new Map();
|
||||
lang_map.set("en-US", "FIDO conformance test");
|
||||
lang_map.set("zh-CN", "FIDO兼容性测试");
|
||||
lang_map.set("ja", "FIDO準拠性テスト");
|
||||
i18n_messages.set("label_fido_video", lang_map);
|
||||
|
||||
lang_map = new Map();
|
||||
lang_map.set("en-US", "Why amiPro: Open source");
|
||||
lang_map.set("zh-CN", "amiPro的优势：开源");
|
||||
lang_map.set("ja", "amiProの強み：オープンソース");
|
||||
i18n_messages.set("title_open_src", lang_map);
|
||||
|
||||
lang_map = new Map();
|
||||
lang_map.set("en-US", "amiPro's core is completely open source, thus providing complete verifiability and security.<br>Not only the FIDO2 server, but also the iOS/Android SDK for App development are completely open source.");
|
||||
lang_map.set("zh-CN", "amiPro的核心完全永久开源，从而提供完全的可验证性和安全性。<br>不仅FIDO2服务器，App开发用iOS/Android SDK也完全开源。");
|
||||
lang_map.set("ja", "amiPro のコアは完全にオープンソースであり、完全な検証性とセキュリティを提供します。<br>FIDO2 サーバーだけでなく、アプリ開発用の iOS / Android SDK も完全にオープンソースです。");
|
||||
i18n_messages.set("info_open_src", lang_map);
|
||||
|
||||
lang_map = new Map();
|
||||
lang_map.set("en-US", "Open source project");
|
||||
lang_map.set("zh-CN", "开源项目");
|
||||
lang_map.set("ja", "オープンソースプロジェクト");
|
||||
i18n_messages.set("label_open_src", lang_map);
|
||||
|
||||
lang_map = new Map();
|
||||
lang_map.set("en-US", "How to integrate");
|
||||
lang_map.set("zh-CN", "集成方法");
|
||||
lang_map.set("ja", "導入方法");
|
||||
i18n_messages.set("title_howto", lang_map);
|
||||
|
||||
lang_map = new Map();
|
||||
lang_map.set("en-US", "amiPro provides standards‑based interfaces and an easy‑to‑use JavaScript SDK for integration. From device registration and sign‑in to device reset management, everything can be implemented easily.<br>No need to modify your server backend—use front‑end JavaScript to integrate.<br>We also provide iOS/Android SDKs for app development.<br>Providing integration support (sales@amipro.me)");
|
||||
lang_map.set("zh-CN", "amiPro 提供基于标准的接口以及便于集成的 JavaScript SDK。从设备注册、登录到设备重置管理，都可以轻松实现。<br>无需修改您的服务器后端，仅使用前端 JavaScript 即可完成集成。<br>同时提供用于 App 开发的 iOS/Android SDK，便于集成。<br>提供导入支持（sales@amipro.me）");
|
||||
lang_map.set("ja", "amiProは、統合のための標準的なインターフェイスと便利なJavaScript SDKを提供します。<br>デバイスの登録、ログインからデバイスのリセット管理まで、すべて簡単に実装できます。<br>サーバーのバックグラウンドを変更する必要はありません、<br>フロントエンド JavaScript を使用するだけで統合を実現できます。<br>同時に、App 開発用の iOS / Android SDK も提供しています。 導入サポートが必要な場合は<br> sales@amipro.me へメールでご連絡ください。");
|
||||
i18n_messages.set("info_howto", lang_map);
|
||||
|
||||
lang_map = new Map();
|
||||
lang_map.set("en-US", "Integration Steps");
|
||||
lang_map.set("zh-CN", "集成步骤");
|
||||
lang_map.set("ja", "導入手順");
|
||||
i18n_messages.set("label_integration", lang_map);
|
||||
|
||||
lang_map = new Map();
|
||||
lang_map.set("en-US", "Cost");
|
||||
lang_map.set("zh-CN", "费用");
|
||||
lang_map.set("ja", "費用");
|
||||
i18n_messages.set("title_howmuch", lang_map);
|
||||
|
||||
lang_map = new Map();
|
||||
lang_map.set("en-US", "amiPro provides the highest cost performance billing model based on the number of <b>active users</b>. Regardless of the number of registered users, you only need to pay for per active user (users who log in at least once a month) per month or per authentication.<br>Provide discount plans for sites with a large number of active users.");
|
||||
lang_map.set("zh-CN", "提供基于<b>活动用户数</b>的最高性价比的计费模式。与注册用户数无关，每月只需为每个活动用户（每月至少登录一次的用户）或者按认证次数支付费用。<br>对活动用户数较大的网站提供优惠方案。");
|
||||
lang_map.set("ja", "<b>アクティブユーザー数</b>に基づいた最高のコストパフォーマンスの課金モデルを提供します。<br>登録ユーザー数に関係なく、毎月アクティブユーザー（毎月最低1回ログインするユーザー）或いは認証利用数ごとのお支払いとなります。<br>割引プランもご用意しております。");
|
||||
i18n_messages.set("info_howmuch", lang_map);
|
||||
|
||||
lang_map = new Map();
|
||||
lang_map.set("en-US", "One month free trial<br>(After free registration of the management portal, all functions are free to try for one month)");
|
||||
lang_map.set("zh-CN", "一个月免费试用<br>（免费注册管理门户后，所有功能免费试用一个月）");
|
||||
lang_map.set("ja", "1ヶ月間の無料トライアル<br>（管理ポータルの無料登録後、すべての機能を1ヶ月間無料でお試しいただけます）");
|
||||
i18n_messages.set("btn_portal", lang_map);
|
||||
|
||||
lang_map = new Map();
|
||||
lang_map.set("en-US", "amiPro LLC.");
|
||||
lang_map.set("zh-CN", "amiPro LLC.");
|
||||
lang_map.set("ja", "ａｍｉＰｒｏ合同会社");
|
||||
i18n_messages.set("company_name", lang_map);
|
||||
|
||||
lang_map = new Map();
|
||||
lang_map.set("en-US", "Established March 3, 2023");
|
||||
lang_map.set("zh-CN", "2023年3月3日成立");
|
||||
lang_map.set("ja", "2023年3月3日設立");
|
||||
i18n_messages.set("company_open", lang_map);
|
||||
|
||||
lang_map = new Map();
|
||||
lang_map.set("en-US", "2F Kuwano Building, 6-23-4 Jingumae, Shibuya-ku, Tokyo 150-0001");
|
||||
lang_map.set("zh-CN", "东京都涩谷区神宫前6-23-4桑野大厦2F 邮编 150-0001");
|
||||
lang_map.set("ja", "〒１５０-０００１ 東京都渋谷区神宮前六丁目２３番４号 桑野ビル２階");
|
||||
i18n_messages.set("company_addr", lang_map);
|
||||
|
||||
lang_map = new Map();
|
||||
lang_map.set("en-US", "More details");
|
||||
lang_map.set("zh-CN", "更多详情");
|
||||
lang_map.set("ja", "詳細");
|
||||
i18n_messages.set("label_open_passkey", lang_map);
|
||||
|
||||
i18n_messages.set("top_msg", lang_map);
|
||||
lang_map = new Map();
|
||||
lang_map.set("en-US", "FIDO2: From $18.82 billion in 2024 to $60.34 billion in 2032");
|
||||
lang_map.set("zh-CN", "FIDO2：从 2024 年的 188.2 亿美元增至 2032 年的 603.4 亿美元");
|
||||
lang_map.set("ja", "FIDO2: 2024年の188.2億米ドルから2032年には603.4億米ドルへ");
|
||||
i18n_messages.set("top_msg", lang_map);
|
||||
|
||||
|
||||
window.onload = async function() {
|
||||
setI18NText(i18n_messages)
|
||||
initRevealAnimations()
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<!-- Layout wrapper -->
|
||||
<div class="layout-wrapper layout-content-navbar">
|
||||
<div class="layout-container">
|
||||
<!-- Layout container -->
|
||||
<div class="layout-page">
|
||||
<!-- Navbar -->
|
||||
|
||||
<nav
|
||||
class="layout-navbar container-xxl navbar navbar-expand-xl navbar-detached align-items-center bg-navbar-theme"
|
||||
id="layout-navbar"
|
||||
>
|
||||
|
||||
|
||||
<div class="navbar-nav-right d-flex align-items-center" id="navbar-collapse">
|
||||
<div class="navbar-nav align-items-center">
|
||||
<div class="nav-item d-flex align-items-center">
|
||||
<img src="files/favicon.ico" alt="amiPro" width="80%">
|
||||
<span id="label_welcome" style="padding-left: 60px;white-space: nowrap; font-size: x-large; color: #000000;" class="d-none d-lg-block"></span>
|
||||
</div>
|
||||
</div>
|
||||
<a href="https://portal.amipro.me" target="_blank" style="width: 100%; text-align: right;">
|
||||
<i class="bx bx-link bx-sm"></i>
|
||||
<span id="label_portal"> Portal</span>
|
||||
</a>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<!-- / Navbar -->
|
||||
|
||||
<!-- Content wrapper -->
|
||||
<div class="content-wrapper">
|
||||
<!-- Content -->
|
||||
<section class="hero reveal">
|
||||
<div class="hero__text" data-animate>
|
||||
<span class="hero__eyebrow">Passkey cloud platform</span>
|
||||
<div class="ticker" style="margin: 1rem 0;">
|
||||
<span class="ticker__dot"></span>
|
||||
<span id="top_msg">Top message</span>
|
||||
</div>
|
||||
<h1 class="hero__title">FIDO2 journeys people want to finish</h1>
|
||||
<p class="hero__lead">
|
||||
Launch delightful, phishing-proof login experiences with a fully managed Passkey
|
||||
backbone, open-source core, and SDKs that drop into any stack in minutes.
|
||||
</p>
|
||||
<div class="hero__chips">
|
||||
<span class="hero-chip">FIDO2 certified</span>
|
||||
<span class="hero-chip">Open source server + SDK</span>
|
||||
<span class="hero-chip">Device recovery flows</span>
|
||||
</div>
|
||||
<div class="hero__stats" style="margin-top: 2rem;">
|
||||
<div class="stat-card">
|
||||
<strong>100%</strong>
|
||||
<span>FIDO certified</span>
|
||||
</div>
|
||||
<div class="stat-card">
|
||||
<strong>60%</strong>
|
||||
<span>Faster onboarding</span>
|
||||
</div>
|
||||
<div class="stat-card">
|
||||
<strong>75%</strong>
|
||||
<span>Support cost cut</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="hero__media" data-animate>
|
||||
<div class="hero__orb"></div>
|
||||
<div class="hero__device">
|
||||
<h4>Passkey Ready</h4>
|
||||
<p>
|
||||
Secure, phishing-resistant, privacy-first verification that works on every device.
|
||||
</p>
|
||||
<div class="hero__chips" style="margin-top: 1.5rem;">
|
||||
<span class="hero-chip">Face / Touch</span>
|
||||
<span class="hero-chip">Security keys</span>
|
||||
<span class="hero-chip">Recovery links</span>
|
||||
</div>
|
||||
<div style="margin-top: 1.5rem; display: flex; gap: 0.8rem; flex-wrap: wrap;">
|
||||
<a href="https://portal.amipro.me" target="_blank" class="btn btn-primary" id="btn_portal" style="flex: 1 0 160px;">Portal</a>
|
||||
<a href="mailto:sales@amipro.me?subject=contact" class="btn btn-outline-info" id="title_contact_cta" style="flex: 1 0 160px;">Contact</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<div class="row row-cols-1 row-cols-md-3 g-4 mb-5" style="margin: 12px;">
|
||||
<div class="col" data-animate>
|
||||
<div class="card h-100 glow-card">
|
||||
<img class="card-img-top" src="files/passkeys.jpg" alt="Passkeys">
|
||||
<div class="card-body">
|
||||
<h5 class="card-title" id="title_what_passkey">What's Passkey</h5>
|
||||
<p class="card-text" id="info_what_passkey">
|
||||
What is Passkey
|
||||
</p><br>
|
||||
<a href="passkey.html" target="_blank" class="btn btn-primary" id="label_open_passkey">About Passkey</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col" data-animate>
|
||||
<div class="card h-100 glow-card">
|
||||
<img class="card-img-top" src="files/growup.jpg" alt="Growup">
|
||||
<div class="card-body">
|
||||
<h5 class="card-title" id="title_passkey_merits">Passkey's merits</h5>
|
||||
<p class="card-text" id="info_passkey_merits">
|
||||
Passkey's merits
|
||||
</p><br>
|
||||
<a href="merits.html" target="_blank" class="btn btn-primary" id="label_merits">Merits</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col" data-animate>
|
||||
<div class="card h-100 glow-card">
|
||||
<img class="card-img-top" src="files/fido.jpg" alt="amiPro Strength: fido">
|
||||
<div class="card-body">
|
||||
<h5 class="card-title" id="title_amipro_fido">amiPro FIDO</h5>
|
||||
<p class="card-text" id="info_amipro_fido">
|
||||
amiPro FIDO
|
||||
</p><br>
|
||||
<a href="files/FIDO-Conformance-Tools-v1.7.27.1.mp4" target="_blank" class="btn btn-primary" id="label_fido_video">FIDO Video</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col" data-animate>
|
||||
<div class="card h-100 glow-card">
|
||||
<img class="card-img-top" src="files/opensrc.jpg" alt="Open source">
|
||||
<div class="card-body">
|
||||
<h5 class="card-title" id="title_open_src">Open src</h5>
|
||||
<p class="card-text" id="info_open_src">
|
||||
Open src
|
||||
</p><br>
|
||||
<a href="https://github.com/dqj1998/fido2-node" target="_blank" class="btn btn-primary" id="label_open_src">Open src</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col" data-animate>
|
||||
<div class="card h-100 glow-card">
|
||||
<img class="card-img-top" src="files/build.jpg" alt="how to">
|
||||
<div class="card-body">
|
||||
<h5 class="card-title" id="title_howto">How to</h5>
|
||||
<p class="card-text" id="info_howto">
|
||||
How to
|
||||
</p><br>
|
||||
<a href="integration.html" target="_blank" class="btn btn-primary" id="label_integration">integration</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col" data-animate>
|
||||
<div class="card h-100 glow-card">
|
||||
<img class="card-img-top" src="files/howmuch.jpg" alt="How much">
|
||||
<div class="card-body">
|
||||
<h5 class="card-title" id="title_howmuch">How much</h5>
|
||||
<p class="card-text" id="info_howmuch">
|
||||
how much
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="info-panels" style="margin: 3rem 12px;">
|
||||
<article class="info-panel" data-animate>
|
||||
<strong>Instant integration</strong>
|
||||
<p style="margin-top: 0.5rem;">
|
||||
Add FIDO2 login with a few lines of JavaScript. No backend rewrites or new auth servers required.
|
||||
</p>
|
||||
</article>
|
||||
<article class="info-panel" data-animate>
|
||||
<strong>Device lifecycle</strong>
|
||||
<p style="margin-top: 0.5rem;">
|
||||
Allow users to add, revoke, or recover devices with guided flows powered by amiPro APIs.
|
||||
</p>
|
||||
</article>
|
||||
<article class="info-panel" data-animate>
|
||||
<strong>Operational visibility</strong>
|
||||
<p style="margin-top: 0.5rem;">
|
||||
Get analytics on adoption, fraud attempts, and top devices directly from the management portal.
|
||||
</p>
|
||||
</article>
|
||||
</div>
|
||||
|
||||
<div class="cta-banner" data-animate>
|
||||
<div>
|
||||
<h4>Ready to launch your Passkey experience?</h4>
|
||||
<p style="margin: 0; color: var(--text-muted);">Spin up the portal, invite your team, and go live in days.</p>
|
||||
</div>
|
||||
<div style="display: flex; gap: 0.8rem;">
|
||||
<a href="https://portal.amipro.me" target="_blank" class="btn btn-primary">Open portal</a>
|
||||
<a href="integration.html" class="btn btn-outline-info">See integration guide</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<table class="table-modern" style="margin-top: 3rem;">
|
||||
<tbody>
|
||||
<tr>
|
||||
<th scope="row">Company</th>
|
||||
<td id="company_name">ａｍｉＰｒｏ合同会社</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">Founded</th>
|
||||
<td id="company_open">2023年3月3日設立</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">Address</th>
|
||||
<td id="company_addr">〒１５０-０００１ 東京都渋谷区神宮前六丁目２３番４号 桑野ビル２階</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<br>
|
||||
<!-- / Content -->
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="content-footer footer bg-footer-theme">
|
||||
<div class="container-xxl d-flex flex-wrap justify-content-between py-2 flex-md-row flex-column">
|
||||
<div class="mb-2 mb-md-0">
|
||||
©
|
||||
<script>
|
||||
document.write(new Date().getFullYear());
|
||||
</script>
|
||||
<a href="https://www.amipro.me" target="_blank" class="footer-link fw-bolder">amiPro</a>
|
||||
</div>
|
||||
<div>
|
||||
|
||||
<a
|
||||
href="mailto:sales@amipro.me?subject=contact"
|
||||
|
||||
class="footer-link me-4"
|
||||
id="title_contact"
|
||||
>Contact</a>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
<!-- / Footer -->
|
||||
|
||||
<div class="content-backdrop fade"></div>
|
||||
</div>
|
||||
<!-- Content wrapper -->
|
||||
</div>
|
||||
<!-- / Layout page -->
|
||||
</div>
|
||||
|
||||
<!-- Overlay -->
|
||||
<div class="layout-overlay layout-menu-toggle"></div>
|
||||
</div>
|
||||
<!-- / Layout wrapper -->
|
||||
|
||||
<!-- Page JS -->
|
||||
|
||||
<!-- Place this tag in your head or just before your close body tag. -->
|
||||
<script async defer src="https://buttons.github.io/buttons.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -34,3 +34,28 @@ function getI18NText(i18n_map, key){
|
||||
|
||||
return msg
|
||||
}
|
||||
|
||||
function initRevealAnimations(){
|
||||
const animated = document.querySelectorAll('.reveal, [data-animate]');
|
||||
if(!animated || animated.length === 0){
|
||||
return;
|
||||
}
|
||||
if(!('IntersectionObserver' in globalThis)){
|
||||
for (const el of animated) {
|
||||
el.classList.add('is-visible');
|
||||
}
|
||||
return;
|
||||
}
|
||||
const observer = new IntersectionObserver(function(entries){
|
||||
for (const entry of entries) {
|
||||
if(entry.isIntersecting){
|
||||
entry.target.classList.add('is-visible');
|
||||
observer.unobserve(entry.target);
|
||||
}
|
||||
}
|
||||
}, {threshold: 0.18});
|
||||
for (const el of animated) {
|
||||
el.classList.add('reveal');
|
||||
observer.observe(el);
|
||||
}
|
||||
}
|
||||
|
||||
402
files/modern.css
Normal file
402
files/modern.css
Normal file
@@ -0,0 +1,402 @@
|
||||
:root {
|
||||
--bg-deep: #040b1f;
|
||||
--bg-panel: rgba(9, 18, 46, 0.9);
|
||||
--bg-panel-light: rgba(14, 27, 71, 0.85);
|
||||
--brand-primary: #7b5bff;
|
||||
--brand-secondary: #22d3ee;
|
||||
--brand-tertiary: #f472b6;
|
||||
--text-muted: #9caecf;
|
||||
--text-bright: #f8fbff;
|
||||
--border-soft: rgba(255, 255, 255, 0.12);
|
||||
--shadow-soft: 0 20px 45px rgba(15, 23, 42, 0.4);
|
||||
}
|
||||
|
||||
body {
|
||||
background: radial-gradient(circle at top, #0f172a, var(--bg-deep));
|
||||
color: var(--text-bright);
|
||||
}
|
||||
|
||||
.layout-navbar,
|
||||
.footer,
|
||||
.card,
|
||||
.accordion-button,
|
||||
.accordion-body,
|
||||
.table,
|
||||
.cta-banner,
|
||||
.timeline-step,
|
||||
.hero,
|
||||
.info-panel,
|
||||
.video-frame {
|
||||
backdrop-filter: blur(16px);
|
||||
-webkit-backdrop-filter: blur(16px);
|
||||
}
|
||||
|
||||
.layout-navbar,
|
||||
.footer,
|
||||
.cta-banner {
|
||||
background: var(--bg-panel);
|
||||
border: 1px solid var(--border-soft);
|
||||
border-radius: 18px;
|
||||
margin: 16px;
|
||||
padding: 12px 24px;
|
||||
}
|
||||
|
||||
.hero {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
|
||||
gap: 2.5rem;
|
||||
padding: 3rem clamp(1rem, 5vw, 4rem);
|
||||
background: linear-gradient(135deg, rgba(123, 91, 255, 0.35), rgba(34, 211, 238, 0.2));
|
||||
border-radius: 32px;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.hero::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
background: radial-gradient(circle at 20% 20%, rgba(244, 114, 182, 0.3), transparent 55%);
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.hero__eyebrow {
|
||||
font-size: 0.9rem;
|
||||
letter-spacing: 0.2em;
|
||||
text-transform: uppercase;
|
||||
color: var(--brand-secondary);
|
||||
}
|
||||
|
||||
.hero__title {
|
||||
font-size: clamp(2.2rem, 4vw, 3.5rem);
|
||||
font-weight: 700;
|
||||
color: var(--text-bright);
|
||||
}
|
||||
|
||||
.hero__lead {
|
||||
font-size: 1.1rem;
|
||||
line-height: 1.7;
|
||||
color: var(--text-muted);
|
||||
margin-bottom: 1.8rem;
|
||||
}
|
||||
|
||||
.hero__stats {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
|
||||
gap: 1rem;
|
||||
}
|
||||
|
||||
.stat-card {
|
||||
padding: 1rem 1.2rem;
|
||||
border-radius: 18px;
|
||||
background: rgba(4, 11, 31, 0.7);
|
||||
border: 1px solid var(--border-soft);
|
||||
box-shadow: var(--shadow-soft);
|
||||
}
|
||||
|
||||
.stat-card strong {
|
||||
font-size: 1.8rem;
|
||||
color: var(--brand-secondary);
|
||||
display: block;
|
||||
}
|
||||
|
||||
.hero__media {
|
||||
position: relative;
|
||||
display: grid;
|
||||
place-items: center;
|
||||
}
|
||||
|
||||
.hero__orb,
|
||||
.hero__orb::after {
|
||||
position: absolute;
|
||||
border-radius: 50%;
|
||||
animation: float 8s ease-in-out infinite;
|
||||
}
|
||||
|
||||
.hero__orb {
|
||||
width: 220px;
|
||||
height: 220px;
|
||||
background: radial-gradient(circle, rgba(34, 211, 238, 0.5), transparent 70%);
|
||||
filter: blur(2px);
|
||||
}
|
||||
|
||||
.hero__orb::after {
|
||||
content: "";
|
||||
inset: 25px;
|
||||
background: radial-gradient(circle, rgba(244, 114, 182, 0.6), transparent 60%);
|
||||
}
|
||||
|
||||
.hero__device {
|
||||
width: min(320px, 80%);
|
||||
border-radius: 28px;
|
||||
border: 1px solid rgba(255, 255, 255, 0.2);
|
||||
padding: 1.5rem;
|
||||
background: rgba(3, 7, 18, 0.85);
|
||||
box-shadow: var(--shadow-soft);
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.hero__device h4 {
|
||||
font-size: 1rem;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.2em;
|
||||
color: var(--brand-secondary);
|
||||
}
|
||||
|
||||
.hero__device p {
|
||||
margin: 0.8rem 0 0;
|
||||
color: var(--text-muted);
|
||||
}
|
||||
|
||||
.hero__device img {
|
||||
width: 100%;
|
||||
border-radius: inherit;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.hero__chips {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 0.5rem;
|
||||
margin-top: 1.2rem;
|
||||
}
|
||||
|
||||
.hero-chip {
|
||||
padding: 0.35rem 0.9rem;
|
||||
border-radius: 999px;
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
font-size: 0.85rem;
|
||||
}
|
||||
|
||||
.card.glow-card {
|
||||
background: var(--bg-panel-light);
|
||||
border-radius: 24px;
|
||||
border: 1px solid rgba(255, 255, 255, 0.08);
|
||||
box-shadow: var(--shadow-soft);
|
||||
overflow: hidden;
|
||||
transition: transform 0.4s ease, border-color 0.4s ease;
|
||||
}
|
||||
|
||||
.card.glow-card:hover {
|
||||
transform: translateY(-8px) scale(1.01);
|
||||
border-color: rgba(123, 91, 255, 0.4);
|
||||
}
|
||||
|
||||
.card.glow-card img {
|
||||
height: 200px;
|
||||
object-fit: cover;
|
||||
filter: saturate(1.1);
|
||||
}
|
||||
|
||||
.card.glow-card .btn {
|
||||
border-radius: 999px;
|
||||
padding-inline: 1.5rem;
|
||||
}
|
||||
|
||||
.ticker {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 0.6rem;
|
||||
padding: 0.5rem 1.2rem;
|
||||
border-radius: 999px;
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
background: rgba(4, 11, 31, 0.7);
|
||||
color: var(--brand-secondary);
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.ticker__dot {
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
background: var(--brand-tertiary);
|
||||
border-radius: 50%;
|
||||
box-shadow: 0 0 12px var(--brand-tertiary);
|
||||
}
|
||||
|
||||
.ticker span {
|
||||
display: inline-flex;
|
||||
gap: 0.25rem;
|
||||
animation: slide-horizontal 12s linear infinite;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.stats-grid,
|
||||
.info-panels,
|
||||
.timeline,
|
||||
.showcase-grid {
|
||||
margin-top: 3rem;
|
||||
}
|
||||
|
||||
.info-panels {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
|
||||
gap: 1.5rem;
|
||||
}
|
||||
|
||||
.info-panel {
|
||||
padding: 1.5rem;
|
||||
border-radius: 20px;
|
||||
border: 1px solid var(--border-soft);
|
||||
background: linear-gradient(180deg, rgba(11, 19, 45, 0.9), rgba(4, 7, 18, 0.9));
|
||||
box-shadow: var(--shadow-soft);
|
||||
transition: border 0.3s ease;
|
||||
}
|
||||
|
||||
.info-panel:hover {
|
||||
border-color: rgba(34, 211, 238, 0.5);
|
||||
}
|
||||
|
||||
.info-panel strong {
|
||||
font-size: 1.1rem;
|
||||
color: var(--text-bright);
|
||||
}
|
||||
|
||||
.timeline {
|
||||
position: relative;
|
||||
display: grid;
|
||||
gap: 1.8rem;
|
||||
}
|
||||
|
||||
.timeline::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
inset: 0 auto;
|
||||
left: 18px;
|
||||
width: 2px;
|
||||
background: linear-gradient(var(--brand-secondary), var(--brand-tertiary));
|
||||
}
|
||||
|
||||
.timeline-step {
|
||||
margin-left: 2.5rem;
|
||||
padding: 1.2rem 1.5rem 1.2rem 2rem;
|
||||
border-radius: 22px;
|
||||
border: 1px solid var(--border-soft);
|
||||
background: rgba(3, 7, 18, 0.85);
|
||||
box-shadow: var(--shadow-soft);
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.timeline-step::before {
|
||||
content: attr(data-step);
|
||||
position: absolute;
|
||||
left: -46px;
|
||||
top: 18px;
|
||||
width: 56px;
|
||||
height: 56px;
|
||||
border-radius: 16px;
|
||||
background: linear-gradient(135deg, var(--brand-secondary), var(--brand-primary));
|
||||
color: #041026;
|
||||
font-weight: 700;
|
||||
display: grid;
|
||||
place-items: center;
|
||||
box-shadow: var(--shadow-soft);
|
||||
}
|
||||
|
||||
.timeline-step h4 {
|
||||
margin: 0 0 0.5rem;
|
||||
color: var(--text-bright);
|
||||
}
|
||||
|
||||
.timeline-step p {
|
||||
margin: 0;
|
||||
color: var(--text-muted);
|
||||
}
|
||||
|
||||
.cta-banner {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
gap: 1rem;
|
||||
background: linear-gradient(120deg, rgba(123, 91, 255, 0.4), rgba(34, 211, 238, 0.3));
|
||||
}
|
||||
|
||||
.cta-banner h4 {
|
||||
margin: 0;
|
||||
color: var(--text-bright);
|
||||
}
|
||||
|
||||
.cta-banner .btn {
|
||||
border-radius: 999px;
|
||||
padding-inline: 2rem;
|
||||
}
|
||||
|
||||
.video-frame {
|
||||
border-radius: 28px;
|
||||
border: 1px solid rgba(255, 255, 255, 0.12);
|
||||
background: rgba(0, 0, 0, 0.35);
|
||||
box-shadow: var(--shadow-soft);
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.video-frame video,
|
||||
.video-frame img {
|
||||
border-radius: inherit;
|
||||
}
|
||||
|
||||
.reveal {
|
||||
opacity: 0;
|
||||
transform: translateY(24px);
|
||||
transition: opacity 0.8s ease, transform 0.8s ease;
|
||||
}
|
||||
|
||||
.reveal.is-visible {
|
||||
opacity: 1;
|
||||
transform: translateY(0);
|
||||
}
|
||||
|
||||
.table-modern {
|
||||
width: 100%;
|
||||
border-spacing: 0;
|
||||
border-collapse: separate;
|
||||
border: 1px solid var(--border-soft);
|
||||
border-radius: 18px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.table-modern td {
|
||||
padding: 0.75rem 1rem;
|
||||
background: rgba(4, 11, 31, 0.75);
|
||||
}
|
||||
|
||||
@keyframes float {
|
||||
0%,
|
||||
100% {
|
||||
transform: translateY(0px);
|
||||
}
|
||||
50% {
|
||||
transform: translateY(-12px);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes slide-horizontal {
|
||||
0% {
|
||||
transform: translateX(0);
|
||||
}
|
||||
100% {
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.layout-navbar,
|
||||
.footer {
|
||||
margin: 12px;
|
||||
}
|
||||
|
||||
.timeline::before {
|
||||
left: 10px;
|
||||
}
|
||||
|
||||
.timeline-step {
|
||||
margin-left: 1.5rem;
|
||||
padding-left: 1.5rem;
|
||||
}
|
||||
|
||||
.timeline-step::before {
|
||||
left: -38px;
|
||||
}
|
||||
}
|
||||
7
files/passkey-demo-desc.vtt
Normal file
7
files/passkey-demo-desc.vtt
Normal file
@@ -0,0 +1,7 @@
|
||||
WEBVTT
|
||||
|
||||
00:00.000 --> 00:04.000
|
||||
Screen recording of the amiPro portal dashboard fading in.
|
||||
|
||||
00:04.000 --> 00:09.000
|
||||
Close-up of a confirmation modal as biometrics complete and the home view appears.
|
||||
7
files/passkey-demo.vtt
Normal file
7
files/passkey-demo.vtt
Normal file
@@ -0,0 +1,7 @@
|
||||
WEBVTT
|
||||
|
||||
00:00.000 --> 00:04.000
|
||||
amiPro sample site shows passwordless login flow.
|
||||
|
||||
00:04.000 --> 00:09.000
|
||||
User taps Passkey button, completes Face/Touch ID, and enters securely.
|
||||
549
index.html
549
index.html
@@ -1,34 +1,28 @@
|
||||
<!DOCTYPE html>
|
||||
|
||||
<html
|
||||
lang="en-US"
|
||||
class="light-style"
|
||||
>
|
||||
<html lang="en-US" class="light-style">
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta
|
||||
name="viewport"
|
||||
content="width=device-width, initial-scale=1.0, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0"
|
||||
/>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
|
||||
<title>amiPro, LLC</title>
|
||||
|
||||
<!-- Google tag (gtag.js) -->
|
||||
<script async src="https://www.googletagmanager.com/gtag/js?id=G-850DCHX9EJ"></script>
|
||||
<script>
|
||||
window.dataLayer = window.dataLayer || [];
|
||||
function gtag(){dataLayer.push(arguments);}
|
||||
globalThis.dataLayer = globalThis.dataLayer || [];
|
||||
function gtag() {
|
||||
dataLayer.push(arguments);
|
||||
}
|
||||
gtag('js', new Date());
|
||||
|
||||
gtag('config', 'G-850DCHX9EJ');
|
||||
</script>
|
||||
|
||||
<title> Home - amiPro </title>
|
||||
<meta
|
||||
name="description"
|
||||
content="amiPro, LLC builds trustworthy passkey infrastructure and privacy-first AI tooling."
|
||||
/>
|
||||
|
||||
<meta name="description" content="最も簡単に統合できるパスキー・クラウド・サービス; the easiest to integrate Passkey cloud service; Cloud services of FIDO2 and WebAuthN" />
|
||||
|
||||
<!-- Favicon -->
|
||||
<link rel="icon" type="image/x-icon" href="files/favicon.ico" />
|
||||
|
||||
<!-- Fonts -->
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||
<link
|
||||
@@ -36,340 +30,247 @@
|
||||
rel="stylesheet"
|
||||
/>
|
||||
|
||||
<!-- Icons. Uncomment required icon fonts -->
|
||||
<link rel="stylesheet" href="files/boxicons.css?v=20230405" />
|
||||
|
||||
<!-- Core CSS -->
|
||||
<link rel="stylesheet" href="files/core.css" class="template-customizer-core-css" />
|
||||
<link rel="stylesheet" href="files/theme-default.css" class="template-customizer-theme-css" />
|
||||
<link rel="stylesheet" href="files/demo.css" />
|
||||
|
||||
<!-- Vendors CSS -->
|
||||
<link rel="stylesheet" href="files/modern.css" />
|
||||
<link rel="stylesheet" href="files/perfect-scrollbar.css" />
|
||||
|
||||
<!-- Page CSS -->
|
||||
|
||||
<!-- Helpers -->
|
||||
<script src="files/helpers.js"></script>
|
||||
|
||||
<!--! Template customizer & Theme config files MUST be included after core stylesheets and helpers.js in the <head> section -->
|
||||
<!--? Config: Mandatory theme config file contain global vars & default theme options, Set your preferred theme option in this file. -->
|
||||
<script src="files/config.js"></script>
|
||||
|
||||
<script src="files/jquery.js"></script>
|
||||
<script src="files/popper.js"></script>
|
||||
<script src="files/bootstrap.js"></script>
|
||||
<script src="files/perfect-scrollbar.js"></script>
|
||||
<script src="files/menu.js"></script>
|
||||
<script src="files/main.js"></script>
|
||||
|
||||
<script src="files/ua-parser.js"></script>
|
||||
|
||||
<script src="files/amipro_utils.js?v=20230401402"></script>
|
||||
|
||||
<style>
|
||||
body {
|
||||
color: #0f172a;
|
||||
background: linear-gradient(180deg, #f8fbff 0%, #ffffff 40%, #f5f7fb 100%);
|
||||
}
|
||||
|
||||
.hero__title {
|
||||
font-size: clamp(2.25rem, 4vw, 3.5rem);
|
||||
}
|
||||
|
||||
.hero__lead {
|
||||
max-width: 560px;
|
||||
color: #475569;
|
||||
}
|
||||
|
||||
.nav-brand-logo {
|
||||
height: 48px;
|
||||
width: auto;
|
||||
}
|
||||
|
||||
.product-card {
|
||||
border: none;
|
||||
border-radius: 1.25rem;
|
||||
box-shadow: 0 20px 55px rgba(15, 23, 42, 0.08);
|
||||
transition: transform 200ms ease, box-shadow 200ms ease;
|
||||
}
|
||||
|
||||
.product-card:hover {
|
||||
transform: translateY(-6px);
|
||||
box-shadow: 0 30px 60px rgba(15, 23, 42, 0.16);
|
||||
}
|
||||
|
||||
.product-card i {
|
||||
font-size: 1.75rem;
|
||||
color: #2563eb;
|
||||
}
|
||||
|
||||
.values-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
|
||||
gap: 1rem;
|
||||
}
|
||||
|
||||
.value-pill {
|
||||
border-radius: 1rem;
|
||||
padding: 1rem 1.25rem;
|
||||
background: #eff6ff;
|
||||
border: 1px solid rgba(37, 99, 235, 0.2);
|
||||
color: #1d4ed8;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.hero__device {
|
||||
color: #e2e8ff;
|
||||
}
|
||||
|
||||
.hero__device p {
|
||||
color: #cbd8ff;
|
||||
}
|
||||
|
||||
.hero__device li {
|
||||
color: #f1f5ff;
|
||||
}
|
||||
|
||||
@media (max-width: 767px) {
|
||||
.hero__chips {
|
||||
justify-content: flex-start;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
|
||||
var user_id, reg_session_id;
|
||||
|
||||
const i18n_messages = new Map();
|
||||
|
||||
var lang_map = new Map();
|
||||
lang_map.set("en-US", "amiPro - The easiest to integrate and manage Passkey cloud service");
|
||||
lang_map.set("zh-CN", "amiPro - 最易集成、易管理的 Passkey 云服务");
|
||||
lang_map.set("ja", "amiPro - 最も簡単に統合・管理できるパスキー・クラウド・サービス");
|
||||
i18n_messages.set("label_welcome", lang_map);
|
||||
|
||||
lang_map = new Map();
|
||||
lang_map.set("en-US", "Management Portal");
|
||||
lang_map.set("zh-CN", "管理门户");
|
||||
lang_map.set("ja", "管理ポータル");
|
||||
i18n_messages.set("label_portal", lang_map);
|
||||
|
||||
lang_map = new Map();
|
||||
lang_map.set("en-US", "Contact us (sales@amipro.me)");
|
||||
lang_map.set("zh-CN", "联系我们（sales@amipro.me）");
|
||||
lang_map.set("ja", "お問い合わせ（sales@amipro.me）");
|
||||
i18n_messages.set("title_contact", lang_map);
|
||||
|
||||
lang_map = new Map();
|
||||
lang_map.set("en-US", "What is Passkey");
|
||||
lang_map.set("zh-CN", "什么是Passkey");
|
||||
lang_map.set("ja", "パスキー(Passkey)とは");
|
||||
i18n_messages.set("title_what_passkey", lang_map);
|
||||
|
||||
lang_map = new Map();
|
||||
lang_map.set("en-US", "Passkeys replace passwords and provide faster, more accessible, and more secure website sign‑ins. Unlike passwords, passkeys are phishing‑resistant and more reliable. With support from major companies including Apple, Google, and NTT, 2023 marked the beginning of passkeys entering the consumer market.");
|
||||
lang_map.set("zh-CN", "Passkey 取代密码，提供更快、更易用且更安全的网站登录。与密码不同，Passkey 稳定可靠并且可抵御网络钓鱼。在包括苹果、谷歌、NTT 等大型公司的支持下，2023 年成为 Passkey 进入消费者市场的元年。");
|
||||
lang_map.set("ja", "パスキーはパスワードを置き換え、より高速で、よりアクセスしやすく<br>より安全なウェブサイトのサインインを提供します。パスワードとは異なり、<br>常に堅牢でフィッシングに耐性があります。<br>Apple、Google、NTTなどの大手企業のサポートを受けて、<br>2023年はPasskeyを一般消費者市場に導入する年です。");
|
||||
i18n_messages.set("info_what_passkey", lang_map);
|
||||
|
||||
lang_map = new Map();
|
||||
lang_map.set("en-US", "Passkey benefits");
|
||||
lang_map.set("zh-CN", "Passkey的优势");
|
||||
lang_map.set("ja", "パスキーのメリット");
|
||||
i18n_messages.set("title_passkey_merits", lang_map);
|
||||
|
||||
lang_map = new Map();
|
||||
lang_map.set("en-US", "Passkeys not only provide a more secure login method; they can also increase your website’s business value:<br>1. Faster sign‑in can <b>improve</b> conversion rates<br>2. No password resets can <b>reduce</b> support costs");
|
||||
lang_map.set("zh-CN", "Passkey 不仅提供更安全的登录方式，也能提升您网站的商业价值：<br>1、更快速的登录可<b>提高</b>转化率<br>2、无需找回密码可<b>降低</b>客服成本");
|
||||
lang_map.set("ja", "パスキーは安全なログイン方法を提供するだけでなく、<br>Webサイトのビジネス価値の向上にもつながります。<br>1. より高速なログインはコンバージョン率の<b>向上</b>に寄与<br>2. パスワード再設定が不要なためサポートコストの<b>削減</b>につながります。");
|
||||
i18n_messages.set("info_passkey_merits", lang_map);
|
||||
|
||||
lang_map = new Map();
|
||||
lang_map.set("en-US", "Merits");
|
||||
lang_map.set("zh-CN", "优势");
|
||||
lang_map.set("ja", "メリット");
|
||||
i18n_messages.set("label_merits", lang_map);
|
||||
|
||||
lang_map = new Map();
|
||||
lang_map.set("en-US", "Why amiPro: Standards compliance");
|
||||
lang_map.set("zh-CN", "amiPro 的优势：标准合规");
|
||||
lang_map.set("ja", "amiProの強み：規格準拠");
|
||||
i18n_messages.set("title_amipro_fido", lang_map);
|
||||
|
||||
lang_map = new Map();
|
||||
lang_map.set("en-US", "amiPro is designed based on the FIDO standard and has passed the FIDO2 conformance test 100%.<br>From the browser to the SDK, everything aligns with the latest FIDO2 standard, making it safer and easier to maintain.<br>Meanwhile, amiPro provides extended features to enhance security and integration convenience.");
|
||||
lang_map.set("zh-CN", "amiPro基于FIDO标准设计，100%通过FIDO2兼容测试。<br>从浏览器到SDK全部统一至FIDO2最新标准，更安全更易维护。<br>同时提供扩展功能，增强安全性及集成便利性");
|
||||
lang_map.set("ja", "amiProはFIDO規格に基づいて設計され、FIDO2互換性テストを100％パスしています<br>ブラウザから SDK に至るまで、すべてが最新の FIDO2 標準に統一されており、より安全で保守が容易です。<br>同時に、amiProはセキュリティと統合の互換性を高めるための拡張機能を提供します。");
|
||||
i18n_messages.set("info_amipro_fido", lang_map);
|
||||
|
||||
lang_map = new Map();
|
||||
lang_map.set("en-US", "FIDO conformance test");
|
||||
lang_map.set("zh-CN", "FIDO兼容性测试");
|
||||
lang_map.set("ja", "FIDO準拠性テスト");
|
||||
i18n_messages.set("label_fido_video", lang_map);
|
||||
|
||||
lang_map = new Map();
|
||||
lang_map.set("en-US", "Why amiPro: Open source");
|
||||
lang_map.set("zh-CN", "amiPro的优势：开源");
|
||||
lang_map.set("ja", "amiProの強み：オープンソース");
|
||||
i18n_messages.set("title_open_src", lang_map);
|
||||
|
||||
lang_map = new Map();
|
||||
lang_map.set("en-US", "amiPro's core is completely open source, thus providing complete verifiability and security.<br>Not only the FIDO2 server, but also the iOS/Android SDK for App development are completely open source.");
|
||||
lang_map.set("zh-CN", "amiPro的核心完全永久开源，从而提供完全的可验证性和安全性。<br>不仅FIDO2服务器，App开发用iOS/Android SDK也完全开源。");
|
||||
lang_map.set("ja", "amiPro のコアは完全にオープンソースであり、完全な検証性とセキュリティを提供します。<br>FIDO2 サーバーだけでなく、アプリ開発用の iOS / Android SDK も完全にオープンソースです。");
|
||||
i18n_messages.set("info_open_src", lang_map);
|
||||
|
||||
lang_map = new Map();
|
||||
lang_map.set("en-US", "Open source project");
|
||||
lang_map.set("zh-CN", "开源项目");
|
||||
lang_map.set("ja", "オープンソースプロジェクト");
|
||||
i18n_messages.set("label_open_src", lang_map);
|
||||
|
||||
lang_map = new Map();
|
||||
lang_map.set("en-US", "How to integrate");
|
||||
lang_map.set("zh-CN", "集成方法");
|
||||
lang_map.set("ja", "導入方法");
|
||||
i18n_messages.set("title_howto", lang_map);
|
||||
|
||||
lang_map = new Map();
|
||||
lang_map.set("en-US", "amiPro provides standards‑based interfaces and an easy‑to‑use JavaScript SDK for integration. From device registration and sign‑in to device reset management, everything can be implemented easily.<br>No need to modify your server backend—use front‑end JavaScript to integrate.<br>We also provide iOS/Android SDKs for app development.<br>Providing integration support (sales@amipro.me)");
|
||||
lang_map.set("zh-CN", "amiPro 提供基于标准的接口以及便于集成的 JavaScript SDK。从设备注册、登录到设备重置管理，都可以轻松实现。<br>无需修改您的服务器后端，仅使用前端 JavaScript 即可完成集成。<br>同时提供用于 App 开发的 iOS/Android SDK，便于集成。<br>提供导入支持（sales@amipro.me）");
|
||||
lang_map.set("ja", "amiProは、統合のための標準的なインターフェイスと便利なJavaScript SDKを提供します。<br>デバイスの登録、ログインからデバイスのリセット管理まで、すべて簡単に実装できます。<br>サーバーのバックグラウンドを変更する必要はありません、<br>フロントエンド JavaScript を使用するだけで統合を実現できます。<br>同時に、App 開発用の iOS / Android SDK も提供しています。 導入サポートが必要な場合は<br> sales@amipro.me へメールでご連絡ください。");
|
||||
i18n_messages.set("info_howto", lang_map);
|
||||
|
||||
lang_map = new Map();
|
||||
lang_map.set("en-US", "Integration Steps");
|
||||
lang_map.set("zh-CN", "集成步骤");
|
||||
lang_map.set("ja", "導入手順");
|
||||
i18n_messages.set("label_integration", lang_map);
|
||||
|
||||
lang_map = new Map();
|
||||
lang_map.set("en-US", "Cost");
|
||||
lang_map.set("zh-CN", "费用");
|
||||
lang_map.set("ja", "費用");
|
||||
i18n_messages.set("title_howmuch", lang_map);
|
||||
|
||||
lang_map = new Map();
|
||||
lang_map.set("en-US", "amiPro provides the highest cost performance billing model based on the number of <b>active users</b>. Regardless of the number of registered users, you only need to pay for per active user (users who log in at least once a month) per month or per authentication.<br>Provide discount plans for sites with a large number of active users.");
|
||||
lang_map.set("zh-CN", "提供基于<b>活动用户数</b>的最高性价比的计费模式。与注册用户数无关，每月只需为每个活动用户（每月至少登录一次的用户）或者按认证次数支付费用。<br>对活动用户数较大的网站提供优惠方案。");
|
||||
lang_map.set("ja", "<b>アクティブユーザー数</b>に基づいた最高のコストパフォーマンスの課金モデルを提供します。<br>登録ユーザー数に関係なく、毎月アクティブユーザー（毎月最低1回ログインするユーザー）或いは認証利用数ごとのお支払いとなります。<br>割引プランもご用意しております。");
|
||||
i18n_messages.set("info_howmuch", lang_map);
|
||||
|
||||
lang_map = new Map();
|
||||
lang_map.set("en-US", "One month free trial<br>(After free registration of the management portal, all functions are free to try for one month)");
|
||||
lang_map.set("zh-CN", "一个月免费试用<br>（免费注册管理门户后，所有功能免费试用一个月）");
|
||||
lang_map.set("ja", "1ヶ月間の無料トライアル<br>（管理ポータルの無料登録後、すべての機能を1ヶ月間無料でお試しいただけます）");
|
||||
i18n_messages.set("btn_portal", lang_map);
|
||||
|
||||
lang_map = new Map();
|
||||
lang_map.set("en-US", "amiPro LLC.");
|
||||
lang_map.set("zh-CN", "amiPro LLC.");
|
||||
lang_map.set("ja", "ａｍｉＰｒｏ合同会社");
|
||||
i18n_messages.set("company_name", lang_map);
|
||||
|
||||
lang_map = new Map();
|
||||
lang_map.set("en-US", "Established March 3, 2023");
|
||||
lang_map.set("zh-CN", "2023年3月3日成立");
|
||||
lang_map.set("ja", "2023年3月3日設立");
|
||||
i18n_messages.set("company_open", lang_map);
|
||||
|
||||
lang_map = new Map();
|
||||
lang_map.set("en-US", "2F Kuwano Building, 6-23-4 Jingumae, Shibuya-ku, Tokyo 150-0001");
|
||||
lang_map.set("zh-CN", "东京都涩谷区神宫前6-23-4桑野大厦2F 邮编 150-0001");
|
||||
lang_map.set("ja", "〒１５０-０００１ 東京都渋谷区神宮前六丁目２３番４号 桑野ビル２階");
|
||||
i18n_messages.set("company_addr", lang_map);
|
||||
|
||||
lang_map = new Map();
|
||||
lang_map.set("en-US", "More details");
|
||||
lang_map.set("zh-CN", "更多详情");
|
||||
lang_map.set("ja", "詳細");
|
||||
i18n_messages.set("label_open_passkey", lang_map);
|
||||
|
||||
/*lang_map = new Map();
|
||||
lang_map.set("en-US", "* Latest company profile <a href='files/amiProAbout.jpg' target=' _blank'>Flyer</a>");
|
||||
lang_map.set("zh-CN", "* 最新公司简介<a href='files/amiProAbout.jpg' target='_blank'>传单</a>");
|
||||
lang_map.set("ja", "* 最新会社概要<a href='files/amiProAbout.jpg' target='_blank'>チラシ</a>");*/
|
||||
i18n_messages.set("top_msg", lang_map);
|
||||
lang_map = new Map();
|
||||
lang_map.set("en-US", "FIDO2: From $18.82 billion in 2024 to $60.34 billion in 2032");
|
||||
lang_map.set("zh-CN", "FIDO2：从 2024 年的 188.2 亿美元增至 2032 年的 603.4 亿美元");
|
||||
lang_map.set("ja", "FIDO2: 2024年の188.2億米ドルから2032年には603.4億米ドルへ");
|
||||
i18n_messages.set("top_msg", lang_map);
|
||||
|
||||
|
||||
window.onload = async function() {
|
||||
setI18NText(i18n_messages)
|
||||
|
||||
}
|
||||
|
||||
window.onload = function() {
|
||||
if (typeof initRevealAnimations === 'function') {
|
||||
initRevealAnimations();
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<!-- Layout wrapper -->
|
||||
<div class="layout-wrapper layout-content-navbar">
|
||||
<div class="layout-container">
|
||||
<!-- Layout container -->
|
||||
<div class="layout-container">
|
||||
<div class="layout-page">
|
||||
<!-- Navbar -->
|
||||
|
||||
<nav
|
||||
class="layout-navbar container-xxl navbar navbar-expand-xl navbar-detached align-items-center bg-navbar-theme"
|
||||
id="layout-navbar"
|
||||
>
|
||||
|
||||
|
||||
<div class="navbar-nav-right d-flex align-items-center" id="navbar-collapse">
|
||||
<div class="navbar-nav-right d-flex align-items-center w-100" id="navbar-collapse">
|
||||
<div class="navbar-nav align-items-center">
|
||||
<div class="nav-item d-flex align-items-center">
|
||||
<img src="files/favicon.ico" alt="amiPro" width="80%">
|
||||
<span id="label_welcome" style="padding-left: 60px;white-space: nowrap; font-size: x-large; color: #000000;" class="d-none d-lg-block"></span>
|
||||
<img
|
||||
src="files/favicon.ico"
|
||||
alt="amiPro"
|
||||
width="64"
|
||||
height="64"
|
||||
class="nav-brand-logo"
|
||||
style="margin-right: 16px;"
|
||||
/>
|
||||
<div>
|
||||
<div style="font-weight: 700; font-size: 1.25rem; color: #0f172a;">amiPro, LLC</div>
|
||||
<small style="color: #64748b;">Privacy-first identity & AI products</small>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<a href="https://portal.amipro.me" target="_blank" style="width: 100%; text-align: right;">
|
||||
<i class="bx bx-link bx-sm"></i>
|
||||
<span id="label_portal"> Portal</span>
|
||||
</a>
|
||||
<a href="mailto:sales@amipro.me?subject=Contact%20amiPro" class="btn btn-outline-primary ms-auto">Contact sales</a>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<!-- / Navbar -->
|
||||
|
||||
<!-- Dynamic horizontal scrolling prompt information -->
|
||||
<div class="card shadow-none bg-transparent border border-danger" style="text-align: center; margin: 1rem 2rem;">
|
||||
<h5 class="card-title" id="top_msg" style="margin-top: 0.8rem;">Top messgaes</h5>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- Content wrapper -->
|
||||
<div class="content-wrapper">
|
||||
<!-- Content -->
|
||||
|
||||
<div class="row row-cols-1 row-cols-md-3 g-4 mb-5" style="margin: 12px;">
|
||||
<div class="col">
|
||||
<div class="card h-100">
|
||||
<img class="card-img-top" src="files/passkeys.jpg" alt="Passkeys">
|
||||
<div class="card-body">
|
||||
<h5 class="card-title" id="title_what_passkey">What's Passkey</h5>
|
||||
<p class="card-text" id="info_what_passkey">
|
||||
What is Passkey
|
||||
</p><br>
|
||||
<a href="passkey.html" target="_blank" class="btn btn-primary" id="label_open_passkey" style="position: absolute;bottom: 10px;">About Passkey</a>
|
||||
<div class="container-xxl" style="padding: 32px 24px 72px;">
|
||||
<section class="hero reveal">
|
||||
<div class="hero__text" data-animate>
|
||||
<span class="hero__eyebrow">amiPro, LLC</span>
|
||||
<h1 class="hero__title">
|
||||
Secure passkey journeys and privacy tooling for modern teams.
|
||||
</h1>
|
||||
<p class="hero__lead">
|
||||
We build production-ready products that make passwordless authentication effortless and
|
||||
ensure every AI conversation stays under your control.
|
||||
</p>
|
||||
<div class="hero__chips" style="margin-top: 1.5rem;">
|
||||
<span class="hero-chip">FIDO2 certified</span>
|
||||
<span class="hero-chip">Open source core</span>
|
||||
<span class="hero-chip">Local-first privacy</span>
|
||||
</div>
|
||||
<div style="margin-top: 2rem; display: flex; flex-wrap: wrap; gap: 1rem;">
|
||||
<a href="fido2_top.html" class="btn btn-primary" style="flex: 1 0 220px;">Explore Passkey Platform</a>
|
||||
<a href="contextwizard_top.html" class="btn btn-outline-info" style="flex: 1 0 220px;">Discover ContextWizard</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col">
|
||||
<div class="card h-100">
|
||||
<img class="card-img-top" src="files/growup.jpg" alt="Growup">
|
||||
<div class="card-body">
|
||||
<h5 class="card-title" id="title_passkey_merits">Passkey's merits</h5>
|
||||
<p class="card-text" id="info_passkey_merits">
|
||||
Passkey's merits
|
||||
</p><br>
|
||||
<a href="merits.html" target="_blank" class="btn btn-primary" id="label_merits" style="position: absolute;bottom: 10px;">Merits</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col">
|
||||
<div class="card h-100">
|
||||
<img class="card-img-top" src="files/fido.jpg" alt="amiPro Strength: fido">
|
||||
<div class="card-body">
|
||||
<h5 class="card-title" id="title_amipro_fido">amiPro FIDO</h5>
|
||||
<p class="card-text" id="info_amipro_fido">
|
||||
amiPro FIDO
|
||||
</p><br>
|
||||
<a href="files/FIDO-Conformance-Tools-v1.7.27.1.mp4" target="_blank" class="btn btn-primary" id="label_fido_video" style="position: absolute;bottom: 10px;">FIDO Video</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col">
|
||||
<div class="card h-100">
|
||||
<img class="card-img-top" src="files/opensrc.jpg" alt="Open source">
|
||||
<div class="card-body">
|
||||
<h5 class="card-title" id="title_open_src">Open src</h5>
|
||||
<p class="card-text" id="info_open_src">
|
||||
Open src
|
||||
</p><br>
|
||||
<a href="https://github.com/dqj1998/fido2-node" target="_blank" class="btn btn-primary" id="label_open_src" style="position: absolute;bottom: 10px;">Open src</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col">
|
||||
<div class="card h-100">
|
||||
<img class="card-img-top" src="files/build.jpg" alt="how to">
|
||||
<div class="card-body">
|
||||
<h5 class="card-title" id="title_howto">How to</h5>
|
||||
<p class="card-text" id="info_howto">
|
||||
How to
|
||||
</p><br>
|
||||
<a href="integration.html" target="_blank" class="btn btn-primary" id="label_integration" style="position: absolute;bottom: 10px;">integration</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col">
|
||||
<div class="card h-100">
|
||||
<img class="card-img-top" src="files/howmuch.jpg" alt="How much">
|
||||
<div class="card-body">
|
||||
<h5 class="card-title" id="title_howmuch">How much</h5>
|
||||
<p class="card-text" id="info_howmuch">
|
||||
how much
|
||||
<div class="hero__media" data-animate>
|
||||
<div class="hero__orb"></div>
|
||||
<div class="hero__device">
|
||||
<h4>Built in Tokyo · Shipping globally</h4>
|
||||
<p>
|
||||
Founded in 2023, amiPro delivers reliable identity infrastructure, open SDKs, and
|
||||
privacy-first extensions that enterprises can audit and trust.
|
||||
</p>
|
||||
<ul class="list-unstyled" style="margin-top: 1rem; color: #0f172a;">
|
||||
<li><i class="bx bx-check-circle me-1"></i>FIDO2 server + SDKs (open source)</li>
|
||||
<li><i class="bx bx-check-circle me-1"></i>Device lifecycle tooling</li>
|
||||
<li><i class="bx bx-check-circle me-1"></i>Local-first AI knowledge capture</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="reveal" data-animate style="margin-top: 56px;">
|
||||
<h2 style="font-weight: 600; color: #0f172a;">What we build</h2>
|
||||
<p style="color: #475569; max-width: 720px;">
|
||||
Two flagship products solve the hardest trust problems teams face today—passwordless authentication
|
||||
and safe AI adoption.
|
||||
</p>
|
||||
|
||||
<div class="row row-cols-1 row-cols-md-2 g-4" style="margin-top: 1.5rem;">
|
||||
<div class="col">
|
||||
<article class="card product-card h-100">
|
||||
<div class="card-body">
|
||||
<div class="d-flex align-items-center mb-3">
|
||||
<i class="bx bx-shield me-2"></i>
|
||||
<span class="badge bg-label-primary">Enterprise Passkeys</span>
|
||||
</div>
|
||||
<h3 style="font-size: 1.5rem;">amiPro Passkey Cloud</h3>
|
||||
<p>
|
||||
Launch phishing-resistant login backed by our FIDO2-certified cloud, open server, and drop-in SDKs.
|
||||
Manage registration, recovery, and analytics from one portal.
|
||||
</p>
|
||||
<a href="fido2_top.html" class="btn btn-link px-0">Go to Passkey hub →</a>
|
||||
</div>
|
||||
</article>
|
||||
</div>
|
||||
<div class="col">
|
||||
<article class="card product-card h-100">
|
||||
<div class="card-body">
|
||||
<div class="d-flex align-items-center mb-3">
|
||||
<i class="bx bx-archive me-2"></i>
|
||||
<span class="badge bg-label-info">AI Conversation OS</span>
|
||||
</div>
|
||||
<h3 style="font-size: 1.5rem;">ContextWizard</h3>
|
||||
<p>
|
||||
Keep every AI conversation searchable, portable, and private. Automatically capture threads across assistants
|
||||
with encryption that never leaves your machine.
|
||||
</p>
|
||||
<a href="contextwizard_top.html" class="btn btn-link px-0">See ContextWizard →</a>
|
||||
</div>
|
||||
</article>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="reveal" data-animate style="margin-top: 56px;">
|
||||
<div class="row g-4 align-items-center">
|
||||
<div class="col-lg-6">
|
||||
<h2 style="font-weight: 600; color: #0f172a;">Built on verifiable foundations</h2>
|
||||
<p style="color: #475569;">
|
||||
Open standards, published code, and transparent pricing keep vendors accountable. amiPro blends
|
||||
Japanese craftsmanship with global security best practices so you can ship faster without compromising trust.
|
||||
</p>
|
||||
<div class="values-grid" style="margin-top: 1.5rem;">
|
||||
<div class="value-pill">FIDO2 Certified Stack</div>
|
||||
<div class="value-pill">Open Source Core</div>
|
||||
<div class="value-pill">Local-first Privacy</div>
|
||||
<div class="value-pill">Enterprise Support</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-lg-6">
|
||||
<article class="card h-100" style="border-radius: 1.25rem; box-shadow: 0 16px 50px rgba(15, 23, 42, 0.08);">
|
||||
<div class="card-body">
|
||||
<h3 style="font-size: 1.25rem; margin-bottom: 1rem;">Company quick facts</h3>
|
||||
<ul class="list-unstyled" style="color: #0f172a;">
|
||||
<li><strong>Founded:</strong> March 3, 2023</li>
|
||||
<li><strong>Location:</strong> 2F Kuwano Building, 6-23-4 Jingumae, Shibuya-ku, Tokyo 150-0001</li>
|
||||
<li><strong>Focus:</strong> FIDO2 Infrastructure · AI Privacy Tooling</li>
|
||||
<li><strong>Contact:</strong> <a href="mailto:sales@amipro.me">sales@amipro.me</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</article>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
|
||||
<a href="https://portal.amipro.me" target="_blank" class="btn btn-info" id="btn_portal" style="width:50%;margin-left: 25%;">Portal</a>
|
||||
<br><br>
|
||||
|
||||
<table width=100% style="text-align: center;">
|
||||
<tr>
|
||||
<td id="company_name">ａｍｉＰｒｏ合同会社</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td id="company_open">2023年3月3日設立</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td id="company_addr">〒１５０-０００１ 東京都渋谷区神宮前六丁目２３番４号 桑野ビル２階</td>
|
||||
</tr>
|
||||
</table>
|
||||
<br>
|
||||
<!-- / Content -->
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="content-footer footer bg-footer-theme">
|
||||
<div class="container-xxl d-flex flex-wrap justify-content-between py-2 flex-md-row flex-column">
|
||||
<div class="mb-2 mb-md-0">
|
||||
@@ -377,45 +278,21 @@
|
||||
<script>
|
||||
document.write(new Date().getFullYear());
|
||||
</script>
|
||||
<a href="https://www.amipro.me" target="_blank" class="footer-link fw-bolder">amiPro</a>
|
||||
<a href="https://www.amipro.me" target="_blank" class="footer-link fw-bolder">amiPro, LLC</a>
|
||||
</div>
|
||||
<div>
|
||||
|
||||
<a
|
||||
href="mailto:sales@amipro.me?subject=contact"
|
||||
|
||||
class="footer-link me-4"
|
||||
id="title_contact"
|
||||
>Contact</a>
|
||||
<a href="fido2_top.html" class="footer-link me-4">FIDO2 Platform</a>
|
||||
<a href="contextwizard_top.html" class="footer-link">ContextWizard</a>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
<!-- / Footer -->
|
||||
|
||||
<div class="content-backdrop fade"></div>
|
||||
</div>
|
||||
<!-- Content wrapper -->
|
||||
</div>
|
||||
<!-- / Layout page -->
|
||||
</div>
|
||||
|
||||
<!-- Overlay -->
|
||||
<div class="layout-overlay layout-menu-toggle"></div>
|
||||
</div>
|
||||
<!-- / Layout wrapper -->
|
||||
|
||||
<!-- div class="buy-now">
|
||||
<a
|
||||
href="https://themeselection.com/products/sneat-bootstrap-html-admin-template/"
|
||||
target="_blank"
|
||||
class="btn btn-danger btn-buy-now"
|
||||
>Upgrade to Pro</a
|
||||
>
|
||||
</div -->
|
||||
|
||||
<!-- Page JS -->
|
||||
|
||||
<!-- Place this tag in your head or just before your close body tag. -->
|
||||
<script async defer src="https://buttons.github.io/buttons.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
161
integration.html
161
integration.html
@@ -8,7 +8,7 @@
|
||||
<meta charset="utf-8" />
|
||||
<meta
|
||||
name="viewport"
|
||||
content="width=device-width, initial-scale=1.0, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0"
|
||||
content="width=device-width, initial-scale=1.0"
|
||||
/>
|
||||
|
||||
<title> Integration - amiPro </title>
|
||||
@@ -16,7 +16,7 @@
|
||||
<!-- Google tag (gtag.js) -->
|
||||
<script async src="https://www.googletagmanager.com/gtag/js?id=G-850DCHX9EJ"></script>
|
||||
<script>
|
||||
window.dataLayer = window.dataLayer || [];
|
||||
globalThis.dataLayer = globalThis.dataLayer || [];
|
||||
function gtag(){dataLayer.push(arguments);}
|
||||
gtag('js', new Date());
|
||||
|
||||
@@ -43,6 +43,7 @@
|
||||
<link rel="stylesheet" href="files/core.css" class="template-customizer-core-css" />
|
||||
<link rel="stylesheet" href="files/theme-default.css" class="template-customizer-theme-css" />
|
||||
<link rel="stylesheet" href="files/demo.css" />
|
||||
<link rel="stylesheet" href="files/modern.css" />
|
||||
|
||||
<!-- Vendors CSS -->
|
||||
<link rel="stylesheet" href="files/perfect-scrollbar.css" />
|
||||
@@ -91,6 +92,18 @@
|
||||
lang_map.set("ja", "お問い合わせ（sales@amipro.me）");
|
||||
i18n_messages.set("title_contact", lang_map);
|
||||
|
||||
lang_map = new Map();
|
||||
lang_map.set("en-US", "Contact us (sales@amipro.me)");
|
||||
lang_map.set("zh-CN", "联系我们（sales@amipro.me）");
|
||||
lang_map.set("ja", "お問い合わせ（sales@amipro.me）");
|
||||
i18n_messages.set("title_contact_cta", lang_map);
|
||||
|
||||
lang_map = new Map();
|
||||
lang_map.set("en-US", "One month free trial<br>(After free registration of the management portal, all functions are free to try for one month)");
|
||||
lang_map.set("zh-CN", "一个月免费试用<br>（免费注册管理门户后，所有功能免费试用一个月）");
|
||||
lang_map.set("ja", "1ヶ月間の無料トライアル<br>（管理ポータルの無料登録後、すべての機能を1ヶ月間無料でお試しいただけます）");
|
||||
i18n_messages.set("btn_portal", lang_map);
|
||||
|
||||
lang_map = new Map();
|
||||
lang_map.set("en-US", "How to integrate");
|
||||
lang_map.set("zh-CN", "如何集成");
|
||||
@@ -174,6 +187,7 @@
|
||||
|
||||
window.onload = async function() {
|
||||
setI18NText(i18n_messages)
|
||||
initRevealAnimations()
|
||||
}
|
||||
|
||||
</script>
|
||||
@@ -212,87 +226,65 @@
|
||||
<!-- Content wrapper -->
|
||||
<div class="content-wrapper">
|
||||
<!-- Content -->
|
||||
<div style="margin: 20px;">
|
||||
<small class="text-normal fw-semibold" id="label_integartion_title">Integration</small>
|
||||
|
||||
<div class="accordion mt-3">
|
||||
<div class="card accordion-item">
|
||||
<h2 class="accordion-header" id="headingOne">
|
||||
<button id="btn_step1" type="button" class="accordion-button collapsed" data-bs-toggle="collapse" data-bs-target="#accordionOne" aria-expanded="false" aria-controls="accordionOne">
|
||||
Sample site
|
||||
</button>
|
||||
</h2>
|
||||
<section class="hero reveal" style="margin: 24px;">
|
||||
<div class="hero__text" data-animate>
|
||||
<span class="hero__eyebrow" id="label_integartion_title">Integration</span>
|
||||
<h1 class="hero__title">Launch Passkey journeys in six guided steps</h1>
|
||||
<p class="hero__lead">
|
||||
Follow the production-proven playbook: explore the sample site, drop in the JavaScript SDK,
|
||||
fine-tune device management, and configure the amiPro portal for your domains.
|
||||
</p>
|
||||
<div class="hero__chips">
|
||||
<span class="hero-chip">Browser + App SDK</span>
|
||||
<span class="hero-chip">Recovery-ready</span>
|
||||
<span class="hero-chip">Session control</span>
|
||||
</div>
|
||||
<div style="margin-top: 2rem; display: flex; gap: 0.8rem; flex-wrap: wrap;">
|
||||
<a href="https://portal.amipro.me" target="_blank" class="btn btn-primary" id="btn_portal">Portal</a>
|
||||
<a href="mailto:sales@amipro.me?subject=contact" class="btn btn-outline-info" id="title_contact_cta">Contact</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="hero__media" data-animate>
|
||||
<div class="hero__device">
|
||||
<img src="files/build.jpg" alt="Integration">
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<div id="accordionOne" class="accordion-collapse collapse" style="">
|
||||
<div class="accordion-body" id="info_top_step1">
|
||||
Sample site
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card accordion-item">
|
||||
<h2 class="accordion-header" id="headingTwo">
|
||||
<button id="btn_step2" type="button" class="accordion-button collapsed" data-bs-toggle="collapse" data-bs-target="#accordionTwo" aria-expanded="false" aria-controls="accordionTwo">
|
||||
Login integration
|
||||
</button>
|
||||
</h2>
|
||||
<div id="accordionTwo" class="accordion-collapse collapse" aria-labelledby="headingTwo" style="">
|
||||
<div class="accordion-body" id="info_top_step2">
|
||||
Login integration
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card accordion-item">
|
||||
<h2 class="accordion-header" id="headingThree">
|
||||
<button id="btn_step3" type="button" class="accordion-button collapsed" data-bs-toggle="collapse" data-bs-target="#accordionThree" aria-expanded="false" aria-controls="accordionThree">
|
||||
Device mng page
|
||||
</button>
|
||||
</h2>
|
||||
<div id="accordionThree" class="accordion-collapse collapse" aria-labelledby="headingThree" style="">
|
||||
<div class="accordion-body" id="info_top_step3">
|
||||
Device mng page
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card accordion-item">
|
||||
<h2 class="accordion-header" id="heading4">
|
||||
<button id="btn_step4" type="button" class="accordion-button collapsed" data-bs-toggle="collapse" data-bs-target="#accordion4" aria-expanded="false" aria-controls="accordion4">
|
||||
Session mag
|
||||
</button>
|
||||
</h2>
|
||||
<div id="accordion4" class="accordion-collapse collapse" aria-labelledby="heading4" style="">
|
||||
<div class="accordion-body" id="info_top_step4">
|
||||
Session mag
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card accordion-item">
|
||||
<h2 class="accordion-header" id="heading5">
|
||||
<button id="btn_step5" type="button" class="accordion-button collapsed" data-bs-toggle="collapse" data-bs-target="#accordion5" aria-expanded="false" aria-controls="accordion5">
|
||||
Session mag
|
||||
</button>
|
||||
</h2>
|
||||
<div id="accordion5" class="accordion-collapse collapse" aria-labelledby="heading5" style="">
|
||||
<div class="accordion-body" id="info_top_step5">
|
||||
Session mag
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card accordion-item">
|
||||
<h2 class="accordion-header" id="heading6">
|
||||
<button id="btn_step6" type="button" class="accordion-button collapsed" data-bs-toggle="collapse" data-bs-target="#accordion6" aria-expanded="false" aria-controls="accordion6">
|
||||
Session mag
|
||||
</button>
|
||||
</h2>
|
||||
<div id="accordion6" class="accordion-collapse collapse" aria-labelledby="heading6" style="">
|
||||
<div class="accordion-body" id="info_top_step6">
|
||||
Session mag
|
||||
</div>
|
||||
</div>
|
||||
<section class="timeline" style="margin: 0 24px 48px;">
|
||||
<article class="timeline-step" data-step="01" data-animate>
|
||||
<h4 id="btn_step1">Step 1</h4>
|
||||
<p id="info_top_step1">Sample site</p>
|
||||
</article>
|
||||
<article class="timeline-step" data-step="02" data-animate>
|
||||
<h4 id="btn_step2">Step 2</h4>
|
||||
<p id="info_top_step2">Login integration</p>
|
||||
</article>
|
||||
<article class="timeline-step" data-step="03" data-animate>
|
||||
<h4 id="btn_step3">Step 3</h4>
|
||||
<p id="info_top_step3">Device management page</p>
|
||||
</article>
|
||||
<article class="timeline-step" data-step="04" data-animate>
|
||||
<h4 id="btn_step4">Step 4</h4>
|
||||
<p id="info_top_step4">Session management</p>
|
||||
</article>
|
||||
<article class="timeline-step" data-step="05" data-animate>
|
||||
<h4 id="btn_step5">Step 5</h4>
|
||||
<p id="info_top_step5">Portal registration</p>
|
||||
</article>
|
||||
<article class="timeline-step" data-step="06" data-animate>
|
||||
<h4 id="btn_step6">Step 6</h4>
|
||||
<p id="info_top_step6">Server settings</p>
|
||||
</article>
|
||||
</section>
|
||||
|
||||
<div class="cta-banner" data-animate>
|
||||
<div>
|
||||
<h4>Need white-glove integration help?</h4>
|
||||
<p style="margin: 0; color: var(--text-muted);">Share your stack and we will tailor the SDK sample for you.</p>
|
||||
</div>
|
||||
<a href="mailto:sales@amipro.me?subject=amiPro%20integration" class="btn btn-primary">Talk to us</a>
|
||||
</div>
|
||||
|
||||
<br><br>
|
||||
</div>
|
||||
<!-- / Content -->
|
||||
|
||||
<!-- Footer -->
|
||||
@@ -330,15 +322,6 @@
|
||||
</div>
|
||||
<!-- / Layout wrapper -->
|
||||
|
||||
<!-- div class="buy-now">
|
||||
<a
|
||||
href="https://themeselection.com/products/sneat-bootstrap-html-admin-template/"
|
||||
target="_blank"
|
||||
class="btn btn-danger btn-buy-now"
|
||||
>Upgrade to Pro</a
|
||||
>
|
||||
</div -->
|
||||
|
||||
<!-- Page JS -->
|
||||
|
||||
<!-- Place this tag in your head or just before your close body tag. -->
|
||||
|
||||
120
merits.html
120
merits.html
@@ -8,7 +8,7 @@
|
||||
<meta charset="utf-8" />
|
||||
<meta
|
||||
name="viewport"
|
||||
content="width=device-width, initial-scale=1.0, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0"
|
||||
content="width=device-width, initial-scale=1.0"
|
||||
/>
|
||||
|
||||
<title> Passkeys - amiPro </title>
|
||||
@@ -16,7 +16,7 @@
|
||||
<!-- Google tag (gtag.js) -->
|
||||
<script async src="https://www.googletagmanager.com/gtag/js?id=G-850DCHX9EJ"></script>
|
||||
<script>
|
||||
window.dataLayer = window.dataLayer || [];
|
||||
globalThis.dataLayer = globalThis.dataLayer || [];
|
||||
function gtag(){dataLayer.push(arguments);}
|
||||
gtag('js', new Date());
|
||||
|
||||
@@ -43,6 +43,7 @@
|
||||
<link rel="stylesheet" href="files/core.css" class="template-customizer-core-css" />
|
||||
<link rel="stylesheet" href="files/theme-default.css" class="template-customizer-theme-css" />
|
||||
<link rel="stylesheet" href="files/demo.css" />
|
||||
<link rel="stylesheet" href="files/modern.css" />
|
||||
|
||||
<!-- Vendors CSS -->
|
||||
<link rel="stylesheet" href="files/perfect-scrollbar.css" />
|
||||
@@ -91,6 +92,12 @@
|
||||
lang_map.set("ja", "お問い合わせ(sales@amipro.me)");
|
||||
i18n_messages.set("title_contact", lang_map);
|
||||
|
||||
lang_map = new Map();
|
||||
lang_map.set("en-US", "Contact us(sales@amipro.me)");
|
||||
lang_map.set("zh-CN", "联系我们(sales@amipro.me)");
|
||||
lang_map.set("ja", "お問い合わせ(sales@amipro.me)");
|
||||
i18n_messages.set("title_contact_cta", lang_map);
|
||||
|
||||
lang_map = new Map();
|
||||
lang_map.set("en-US", "Higher security");
|
||||
lang_map.set("zh-CN", "更高的安全性");
|
||||
@@ -165,6 +172,7 @@
|
||||
|
||||
var video = document.getElementById('video');
|
||||
video.src = "files/amiProSampleSite01-JP.mp4";
|
||||
initRevealAnimations()
|
||||
}
|
||||
|
||||
</script>
|
||||
@@ -203,67 +211,54 @@
|
||||
<!-- Content wrapper -->
|
||||
<div class="content-wrapper">
|
||||
<!-- Content -->
|
||||
<div style="margin: 20px;">
|
||||
|
||||
<div class="accordion mt-3">
|
||||
<div class="card accordion-item">
|
||||
<h5 class="accordion-header" id="info_title_1" style="margin: 10px;">
|
||||
define
|
||||
</h5>
|
||||
|
||||
<div id="accordionOne" class="accordion-collapse ">
|
||||
<div class="accordion-body" id="info_1">
|
||||
define
|
||||
<div style="margin: 24px;">
|
||||
<section class="hero reveal">
|
||||
<div class="hero__text" data-animate>
|
||||
<span class="hero__eyebrow">Passkey impact</span>
|
||||
<h1 class="hero__title">Security your customers can feel</h1>
|
||||
<p class="hero__lead">
|
||||
Reduce phishing to near zero, lift conversion, and slash support load with amiPro's
|
||||
enterprise-grade Passkey platform.
|
||||
</p>
|
||||
<div class="hero__chips">
|
||||
<span class="hero-chip">Higher trust</span>
|
||||
<span class="hero-chip">Happier customers</span>
|
||||
<span class="hero-chip">Lower costs</span>
|
||||
</div>
|
||||
<div style="margin-top: 2rem; display: flex; gap: 0.8rem; flex-wrap: wrap;">
|
||||
<a href="https://portal.amipro.me" target="_blank" class="btn btn-primary">Portal</a>
|
||||
<a href="mailto:sales@amipro.me?subject=passkey%20benefits" class="btn btn-outline-info" id="title_contact_cta">Contact</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card accordion-item">
|
||||
<h5 class="accordion-header" id="info_title_2" style="margin: 10px;">
|
||||
define
|
||||
</h5>
|
||||
|
||||
<div id="accordionOne" class="accordion-collapse ">
|
||||
<div class="accordion-body" id="info_2">
|
||||
define
|
||||
</div>
|
||||
<div class="hero__media video-frame" data-animate>
|
||||
<video id="video" width="100%" height="auto" controls="controls" preload="auto">
|
||||
<source src="" type="video/mp4">
|
||||
<track kind="captions" srclang="en" label="English" src="files/passkey-demo.vtt" default>
|
||||
<track kind="descriptions" srclang="en" label="Descriptions" src="files/passkey-demo-desc.vtt">
|
||||
</video>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<div class="card accordion-item">
|
||||
<h5 class="accordion-header" id="info_title_3" style="margin: 10px;">
|
||||
define
|
||||
</h5>
|
||||
|
||||
<div id="accordionOne" class="accordion-collapse ">
|
||||
<div class="accordion-body" id="info_3">
|
||||
define
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card accordion-item">
|
||||
<h5 class="accordion-header" id="info_title_4" style="margin: 10px;">
|
||||
define
|
||||
</h5>
|
||||
|
||||
<div id="accordionOne" class="accordion-collapse ">
|
||||
<div class="accordion-body" id="info_4">
|
||||
define
|
||||
</div>
|
||||
<br>
|
||||
<img src="files/YubicoResearch.jpg" width="80%">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<br>
|
||||
<video id="video" width="100%" height="auto" controls="controls" preload="auto" style="margin: 10px;">
|
||||
<source src="" type="video/mp4">
|
||||
</video>
|
||||
<section class="info-panels" style="margin-top: 3rem;">
|
||||
<article class="info-panel" data-animate>
|
||||
<h4 id="info_title_1">define</h4>
|
||||
<p id="info_1">define</p>
|
||||
</article>
|
||||
<article class="info-panel" data-animate>
|
||||
<h4 id="info_title_2">define</h4>
|
||||
<p id="info_2">define</p>
|
||||
</article>
|
||||
<article class="info-panel" data-animate>
|
||||
<h4 id="info_title_3">define</h4>
|
||||
<p id="info_3">define</p>
|
||||
</article>
|
||||
<article class="info-panel" data-animate>
|
||||
<h4 id="info_title_4">define</h4>
|
||||
<p id="info_4">define</p>
|
||||
<img src="files/YubicoResearch.jpg" alt="Yubico Research" style="width: 100%; border-radius: 16px; margin-top: 1rem;">
|
||||
</article>
|
||||
</section>
|
||||
</div>
|
||||
|
||||
<br><br>
|
||||
</div>
|
||||
<!-- / Content -->
|
||||
|
||||
<!-- Footer -->
|
||||
@@ -301,15 +296,6 @@
|
||||
</div>
|
||||
<!-- / Layout wrapper -->
|
||||
|
||||
<!-- div class="buy-now">
|
||||
<a
|
||||
href="https://themeselection.com/products/sneat-bootstrap-html-admin-template/"
|
||||
target="_blank"
|
||||
class="btn btn-danger btn-buy-now"
|
||||
>Upgrade to Pro</a
|
||||
>
|
||||
</div -->
|
||||
|
||||
<!-- Page JS -->
|
||||
|
||||
<!-- Place this tag in your head or just before your close body tag. -->
|
||||
|
||||
109
passkey.html
109
passkey.html
@@ -8,7 +8,7 @@
|
||||
<meta charset="utf-8" />
|
||||
<meta
|
||||
name="viewport"
|
||||
content="width=device-width, initial-scale=1.0, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0"
|
||||
content="width=device-width, initial-scale=1.0"
|
||||
/>
|
||||
|
||||
<title> Passkeys - amiPro </title>
|
||||
@@ -16,7 +16,7 @@
|
||||
<!-- Google tag (gtag.js) -->
|
||||
<script async src="https://www.googletagmanager.com/gtag/js?id=G-850DCHX9EJ"></script>
|
||||
<script>
|
||||
window.dataLayer = window.dataLayer || [];
|
||||
globalThis.dataLayer = globalThis.dataLayer || [];
|
||||
function gtag(){dataLayer.push(arguments);}
|
||||
gtag('js', new Date());
|
||||
|
||||
@@ -43,6 +43,7 @@
|
||||
<link rel="stylesheet" href="files/core.css" class="template-customizer-core-css" />
|
||||
<link rel="stylesheet" href="files/theme-default.css" class="template-customizer-theme-css" />
|
||||
<link rel="stylesheet" href="files/demo.css" />
|
||||
<link rel="stylesheet" href="files/modern.css" />
|
||||
|
||||
<!-- Vendors CSS -->
|
||||
<link rel="stylesheet" href="files/perfect-scrollbar.css" />
|
||||
@@ -91,6 +92,12 @@
|
||||
lang_map.set("ja", "お問い合わせ（sales@amipro.me）");
|
||||
i18n_messages.set("title_contact", lang_map);
|
||||
|
||||
lang_map = new Map();
|
||||
lang_map.set("en-US", "Contact us (sales@amipro.me)");
|
||||
lang_map.set("zh-CN", "联系我们（sales@amipro.me）");
|
||||
lang_map.set("ja", "お問い合わせ（sales@amipro.me）");
|
||||
i18n_messages.set("title_contact_cta", lang_map);
|
||||
|
||||
lang_map = new Map();
|
||||
lang_map.set("en-US", "Passkey definition");
|
||||
lang_map.set("zh-CN", "Passkey 的定义");
|
||||
@@ -141,6 +148,7 @@
|
||||
|
||||
window.onload = async function() {
|
||||
setI18NText(i18n_messages)
|
||||
initRevealAnimations()
|
||||
}
|
||||
|
||||
</script>
|
||||
@@ -179,61 +187,53 @@
|
||||
<!-- Content wrapper -->
|
||||
<div class="content-wrapper">
|
||||
<!-- Content -->
|
||||
<div style="margin: 20px;">
|
||||
|
||||
<div class="accordion mt-3">
|
||||
<div class="card accordion-item">
|
||||
<h5 class="accordion-header" id="info_title_1" style="margin: 10px;">
|
||||
define
|
||||
</h5>
|
||||
|
||||
<div id="accordionOne" class="accordion-collapse ">
|
||||
<div class="accordion-body" id="info_1">
|
||||
define
|
||||
<div style="margin: 24px;">
|
||||
<section class="hero reveal">
|
||||
<div class="hero__text" data-animate>
|
||||
<span class="hero__eyebrow">Passkey essentials</span>
|
||||
<h1 class="hero__title">Everything teams need to understand Passkeys</h1>
|
||||
<p class="hero__lead">
|
||||
Share the fundamentals with product, security, and CX partners using this at-a-glance passkey
|
||||
briefing powered by amiPro research.
|
||||
</p>
|
||||
<div class="hero__chips">
|
||||
<span class="hero-chip">FIDO2 ready</span>
|
||||
<span class="hero-chip">Phishing resistant</span>
|
||||
<span class="hero-chip">Device agnostic</span>
|
||||
</div>
|
||||
<div style="margin-top: 2rem; display: flex; gap: 0.8rem; flex-wrap: wrap;">
|
||||
<a href="merits.html" class="btn btn-outline-info">See benefits</a>
|
||||
<a href="mailto:sales@amipro.me?subject=Passkey%20questions" class="btn btn-primary" id="title_contact_cta">Contact</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card accordion-item">
|
||||
<h5 class="accordion-header" id="info_title_2" style="margin: 10px;">
|
||||
define
|
||||
</h5>
|
||||
|
||||
<div id="accordionOne" class="accordion-collapse ">
|
||||
<div class="accordion-body" id="info_2">
|
||||
define
|
||||
<div class="hero__media" data-animate>
|
||||
<div class="hero__device">
|
||||
<img src="files/passkeys.jpg" alt="Passkey devices">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<div class="card accordion-item">
|
||||
<h5 class="accordion-header" id="info_title_3" style="margin: 10px;">
|
||||
define
|
||||
</h5>
|
||||
|
||||
<div id="accordionOne" class="accordion-collapse ">
|
||||
<div class="accordion-body" id="info_3">
|
||||
define
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card accordion-item">
|
||||
<h5 class="accordion-header" id="info_title_4" style="margin: 10px;">
|
||||
define
|
||||
</h5>
|
||||
|
||||
<div id="accordionOne" class="accordion-collapse ">
|
||||
<div class="accordion-body" id="info_4">
|
||||
define
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<section class="info-panels" style="margin-top: 3rem;">
|
||||
<article class="info-panel" data-animate>
|
||||
<h4 id="info_title_1">define</h4>
|
||||
<p id="info_1">define</p>
|
||||
</article>
|
||||
<article class="info-panel" data-animate>
|
||||
<h4 id="info_title_2">define</h4>
|
||||
<p id="info_2">define</p>
|
||||
</article>
|
||||
<article class="info-panel" data-animate>
|
||||
<h4 id="info_title_3">define</h4>
|
||||
<p id="info_3">define</p>
|
||||
</article>
|
||||
</section>
|
||||
|
||||
<section class="info-panel" data-animate style="margin-top: 3rem;">
|
||||
<h4 id="info_title_4">define</h4>
|
||||
<p id="info_4">define</p>
|
||||
<img src="files/amipro_sys.jpg" alt="amiPro architecture" style="width: 100%; border-radius: 18px; margin-top: 1rem;">
|
||||
</section>
|
||||
</div>
|
||||
|
||||
<br><br>
|
||||
</div>
|
||||
<!-- / Content -->
|
||||
|
||||
<!-- Footer -->
|
||||
@@ -271,15 +271,6 @@
|
||||
</div>
|
||||
<!-- / Layout wrapper -->
|
||||
|
||||
<!-- div class="buy-now">
|
||||
<a
|
||||
href="https://themeselection.com/products/sneat-bootstrap-html-admin-template/"
|
||||
target="_blank"
|
||||
class="btn btn-danger btn-buy-now"
|
||||
>Upgrade to Pro</a
|
||||
>
|
||||
</div -->
|
||||
|
||||
<!-- Page JS -->
|
||||
|
||||
<!-- Place this tag in your head or just before your close body tag. -->
|
||||
|
||||
Reference in New Issue
Block a user