fix button style of skin viewer

This commit is contained in:
Pig Fang 2020-03-05 09:34:45 +08:00
parent 5052e9ab04
commit bc0531c737
2 changed files with 11 additions and 5 deletions

View File

@ -18,3 +18,9 @@
cursor: pointer;
}
}
.btn {
display: flex;
justify-content: center;
align-items: center;
}

View File

@ -216,29 +216,29 @@ const Viewer: React.FC<Props> = props => {
<div className="card-footer">
<div className="mt-2 mb-3 d-flex">
<div
className="btn-color bg-white display-inline-block rounded-pill mr-2 mb-1 elevation-2"
className="btn-color bg-white rounded-pill mr-2 elevation-2"
title={t('colors.white')}
onClick={setWhite}
/>
<div
className="btn-color bg-black display-inline-block rounded-pill mr-2 mb-1 elevation-2"
className="btn-color bg-black rounded-pill mr-2 elevation-2"
title={t('colors.black')}
onClick={setBlack}
/>
<div
className="btn-color bg-gray display-inline-block rounded-pill mr-2 mb-1 elevation-2"
className="btn-color bg-gray rounded-pill mr-2 elevation-2"
title={t('colors.gray')}
onClick={setGray}
/>
<div
className="btn-color bg-green display-inline-block rounded-pill mr-2 mb-1 elevation-2 text-center"
className={`btn-color bg-green rounded-pill mr-2 elevation-2 ${styles.btn}`}
title={t('colors.prev')}
onClick={setPrevPicture}
>
<i className="fas fa-arrow-left"></i>
</div>
<div
className="btn-color bg-green display-inline-block rounded-pill mr-2 mb-1 elevation-2 text-center"
className={`btn-color bg-green rounded-pill mr-2 elevation-2 ${styles.btn}`}
title={t('colors.next')}
onClick={setNextPicture}
>