docsify-top-banner-plugin

Get a pretty banner probably used for notifying announcements and updates


$3

Installation

Add the following stylesheet along with your other stylesheets

``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`