830d05e217* Add basic `m.thread` support * Fix types * Update to v4 * Fix auto formatting mess * Add threaded reply indicators * Fix reply overflow * Fix replying to edited threaded replies * Add thread indicator to room input * Fix editing encrypted events * Use `toRem` function for converting units --------- Co-authored-by: Ajay Bura <32841439+ajbura@users.noreply.github.com>
47 lines
818 B
TypeScript
47 lines
818 B
TypeScript
import { style } from '@vanilla-extract/css';
|
|
import { config, toRem } from 'folds';
|
|
|
|
export const ReplyBend = style({
|
|
flexShrink: 0,
|
|
});
|
|
|
|
export const ThreadIndicator = style({
|
|
opacity: config.opacity.P300,
|
|
gap: toRem(2),
|
|
|
|
selectors: {
|
|
'button&': {
|
|
cursor: 'pointer',
|
|
},
|
|
':hover&': {
|
|
opacity: config.opacity.P500,
|
|
},
|
|
},
|
|
});
|
|
|
|
export const ThreadIndicatorIcon = style({
|
|
width: toRem(14),
|
|
height: toRem(14),
|
|
});
|
|
|
|
export const Reply = style({
|
|
marginBottom: toRem(1),
|
|
minWidth: 0,
|
|
maxWidth: '100%',
|
|
minHeight: config.lineHeight.T300,
|
|
selectors: {
|
|
'button&': {
|
|
cursor: 'pointer',
|
|
},
|
|
},
|
|
});
|
|
|
|
export const ReplyContent = style({
|
|
opacity: config.opacity.P300,
|
|
|
|
selectors: {
|
|
[`${Reply}:hover &`]: {
|
|
opacity: config.opacity.P500,
|
|
},
|
|
},
|
|
});
|