diff --git a/src/annotations/components/AnnotationEditable.tsx b/src/annotations/components/AnnotationEditable.tsx index cd3cc9b3f3..ff1e9b576f 100644 --- a/src/annotations/components/AnnotationEditable.tsx +++ b/src/annotations/components/AnnotationEditable.tsx @@ -1016,6 +1016,7 @@ export default class AnnotationEditable extends React.Component { compactVersion={this.props.compactVersion} inFocus={this.props.isInFocus} inPageMode={this.props.contextLocation === 'in-page'} + inEditMode={isEditing || isEditingHighlight} > { compactVersion={this.props.compactVersion} inFocus={this.props.isInFocus} inPageMode={this.props.contextLocation === 'in-page'} + inEditMode={isEditing || isEditingHighlight} > ` display: none; bottom: 0px; @@ -1658,7 +1661,7 @@ const DefaultFooterStyled = styled.div<{ padding: 0 10px 0px 10px; box-sizing: border-box; border-radius: 0 0 12px 12px; - position: absolute; + position: relative; animation: ${slideInFromBottom} 0.1s ease-out; background: ${(props) => props.theme.colors.black}98; backdrop-filter: blur(5px); @@ -1677,6 +1680,12 @@ const DefaultFooterStyled = styled.div<{ css` display: flex; `} + ${(props) => + props.inEditMode && + css` + display: flex; + position: relative; + `} ${(props) => props.inPageMode && css` @@ -1832,7 +1841,8 @@ const ContentContainer = styled.div<{ isEditMode: boolean }>` ${(props) => props.isEditMode && css` - /* margin-bottom: 10px; */ + grid-gap: 10px; + padding-top: 5px; `} ` const BtnContainerStyled = styled.div` diff --git a/src/dashboard-refactor/search-results/components/page-result.tsx b/src/dashboard-refactor/search-results/components/page-result.tsx index b72d52493f..28d3a12b42 100644 --- a/src/dashboard-refactor/search-results/components/page-result.tsx +++ b/src/dashboard-refactor/search-results/components/page-result.tsx @@ -1149,6 +1149,7 @@ const FooterBar = styled.div<{ shouldShow: boolean inFocus: boolean inPageMode?: boolean + inTitleEditMode?: boolean }>` bottom: 0; width: 100%; @@ -1158,7 +1159,7 @@ const FooterBar = styled.div<{ background: unset; backdrop-filter: unset; margin-top: -5px; - position: absolute; + position: relative; animation: ${slideInFromBottom} 0.1s cubic-bezier(0.22, 0.61, 0.36, 1) forwards; display: none; @@ -1172,6 +1173,12 @@ const FooterBar = styled.div<{ position: relative; display: flex; `}; + ${(props) => + props.inTitleEditMode && + css` + display: flex; + position: relative; + `}; ${(props) => props.shouldShow && css`