Merge pull request earthstar-project#50 from earthstar-project/pseudo…

…code-styling Pseudocode styling
mikebryant · Jan 17, 2024 · 7cac01c · 7cac01c
2 parents e457e12 + 8ead3a1
commit 7cac01c
Show file tree

Hide file tree

Showing 4 changed files with 17 additions and 33 deletions.
diff --git a/pseudocode.ts b/pseudocode.ts
@@ -384,7 +384,7 @@ function render_struct(struct: Struct): Expression {
       for (const [field_id, rendered_field] of pseudocode_state(ctx).fields) {
         create_preview_from_string(
           field_id,
-          `<code class="pseudocode">${rendered_field}</code><div>Field of <a class="ref type" data-preview="${id_to_preview_data(struct.id)}" href="/specs/sync/index.html#${struct.id}">${struct_name}</a></div>`,
+          `<code class="pseudocode">${rendered_field}</code><div class="parent_type">Field of <a class="ref type" data-preview="${id_to_preview_data(struct.id)}" href="/specs/sync/index.html#${struct.id}">${struct_name}</a></div>`,
           ctx,
         );
       }
@@ -475,7 +475,7 @@ function render_simple_enum(simple_enum: SimpleEnum): Expression {
       for (const [variant_id, rendered_variant] of pseudocode_state(ctx).variants) {
         create_preview_from_string(
           variant_id,
-          `<code class="pseudocode">${rendered_variant}</code><div>Enum variant of <a class="ref type" data-preview="${id_to_preview_data(simple_enum.id)}" href="/specs/sync/index.html#${simple_enum.id}">${enum_name}</a></div>`,
+          `<code class="pseudocode">${rendered_variant}</code><div class="parent_type">Enum variant of <a class="ref type" data-preview="${id_to_preview_data(simple_enum.id)}" href="/specs/sync/index.html#${simple_enum.id}">${enum_name}</a></div>`,
           ctx
         );
       }

diff --git a/willowtest/design.css b/willowtest/design.css
@@ -15,8 +15,8 @@
     --wong-vermillion: rgb(213, 94, 0);
     --wong-purple: rgb(204, 121, 167);
 
-    --color-comment: #6a737d;
-    --color-punctuation: #4f5459;
+    --color-comment: #484f57;
+    --color-punctuation: #484f57;
     --color-keyword: #d73a49;
 
     --color-type: #6f42c1;
@@ -25,11 +25,11 @@
     --color-symbol: #005cc5;
     --color-fn: #735c0f;
 
-    --color-comment-type: #736195;
-    --color-comment-value: #577599;
-    --color-comment-member: #527d5c;
-    --color-comment-symbol: #6b89aa;
-    --color-comment-fn: #685209;
+    --color-comment-type: #4f397a;
+    --color-comment-value: #3a5b83;
+    --color-comment-member: #356a41;
+    --color-comment-symbol: #446993;
+    --color-comment-fn: #544000;
 }
 
 .orange, .orange a {

diff --git a/willowtest/specs/sync.ts b/willowtest/specs/sync.ts
@@ -249,8 +249,6 @@ export const sync: Expression = site_template(
                     ]),
 
                     pinformative(R("PaiBindFragment"), " messages use the ", r("IntersectionChannel"), "."),
-
-                    hr(),
 
                     pseudocode(
                         new Struct({
@@ -279,8 +277,6 @@ export const sync: Expression = site_template(
                     ]),
 
                     pinformative("The ", r("PaiReplyFragmentHandle"), " must refer to an ", r("IntersectionHandle"), " ", r("handle_bind", "bound"), " by the other peer via a ", r("PaiBindFragment"), " message. A peer may send at most one ", r("PaiReplyFragment"), " message per ", r("IntersectionHandle"), ". Upon sending or receiving a ", r("PaiReplyFragment"), " message, a peer updates the ", r("resource_handle"), " binding to now ", r("handle_bind"), " the ", r("PaiReplyFragmentGroupMember"), " of the ", r("PaiReplyFragment"), " message, in the state ", r("psi_state_completed"), "."),
-
-                    hr(),
 
                     pseudocode(
                         new Struct({
@@ -302,8 +298,6 @@ export const sync: Expression = site_template(
 
                     pinformative("A peer may send at most one ", r("PaiRequestSubspaceCapability"), " message per ", r("IntersectionHandle"), "."),
 
-                    hr(),
-
                     pseudocode(
                         new Struct({
                             id: "PaiReplySubspaceCapability",
@@ -380,8 +374,6 @@ export const sync: Expression = site_template(
 
                     pinformative(R("SetupBindReadCapability"), " messages use the ", r("CapabilityChannel"), "."),
 
-                    hr(),
-
                     pseudocode(
                         new Struct({
                             id: "SetupBindAreaOfInterest",
@@ -416,8 +408,6 @@ export const sync: Expression = site_template(
                     pinformative(
                         "Let ", def_value({id: "handle2ns_handle", singular: "handle"}), " be an ", r("AreaOfInterestHandle"), ". We then define ", code(function_call(def_fn({id: "handle_to_namespace_id"}), r("handle2ns_handle"))), " to denote the ", r("granted_namespace"), " of the ", r("ReadCapability"), " whose ", r("CapabilityHandle"), " is the ", r("SetupBindAreaOfInterestCapability"), " of the ", r("SetupBindAreaOfInterest"), " that ", r("handle_bind", "bound"), " ", r("handle2ns_handle"), ".", 
                     ),
-
-                    hr(),
 
                     pseudocode(
                         new Struct({
@@ -478,8 +468,6 @@ export const sync: Expression = site_template(
                     pinformative("The ", r("ReconciliationSendFingerprint"), " messages let peers initiate and progress ", r("d3rbsr"), ". Each ", r("ReconciliationSendFingerprint"), " message must contain ", rs("AreaOfInterestHandle"), " issued by both peers; this upholds read access control."),
 
                     pinformative(R("ReconciliationSendFingerprint"), " messages use the ", r("ReconciliationChannel"), "."),
-
-                    hr(),
 
                     pseudocode(
                         new Struct({
@@ -538,8 +526,6 @@ export const sync: Expression = site_template(
                     pinformative("When a peer receives a ", r("ReconciliationSendFingerprint"), " message that matches its local ", r("Fingerprint"), ", it should reply with a ", r("ReconciliationAnnounceEntries"), " message of ", r("ReconciliationAnnounceEntriesCount"), " zero and ", r("ReconciliationAnnounceEntriesFlag"), " ", code("false"), ", to indicate to the other peer that reconciliation of the ", r("D3Range"), " has concluded successfully."),
 
                     pinformative(R("ReconciliationAnnounceEntries"), " messages use the ", r("ReconciliationChannel"), "."),
-
-                    hr(),
 
                     pseudocode(
                         new Struct({
@@ -617,8 +603,6 @@ export const sync: Expression = site_template(
                     pinformative("Initially, ", r("currently_received_entry"), " is ", code(function_call(r("default_entry"), r("sync_default_namespace_id"), r("sync_default_subspace_id"), r("sync_default_payload_digest"))), ", and ", r("currently_received_offset"), " is zero."),
 
                     pinformative(R("DataSendEntry"), " messages use the ", r("DataChannel"), "."),
-
-                    hr(),
 
                     pseudocode(
                         new Struct({
@@ -647,8 +631,6 @@ export const sync: Expression = site_template(
 
                     pinformative(R("DataSendPayload"), " messages use the ", r("DataChannel"), "."),
 
-                    hr(),
-
                     pseudocode(
                         new Struct({
                             id: "DataSetEagerness",
@@ -679,8 +661,6 @@ export const sync: Expression = site_template(
                     pinformative("The ", r("DataSetEagerness"), " messages let peers express whether the other peer should eagerly push ", rs("Payload"), " from the intersection of two ", rs("AreaOfInterest"), ", or whether they should send only ", r("DataSendEntry"), " messages for that intersection."),
 
                     pinformative(R("DataSetEagerness"), " messages are not binding, they merely present an optimisation opportunity. In particular, they allow expressing the ", code("Prune"), " and ", code("Graft"), " messages of the ", link("epidemic broadcast tree protocol", "https://repositorium.sdum.uminho.pt/bitstream/1822/38894/1/647.pdf"), "."),
-
-                    hr(),
 
                     pseudocode(
                         new Struct({
@@ -715,8 +695,6 @@ export const sync: Expression = site_template(
                     ]),
 
                     pinformative(R("DataBindPayloadRequest"), " messages use the ", r("PayloadRequestChannel"), "."),
-
-                    hr(),
 
                     pseudocode(
                         new Struct({

diff --git a/willowtest/typography.css b/willowtest/typography.css
@@ -96,6 +96,8 @@ code.pseudocode {
   margin: 1em 0;
   display: block;
   border-radius: 0;
+  border-radius: 5px;
+  padding: 0.6em 0.5em ;
 }
 
 .pseudocode p {
@@ -115,6 +117,10 @@ code.pseudocode {
   margin: 0;
 }
 
+.parent_type {
+  margin-top: 0.5em;
+}
+
 .pseudocode dfn {
   font-style: normal;
 }
@@ -130,8 +136,8 @@ code.pseudocode {
 .hl_doccom {
   color: var(--color-comment);
   display: inline-block;
-  border-left: solid #00000020 2px;
-  padding-left: 1rem;
+  border-left: dotted #0000004c 2px;
+  padding-left: calc(2ch - 2px);
   text-decoration: inherit;
 }