Welcome to mirror list, hosted at ThFree Co, Russian Federation.

bars.html « widgets « partials « layouts - github.com/negrel/hugo-theme-pico.git - Unnamed repository; edit this file 'description' to name the repository.
summaryrefslogtreecommitdiff
blob: 2687d1152bdf52c48673bce3707b21c483a3ab50 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
<section id="bars" class="mx-auto flex flex-wrap items-center">
	<div class="text-center w-full">
		<h1 class="my-0 text-4xl sm:text-5xl md:text-6xl">
			{{ .Title }}
		</h1>
		{{ with .Params.subtitle}}
		<h2 class="font-light mt-0">{{ . }}</h2>
		{{ end }}
	</div>
	<div class="w-full flex flex-col">
		{{ range .Params.bar }}
		<div class="mt-8">
			{{ if .icon }}
			<img class="mx-auto h-32" src="{{ .icon | relURL }}" alt="{{ .name }} icon">
			{{ end }}
			<h2 class="inline-block">{{ .name }}</h2>
			<div class="flex items-center">
				<div class="h-4 flex-1 mr-4 shadow-2 rounded-sm bg-gray-200">
					<div class="h-full bg-green-300 rounded-sm"
						style="width: {{ .percent }}; background: radial-gradient( circle farthest-corner at 0.8% 3.1%,  rgba(255,188,224,1) 0%, rgba(170,165,255,1) 46%, rgba(165,255,205,1) 100.2% );">
					</div>
				</div>
				<span class="font-bold">{{ .percent }}</span>
			</div>
		</div>
		{{ end }}
	</div>
</section>