import styled from 'styled-components';
import { NodeViewWrapper, NodeViewContent } from '@tiptap/react';

export const ButtonNode = styled(NodeViewWrapper)`
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 10px 20px;
	color: #0d4acc;
	font-size: 18px;
	line-height: 1.5;
	font-weight: 700;
	text-decoration: none;
	border-top: 1px solid #dfdfdf;
	border-left: 4px solid #0d4acc;
	border-right: 1px solid #dfdfdf;
	border-bottom: 1px solid #dfdfdf;
	background: #ffffff;
`;

export const Arrow = styled(NodeViewWrapper)`
	font-size: 36px;
`;

export const Body = styled(NodeViewContent)`
	a {
		color: #0d4acc;
		text-decoration: none;
	}
`;