如何在深色模式下改变条纹样式？

:root {
  --stripe-color: #ffffff; /* 默认为浅色模式下的颜色 */
}

@media (prefers-color-scheme: dark) {
  :root {
    --stripe-color: #000000; /* 在深色模式下的颜色 */
  }
}

.striped-element {
  background-color: var(--stripe-color);
}

.striped-element {
  background-color: #ffffff; /* 默认为浅色模式下的颜色 */
}

@media (prefers-color-scheme: dark) {
  .striped-element {
    background-color: #000000; /* 在深色模式下的颜色 */
  }
}

const stripedElement = document.querySelector('.striped-element');

function updateStripeColor() {
  if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) {
    stripedElement.style.backgroundColor = '#000000'; /* 在深色模式下的颜色 */
  } else {
    stripedElement.style.backgroundColor = '#ffffff'; /* 默认为浅色模式下的颜色 */
  }
}

updateStripeColor();

// 监听主题模式变化
window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', updateStripeColor);