Wondering how I can move the text more to the left and create a new line between the labels. As you can see the "label" and "percentage" are on top of each other.

I'm using ChartJS v2.8.0 and ChartJS Plugin Labels 1.1.0

Current Look:

Desired Look:

Current code:

var chart = new Chart(ctx, {
            type: 'pie',
            data: {
                labels: ['T-Shirts', 'Sweaters'],
                datasets: [{
                    backgroundColor: [$('#chart-color-1').val(), $('#chart-color-2').val()],
                    data: [$('#attire_1_percent').val(), $('#attire_2_percent').val()],
                    borderWidth: 0

                }]
            },
            options: {
                maintainAspectRatio: false,
                legend: {
                    display: false
                },
                plugins: {
                    labels: [{
                            render: "label",
                            fontColor: '#fff',
                        },
                        {
                            render: 'percentage',
                            fontColor: '#fff',
                        }
                    ],
                },
                tooltips: {
                    callbacks: {
                        label: function(tooltipItem, data) {
                            return data.labels[tooltipItem.index] + ": " + data.datasets[0].data[tooltipItem.index] + "%"
                        }
                    },
                },
            }
        });