@coin-voyage/paykit/dist/components/ui/CopyableInfo/styles.js

Seamless crypto payments. Onboard users from any chain, any coin into your app with one click.

import styled from "../../../styles/styled";
import { ModalBody } from "../Modal/styles";
export const CopyRow = styled.button `
  display: block;
  height: 64px;
  border-radius: 8px;
  padding: 8px 16px;

  cursor: pointer;
  background-color: var(--ck-body-background);

  display: flex;
  align-items: center;
  justify-content: space-between;

  transition: all 100ms ease;

  &:hover {
    opacity: 0.8;
  }

  &:active {
    transform: scale(0.98);
    background-color: var(--ck-body-background-secondary);
  }

  &:disabled {
    cursor: default;
    opacity: 0.5;
    transform: scale(0.98);
    background-color: var(--ck-body-background-secondary);
  }
`;
export const LabelRow = styled.div `
  margin-bottom: 4px;
`;
export const MainRow = styled.div `
  display: flex;
  align-items: center;
  justify-content: space-between;
`;
export const ValueContainer = styled.div `
  display: flex;
  align-items: center;
  gap: 8px;
`;
export const SmallText = styled.span `
  font-size: 14px;
  color: var(--ck-primary-button-color);
`;
export const ValueText = styled.span `
  font-size: 14px;
  font-weight: 600;
  color: var(--ck-primary-button-color);
`;
export const LabelText = styled(ModalBody) `
  margin: 0;
  text-align: left;
`;
export const CopyIconWrap = styled.div `
  --color: var(--ck-copytoclipboard-stroke);
  --bg: var(--ck-body-background);
`;