<github-button>
Simple github button that can be use only to link github, users, projects and other stuff. Active only on https://github.com domain. With the link attribute you can set the path into the github.com world you want link to. Best use case to link the open-source project is inserted to.
examples • usage • api • accessibility • todo •
🕹️ Examples
<style>
color-scheme-button {
width: 128px;
height: 128px;
--background-color: purple;
--icon-color: #333;
}
</style>
<!-- Relative link -->
<github-button link="matt-baillie/github-button.git"> </github-button>
<!-- Absolute link -->
<github-button link="https://github.com/matt-baillie/github-button.git">
</github-button>
🚀 Usage
- Install package
npm install --save @matt-baillie/github-button
- Import
<!-- Import Js Module -->
<script type="module">
// Importing this module registers <progress-ring> as an element that you
// can use in this page.
//
// Note this import is a bare module specifier, so it must be converted
// to a path using a server such as @web/dev-server.
import "@matt-baillie/github-button";
</script>
- Place in your HTML
<github-button link="https://github.com/matt-baillie/github-button.git">
</github-button>
🐝 API
📒 Properties/Attributes
| Name | Type | Default | Description |
| --------- | ------ | ------- | ---------------------------------------------------- | --- | --- | --- | ----------------------------------- |
| link | String | ''
| Github Absolute / Relative path to user / project |
| newwindow | String | false
| Attribute to control whether link is opened in a new | | | | window/tab or in the current window |
Methods
None
Events
None
🧁 CSS Custom Properties
Name | Default | Description |
---|---|---|
--icon-color |
#000 |
SVG fill attribute |
--background-color |
#fff |
SVG background color |
💪 Accessibility
Acessibility is guaranted with the use of a button with the title and aria-label set on it.SVG icons inside the inner button are set role=img,aria-hidden="true",focusable="false" .
🔧 TODO
- [ ] Better Documentation
🧑💻 Author
Latest Editor
![@matt-baillie] |
---|
@matt-baillie |
Original Author
![@cicciosgamino] |
---|
@cicciosgamino |
Support
Reach out to me at one of the following places:
Donate
Donate help and contibutions!
License
GNU General Public License v3.0
Made