Web: Components: Adapt FloatingButton component to RTL interface

This commit is contained in:
Aleksandr Lushkin 2023-06-30 16:28:35 +02:00
parent 8694c01b40
commit 79fccf6a61

View File

@ -23,7 +23,9 @@ const StyledFloatingButtonWrapper = styled.div`
@media ${desktop} {
position: absolute;
z-index: 300;
right: 0;
${({ theme }) =>
theme.interfaceDirection === "rtl" ? `left: 0;` : `right: 0;`}
bottom: ${(props) => (props.showTwoProgress ? "96px" : "0")};
${!isMobile &&
@ -37,7 +39,9 @@ const StyledFloatingButtonWrapper = styled.div`
display: none;
position: absolute;
cursor: pointer;
right: 77px;
${({ theme }) =>
theme.interfaceDirection === "rtl" ? `left: 77px;` : `right: 77px;`}
bottom: 33px;
}
&:hover {
@ -162,7 +166,9 @@ const StyledAlertIcon = styled.div`
position: absolute;
width: 12px;
height: 12px;
left: 20px;
${({ theme }) =>
theme.interfaceDirection === "rtl" ? `right: 20px;` : `left: 20px;`}
top: 0px;
svg {