|
|
|
|
@ -18,11 +18,11 @@ export const Wrapper = styled.div` |
|
|
|
|
${isMobileDevice |
|
|
|
|
? css` |
|
|
|
|
@media (max-width: 650px),(orientation: landscape){ |
|
|
|
|
width: 100%; |
|
|
|
|
align-items: start; |
|
|
|
|
height: auto; |
|
|
|
|
margin: 45px 0 20px 0; |
|
|
|
|
left: 0; |
|
|
|
|
width: 100%; |
|
|
|
|
padding: 0 0 0 12px; |
|
|
|
|
} |
|
|
|
|
` |
|
|
|
|
@ -41,10 +41,11 @@ export const ProfileName = styled.h1` |
|
|
|
|
? css` |
|
|
|
|
@media (max-width: 650px),(orientation: landscape){ |
|
|
|
|
font-size: 14px; |
|
|
|
|
line-height: 10px; |
|
|
|
|
line-height: 15px; |
|
|
|
|
white-space: nowrap; |
|
|
|
|
margin-bottom: 0; |
|
|
|
|
width: 100%; |
|
|
|
|
text-overflow: ellipsis; |
|
|
|
|
overflow: hidden; |
|
|
|
|
} |
|
|
|
|
` |
|
|
|
|
: ''}; |
|
|
|
|
@ -78,7 +79,11 @@ export const Details = styled.div` |
|
|
|
|
${isMobileDevice |
|
|
|
|
? css` |
|
|
|
|
padding-top: 8px; |
|
|
|
|
width: 100%; |
|
|
|
|
max-width: 200px; |
|
|
|
|
|
|
|
|
|
@media screen and (orientation: landscape) { |
|
|
|
|
max-width: 500px; |
|
|
|
|
} |
|
|
|
|
` |
|
|
|
|
: ''}; |
|
|
|
|
` |
|
|
|
|
@ -89,8 +94,8 @@ export const DetailsWrapper = styled.div` |
|
|
|
|
|
|
|
|
|
${isMobileDevice |
|
|
|
|
? css` |
|
|
|
|
width: 100%; |
|
|
|
|
flex-direction: row; |
|
|
|
|
width: 100%; |
|
|
|
|
` |
|
|
|
|
: ''}; |
|
|
|
|
` |
|
|
|
|
@ -137,13 +142,11 @@ ${isMobileDevice |
|
|
|
|
|
|
|
|
|
export const InfoItems = styled.div` |
|
|
|
|
display: flex; |
|
|
|
|
flex-direction: column; |
|
|
|
|
align-items: center; |
|
|
|
|
margin-bottom: 1.04rem; |
|
|
|
|
flex-direction: row; |
|
|
|
|
${isMobileDevice |
|
|
|
|
? css` |
|
|
|
|
width: 100%; |
|
|
|
|
margin-bottom: 0; |
|
|
|
|
|
|
|
|
|
@media (orientation: landscape){ |
|
|
|
|
@ -181,7 +184,6 @@ export const InfoName = styled(Name)` |
|
|
|
|
font-size: 10px; |
|
|
|
|
line-height: 19px; |
|
|
|
|
white-space: nowrap; |
|
|
|
|
width: 100%; |
|
|
|
|
} |
|
|
|
|
` |
|
|
|
|
: ''}; |
|
|
|
|
@ -204,8 +206,9 @@ export const SсBtnWrapper = styled.div` |
|
|
|
|
${isMobileDevice |
|
|
|
|
? css` |
|
|
|
|
flex-direction: column; |
|
|
|
|
padding-top: 8px; |
|
|
|
|
width: 50%; |
|
|
|
|
padding: 7px 10px 0 0; |
|
|
|
|
align-items: flex-end; |
|
|
|
|
width: 100%; |
|
|
|
|
` |
|
|
|
|
: ''}; |
|
|
|
|
` |
|
|
|
|
|