Skip to content

Commit

Permalink
0.1.16
Browse files Browse the repository at this point in the history
  • Loading branch information
BenjaminAster committed Feb 4, 2023
1 parent 85e6410 commit bf9e9c1
Show file tree
Hide file tree
Showing 18 changed files with 190 additions and 139 deletions.
6 changes: 6 additions & 0 deletions CONTRIBUTING.md
Original file line number Diff line number Diff line change
Expand Up @@ -31,6 +31,12 @@
## VSCode settings:

```jsonc
// Type checking for JavaScript:
"js/ts.implicitProjectConfig.target": "ESNext",
"js/ts.implicitProjectConfig.checkJs": true,
"js/ts.implicitProjectConfig.strictNullChecks": false,
"js/ts.implicitProjectConfig.strictFunctionTypes": false,

// CSS:
"css.lint.unknownProperties": "ignore",
"css.lint.unknownAtRules": "ignore",
Expand Down
Binary file added assets/computer-modern/bold-italic.otf
Binary file not shown.
Binary file added assets/computer-modern/bold.otf
Binary file not shown.
Binary file added assets/computer-modern/italic.otf
Binary file not shown.
Binary file added assets/computer-modern/normal.otf
Binary file not shown.
4 changes: 2 additions & 2 deletions assets/introduction.pamm
Original file line number Diff line number Diff line change
Expand Up @@ -48,8 +48,8 @@ Extended list of operators, symbols, etc.:
- Implication arrows: `n ==> 1` becomes { n ==> 1 }, `n <== 1` becomes { n <== 1 }, `n <==> 1` becomes { n <==> 1 }
- Plus-minus: `n +- 1` becomes { n +- 1 }
- Greek letters: `alpha` becomes { alpha }, `Gamma` becomes { Gamma }, etc. The final sigma ({ finsigma }) is written as `finsigma`, like in LaTeX.
- Sum: `sum(n=1, 5, n^^)` is rendered as { sum(n=1, 5, n^^) }
- Integral: `int(0, 2, x^^, x)` is rendered as { int(0, 2, x^^, x) }
- Sum: `sum(n=1, 5, n^^)` is rendered as +{ sum(n=1, 5, n^^) }
- Integral: `int(0, 2, x^^, x)` is rendered as +{ int(0, 2, x^^, x) }

Examples:
`(sum(k=1, n, a_k b_k))^^ <= (sum(k=1, n, a_k^^))(sum(k=1, n, b_k^^))` is rendered as:
Expand Down
Binary file added assets/latinmodern-math/normal.otf
Binary file not shown.
47 changes: 47 additions & 0 deletions css/global.css
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,53 @@

@import url("./icons.css") layer(icons);

/* Latin Modern Math font: */

@font-face {
font-family: "Latin Modern Math";
font-display: swap;
src: local("Latin Modern Math"), local("LatinModernMath-Regular"), url("../assets/latinmodern-math/normal.otf");
/* Source: https://tug.org/svn/texlive/trunk/Master/texmf-dist/fonts/opentype/public/lm-math/latinmodern-math.otf?revision=36915 */
}

/* Computer Modern Serif font: */

@font-face {
font-family: "Computer Modern Serif";
font-display: swap;
src: local("Computer Modern Serif"), url("../assets/computer-modern/normal.otf");
/* Source: https://mirrors.ctan.org/fonts/cm-unicode/fonts/otf/cmunrm.otf */
}

@font-face {
font-family: "Computer Modern Serif";
font-display: swap;
font-weight: bold;
src: local("Computer Modern Serif"), url("../assets/computer-modern/bold.otf");
/* Source: https://mirrors.ctan.org/fonts/cm-unicode/fonts/otf/cmunrb.otf */
}

@font-face {
font-family: "Computer Modern Serif";
font-display: swap;
font-style: italic;
src: local("Computer Modern Serif"), url("../assets/computer-modern/italic.otf");
/* Source: https://mirrors.ctan.org/fonts/cm-unicode/fonts/otf/cmunti.otf */
}

@font-face {
font-family: "Computer Modern Serif";
font-display: swap;
font-style: italic;
font-weight: bold;
src: local("Computer Modern Serif"), url("../assets/computer-modern/bold-italic.otf");
/* Source: https://mirrors.ctan.org/fonts/cm-unicode/fonts/otf/cmunbi.otf */
}

math {
font-family: "Latin Modern Math", math;
}

:root {
scrollbar-color: blueViolet transparent;
}
Expand Down
61 changes: 32 additions & 29 deletions css/main.css
Original file line number Diff line number Diff line change
Expand Up @@ -17,31 +17,6 @@

@layer main {
:root {
color-scheme: dark;

--background: #1b1b1e;
--gray-1: #2b2b2e;
--gray-2: #3b3b3e;
--gray-3: #4b4b4e;
--transparent-background: #1115;
--transparent-gray-1: #3335;
--transparent-gray-2: #5555;
--shadow-color: #0004;

--titlebar-area-inline-start: env(titlebar-area-x, 0);
--titlebar-area-inline-size: env(titlebar-area-width, 0);
--titlebar-area-inline-end: calc(100dvi - env(titlebar-area-x, 0) - env(titlebar-area-width, 0));
--titlebar-area-block-start: env(titlebar-area-y, 0);
--titlebar-area-block-size: env(titlebar-area-height, 0);
--titlebar-area-block-end: calc(100dvb - env(titlebar-area-y, 0) - env(titlebar-area-height, 0));

--px: calc(1rem / 16);

-webkit-text-size-adjust: none;
text-size-adjust: none;
}

:root:is(.light-theme, .printing) {
color-scheme: light;
--background: white;
--transparent-background: #eee4;
Expand All @@ -53,8 +28,37 @@
--shadow-color: #8885;
}

body {
@media screen {
:root:not(.light-theme) {
color-scheme: dark;
--background: #1b1b1e;
--transparent-background: #1115;
--transparent-gray-1: #3335;
--transparent-gray-2: #5555;
--gray-1: #2b2b2e;
--gray-2: #3b3b3e;
--gray-3: #4b4b4e;
--shadow-color: #0004;
}
}

:root {
--titlebar-area-inline-start: env(titlebar-area-x, 0px);
--titlebar-area-inline-size: env(titlebar-area-width, 0px);
--titlebar-area-inline-end: calc(100dvi - env(titlebar-area-x, 0px) - env(titlebar-area-width, 0px));
--titlebar-area-block-start: env(titlebar-area-y, 0px);
--titlebar-area-block-size: env(titlebar-area-height, 0px);
--titlebar-area-block-end: calc(100dvb - env(titlebar-area-y, 0px) - env(titlebar-area-height, 0px));

--px: calc(1rem / 16);

font-family: system-ui, sans-serif;
background-color: var(--background);
-webkit-text-size-adjust: none;
text-size-adjust: none;
}

body {
box-sizing: border-box;
margin: 0;
block-size: 100dvb;
Expand All @@ -66,7 +70,6 @@
"main"; */
display: flex;
flex-direction: column;
background-color: var(--background);
overflow: hidden;
/* overflow: clip; */
}
Expand Down Expand Up @@ -106,8 +109,8 @@
:root:is(.translated-rtl, :lang(ar), :lang(iw), :lang(ps), :lang(fa), :lang(sd), :lang(ur), :lang(ug), :lang(yi)) {
direction: rtl;

--titlebar-area-inline-start: calc(100vw - env(titlebar-area-x, 0) - env(titlebar-area-width, 0));
--titlebar-area-inline-end: env(titlebar-area-x, 0);
--titlebar-area-inline-start: calc(100dvi - env(titlebar-area-x, 0px) - env(titlebar-area-width, 0px));
--titlebar-area-inline-end: env(titlebar-area-x, 0px);
}

@media not all and (display-mode: browser) {
Expand Down
17 changes: 14 additions & 3 deletions html/editor.c.html
Original file line number Diff line number Diff line change
Expand Up @@ -18,14 +18,15 @@
box-sizing: border-box;
}

:root[data-editorlayout="stacked"] :host {
:root[data-editor-layout="stacked"] :host {
grid-template-areas:
"text-input text-input"
"html-output html-output";
}

.text-input {
grid-area: text-input;
/* font-family: ui-monospace, monospace; */
font-family: ui-monospace, monospace;
font-size: 1.1rem;
margin: .7rem;
Expand All @@ -47,13 +48,15 @@
}

.html-output {
font-family: "Computer Modern", "Noto Serif", ui-serif, serif;
font-family: "Computer Modern Serif", "Noto Serif", ui-serif, serif;
grid-area: html-output;
padding: 1rem;
padding-block-start: 0;
/* overflow-y: auto; */
overflow: auto;
overflow-wrap: break-word;
font-size: 1.1rem;
line-height: 1.8rem;
}

.html-output .section {
Expand All @@ -63,10 +66,18 @@

.html-output code {
white-space: pre-wrap;
font-family: "FreeMono", "Courier New", ui-monospace, monospace;
/* padding: .05em .15em; */
/* padding: .0em .15em; */
padding-inline: .2em;
/* border: 1px solid #8885; */
/* border-radius: .2em; */
background-color: var(--gray-1);
font-size: .8em;
}

:root[data-engine=blink] :host .html-output .integral {
font-size: 1.5em;
/* font-size: 1.5em; */
}

:root[data-engine=blink] :host .html-output :is(msqrt > *, mroot > :first-child) {
Expand Down
11 changes: 6 additions & 5 deletions html/header.c.html
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@

<header focusgroup="wrap">
<img src="./assets/icon.svg" class="icon" alt="icon of PAMM" />
<img src="./assets/icon.svg" class="icon" alt="icon of PAMM" width="1" height="1" />
<a href="https://github.com/BenjaminAster/PAMM" class="github icon:github" title="View on GitHub"></a>

<input type="text" class="file-name editor-only" title="File name" />
Expand Down Expand Up @@ -97,7 +97,7 @@
padding-block-start: calc(var(--titlebar-area-block-start) + var(--titlebar-area-block-size));
}
60% {
inline-size: 100vw;
inline-size: 100dvi;
padding-inline-start: max(var(--titlebar-area-inline-start), var(--padding-inline));
padding-inline-end: max(var(--titlebar-area-inline-end), var(--padding-inline));
}
Expand All @@ -108,8 +108,9 @@
}

img.icon {
inline-size: 1.5rem;
aspect-ratio: 1;
--size: 1.5rem;
inline-size: var(--size);
block-size: var(--size);
margin-inline-start: .3rem;
}

Expand All @@ -134,7 +135,7 @@
margin-inline-end: auto;
}

:root[data-editorlayout="stacked"] :host [data-action=toggle-editor-layout] {
:root[data-editor-layout="stacked"] :host [data-action=toggle-editor-layout] {
--icon: var(--icon-layout-rows);
}

Expand Down
11 changes: 8 additions & 3 deletions index.html
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
<!DOCTYPE html>
<html lang="en" class="loading" data-view="files" data-editorlayout="aside">
<html lang="en" class="loading" data-view="files" data-editor-layout="aside">

<head>
<meta charset="UTF-8" />
Expand All @@ -11,7 +11,7 @@
<meta name="theme-color" content="blueViolet" />
<meta property="og:image" content="https://benjaminaster.com/pamm/assets/icon.png" />

<title>PAMM [BETA]</title>
<title>PAMM</title>
<base href="./" />

<link rel="icon" href="./assets/icon.svg" type="image/svg+xml" />
Expand All @@ -37,9 +37,14 @@
<link rel="preload" as="fetch" crossorigin href="./html/header.c.html" />
<link rel="preload" as="fetch" crossorigin href="./html/files.c.html" />
<link rel="preload" as="fetch" crossorigin href="./assets/introduction.pamm" />
<link rel="preload" as="font" crossorigin href="./assets/latinmodern-math/normal.otf" />
<link rel="preload" as="font" crossorigin href="./assets/computer-modern/normal.otf" />
<link rel="preload" as="font" crossorigin href="./assets/computer-modern/bold.otf" />
<link rel="preload" as="font" crossorigin href="./assets/computer-modern/italic.otf" />
<link rel="preload" as="font" crossorigin href="./assets/computer-modern/bold-italic.otf" />

<script type="module">
if (!window.MathMLElement || !CSS.supports("(color: revert-layer)")) {
if (!window.MathMLElement || !CSS.supports("(block-size: 100dvb)")) {
window.open("/update-your-browser/?" + location.pathname, "_self");
}
</script>
Expand Down
Loading

0 comments on commit bf9e9c1

Please sign in to comment.