More visual tweaks
This commit is contained in:
parent
537e279780
commit
0b0cc6fda5
4 changed files with 71 additions and 87 deletions
70
generate.scm
70
generate.scm
|
|
@ -40,8 +40,8 @@
|
|||
,(date-range (field tc 'date-start) (field tc 'date-end)))
|
||||
(div (@ (class "title-meta"))
|
||||
,(field tc 'company) " • " ,(field tc 'location))
|
||||
(div (@ (class "title-blurb"))
|
||||
,(bullets (field tc 'blurb)))))
|
||||
(p (@ (class "title-blurb"))
|
||||
,(string-join (field tc 'blurb) " "))))
|
||||
|
||||
;; Emit a title card followed by its project cards as a flat list of siblings
|
||||
(define (render-title-flat tc)
|
||||
|
|
@ -130,6 +130,43 @@
|
|||
(list `(h2 (@ (class "sec-heading")) ,cur-label))
|
||||
cur-items)))))))
|
||||
|
||||
;; ─── Column distribution ───────────────────────────────────────────────────────
|
||||
;; Wrap all items in two independent divs, splitting at the midpoint.
|
||||
;; Because each col is a separate block formatting context, expanding a card
|
||||
;; pushes siblings down within that col only — no cross-column movement,
|
||||
;; no hover loop.
|
||||
;;
|
||||
;; num-columns: change to 3 if your resume gets too long, and update the
|
||||
;; CSS grid-template-columns to match.
|
||||
|
||||
(define num-columns 3)
|
||||
|
||||
(define (heading? item)
|
||||
(and (pair? item) (eq? (car item) 'h2)))
|
||||
|
||||
(define (list-ref* lst i)
|
||||
(if (= i 0) (car lst) (list-ref* (cdr lst) (- i 1))))
|
||||
|
||||
(define (split-into-columns items n)
|
||||
(let* ((total (length items))
|
||||
(chunk (inexact->exact (ceiling (/ total n)))))
|
||||
(let loop ((i 0) (start 0) (remaining n) (acc '()))
|
||||
(if (= remaining 1)
|
||||
(reverse (cons `(div (@ (class "col")) ,@(list-tail items start)) acc))
|
||||
(let* ((raw-end (min (+ start chunk) total))
|
||||
;; Walk backwards from the cut point: if the last item
|
||||
;; in this slice is a heading (orphaned at col bottom),
|
||||
;; move it to the next column.
|
||||
(end (let nudge ((e raw-end))
|
||||
(if (and (> e (+ start 1))
|
||||
(heading? (list-ref* items (- e 1))))
|
||||
(nudge (- e 1))
|
||||
e))))
|
||||
(loop (+ i 1) end (- remaining 1)
|
||||
(cons `(div (@ (class "col"))
|
||||
,@(list-tail (list-head items end) start))
|
||||
acc)))))))
|
||||
|
||||
;; ─── Front matter ─────────────────────────────────────────────────────────────
|
||||
|
||||
(define (render-front-matter fm)
|
||||
|
|
@ -143,40 +180,19 @@
|
|||
|
||||
(define (render-resume res)
|
||||
(let* ((fm (field res 'front-matter))
|
||||
(items (sections->flat-items (field res 'sections))))
|
||||
(items (sections->flat-items (field res 'sections)))
|
||||
(cols (split-into-columns items num-columns)))
|
||||
`(*TOP*
|
||||
(html (@ (lang "en"))
|
||||
(head
|
||||
(meta (@ (charset "UTF-8")))
|
||||
(meta (@ (name "viewport") (content "width=device-width, initial-scale=1")))
|
||||
(title ,(field fm 'name))
|
||||
(link (@ (rel "stylesheet") (href "style.css")))
|
||||
;; Measure the front-matter height after every resize/zoom and
|
||||
;; set .columns height to exactly fill the remaining space.
|
||||
(script "
|
||||
function setColHeight() {
|
||||
var fm = document.querySelector('.front-matter');
|
||||
var col = document.querySelector('.columns');
|
||||
if (!fm || !col) return;
|
||||
var used = fm.getBoundingClientRect().height
|
||||
+ parseInt(getComputedStyle(document.body).paddingTop) * 2;
|
||||
col.style.height = (window.innerHeight - used) + 'px';
|
||||
}
|
||||
window.addEventListener('load', setColHeight);
|
||||
window.addEventListener('resize', setColHeight);
|
||||
// zoom via ctrl+/- fires resize in most browsers, but also poll as fallback
|
||||
var _lastW = window.innerWidth, _lastH = window.innerHeight;
|
||||
setInterval(function() {
|
||||
if (window.innerWidth !== _lastW || window.innerHeight !== _lastH) {
|
||||
_lastW = window.innerWidth; _lastH = window.innerHeight;
|
||||
setColHeight();
|
||||
}
|
||||
}, 200);
|
||||
"))
|
||||
(link (@ (rel "stylesheet") (href "style.css"))))
|
||||
(body
|
||||
,(render-front-matter fm)
|
||||
(main (@ (class "columns"))
|
||||
,@items))))))
|
||||
,@cols))))))
|
||||
|
||||
(display "<!DOCTYPE html>\n")
|
||||
(sxml->xml (render-resume resume))
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue