diff --git a/Makefile b/Makefile index 3f81f32..c58fb98 100644 --- a/Makefile +++ b/Makefile @@ -1,4 +1,4 @@ -.PHONY: all render models fabrication web clean +.PHONY: all clean BOARD = linht-hw @@ -7,6 +7,8 @@ FABHOUSES = jlcpcb pcbway # Markdown processing MARKDOWN_SRC := $(wildcard *.md) MARKDOWN_HTML := $(patsubst %.md, build/%.html, $(MARKDOWN_SRC)) +MARKDOWN_EXT := tables fenced_code codehilite attr_list def_list admonition toc +MARKDOWN_ARGS := $(foreach e,$(MARKDOWN_EXT),-x $(e)) # Copy templates TEMPLATE_SRC_DIR := present/template @@ -69,7 +71,7 @@ $(TEMPLATE_BUILD_DIR)/panel/$(BOARD)_panel.kicad_pcb: $(BOARD).kicad_pcb # Convert .md → build/.html using python-markdown build/%.html: %.md @mkdir -p build - python3 -m markdown $< > $@ + python3 -m markdown $(MARKDOWN_ARGS) $< > $@ build/%.html.j2: present/template/%.html.j2 @mkdir -p build diff --git a/README.md b/README.md index 04e4c91..38242cc 100644 --- a/README.md +++ b/README.md @@ -179,9 +179,9 @@ Flashing is done using **NXP Universal Update Utility (uuu)**. (hold the secondary side button while powering on) 2. Flash using: - ```bash - uuu -v -b emmc_all imx-boot-mcm-imx93-sd.bin-flash_singleboot linht-image-mcm-imx93.rootfs.wic.zst - ``` +```bash +uuu -v -b emmc_all imx-boot-mcm-imx93-sd.bin-flash_singleboot linht-image-mcm-imx93.rootfs.wic.zst +``` Tool download: [mfgtools](https://github.com/nxp-imx/mfgtools/releases) diff --git a/present/template/css/style.css b/present/template/css/style.css new file mode 100644 index 0000000..b8e511b --- /dev/null +++ b/present/template/css/style.css @@ -0,0 +1,217 @@ +.render-row { + display: flex; + flex-wrap: wrap; + padding: 0 4px; +} + +/* Create four equal columns that sits next to each other */ +.render-col { + flex: 50%; + max-width: 50%; + padding: 0 4px; +} + +.render-col img { + margin-top: 8px; + vertical-align: middle; + width: 100%; +} + +/* Responsive layout - makes the two columns stack on top of each other instead of next to each other */ +@media screen and (max-width: 600px) { + .render-col { + flex: 100%; + max-width: 100%; + } +} + +.img-rounded { + border-radius:10% !important; +} + +.card-body { + /* Better reading width & spacing */ + font-size: 1.02rem; + line-height: 1.65; +} + +/* Reading width only for text content */ +.card-body > p, +.card-body > ul, +.card-body > ol, +.card-body > blockquote, +.card-body > pre, +.card-body > h1, +.card-body > h2, +.card-body > h3, +.card-body > h4, +.card-body > h5, +.card-body > h6 { + max-width: 80ch; +} + +/* Headings: better rhythm, slightly heavier, nicer spacing */ +.card-body h1, +.card-body h2, +.card-body h3, +.card-body h4, +.card-body h5, +.card-body h6 { + margin-top: 1.6em; + margin-bottom: 0.6em; + line-height: 1.25; + font-weight: 650; + letter-spacing: -0.015em; +} + +.card-body h1 { font-size: 2.0rem; margin-top: 0.4em; } +.card-body h2 { font-size: 1.5rem; border-bottom: 1px solid var(--bs-border-color); padding-bottom: .35rem; } +.card-body h3 { font-size: 1.25rem; } +.card-body h4 { font-size: 1.1rem; } + +/* Paragraphs + lists: consistent spacing */ +.card-body p { + margin: 0 0 0.9rem 0; +} + +.card-body ul, +.card-body ol { + margin: 0 0 1rem 1.1rem; + padding: 0; +} + +.card-body li { + margin-bottom: 0.25rem; +} + +/* Make nested list indentation feel nicer */ +.card-body ul ul, +.card-body ol ol, +.card-body ul ol, +.card-body ol ul { + margin-top: 0.35rem; + margin-bottom: 0.35rem; +} + +/* Links: subtle, readable */ +.card-body a { + text-decoration: none; + border-bottom: 1px solid rgba(13,110,253,.35); /* bootstrap primary-ish */ +} +.card-body a:hover { + border-bottom-color: rgba(13,110,253,.8); +} + +/* Blockquotes: turn into a clean “note” box */ +.card-body blockquote { + margin: 1rem 0; + padding: 0.75rem 1rem; + border-left: 4px solid var(--bs-border-color); + background: var(--bs-tertiary-bg); + border-radius: 0.5rem; +} +.card-body blockquote p:last-child { margin-bottom: 0; } + +/* Inline code: subtle pill */ +.card-body code { + padding: 0.15em 0.35em; + border-radius: 0.35rem; + background: rgba(0,0,0,.05); + font-size: 0.95em; +} + +/* Code blocks (```): good spacing, background, scroll if needed */ +.card-body pre { + margin: 1rem 0; + padding: 0.9rem 1rem; + border: 1px solid var(--bs-border-color); + border-radius: 0.75rem; + background: var(--bs-tertiary-bg); + overflow: auto; +} +.card-body pre code { + padding: 0; + background: transparent; + font-size: 0.95em; + line-height: 1.5; + display: block; +} + +/* Tables: readable borders + zebra stripes + padding */ +.card-body table { + width: 100%; + margin: 1rem 0; + border-collapse: separate; + border-spacing: 0; + border: 1px solid var(--bs-border-color); + border-radius: 0.75rem; + overflow: hidden; /* makes rounded corners work */ +} + +.card-body thead th { + background: var(--bs-tertiary-bg); + font-weight: 650; + border-bottom: 1px solid var(--bs-border-color); +} + +.card-body th, +.card-body td { + padding: 0.6rem 0.75rem; + vertical-align: top; + border-right: 1px solid var(--bs-border-color); +} + +.card-body th:last-child, +.card-body td:last-child { + border-right: none; +} + +.card-body tbody tr:not(:last-child) td { + border-bottom: 1px solid var(--bs-border-color); +} + +/* Zebra stripes */ +.card-body tbody tr:nth-child(2n) td { + background: rgba(0,0,0,.02); +} + +/* If tables are wide, allow horizontal scrolling on small screens */ +.card-body table { + width: 100%; +} + +@media (max-width: 768px) { + .card-body table { + display: block; + overflow-x: auto; + } +} + +/* Images inside markdown: look consistent */ +.card-body img { + max-width: 100%; + height: auto; + border-radius: 0.75rem; +} + +/* Horizontal rule: subtle */ +.card-body hr { + margin: 2rem 0; + border-top: 1px solid var(--bs-border-color); + opacity: 1; +} + +/* Optional: badge images should align nicely and not be huge */ +.card-body p img { + vertical-align: middle; +} + +/* Fix your flashing code block: currently it's inside

... */ +.card-body p > code { + white-space: pre-wrap; +} + +/* Improve the "card" reading feel a bit (optional) */ +.card .card-body { + padding: 1.75rem; +} diff --git a/present/template/index.html.j2 b/present/template/index.html.j2 index ed24420..57a4417 100644 --- a/present/template/index.html.j2 +++ b/present/template/index.html.j2 @@ -6,40 +6,8 @@ {{ name }} + - -