muerwre/orchidmap-front
1
0
Fork 0
mirror of https://github.com/muerwre/orchidmap-front.git synced 2025-04-25 19:16:41 +07:00
Code Issues Projects Releases Packages Wiki Activity Actions

panels: fixed them

Browse source
This commit is contained in:
muerwre 2018-12-07 14:32:35 +07:00
parent d248b679ed
commit b8ba50517b
13 changed files with 171 additions and 182 deletions
Download patch file Download diff file Expand all files Collapse all files

51
src/components/dialogs/StickersDialog.jsx
View file

@ -4,32 +4,35 @@ import React from 'react';
import { STICKERS } from '$constants/stickers';
type Props = {
setActiveSticker: Function
setActiveSticker: Function,
width: Number,
};
export const StickersDialog = ({ setActiveSticker }: Props) => (
<div className="helper stickers-helper">
{
Object.keys(STICKERS).map(set => (
<div key={set}>
<div className="stickers-set-title">{STICKERS[set].title || null}</div>
<div className="stickers-grid">
{
Object.keys(STICKERS[set].layers).map(sticker => (
<div
style={{
backgroundImage: `url(${STICKERS[set].url})`,
backgroundPosition: `${-STICKERS[set].layers[sticker].off * 48}px 50%`,
}}
className="sticker-preview"
key={`${set}-${sticker}`}
onClick={() => setActiveSticker({ set, sticker })}
/>
))
}
export const StickersDialog = ({ setActiveSticker, width }: Props) => (
<div className="control-dialog" style={{ width }}>
<div className="helper stickers-helper">
{
Object.keys(STICKERS).map(set => (
<div key={set}>
<div className="stickers-set-title">{STICKERS[set].title || null}</div>
<div className="stickers-grid">
{
Object.keys(STICKERS[set].layers).map(sticker => (
<div
style={{
backgroundImage: `url(${STICKERS[set].url})`,
backgroundPosition: `${-STICKERS[set].layers[sticker].off * 48}px 50%`,
}}
className="sticker-preview"
key={`${set}-${sticker}`}
onClick={() => setActiveSticker({ set, sticker })}
/>
))
}
</div>
</div>
</div>
))
}
))
}
</div>
</div>
);