@activecollab/components/dist/esm/components/Button/AddToListButton/Styles.js

ActiveCollab Components

import styled from "styled-components";
import { AddCrossIcon } from "../../Icons/collection";
import { Body2 } from "../../Typography";
export const StyledText = styled(Body2).withConfig({
  displayName: "Styles__StyledText",
  componentId: "sc-1fx7urq-0"
})(["transition:ease 0.3s all;color:var(--color-primary);position:relative;"]);
StyledText.displayName = "StyledText";
export const StyledAddCrossIcon = styled(AddCrossIcon).withConfig({
  displayName: "Styles__StyledAddCrossIcon",
  componentId: "sc-1fx7urq-1"
})(["fill:var(--page-paper-main);background:var(--color-primary);border-radius:30px;padding:7px;box-sizing:content-box;"]);
StyledAddCrossIcon.displayName = "StyledAddCrossIcon";
export const StyledAddToListButton = styled("button").withConfig({
  displayName: "Styles__StyledAddToListButton",
  componentId: "sc-1fx7urq-2"
})(["display:flex;justify-content:center;gap:12px;align-items:center;height:32px;padding:4px 16px 4px 4px;position:relative;background:none;border:none;cursor:pointer;&:before{content:\"\";display:block;height:2px;width:0%;position:absolute;left:16px;background:var(--color-primary);transition:ease 0.3s all;border-radius:30px;opacity:0;}&:hover{", "{color:var(--page-paper-main);}&:before{height:32px;width:100%;left:0;opacity:1;}", "{fill:var(--page-paper-main);transform:rotate(90deg);transition:ease 0.3s;}}"], StyledText, StyledAddCrossIcon);
StyledAddToListButton.displayName = "StyledAddToListButton";
//# sourceMappingURL=Styles.js.map