@bongos/core 1.19.726 → 1.19.728
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.bongos-core.json +177 -492
- package/.devcontainer/Dockerfile +1 -1
- package/.devcontainer/devcontainer.json +2 -2
- package/.devcontainer/healthcheck.sh +1 -1
- package/.devcontainer/init-firewall.sh +1 -1
- package/.devcontainer/post-create.sh +2 -2
- package/.env.local.example +1 -1
- package/Dockerfile +1 -1
- package/docs/copy-inventory.md +1 -1
- package/docs/copy-registry.json +9 -9
- package/docs/module-api-changelog.md +4 -0
- package/docs/recipes/devbox-app-release.md +4 -4
- package/modules/dev-box/app/scripts/dmgbuild-settings.py +5 -5
- package/modules/dev-box/app/scripts/gen-brand.js +1 -1
- package/modules/dev-box/app/src/brand.js +1 -1
- package/modules/dev-box/app/test/unit.mjs +16 -16
- package/modules/dev-box/box-access.js +1 -1
- package/modules/dev-box/routes/box.js +1 -1
- package/modules/discord/discord-approvals.js +1 -1
- package/modules/grading/grader-model.js +1 -1
- package/modules/grading/grader-prompt.js +1 -1
- package/modules/grading/grader-workers/quality.js +1 -1
- package/modules/hall-ui/module.json +1 -1
- package/modules/hall-ui/public/brand-apply.js +1 -1
- package/modules/hall-ui/public/shell.js +1 -1
- package/modules/hall-ui/public/work.js +1 -1
- package/modules/lifecycle/conflict-resolve.js +1 -1
- package/modules/lifecycle/db-analytics.js +1 -1
- package/modules/lifecycle/routes/analytics.js +1 -1
- package/modules/onboarding/approval-broadcast.js +1 -1
- package/modules/onboarding/onboarding.js +1 -1
- package/modules/provisioning/tests/liveness.mjs +1 -1
- package/modules/public-landing/public/index.html +1 -1
- package/modules/public-landing/public/projects-floor.states.json +2 -2
- package/modules/public-landing/public/projects.probes.json +4 -4
- package/modules/public-landing/public/projects.states.json +2 -2
- package/modules/status-ui/module.json +1 -1
- package/modules/status-ui/public/status.js +4 -4
- package/modules/status-ui/public/style.css +1 -1
- package/modules/ui-design/kit/fixtures/cost-summary.json +1 -1
- package/modules/ui-design/kit/fixtures/featured-hub.json +1 -1
- package/modules/ui-design/kit/fixtures/featured.json +1 -1
- package/modules/ui-design/kit/fixtures/leaderboard.json +1 -1
- package/modules/ui-design/kit/fixtures/my-projects.json +1 -1
- package/modules/ui-design/kit/fixtures/progress.json +1 -1
- package/modules/ui-design/kit/fixtures/recent-shipped.json +1 -1
- package/package-lock.json +2 -2
- package/package.json +1 -1
- package/scripts/cron/style_guide_audit.sh +1 -1
- package/scripts/discord/lib.js +1 -1
- package/scripts/discord/post.js +1 -1
- package/scripts/gds/audit-authorship.sh +1 -1
- package/scripts/gds/audit-replay.sh +29 -2
- package/scripts/gds/audit-ships.js +1 -1
- package/scripts/gds/backfill-sessions.js +2 -2
- package/scripts/gds/cf-tunnel.js +4 -4
- package/scripts/gds/claude-materialize.js +2 -2
- package/scripts/gds/cli-lib.js +6 -6
- package/scripts/gds/cutover-codemod.js +1 -1
- package/scripts/gds/dev-lib.js +2 -2
- package/scripts/gds/diagnose-achievements.js +2 -2
- package/scripts/gds/fitness-checks-identity.js +6 -4
- package/scripts/gds/gen-diagrams.js +1 -1
- package/scripts/gds/leak-scan-allowlist.js +293 -0
- package/scripts/gds/learning-capture.js +1 -1
- package/scripts/gds/linkify-refs.js +2 -2
- package/scripts/gds/local-preview-lib.js +1 -1
- package/scripts/gds/mirror-lineage-check.js +1 -1
- package/scripts/gds/mirror-redact.js +17 -2
- package/scripts/gds/newcomer-floor.templates.json +1 -1
- package/scripts/gds/package-core.js +18 -1
- package/scripts/gds/paste-token.js +1 -1
- package/scripts/gds/provision-units.js +2 -2
- package/scripts/gds/publish-manifest.js +15 -0
- package/scripts/gds/repo-metrics.js +1 -1
- package/scripts/gds/sandbox-stage.js +1 -1
- package/scripts/gds/seed-bongos-coreB-tranche1-tasks.js +1 -1
- package/scripts/gds/seed-bongos-coreB-tranche2-tasks.js +1 -1
- package/scripts/gds/seed-bongos-goal-hierarchy-tasks.js +1 -1
- package/scripts/gds/seed-bongos-tasks.js +2 -2
- package/scripts/gds/seed-gds-v4-tasks.js +1 -1
- package/scripts/gds/seed-medusa-tasks.js +10 -10
- package/scripts/gds/seed-module-upstreaming.js +1 -1
- package/scripts/gds/seed-productization-tasks.js +6 -6
- package/scripts/gds/seed-provisioning-tasks.js +2 -2
- package/scripts/gds/seed-staging.sh +19 -6
- package/scripts/gds/ship-deploy-target.js +1 -1
- package/scripts/gds/ship-flow.js +1 -1
- package/scripts/gds/smoke-gds.js +1 -1
- package/scripts/status-probe.mjs +2 -2
- package/src/bongos/auth-discord.js +2 -2
- package/src/bongos/live-channel.js +1 -1
- package/src/bongos/pool.js +1 -1
- package/src/bongos/routes/auth.js +11 -11
- package/src/bongos/routes/security.js +1 -1
- package/src/bongos/routes.js +1 -1
- package/src/branding.js +1 -1
- package/src/devbox-downloads.js +1 -1
- package/src/instance-config.js +2 -2
- package/src/module-api.js +1 -1
- package/src/module-loader/provenance.js +2 -2
- package/tests/art_stage.mjs +2 -2
- package/tests/auth_anthropic_identity.mjs +1 -1
- package/tests/auth_duplicate_cookie.mjs +1 -1
- package/tests/auth_error_brand.mjs +1 -1
- package/tests/auth_inactive_builder.mjs +1 -1
- package/tests/backup_cli.mjs +4 -4
- package/tests/bongos_box_connect.mjs +2 -2
- package/tests/bongos_downloads.mjs +2 -2
- package/tests/bongos_login.mjs +5 -5
- package/tests/box_connect_e2e.mjs +2 -2
- package/tests/box_dns_repoint.mjs +10 -10
- package/tests/box_host_keys.mjs +1 -1
- package/tests/box_onboard.mjs +9 -9
- package/tests/box_scope_session.mjs +1 -1
- package/tests/box_terminal_ssrf.mjs +7 -7
- package/tests/boxes.mjs +9 -9
- package/tests/branding.mjs +2 -2
- package/tests/bump_version.mjs +2 -2
- package/tests/cf_tunnel.mjs +40 -40
- package/tests/cli_package.mjs +40 -1
- package/tests/cli_token_reissue.mjs +7 -7
- package/tests/cloud_bongos_pack.mjs +1 -1
- package/tests/currency_label.mjs +8 -8
- package/tests/dev_lib.mjs +4 -4
- package/tests/devbox_dmg_backdrop.mjs +1 -1
- package/tests/devbox_downloads.mjs +2 -2
- package/tests/devbox_icons.mjs +1 -1
- package/tests/discord_approvals.mjs +1 -1
- package/tests/discord_oauth.mjs +2 -2
- package/tests/executed_closure.mjs +6 -1
- package/tests/first_admin_bootstrap.mjs +1 -1
- package/tests/gate_approvals.mjs +5 -5
- package/tests/grade_aggregates_unavailable.mjs +1 -1
- package/tests/hook_user_agents.mjs +2 -2
- package/tests/init.mjs +6 -6
- package/tests/instance_config.mjs +1 -1
- package/tests/instance_manifest.mjs +5 -5
- package/tests/instance_mismatch_guard.mjs +13 -13
- package/tests/leak_scan_allowlist.mjs +94 -0
- package/tests/migrate_root_resolution.mjs +4 -4
- package/tests/mirror_redact.mjs +28 -4
- package/tests/module_catalog.mjs +5 -5
- package/tests/module_submissions.mjs +3 -3
- package/tests/package_core.mjs +1 -1
- package/tests/parallel-load.mjs +6 -6
- package/tests/projects_hub.mjs +2 -2
- package/tests/provision.mjs +50 -50
- package/tests/provisioning_github_app_routes.mjs +1 -1
- package/tests/provisioning_onboard_mode.mjs +2 -2
- package/tests/publish_reconciler.mjs +4 -4
- package/tests/sandbox_stage.mjs +1 -1
- package/tests/scrubber_corpus.mjs +3 -3
- package/tests/search_isolation.mjs +1 -1
- package/tests/session_records.mjs +1 -1
- package/tests/ship_card.mjs +6 -6
- package/tests/ship_ci_deploy.mjs +1 -1
- package/tests/single_host_hall.mjs +9 -9
- package/tests/smoke_preflight.mjs +1 -1
- package/tests/smoke_target.mjs +1 -1
- package/tests/status-probe.mjs +1 -1
- package/tests/status_mirror_sync.mjs +1 -1
- package/docs/adr/0004-amazonprimea-name-and-trademark-acceptance.md +0 -45
- package/docs/design/mocks/_schemes.css +0 -604
- package/docs/design/mocks/component-sheet.html +0 -428
- package/docs/design/mocks/hall/_tokens.css +0 -370
- package/docs/design/mocks/hall/board/v1.html +0 -846
- package/docs/design/mocks/hall/board/v2.html +0 -858
- package/docs/design/mocks/hall/board/v3.html +0 -884
- package/docs/design/mocks/hall/goals/v1.html +0 -1212
- package/docs/design/mocks/hall/goals/v2.html +0 -1192
- package/docs/design/mocks/hall/goals/v3.html +0 -1205
- package/docs/design/mocks/hall/hall-sheet.html +0 -244
- package/docs/design/mocks/hall/reading/v1.html +0 -1125
- package/docs/design/mocks/hall/reading/v2.html +0 -1177
- package/docs/design/mocks/hall/reading/v3.html +0 -1150
- package/docs/design/mocks/hall/settings/v1.html +0 -1238
- package/docs/design/mocks/hall/settings/v2.html +0 -1235
- package/docs/design/mocks/hall/settings/v3.html +0 -1299
- package/docs/design/mocks/hall/task/v1.html +0 -633
- package/docs/design/mocks/hall/task/v2.html +0 -646
- package/docs/design/mocks/hall/task/v3.html +0 -647
- package/docs/design/mocks/hub/assets/r3-space-deepfield-half.jpg +0 -0
- package/docs/design/mocks/hub/assets/r3-space-deepfield-half.jpg.json +0 -13
- package/docs/design/mocks/hub/assets/r3-space-dust-half.jpg +0 -0
- package/docs/design/mocks/hub/assets/r3-space-dust-half.jpg.json +0 -13
- package/docs/design/mocks/hub/assets/r3-space-nebula-half.jpg +0 -0
- package/docs/design/mocks/hub/assets/r3-space-nebula-half.jpg.json +0 -13
- package/docs/design/mocks/hub/assets/r3-space-starfield-half.jpg +0 -0
- package/docs/design/mocks/hub/assets/r3-space-starfield-half.jpg.json +0 -13
- package/docs/design/mocks/hub/hub-sheet.html +0 -192
- package/docs/design/mocks/hub/mine.html +0 -465
- package/docs/design/mocks/hub/picker.html +0 -421
- package/docs/design/mocks/hub/planets.html +0 -356
- package/docs/design/mocks/hub/v1.html +0 -1209
- package/docs/design/mocks/hub/v2.html +0 -1257
- package/docs/design/mocks/hub/v3.html +0 -1496
- package/docs/design/mocks/hub/wizard.html +0 -421
- package/docs/design/mocks/landing/landing-sheet.html +0 -131
- package/docs/design/mocks/landing/v1.html +0 -956
- package/docs/design/mocks/landing/v2.html +0 -708
- package/docs/design/mocks/landing/v3.html +0 -911
- package/docs/design/mocks/landing-page-mock.html +0 -687
- package/docs/design/mocks/landing-palettes.html +0 -103
- package/docs/design/mocks/projects-hub-mock.html +0 -991
- package/docs/design/mocks/projects-hub-variants.html +0 -146
- package/docs/design/mocks/projects-page-mock.html +0 -167
- package/docs/design/mocks/world/blue-hud/_tokens.css +0 -246
- package/docs/design/mocks/world/blue-hud/hall.html +0 -595
- package/docs/design/mocks/world/blue-hud/landing.html +0 -424
- package/docs/design/mocks/world/blue-hud/status.html +0 -410
- package/docs/design/mocks/world/chrome-blobs/_tokens.css +0 -479
- package/docs/design/mocks/world/chrome-blobs/hall.html +0 -553
- package/docs/design/mocks/world/chrome-blobs/landing-b.html +0 -581
- package/docs/design/mocks/world/chrome-blobs/landing.html +0 -328
- package/docs/design/mocks/world/chrome-blobs/status.html +0 -416
- package/docs/design/mocks/world/natgeo-editorial/_tokens.css +0 -377
- package/docs/design/mocks/world/natgeo-editorial/hall.html +0 -649
- package/docs/design/mocks/world/natgeo-editorial/landing-b.html +0 -743
- package/docs/design/mocks/world/natgeo-editorial/landing.html +0 -475
- package/docs/design/mocks/world/natgeo-editorial/status.html +0 -437
- package/docs/design/mocks/world/organic-cards/_tokens.css +0 -462
- package/docs/design/mocks/world/organic-cards/hall.html +0 -625
- package/docs/design/mocks/world/organic-cards/landing-b.html +0 -736
- package/docs/design/mocks/world/organic-cards/landing.html +0 -420
- package/docs/design/mocks/world/organic-cards/status.html +0 -458
- package/docs/design/mocks/world/world-sheet.html +0 -156
|
@@ -1,356 +0,0 @@
|
|
|
1
|
-
<!doctype html>
|
|
2
|
-
<html lang="en">
|
|
3
|
-
<head>
|
|
4
|
-
<meta charset="utf-8">
|
|
5
|
-
<script>
|
|
6
|
-
(function(){try{var q=new URLSearchParams(location.search || location.hash.slice(1) || (window.__Q || '')).get('mode');var m=(q==='light'||q==='dark')?q:localStorage.getItem('cb-color-mode');if(m==='light'||m==='dark')document.documentElement.setAttribute('data-mode',m);}catch(e){}})();
|
|
7
|
-
</script>
|
|
8
|
-
<meta name="viewport" content="width=device-width,initial-scale=1">
|
|
9
|
-
<title>Planet templates, the hub's sky</title>
|
|
10
|
-
<link rel="icon" href="data:,">
|
|
11
|
-
<link rel="preconnect" href="https://fonts.googleapis.com">
|
|
12
|
-
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
|
13
|
-
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400&family=Manrope:wght@300;400;500;600&display=swap">
|
|
14
|
-
<link rel="stylesheet" href="../../../../modules/public-landing/public/assets/cosmos.css">
|
|
15
|
-
<style>
|
|
16
|
-
body{
|
|
17
|
-
/* The composition round for task 1003319 (docs/design/projects-hub-direction-v2.md §11). cosmos.css
|
|
18
|
-
carries the hub's contract + derived tiers and the set plate; the sheet adds the other two cutouts
|
|
19
|
-
the sky needs (root-absolute, the world's rule: a url() in a custom property resolves against the
|
|
20
|
-
DOCUMENT) and the one token that flips with the mode, the object's contact shadow. */
|
|
21
|
-
--plate-bead-cut:url(/assets/world/r2-chrome-blob-one-cut.webp);
|
|
22
|
-
--plate-bongos-cut:url(/assets/world/r2-bongos-chrome-a-cut.webp);
|
|
23
|
-
--orb-shadow:drop-shadow(0 12px 14px color-mix(in srgb,var(--ink) 22%,transparent));
|
|
24
|
-
--grid-line:var(--rule-soft);
|
|
25
|
-
}
|
|
26
|
-
:root[data-mode="dark"] body{
|
|
27
|
-
--orb-shadow:opacity(1);
|
|
28
|
-
--grid-line:var(--rule-soft);
|
|
29
|
-
}
|
|
30
|
-
@media (prefers-color-scheme: dark){
|
|
31
|
-
:root:not([data-mode="light"]) body{
|
|
32
|
-
--orb-shadow:opacity(1);
|
|
33
|
-
--grid-line:var(--rule-soft);
|
|
34
|
-
}
|
|
35
|
-
}
|
|
36
|
-
|
|
37
|
-
/* ── the planet: one of the world's three whole objects on the landing's crop maths, in the
|
|
38
|
-
project's accent. The colour layer blends with the plate; the mask clips both to the cutout's
|
|
39
|
-
alpha, so the colour never paints the box. Shape = plate + rectangle; style = how the accent
|
|
40
|
-
lands (a colour blend, a hue blend, or not at all). ── */
|
|
41
|
-
.planet{position:relative;display:block;width:var(--d,64px);aspect-ratio:var(--tpl-ar);filter:var(--orb-shadow);isolation:isolate;}
|
|
42
|
-
.planet::before{content:"";position:absolute;inset:0;
|
|
43
|
-
background-image:linear-gradient(var(--tpl-ink),var(--tpl-ink)),var(--tpl-src);
|
|
44
|
-
background-repeat:no-repeat;
|
|
45
|
-
background-size:100% 100%,calc(var(--d,64px) * var(--tpl-zoom)) auto;
|
|
46
|
-
background-position:0 0,calc(var(--d,64px) * var(--tpl-px)) calc(var(--d,64px) * var(--tpl-py));
|
|
47
|
-
background-blend-mode:var(--tpl-blend),normal;
|
|
48
|
-
-webkit-mask-image:var(--tpl-src);mask-image:var(--tpl-src);
|
|
49
|
-
-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
|
|
50
|
-
-webkit-mask-size:calc(var(--d,64px) * var(--tpl-zoom)) auto;mask-size:calc(var(--d,64px) * var(--tpl-zoom)) auto;
|
|
51
|
-
-webkit-mask-position:calc(var(--d,64px) * var(--tpl-px)) calc(var(--d,64px) * var(--tpl-py));
|
|
52
|
-
mask-position:calc(var(--d,64px) * var(--tpl-px)) calc(var(--d,64px) * var(--tpl-py));}
|
|
53
|
-
/* shapes: r2-chrome-blob-one u[.14,.865] v[.172,.808]; the bongo pair whole; the set's small bead u[.810,.955] v[.556,.840] */
|
|
54
|
-
[data-shape="blob"]{--tpl-src:var(--plate-bead-cut);--tpl-ar:1.13994;--tpl-zoom:1.37931;--tpl-px:-.19310;--tpl-py:-.23724;}
|
|
55
|
-
[data-shape="pair"]{--tpl-src:var(--plate-bongos-cut);--tpl-ar:1;--tpl-zoom:1;--tpl-px:0;--tpl-py:0;}
|
|
56
|
-
[data-shape="bead"]{--tpl-src:var(--plate-set-cut);--tpl-ar:.91476;--tpl-zoom:6.89655;--tpl-px:-5.58621;--tpl-py:-2.14014;}
|
|
57
|
-
/* styles */
|
|
58
|
-
[data-style="tint"]{--tpl-ink:var(--acc);--tpl-blend:color;}
|
|
59
|
-
[data-style="wash"]{--tpl-ink:var(--acc);--tpl-blend:overlay;}
|
|
60
|
-
[data-style="chrome"]{--tpl-ink:transparent;--tpl-blend:normal;}
|
|
61
|
-
/* the candidates row (blend modes under consideration) */
|
|
62
|
-
[data-blend="color"]{--tpl-ink:var(--acc);--tpl-blend:color;}
|
|
63
|
-
[data-blend="hue"]{--tpl-ink:var(--acc);--tpl-blend:hue;}
|
|
64
|
-
[data-blend="soft-light"]{--tpl-ink:var(--acc);--tpl-blend:soft-light;}
|
|
65
|
-
[data-blend="overlay"]{--tpl-ink:var(--acc);--tpl-blend:overlay;}
|
|
66
|
-
[data-blend="multiply"]{--tpl-ink:var(--acc);--tpl-blend:multiply;}
|
|
67
|
-
[data-blend="screen"]{--tpl-ink:var(--acc);--tpl-blend:screen;}
|
|
68
|
-
[data-blend="none"]{--tpl-ink:transparent;--tpl-blend:normal;}
|
|
69
|
-
|
|
70
|
-
/* ── the sheet ── */
|
|
71
|
-
.sheet{padding:34px var(--gutter) 60px;max-width:1180px;margin:0 auto;}
|
|
72
|
-
.sheet h2{font-family:var(--font-display);font-weight:300;font-size:clamp(26px,3.1vw,42px);letter-spacing:-.035em;line-height:1.06;color:var(--ink);margin:0 0 6px;}
|
|
73
|
-
.sheet p{font-size:15.5px;line-height:1.5;color:var(--ink-soft);max-width:62ch;margin:0 0 26px;}
|
|
74
|
-
.rowLabel{font-family:var(--label-face);font-size:var(--label-size);letter-spacing:var(--label-space);text-transform:uppercase;color:var(--ink-faint);padding:18px 0 12px;border-top:1px solid var(--rule-soft);margin-top:10px;}
|
|
75
|
-
.matrix{display:grid;grid-template-columns:repeat(9,1fr);gap:18px 14px;align-items:end;}
|
|
76
|
-
.cell{display:flex;flex-direction:column;align-items:center;gap:12px;min-width:0;}
|
|
77
|
-
.cell .planet{--d:78px;}
|
|
78
|
-
.cell .nm{font-family:var(--label-face);font-size:var(--label-size);letter-spacing:var(--label-space);text-transform:uppercase;color:var(--ink-faint);white-space:nowrap;}
|
|
79
|
-
.cands{display:grid;grid-template-columns:repeat(7,1fr);gap:18px 14px;align-items:end;}
|
|
80
|
-
.cands .planet{--d:96px;}
|
|
81
|
-
@media (max-width:900px){
|
|
82
|
-
.matrix{grid-template-columns:repeat(3,1fr);}
|
|
83
|
-
.cands{grid-template-columns:repeat(4,1fr);}
|
|
84
|
-
.cell .planet{--d:64px;}
|
|
85
|
-
}
|
|
86
|
-
|
|
87
|
-
/* ── the field, both treatments: the world's grammar for the labels ── */
|
|
88
|
-
.mock .field{height:calc(100vh - var(--top-h) - 60px);}
|
|
89
|
-
.mock .worldOrb .disc{width:var(--d);height:auto;aspect-ratio:var(--tpl-ar);border-radius:0;background:none;box-shadow:none;filter:var(--orb-shadow);isolation:isolate;}
|
|
90
|
-
.mock .worldOrb .disc::before{content:"";position:absolute;inset:0;
|
|
91
|
-
background-image:linear-gradient(var(--tpl-ink),var(--tpl-ink)),var(--tpl-src);
|
|
92
|
-
background-repeat:no-repeat;
|
|
93
|
-
background-size:100% 100%,calc(var(--d) * var(--tpl-zoom)) auto;
|
|
94
|
-
background-position:0 0,calc(var(--d) * var(--tpl-px)) calc(var(--d) * var(--tpl-py));
|
|
95
|
-
background-blend-mode:var(--tpl-blend),normal;
|
|
96
|
-
-webkit-mask-image:var(--tpl-src);mask-image:var(--tpl-src);
|
|
97
|
-
-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
|
|
98
|
-
-webkit-mask-size:calc(var(--d) * var(--tpl-zoom)) auto;mask-size:calc(var(--d) * var(--tpl-zoom)) auto;
|
|
99
|
-
-webkit-mask-position:calc(var(--d) * var(--tpl-px)) calc(var(--d) * var(--tpl-py));
|
|
100
|
-
mask-position:calc(var(--d) * var(--tpl-px)) calc(var(--d) * var(--tpl-py));}
|
|
101
|
-
/* the relationship ring: a circle behind the object, the rail dot's grammar */
|
|
102
|
-
.mock .worldOrb .disc::after{content:none;border:0;}
|
|
103
|
-
.mock .worldOrb[data-rel="owner"] .disc::after,.mock .worldOrb[data-rel="builder"] .disc::after{content:"";position:absolute;left:50%;top:50%;
|
|
104
|
-
width:calc(100% + 18px);aspect-ratio:1;translate:-50% -50%;border-radius:50%;z-index:-1;}
|
|
105
|
-
.mock .worldOrb[data-rel="owner"] .disc::after{border:1.5px solid var(--accent);}
|
|
106
|
-
.mock .worldOrb[data-rel="builder"] .disc::after{border:1px solid color-mix(in srgb,var(--accent) 55%,transparent);}
|
|
107
|
-
.mock .worldOrb[data-rel="owner"] .disc,.mock .worldOrb[data-rel="builder"] .disc{box-shadow:none;}
|
|
108
|
-
.mock .worldOrb .nm{font-family:var(--font-body);font-weight:500;font-size:15px;letter-spacing:-.015em;color:var(--ink);text-shadow:var(--type-halo);}
|
|
109
|
-
.mock .worldOrb .sub{font-family:var(--label-face);font-size:var(--label-size);letter-spacing:var(--label-space);text-transform:uppercase;color:var(--ink-faint);text-shadow:none;}
|
|
110
|
-
.mock .worldOrb .badge{top:-14px;background:var(--bg);color:var(--ink-faint);border:1px solid var(--rule);box-shadow:none;
|
|
111
|
-
font-family:var(--label-face);font-size:var(--label-size);letter-spacing:var(--label-space);text-transform:uppercase;font-weight:400;padding:3px 10px;}
|
|
112
|
-
.mock .worldOrb[data-rel="owner"] .badge{background:var(--bg);color:var(--ink);border-color:var(--ink-faint);}
|
|
113
|
-
/* A: the void. nothing drawn — the ground is the ground */
|
|
114
|
-
.mock .field .ground::after{content:none;}
|
|
115
|
-
.mock .field .stars{display:none;}
|
|
116
|
-
/* B: the sheet — one hairline grid inside the camera, so it pans and zooms with the objects */
|
|
117
|
-
.mock .field.sheetGrid .skyCam::before{content:"";position:absolute;inset:-100%;
|
|
118
|
-
background-image:linear-gradient(var(--grid-line) 1px,transparent 1px),linear-gradient(90deg,var(--grid-line) 1px,transparent 1px);
|
|
119
|
-
background-size:92px 92px;pointer-events:none;}
|
|
120
|
-
.mock .hintbar{background:none;border:0;padding:0;backdrop-filter:none;font-family:var(--label-face);font-size:var(--label-size);
|
|
121
|
-
letter-spacing:var(--label-space);text-transform:uppercase;color:var(--ink-faint);gap:18px;}
|
|
122
|
-
.mock .hintbar kbd{background:none;padding:0;color:var(--ink-soft);font-family:inherit;font-size:inherit;}
|
|
123
|
-
.mock .foot{padding:18px var(--gutter);font-size:14px;color:var(--ink-soft);text-align:center;}
|
|
124
|
-
|
|
125
|
-
/* the state contract: one section shows */
|
|
126
|
-
section[data-state]{display:none;}
|
|
127
|
-
body[data-state="sheet"] section[data-state="sheet"],
|
|
128
|
-
body[data-state="void"] section[data-state="void"],
|
|
129
|
-
body[data-state="grid"] section[data-state="grid"],
|
|
130
|
-
body[data-state="backdrops"] section[data-state="backdrops"],
|
|
131
|
-
body[data-state="materials"] section[data-state="materials"]{display:block;}
|
|
132
|
-
/* round 3 (task 1003337): the materials' crops, byte-equal to cosmos.css (patch-checked), on
|
|
133
|
-
the generic attribute pair so the sheet's .planet and the field's .worldOrb share them;
|
|
134
|
-
the candidate backdrops as the field's ground (half-size copies, served raw from docs/) */
|
|
135
|
-
[data-style="plain"]{--tpl-ink:transparent;--tpl-blend:normal;}
|
|
136
|
-
[data-material="frost"][data-shape="blob"]{--tpl-src:var(--plate-frost-blob-cut);--tpl-ar:1.25629;--tpl-zoom:1.46135;--tpl-px:-.22359;--tpl-py:-.34269;}
|
|
137
|
-
[data-material="frost"][data-shape="pair"]{--tpl-src:var(--plate-frost-pair-cut);--tpl-ar:1.91273;--tpl-zoom:1.09673;--tpl-px:-.04837;--tpl-py:-.28669;}
|
|
138
|
-
[data-material="frost"][data-shape="bead"]{--tpl-src:var(--plate-frost-bead-cut);--tpl-ar:.98831;--tpl-zoom:1.49678;--tpl-px:-.22976;--tpl-py:-.23769;}
|
|
139
|
-
[data-material="gold"][data-shape="blob"]{--tpl-src:var(--plate-gold-blob-cut);--tpl-ar:.91864;--tpl-zoom:1.31406;--tpl-px:-.1477;--tpl-py:-.11629;}
|
|
140
|
-
[data-material="gold"][data-shape="pair"]{--tpl-src:var(--plate-gold-pair-cut);--tpl-ar:1.86206;--tpl-zoom:1.08625;--tpl-px:-.04367;--tpl-py:-.28123;}
|
|
141
|
-
[data-material="gold"][data-shape="bead"]{--tpl-src:var(--plate-gold-bead-cut);--tpl-ar:1.00479;--tpl-zoom:1.08272;--tpl-px:-.04244;--tpl-py:-.04244;}
|
|
142
|
-
[data-material="obsidian"][data-shape="blob"]{--tpl-src:var(--plate-obsidian-blob-cut);--tpl-ar:.794;--tpl-zoom:1.55448;--tpl-px:-.2697;--tpl-py:-.15965;}
|
|
143
|
-
[data-material="obsidian"][data-shape="pair"]{--tpl-src:var(--plate-obsidian-pair-cut);--tpl-ar:2.23705;--tpl-zoom:1.0248;--tpl-px:-.01015;--tpl-py:-.30191;}
|
|
144
|
-
[data-material="obsidian"][data-shape="bead"]{--tpl-src:var(--plate-obsidian-bead-cut);--tpl-ar:1.0027;--tpl-zoom:1.34698;--tpl-px:-.17053;--tpl-py:-.17255;}
|
|
145
|
-
.mock .field[data-backdrop] .ground{background:var(--sky-bg) var(--cand) center/cover no-repeat;}
|
|
146
|
-
.mock .field[data-backdrop="nebula"]{--cand:url(assets/r3-space-nebula-half.jpg);}
|
|
147
|
-
.mock .field[data-backdrop="starfield"]{--cand:url(assets/r3-space-starfield-half.jpg);}
|
|
148
|
-
.mock .field[data-backdrop="dust"]{--cand:url(assets/r3-space-dust-half.jpg);}
|
|
149
|
-
.mock .field[data-backdrop="deepfield"]{--cand:url(assets/r3-space-deepfield-half.jpg);}
|
|
150
|
-
.mock section[data-state="backdrops"] .field{height:min(62vh,640px);}
|
|
151
|
-
.mock section[data-state="backdrops"] .rowLabel{padding:22px var(--gutter) 10px;}
|
|
152
|
-
.matrix.walk{grid-template-columns:repeat(12,1fr);}
|
|
153
|
-
.sheet .cell .nm{white-space:normal;text-align:center;line-height:1.35;max-width:100%;}
|
|
154
|
-
@media (max-width:900px){.matrix.walk{grid-template-columns:repeat(3,1fr);}}
|
|
155
|
-
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;}
|
|
156
|
-
.skip{position:absolute;left:12px;top:-60px;background:var(--bg-card);color:var(--ink);padding:11px 18px;border-radius:999px;}
|
|
157
|
-
.skip:focus{top:12px;}
|
|
158
|
-
.bar{height:var(--top-h);display:flex;align-items:center;padding:0 var(--gutter);border-bottom:1px solid var(--rule);font-family:var(--font-body);font-weight:500;font-size:17px;letter-spacing:-.015em;color:var(--ink);}
|
|
159
|
-
</style>
|
|
160
|
-
</head>
|
|
161
|
-
<body class="mock" data-state="sheet">
|
|
162
|
-
<!--
|
|
163
|
-
Planet templates, the composition round (task 1003319, goal 1000080).
|
|
164
|
-
?state=sheet the nine templates at the five accents, and the blend candidates
|
|
165
|
-
?state=void field treatment A: the void — nothing drawn, the objects carry the depth
|
|
166
|
-
?state=grid field treatment B: the sheet — one hairline grid inside the camera
|
|
167
|
-
?state=backdrops round 3 (task 1003337): the four rendered space candidates as the field's ground
|
|
168
|
-
?state=materials round 3: the twelve-step walk, then frost / gold / obsidian at the five accents
|
|
169
|
-
?mode=dark|light
|
|
170
|
-
-->
|
|
171
|
-
<a class="skip" href="#main">Skip to content</a>
|
|
172
|
-
<header class="bar">Cloud Bongos</header>
|
|
173
|
-
<main id="main">
|
|
174
|
-
<h1 class="vh">Planet templates</h1>
|
|
175
|
-
|
|
176
|
-
<section data-state="sheet" class="sheet">
|
|
177
|
-
<h2>Nine templates, five accents</h2>
|
|
178
|
-
<p>Each project's orb is one of the world's three whole chrome objects, cut on the landing's own crop maths, in the project's accent. Three shapes by three styles: tint (the accent replaces the chrome's colour), wash (the accent takes only its hue), chrome (the plate as rendered).</p>
|
|
179
|
-
<div class="rowLabel">the blend candidates, one blob, the sea accent</div>
|
|
180
|
-
<div class="cands">
|
|
181
|
-
<div class="cell"><span class="planet" data-shape="blob" data-blend="color" style="--acc:var(--sea)"></span><span class="nm">color</span></div>
|
|
182
|
-
<div class="cell"><span class="planet" data-shape="blob" data-blend="hue" style="--acc:var(--sea)"></span><span class="nm">hue</span></div>
|
|
183
|
-
<div class="cell"><span class="planet" data-shape="blob" data-blend="soft-light" style="--acc:var(--sea)"></span><span class="nm">soft-light</span></div>
|
|
184
|
-
<div class="cell"><span class="planet" data-shape="blob" data-blend="overlay" style="--acc:var(--sea)"></span><span class="nm">overlay</span></div>
|
|
185
|
-
<div class="cell"><span class="planet" data-shape="blob" data-blend="multiply" style="--acc:var(--sea)"></span><span class="nm">multiply</span></div>
|
|
186
|
-
<div class="cell"><span class="planet" data-shape="blob" data-blend="screen" style="--acc:var(--sea)"></span><span class="nm">screen</span></div>
|
|
187
|
-
<div class="cell"><span class="planet" data-shape="blob" data-blend="none" style="--acc:var(--sea)"></span><span class="nm">none</span></div>
|
|
188
|
-
</div>
|
|
189
|
-
<div id="matrix"></div>
|
|
190
|
-
</section>
|
|
191
|
-
|
|
192
|
-
<section data-state="void">
|
|
193
|
-
<div class="fieldWrap"><div class="field" id="fieldA">
|
|
194
|
-
<div class="ground"></div>
|
|
195
|
-
<div class="skyCam">
|
|
196
|
-
<a class="worldOrb" href="#" data-rel="owner" data-shape="pair" data-style="chrome" style="--acc:var(--accent);--d:140px;left:50%;top:44%"><span class="badge">yours</span><span class="disc"></span><span class="nm">Cloud Bongos</span><span class="sub">this platform</span></a>
|
|
197
|
-
<a class="worldOrb" href="#" data-rel="none" data-shape="blob" data-style="tint" style="--acc:var(--terracotta);--d:92px;left:22%;top:30%"><span class="disc"></span><span class="nm">Demo</span></a>
|
|
198
|
-
<a class="worldOrb" href="#" data-rel="builder" data-shape="bead" data-style="wash" style="--acc:var(--gold-soft);--d:75px;left:78%;top:66%"><span class="badge">you build here</span><span class="disc"></span><span class="nm">Emersonian Circles</span></a>
|
|
199
|
-
<a class="worldOrb" href="#" data-rel="builder" data-shape="pair" data-style="tint" style="--acc:var(--sea);--d:70px;left:33%;top:74%"><span class="badge">you build here</span><span class="disc"></span><span class="nm">Off the Boats</span></a>
|
|
200
|
-
<a class="worldOrb" href="#" data-rel="none" data-shape="bead" data-style="chrome" style="--acc:var(--sun-lit);--d:80px;left:70%;top:26%"><span class="disc"></span><span class="nm">Mercury</span></a>
|
|
201
|
-
</div>
|
|
202
|
-
<div class="hintbar"><span><kbd>drag</kbd> pan</span><span><kbd>scroll</kbd> zoom</span><span><kbd>click a project</kbd> open it</span></div>
|
|
203
|
-
</div></div>
|
|
204
|
-
</section>
|
|
205
|
-
|
|
206
|
-
<section data-state="grid">
|
|
207
|
-
<div class="fieldWrap"><div class="field sheetGrid" id="fieldB">
|
|
208
|
-
<div class="ground"></div>
|
|
209
|
-
<div class="skyCam">
|
|
210
|
-
<a class="worldOrb" href="#" data-rel="owner" data-shape="pair" data-style="chrome" style="--acc:var(--accent);--d:140px;left:50%;top:44%"><span class="badge">yours</span><span class="disc"></span><span class="nm">Cloud Bongos</span><span class="sub">this platform</span></a>
|
|
211
|
-
<a class="worldOrb" href="#" data-rel="none" data-shape="blob" data-style="tint" style="--acc:var(--terracotta);--d:92px;left:22%;top:30%"><span class="disc"></span><span class="nm">Demo</span></a>
|
|
212
|
-
<a class="worldOrb" href="#" data-rel="builder" data-shape="bead" data-style="wash" style="--acc:var(--gold-soft);--d:75px;left:78%;top:66%"><span class="badge">you build here</span><span class="disc"></span><span class="nm">Emersonian Circles</span></a>
|
|
213
|
-
<a class="worldOrb" href="#" data-rel="builder" data-shape="pair" data-style="tint" style="--acc:var(--sea);--d:70px;left:33%;top:74%"><span class="badge">you build here</span><span class="disc"></span><span class="nm">Off the Boats</span></a>
|
|
214
|
-
<a class="worldOrb" href="#" data-rel="none" data-shape="bead" data-style="chrome" style="--acc:var(--sun-lit);--d:80px;left:70%;top:26%"><span class="disc"></span><span class="nm">Mercury</span></a>
|
|
215
|
-
</div>
|
|
216
|
-
<div class="hintbar"><span><kbd>drag</kbd> pan</span><span><kbd>scroll</kbd> zoom</span><span><kbd>click a project</kbd> open it</span></div>
|
|
217
|
-
</div></div>
|
|
218
|
-
</section>
|
|
219
|
-
|
|
220
|
-
<section data-state="backdrops">
|
|
221
|
-
<div class="rowLabel">the nebula wash: a faint violet-and-bronze wash, sparse stars (the builder's recommendation; shipped as --field-plate)</div>
|
|
222
|
-
<div class="fieldWrap"><div class="field" data-backdrop="nebula">
|
|
223
|
-
<div class="ground"></div>
|
|
224
|
-
<div class="skyCam">
|
|
225
|
-
<a class="worldOrb" href="#" data-rel="owner" data-shape="pair" data-material="chrome" data-style="chrome" style="--acc:var(--accent);--d:140px;left:50%;top:44%"><span class="badge">yours</span><span class="disc"></span><span class="nm">Cloud Bongos</span><span class="sub">this platform</span></a>
|
|
226
|
-
<a class="worldOrb" href="#" data-rel="none" data-shape="blob" data-material="frost" data-style="wash" style="--acc:var(--terracotta);--d:92px;left:22%;top:30%"><span class="disc"></span><span class="nm">Demo</span></a>
|
|
227
|
-
<a class="worldOrb" href="#" data-rel="builder" data-shape="bead" data-material="gold" data-style="tint" style="--acc:var(--gold-soft);--d:75px;left:78%;top:66%"><span class="badge">you build here</span><span class="disc"></span><span class="nm">Off the Boats</span></a>
|
|
228
|
-
<a class="worldOrb" href="#" data-rel="builder" data-shape="pair" data-material="obsidian" data-style="tint" style="--acc:var(--sea);--d:70px;left:33%;top:74%"><span class="badge">you build here</span><span class="disc"></span><span class="nm">Emersonian Circles</span></a>
|
|
229
|
-
<a class="worldOrb" href="#" data-rel="none" data-shape="bead" data-material="chrome" data-style="chrome" style="--acc:var(--sun-lit);--d:80px;left:70%;top:26%"><span class="disc"></span><span class="nm">Mercury</span></a>
|
|
230
|
-
</div>
|
|
231
|
-
<div class="hintbar"><span><kbd>drag</kbd> pan</span><span><kbd>scroll</kbd> zoom</span><span><kbd>click a project</kbd> open it</span></div>
|
|
232
|
-
</div></div>
|
|
233
|
-
<div class="rowLabel">the starfield: three depths of pin-sharp stars, a cool haze band</div>
|
|
234
|
-
<div class="fieldWrap"><div class="field" data-backdrop="starfield">
|
|
235
|
-
<div class="ground"></div>
|
|
236
|
-
<div class="skyCam">
|
|
237
|
-
<a class="worldOrb" href="#" data-rel="owner" data-shape="pair" data-material="chrome" data-style="chrome" style="--acc:var(--accent);--d:140px;left:50%;top:44%"><span class="badge">yours</span><span class="disc"></span><span class="nm">Cloud Bongos</span><span class="sub">this platform</span></a>
|
|
238
|
-
<a class="worldOrb" href="#" data-rel="none" data-shape="blob" data-material="frost" data-style="wash" style="--acc:var(--terracotta);--d:92px;left:22%;top:30%"><span class="disc"></span><span class="nm">Demo</span></a>
|
|
239
|
-
<a class="worldOrb" href="#" data-rel="builder" data-shape="bead" data-material="gold" data-style="tint" style="--acc:var(--gold-soft);--d:75px;left:78%;top:66%"><span class="badge">you build here</span><span class="disc"></span><span class="nm">Off the Boats</span></a>
|
|
240
|
-
<a class="worldOrb" href="#" data-rel="builder" data-shape="pair" data-material="obsidian" data-style="tint" style="--acc:var(--sea);--d:70px;left:33%;top:74%"><span class="badge">you build here</span><span class="disc"></span><span class="nm">Emersonian Circles</span></a>
|
|
241
|
-
<a class="worldOrb" href="#" data-rel="none" data-shape="bead" data-material="chrome" data-style="chrome" style="--acc:var(--sun-lit);--d:80px;left:70%;top:26%"><span class="disc"></span><span class="nm">Mercury</span></a>
|
|
242
|
-
</div>
|
|
243
|
-
<div class="hintbar"><span><kbd>drag</kbd> pan</span><span><kbd>scroll</kbd> zoom</span><span><kbd>click a project</kbd> open it</span></div>
|
|
244
|
-
</div></div>
|
|
245
|
-
<div class="rowLabel">the dust: bronze-and-blue filaments, one distant glow</div>
|
|
246
|
-
<div class="fieldWrap"><div class="field" data-backdrop="dust">
|
|
247
|
-
<div class="ground"></div>
|
|
248
|
-
<div class="skyCam">
|
|
249
|
-
<a class="worldOrb" href="#" data-rel="owner" data-shape="pair" data-material="chrome" data-style="chrome" style="--acc:var(--accent);--d:140px;left:50%;top:44%"><span class="badge">yours</span><span class="disc"></span><span class="nm">Cloud Bongos</span><span class="sub">this platform</span></a>
|
|
250
|
-
<a class="worldOrb" href="#" data-rel="none" data-shape="blob" data-material="frost" data-style="wash" style="--acc:var(--terracotta);--d:92px;left:22%;top:30%"><span class="disc"></span><span class="nm">Demo</span></a>
|
|
251
|
-
<a class="worldOrb" href="#" data-rel="builder" data-shape="bead" data-material="gold" data-style="tint" style="--acc:var(--gold-soft);--d:75px;left:78%;top:66%"><span class="badge">you build here</span><span class="disc"></span><span class="nm">Off the Boats</span></a>
|
|
252
|
-
<a class="worldOrb" href="#" data-rel="builder" data-shape="pair" data-material="obsidian" data-style="tint" style="--acc:var(--sea);--d:70px;left:33%;top:74%"><span class="badge">you build here</span><span class="disc"></span><span class="nm">Emersonian Circles</span></a>
|
|
253
|
-
<a class="worldOrb" href="#" data-rel="none" data-shape="bead" data-material="chrome" data-style="chrome" style="--acc:var(--sun-lit);--d:80px;left:70%;top:26%"><span class="disc"></span><span class="nm">Mercury</span></a>
|
|
254
|
-
</div>
|
|
255
|
-
<div class="hintbar"><span><kbd>drag</kbd> pan</span><span><kbd>scroll</kbd> zoom</span><span><kbd>click a project</kbd> open it</span></div>
|
|
256
|
-
</div></div>
|
|
257
|
-
<div class="rowLabel">the deep field: near-empty, a violet corner</div>
|
|
258
|
-
<div class="fieldWrap"><div class="field" data-backdrop="deepfield">
|
|
259
|
-
<div class="ground"></div>
|
|
260
|
-
<div class="skyCam">
|
|
261
|
-
<a class="worldOrb" href="#" data-rel="owner" data-shape="pair" data-material="chrome" data-style="chrome" style="--acc:var(--accent);--d:140px;left:50%;top:44%"><span class="badge">yours</span><span class="disc"></span><span class="nm">Cloud Bongos</span><span class="sub">this platform</span></a>
|
|
262
|
-
<a class="worldOrb" href="#" data-rel="none" data-shape="blob" data-material="frost" data-style="wash" style="--acc:var(--terracotta);--d:92px;left:22%;top:30%"><span class="disc"></span><span class="nm">Demo</span></a>
|
|
263
|
-
<a class="worldOrb" href="#" data-rel="builder" data-shape="bead" data-material="gold" data-style="tint" style="--acc:var(--gold-soft);--d:75px;left:78%;top:66%"><span class="badge">you build here</span><span class="disc"></span><span class="nm">Off the Boats</span></a>
|
|
264
|
-
<a class="worldOrb" href="#" data-rel="builder" data-shape="pair" data-material="obsidian" data-style="tint" style="--acc:var(--sea);--d:70px;left:33%;top:74%"><span class="badge">you build here</span><span class="disc"></span><span class="nm">Emersonian Circles</span></a>
|
|
265
|
-
<a class="worldOrb" href="#" data-rel="none" data-shape="bead" data-material="chrome" data-style="chrome" style="--acc:var(--sun-lit);--d:80px;left:70%;top:26%"><span class="disc"></span><span class="nm">Mercury</span></a>
|
|
266
|
-
</div>
|
|
267
|
-
<div class="hintbar"><span><kbd>drag</kbd> pan</span><span><kbd>scroll</kbd> zoom</span><span><kbd>click a project</kbd> open it</span></div>
|
|
268
|
-
</div></div>
|
|
269
|
-
</section>
|
|
270
|
-
|
|
271
|
-
<section data-state="materials" class="sheet">
|
|
272
|
-
<h2>Three materials, five accents</h2>
|
|
273
|
-
<p>Round 3: the same three whole objects rendered in frosted glass, brushed gold and polished obsidian, cut out and cropped from their own alpha, on the same masked colour layer. A template is now shape, material and style; the walk changes all three each step.</p>
|
|
274
|
-
<div class="rowLabel">the walk, twelve steps (the hub's default order)</div>
|
|
275
|
-
<div class="matrix walk" id="walk"></div>
|
|
276
|
-
<div id="matrix2"></div>
|
|
277
|
-
</section>
|
|
278
|
-
</main>
|
|
279
|
-
<footer class="foot">A composition sheet for tasks 1003319 and 1003337. Nothing here is served.</footer>
|
|
280
|
-
<script>
|
|
281
|
-
/* The mock's state contract: read ?state= once, apply one state (sheet | void | grid). The
|
|
282
|
-
matrix is built with createElement + textContent. No motion in script. */
|
|
283
|
-
(function () {
|
|
284
|
-
var state = new URLSearchParams(location.search || location.hash.slice(1) || (window.__Q || '')).get('state') || 'sheet';
|
|
285
|
-
if (['sheet', 'void', 'grid', 'backdrops', 'materials'].indexOf(state) === -1) state = 'sheet';
|
|
286
|
-
document.body.setAttribute('data-state', state);
|
|
287
|
-
var ACCENTS = [['sea', 'var(--sea)'], ['terracotta', 'var(--terracotta)'], ['gold-soft', 'var(--gold-soft)'], ['sun-lit', 'var(--sun-lit)'], ['accent', 'var(--accent)']];
|
|
288
|
-
var TEMPLATES = ['blob-tint', 'pair-wash', 'bead-chrome', 'blob-wash', 'pair-chrome', 'bead-tint', 'blob-chrome', 'pair-tint', 'bead-wash'];
|
|
289
|
-
var host = document.getElementById('matrix');
|
|
290
|
-
ACCENTS.forEach(function (a) {
|
|
291
|
-
var label = document.createElement('div');
|
|
292
|
-
label.className = 'rowLabel';
|
|
293
|
-
label.textContent = 'the ' + a[0] + ' accent';
|
|
294
|
-
host.appendChild(label);
|
|
295
|
-
var row = document.createElement('div');
|
|
296
|
-
row.className = 'matrix';
|
|
297
|
-
TEMPLATES.forEach(function (t) {
|
|
298
|
-
var parts = t.split('-');
|
|
299
|
-
var cell = document.createElement('div');
|
|
300
|
-
cell.className = 'cell';
|
|
301
|
-
var p = document.createElement('span');
|
|
302
|
-
p.className = 'planet';
|
|
303
|
-
p.setAttribute('data-shape', parts[0]);
|
|
304
|
-
p.setAttribute('data-style', parts[1]);
|
|
305
|
-
p.style.setProperty('--acc', a[1]);
|
|
306
|
-
var n = document.createElement('span');
|
|
307
|
-
n.className = 'nm';
|
|
308
|
-
n.textContent = t;
|
|
309
|
-
cell.appendChild(p);
|
|
310
|
-
cell.appendChild(n);
|
|
311
|
-
row.appendChild(cell);
|
|
312
|
-
});
|
|
313
|
-
host.appendChild(row);
|
|
314
|
-
});
|
|
315
|
-
/* round 3: the walk and the materials matrix, the same cell grammar */
|
|
316
|
-
var WALK = ['blob-tint', 'pair-gold-wash', 'bead-obsidian-plain', 'blob-frost-wash', 'pair-chrome', 'bead-gold-tint', 'blob-obsidian-wash', 'pair-frost-tint', 'bead-wash', 'blob-gold-plain', 'pair-obsidian-tint', 'bead-frost-wash'];
|
|
317
|
-
function cellFor(t, acc) {
|
|
318
|
-
var parts = t.split('-'), shape = parts[0], material = parts.length === 3 ? parts[1] : 'chrome', style = parts[parts.length - 1];
|
|
319
|
-
var cell = document.createElement('div');
|
|
320
|
-
cell.className = 'cell';
|
|
321
|
-
var p = document.createElement('span');
|
|
322
|
-
p.className = 'planet';
|
|
323
|
-
p.setAttribute('data-shape', shape);
|
|
324
|
-
p.setAttribute('data-material', material);
|
|
325
|
-
p.setAttribute('data-style', style);
|
|
326
|
-
p.style.setProperty('--acc', acc);
|
|
327
|
-
var n = document.createElement('span');
|
|
328
|
-
n.className = 'nm';
|
|
329
|
-
n.textContent = t;
|
|
330
|
-
cell.appendChild(p);
|
|
331
|
-
cell.appendChild(n);
|
|
332
|
-
return cell;
|
|
333
|
-
}
|
|
334
|
-
var walkHost = document.getElementById('walk');
|
|
335
|
-
if (walkHost) WALK.forEach(function (t, i) { walkHost.appendChild(cellFor(t, ACCENTS[i % ACCENTS.length][1])); });
|
|
336
|
-
var host2 = document.getElementById('matrix2');
|
|
337
|
-
if (host2) {
|
|
338
|
-
['frost', 'gold', 'obsidian'].forEach(function (m) {
|
|
339
|
-
ACCENTS.forEach(function (a) {
|
|
340
|
-
var label = document.createElement('div');
|
|
341
|
-
label.className = 'rowLabel';
|
|
342
|
-
label.textContent = m + ', the ' + a[0] + ' accent';
|
|
343
|
-
host2.appendChild(label);
|
|
344
|
-
var row = document.createElement('div');
|
|
345
|
-
row.className = 'matrix';
|
|
346
|
-
['blob', 'pair', 'bead'].forEach(function (s) {
|
|
347
|
-
['tint', 'wash', 'plain'].forEach(function (y) { row.appendChild(cellFor(s + '-' + m + '-' + y, a[1])); });
|
|
348
|
-
});
|
|
349
|
-
host2.appendChild(row);
|
|
350
|
-
});
|
|
351
|
-
});
|
|
352
|
-
}
|
|
353
|
-
})();
|
|
354
|
-
</script>
|
|
355
|
-
</body>
|
|
356
|
-
</html>
|