diff --git a/src/app/PosePicker.js b/src/app/PosePicker.js
index 1b9bb78..3fed392 100644
--- a/src/app/PosePicker.js
+++ b/src/app/PosePicker.js
@@ -14,6 +14,13 @@ import {
import { safeImageUrl } from "./util";
+// From https://twemoji.twitter.com/, thank you!
+import twemojiSmile from "../images/twemoji/smile.svg";
+import twemojiCry from "../images/twemoji/cry.svg";
+import twemojiSick from "../images/twemoji/sick.svg";
+import twemojiMasc from "../images/twemoji/masc.svg";
+import twemojiFem from "../images/twemoji/fem.svg";
+
function PosePicker({ onLockFocus, onUnlockFocus }) {
const theme = useTheme();
@@ -33,26 +40,28 @@ function PosePicker({ onLockFocus, onUnlockFocus }) {
d="flex"
alignItems="center"
justifyContent="center"
- border="2px solid transparent"
_focus={{ borderColor: "gray.50" }}
_hover={{ borderColor: "gray.50" }}
outline="initial"
className={cx(
css`
- border: 2px solid transparent;
+ border: 1px solid transparent !important;
+ transition: border-color 0.2s !important;
&:focus,
&:hover,
&.is-open {
- border-color: ${theme.colors.gray["50"]};
+ border-color: ${theme.colors.gray["50"]} !important;
+ }
+
+ &.is-open {
+ border-width: 2px !important;
}
`,
isOpen && "is-open"
)}
>
-
- 😊
-
+
@@ -61,45 +70,45 @@ function PosePicker({ onLockFocus, onUnlockFocus }) {
|
-
- 😊
-
-
- 😢
-
-
- 🤒
-
+
+
+ |
+
+
+ |
+
+
+ |
-
- 🙍♂️
-
-
+ |
+
+ |
+
- |
-
+
+
- |
-
+
+
- |
+
-
- 🙍♀️
-
-
+ |
+
+ |
+
- |
-
+
+
- |
-
+
+
- |
+
@@ -112,13 +121,14 @@ function PosePicker({ onLockFocus, onUnlockFocus }) {
);
}
-function PoseCell({ children }) {
+function Cell({ children, as }) {
+ const Tag = as;
return (
-
+
{children}
- |
+
);
}
@@ -144,4 +154,8 @@ function PoseButton({ src }) {
);
}
+function EmojiImage({ src, "aria-label": ariaLabel }) {
+ return ;
+}
+
export default PosePicker;
diff --git a/src/images/twemoji/cry.svg b/src/images/twemoji/cry.svg
new file mode 100644
index 0000000..1122bf5
--- /dev/null
+++ b/src/images/twemoji/cry.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/src/images/twemoji/fem.svg b/src/images/twemoji/fem.svg
new file mode 100644
index 0000000..7a4864f
--- /dev/null
+++ b/src/images/twemoji/fem.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/src/images/twemoji/masc.svg b/src/images/twemoji/masc.svg
new file mode 100644
index 0000000..1bb5433
--- /dev/null
+++ b/src/images/twemoji/masc.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/src/images/twemoji/sick.svg b/src/images/twemoji/sick.svg
new file mode 100644
index 0000000..b6ac0a9
--- /dev/null
+++ b/src/images/twemoji/sick.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/src/images/twemoji/smile.svg b/src/images/twemoji/smile.svg
new file mode 100644
index 0000000..99ac39c
--- /dev/null
+++ b/src/images/twemoji/smile.svg
@@ -0,0 +1 @@
+
\ No newline at end of file