Button: Adjust height (#6137)

This commit is contained in:
zubiden 2025-08-21 12:05:27 +02:00 committed by Alexander Zinchuk
parent 745f4c6ba2
commit 969b9d28d8
7 changed files with 13 additions and 28 deletions

View File

@ -1,7 +1,7 @@
@use '../../styles/mixins';
.Composer {
--base-height: 3.5rem;
--base-height: 3rem;
align-items: flex-end;
@ -420,7 +420,7 @@
flex-grow: 1;
max-width: calc(100% - 4rem);
max-width: calc(100% - 3.5rem);
border-radius: var(--border-radius-messages);
border-bottom-right-radius: 0;

View File

@ -4,7 +4,7 @@ import { memo } from '../../lib/teact/teact';
import type { ApiSticker, ApiStickerSet } from '../../api/types';
import type { ObserveFn } from '../../hooks/useIntersectionObserver';
import { CHAT_HEIGHT_PX, STICKER_SIZE_GENERAL_SETTINGS } from '../../config';
import { STICKER_SIZE_GENERAL_SETTINGS } from '../../config';
import buildClassName from '../../util/buildClassName';
import useLastCallback from '../../hooks/useLastCallback';
@ -17,6 +17,8 @@ import StickerButton from './StickerButton';
import './StickerSetCard.scss';
const STICKER_SET_CARD_HEIGHT = 56;
type OwnProps = {
stickerSet?: ApiStickerSet;
noPlay?: boolean;
@ -79,8 +81,8 @@ const StickerSetCard: FC<OwnProps> = ({
return (
<ListItem
className={buildClassName('StickerSetCard', 'chat-item-clickable small-icon', className)}
style={`height: ${CHAT_HEIGHT_PX}px;`}
className={buildClassName('StickerSetCard', 'small-icon', className)}
style={`height: ${STICKER_SET_CARD_HEIGHT}px;`}
inactive={!firstSticker}
onClick={handleCardClick}
>

View File

@ -72,7 +72,6 @@
width: 100%;
max-width: calc(100% * var(--composer-hidden-scale));
padding: 0.25rem;
border-radius: var(--border-radius-messages);
font-weight: var(--font-weight-medium);

View File

@ -16,9 +16,7 @@ export default function calculateMiddleFooterTransforms(windowWidth: number, can
? REM
: 2 * REM;
const messageListWidth = getMessageListWidth(windowWidth);
const sendButtonWidth = windowWidth <= MOBILE_SCREEN_MAX_WIDTH
? 3.375 * REM
: 4 * REM;
const sendButtonWidth = 3 * REM;
const composerWidth = canPost
? messageListWidth - sidePadding - sendButtonWidth

View File

@ -230,8 +230,6 @@
margin-top: 0.5rem;
margin-inline: 0.5rem;
font-weight: var(--font-weight-medium);
}
.paymentContent {

View File

@ -682,8 +682,6 @@
transition: transform var(--layer-transition), opacity 0.15s ease;
&:global(.Composer) {
--base-height: 3rem;
@media (max-width: 600px) {
margin-bottom: env(safe-area-inset-bottom);
padding: 0 0.5rem 0.5rem;

View File

@ -39,11 +39,12 @@
justify-content: center;
width: 100%;
height: 3.5rem;
height: 3rem;
padding: 0.625rem;
border: 0;
border-radius: var(--border-radius-default);
font-weight: var(--font-weight-medium);
line-height: 1.2;
color: white;
text-decoration: none !important;
@ -324,15 +325,14 @@
}
&.smaller {
height: 2.75rem;
height: 2.5rem;
padding: 0.3125rem;
&.round {
width: 2.75rem;
width: 2.5rem;
}
&.pill {
height: 2.5rem;
padding: 0.3125rem 1rem;
border-radius: 1.25rem;
}
@ -356,23 +356,13 @@
}
}
}
@media (max-width: 600px) {
height: 2.5rem;
&.round {
width: 2.5rem;
}
}
}
&.tiny {
height: 2.25rem;
padding: 0.4375rem;
border-radius: var(--border-radius-default-small);
font-size: 0.875rem;
font-weight: var(--font-weight-medium);
&.round {
width: 2.25rem;
@ -393,7 +383,7 @@
}
&.round {
width: 3.5rem;
width: 3rem;
border-radius: 50%;
.icon {