Fix README asset alignment

This commit is contained in:
Affaan Mustafa
2026-07-24 11:52:30 -04:00
parent fb401834e5
commit cf1fb0125e
6 changed files with 66 additions and 13 deletions
+7 -7
View File
@@ -54,7 +54,7 @@ ECC v2.0.0 adds the public Hermes operator story on top of that reusable layer:
<tr>
<td width="33%" align="center">
<a href="https://ecc.tools/pricing">
<img src="assets/ecc-icon.svg" height="42" alt="ECC Tools" /><br />
<img src="assets/images/community/ecc-tools-mark.svg" height="42" alt="ECC Tools" /><br />
<strong>ECC Pro + GitHub App</strong>
</a><br />
<sub><a href="https://github.com/apps/ecc-tools">Install free</a> · <a href="https://ecc.tools/pricing">Private repos from $19/seat/mo</a></sub>
@@ -87,7 +87,7 @@ ECC v2.0.0 adds the public Hermes operator story on top of that reusable layer:
<a href="https://www.greptile.com/go/ecc" title="Greptile"><img src="assets/images/sponsors/greptile.png" height="54" alt="Greptile" /></a>&nbsp;&nbsp;&nbsp;
<a href="https://www.atlascloud.ai/?utm_source=github&utm_medium=link&utm_campaign=ECC" title="Atlas Cloud"><picture><source media="(prefers-color-scheme: dark)" srcset="assets/images/sponsors/atlascloud-dark.svg" /><img src="assets/images/sponsors/atlascloud.svg" width="154" alt="Atlas Cloud" /></picture></a>&nbsp;&nbsp;&nbsp;
<a href="https://www.moonshot.ai" title="Moonshot AI — Kimi"><picture><source media="(prefers-color-scheme: dark)" srcset="assets/images/sponsors/moonshot-dark.png" /><img src="assets/images/sponsors/moonshot.png" width="132" alt="Moonshot AI — Kimi" /></picture></a>&nbsp;&nbsp;&nbsp;
<a href="https://compute.itomarkets.com" title="Itô Markets"><picture><source media="(prefers-color-scheme: dark)" srcset="assets/images/sponsors/ito-dark.svg" /><img src="assets/images/sponsors/ito.svg" width="190" alt="Itô Markets" /></picture></a>
<a href="https://compute.itomarkets.com" title="Itô Markets"><picture><source media="(prefers-color-scheme: dark)" srcset="assets/images/sponsors/ito-dark.svg" /><img src="assets/images/sponsors/ito.svg" width="172" alt="Itô Markets" /></picture></a>
</p>
<sub><strong>Community sponsors:</strong> <a href="https://github.com/mikejmorgan-ai">Mike Morgan</a> · <a href="https://github.com/jasonwu513">@jasonwu513</a> · <a href="https://github.com/1anter">@1anter</a> · <a href="https://github.com/massimotodaro">@massimotodaro</a> · <a href="https://github.com/meadmccabe">@meadmccabe</a></sub>
@@ -106,21 +106,21 @@ This repo is the raw code only. The guides explain everything.
<tr>
<td width="33%" align="center">
<a href="./the-shortform-guide.md">
<img src="./assets/images/shortform/00-header.png" height="120" alt="The Shorthand Guide to ECC" /><br />
<img src="./assets/images/guides/shorthand-guide.png" width="213" height="120" alt="The Shorthand Guide to ECC" /><br />
<b>The Shorthand Guide</b>
</a>
<br /><sub>Setup, foundations, philosophy. <b>Read this first.</b> (<a href="https://x.com/affaan/status/2012378465664745795">thread</a>)</sub>
</td>
<td width="33%" align="center">
<a href="./the-longform-guide.md">
<img src="./assets/images/longform/01-header.png" height="120" alt="The Longform Guide to ECC" /><br />
<img src="./assets/images/guides/longform-guide.png" width="213" height="120" alt="The Longform Guide to ECC" /><br />
<b>The Longform Guide</b>
</a>
<br /><sub>Token optimization, memory persistence, evals, parallelization. (<a href="https://x.com/affaan/status/2014040193557471352">thread</a>)</sub>
</td>
<td width="33%" align="center">
<a href="./the-security-guide.md">
<img src="./assets/images/security/security-guide-header.png" height="120" alt="The Shorthand Guide to Everything Agentic Security" /><br />
<img src="./assets/images/guides/security-guide.png" width="213" height="120" alt="The Shorthand Guide to Everything Agentic Security" /><br />
<b>The Security Guide</b>
</a>
<br /><sub>Attack vectors, sandboxing, sanitization, CVEs, AgentShield. (<a href="https://x.com/affaan/status/2033263813387223421">thread</a>)</sub>
@@ -147,7 +147,7 @@ The Kimi Code harness and the model-serving layer are separate. ECC configures t
<tr>
<td width="33%" align="center">
<a href="https://compute.itomarkets.com">
<picture><source media="(prefers-color-scheme: dark)" srcset="assets/images/sponsors/ito-dark.svg" /><img src="assets/images/sponsors/ito.svg" width="180" alt="Itô Markets" /></picture><br />
<picture><source media="(prefers-color-scheme: dark)" srcset="assets/images/sponsors/ito-dark.svg" /><img src="assets/images/sponsors/ito.svg" width="164" alt="Itô Markets" /></picture><br />
<strong>1. Get GPU capacity</strong>
</a><br />
<sub>Use Itô or any GPU provider.</sub>
@@ -161,7 +161,7 @@ The Kimi Code harness and the model-serving layer are separate. ECC configures t
</td>
<td width="33%" align="center">
<a href=".kimi/README.md">
<img src="assets/ecc-icon.svg" height="52" alt="ECC Tools" /><br />
<img src="assets/images/community/ecc-tools-mark.svg" height="52" alt="ECC Tools" /><br />
<strong>3. Run Kimi Code with ECC</strong>
</a><br />
<sub>Install project instructions and skills, then start <code>kimi</code>.</sub>
@@ -0,0 +1,20 @@
<svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" viewBox="0 0 96 96" fill="none">
<defs>
<linearGradient id="favicon-frame" x1="18" y1="14" x2="82" y2="86" gradientUnits="userSpaceOnUse">
<stop stop-color="#E07856"/>
<stop offset="1" stop-color="#ffd700"/>
</linearGradient>
<linearGradient id="favicon-node" x1="24" y1="24" x2="72" y2="72" gradientUnits="userSpaceOnUse">
<stop stop-color="#ffd700"/>
<stop offset="1" stop-color="#7ee787"/>
</linearGradient>
</defs>
<rect x="10" y="10" width="76" height="76" rx="24" fill="rgba(255,255,255,0.03)" stroke="url(#favicon-frame)" stroke-width="2"/>
<rect x="22" y="22" width="52" height="52" rx="16" fill="rgba(10,10,18,0.86)" stroke="rgba(255,255,255,0.06)"/>
<path d="M34 60V40.5C34 36.91 36.91 34 40.5 34H48" stroke="url(#favicon-node)" stroke-width="4" stroke-linecap="round"/>
<path d="M48 34H56C59.59 34 62.5 36.91 62.5 40.5V44" stroke="url(#favicon-node)" stroke-width="4" stroke-linecap="round"/>
<path d="M52 55L60 47L52 39" stroke="#E07856" stroke-width="4" stroke-linecap="round" stroke-linejoin="round"/>
<circle cx="34" cy="60" r="5" fill="#ffd700"/>
<circle cx="48" cy="34" r="5" fill="#E07856"/>
<circle cx="62" cy="44" r="5" fill="#7ee787"/>
</svg>

