Browse Source

Add auth icon to chat menu. Closes #1879

pull/1886/head
Gabe Kangas 4 years ago
parent
commit
7a503fc282
No known key found for this signature in database
GPG Key ID: 9A56337728BC81EA
  1. 4
      webroot/js/components/chat/chat-menu.js
  2. 22
      webroot/js/components/icons/AuthIcon.js
  3. 1
      webroot/js/components/icons/index.js

4
webroot/js/components/chat/chat-menu.js

@ -2,7 +2,7 @@ import { h, createContext } from '/js/web_modules/preact.js'; @@ -2,7 +2,7 @@ import { h, createContext } from '/js/web_modules/preact.js';
import htm from '/js/web_modules/htm.js';
import { useState, useEffect, useRef } from '/js/web_modules/preact/hooks.js';
import UsernameForm from './username.js';
import { ChatIcon, UserIcon, CaretDownIcon } from '../icons/index.js';
import { ChatIcon, UserIcon, CaretDownIcon, AuthIcon } from '../icons/index.js';
const html = htm.bind(h);
@ -40,7 +40,7 @@ export const ChatMenu = (props) => { @@ -40,7 +40,7 @@ export const ChatMenu = (props) => {
html`<li>
<button type="button" id="chat-auth" onClick=${showAuthModal}>
Authenticate
<span><${ChatIcon} /></span>
<span><${AuthIcon} /></span>
</button>
</li>`;

22
webroot/js/components/icons/AuthIcon.js

@ -0,0 +1,22 @@ @@ -0,0 +1,22 @@
import { h } from '/js/web_modules/preact.js';
import htm from '/js/web_modules/htm.js';
const html = htm.bind(h);
export const AuthIcon = ({ className }) => {
return html`
<svg
class="w-6 h-6"
fill="none"
stroke="currentColor"
viewBox="0 0 24 24"
xmlns="http://www.w3.org/2000/svg"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M15 7a2 2 0 012 2m4 0a6 6 0 01-7.743 5.743L11 17H9v2H7v2H4a1 1 0 01-1-1v-2.586a1 1 0 01.293-.707l5.964-5.964A6 6 0 1121 9z"
></path>
</svg>
`;
};

1
webroot/js/components/icons/index.js

@ -4,3 +4,4 @@ export { EditIcon } from './EditIcon.js'; @@ -4,3 +4,4 @@ export { EditIcon } from './EditIcon.js';
export { CheckIcon } from './CheckIcon.js';
export { CloseIcon } from './CloseIcon.js';
export { CaretDownIcon } from './CaretDownIcon.js';
export { AuthIcon } from './AuthIcon.js';

Loading…
Cancel
Save