Something went wrong. Try again.
a pds written in elixir tempest.desertthunder.dev
Something went wrong. Try again.
6.3 kB · 295 lines
CSS
at main
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296.changelog-page__windows { display: grid;}
.word-processor { display: grid; grid-template-rows: auto auto auto minmax(0, 1fr) auto; width: min(72rem, 100%); height: 100%; min-height: 0; margin-inline: auto; overflow: hidden; background: var(--surface); box-shadow: var(--border-out), var(--shadow-window);}
.word-processor__titlebar { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); min-height: 1.95rem; padding: 0.2rem var(--space-2); color: white; background: linear-gradient(90deg, var(--win-title), var(--win-title-soft)); font-size: var(--step--1); font-weight: 700;}
.word-processor__titlebar-label { display: flex; min-width: 0; align-items: center; gap: var(--space-2);}
.word-processor__titlebar-label span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.word-processor__titlebar img,.word-processor__tool img { flex: none; image-rendering: pixelated;}
.word-processor__toolbar { display: flex; flex-wrap: wrap; gap: var(--space-2); align-items: center; padding: var(--space-2); background: var(--surface); box-shadow: inset 0 -1px 0 var(--win-shadow), inset 0 1px 0 var(--win-light);}
.word-processor__tool { display: inline-flex; align-items: center; justify-content: center; gap: var(--space-1); min-width: 4.4rem; min-height: 2.25rem; padding: 0.2rem var(--space-3); border: 0; color: var(--text); background: var(--surface); box-shadow: var(--border-out); font: inherit; font-size: var(--step--1); font-weight: 700; transition-property: background-color, transform; transition-duration: 120ms; transition-timing-function: ease-out;}
.word-processor__tool:hover { background: var(--surface-raised); transform: translate(-1px, -1px);}
.word-processor__tool:active { transform: scale(0.96); box-shadow: var(--border-in);}
.word-processor__tool:disabled { cursor: default; opacity: 0.72;}
.word-processor__tool:disabled:hover { background: var(--surface); transform: none;}
.word-processor__ruler { display: grid; grid-template-columns: repeat(5, 1fr); gap: var(--space-2); padding: 0.28rem var(--space-4); color: var(--muted); background: repeating-linear-gradient(90deg, transparent 0 1.85rem, rgb(0 0 0 / 0.18) 1.85rem 1.9rem), var(--surface-raised); box-shadow: inset 0 -1px 0 var(--win-shadow);}
.word-processor__ruler span { height: 0.5rem; border-inline-start: 1px solid var(--win-dark);}
.word-processor__workspace { min-height: 0; padding: clamp(0.75rem, 2vw, 1.5rem); overflow: auto; background: linear-gradient(90deg, rgb(0 0 0 / 0.06) 1px, transparent 1px), linear-gradient(180deg, rgb(0 0 0 / 0.06) 1px, transparent 1px), #b8b8b2; background-size: 1.5rem 1.5rem; box-shadow: var(--border-in);}
.word-processor__page { width: min(48rem, 100%); min-height: 58rem; margin-inline: auto; padding: clamp(1.25rem, 4vw, 3.5rem); color: #141414; background: #fffef8; box-shadow: 0 0 0 1px rgb(0 0 0 / 0.18), 0.65rem 0.65rem 0 rgb(0 0 0 / 0.18);}
.word-processor__document-header { padding-block-end: var(--space-4); border-bottom: 2px solid #dad7c7;}
.word-processor__document-header p { margin: 0 0 var(--space-2); color: var(--muted); font-family: var(--font-mono); font-size: var(--step--1);}
.word-processor__document-header h1 { margin: 0; font-family: Georgia, "Times New Roman", serif; font-size: var(--step-2); line-height: var(--leading-tight); text-wrap: balance;}
.word-processor__document-header dl { display: flex; flex-wrap: wrap; gap: var(--space-2); margin: var(--space-3) 0 0; font-size: var(--step--1);}
.word-processor__document-header div { display: flex; gap: var(--space-2); padding: 0.15rem var(--space-2); border: 1px solid #dad7c7; background: #f7f4e7;}
.word-processor__document-header dt { font-weight: 700;}
.word-processor__document-header dd { margin: 0; font-family: var(--font-mono);}
.word-processor__article { padding-block-start: var(--space-4); font-family: Georgia, "Times New Roman", serif; line-height: 1.62;}
.word-processor__article > * + *,.word-processor__source > * + * { margin-block-start: var(--space-3);}
.word-processor__article h1,.word-processor__article h2,.word-processor__article h3 { line-height: var(--leading-tight); text-wrap: balance;}
.word-processor__article h2 { margin-block-start: var(--space-6); padding-block-end: var(--space-1); border-bottom: 1px solid #dad7c7; font-size: var(--step-1);}
.word-processor__article h3 { margin-block-start: var(--space-5); font-size: 1.05rem;}
.word-processor__article p,.word-processor__article li { text-wrap: pretty;}
.word-processor__article code,.word-processor__source code { padding: 0.05rem 0.2rem; background: #f1edd9; font-family: var(--font-mono); font-size: 0.86em;}
.word-processor__article pre,.word-processor__source pre { max-width: 100%; padding: var(--space-3); overflow: auto; background: #f7f4e7; box-shadow: inset 0 0 0 1px #dad7c7; font-size: 0.82rem;}
.word-processor__article pre code,.word-processor__source pre code { padding: 0; background: transparent;}
.word-processor__source { margin-block-start: var(--space-6); padding-block-start: var(--space-4); border-top: 1px dashed #bcb7a0; font-family: var(--font-ui); font-size: var(--step--1);}
.word-processor__source summary { width: fit-content; cursor: pointer; font-weight: 700;}
.word-processor__statusbar { display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-4); align-items: center; justify-content: space-between; padding: var(--space-2) var(--space-3); font-size: var(--step--1); box-shadow: inset 0 1px 0 var(--win-light);}
@media (max-width: 55rem) { .word-processor { width: 100%; }}
@media (max-width: 38rem) { .word-processor__toolbar { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.word-processor__tool { min-width: 0; width: 100%; }
.word-processor__workspace { padding: var(--space-2); }
.word-processor__page { min-height: auto; }}