Chartjs-Edit styles for axes in ChartJS bar chart, when gridlines are hidden

Chart.pluginService.register({
  afterDraw: function (chart, easing) {
    if (chart.config.options && chart.config.options.scales) {
      if (chart.config.options.scales.xAxes)
        chart.config.options.scales.xAxes.forEach(function (xAxisConfig) {
          if (!xAxisConfig.color)
            return;

          var ctx = chart.chart.ctx;
          var chartArea = chart.chartArea;
          var xAxis = chart.scales[xAxisConfig.id];

          // just draw the scale again with different colors
          var color = xAxisConfig.gridLines.color;
          xAxisConfig.gridLines.color = xAxisConfig.color;
          xAxis.draw(chartArea);
          xAxisConfig.gridLines.color = color;
        });

      if (chart.config.options.scales.yAxes)
        chart.config.options.scales.yAxes.forEach(function (yAxisConfig) {
          if (!yAxisConfig.color)
            return;

          var ctx = chart.chart.ctx;
          var chartArea = chart.chartArea;
          var yAxis = chart.scales[yAxisConfig.id];

          var color = yAxisConfig.gridLines.color;
          yAxisConfig.gridLines.color = yAxisConfig.color;
          yAxis.draw(chartArea);
          yAxisConfig.gridLines.color = color;

          ctx.restore();
        });
    }
  }
});


var q1 = document.getElementById("q1").getContext('2d');
var q1Chart = new Chart(q1, {
  type: 'bar',
  data: {
    labels: ["Very Good(9-10)", "Good(8-7)", "OK(5-6)", "Bad (3-4)", "Cant be worse (0-2)"],
    datasets: [{
      label: "Our Performance",
      data: [19.56, 37.90, 1.29, 30.36, 10.89],
      backgroundColor: ["#d93030", "#288fba", "#367fa9", "#367fa9", "#367fa9"],
      datalabels: {
        align: 'top',
        anchor: 'end',
        font: {
          size: 18,
          weight: 900,
        },
        formatter: function (value) {
          var label = value;
          var keys, klen, k;
          return label + '%';
        }
      }
    }]
  },
  scaleLineColor: "rgba(0,0,0,1)",
  options: {
    scales: {
      xAxes: [{
        color: 'yellow',
        barThickness: 100,
        ticks: {
          fontColor: "black",
          fontSize: 20,
          autoSkip: false,
        },
        gridLines: {
          display: false
        }
      }],
      yAxes: [{
        color: 'yellow',
        barThickness: 150,
        ticks: {
          fontColor: "black",
          fontSize: 20,
          beginAtZero: true,
          stepSize: 10
        },
        gridLines: {
          display: false
        }
      }],
    },
    responsive: true,
    maintainAspectRatio: true,
    legend: {
      display: false
    },
    tooltips: {
      enabled: false
    },
    layout: {
      padding: {
        left: 0,
        right: 0,
        top: 30,
        bottom: 0
      }
    }
  },
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.1/Chart.bundle.js"></script>
<canvas id="q1" height=""></canvas>