docsify plugin to add top banner for small announcements or updates
npm install docsify-top-banner-plugin
html
rel="stylesheet"
href="//cdn.jsdelivr.net/npm/docsify-top-banner-plugin@latest/dist/style.css"
/>
`
And add the following script
`html
`
Configure
In your docsify config object add the following
`js
window.$docsify = {
...
topBanner: {
options
},
...
}
`
Options
$3
Type : String
Default : none
It is the content which will be render as the top banner
> NOTE: it should be a single line content
> NOTE: It cant be empty! leaving empty will simply render an empty banner
$3
Type : String
Default : 'span'
the html tag which will be added in the DOM to render the banner
$3
Type : String
Default : 'fixed'
This is the banner's CSS position property.
$3
Type : String
Default : '#deebff'
The background color of the banner
$3
Type : String
Default : 99
The z-index of the banner
> Recommended : Use position relative and zIndex = -1 when you have repo config in your docsify
$3
Type : String
Default : '#091E42'
The primary text color of the banner
$3
Type : String
Default : value of textColor
The primary text color of the anchor tag inside the banner
$3
Type : String
Default : center
Alignment of the content of the banner
Screen Shot
Contribution Guide
- Clone the repo
- start editing on src/index.js and src/style.styl
- The build step using
- the styl -> css using styl CLI
- Optimize the generated style using cssnano and postcss
- Build the javascript using rollup
- optimize it using rollup-plugin-terser
- styling rule using standard`