Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

docsify-corner

Package Overview
Dependencies
Maintainers
1
Versions
8
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

docsify-corner

A plugin for setting corner of docsify.

  • 1.0.7
  • latest
  • Source
  • npm
  • Socket score

Version published
Weekly downloads
3
increased by50%
Maintainers
1
Weekly downloads
 
Created
Source

docsify-corner

docsify

A Docsify plugin for corner configuration enhancement based on Docsify repo configuration.

  • support more icon ( Gitlab...).
  • support customized image(pngjpggif).
  • support more settings(tooltipcolor).

gitlab    customer gif

Usage

Import

Import one of the script in index.html.

<script src="//cdn.jsdelivr.net/npm/docsify-corner/dist/docsify-corner.js"></script>
<script src="//cdn.jsdelivr.net/npm/docsify-corner/dist/docsify-corner.min.js"></script>

Configuration

Options:

OptionDescription
iconthe icon you want show the corner.
urlthe url for corner link to.
targetthe url target for corner link to.
widththe width of the customized image.
heightthe height of the customized image.
colorthe color of the icon.
backgroundthe background color of the customized icon.
titlethe text of the title attribute is displayed as a tooltip.
Use the preset icons

Current support default corner types.

Support Icon TypeIcon argument
Githubgithub
Gitlabgitlab
Springspring
Golanggolang
<script>
  window.$docsify = {
      repo:'true', // set the docsify show the corner
      corner: {
        // the icon link url to another site  
        url: "https://gitlab.com/gitlab-org/gitlab-svgs", 
        // the default preset icon in docsify-corner  
        icon: "gitlab", 
      },
  };
</script>

Use the customized image

You can set your own image in the corner.

<script>
  window.$docsify = {
      repo:'true',
      corner: {
        url: "https://github.com/Koooooo-7/docsify-corner",
        // you can set the image link here  
        icon: "https://github.githubassets.com/images/icons/emoji/unicode/1f48a.png",
        // the size of the image  
        width: 80,
        height: 80
      },
  };
</script>

Contribution

It is hard to adjust the icon to fit the corner, if you wanna add more preset icons, welcome star and send a PR!

This the current svg icon resources I' m working on.

Steps :

  • Folk it !
  • Install dependencies npm install.
  • Create your feature branch: git checkout -b my-new-feature.
  • Commit your changes: git commit -am 'Add some feature'.
  • Push to the branch: git push origin my-new-feature.
  • Submit a pull request.

License

MIT @Koy

Keywords

FAQs

Package last updated on 03 Jun 2022

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc