mirror of
https://github.com/agentscope-ai/ReMe.git
synced 2026-10-10 03:30:56 +00:00
docs: refresh ReMe homepage branding (#520)
This commit is contained in:
jinliyl
GitHub
parent
dc28e62526
commit
8c3d3016e3
9 changed files with 202 additions and 18 deletions
|
|
@ -201,24 +201,136 @@ body {
|
|||
}
|
||||
|
||||
.VPHero .image-bg {
|
||||
background: linear-gradient(135deg, rgba(25, 201, 176, 0.28), rgba(49, 86, 217, 0.2));
|
||||
filter: blur(46px);
|
||||
width: min(88%, 420px);
|
||||
height: 220px;
|
||||
border-radius: 42%;
|
||||
background: linear-gradient(125deg, rgba(25, 201, 176, 0.34), rgba(49, 86, 217, 0.25));
|
||||
filter: blur(52px);
|
||||
}
|
||||
|
||||
.VPFeature {
|
||||
border-color: color-mix(in srgb, var(--vp-c-brand-1) 18%, var(--vp-c-divider));
|
||||
.VPHero .image-container {
|
||||
isolation: isolate;
|
||||
perspective: 900px;
|
||||
}
|
||||
|
||||
.VPHero .image-container::before,
|
||||
.VPHero .image-container::after {
|
||||
position: absolute;
|
||||
content: "";
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.VPHero .image-container::before {
|
||||
z-index: 0;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
width: min(88%, 430px);
|
||||
height: 210px;
|
||||
border: 1px solid color-mix(in srgb, var(--vp-c-bg-elv) 64%, var(--reme-blue));
|
||||
border-radius: 30px;
|
||||
background:
|
||||
linear-gradient(135deg, color-mix(in srgb, var(--vp-c-bg-elv) 92%, transparent), color-mix(in srgb, var(--vp-c-bg-soft) 76%, transparent)),
|
||||
radial-gradient(circle at 15% 15%, rgba(25, 201, 176, 0.14), transparent 42%);
|
||||
box-shadow:
|
||||
0 30px 70px rgba(19, 70, 91, 0.16),
|
||||
inset 0 1px 0 color-mix(in srgb, white 72%, transparent);
|
||||
backdrop-filter: blur(22px) saturate(135%);
|
||||
transform: translate(-50%, -50%) rotate(-1.5deg);
|
||||
}
|
||||
|
||||
.VPHero .image-container::after {
|
||||
z-index: -1;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
width: min(78%, 380px);
|
||||
height: 210px;
|
||||
border: 1px solid rgba(49, 86, 217, 0.17);
|
||||
border-radius: 30px;
|
||||
background: linear-gradient(135deg, rgba(25, 201, 176, 0.1), rgba(49, 86, 217, 0.11));
|
||||
transform: translate(-46%, -48%) rotate(7deg);
|
||||
}
|
||||
|
||||
.VPHero .image-src {
|
||||
z-index: 1;
|
||||
width: min(76%, 380px);
|
||||
max-width: 380px !important;
|
||||
max-height: 150px !important;
|
||||
object-fit: contain;
|
||||
filter: drop-shadow(0 12px 20px rgba(18, 78, 105, 0.16));
|
||||
}
|
||||
|
||||
.VPHomeFeatures .item:nth-child(1) { --feature-accent: #18b99e; }
|
||||
.VPHomeFeatures .item:nth-child(2) { --feature-accent: #25a8dc; }
|
||||
.VPHomeFeatures .item:nth-child(3) { --feature-accent: #6575e8; }
|
||||
.VPHomeFeatures .item:nth-child(4) { --feature-accent: #e69a42; }
|
||||
|
||||
.VPHomeFeatures .VPFeature {
|
||||
border-color: color-mix(in srgb, var(--feature-accent) 28%, var(--vp-c-divider));
|
||||
border-radius: 16px;
|
||||
background: linear-gradient(150deg, var(--vp-c-bg-elv), var(--vp-c-bg-soft));
|
||||
transition: transform 160ms ease, box-shadow 160ms ease;
|
||||
background:
|
||||
radial-gradient(circle at 10% 4%, color-mix(in srgb, var(--feature-accent) 16%, transparent), transparent 52%),
|
||||
linear-gradient(150deg, var(--vp-c-bg-elv), color-mix(in srgb, var(--feature-accent) 7%, var(--vp-c-bg-soft)));
|
||||
box-shadow:
|
||||
inset 0 1px 0 color-mix(in srgb, white 76%, transparent),
|
||||
0 8px 24px color-mix(in srgb, var(--feature-accent) 7%, transparent);
|
||||
transition: transform 160ms ease, border-color 160ms ease, box-shadow 160ms ease;
|
||||
}
|
||||
|
||||
.VPFeature:hover {
|
||||
.VPHomeFeatures .VPFeature .box {
|
||||
display: grid;
|
||||
grid-template-columns: auto minmax(0, 1fr);
|
||||
grid-template-rows: auto 1fr;
|
||||
column-gap: 12px;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.VPHomeFeatures .VPFeature .icon {
|
||||
grid-column: 1;
|
||||
grid-row: 1;
|
||||
width: auto;
|
||||
height: auto;
|
||||
margin: 0;
|
||||
border: 0;
|
||||
background: transparent;
|
||||
box-shadow: none;
|
||||
font-size: 25px;
|
||||
}
|
||||
|
||||
.VPHomeFeatures .VPFeature .title {
|
||||
grid-column: 2;
|
||||
grid-row: 1;
|
||||
color: color-mix(in srgb, var(--feature-accent) 22%, var(--vp-c-text-1));
|
||||
}
|
||||
|
||||
.VPHomeFeatures .VPFeature .details {
|
||||
grid-column: 1 / -1;
|
||||
grid-row: 2;
|
||||
align-self: start;
|
||||
padding-top: 18px;
|
||||
}
|
||||
|
||||
.VPHomeFeatures .VPFeature .link-text {
|
||||
grid-column: 1 / -1;
|
||||
}
|
||||
|
||||
.VPHomeFeatures .VPFeature:hover {
|
||||
transform: translateY(-3px);
|
||||
box-shadow: 0 16px 34px rgba(21, 58, 43, 0.1);
|
||||
border-color: color-mix(in srgb, var(--feature-accent) 48%, var(--vp-c-divider));
|
||||
box-shadow: 0 18px 38px color-mix(in srgb, var(--feature-accent) 15%, transparent);
|
||||
}
|
||||
|
||||
.dark .VPHomeFeatures .VPFeature {
|
||||
background:
|
||||
radial-gradient(circle at 10% 4%, color-mix(in srgb, var(--feature-accent) 18%, transparent), transparent 54%),
|
||||
linear-gradient(150deg, var(--vp-c-bg-elv), color-mix(in srgb, var(--feature-accent) 8%, var(--vp-c-bg-soft)));
|
||||
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06);
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.vp-doc h1 { font-size: 34px; }
|
||||
.vp-doc h2 { margin-top: 44px; font-size: 24px; }
|
||||
.copy-markdown-wrap { margin-top: -8px; }
|
||||
.VPHero .image-container::before,
|
||||
.VPHero .image-container::after { height: 176px; border-radius: 24px; }
|
||||
.VPHero .image-src { width: 72%; max-height: 120px !important; }
|
||||
}
|
||||
|
|
|
|||
|
|
@ -7,8 +7,8 @@ hero:
|
|||
text: Memory that works for agents
|
||||
tagline: Files remain yours. ReMe turns conversations and resources into readable, editable, searchable, interconnected local files.
|
||||
image:
|
||||
src: /favicon.svg
|
||||
alt: ReMe
|
||||
src: /reme-logo.svg
|
||||
alt: ReMe logo
|
||||
actions:
|
||||
- theme: brand
|
||||
text: Quick Start
|
||||
|
|
|
|||
46
docs/figure/reme-logo-fashion.svg
Normal file
46
docs/figure/reme-logo-fashion.svg
Normal file
|
|
@ -0,0 +1,46 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 780 220" role="img" aria-labelledby="title description">
|
||||
<title id="title">ReMe</title>
|
||||
<desc id="description">ReMe gradient wordmark and open memory ribbon</desc>
|
||||
<defs>
|
||||
<linearGradient id="brand" x1="24" y1="28" x2="746" y2="188" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#20d2b7"/>
|
||||
<stop offset="0.4" stop-color="#12a9cc"/>
|
||||
<stop offset="0.74" stop-color="#2877e6"/>
|
||||
<stop offset="1" stop-color="#5146e5"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="icon-glass" x1="22" y1="18" x2="194" y2="204" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#ffffff" stop-opacity="0.96"/>
|
||||
<stop offset="0.5" stop-color="#e8fffb" stop-opacity="0.84"/>
|
||||
<stop offset="1" stop-color="#dce8ff" stop-opacity="0.76"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="wordmark" x1="252" y1="72" x2="742" y2="164" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#12b6bd"/>
|
||||
<stop offset="0.5" stop-color="#168fd0"/>
|
||||
<stop offset="1" stop-color="#4961dc"/>
|
||||
</linearGradient>
|
||||
<filter id="soft-shadow" x="-25%" y="-30%" width="150%" height="170%">
|
||||
<feDropShadow dx="0" dy="8" stdDeviation="8" flood-color="#237caa" flood-opacity="0.16"/>
|
||||
</filter>
|
||||
<filter id="icon-shadow" x="-25%" y="-25%" width="150%" height="160%">
|
||||
<feDropShadow dx="0" dy="7" stdDeviation="8" flood-color="#287ca6" flood-opacity="0.2"/>
|
||||
</filter>
|
||||
<filter id="wordmark-shadow" x="-10%" y="-20%" width="120%" height="150%">
|
||||
<feDropShadow dx="0" dy="4" stdDeviation="4" flood-color="#2876b8" flood-opacity="0.18"/>
|
||||
</filter>
|
||||
</defs>
|
||||
|
||||
<!-- The memory ribbon lives in its own glass app tile, separated from the wordmark. -->
|
||||
<g filter="url(#icon-shadow)">
|
||||
<rect x="15" y="15" width="190" height="190" rx="54" fill="url(#icon-glass)"/>
|
||||
<rect x="16.5" y="16.5" width="187" height="187" rx="52.5" fill="none" stroke="url(#brand)" stroke-opacity="0.48" stroke-width="3"/>
|
||||
<path d="M37 69C63 27 144 24 182 57" fill="none" stroke="white" stroke-width="7" stroke-linecap="round" opacity="0.92"/>
|
||||
</g>
|
||||
|
||||
<g fill="none" stroke="url(#brand)" stroke-linecap="round" stroke-linejoin="round">
|
||||
<path d="M64 166V54h48c28 0 45 15 45 39.5S140 133 112 133H94" stroke-width="25"/>
|
||||
<path d="M94 131 157 166" stroke-width="25"/>
|
||||
</g>
|
||||
<circle cx="94" cy="131" r="7" fill="white" stroke="#3bd7c2" stroke-width="3"/>
|
||||
|
||||
<text x="252" y="159" fill="url(#wordmark)" font-family="Optima, Candara, 'Segoe UI', sans-serif" font-size="132" font-weight="600" letter-spacing="-3" filter="url(#wordmark-shadow)">ReMe</text>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.6 KiB |
|
|
@ -14,8 +14,8 @@ hero:
|
|||
text: 让 Agent 真正记住
|
||||
tagline: 文件属于你，记忆服务于 Agent。ReMe 将对话和资料沉淀为可读、可编辑、可检索、相互链接的本地文件。
|
||||
image:
|
||||
src: /favicon.svg
|
||||
alt: ReMe
|
||||
src: /reme-logo.svg
|
||||
alt: ReMe Logo
|
||||
actions:
|
||||
- theme: brand
|
||||
text: 快速开始
|
||||
|
|
|
|||
|
|
@ -1,5 +1,28 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64">
|
||||
<defs><linearGradient id="g" x1="8" y1="7" x2="57" y2="58" gradientUnits="userSpaceOnUse"><stop stop-color="#19c9b0"/><stop offset="1" stop-color="#3156d9"/></linearGradient></defs>
|
||||
<rect x="4" y="4" width="56" height="56" rx="18" fill="url(#g)"/>
|
||||
<path d="M20 46V18h13.2c7.2 0 11.8 3.8 11.8 10 0 4.3-2.2 7.5-6 9l7 9h-8l-5.8-7.8H27V46h-7Zm7-13.6h5.6c3.5 0 5.4-1.4 5.4-4.2 0-2.8-1.9-4.1-5.4-4.1H27v8.3Z" fill="white"/>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64" role="img" aria-label="ReMe">
|
||||
<defs>
|
||||
<linearGradient id="brand" x1="14" y1="12" x2="51" y2="51" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#21d1bb"/>
|
||||
<stop offset="0.52" stop-color="#159fc9"/>
|
||||
<stop offset="1" stop-color="#3156d9"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="glass" x1="10" y1="7" x2="56" y2="59" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#ffffff" stop-opacity="0.94"/>
|
||||
<stop offset="0.48" stop-color="#e4fffa" stop-opacity="0.82"/>
|
||||
<stop offset="1" stop-color="#dbe7ff" stop-opacity="0.74"/>
|
||||
</linearGradient>
|
||||
<filter id="shadow" x="-30%" y="-30%" width="160%" height="170%">
|
||||
<feDropShadow dx="0" dy="3" stdDeviation="3" flood-color="#287ca6" flood-opacity="0.22"/>
|
||||
</filter>
|
||||
</defs>
|
||||
|
||||
<!-- Liquid glass tile shared with the full ReMe wordmark. -->
|
||||
<g filter="url(#shadow)">
|
||||
<rect x="3" y="3" width="58" height="58" rx="18" fill="url(#glass)"/>
|
||||
<rect x="3.75" y="3.75" width="56.5" height="56.5" rx="17.25" fill="none" stroke="url(#brand)" stroke-opacity="0.46" stroke-width="1.5"/>
|
||||
<path d="M10 21C18 8 43 7 55 17" fill="none" stroke="white" stroke-width="2.2" stroke-linecap="round" opacity="0.9"/>
|
||||
</g>
|
||||
|
||||
<path d="M18 49V15h14.5C41 15 46 19.5 46 27s-5 12-13.5 12H27" fill="none" stroke="url(#brand)" stroke-width="7.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M27 38.5 46 49" fill="none" stroke="url(#brand)" stroke-width="7.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<circle cx="27" cy="38.5" r="2.2" fill="white" stroke="#43d7c5" stroke-width="0.8"/>
|
||||
</svg>
|
||||
|
|
|
|||
|
Before Width: | Height: | Size: 492 B After Width: | Height: | Size: 1.6 KiB |
|
|
@ -7,8 +7,8 @@ hero:
|
|||
text: 让 Agent 真正记住
|
||||
tagline: 文件属于你，记忆服务于 Agent。ReMe 将对话和资料沉淀为可读、可编辑、可检索、相互链接的本地文件。
|
||||
image:
|
||||
src: /favicon.svg
|
||||
alt: ReMe
|
||||
src: /reme-logo.svg
|
||||
alt: ReMe Logo
|
||||
actions:
|
||||
- theme: brand
|
||||
text: 快速开始
|
||||
|
|
|
|||
|
|
@ -201,6 +201,7 @@ await cp(path.join(repoDir, "docs"), outputDir, {
|
|||
filter: (source) => ![".DS_Store", "plans"].includes(path.basename(source)),
|
||||
});
|
||||
await cp(path.join(siteDir, "public", "CNAME"), path.join(outputDir, "public", "CNAME"));
|
||||
await cp(path.join(repoDir, "docs/figure/reme-logo-fashion.svg"), path.join(outputDir, "public", "reme-logo.svg"));
|
||||
|
||||
const sourceMap = {};
|
||||
for (const [destination, source] of externalDocuments) {
|
||||
|
|
|
|||
|
|
@ -34,6 +34,7 @@ const requiredFiles = [
|
|||
"404.html",
|
||||
"CNAME",
|
||||
"favicon.svg",
|
||||
"reme-logo.svg",
|
||||
"hashmap.json",
|
||||
"sitemap.xml",
|
||||
"llms.txt",
|
||||
|
|
|
|||
|
|
@ -72,6 +72,7 @@ test("keeps generated content disposable and excludes internal plans", async ()
|
|||
await assert.rejects(access(path.join(generatedDir, "plans")));
|
||||
await access(path.join(generatedDir, ".vitepress", "config.mts"));
|
||||
await access(path.join(generatedDir, "public", "favicon.svg"));
|
||||
await access(path.join(generatedDir, "public", "reme-logo.svg"));
|
||||
assert.equal(
|
||||
(await readFile(path.join(generatedDir, "public", "CNAME"), "utf8")).trim(),
|
||||
"reme.agentscope.io",
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue