primer-tooltips - npm Package Compare versions

Comparing version 0.2.1 to 0.2.2

CHANGELOG.md

@@ -0,1 +1,9 @@
+# v0.2.2
+
+ * Mentioning the build file - Jon Rohan [github/github@64ca4a7](https://github.com/github/github/commit/64ca4a7)
+ * Including build/build.css in distributed npm module - Jon Rohan [github/github@e4effbf](https://github.com/github/github/commit/e4effbf)
+ * Updating modules to run on prepublish to include build.css in distribution - Jon Rohan [github/github@5b573a0](https://github.com/github/github/commit/5b573a0)
+ * Re-ordering the docs to the bottom of the readme - Jon Rohan [github/github@9c1f291](https://github.com/github/github/commit/9c1f291)
+ * Updating the link - Jon Rohan [github/github@f67684b](https://github.com/github/github/commit/f67684b)
+
 # v0.2.1
@@ -2,0 +10,0 @@

package.json

 {
-  "version": "0.2.1",
+  "version": "0.2.2",
   "name": "primer-tooltips",
@@ -11,3 +11,4 @@ "description": "Add tooltips built entirely in CSS to nearly any element.",
     "index.scss",
-    "lib"
+    "lib",
+    "build"
   ],
@@ -19,7 +20,6 @@ "repository": "https://github.com/primer/tooltips.git",
   "scripts": {
-    "build": "npm run setup && npm run preprocess",
-    "lint": "stylelint **/*.scss -c .stylelintrc.json -s scss",
-    "preprocess": "node-sass index.scss --include-path node_modules | postcss -c .postcss.json -o build/build.css",
-    "setup": "npm install",
-    "test": "npm run lint"
+    "setup": "if [ ! -d \"node_modules\" ]; then npm install; fi",
+    "build": "node-sass index.scss --include-path node_modules --output-style compressed | postcss -c .postcss.json -o build/build.css",
+    "prepublish": "npm run setup && npm run build",
+    "test": "stylelint **/*.scss -c .stylelintrc.json -s scss"
   },
@@ -26,0 +26,0 @@ "dependencies": {

README.md

@@ -10,6 +10,2 @@ # Primer CSS Tooltips
 
-## Documentation
-
-You can read more about tooltips in the [docs][docs].
-
 ## Install
@@ -35,3 +31,3 @@
 
-For a compiled **css** version of this module, a npm script is included that will output a css version to `build/build.css`
+For a compiled **css** version of this module, a npm script is included that will output a css version to `build/build.css` The built css file is also included in the npm package.
 
@@ -42,14 +38,71 @@ ```
 
-## Related
+## Documentation
 
-* [Primer Documentation][docs]
-* [primer-css][primer]
-* [primer-support][primer-support]
+You can read more about other primer modules in the [full primer docs][docs].
 
+<!-- %docs
+title: Tooltips
+-->
+
+### Tooltips
+
+Add tooltips built entirely in CSS to nearly any element. Just add a few classes and an `aria-label` attribute.
+
+In addition, you'll want to specify a direction:
+
+- `.tooltipped-n`
+- `.tooltipped-ne`
+- `.tooltipped-e`
+- `.tooltipped-se`
+- `.tooltipped-s`
+- `.tooltipped-sw`
+- `.tooltipped-w`
+- `.tooltipped-nw`
+
+Tooltip classes will conflict with Octicon classes, and as such, must go on a parent element instead of the icon.
+
+```html
+<span class="tooltipped tooltipped-n border p-2 mb-2 mr-2 left" aria-label="This is the tooltip.">
+  Tooltip North
+</span>
+<span class="tooltipped tooltipped-ne border p-2 mb-2 mr-2 left" aria-label="This is the tooltip.">
+  Tooltip North East
+</span>
+<span class="tooltipped tooltipped-e border p-2 mb-2 mr-2 left" aria-label="This is the tooltip.">
+  Tooltip East
+</span>
+<span class="tooltipped tooltipped-se border p-2 mb-2 mr-2 left" aria-label="This is the tooltip.">
+  Tooltip South East
+</span>
+<span class="tooltipped tooltipped-s border p-2 mb-2 mr-2 left" aria-label="This is the tooltip.">
+  Tooltip South
+</span>
+<span class="tooltipped tooltipped-sw border p-2 mb-2 mr-2 left" aria-label="This is the tooltip.">
+  Tooltip South West
+</span>
+<span class="tooltipped tooltipped-w border p-2 mb-2 mr-2 left" aria-label="This is the tooltip.">
+  Tooltip West
+</span>
+<span class="tooltipped tooltipped-nw border p-2 mb-2 mr-2 left" aria-label="This is the tooltip.">
+  Tooltip North West
+</span>
+```
+
+#### Tooltips No Delay
+
+By default the tooltips have a slight delay before appearing. This is to keep multiple tooltips in the UI from being distracting. There is a modifier class you can use to override this. `.tooltipped-no-delay`
+
+```html
+<span class="tooltipped tooltipped-n tooltipped-no-delay border p-2" aria-label="This is the tooltip.">
+  Tooltip no delay
+</span>
+```
+
+<!-- %enddocs -->
+
 ## License
 
-MIT &copy; [GitHub](https://github.com/)
+[MIT](./LICENSE) &copy; [GitHub](https://github.com/)
 
 [primer]: https://github.com/primer/primer
-[primer-support]: https://github.com/primer/primer-support
 [docs]: http://primercss.io/
@@ -56,0 +109,0 @@ [npm]: https://www.npmjs.com/

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Empty package

Supply chain risk

Package does not contain any code. It may be removed, is name squatting, or the result of a faulty package publish.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

16822

increased by63.51%

Number of package files

7

increased by16.67%

Lines of code

16

increased byInfinity%

Number of lines in readme file

109

increased by94.64%

Number of medium supply chain risk alerts

0

decreased by-100%

No dependency changes