@derockdev/discord-components-core/dist/collection/components/discord-button/discord-button.css

Web components to easily build and display fake Discord messages on your webpages.

.discord-button {
	display: flex;
	justify-content: center;
	align-items: center;
	cursor: pointer;
	margin: 4px 8px 4px 0;
	padding: 2px 16px;
	width: auto;
	height: 32px;
	min-width: 60px;
	min-height: 32px;
	-webkit-transition: background-color 0.17s ease, color 0.17s ease;
	transition: background-color 0.17s ease, color 0.17s ease;
	border-radius: 3px;
	font-size: 14px;
	font-weight: 500;
	line-height: 16px;
	text-decoration: none !important;
}

.discord-button.discord-button-success {
	color: #fff;
	background-color: #3ba55d;
}

.discord-button.discord-button-success.discord-button-hoverable:hover {
	background-color: #2d7d46;
}

.discord-button.discord-button-destructive {
	color: #fff;
	background-color: #ed4245;
}

.discord-button.discord-button-destructive.discord-button-hoverable:hover {
	background-color: #c03537;
}

.discord-button.discord-button-primary {
	color: #fff;
	background-color: #5865f2;
}

.discord-button.discord-button-primary.discord-button-hoverable:hover {
	background-color: #4752c4;
}

.discord-button.discord-button-secondary {
	color: #fff;
	background-color: #4f545c;
}

.discord-button.discord-button-secondary.discord-button-hoverable:hover {
	background-color: #5d6269;
}

.discord-button.discord-button-disabled {
	cursor: not-allowed;
	opacity: 0.5;
}

.discord-button .discord-button-launch {
	margin-left: 8px;
}

.discord-button .discord-button-emoji {
	margin-right: 4px;
	object-fit: contain;
	width: 1.375em;
	height: 1.375em;
	vertical-align: bottom;
}