Padding and Text alignment
This commit is contained in:
parent
31bd014abf
commit
94223fd80c
1 changed files with 6 additions and 14 deletions
|
@ -18,9 +18,10 @@ const Card = styled.div`
|
|||
width: 30rem;
|
||||
min-height: 10rem;
|
||||
max-height: 15rem;
|
||||
margin-bottom: 2rem;
|
||||
|
||||
// themeing
|
||||
border-top: 0.125rem solid;
|
||||
border-top: 0.25rem solid;
|
||||
border-radius: 10px;
|
||||
|
||||
color: ${({ theme }) => theme.colors.primary};
|
||||
|
@ -202,11 +203,11 @@ const CardDescriptionCommon = css`
|
|||
// content visible when expanded
|
||||
const CardDescriptionWrap = styled.div`
|
||||
${CardDescriptionCommon}
|
||||
padding: 0 0.5rem;
|
||||
padding: 0 1rem;
|
||||
margin-bottom: 2rem;
|
||||
overflow-y: scroll;
|
||||
scrollbar-width: thin;
|
||||
|
||||
width: 100%;
|
||||
|
||||
p {
|
||||
margin-top: 0;
|
||||
|
@ -218,6 +219,7 @@ const CardDescriptionExtended = styled.p`
|
|||
${CardDescriptionCommon}
|
||||
margin: 0;
|
||||
margin-bottom: 0.9rem;
|
||||
width: 100%;
|
||||
`
|
||||
|
||||
const CardDescription = ({ content }: { content: Service }) => {
|
||||
|
@ -240,16 +242,6 @@ const CardDescription = ({ content }: { content: Service }) => {
|
|||
return ret;
|
||||
}
|
||||
|
||||
const CardDescriptionCollapsed = styled.p`
|
||||
max-height: 0rem;
|
||||
visibility: hidden;
|
||||
${CardDescriptionCommon}
|
||||
text-align: center;
|
||||
|
||||
transition-property: max-height, visibility;
|
||||
transition-delay: 2s;
|
||||
`
|
||||
|
||||
// exported Card Elements
|
||||
//#######################
|
||||
|
||||
|
@ -270,7 +262,7 @@ export const ServiceCardMobile = ({ content }: { content: Service }) => {
|
|||
else {
|
||||
card = (
|
||||
<Card>
|
||||
<CardTitle content={content}/>
|
||||
<CardTitle content={content} href={""}/>
|
||||
<CardDescription content={content}/>
|
||||
</Card>
|
||||
)
|
||||
|
|
Loading…
Reference in a new issue