1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88

(define-module (html-wrapper)
  #:use-module (ice-9 optargs)
  #:export (html-wrapper))

(define (str-replace str find-char replace-str)
  (string-join (string-split str find-char) replace-str))

(define (minimize-css css)
  css
  ;; (str-replace (str-replace (str-replace css #\space "")
  ;;                           #\newline "") #\} "} ")
  )

(define adwcss (minimize-css
                "body{color: #F6F5F4; background: #241F31; font-family:Cantarell, sans-serif;}
a { color: #99C1F1; text-decoration: none; }
a:hover { color: #C061CB; text-decoration: underline; }
a:visted { color: #DC8ADD }
.raw-link { font-size: 0.6em; margin-left: 2em; }
.small { font-size:0.6em; }
.icon { margin-right: 0.5em; }
td { padding-left: 1em;}
.date-row { padding-left: 1em; color: #C0BFBC; }
 .file-view .contents {white-space: nowrap;}
 .file-view.image .contents img { background-image: linear-gradient(gray, darkgray); }
 .line-numbers{ width: 2em; text-align:end; border-top: solid #3D3846 1px; border-bottom: solid #3D3846 1px; padding-top:2px; padding-bottom:2px; padding-right: 1em;}
 .file-content{ padding-left:1em; padding-right:2em; border-left: solid #3D3846 1px; border-top: solid #3D3846 1px; border-bottom: solid #3D3846 1px; padding-top:2px; padding-bottom:2px;}
 .file-view pre {
display: inline-block;
color: #DEDDDA
background: #241F31;
background-image: -webkit-linear-gradient(#140F21 50%, #191522 50%);
background-image:    -moz-linear-gradient(#140F21 50%, #191522 50%);
background-image:     -ms-linear-gradient(#140F21 50%, #191522 50%);
background-image:      -o-linear-gradient(#140F21 50%, #191522 50%);
background-image:         linear-gradient(#140F21 50%, #191522 50%);
background-position: 2px 2px;
background-repeat: repeat;
background-size: 2.5em 2.5em;
line-height: 1.25em;
font-size: 1em;}
h4 {margin-bottom:0px;}
.flatpak { display: flex; gap: 20px; margin-top: 20px; }
.flatpak .platform { border: solid 1px #3D3846; text-align:center; padding: 10px; }
.flatpak .icon { font-size: 64px; margin:0px; }
.flatpak a:hover { text-decoration: none;}
.flatpak .small { padding-left: 10px; }
.rendered-markup.org .figure { display: inline-block; }"))

(define discss (minimize-css
                "body{font-family:Mono;}
 .file-view .contents {white-space: nowrap;}
 .file-view.image .contents img { background-image: linear-gradient(gray, darkgray); }
 .line-numbers{ padding-right:4px; border-top: solid gray 1px; border-bottom: solid gray 1px; padding-top:2px; padding-bottom:2px;}
 .file-content{ padding-left:5px; border-left: solid gray 1px; border-top: solid gray 1px; border-bottom: solid gray 1px; padding-top:2px; padding-bottom:2px;}
 .file-view pre {
display: inline-block;
background: #fefefe;
background-image: -webkit-linear-gradient(#fefefe 50%, #f7f7f7 50%);
background-image:    -moz-linear-gradient(#fefefe 50%, #f7f7f7 50%);
background-image:     -ms-linear-gradient(#fefefe 50%, #f7f7f7 50%);
background-image:      -o-linear-gradient(#fefefe 50%, #f7f7f7 50%);
background-image:         linear-gradient(#fefefe 50%, #f7f7f7 50%);
background-position: 2px 2px;
background-repeat: repeat;
background-size: 2.5em 2.5em;
line-height: 1.25em;
font-size: 1em;}
h4 {margin-bottom:0px;}
.rendered-markup.org .figure { display: inline-block; }
"))
;; .rendered-markup.org p, .rendered-markup.org h1, .rendered-markup.org h2, .rendered-markup.org h3, .rendered-markup.org h4 {margin: 0px;}

(define mincss adwcss)

(define* (html-wrapper title content #:key (favicon #f))
  `(html
    (head
     (title ,title)
     (style ,mincss)
     (meta (@ (http-equiv "content-type") (content "text/html; charset=utf-8")))
     ,(if favicon
          `(link (@ (rel "icon")
                   ;; TODO match mime from extension
                   ;; (type "image/x-icon")
                   (href ,favicon)))
          '()))
    (body ,content)))