if (hexo-config('reading_progress.enable')) {
  .reading-progress-bar {
    --progress: 0;
    background: convert(hexo-config('reading_progress.color'));
    height: convert(hexo-config('reading_progress.height'));
    position: fixed;
    z-index: $zindex-5;

    if (hexo-config('reading_progress.reversed')) {
      width: calc(100% - var(--progress));
    } else {
      width: var(--progress);
    }

    if (hexo-config('reading_progress.start_at') == 'right') {
      right: 0;
    } else {
      left: 0;
    }

    if (hexo-config('reading_progress.position') == 'bottom') {
      bottom: 0;
    } else {
      top: 0;
    }
  }
}