Home

Awesome

docsify-corner

docsify

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

<div align="center"> <img src="https://user-images.githubusercontent.com/33706142/89785634-4e3ff300-db4d-11ea-9eb5-16ae5e1512ee.png" alt="gitlab" width=45%/> &emsp;&emsp; <img src="https://i.loli.net/2020/08/10/iEWkLXpRCSAv1IN.gif" alt="customer gif" width=45%/> </div>

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 :


License

MIT @Koy