@reference "@vben/tailwind-config/theme";
|
|
.vben-tiptap-content h1 {
|
@apply text-2xl font-bold leading-[1.4];
|
}
|
|
.vben-tiptap-content h2 {
|
@apply text-xl font-bold leading-[1.45];
|
}
|
|
.vben-tiptap-content h3 {
|
@apply text-lg font-semibold leading-[1.5];
|
}
|
|
.vben-tiptap-content h4 {
|
@apply text-base font-semibold leading-[1.55];
|
}
|
|
.vben-tiptap-content ul {
|
@apply list-disc pl-6;
|
}
|
|
.vben-tiptap-content ol {
|
@apply list-decimal pl-6;
|
}
|
|
.vben-tiptap-content blockquote {
|
@apply border-l-4 border-primary pl-4 text-muted-foreground;
|
}
|
|
.vben-tiptap-content a {
|
@apply text-primary underline decoration-1 underline-offset-[3px];
|
}
|
|
.vben-tiptap-content code {
|
@apply rounded-[0.45rem] border border-border bg-secondary px-[0.35rem] py-[0.15rem] text-[0.9em] text-primary;
|
}
|
|
.vben-tiptap-content pre {
|
@apply overflow-x-auto rounded-[0.9rem] border border-border bg-popover p-4 text-popover-foreground;
|
}
|
|
.vben-tiptap-content pre code {
|
@apply border-none bg-transparent p-0 text-inherit;
|
}
|
|
.vben-tiptap-content img,
|
.vben-tiptap-content .vben-tiptap__image {
|
max-width: min(100%, 640px);
|
}
|
|
/* Image upload states */
|
.vben-tiptap-upload-wrapper {
|
position: relative;
|
display: inline-block;
|
max-width: min(100%, 640px);
|
margin: 1rem 0;
|
}
|
|
.vben-tiptap-upload-wrapper img {
|
display: block;
|
margin: 0;
|
opacity: 0.6;
|
}
|
|
.vben-tiptap-upload-spinner {
|
position: absolute;
|
inset: 0;
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
background-color: hsl(var(--card) / 30%);
|
border-radius: 1rem;
|
}
|
|
.vben-tiptap-upload-spinner::after {
|
display: block;
|
width: 24px;
|
height: 24px;
|
content: '';
|
border: 2px solid hsl(var(--foreground) / 30%);
|
border-top-color: hsl(var(--foreground));
|
border-radius: 50%;
|
animation: vben-tiptap-spin 0.8s linear infinite;
|
}
|
|
.vben-tiptap-upload-progress {
|
position: absolute;
|
bottom: 0;
|
left: 0;
|
width: 100%;
|
height: 4px;
|
overflow: hidden;
|
background-color: hsl(var(--muted));
|
border-radius: 0 0 1rem 1rem;
|
}
|
|
.vben-tiptap-upload-progress-fill {
|
height: 100%;
|
background-color: hsl(var(--primary));
|
transition: width 0.2s ease;
|
}
|
|
@keyframes vben-tiptap-spin {
|
from {
|
transform: rotate(0deg);
|
}
|
|
to {
|
transform: rotate(360deg);
|
}
|
}
|
