Make progress list into a partial

This commit is contained in:
Jip Fr
2021-04-09 15:00:51 +02:00
parent f3829e3bcb
commit 79fbbb917e
5 changed files with 38 additions and 43 deletions

View File

@@ -18,6 +18,10 @@ function loadAllCharts() {
Chart.defaults.plugins.legend = {
display: false
};
Chart.defaults.plugins.tooltip = {
enabled: false
};
new Chart(wrapper.querySelector('canvas'), {
type: 'doughnut',
data: {

View File

@@ -404,7 +404,6 @@ section.team {
width: 1.5rem;
height: 1.5rem;
background: var(--background);
/* border: 1px solid var(--text-secondary); */
color: var(--text);
border-radius: 4px;
}

View File

@@ -98,48 +98,7 @@
</div>
<div class="right sect">
<h2 class="title">{{ locale.progress.title }}</h2>
<div class="feature-list-wrapper">
<div class="feature-list-top">
<div class="feature-progress-chart">
<canvas></canvas>
<p class="percentage-label"></p>
</div>
<div class="progress-title">
<h3>Miiverse (Juxt)</h3>
</div>
</div>
<hr />
<div class="feature-list">
<div class="feature">
{{> custom-checkbox checked=true }}
<span>Feature A</span>
</div>
<div class="feature">
{{> custom-checkbox }}
<span>Feature A</span>
</div>
<div class="feature">
{{> custom-checkbox checked=true }}
<span>Feature A</span>
</div>
<div class="feature">
{{> custom-checkbox }}
<span>Feature A</span>
</div>
<div class="feature">
{{> custom-checkbox checked=true }}
<span>Feature A</span>
</div>
<div class="feature">
{{> custom-checkbox }}
<span>Feature A</span>
</div>
<div class="feature">
{{> custom-checkbox }}
<span>Feature A</span>
</div>
</div>
</div>
{{> progress-list data=featuredFeatureList }}
</div>
</section>

View File

@@ -0,0 +1,20 @@
<div class="feature-list-wrapper">
<div class="feature-list-top">
<div class="feature-progress-chart">
<p class="percentage-label"></p>
<canvas></canvas>
</div>
<div class="progress-title">
<h3>{{ data.title }}</h3>
</div>
</div>
<hr />
<div class="feature-list">
{{#each data.features}}
<div class="feature">
{{> custom-checkbox checked=checked }}
<span>{{ name }}</span>
</div>
{{/each}}
</div>
</div>

View File

@@ -7,6 +7,19 @@ router.get('/', (req, res) => {
res.render('home', {
layout: 'main',
locale: tmpLocale,
featuredFeatureList: {
title: 'Thing',
features: [
{
name: 'Feature A',
checked: true
},
{
name: 'Feature B',
checked: false
}
]
}
});
});