package piechart

import (
	"cpone/layout"
	chart "cpone/component/chart"
)

templ MainPieChart(idDiv string, udata string) {
	<!-- title -->
	<div class="row justify-content-center mb-3 mt-3">
		<div class="col-lg-8 col-xxl-8 col-md-10 text-center">
			<p class="title">Data Kepesertaan MCU</p>
		</div>
	</div>
	<!-- title -->
	<div class="row justify-content-center">
		<div class="col-lg-8 col-xxl-8 col-md-10 text-center" style="margin-bottom: 40px;">
			@chart.ShowChart(idDiv, udata)
		</div>
	</div>
}

templ CssPieChart() {
	<link
		rel="stylesheet"
		href="assets/css/googlefont/poppins.css"
	/>
	<link
		rel="stylesheet"
		href="assets/css/googlefont/publicsans.css"
	/>
	<link
		rel="stylesheet"
		href="assets/css/googlefont/roboto.css"
	/>
	<style>
    body {
      background-color: white;
      /* padding-right: 100px;
            padding-left: 100px; */
    }

    .title {
        font-size:20px;
        font-weight: bold;
    }
  </style>
}

templ JsPieChart() {
	// echart
	<script src="assets/js/echarts-js/echart.min.js"></script>
}

templ ShowPieChart(title string, cmp templ.Component, css templ.Component, js templ.Component) {
	@layout.PlaygroundLayout(title, css, js) {
		@cmp
	}
}
