nostr/iris-messenger
1
0
Fork 0
mirror of https://github.com/irislib/iris-messenger.git synced 2024-10-18 22:23:23 +00:00
Code Issues Packages Projects Releases Wiki Activity

hide most profile buttons behind dropdown menu

Browse Source
This commit is contained in:
Martti Malmi 2022-08-27 17:59:56 +03:00
parent 5f62befd70
commit 5ba23142fa
2 changed files with 27 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/css/style.css
View File

@ -2274,6 +2274,10 @@ form.public {
width: 100%;
margin-left: 15px;
}
.profile-header {
margin-bottom: 0;
}
}
@media (min-width: 626px) {

33
src/js/views/Profile.js
View File

@ -224,7 +224,24 @@ class Profile extends View {
${profilePhoto}
</div>
<div class="profile-header-stuff">
<h3 class="profile-name" placeholder=${this.isMyProfile ? t('name') : ''} contenteditable=${this.isMyProfile} onInput=${e => this.onNameInput(e)}>${this.state.name}</h3>
<div style="display:flex; flex-direction:row;">
<h3 style="flex: 1" class="profile-name" placeholder=${this.isMyProfile ? t('name') : ''} contenteditable=${this.isMyProfile} onInput=${e => this.onNameInput(e)}>
${this.state.name}
</h3>
<div class="dropdown profile-actions">
<div class="dropbtn">\u2026</div>
<div class="dropdown-content">
${this.isMyProfile ? '' : html`<${BlockButton} key=${`${this.props.id}block`} id=${this.props.id}/>`}
<${CopyButton} key=${`${this.props.id}copy`} text=${t('copy_link')} title=${this.state.name} copyStr=${window.location.href}/>
<${Button} onClick=${() => $(this.qrRef.current).toggle()}>${t('show_qr_code')}<//>
${this.isMyProfile ? '' : html`
<${Button} class="show-settings" onClick=${() => this.onClickSettings()}>${t('settings')}<//>
`}
</div>
</div>
</div>
<div class="profile-about hidden-xs">
<p class="profile-about-content" placeholder=${this.isMyProfile ? t('about') : ''} contenteditable=${this.isMyProfile} onInput=${e => this.onAboutInput(e)}>${this.state.about}</p>
</div>
@ -245,18 +262,14 @@ class Profile extends View {
` : ''}
${this.isMyProfile ? '' : html`<${FollowButton} key=${`${this.props.id}follow`} id=${this.props.id}/>`}
<${Button} onClick=${() => route(`/chat/${ this.props.id}`)}>${t('send_message')}<//>
<${CopyButton} key=${`${this.props.id}copy`} text=${t('copy_link')} title=${this.state.name} copyStr=${window.location.href}/>
<${Button} onClick=${() => $(this.qrRef.current).toggle()}>${t('show_qr_code')}<//>
${this.isMyProfile ? '' : html`
<${Button} class="show-settings" onClick=${() => this.onClickSettings()}>${t('settings')}<//>
`}
${this.isMyProfile ? '' : html`<${BlockButton} key=${`${this.props.id}block`} id=${this.props.id}/>`}
</div>
</div>
</div>
<div class="profile-about visible-xs-flex">
<p class="profile-about-content" placeholder=${this.isMyProfile ? t('about') : ''} contenteditable=${this.isMyProfile} onInput=${e => this.onAboutInput(e)}>${this.state.about}</p>
</div>
${(this.isMyProfile || this.state.about) ? html`
<div class="profile-about visible-xs-flex">
<p class="profile-about-content" placeholder=${this.isMyProfile ? t('about') : ''} contenteditable=${this.isMyProfile} onInput=${e => this.onAboutInput(e)}>${this.state.about}</p>
</div>
` : ''}
<p ref=${this.qrRef} style="display:none" class="qr-container"></p>
${this.renderSettings()}