New Case Study:See how Anthropic automated 95% of dependency reviews with Socket.Learn More
Socket
Sign inDemoInstall
Socket

ariutta-loading

Package Overview
Dependencies
Maintainers
1
Versions
2
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

ariutta-loading - npm Package Compare versions

Comparing version

to
1.0.1

demo.html

1

index.js

@@ -0,1 +1,2 @@

'use strict';
var fs = require('fs');

@@ -2,0 +3,0 @@ var insertCss = require('insert-css');

{
"name": "ariutta-loading",
"version": "1.0.0",
"version": "1.0.1",
"description": "Simple loading style CSS",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
"test": "echo \"Error: no test specified\" && exit 1",
"start": "echo 'View demo at http://localhost:3000/demo.html' && simple-server . 3000"
},

@@ -31,7 +32,26 @@ "browserify": {

"brfs": "^1.4.3",
"deglobalify": "^0.2.0"
"deglobalify": "^0.2.0",
"simple-server": "^1.0.1"
},
"dependencies": {
"insert-css": "^0.2.0"
},
"semverBumper": {
"jsonFiles": [
{
"filepath": "package.json",
"key": "version"
}
],
"grepOptions": {
"include": [],
"exclude": [],
"excludeDir": [
"./docs",
"./test",
"./bower_components",
"./lib"
]
}
}
}
}

20

README.md

@@ -6,3 +6,3 @@ # ariutta-loading

The parent of the element that will contain your content must have the following styles set:
The parent of your content container element must have the following styles set:

@@ -17,4 +17,6 @@ ```css

Then you just need to reference `ariutta-loading.css` from your HTML page and add the class `ariutta-loading` to your content container element:
### Option 1: Add via HTML
Reference `ariutta-loading.css` from your HTML page and add the class `ariutta-loading` to your content container element:
```html

@@ -29,5 +31,5 @@ <!DOCTYPE html>

<body>
<div class="my-element-parent-selector">
<div style="display: flex; align-items: center; justify-content: center;">
<div class="ariutta-loading">
<!-- when your content has loaded, remove the ariutta loading class -->
<!-- when your content has loaded, remove the ariutta-loading class -->
</div>

@@ -40,10 +42,10 @@ </div>

To add via JS, simply require this module:
### Option 2: Add via JS
```js
require('ariutta-loading');
```
1. Install: `npm install --save ariutta-loading`
2. Require this module: `require('ariutta-loading');`
3. Set the `ariutta-loading` class on your content container element (be sure parent element styles are set as specified above)
# Acknowledgments
## Acknowledgments
Thanks to https://github.com/lukehaas/css-loaders for CSS used as starting point.

Sorry, the diff of this file is not supported yet