This repository has been archived on 2023-06-18. You can view files and clone it, but cannot push or open issues or pull requests.
soft-arch/template/doc.ejs

249 lines
6.4 KiB
Plaintext

<html>
<head>
<title><%=meta.author%> - <%=meta.title%></title>
<link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/css?family=Fira+Sans|Fira+Mono">
<link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/gh/highlightjs/cdn-release@10.2.0/build/styles/default.min.css">
<style>
body,
* {
font-family: "Fira Sans";
scroll-behavior: smooth;
}
body {
margin: 1em;
}
#usi-logo {
width: 75px;
height: 75px;
}
header {
display: flex;
align-content: space-between;
width: 100%;
justify-items: center;
}
header ul {
list-style: none;
}
header .title {
flex: 1;
margin-left: 1em;
}
html {
min-height: 100vh;
}
pre,
code {
font-family: "Fira Mono"
}
pre {
background: rgb(202, 227, 255);
padding: 1em;
}
td {
text-align: center
}
td:last-child {
text-align: left;
}
th {
font-weight: normal;
color: rgb(0, 61, 131);
}
thead {
border-bottom: 2px solid rgb(202, 227, 255);
}
table {
width: 100%
}
span.task {
display: inline-flex;
border-radius: 50%;
border: 1px solid white;
background: #ffbc00;
width: 2em;
height: 2em;
justify-content: center;
align-items: center;
font-weight: normal;
margin-top: 2em;
}
section.feedback {
padding: 2em;
background-color: rgb(92, 192, 223);
background-image: linear-gradient(1deg, white, transparent,rgba(255,255,255,0.5) 90%,transparent 100%);
}
section.instructions {
padding: 2em;
background-color: rgb(255, 241, 196);
background-image: linear-gradient(1deg, white, transparent,rgba(255,255,255,0.5) 90%,transparent 100%);
}
section.instructions::before {
content: "Task Description";
font-size: 1.75em;
color: #ffbc00;
font-weight: bold;
transform: translateY(-2em) rotate(1deg);
display: block;
margin-bottom: -2em;
text-align: center;
}
section.pass, section.exceed, section.ok {
margin-top: 1em;
}
section.pass span, section.exceed span, section.hint span, section.ok span {
margin-right: 0.5em;
padding: 0.5em;
display: inline-block;
}
section.pass {
border: 2px solid green;
}
section.ok {
border: 2px solid rgb(6, 175, 6);
}
section.exceed {
border: 2px solid rgb(34, 255, 34);
}
section.hint {
border: 2px solid rgb(255, 214, 34);
}
section.pass span {
background-color: green; color: white;
background-image: linear-gradient(45deg, #000000a6, transparent);
}
section.ok span {
background-color: rgb(6, 175, 6); color: white;
background-image: linear-gradient(135deg, #000000a6, transparent);
}
section.exceed span {
background-color: rgb(34, 255, 34);
background-image: linear-gradient(-45deg, white, transparent);
}
section.hint span {
background-color: rgb(255, 214, 34);
background-image: linear-gradient(-45deg, white, transparent);
}
.deadline {
text-align: right;
}
p.deadline {
font-size: 2em;
}
.deadline b {
border-bottom: 1px solid black;
}
form label {
display: inline-block;
margin-right: 1em;
vertical-align: middle;
}
blockquote {
border-left: 10px solid #fff2ca;
padding-left: 2em;
margin: 1em;
}
form button {
min-width: 10em;
min-height: 2em;
background: #008d4f;
color: white;
font-weight: bold;
font-size: 1.5em;
}
form input[type=text],
form textarea,
form select {
flex: 3;
margin: 0.5em;
font-size: 1.1em;
}
form p { display: flex;
align-items: stretch;
min-height: 2.5em;
padding-left: 0.5em;
flex-direction: column}
nav .task {display: unset; background:white}
nav .d1 {display: block}
nav .d1 + .d2 {margin-left: 2em}
nav .d2 {margin-left: 1em}
footer {
text-align: center; color: gray;
}
</style>
</head>
<body>
<header> <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" id="usi-logo" x="0px" y="0px" width="200" height="200" viewBox="0 0 200 200" style="enable-background:new 0 0 200 200;" xml:space="preserve" class="injected-svg svg">
<g>
<path d="M180,41.7h-51.1V31.1h42.2C153.1,12.5,127.8,1,99.9,1C45.2,1.1,0.9,45.4,1,100.1c0,26.8,10.7,51.1,28.1,68.9 c-1.4-2-2.4-4.1-3-6.1c-1-3.5-1-5.9-1.1-15.8v-47.1h14.8v48.5c0,3.4-0.1,6.6,1,9.6c3,7.6,11.3,8.5,16,8.5c2.3,0,8.3-0.1,12.6-3.9 c4.4-3.9,4.4-8.4,4.4-15v-47.7h14.9v49.7c-0.1,8.9-0.1,16.3-8.5,23.5c-8,7-18.4,7.7-23.8,7.7c-4.8,0-9.5-0.6-14-2.1 c-1.8-0.6-3.5-1.4-5-2.3c17.1,14,39,22.4,62.8,22.4c54.7-0.1,99-44.4,98.9-99.1C199,78.1,191.9,58,180,41.7z M175.3,94.4l-6.3-9 c2.1-1.4,8.7-5.7,8.7-17.7c0-2-0.2-4.1-1-6.2c-1.7-4.1-4.6-4.9-6.6-4.9c-3.6,0-4.9,2.5-5.7,4.3c-0.5,1.3-0.6,1.5-1.8,6.6l-1.5,6.9 c-0.9,3.6-1.3,5.4-2,7.2c-1.1,2.6-4.5,9.6-14,9.6c-10.9,0-17.8-9.2-17.8-22.6c0-12.3,6.1-19,11.6-23l6.6,8.8 c-2.8,1.9-8.5,5.7-8.5,14.8c0,5.8,2.6,10.8,7,10.8c4.9,0,5.8-5.3,6.8-10.5l1.3-5.9c1.6-7.7,4.8-18.6,17-18.6 c13.1,0,18.4,12.2,18.4,24.3c0,3.2-0.3,6.7-1.3,10.2C185.1,83.4,182.3,90.1,175.3,94.4z"></path>
</g>
</svg>
<div class="title">
<h2><%=meta.lecture%></h2>
<h1><%=meta.title%></h1>
</div>
<ul>
<li><%=meta.author%></li>
</ul>
</header>
<nav>
<h1>Table of Contents</h1>
<%-toc.toc %>
</nav>
<main>
<%-md %>
</main>
<footer>
<%=meta.timestamp%>
</footer>
</body>
</html>