mirror of
https://github.com/irislib/iris-messenger.git
synced 2024-09-19 17:46:33 +00:00
icons, mobile modal fix
This commit is contained in:
parent
877b01aebe
commit
61fca5dc86
@ -7,6 +7,28 @@ export default {
|
||||
</svg>
|
||||
),
|
||||
|
||||
grid: (
|
||||
<svg width="20" height="20" viewBox="0 0 140 140">
|
||||
<rect
|
||||
x="8"
|
||||
y="8"
|
||||
width="124"
|
||||
height="124"
|
||||
rx="16"
|
||||
ry="16"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="16"
|
||||
/>
|
||||
<g stroke="currentColor" stroke-width="15">
|
||||
<line x1="50" y1="0" x2="50" y2="140" />
|
||||
<line x1="90" y1="0" x2="90" y2="140" />
|
||||
<line x1="0" y1="50" x2="140" y2="50" />
|
||||
<line x1="0" y1="90" x2="140" y2="90" />
|
||||
</g>
|
||||
</svg>
|
||||
),
|
||||
|
||||
feed: (
|
||||
<svg width="32" viewBox="0 0 24 24" fill="none">
|
||||
<g>
|
||||
@ -17,6 +39,20 @@ export default {
|
||||
</svg>
|
||||
),
|
||||
|
||||
plus: (
|
||||
<svg width="24" height="24" viewBox="0 0 24 24">
|
||||
<circle className="nav-plus-bg" cx="12" cy="12" r="12" />
|
||||
<path
|
||||
fill="#FFFFFF"
|
||||
d="M12,21.1c-0.4,0-0.7-0.3-0.7-0.7V3.7C11.3,3.3,11.6,3,12,3s0.7,0.3,0.7,0.7v16.7C12.7,20.7,12.4,21.1,12,21.1z"
|
||||
/>
|
||||
<path
|
||||
fill="#FFFFFF"
|
||||
d="M20.3,12.7H3.7C3.3,12.7,3,12.4,3,12s0.3-0.7,0.7-0.7h16.7c0.4,0,0.7,0.3,0.7,0.7S20.7,12.7,20.3,12.7z"
|
||||
/>
|
||||
</svg>
|
||||
),
|
||||
|
||||
reply: (
|
||||
<svg width="24" viewBox="0 0 24 24" fill="currentColor">
|
||||
<path
|
||||
@ -123,16 +159,20 @@ l1.2-2.4c0.1-0.2,0-0.5-0.2-0.6c-2.3-1.6-3.7-4-3.7-6.5c0-4.7,4.7-8.5,10.4-8.5S22.
|
||||
|
||||
chat: (
|
||||
<svg
|
||||
width="24"
|
||||
x="0px"
|
||||
y="0px"
|
||||
viewBox="0 0 486.736 486.736"
|
||||
style="enable-background:new 0 0 486.736 486.736;"
|
||||
width="24px"
|
||||
height="24px"
|
||||
fill="currentColor"
|
||||
viewBox="0 0 32 32"
|
||||
version="1.1"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
stroke="#000000"
|
||||
stroke-width="0"
|
||||
>
|
||||
<g>
|
||||
<title>envelope</title>
|
||||
<path d="M28 3.75h-24c-1.794 0.002-3.248 1.456-3.25 3.25v18c0.002 1.794 1.456 3.248 3.25 3.25h24c1.794-0.001 3.249-1.456 3.25-3.25v-18c-0.002-1.794-1.456-3.248-3.25-3.25h-0zM4 6.25h24c0.219 0.001 0.415 0.097 0.549 0.248l0.001 0.001-12.55 8.964-12.55-8.964c0.135-0.152 0.331-0.248 0.549-0.249h0zM28 25.75h-24c-0.414-0-0.75-0.336-0.75-0.75v-15.571l12.023 8.588c0.031 0.018 0.069 0.037 0.108 0.054l0.008 0.003c0.031 0.018 0.068 0.037 0.107 0.054l0.008 0.003c0.145 0.070 0.315 0.113 0.494 0.118l0.002 0h0.002c0.181-0.005 0.351-0.048 0.503-0.121l-0.008 0.003c0.046-0.020 0.084-0.039 0.12-0.060l-0.006 0.003c0.047-0.020 0.085-0.040 0.121-0.061l-0.006 0.003 12.023-8.588v15.571c-0 0.414-0.336 0.75-0.75 0.75v0z"></path>{' '}
|
||||
</g>
|
||||
<path
|
||||
fill="currentColor"
|
||||
d="M481.883,61.238l-474.3,171.4c-8.8,3.2-10.3,15-2.6,20.2l70.9,48.4l321.8-169.7l-272.4,203.4v82.4c0,5.6,6.3,9,11,5.9 l60-39.8l59.1,40.3c5.4,3.7,12.8,2.1,16.3-3.5l214.5-353.7C487.983,63.638,485.083,60.038,481.883,61.238z"
|
||||
/>
|
||||
</svg>
|
||||
),
|
||||
|
||||
|
||||
@ -429,7 +429,7 @@ class Feed extends Component {
|
||||
localState.get('settings').get('feed').get('display').put('grid');
|
||||
}}
|
||||
>
|
||||
{Icons.image}
|
||||
{Icons.grid}
|
||||
</a>
|
||||
</div>
|
||||
);
|
||||
|
||||
@ -7,20 +7,6 @@ import Key from '../nostr/Key';
|
||||
|
||||
import Identicon from './Identicon';
|
||||
|
||||
const plusIcon = (
|
||||
<svg width="24" height="24" viewBox="0 0 24 24">
|
||||
<circle class="nav-plus-bg" cx="12" cy="12" r="12" />
|
||||
<path
|
||||
fill="#FFFFFF"
|
||||
d="M12,21.1c-0.4,0-0.7-0.3-0.7-0.7V3.7C11.3,3.3,11.6,3,12,3s0.7,0.3,0.7,0.7v16.7C12.7,20.7,12.4,21.1,12,21.1z"
|
||||
/>
|
||||
<path
|
||||
fill="#FFFFFF"
|
||||
d="M20.3,12.7H3.7C3.3,12.7,3,12.4,3,12s0.3-0.7,0.7-0.7h16.7c0.4,0,0.7,0.3,0.7,0.7S20.7,12.7,20.3,12.7z"
|
||||
/>
|
||||
</svg>
|
||||
);
|
||||
|
||||
type Props = Record<string, unknown>;
|
||||
|
||||
type State = {
|
||||
@ -78,7 +64,7 @@ class Footer extends Component<Props, State> {
|
||||
onClick={(e) => this.handleFeedClick(e)}
|
||||
class={`btn ${activeRoute === '/' ? 'active' : ''}`}
|
||||
>
|
||||
{Icons.feed}
|
||||
{Icons.home}
|
||||
</a>
|
||||
<a href="/chat" className={`btn ${activeRoute.indexOf('/chat') === 0 ? 'active' : ''}`}>
|
||||
{this.state.unseenMsgsTotal ? (
|
||||
@ -89,7 +75,7 @@ class Footer extends Component<Props, State> {
|
||||
{Icons.chat}
|
||||
</a>
|
||||
<a href="/post/new" class={`btn ${activeRoute === '/post/new' ? 'active' : ''}`}>
|
||||
{plusIcon}
|
||||
{Icons.plus}
|
||||
</a>
|
||||
<a href={`/${key}`} class={`${activeRoute === `/${key}` ? 'active' : ''} my-profile`}>
|
||||
<Identicon str={key} width={34} />
|
||||
|
||||
@ -58,7 +58,7 @@ const Modal: FC<Props> = ({ centerVertically, showContainer, children, onClose }
|
||||
}, [handleKeyDown]);
|
||||
|
||||
const content = showContainer ? (
|
||||
<div class="msg" style={{ width: '600px' }} onClick={(e) => handleContainerClick(e)}>
|
||||
<div class="msg" style={{ width: '600px', 'max-width': 'calc(100vw - 40px)' }} onClick={(e) => handleContainerClick(e)}>
|
||||
<div class="msg-content" style={{ padding: '30px' }}>
|
||||
{children}
|
||||
</div>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user