react-image-editor-q/lib/components/common/AnnotationOptions/AnnotationOptions.styled.js

SSR-safe React wrapper around Filerobot Image Editor

import styled from"styled-components";import Label from"@scaleflex/ui/core/label";import{Color as PC}from"@scaleflex/ui/utils/types/palette";var StyledOptions=styled.div.withConfig({componentId:"sc-1gtalg0-0"})(["display:flex;align-items:center;justify-content:center;padding:8px 16px;margin-top:4px;gap:8px;flex-wrap:wrap;"," svg{color:",";}"],function(a){var b=a.isPhoneScreen;return b&&"\n    max-width: 315px;\n    padding: 0;\n  "},function(a){var b=a.theme.palette;return b[PC.IconsPrimary]}),StyledOptionsWrapper=styled.div.withConfig({componentId:"sc-1gtalg0-1"})(["display:flex;flex-wrap:wrap;margin-left:-4px;gap:4px;.FIE_annotation-option-triggerer{padding:6px;}"]),StyledOptionPopupContent=styled.div.withConfig({componentId:"sc-1gtalg0-2"})(["background:",";border-radius:4px;display:flex;flex-direction:column;padding:8px 12px;overflow:visible;"," "," *{color:black;font-size:11px;line-height:14px;font-family:'Open Sans',sans-serif;letter-spacing:0.04rem;}"],function(a){var b=a.theme;return b.palette["bg-secondary"]},function(a){var b=a.position;return b&&"\n    display: grid;\n    grid-template-columns: repeat(4, auto);\n    padding: 0;\n    margin-top: 8px;\n    box-shadow: 0px 1px 2px ".concat(function(a){var b=a.theme;return b.palette["light-shadow"]},";\n    ")},function(a){var b=a.disablePadding;return b&&"\n      padding: 0;\n    "}),StyledSpacedOptionFields=styled.div.withConfig({componentId:"sc-1gtalg0-3"})(["display:flex;align-items:center;gap:12px;",""],function(a){var b=a.preventFlex;return b&&"\n      display: block;\n\n      label {\n        margin-bottom: 8px;\n      }\n  "}),StyledTwoColumnsContainer=styled.div.withConfig({componentId:"sc-1gtalg0-4"})(["display:flex;align-items:center;justify-content:space-between;"]),StyledColumn=styled.div.withConfig({componentId:"sc-1gtalg0-5"})(["&:not(:first-child){margin-left:12px;}"]),StyledIconWrapper=styled.div.withConfig({componentId:"sc-1gtalg0-6"})(function(a){var b=a.theme,c=a.addThinBorder,d=a.secondaryIconColor,e=a.active,f=a.watermarkTool;return"\n    cursor: pointer;\n    padding: ".concat(f?"6px":"8px 12px",";\n    border-radius: 2px;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    gap: 6px;\n\n    svg {\n      vertical-align: middle;\n      margin: 0 auto;\n      color: black;\n    }\n\n    ").concat(c?"border: 0.5px solid ".concat(b.palette["borders-secondary"],";\n        padding: 8px 8px;"):"",";\n    color: black;\n\n    ").concat(e&&"\n      border-radius: 8px;\n      border-color: #c9c9c9;\n      background-color: #dedede;\n\n        * {\n          color: black;\n        }\n      ","\n\n    :hover {\n      background: #dedede;\n    }\n  ")}),StyledIconLabel=styled(Label).withConfig({componentId:"sc-1gtalg0-7"})(["color:black;"]);export{StyledTwoColumnsContainer,StyledColumn,StyledIconWrapper,StyledSpacedOptionFields,StyledOptions,StyledOptionsWrapper,StyledOptionPopupContent,StyledIconLabel};