Radio

作者:byllzz0 点赞MIT

实时预览

源代码

export default function Component() {
  return (
    <div className="wheel-selector">
  <div className="hint-pop">TAP TO SPIN</div>
  <div className="radio-input">
    <label htmlFor="value-2" className="next-trigger" id="trigger-for-1"></label>
    <label htmlFor="value-3" className="next-trigger" id="trigger-for-2"></label>
    <label htmlFor="value-1" className="next-trigger" id="trigger-for-3"></label>

    <div className="glass-overlay"></div>

    <input
      value="value-1"
      name="value-radio"
      id="value-1"
      type="radio"
      checked=""
    />
    <label className="wheel-label" htmlFor="value-1" style={{ -Angle: "-30deg" }}>
      <span className="num">01</span>
      <span className="label">PRIME</span>
    </label>

    <input value="value-2" name="value-radio" id="value-2" type="radio" />
    <label className="wheel-label" htmlFor="value-2" style={{ -Angle: "0deg" }}>
      <span className="num">02</span>
      <span className="label">SELECT</span>
    </label>

    <input value="value-3" name="value-radio" id="value-3" type="radio" />
    <label className="wheel-label" htmlFor="value-3" style={{ -Angle: "30deg" }}>
      <span className="num">03</span>
      <span className="label">ULTRA</span>
    </label>
  </div>
</div>
  );
}