After

Width:  |  Height:  |  Size: 1.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.1 MiB

+1 -1
View File
@@ -1,5 +1,5 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg xmlns="http://www.w3.org/2000/svg" width="280" height="40" viewBox="0 0 280 40">
<svg xmlns="http://www.w3.org/2000/svg" width="172" height="40" viewBox="0 0 172 40">
<defs><style>@import url('https://fonts.googleapis.com/css2?family=Libre+Baskerville:ital,wght@0,400;0,700;1,400&amp;family=IBM+Plex+Mono:wght@300;400;500&amp;display=swap');</style></defs>
<text x="0" y="30" font-family="'Libre Baskerville', serif" font-size="36" font-weight="500" letter-spacing="0.08em">

Before

Width:  |  Height:  |  Size: 737 B

After

Width:  |  Height:  |  Size: 737 B

+1 -1
View File
@@ -1,5 +1,5 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg xmlns="http://www.w3.org/2000/svg" width="280" height="40" viewBox="0 0 280 40">
<svg xmlns="http://www.w3.org/2000/svg" width="172" height="40" viewBox="0 0 172 40">
<defs><style>@import url('https://fonts.googleapis.com/css2?family=EB+Garamond:wght@400;500;600;700&amp;family=IBM+Plex+Mono:wght@300;400;500&amp;display=swap');</style></defs>
<text x="0" y="30" font-family="'EB Garamond', serif" font-size="36" font-weight="500" letter-spacing="0.08em">

