这个用HTML/CSS设计的捐赠进度条在bar为90%+时中断。如何使文本保持在原处或随着条形图的增加而缩小？

.text {
  position: absolute;
  top: 50%;
  left: 0;
  transform: scale(1);
  transition: transform 0.5s ease;
}

.bar {
  /* 进度条样式 */
}

.bar.progress {
  /* 进度达到90%+时的样式 */
}

.bar.progress .text {
  transform: scale(0.5); /* 缩小为原大小的一半 */
}

var bar = document.querySelector('.bar');
var text = document.querySelector('.text');

function updateTextSize() {
  var barWidth = bar.offsetWidth;
  var textScale = 1; // 默认缩放比例为1

  if (barWidth > /* 进度达到90%时的宽度 */) {
    textScale = /* 计算缩放比例，根据进度条宽度与文本原始大小的比例 */;
  }

  text.style.transform = 'scale(' + textScale + ')';
}

// 在进度条发生改变时调用updateTextSize函数