diff --git a/client/src/components/card/claim-username.css b/client/src/components/card/claim-username.css index 18f0deb..a88a345 100644 --- a/client/src/components/card/claim-username.css +++ b/client/src/components/card/claim-username.css @@ -2,9 +2,9 @@ --claim-border: #E5E4E2; --username-bg: #E5E4E2; --username-color: #000; - --username-input-bg: #FFF; + --username-input-bg: #F9F9F9; --username-input-color: #000; - --submit-bg: #FFF; + --submit-bg: #F9F9F9; } [data-theme='dark'] { @@ -71,7 +71,6 @@ padding: 0 20px; width: 100%; font-size: 16px; - font-weight: 600; background-color: var(--username-input-bg); color: var(--username-input-color); } @@ -114,7 +113,7 @@ @media screen and (max-width: 480px) { #claim-username { - margin-bottom: 10px; + margin-bottom: 5px; } #claim-username .username-input .domain { diff --git a/client/src/components/card/closed-debate-card.css b/client/src/components/card/closed-debate-card.css index c238a1d..04477be 100644 --- a/client/src/components/card/closed-debate-card.css +++ b/client/src/components/card/closed-debate-card.css @@ -43,13 +43,20 @@ #closed-card .left h2 { font-size: 20px; font-weight: 600; - max-width: 300px; + /* max-width: 300px; text-overflow: ellipsis; - white-space: nowrap; + white-space: nowrap; */ overflow: hidden; + display: -webkit-box; + -webkit-line-clamp: 2; + -webkit-box-orient: vertical; cursor: pointer; } +#closed-card .left h2:hover { + text-decoration: underline; +} + #closed-card-loading .left .topic .loading-skeleton { max-width: 300px; height: 25px; @@ -129,8 +136,8 @@ #closed-card .right .user-info .debate-from img, #closed-card .right .user-info .debate-by img { - width: 60px; - height: 60px; + width: 40px; + height: 40px; object-fit: cover; border: 2px solid var(--explore_input_bg); border-radius: 10px; @@ -138,8 +145,8 @@ } #closed-card-loading .right .user-info .debater .loading-skeleton:nth-child(1) { - width: 60px; - height: 60px; + width: 40px; + height: 40px; border-radius: 10px; } @@ -169,6 +176,15 @@ font-weight: unset; } +#closed-card .right .user-info .debate-from img:hover~p:last-child, +#closed-card .right .user-info .debate-by img:hover~p:last-child, +#closed-card .right .user-info .debate-from p:nth-child(2):hover~p:last-child, +#closed-card .right .user-info .debate-by p:nth-child(2):hover~p:last-child, +#closed-card .right .user-info .debate-from p:last-child:hover, +#closed-card .right .user-info .debate-by p:last-child:hover { + text-decoration: underline; +} + #closed-card-loading .right .user-info .debater .loading-skeleton:nth-child(3) { width: 60px; height: 15px; @@ -245,9 +261,9 @@ flex: unset; } - #closed-card .left h2 { + /* #closed-card .left h2 { max-width: 350px; - } + } */ #closed-card .left p { font-size: 15px; @@ -279,11 +295,11 @@ } } -@media screen and (max-width: 767px) { +/* @media screen and (max-width: 767px) { #closed-card .left h2 { max-width: 400px; } -} +} */ @media screen and (max-width: 480px) { @@ -293,7 +309,7 @@ } #closed-card .left h2 { - max-width: 100%; + /* max-width: 100%; */ font-size: 18px; } diff --git a/client/src/components/card/closed-debate-card.tsx b/client/src/components/card/closed-debate-card.tsx index 6abd687..f8cbca2 100644 --- a/client/src/components/card/closed-debate-card.tsx +++ b/client/src/components/card/closed-debate-card.tsx @@ -10,11 +10,15 @@ const ClosedDebateCard = () => { const navigate = useNavigate(); const { sidebar } = useNavStore(); + const handleProfileClick = (username: string) => { + navigate(`/${username}`); + } + return (
-

