fixed Article CloseBtn and Header offset
This commit is contained in:
parent
9f002e3249
commit
58aa87ff19
@ -121,6 +121,7 @@ const StyledArticle = styled.article`
|
|||||||
|
|
||||||
.article-body__scrollbar {
|
.article-body__scrollbar {
|
||||||
.scroll-body {
|
.scroll-body {
|
||||||
|
padding-top: 16px;
|
||||||
padding-right: 0px !important;
|
padding-right: 0px !important;
|
||||||
|
|
||||||
@media ${mobile} {
|
@media ${mobile} {
|
||||||
@ -158,7 +159,7 @@ const StyledArticleHeader = styled.div`
|
|||||||
@media ${mobile} {
|
@media ${mobile} {
|
||||||
border-bottom: ${(props) => props.theme.catalog.header.borderBottom};
|
border-bottom: ${(props) => props.theme.catalog.header.borderBottom};
|
||||||
padding: 12px 16px 12px;
|
padding: 12px 16px 12px;
|
||||||
margin-bottom: 16px !important;
|
//margin-bottom: 16px !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
${isTablet &&
|
${isTablet &&
|
||||||
@ -173,7 +174,7 @@ const StyledArticleHeader = styled.div`
|
|||||||
border-bottom: ${(props) =>
|
border-bottom: ${(props) =>
|
||||||
props.theme.catalog.header.borderBottom} !important;
|
props.theme.catalog.header.borderBottom} !important;
|
||||||
padding: 12px 16px 12px !important;
|
padding: 12px 16px 12px !important;
|
||||||
margin-bottom: 16px !important;
|
//margin-bottom: 16px !important;
|
||||||
`}
|
`}
|
||||||
|
|
||||||
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
|
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
|
||||||
@ -262,11 +263,10 @@ const StyledArticleMainButton = styled.div`
|
|||||||
`;
|
`;
|
||||||
|
|
||||||
const StyledControlContainer = styled.div`
|
const StyledControlContainer = styled.div`
|
||||||
background: ${(props) => props.theme.catalog.control.background};
|
width: 17px;
|
||||||
width: 24px;
|
height: 17px;
|
||||||
height: 24px;
|
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 30px;
|
top: 37px;
|
||||||
right: 10px;
|
right: 10px;
|
||||||
border-radius: 100px;
|
border-radius: 100px;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
@ -279,8 +279,8 @@ const StyledControlContainer = styled.div`
|
|||||||
StyledControlContainer.defaultProps = { theme: Base };
|
StyledControlContainer.defaultProps = { theme: Base };
|
||||||
|
|
||||||
const StyledCrossIcon = styled(CrossIcon)`
|
const StyledCrossIcon = styled(CrossIcon)`
|
||||||
width: 12px;
|
width: 17px;
|
||||||
height: 12px;
|
height: 17px;
|
||||||
path {
|
path {
|
||||||
fill: ${(props) => props.theme.catalog.control.fill};
|
fill: ${(props) => props.theme.catalog.control.fill};
|
||||||
}
|
}
|
||||||
|
@ -7,17 +7,13 @@ import IconButton from "../../icon-button";
|
|||||||
import Base from "../../themes/base";
|
import Base from "../../themes/base";
|
||||||
|
|
||||||
const StyledCloseButtonWrapper = styled.div`
|
const StyledCloseButtonWrapper = styled.div`
|
||||||
width: 24px;
|
width: 17px;
|
||||||
height: 24px;
|
height: 17px;
|
||||||
|
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
|
|
||||||
background-color: ${(props) =>
|
|
||||||
props.theme.modalDialog.closeButton.backgroundColor};
|
|
||||||
border-radius: 50%;
|
|
||||||
|
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
|
|
||||||
@ -28,14 +24,14 @@ const StyledCloseButtonWrapper = styled.div`
|
|||||||
right: -34px;
|
right: -34px;
|
||||||
@media ${smallTablet} {
|
@media ${smallTablet} {
|
||||||
right: 10px;
|
right: 10px;
|
||||||
top: -34px;
|
top: -27px;
|
||||||
}
|
}
|
||||||
`
|
`
|
||||||
: css`
|
: css`
|
||||||
top: 10px;
|
top: 10px;
|
||||||
left: -34px;
|
left: -27px;
|
||||||
@media ${smallTablet} {
|
@media ${smallTablet} {
|
||||||
top: -34px;
|
top: -27px;
|
||||||
left: auto;
|
left: auto;
|
||||||
right: 10px;
|
right: 10px;
|
||||||
}
|
}
|
||||||
@ -59,7 +55,7 @@ const CloseButton = ({ currentDisplayType, zIndex, onClick }) => {
|
|||||||
currentDisplayType={currentDisplayType}
|
currentDisplayType={currentDisplayType}
|
||||||
>
|
>
|
||||||
<IconButton
|
<IconButton
|
||||||
size="12px"
|
size="17px"
|
||||||
className="close-button"
|
className="close-button"
|
||||||
iconName="/static/images/cross.react.svg"
|
iconName="/static/images/cross.react.svg"
|
||||||
/>
|
/>
|
||||||
|
@ -602,7 +602,7 @@ const Base = {
|
|||||||
},
|
},
|
||||||
|
|
||||||
closeButton: {
|
closeButton: {
|
||||||
backgroundColor: "#9a9ea3",
|
//backgroundColor: "#9a9ea3",
|
||||||
fillColor: white,
|
fillColor: white,
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
@ -600,8 +600,8 @@ const Dark = {
|
|||||||
},
|
},
|
||||||
|
|
||||||
closeButton: {
|
closeButton: {
|
||||||
backgroundColor: "#9A9EA3",
|
//backgroundColor: "#9A9EA3",
|
||||||
fillColor: black,
|
fillColor: "#9A9EA3",
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
|
||||||
|
@ -1 +1 @@
|
|||||||
Subproject commit 2bb4d878b42e8c648dd44fed7d445163772551fa
|
Subproject commit 806c9fd9c1b2356393d142dacc8d4879fb235fd6
|
Loading…
Reference in New Issue
Block a user