add mobile button styling

This commit is contained in:
Tom (plebeius.eth)
2024-06-04 16:13:20 +02:00
parent 1d8452684b
commit 709efe9869
2 changed files with 11 additions and 11 deletions
@@ -4,14 +4,6 @@
filter: var(--filter80);
}
.button {
color: var(--text-info);
font-weight: bold;
text-decoration: none;
padding: 0 4px 0 4px;
cursor: pointer;
}
.modal {
z-index: 7;
background-color: var(--challenge-modal-background-color);
@@ -74,8 +66,6 @@
.bottom button {
text-transform: capitalize;
cursor: pointer;
padding: 2px 6px 3px;
margin-left: 2px;
margin-bottom: 2px;
}
@@ -90,6 +80,12 @@
}
}
@media (min-width: 640px) {
.bottom button {
cursor: pointer;
padding: 2px 6px 3px;
}
}
@media (max-width: 640px) {
.checkbox {
+5 -1
View File
@@ -6,6 +6,7 @@ import styles from './edit-menu.module.css';
import { alertChallengeVerificationFailed } from '../../../lib/utils/challenge-utils';
import useChallengesStore from '../../../stores/use-challenges-store';
import _ from 'lodash';
import useIsMobile from '../../../hooks/use-is-mobile';
const { addChallenge } = useChallengesStore.getState();
@@ -18,6 +19,7 @@ type EditMenuProps = {
const EditMenu = ({ commentCid, isAccountMod, isAccountCommentAuthor, isCommentAuthorMod }: EditMenuProps) => {
const { t } = useTranslation();
const isMobile = useIsMobile();
let post: any;
const comment = useComment({ commentCid });
const { editedComment } = useEditedComment({ comment });
@@ -222,7 +224,9 @@ const EditMenu = ({ commentCid, isAccountMod, isAccountCommentAuthor, isCommentA
<input type='text' onChange={onReason} defaultValue={post?.reason} size={14} />
</div>
<div className={styles.bottom}>
<button onClick={_publishCommentEdit}>{t('save')}</button>
<button className={isMobile ? 'button' : ''} onClick={_publishCommentEdit}>
{t('save')}
</button>
</div>
</div>
</div>