🆙 Visual updates Group Forums

This commit is contained in:
duckietm
2026-06-03 07:46:28 +02:00
parent 03066abf54
commit 0c694820f7
4 changed files with 13 additions and 15 deletions
@@ -58,8 +58,8 @@ export const GroupForumNewThreadView: FC<GroupForumNewThreadViewProps> = props =
return ( return (
<Column className="h-full p-3" gap={ 2 }> <Column className="h-full p-3" gap={ 2 }>
<Flex gap={ 2 } alignItems="center"> <Flex gap={ 2 } alignItems="center">
<Text pointer underline onClick={ onBack }> <Text pointer bold onClick={ onBack }>
&laquo; { LocalizeText('groupforum.view.back') } <span className="inline-block w-[7px] h-[7px] border-l-2 border-b-2 border-current rotate-45 mr-1 align-middle" /> { LocalizeText('groupforum.view.back') }
</Text> </Text>
</Flex> </Flex>
<Column gap={ 1 }> <Column gap={ 1 }>
@@ -58,8 +58,8 @@ export const GroupForumSettingsView: FC<GroupForumSettingsViewProps> = props =>
return ( return (
<Column className="h-full p-3" gap={ 3 }> <Column className="h-full p-3" gap={ 3 }>
<Flex gap={ 2 } alignItems="center"> <Flex gap={ 2 } alignItems="center">
<Text pointer underline onClick={ onBack }> <Text pointer bold onClick={ onBack }>
&laquo; { LocalizeText('groupforum.view.back') } <span className="inline-block w-[7px] h-[7px] border-l-2 border-b-2 border-current rotate-45 mr-1 align-middle" /> { LocalizeText('groupforum.view.back') }
</Text> </Text>
</Flex> </Flex>
<Text bold>{ LocalizeText('groupforum.settings.window_title') }</Text> <Text bold>{ LocalizeText('groupforum.settings.window_title') }</Text>
@@ -92,8 +92,8 @@ export const GroupForumThreadListView: FC<GroupForumThreadListViewProps> = props
<Column className="h-full" gap={ 0 }> <Column className="h-full" gap={ 0 }>
<Flex className="bg-muted p-2 border-b" gap={ 2 } alignItems="center" justifyContent="between"> <Flex className="bg-muted p-2 border-b" gap={ 2 } alignItems="center" justifyContent="between">
<Flex gap={ 2 } alignItems="center"> <Flex gap={ 2 } alignItems="center">
<Text pointer underline onClick={ onBack }> <Text pointer bold onClick={ onBack }>
&laquo; { LocalizeText('groupforum.view.back') } <span className="inline-block w-[7px] h-[7px] border-l-2 border-b-2 border-current rotate-45 mr-1 align-middle" /> { LocalizeText('groupforum.view.back') }
</Text> </Text>
</Flex> </Flex>
<Flex gap={ 1 } alignItems="center"> <Flex gap={ 1 } alignItems="center">
@@ -203,19 +203,19 @@ export const GroupForumThreadView: FC<GroupForumThreadViewProps> = props =>
<Column className="h-full" gap={ 0 }> <Column className="h-full" gap={ 0 }>
<Flex className="bg-muted p-2 border-b" gap={ 2 } alignItems="center" justifyContent="between"> <Flex className="bg-muted p-2 border-b" gap={ 2 } alignItems="center" justifyContent="between">
<Flex gap={ 2 } alignItems="center"> <Flex gap={ 2 } alignItems="center">
<Text pointer underline onClick={ onBack }> <Text pointer bold onClick={ onBack }>
&laquo; { LocalizeText('groupforum.view.back') } <span className="inline-block w-[7px] h-[7px] border-l-2 border-b-2 border-current rotate-45 mr-1 align-middle" /> { LocalizeText('groupforum.view.back') }
</Text> </Text>
</Flex> </Flex>
{ canModerate && { canModerate &&
<Flex gap={ 1 }> <Flex gap={ 1 }>
<Button variant={ threadInfo?.isPinned ? 'warning' : 'outline-secondary' } className="btn-sm" onClick={ togglePinThread }> <Button variant="outline-secondary" className="btn-sm rounded-md text-white bg-[#5cb85c] border-[#5cb85c] [box-shadow:inset_0_2px_#ffffff26,inset_0_-2px_#0000001a,0_1px_#0000001a] hover:text-white hover:bg-[#4cae4c] hover:border-[#47a447]" onClick={ togglePinThread }>
{ threadInfo?.isPinned ? LocalizeText('groupforum.thread.unpin') : LocalizeText('groupforum.thread.pin') } { threadInfo?.isPinned ? LocalizeText('groupforum.thread.unpin') : LocalizeText('groupforum.thread.pin') }
</Button> </Button>
<Button variant={ isLocked ? 'danger' : 'outline-secondary' } className="btn-sm" onClick={ toggleLockThread }> <Button variant="outline-secondary" className="btn-sm rounded-md text-white bg-[#5cb85c] border-[#5cb85c] [box-shadow:inset_0_2px_#ffffff26,inset_0_-2px_#0000001a,0_1px_#0000001a] hover:text-white hover:bg-[#4cae4c] hover:border-[#47a447]" onClick={ toggleLockThread }>
{ isLocked ? LocalizeText('groupforum.thread.unlock') : LocalizeText('groupforum.thread.lock') } { isLocked ? LocalizeText('groupforum.thread.unlock') : LocalizeText('groupforum.thread.lock') }
</Button> </Button>
<Button variant="outline-danger" className="btn-sm" onClick={ hideThread }> <Button variant="outline-secondary" className="btn-sm rounded-md text-white bg-[#5cb85c] border-[#5cb85c] [box-shadow:inset_0_2px_#ffffff26,inset_0_-2px_#0000001a,0_1px_#0000001a] hover:text-white hover:bg-[#4cae4c] hover:border-[#47a447]" onClick={ hideThread }>
{ LocalizeText('groupforum.thread.hide') } { LocalizeText('groupforum.thread.hide') }
</Button> </Button>
<Button variant="danger" className="btn-sm" onClick={ deleteThread }> <Button variant="danger" className="btn-sm" onClick={ deleteThread }>
@@ -242,10 +242,8 @@ export const GroupForumThreadView: FC<GroupForumThreadViewProps> = props =>
className={ `p-3 border-b ${ (message.state !== STATE_NORMAL) ? 'bg-danger bg-opacity-10' : '' }` } className={ `p-3 border-b ${ (message.state !== STATE_NORMAL) ? 'bg-danger bg-opacity-10' : '' }` }
gap={ 3 }> gap={ 3 }>
<Column className="flex-shrink-0 items-center w-[50px]" gap={ 1 }> <Column className="flex-shrink-0 items-center w-[50px]" gap={ 1 }>
<div className="w-[40px] h-[40px] rounded-full mx-auto overflow-hidden bg-[rgba(255,255,255,0.1)] flex justify-center"> <div className="relative w-[40px] h-[40px] rounded-full mx-auto overflow-hidden bg-[rgba(255,255,255,0.1)]">
<div className="mt-[-25px]"> <LayoutAvatarImageView figure={ message.authorFigure } headOnly={ true } direction={ 2 } style={ { backgroundSize: '80px auto', backgroundPosition: '-19px -28px' } } />
<LayoutAvatarImageView figure={ message.authorFigure } headOnly={ true } direction={ 2 } />
</div>
</div> </div>
<Text small bold pointer underline onClick={ () => GetUserProfile(message.authorId) }> <Text small bold pointer underline onClick={ () => GetUserProfile(message.authorId) }>
{ message.authorName } { message.authorName }