@chayns-components/swipeable-wrapper/lib/esm/components/swipeable-wrapper/swipeable-action/SwipeableAction.styles.js

A set of beautiful React components for developing your own applications with chayns.

import { motion } from 'motion/react';
import styled, { css } from 'styled-components';
export const StyledMotionSwipeableAction = styled(motion.div)`
    background-color: ${({
  $backgroundColor
}) => $backgroundColor};
    display: flex;
    height: 100%;
    position: absolute;
    top: 0;
    width: 200vw;

    ${({
  $position
}) => {
  if ($position === 'left') {
    return css`
                justify-content: flex-end;
                right: 100%;
            `;
  }
  return css`
            justify-content: flex-start;
            left: 100%;
        `;
}}
`;
export const StyledSwipeableActionButton = styled.button`
    align-items: center;
    appearance: none;
    background: none;
    box-shadow: none;
    color: ${({
  $color
}) => $color};
    display: flex;
    flex-direction: column;
    font-size: 88%;
    gap: 4px;
    height: 100%;
    justify-content: center;
    margin: 0;
    padding: 0;
    width: ${({
  $width
}) => $width};
`;
//# sourceMappingURL=SwipeableAction.styles.js.map