@nodeject/ui-components/esm/talk/Talk.module.less

UI library for non-trivial components

.talk {
	height: 100%;
	background-color: white;

	:global {
		.ant-comment-inner {
			padding: 8px 0;
		}
		// // get rids of power by
		.fr-view *[data-f-id] {
			display: none;
		}
	}
}

.goToEndOfConversation {
	position: sticky;
	left: 300px;
}

.unreadMessagesNotification {
	&:extend(.goToEndOfConversation);
	animation-duration: 2s;
	animation-iteration-count: 1;
	animation-name: bounce;
	animation-timing-function: ease;
}

@keyframes bounce {
	0% {
		transform: scale(1, 1) translateY(0);
	}
	10% {
		transform: scale(1.1, .9) translateY(0);
	}
	30% {
		transform: scale(.9, 1.1) translateY(-30px);
	}
	50% {
		transform: scale(1.05, .95) translateY(0);
	}
	57% {
		transform: scale(1, 1) translateY(-7px);
	}
	64% {
		transform: scale(1, 1) translateY(0);
	}
	100% {
		transform: scale(1, 1) translateY(0);
	}
}