kash-shell 0.3.24__py3-none-any.whl → 0.3.26__py3-none-any.whl

kash/web_gen/templates/base_styles.css.jinja

@@ -3,12 +3,22 @@
   font-size: 16px;
   /* Adding Hack Nerd Font to all fonts for icon support, if it is installed. */
   --font-sans: "Source Sans 3 Variable", sans-serif, "Hack Nerd Font";
-  --font-serif: "PT Serif", serif, "Hack Nerd Font";
+  --font-serif: "LocalPunct", "PT Serif", serif, "Hack Nerd Font";
   /* Source Sans 3 Variable better at these weights. */
   --font-weight-sans-medium: 550;
   --font-weight-sans-bold: 650;
   --font-mono: "Hack Nerd Font", "Menlo", "DejaVu Sans Mono", Consolas, "Lucida Console", monospace;
 
+  --font-features-sans: normal;
+  {#
+  /* TODO: FontSource builds don't seem to support these. Might be nice to use. */
+  --font-features-sans:
+     "ss01" 0, /* Flat-tailed l */
+     "ss02" 1, /* Single-storey a */
+     "ss03" 0, /* Single-storey g */
+     "ss04" 0; /* Sans-bar I */
+  #}
+
   --font-size-large: 1.2rem;
   --font-size-normal: 1rem;
   --font-size-small: 0.95rem;
@@ -17,11 +27,27 @@
   --font-size-mono-small: 0.75rem;
   --font-size-mono-tiny: 0.7rem;
 
+  /* Both Source Sans 3 and PT Serif have small caps, so we use this instead of text-transform. */
+  --caps-transform: none;
+  --caps-caps-variant: all-small-caps;
+  --caps-spacing: 0.025em;
+  /* Compensate for small caps (Source Sans small caps are quite small) */
+  --caps-heading-size-multiplier: 1.42;
+  --caps-heading-line-height: calc(1.2 / var(--caps-heading-size-multiplier));
+
+  {# 
+  /* Option to handle small caps manually. */
+  --caps-transform: uppercase;
+  --caps-caps-variant: none;
+  --caps-spacing: 0.025em;
+  #}
+
   --console-char-width: 88;
   --console-width: calc(var(--console-char-width) + 2rem);
   {% endblock root_variables %}
 }
 
+/* CSS color definitions. */
 {{ color_defs|safe }}
 
 {% block selection_styles %}
@@ -115,12 +141,7 @@ a:hover {
   transition: all 0.15s ease-in-out;
 }
 
-h1,
-h2,
-h3,
-h4,
-h5,
-h6 {
+h1, h2, h3, h4, h5, h6 {
   line-height: 1.2;
 }
 
@@ -131,7 +152,7 @@ h1 {
 }
 
 h2 {
-  font-size: 1.42rem;
+  font-size: 1.32rem;
   margin-top: 2rem;
   margin-bottom: 1rem;
 }
@@ -145,13 +166,13 @@ h2 + h3 {
 }
 
 h3 {
-  font-size: 1.18rem;
+  font-size: 1.15rem;
   margin-top: 1.4rem;
   margin-bottom: 0.7rem;
 }
 
 h4 {
-  font-size: 1.1rem;
+  font-size: 1.12rem;
   margin-top: 1rem;
   margin-bottom: 0.7rem;
 }
@@ -300,13 +321,17 @@ img {
 
 details {
   font-family: var(--font-sans);
+  font-feature-settings: var(--font-features-sans);
   color: var(--color-text);
 
   border: 1px solid var(--color-hint-gentle);
-  border-radius: 3px;
   margin: 0.75rem 0;
 }
 
+details > :not(summary) {
+  padding: 0 0.75rem;
+}
+
 summary {
   color: var(--color-secondary);
   padding: .5rem 1rem;
@@ -316,9 +341,12 @@ summary {
   transition: all 0.15s ease-in-out;
 }
 
+summary::marker {
+  font-size: 0.85rem;
+}
+
 summary:hover {
   color: var(--color-primary-light);
-  {# background: var(--color-hover-bg); #}
 }
 
 /* keep the border on the summary when open so it blends */
@@ -331,6 +359,36 @@ summary:focus-visible {
   outline-offset: 2px;
 }
 
+/* Special formatting for document metadata details */
+details.metadata {
+  color: var(--color-tertiary);
+}
+
+details.metadata > :not(summary) {
+  color: var(--color-secondary);
+}
+
+details.metadata summary {
+  font-weight: 550;
+  font-size: calc(var(--font-size-small) * var(--caps-heading-size-multiplier));
+  line-height: var(--caps-heading-line-height);
+  text-transform: var(--caps-transform);
+  font-variant-caps: var(--caps-caps-variant);
+  letter-spacing: var(--caps-spacing);
+  color: var(--color-tertiary);
+}
+
+details.metadata summary:hover {
+  color: var(--color-primary-light);
+}
+
+details.metadata blockquote {
+  border-left: none;
+  margin: 0 0.75rem;
+  font-size: var(--font-size-small);
+  font-style: italic;
+}
+
 
 hr {
   border: none;
@@ -374,15 +432,21 @@ hr:before {
 
 .long-text h3 {
   font-family: var(--font-sans);
+  font-feature-settings: var(--font-features-sans);
   font-weight: 550;
-  text-transform: uppercase;
-  letter-spacing: 0.025em;
+  font-size: calc(1.15rem * var(--caps-heading-size-multiplier));
+  line-height: var(--caps-heading-line-height);
+  text-transform: var(--caps-transform);
+  font-variant-caps: var(--caps-caps-variant);
+  letter-spacing: var(--caps-spacing);
 }
 
 .long-text h4 {
-  font-family: var(--font-serif);
-  font-weight: 400;
+  font-family: var(--font-sans);
+  font-feature-settings: var(--font-features-sans);
+  font-weight: 540;
   font-style: italic;
+  letter-spacing: 0.015em;
 }
 
 .long-text h5 {
@@ -406,6 +470,7 @@ hr:before {
 
 .long-text .sans-text {
   font-family: var(--font-sans);
+  font-feature-settings: var(--font-features-sans);
 }
 
 .long-text .sans-text p {
@@ -415,6 +480,7 @@ hr:before {
 
 .long-text .sans-text h1 {
   font-family: var(--font-sans);
+  font-feature-settings: var(--font-features-sans);
   font-size: 1.75rem;
   font-weight: 380;
   margin-top: 1rem;
@@ -423,6 +489,7 @@ hr:before {
 
 .long-text .sans-text h2 {
   font-family: var(--font-sans);
+  font-feature-settings: var(--font-features-sans);
   font-size: 1.25rem;
   font-weight: 440;
   margin-top: 1rem;
@@ -431,10 +498,13 @@ hr:before {
 
 .long-text .sans-text h3 {
   font-family: var(--font-sans);
-  font-size: 1.1rem;
+  font-feature-settings: var(--font-features-sans);
   font-weight: var(--font-weight-sans-bold);
-  text-transform: uppercase;
-  letter-spacing: 0.03em;
+  font-size: calc(1.1rem * var(--caps-heading-size-multiplier));
+  line-height: var(--caps-heading-line-height);
+  text-transform: var(--caps-transform);
+  font-variant-caps: var(--caps-caps-variant);
+  letter-spacing: var(--caps-spacing);
   margin-top: 1rem;
   margin-bottom: 0.8rem;
 }
@@ -447,6 +517,7 @@ table, th, td, tbody tr {
 
 table {
   font-family: var(--font-sans);
+  font-feature-settings: var(--font-features-sans);
   font-size: var(--font-size-small);
   width: auto;
   margin-left: auto;
@@ -459,10 +530,12 @@ table {
 
 th {
   font-weight: var(--font-weight-sans-bold);
-  text-transform: uppercase;
-  letter-spacing: 0.03em;
+  font-size: calc(var(--font-size-small) * var(--caps-heading-size-multiplier));
+  line-height: var(--caps-heading-line-height);
+  text-transform: var(--caps-transform);
+  font-variant-caps: var(--caps-caps-variant);
+  letter-spacing: var(--caps-spacing);
   border-bottom: 1px solid var(--color-border-hint);
-  line-height: 1.2;
   background-color: var(--color-bg-alt-solid);
 }
 
@@ -526,12 +599,16 @@ sup {
 
 .footnote-ref a, .footnote {
   font-family: var(--font-sans);
+  font-feature-settings: var(--font-features-sans);
+  background-color: var(--color-bg-meta-solid);
+  color: var(--color-hint-strong);
   text-decoration: none;
   padding: 0 0.15rem;
-  border-radius: 4px;
+  margin-right: 0.15rem;
+  border-radius: 6px;
   transition: all 0.15s ease-in-out;
   font-style: normal;
-  font-weight: 500;
+  font-weight: 600;
 }
 
 .footnote-ref a:hover, .footnote:hover {
@@ -539,8 +616,257 @@ sup {
   color: var(--color-primary-light);
   text-decoration: none;
 }
+
+@media print {
+  sup {
+    font-size: 70% !important;
+  }
+
+  /* Don't use stylized footnotes in print. */
+  .footnote-ref a, .footnote {
+    font-family: var(--font-serif);
+    font-feature-settings: normal !important;
+    background-color: transparent !important;
+    color: var(--color-text) !important;
+    padding: 0 0.05rem !important;
+    font-weight: 400 !important;
+  }
+  
+  .footnote-ref a:hover, .footnote:hover {
+    background-color: transparent !important;
+    color: var(--color-text) !important;
+  }
+
+  /* Hide footnote return arrows/links in print */
+  .footnote-backref,
+  .footnote-return,
+  a[href^="#fnref"],
+  .reversefootnote {
+    display: none !important;
+  }
+
+  /* Also hide common up arrow characters */
+  .footnote::after[content*="↩"],
+  .footnote::after[content*="↑"] {
+    display: none !important;
+  }
+}
+
 {% endblock footnote_styles %}
 
+{% block print_styles %}
+/* Print media adjustments for better readability and layout */
+@media print {
+  @page {
+    /* Set page margins for physical page */
+    margin: 0.7in 0.95in 0.8in 0.95in;
+
+    @top-center {
+      content: "";
+    }
+    
+    @bottom-left {
+      content: "Formatted by Kash — github.com/jlevy/kash";
+      font-family: var(--font-sans) !important;
+      font-size: var(--font-size-small);
+      color: var(--color-tertiary) !important;
+      margin: 0 0 0.2in 0 !important;
+    }
+    
+    @bottom-right {
+      content: counter(page);
+      font-family: var(--font-sans) !important;
+      font-size: var(--font-size-small);
+      color: var(--color-tertiary) !important;
+      margin: 0 0 0.2in 0 !important;
+    }
+  }
+
+  :root {
+    /* Slightly larger fonts for print readability */
+    --font-size-normal: 1.1rem;
+    --font-size-small: 1.0rem;
+    --font-size-smaller: 0.9rem;
+    --font-size-mono: 0.9rem;
+  }
+
+    body {
+    /* Remove body margin since @page handles it */
+    margin: 0;
+    /* Ensure good line height for print */
+    line-height: 1.6;
+  }
+
+  /* Enable hyphenation and justification for main text content only */
+  p, blockquote {
+    hyphens: auto;
+    text-align: justify;
+  }
+
+
+
+  .long-text {
+    /* Remove shadows and borders that don't work well in print */
+    box-shadow: none !important;
+    border: none !important;
+    /* Add print-specific margins */
+    padding: 0;
+  }
+
+  /* Ensure tables don't break layout in print */
+  .table-container {
+    position: static;
+    transform: none;
+    left: auto;
+    width: 100%;
+    max-width: 100%;
+    overflow: visible;
+  }
+
+  table {
+    width: 100%;
+    max-width: 100%;
+    font-size: 0.9rem;
+  }
+
+  /* Adjust code blocks for print */
+  pre {
+    white-space: pre-wrap;
+    word-wrap: break-word;
+  }
+
+  /* Hide interactive elements that don't work in print */
+  .code-copy-button {
+    display: none !important;
+  }
+
+  /* Page break controls */
+  h1, h2, h3, h4, h5, h6 {
+    break-after: avoid;
+    page-break-after: avoid; /* Fallback for older browsers */
+    break-inside: avoid;
+    page-break-inside: avoid; /* Fallback for older browsers */
+  }
+
+  /* Avoid breaking these elements */
+  blockquote, pre, .code-block-wrapper, figure, .table-container {
+    break-inside: avoid;
+    page-break-inside: avoid; /* Fallback for older browsers */
+  }
+
+  /* Control text flow */
+  p {
+    orphans: 3; /* Minimum lines at bottom of page */
+    widows: 3;  /* Minimum lines at top of page */
+  }
+
+  /* Keep list items together when reasonable */
+  li {
+    break-inside: avoid-page;
+    page-break-inside: avoid; /* Fallback for older browsers */
+  }
+  
+  /* Hide doc metadata details in print (for now) */
+  details.metadata {
+    display: none !important;
+  }
+
+  /* XXX: long endnote lists cut off the numbers. This is a workaround:
+   * Custom numbering system for ordered lists using Grid for alignment */
+  ol {
+    list-style: none;
+    counter-reset: list-counter;
+    padding-left: 0;
+    margin-left: 1rem;
+  }
+
+  ol > li {
+    display: grid;
+    /* col 1: fixed width for numbers up to 999. col 2: for the content */
+    grid-template-columns: 2.5rem 1fr;
+    gap: 0 0.5rem; /* Space between number and content */
+    align-items: baseline; /* Aligns number with first line of text */
+    counter-increment: list-counter;
+    /* Override global li styles for grid layout */
+    margin-top: 0;
+    margin-bottom: 0.5rem;
+    position: static;
+  }
+
+  ol > li::before {
+    content: counter(list-counter) ".";
+    text-align: right;
+    font-family: var(--font-serif);
+  }
+
+  /* Place all direct children of li into the second grid column */
+  /* This makes p, ul, etc. stack vertically as intended */
+  ol > li > * {
+    grid-column: 2;
+    word-break: break-word;
+    overflow-wrap: break-word;
+    hyphens: auto;
+  }
+
+  /* Override justification for content within list items */
+  ol > li p,
+  ol > li blockquote {
+    text-align: left !important;
+    text-justify: none !important;
+    margin-top: 0; /* Tighter spacing inside list items */
+  }
+
+  /* --- Reset for Nested Lists --- */
+  /* This prevents nested lists from inheriting the grid layout */
+  ol ol {
+    margin-left: 1.5rem;
+    margin-top: 0.5rem;
+    list-style: decimal outside;
+    counter-reset: initial; /* Don't inherit parent counter */
+  }
+
+  ol ul {
+    margin-left: 1.5rem;
+    margin-top: 0.5rem;
+    list-style: none; /* We'll restore bullets with ::before */
+  }
+
+  ol ol > li {
+    display: list-item !important; /* Revert from grid to standard list item */
+    padding-left: 0.25rem;
+    margin-top: 0.4rem; /* Override global li margin for tighter spacing */
+    position: static; /* Override global li position */
+    /* Override justification from parent rules */
+    text-align: left !important;
+    text-justify: none !important;
+  }
+
+  ol ul > li {
+    display: list-item !important; /* Revert from grid to standard list item */
+    padding-left: 0.25rem;
+    margin-top: 0.4rem; /* Override global li margin for tighter spacing */
+    position: relative; /* Need relative positioning for bullet ::before */
+    /* Override justification from parent rules */
+    text-align: left !important;
+    text-justify: none !important;
+  }
+
+  /* Remove the custom counter from nested ol */
+  ol ol > li::before {
+    content: "" !important;
+  }
+
+  /* Restore bullets for nested ul within ol */
+  ol ul > li::before {
+    content: "▪︎";
+    position: absolute;
+    left: -.85rem;
+    top: .25rem;
+    font-size: 0.62rem;
+  }
+}
+{% endblock print_styles %}
+
 {% block responsive_styles %}
 /* Bleed wide on larger screens. */
 /* TODO: Don't make so wide if table itself isn't large? */
@@ -662,6 +988,12 @@ sup {
     max-width: none;
   }
   
+  /* Smaller table text on mobile. */
+  table code,
+  table pre {
+    font-size: var(--font-size-mono-small);
+  }
+  
   ul, ol {
     margin-left: 1rem;
   }

kash/web_gen/templates/base_webpage.html.jinja

@@ -152,6 +152,17 @@
       src: url(https://cdn.jsdelivr.net/fontsource/fonts/pt-serif@latest/latin-700-italic.woff2) format('woff2');
       unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
     }
+    /* PT Serif has a known bug with quote alignment that can look quite ugly.
+     * https://nedbatchelder.com/blog/201809/fixing_pt_serif.html?utm_source=chatgpt.com
+     * So we use a workaround to use punctuation from a different local font.
+     * After trying a few, it seems Georgia is workable for quote marks an non-oriented ASCII quotes. */
+    @font-face {
+      font-family: 'LocalPunct';
+      src: local('Georgia');
+      unicode-range: 
+        U+0022, U+0027,                  /* " ' */
+        U+2018, U+2019, U+201C, U+201D;  /* ‘ ’ “ ” */
+    }
     /* https://fontsource.org/fonts/source-sans-3/cdn */
     /* source-sans-3-latin-wght-normal */
     @font-face {

kash/web_gen/templates/components/toc_styles.css.jinja

@@ -84,15 +84,18 @@
 /* TOC Styling */
 .toc {  
   font-family: var(--font-sans);
+  font-feature-settings: var(--font-features-sans);
   color: var(--color-tertiary);
   font-variant-numeric: tabular-nums;
 }
 
 .toc-title {
-  font-size: var(--font-size-small);
   font-weight: 550;
-  text-transform: uppercase;
-  letter-spacing: 0.025em;
+  font-size: calc(var(--font-size-small) * var(--caps-heading-size-multiplier));
+  line-height: var(--caps-heading-line-height);
+  text-transform: var(--caps-transform);
+  font-variant-caps: var(--caps-caps-variant);
+  letter-spacing: var(--caps-spacing);
   padding-left: 0.3rem;
   border-bottom: 1px solid var(--color-border-hint);
   border-left: none !important; /* Override toc-link border */
@@ -281,4 +284,13 @@ body.toc-open {
     visibility: visible;
     pointer-events: auto; /* Re-enable interaction */
   }
+} 
+
+@media print {
+  /* Hide TOC on print */
+  .toc-toggle,
+  .toc-backdrop,
+  .toc-container {
+    display: none !important;
+  }
 } 

kash/web_gen/templates/components/tooltip_styles.css.jinja

@@ -67,6 +67,7 @@
   border-left: 2px solid var(--color-primary);
   color: var(--color-text);
   font-family: var(--font-sans);
+  font-feature-settings: var(--font-features-sans);
   font-size: var(--font-size-small);
   line-height: 1.4;
   padding: var(--tooltip-padding);

kash/web_gen/templates/content_styles.css.jinja

@@ -7,6 +7,7 @@
 
 .citation {
   font-family: var(--font-sans);
+  font-feature-settings: var(--font-features-sans);
   color: var(--color-secondary);
   display: inline-block;
   height: 1.3rem;
@@ -37,6 +38,7 @@
 
 .description {
   font-family: var(--font-sans);
+  font-feature-settings: var(--font-features-sans);
   font-size: var(--font-size-small);
   color: var(--color-secondary);
   margin: 2rem 0;
@@ -44,6 +46,7 @@
 
 .summary {
   font-family: var(--font-sans);
+  font-feature-settings: var(--font-features-sans);
   font-size: var(--font-size-small);
   margin: 1rem 0;
   padding: 1rem;
@@ -54,15 +57,19 @@
   display: block;
   text-align: center;
   font-family: var(--font-sans);
+  font-feature-settings: var(--font-features-sans);
   font-weight: 500;
-  font-size: 1.2rem;
-  text-transform: uppercase;
-  letter-spacing: 0.02em;
+  font-size: calc(1.2rem * var(--caps-heading-size-multiplier));
+  line-height: var(--caps-heading-line-height);
+  text-transform: var(--caps-transform);
+  font-variant-caps: var(--caps-caps-variant);
+  letter-spacing: var(--caps-spacing);
   margin-bottom: 0.5rem;
 }
 
 .concepts {
   font-family: var(--font-sans);
+  font-feature-settings: var(--font-features-sans);
   font-size: var(--font-size-small);
   font-weight: bold;
   margin: 2rem 0;
@@ -79,10 +86,13 @@
   display: block;
   text-align: center;
   font-family: var(--font-sans);
+  font-feature-settings: var(--font-features-sans);
   font-weight: 500;
-  font-size: 1.2rem;
-  text-transform: uppercase;
-  letter-spacing: 0.02em;
+  font-size: calc(1.2rem * var(--caps-heading-size-multiplier));
+  line-height: var(--caps-heading-line-height);
+  text-transform: var(--caps-transform);
+  font-variant-caps: var(--caps-caps-variant);
+  letter-spacing: var(--caps-spacing);
   margin-bottom: 0.5rem;
 
   /* Hack to center the header above the columns */
@@ -106,10 +116,13 @@
   max-width: 10rem;
   text-align: center;
   font-family: var(--font-sans);
-  font-size: var(--font-size-small);
+  font-feature-settings: var(--font-features-sans);
   font-weight: 600;
-  text-transform: uppercase;
-  letter-spacing: 0.02em;
+  font-size: calc(var(--font-size-small) * var(--caps-heading-size-multiplier));
+  line-height: var(--caps-heading-line-height);
+  text-transform: var(--caps-transform);
+  font-variant-caps: var(--caps-caps-variant);
+  letter-spacing: var(--caps-spacing);
   line-height: 1.2;
   padding: 0 0.5rem;
   border-bottom-width: 2px;
@@ -171,6 +184,7 @@
   order: 0;
   margin: 0.5rem 1rem 0.5rem 0;
   font-family: var(--font-sans);
+  font-feature-settings: var(--font-features-sans);
   color: var(--color-secondary);
   border-right: 2px solid var(--color-hint);
   padding-right: 0.5rem;