navigate('/')}> - Sony is the best camera of all time. Sony is the best camera of all time. Sony is the best camera of all time. +

navigate('/')}> + Sony is the best camera of all time.

Lorem ipsum dolor sit amet consectetur adipisicing elit. Non labore necessitatibus reiciendis rem ad perferendis, id officia omnis voluptas eius veritatis explicabo harum! Vero porro labore quo ab aut. Nesciunt! @@ -27,14 +31,14 @@ const ClosedDebateCard = () => {

- -

Aniket Das

-

aniketdas

+ handleProfileClick('aniketdas')} /> +

handleProfileClick('aniketdas')}>Aniket Das

+

handleProfileClick('aniketdas')}>aniketdas

- -

Pratik Prasad

-

pratikprasad

+ handleProfileClick('pratikprasad')} /> +

handleProfileClick('pratikprasad')}>Pratik Prasad

+

handleProfileClick('pratikprasad')}>pratikprasad

diff --git a/client/src/components/card/open-debate-card.css b/client/src/components/card/open-debate-card.css index 8f08db7..f5e1212 100644 --- a/client/src/components/card/open-debate-card.css +++ b/client/src/components/card/open-debate-card.css @@ -20,12 +20,19 @@ #open-card .debate-header h2 { font-size: 20px; font-weight: 600; - text-overflow: ellipsis; - white-space: nowrap; + /* text-overflow: ellipsis; + white-space: nowrap; */ overflow: hidden; + display: -webkit-box; + -webkit-line-clamp: 2; + -webkit-box-orient: vertical; cursor: pointer; } +#open-card .debate-header h2:hover { + text-decoration: underline; +} + #open-card-loading .debate-header .loading-skeleton:first-child { width: 400px; height: 25px; @@ -35,6 +42,7 @@ #open-card .debate-header a { padding-top: 3px; width: fit-content; + height: fit-content; color: var(--card_color_secondary); text-decoration: underline; font-size: 15px; @@ -120,6 +128,7 @@ white-space: nowrap; overflow: hidden; color: var(--card_color_secondary); + cursor: pointer; } #open-card .user-info p:nth-child(1) { @@ -144,6 +153,12 @@ font-size: 14px; } +#open-card .user-info img:hover~.user-detail p:nth-child(2), +#open-card .user-info .user-detail p:nth-child(1):hover~p:nth-child(2), +#open-card .user-info .user-detail p:nth-child(2):hover { + text-decoration: underline; +} + #open-card .debate-footer .created-date { width: auto; font-size: 14px; @@ -174,9 +189,9 @@ min-height: auto; } - #open-card .debate-header h2 { + /* #open-card .debate-header h2 { max-width: 350px; - } + } */ #open-card .debate-body { font-size: 15px; @@ -203,15 +218,11 @@ } #open-card .debate-header h2 { - max-width: 100%; + /* max-width: 100%; */ font-size: 18px; } #open-card-loading .debate-header .loading-skeleton:first-child { height: 23px; } - - #open-card .debate-header a { - padding-top: 0; - } } \ No newline at end of file diff --git a/client/src/components/card/open-debate-card.tsx b/client/src/components/card/open-debate-card.tsx index a899318..bc8017f 100644 --- a/client/src/components/card/open-debate-card.tsx +++ b/client/src/components/card/open-debate-card.tsx @@ -10,10 +10,14 @@ const OpenDebateCard = () => { const navigate = useNavigate(); const { sidebar } = useNavStore(); + const handleProfileClick = (username: string) => { + navigate(`/${username}`); + } + return (
-

navigate('/')}> +

navigate('/')}> Artificial Intelligence – Is AI good for society or not?

Debate @@ -24,10 +28,10 @@ const OpenDebateCard = () => { Fugiat repellat architecto pariatur fugit perspiciatis voluptas quidem autem.

- + handleProfileClick('julieroberts')} />
-

Julie Roberts

-

julieroberts

+

handleProfileClick('julieroberts')}>Julie Roberts

+

handleProfileClick('julieroberts')}>julieroberts