New version (with orientation and better doc)

This commit is contained in:
Alban Bronisz 2021-12-27 18:23:22 +01:00
parent 02a033dab0
commit 50ace3243d
7 changed files with 39 additions and 14 deletions

2
.gitignore vendored
View File

@ -1,3 +1,3 @@
node_modules/ node_modules/
dist/bundle.js dist/caracals-badge.js
package-lock.json package-lock.json

View File

@ -1,4 +1,8 @@
Inspired by: [github-fork-ribbon-css](https://github.com/simonwhitaker/github-fork-ribbon-css)
Using [Webpack](https://webpack.js.org/)
Install Install
======= =======
@ -9,14 +13,16 @@ Install
Build Build
===== =====
npm run dev npm run prod
The JS bundle is then located in `dist/` folder. The JS bundle is then located in `dist/` folder.
Dev
===
AJouter un nouveau paquet pour la compilation : Usage
=====
Just add (orientation can be `left-bottom`, `right-bottom`, `right-top` or `left-top`):
npm install --save-dev XXX ```html
<script src="path/to/caracals-badge.js" orientation="left-bottom"></script>
```

17
dist/index.html vendored
View File

@ -1,6 +1,21 @@
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<script src="bundle.js"></script> <script src="caracals-badge.js" orientation="right-bottom"></script>
<script src="caracals-badge.js" orientation="left-bottom"></script>
<script src="caracals-badge.js" orientation="left-top"></script>
<script src="caracals-badge.js" orientation="right-top"></script>
</head> </head>
<body> <body>
<title>caracals-badge usage</title>
<br />
<br />
<br />
<br />
<br />
<h1>Usage</h1>
<pre>
<code>
&lt;script src="caracals-badge.js" orientation="right-bottom"> </script>
</code>
</pre>
</body> </body>

8
main-badge.js Normal file
View File

@ -0,0 +1,8 @@
require('./style.css');
var orientation = document.currentScript.getAttribute('orientation');
document.write("<div><a href=\"https://caracals.org\" "
+ "data-toggle=\"tooltip\" "
+ "class=\"cara-logo " + orientation + " fixed\" "
+ "title=\"Service hébergé par les Caracals (Click pour voir le site)\"></a></div>");

View File

@ -1,3 +0,0 @@
require('./style.css');
document.write("<div><a href=\"https://caracals.org\" data-toggle=\"tooltip\" class=\"cara-logo right-bottom fixed\" title=\"Service hébergé par les Caracals (Click pour voir le site)\"></a></div>");

View File

@ -1,8 +1,7 @@
{ {
"name": "js-include", "name": "caracals-badge",
"version": "1.0.0", "version": "1.0.0",
"description": "", "description": "",
"main": "./bundle.js",
"scripts": { "scripts": {
"dev": "webpack --mode development", "dev": "webpack --mode development",
"prod": "webpack --mode production" "prod": "webpack --mode production"

View File

@ -1,7 +1,7 @@
module.exports = { module.exports = {
entry: './main.js', entry: './main-badge.js',
output: { output: {
filename: './bundle.js' filename: './caracals-badge.js'
}, },
module: { module: {
rules:[ rules:[