| 1 | {{define "layout"}}<!doctype html> |
| 2 | <html lang="{{block "lang" .}}en-GB{{end}}" dir="{{block "dir" .}}ltr{{end}}"{{if .ThemeAttr}} data-theme="{{.ThemeAttr}}"{{end}}> |
| 3 | <head> |
| 4 | <meta charset="utf-8"> |
| 5 | <meta name="viewport" content="width=device-width, initial-scale=1"> |
| 6 | <title>{{if ne .Title "Calendar"}}{{.Title}} · {{end}}Calendar</title> |
| 7 | <link rel="icon" type="image/png" sizes="32x32" href="{{asset "static/brand/icon-32.png"}}"> |
| 8 | <link rel="icon" type="image/svg+xml" href="{{asset "static/brand/icon.svg"}}"> |
| 9 | <link rel="apple-touch-icon" sizes="180x180" href="{{asset "static/brand/apple-touch-icon.png"}}"> |
| 10 | {{/* Onest, Calma's typeface, served by estilo (routes.go). Then the |
| 11 | spec's order: tokens, theme, brand, estilo base, menu, chrome, and the |
| 12 | app's own CSS last. busy.css is the 650ms busy rule; sky.css is the |
| 13 | sign-in door's sky. */}} |
| 14 | <link rel="stylesheet" href="/static/estilo/fonts/v1/fonts.css"> |
| 15 | <link rel="stylesheet" href="{{asset "static/tokens.css"}}"> |
| 16 | <link rel="stylesheet" href="{{asset "static/busy.css"}}"> |
| 17 | <link rel="stylesheet" href="{{asset "static/theme.css"}}"> |
| 18 | <link rel="stylesheet" href="{{asset "static/brand/brand.css"}}"> |
| 19 | <link rel="stylesheet" href="{{asset "static/base.css"}}"> |
| 20 | <link rel="stylesheet" href="{{asset "static/menu.css"}}"> |
| 21 | <link rel="stylesheet" href="{{asset "static/chrome.css"}}"> |
| 22 | <link rel="stylesheet" href="{{asset "static/sky.css"}}"> |
| 23 | <link rel="stylesheet" href="{{asset "static/calendar.css"}}"> |
| 24 | <script defer src="{{asset "static/rastrillo.js"}}"></script> |
| 25 | <script defer src="{{asset "static/busy.js"}}"></script> |
| 26 | <script defer src="{{asset "static/chrome.js"}}"></script> |
| 27 | {{iconAssets}} |
| 28 | <script defer src="{{asset "static/select.js"}}"></script> |
| 29 | <script defer src="{{asset "static/datetime.js"}}"></script> |
| 30 | <script defer src="{{asset "static/quickadd.js"}}"></script> |
| 31 | <script defer src="{{asset "static/booking.js"}}"></script> |
| 32 | <script defer src="{{asset "static/calendar.js"}}"></script> |
| 33 | {{block "head" .}}{{end}} |
| 34 | </head> |
| 35 | <body> |
| 36 | <div estilo-shell> |
| 37 | <a rst-skip href="#main">{{.Chrome.Labels.Skip}}</a> |
| 38 | {{template "estilo-bar" .Chrome}} |
| 39 | {{block "main" .}}<main rst-page id="main">{{template "content" .}}</main>{{end}} |
| 40 | <footer rst-shell-foot>{{block "foot" .}}{{end}}</footer> |
| 41 | </div> |
| 42 | </body> |
| 43 | </html>{{end}} |
| 44 | |
| 45 | {{/* calendar-toolbar is the one row under every view's header: step back, |
| 46 | Today, step forward, and the view switcher. It is the same partial in |
| 47 | Day, Week, Month and Agenda, and its visible labels are the same in all |
| 48 | four ("Previous", "Today", "Next"; the period is in the heading and in |
| 49 | each link's accessible name), so switching views or stepping through |
| 50 | them moves nothing. A view's own lead line (the day's sentence, the |
| 51 | agenda's scope) sits BELOW this row, never above it. */}} |
| 52 | {{define "calendar-toolbar"}}<div cal-bar> |
| 53 | <div cal-bar-steps> |
| 54 | <a rst-btn href="{{.Prev}}">Previous<span class="rst-sr-only"> {{.Noun}}</span></a> |
| 55 | <a rst-btn href="{{.Today}}">Today</a> |
| 56 | <a rst-btn href="{{.Next}}">Next<span class="rst-sr-only"> {{.Noun}}</span></a> |
| 57 | </div> |
| 58 | <nav rst-seg-tabs aria-label="Calendar view"> |
| 59 | <a cal-tab="Day" href="{{.Day}}"{{if eq .View "day"}} aria-current="page"{{end}}>Day</a> |
| 60 | <a cal-tab="Week" href="{{.Week}}"{{if eq .View "week"}} aria-current="page"{{end}}>Week</a> |
| 61 | <a cal-tab="Month" href="{{.Month}}"{{if eq .View "month"}} aria-current="page"{{end}}>Month</a> |
| 62 | <a cal-tab="Agenda" href="{{.Agenda}}"{{if eq .View "agenda"}} aria-current="page"{{end}}>Agenda</a> |
| 63 | </nav> |
| 64 | </div>{{end}} |
| 65 | |
amadan