Web: Added watermark to text component.
This commit is contained in:
parent
ad31ff05dd
commit
b0711b95fe
@ -5,7 +5,8 @@ import TextInput from "@docspace/components/text-input";
|
|||||||
import ComboBox from "@docspace/components/combobox";
|
import ComboBox from "@docspace/components/combobox";
|
||||||
import Text from "@docspace/components/text";
|
import Text from "@docspace/components/text";
|
||||||
import Checkbox from "@docspace/components/checkbox";
|
import Checkbox from "@docspace/components/checkbox";
|
||||||
|
import WMReactSvgUrl from "PUBLIC_DIR/images/WM.react.svg?url";
|
||||||
|
import Watermark from "@docspace/common/components/Watermarks";
|
||||||
import { StyledWatermark } from "./StyledComponent";
|
import { StyledWatermark } from "./StyledComponent";
|
||||||
|
|
||||||
const options = (t) => [
|
const options = (t) => [
|
||||||
@ -32,7 +33,7 @@ const TextWatermark = () => {
|
|||||||
const onCheckboxChange = () => {
|
const onCheckboxChange = () => {
|
||||||
setIsChecked(!isChecked);
|
setIsChecked(!isChecked);
|
||||||
};
|
};
|
||||||
|
const isHorizontal = selectedOption.key === "horizontal";
|
||||||
return (
|
return (
|
||||||
<StyledWatermark>
|
<StyledWatermark>
|
||||||
<div>
|
<div>
|
||||||
@ -59,9 +60,12 @@ const TextWatermark = () => {
|
|||||||
isChecked={isChecked}
|
isChecked={isChecked}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div
|
<Watermark
|
||||||
style={{ width: "100px", height: "140px", backgroundColor: "red" }}
|
text={value}
|
||||||
></div>
|
image={WMReactSvgUrl}
|
||||||
|
rotate={isHorizontal ? 0 : -45}
|
||||||
|
isSemitransparent={isChecked}
|
||||||
|
/>
|
||||||
</StyledWatermark>
|
</StyledWatermark>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
4
public/images/WM.react.svg
Normal file
4
public/images/WM.react.svg
Normal file
@ -0,0 +1,4 @@
|
|||||||
|
<svg width="100" height="140" viewBox="0 0 100 140" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<path d="M87 13.5H99.5V139.5H0.5V0.5H86.5V13V13.5H87Z" fill="white" stroke="#D0D5DA"/>
|
||||||
|
<path d="M87 0L100 13H87V0Z" fill="#F3F4F4"/>
|
||||||
|
</svg>
|
After Width: | Height: | Size: 239 B |
Loading…
Reference in New Issue
Block a user