Add themes support

Usage:

  const editor = new RibbitEditor({
    themes: [
        { name: 'dark', features: { sourceMode: false } },
        { name: 'minimal', tags: minimalTags },
    ],
    currentTheme: 'dark',
  });

The built-in theme is 'ribbit-default' and is always available.
Additional themes from the themes array are registered on top.
This commit is contained in:
gsb
2026-04-29 01:20:55 +00:00
parent 5983ce50fd
commit ac7a698c4f
13 changed files with 264 additions and 70 deletions
+22
View File
@@ -0,0 +1,22 @@
/*
* ribbit-core.css — functional editor styles. Always load this.
* These styles control editor state visibility and behavior.
* They should not be overridden by themes.
*/
#ribbit {
display: none;
}
#ribbit.loaded {
display: block;
}
#ribbit.edit {
font-family: monospace;
white-space: pre;
}
#ribbit.wysiwyg .md {
opacity: 0.5;
}