remark-notes-plugin 1.0.0 → 1.0.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +4 -1
- package/dist/styles.css +1 -1
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -5,6 +5,9 @@ A powerful TypeScript remark plugin that transforms markdown blockquotes into be
|
|
|
5
5
|
|
|
6
6
|
|
|
7
7
|
|
|
8
|
+
> [!note]
|
|
9
|
+
> This was built for my AstroJS website but should work with any project.
|
|
10
|
+
|
|
8
11
|
## ✨ Features
|
|
9
12
|
|
|
10
13
|
- 🎨 **5 Beautiful Note Types** - Note, Tip, Important, Quote, and Bonus
|
|
@@ -88,7 +91,7 @@ The plugin supports five distinct types of notes, each with its own unique style
|
|
|
88
91
|
|
|
89
92
|
## 🎨 Styling
|
|
90
93
|
|
|
91
|
-
|
|
94
|
+
Default styles are loaded automatically when you use the plugin. You can also modify the styles since the plugin uses a modular class structure that makes it easy to customize the appearance:
|
|
92
95
|
|
|
93
96
|
### Base Classes
|
|
94
97
|
|
package/dist/styles.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.remark-note{border:1px solid;border-radius:.5rem;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;margin:1.5rem 0;padding:1.25rem;transition:all .2s ease-in-out}.remark-note-header{align-items:center;display:flex;gap:.75rem;margin-bottom:1rem}.remark-note-icon{align-items:center;border-radius:.5rem;display:flex;font-size:1.25rem;height:1.25rem;justify-content:center;width:1.25rem}.remark-note-icon>svg{height:100%;width:auto;fill:none}.remark-note-title{font-size:.85rem;font-weight:700;letter-spacing:.025em;line-height:.85rem;text-transform:uppercase}.remark-note-content{color:#1f2937;font-size:1rem;line-height:1.625}.remark-note.note{background-color:#318ce710;border-color:#318ce7;box-shadow:0 4px 6px -1px rgba(59,130,246,.1),0 2px 4px -2px rgba(59,130,246,.1)}.remark-note.note .remark-note-icon{stroke:#318ce7}.remark-note.note .remark-note-title{color:#318ce7}.remark-note.important{background-color:#ef9b0f10;border-color:#ef9b0f;box-shadow:0 4px 6px -1px rgba(147,51,234,.1),0 2px 4px -2px rgba(147,51,234,.1)}.remark-note.important .remark-note-icon,.remark-note.important .remark-note-title{color:#ef9b0f}.remark-note.quote{background-color:#8c92ac10;border-color:#8c92ac;box-shadow:0 4px 6px -1px rgba(75,85,99,.1),0 2px 4px -2px rgba(75,85,99,.1)}.remark-note.quote .remark-note-icon{stroke:#8c92ac}.remark-note.quote .remark-note-title{color:#8c92ac}.remark-note.bonus{background-color:#9966cc10;border-color:#96c;box-shadow:0 4px 6px -1px rgba(219,39,119,.1),0 2px 4px -2px rgba(219,39,119,.1)}.remark-note.bonus .remark-note-icon{stroke:#96c}.remark-note.bonus .remark-note-title{color:#96c}.remark-note.tip{background-color:#
|
|
1
|
+
.remark-note{border:1px solid;border-radius:.5rem;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;margin:1.5rem 0;padding:1.25rem;transition:all .2s ease-in-out}.remark-note-header{align-items:center;display:flex;gap:.75rem;margin-bottom:1rem}.remark-note-icon{align-items:center;border-radius:.5rem;display:flex;font-size:1.25rem;height:1.25rem;justify-content:center;width:1.25rem}.remark-note-icon>svg{height:100%;width:auto;fill:none}.remark-note-title{font-size:.85rem;font-weight:700;letter-spacing:.025em;line-height:.85rem;text-transform:uppercase}.remark-note-content{color:#1f2937;font-size:1rem;line-height:1.625}.remark-note.note{background-color:#318ce710;border-color:#318ce7;box-shadow:0 4px 6px -1px rgba(59,130,246,.1),0 2px 4px -2px rgba(59,130,246,.1)}.remark-note.note .remark-note-icon{stroke:#318ce7}.remark-note.note .remark-note-title{color:#318ce7}.remark-note.important{background-color:#ef9b0f10;border-color:#ef9b0f;box-shadow:0 4px 6px -1px rgba(147,51,234,.1),0 2px 4px -2px rgba(147,51,234,.1)}.remark-note.important .remark-note-icon,.remark-note.important .remark-note-title{color:#ef9b0f}.remark-note.quote{background-color:#8c92ac10;border-color:#8c92ac;box-shadow:0 4px 6px -1px rgba(75,85,99,.1),0 2px 4px -2px rgba(75,85,99,.1)}.remark-note.quote .remark-note-icon{stroke:#8c92ac}.remark-note.quote .remark-note-title{color:#8c92ac}.remark-note.bonus{background-color:#9966cc10;border-color:#96c;box-shadow:0 4px 6px -1px rgba(219,39,119,.1),0 2px 4px -2px rgba(219,39,119,.1)}.remark-note.bonus .remark-note-icon{stroke:#96c}.remark-note.bonus .remark-note-title{color:#96c}.remark-note.tip{background-color:#7ccf0010;border-color:#7ccf00;box-shadow:0 4px 6px -1px rgba(59,130,246,.1),0 2px 4px -2px rgba(59,130,246,.1)}.remark-note.tip .remark-note-icon>svg{stroke:#7ccf00}.remark-note.tip .remark-note-title{color:#7ccf00}
|