Small CSS changes

This commit is contained in:
Miguel de la Cruz 2024-08-03 08:33:58 +02:00
parent c2b4e8467b
commit 7a5ab7cf09
3 changed files with 64 additions and 34 deletions

View file

@ -8,14 +8,18 @@
<link rel="stylesheet" type="text/css" href="{{.relpath}}style.css" />
</head>
<body>
<h1>{{.title}}</h1>
<main>
<div id="content">
<h1>{{.title}}</h1>
{{if ne (len .recipes) 0}}
<ul>
{{range .recipes}}
<li><a href="{{.Path}}">{{.Name}}</a></li>
{{end}}
</ul>
{{end}}
{{if ne (len .recipes) 0}}
<ul>
{{range .recipes}}
<li><a href="{{.Path}}">{{.Name}}</a></li>
{{end}}
</ul>
{{end}}
</div>
</main>
</body>
</html>

View file

@ -8,35 +8,39 @@
<link rel="stylesheet" type="text/css" href="{{.relpath}}style.css" />
</head>
<body>
<h1>{{.name}}</h1>
<main>
<div id="content">
<h1>{{.name}}</h1>
{{$recipeImage := recipeImage .path}}
{{if ne $recipeImage ""}}
<img class="recipeimage" src="{{$recipeImage}}" />
{{end}}
{{if ne (len .recipe.Metadata) 0}}
<ul>
{{$m := .recipe.Metadata}}
{{$nameKey := .nameKey}}
{{range $k := sortedMetadataKeys $m}}
{{if ne $k $nameKey}}
<li><em>{{$k}}:</em> {{index $m $k}}</li>
{{$recipeImage := recipeImage .path}}
{{if ne $recipeImage ""}}
<img class="recipeimage" src="{{$recipeImage}}" />
{{end}}
{{end}}
</ul>
{{end}}
{{recipeSteps .recipe .path}}
<h2>{{.ingredientsTitle}}</h2>
<ul>
{{range .recipe.Steps}}
{{range .Ingredients}}
<li>{{.Name}} {{if ne .Amount.QuantityRaw ""}}({{.Amount.QuantityRaw}}{{if ne .Amount.Unit ""}} {{.Amount.Unit}}{{end}}){{end}}</li>
{{if ne (len .recipe.Metadata) 0}}
<ul>
{{$m := .recipe.Metadata}}
{{$nameKey := .nameKey}}
{{range $k := sortedMetadataKeys $m}}
{{if ne $k $nameKey}}
<li><em>{{$k}}:</em> {{index $m $k}}</li>
{{end}}
{{end}}
</ul>
{{end}}
{{end}}
</ul>
{{recipeSteps .recipe .path}}
<h2>{{.ingredientsTitle}}</h2>
<ul>
{{range .recipe.Steps}}
{{range .Ingredients}}
<li>{{.Name}} {{if ne .Amount.QuantityRaw ""}}({{.Amount.QuantityRaw}}{{if ne .Amount.Unit ""}} {{.Amount.Unit}}{{end}}){{end}}</li>
{{end}}
{{end}}
</ul>
</div>
</main>
</body>
</html>

View file

@ -1,8 +1,30 @@
body {
font-size: 1.3rem;
background-color: lightgrey;
font-family: monospace;
}
main {
display: flex;
flex-flow: column;
align-items: center;
width: 100%;
height: 100%;
}
#content {
width: 80%;
display: flex;
flex-flow: column;
align-items: center;
justify-content: center;
}
img {
max-width: 50%;
max-height: 500px;
}
.ingredient {
font-weight: bold;
color: green;