sprinque-js-sdk-wip/dist/src/step-4/style.js

UI kit to implement Pay by Invoice with Sprinque

import { ACTIVE_ITEM_COLOR, FORM_ELEM_COLOR } from '../styles';
export const STYLE = `
<style>
  /* step 4 */
  #sp-otp-digits {
    display: flex;
  }
  .sp-otp-digit {
      width: 20%;
      border: none;
      background: none;
      outline: none;
      border-bottom: 2px solid #333232;
      font-size: 30px;
      margin: 20px 5px;
      border-radius: 0;
      color: ${ACTIVE_ITEM_COLOR};
      text-align: center;
  }
  #resend-code {
    color: ${FORM_ELEM_COLOR};
    cursor: pointer;
  }
  #resend-code:not(.disabled) #resend-code-desc {
    display: none;
  }
  #resend-code.disabled {
    pointer-events: none;
    opacity: 0.5;
  }
  /* hide arrows */
  .sp-otp-digit::-webkit-outer-spin-button,
  .sp-otp-digit::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
  }
  
  /* Firefox */
  .sp-otp-digit[type=number] {
    -moz-appearance: textfield;
  }
</style>
`;