You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

103 lines
2.1 KiB
HTML

<html lang="en">
<head>
<title>The Screenless Office - Main Menu</title>
<style type="text/css">
body {
font-family: "FreeUniversal";
font-size: 11pt;
}
h1, h3 {
}
#title {
font-size: 20pt;
}
.bureau {
padding-top: 1em;
clear: both;
width: 100%;
page-break-inside: avoid;
}
.bureau h3 {
border-bottom: 1px solid black;
}
.bureau .description {
line-height: 1.2;
float: left;
width: 63%;
padding-right: 3%;
margin: 0 0 2em 0;
}
.bureau .prefix {
width: 30%;
float: left;
padding-right: 3%;
}
.cmd {
clear: both;
width: 100%;
}
.cmdcol{
width: 30%;
float: left;
padding-right: 3%;
padding-bottom: 0.5em;
}
.cmdcol svg {
width: 100%;
height: 41px;
}
.cmdcol img {
height: 50px;
float: right;
max-width: 100%;
}
.cmddesc {
margin-top: 0;
line-height: 1.1;
hyphens: auto;
}
.cmdname {
font-weight: bold;
text-transform: uppercase;
line-height: 1.1;
}
.cmdtxt {
margin-top: 1em;
}
.cmdtxt kbd {
font-size: 10pt;
font-family: Courier;
}
</style>
</head>
<body>
<div "main">
<h1 id="title">The Screenless Office</h1>
<em>Directory of Services</em>
%for prefix, buro in menu.items():
<div class="bureau">
<h3>${buro["name"]}</h3>
<div class="prefix">Prefix: ${prefix}</div>
<p class="description">${buro["desc"]}</p>
<div class="commands">
%for cmdtxt, cmd in buro["commands"].items():
% if cmdtxt != "test":
<div class="cmd">
<div class="cmdcol">
<div class="cmdname">${cmd["name"]}</div>
<div class="cmdtxt">command: <kbd>${cmdtxt}</kbd></div>
</div>
<div class="cmdcol">
<p class="cmddesc">${cmd["desc"]}</p>
</div>
<div class="cmdcol">${cmd["barcode"]}</div>
</div>
% endif
%endfor
</div>
</div>
%endfor
</div>
</body>
</html>