diff --git a/landing/investor-profile.css b/landing/investor-profile.css index ac06aaf11..ded6431c4 100644 --- a/landing/investor-profile.css +++ b/landing/investor-profile.css @@ -1,89 +1,94 @@ .profile { display: flex; flex-direction: row; width: 576px; border-radius: 20px; padding: 40px 32px; background-color: #7e57c221; box-shadow: 0px 4px 4px #00000040, inset 0px 0px 12px 5px #7e57c24d; cursor: pointer; } +.profile:hover { + box-shadow: 0px 2px 4px #7847ff99, inset 0px 0px 12px 5px #7e57c24d; + transition: 200ms; +} + .profile img { border-radius: 72px; max-width: 144px; max-height: 144px; filter: saturate(0); align-self: center; } div.investorInfoContainer { margin-left: 32px; display: flex; flex-direction: column; } p.name { font-size: 24px; font-weight: 500; margin-bottom: 12px; } p.description { font-size: 18px; margin-bottom: 32px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; height: 56px; } p.involvement { font-weight: 500; font-size: 14px; margin-bottom: 8px; } .profile span svg { color: var(--grey); } .profile span svg:hover { color: var(--white); } .profile span > a + a { margin-left: 8px; } a.profileModal { background-color: #7e57c266; cursor: default; min-width: 576px; width: max-content; max-width: min(692px, 90vw); } p.descriptionModal { display: block; min-height: 56px; height: auto; } @media (max-width: 600px) { .profile { flex-direction: column; width: 90vw; } a.profileModal { min-width: 90vw; width: 90vw; } div.investorInfoContainer { margin: 16px 0 0; } }