Before

Width:  |  Height:  |  Size: 718 B

After

Width:  |  Height:  |  Size: 718 B

+37 -4
View File
@@ -25,6 +25,15 @@ function read(relativePath) {
return fs.readFileSync(path.join(REPO_ROOT, relativePath), 'utf8');
}
function readPngDimensions(relativePath) {
const image = fs.readFileSync(path.join(REPO_ROOT, relativePath));
assert.strictEqual(image.subarray(1, 4).toString('ascii'), 'PNG');
return {
width: image.readUInt32BE(16),
height: image.readUInt32BE(20),
};
}
function runTest(name, fn) {
try {
fn();
@@ -143,11 +152,11 @@ function main() {
);
const sponsorMark = read('assets/images/sponsors/ito.svg');
const sponsorMarkDark = read('assets/images/sponsors/ito-dark.svg');
assert.match(sponsorMark, /viewBox="0 0 280 40"/);
assert.match(sponsorMark, /viewBox="0 0 172 40"/);
assert.match(sponsorMark, />It</);
assert.match(sponsorMark, />ô</);
assert.match(sponsorMark, />MARKETS</);
assert.match(sponsorMarkDark, /viewBox="0 0 280 40"/);
assert.match(sponsorMarkDark, /viewBox="0 0 172 40"/);
assert.match(sponsorMarkDark, />It</);
assert.match(sponsorMarkDark, />ô</);
assert.match(sponsorMarkDark, />MARKETS</);
@@ -169,7 +178,7 @@ function main() {
const guides = extractNamedTable(readme, 'ECC guides');
assert.strictEqual((primaryLinks.match(/<td\b/g) || []).length, 3);
assert.ok(primaryLinks.includes('assets/ecc-icon.svg'));
assert.ok(primaryLinks.includes('assets/images/community/ecc-tools-mark.svg'));
assertExactHref(primaryLinks, 'https://github.com/apps/ecc-tools');
assertExactHref(primaryLinks, 'https://ecc.tools/pricing');
assertExactHref(primaryLinks, 'https://github.com/sponsors/affaan-m');
@@ -193,6 +202,30 @@ function main() {
assert.ok(guides.includes('./the-shortform-guide.md'));
assert.ok(guides.includes('./the-longform-guide.md'));
assert.ok(guides.includes('./the-security-guide.md'));
assert.strictEqual((guides.match(/width="213" height="120"/g) || []).length, 3);
for (const guideAsset of [
'assets/images/guides/shorthand-guide.png',
'assets/images/guides/longform-guide.png',
'assets/images/guides/security-guide.png',
]) {
assert.ok(guides.includes(guideAsset));
const { width, height } = readPngDimensions(guideAsset);
assert.ok(
Math.abs((width / height) - (16 / 9)) < 0.002,
`${guideAsset} should use the shared 16:9 guide-card geometry`
);
}
const eccToolsMark = read('assets/images/community/ecc-tools-mark.svg');
assert.match(eccToolsMark, /viewBox="0 0 96 96"/);
assert.match(eccToolsMark, /id="favicon-frame"/);
assert.match(eccToolsMark, /id="favicon-node"/);
assert.match(eccToolsMark, /circle cx="62" cy="44"/);
assert.doesNotMatch(
eccToolsMark,
/<script|<foreignObject|\son[a-z]+=|(?:href|xlink:href)=/i
);
}],
['README shows the verified local Kimi via Ito path without claiming managed serving', () => {
const readme = read('README.md');
@@ -201,7 +234,7 @@ function main() {
assert.strictEqual((localModelPath.match(/<td\b/g) || []).length, 3);
assert.ok(localModelPath.includes('assets/images/sponsors/ito.svg'));
assert.ok(localModelPath.includes('assets/images/sponsors/moonshot.png'));
assert.ok(localModelPath.includes('assets/ecc-icon.svg'));
assert.ok(localModelPath.includes('assets/images/community/ecc-tools-mark.svg'));
assert.match(readme, /install\.sh --target kimi --profile minimal/);
assert.match(readme, /npx ecc doctor --target kimi/);
assert.match(readme, /\.kimi\/AGENTS\.md/);