discours.io/webapp
5
0
Fork 0
Code Issues Pull Requests Actions Projects Wiki Activity

Minor header controls fixes

Browse Source
This commit is contained in:
kvakazyambra 2022-11-13 16:17:38 +03:00
parent c269e0d632
commit 9a0b84be3d
2 changed files with 16 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
src/components/Nav/Header.module.scss
View File

@ -118,6 +118,7 @@
.usernav { .usernav {
display: inline-flex; display: inline-flex;
font-weight: 500;
padding-right: 0; padding-right: 0;
position: relative; position: relative;
width: auto; width: auto;
@ -484,7 +485,7 @@
} }
} }
.userControlItemWritePost { .userControlItemVerbose {
@include media-breakpoint-up(lg) { @include media-breakpoint-up(lg) {
width: auto; width: auto;

24
src/components/Nav/Header.tsx
View File

@ -148,20 +148,22 @@ export const Header = (props: Props) => {
</div> </div>
<div class={styles.usernav}> <div class={styles.usernav}>
<div class={clsx(styles.userControl, styles.userControl, 'col')}> <div class={clsx(styles.userControl, styles.userControl, 'col')}>
<div class={clsx(styles.userControlItem, styles.userControlItemWritePost)}> <div class={clsx(styles.userControlItem, styles.userControlItemVerbose)}>
<a href="/create" onClick={handleClientRouteLinkClick}> <a href="/create" onClick={handleClientRouteLinkClick}>
<span class={styles.textLabel}>{t('Create post')}</span> <span class={styles.textLabel}>{t('Create post')}</span>
<Icon name="pencil" class={styles.icon} /> <Icon name="pencil" class={styles.icon} />
</a> </a>
</div> </div>
<div class={styles.userControlItem}> <Show when={authorized()}>
<a href="#" onClick={handleBellIconClick}> <div class={styles.userControlItem}>
<div> <a href="#" onClick={handleBellIconClick}>
<Icon name="bell-white" counter={authorized() ? warnings().length : 1} /> <div>
</div> <Icon name="bell-white" counter={authorized() ? warnings().length : 1} />
</a> </div>
</div> </a>
</div>
</Show>
<Show when={visibleWarnings()}> <Show when={visibleWarnings()}>
<div class={clsx(styles.userControlItem, 'notifications')}> <div class={clsx(styles.userControlItem, 'notifications')}>
@ -172,9 +174,11 @@ export const Header = (props: Props) => {
<Show <Show
when={authorized()} when={authorized()}
fallback={ fallback={
<div class={clsx(styles.userControlItem, 'loginbtn')}> <div class={clsx(styles.userControlItem, styles.userControlItemVerbose, 'loginbtn')}>
<a href="?modal=auth&mode=login" onClick={handleClientRouteLinkClick}> <a href="?modal=auth&mode=login" onClick={handleClientRouteLinkClick}>
<Icon name="user-anonymous" /> <span class={styles.textLabel}>{t('Enter')}</span>
{/* TODO: заменить иконку */}
<Icon name="inbox-white" class={styles.icon} counter={session()?.news?.unread || 0} />
</a> </a>
</div> </div>
} }