From ab1f1a3f679935bad8ba5cbc360f881846b01e8a Mon Sep 17 00:00:00 2001 From: Lucas Bordeau Date: Fri, 9 Jun 2023 11:06:01 +0200 Subject: [PATCH] Added shadow effect on table cell hover (#258) Added shadow effect to replace border resizing components --- .../editable-cell/EditableCellDisplayMode.tsx | 10 ++++++++++ 1 file changed, 10 insertions(+) diff --git a/front/src/modules/ui/components/editable-cell/EditableCellDisplayMode.tsx b/front/src/modules/ui/components/editable-cell/EditableCellDisplayMode.tsx index 1f24e4937..4dfa2b750 100644 --- a/front/src/modules/ui/components/editable-cell/EditableCellDisplayMode.tsx +++ b/front/src/modules/ui/components/editable-cell/EditableCellDisplayMode.tsx @@ -10,6 +10,16 @@ export const EditableCellNormalModeOuterContainer = styled.div` padding-left: ${(props) => props.theme.spacing(2)}; padding-right: ${(props) => props.theme.spacing(1)}; + + &:hover { + background: ${(props) => props.theme.secondaryBackgroundTransparent}; + + -webkit-box-shadow: inset 0 0 0 1px ${(props) => props.theme.text20}; + -moz-box-shadow: inset 0 0 0 1px ${(props) => props.theme.text20}; + box-shadow: inset 0 0 0 1px ${(props) => props.theme.text20}; + + border-radius: ${(props) => props.theme.borderRadius}; + } `; export const EditableCellNormalModeInnerContainer = styled.div`