imnyang/cinny
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Add arrow to message bubbles and improve spacing (#2474)

Browse source 
* Add arrow to message bubbles and improve spacing

* make bubble message avatar smaller

* add bubble layout for event content

* adjust bubble arrow

* fix missing return statement for event content

* hide bubble for event content

* add new arrow to bubble message

* fix avatar username relative alignment

* fix types

* fix code block header background

* revert avatar size and make arrow less sharp

* show event messages timestamp to right when bubble is hidden

* fix avatar base css

* move message header outside bubble

* fix event time appears on left in hidden bubles
This commit is contained in:
Ajay Bura 2025-09-19 16:36:05 +05:30 • committed by GitHub
commit afc251aa7c
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
6 changed files with 111 additions and 27 deletions
Download patch file Download diff file Expand all files Collapse all files

14
src/app/styles/CustomHtml.css.ts
View file

@ -1,6 +1,7 @@
import { style } from '@vanilla-extract/css';
import { recipe } from '@vanilla-extract/recipes';
import { color, config, DefaultReset, toRem } from 'folds';
import { ContainerColor } from './ContainerColor.css';
export const MarginSpaced = style({
marginBottom: config.space.S200,
@ -92,11 +93,14 @@ export const CodeBlock = style([
overflow: 'hidden',
},
]);
export const CodeBlockHeader = style({
padding: `0 ${config.space.S200} 0 ${config.space.S300}`,
borderBottomWidth: config.borderWidth.B300,
gap: config.space.S200,
});
export const CodeBlockHeader = style([
ContainerColor({ variant: 'Surface' }),
{
padding: `0 ${config.space.S200} 0 ${config.space.S300}`,
borderBottomWidth: config.borderWidth.B300,
gap: config.space.S200,
},
]);
export const CodeBlockInternal = style([
CodeFont,
{