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.

87 lines
1.3 KiB
HTML

3 years ago
<!DOCTYPE html>
<html lang="eng">
<head>
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta charset="UTF-8" />
<title>The CookBook</title>
<style>
.header {
padding: 10px 16px;
color: black;
}
h1 {
text-align: center;
font-family: "Coconat";
font-size: 80px;
}
h2 {
font-family: "Coconat";
}
body {
height: 100%;
margin: 0;
background-repeat: no-repeat;
background-attachment: fixed;
background-color: black;
background-image: linear-gradient(0deg, black, white);
}
p {
font-family: "Montserrat Alternates";
}
* {
box-sizing: border-box;
}
.column {
float: left;
padding: 45px;
height: 200px;
}
.left {
width: 60%;
}
.right {
width: 40%;
}
.row:after {
content: "";
display: table;
clear: both;
}
.barcode {
width: 120px;
height: 50px;
}
</style>
</head>
<body>
<div class="header" id="myHeader">
<h1>THE COOKBOOK</h1>
</div>
% for function in functions
<div class="row">
<div class="column left">
<h2>
${function.title}
<img src="${function.barcode}" class="barcode" />
</h2>
</div>
<div class="column right">
<p>☻ ${function.description}</p>
</div>
</div>
% endfor
</body>
</html>