Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

@enhance/arc-plugin-styles

Package Overview
Dependencies
Maintainers
6
Versions
34
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@enhance/arc-plugin-styles - npm Package Compare versions

Comparing version 0.0.2 to 0.0.3

src/get-styles.mjs

4

package.json
{
"name": "@enhance/arc-plugin-styles",
"version": "0.0.2",
"version": "0.0.3",
"description": "Plugin for generating enhance CSS utility classes",

@@ -32,3 +32,3 @@ "main": "src/index.js",

"@architect/functions": "^5.2.1",
"@enhance/styles": "^1.1.1",
"@enhance/styles": "^1.1.2",
"esm": "^3.2.25"

@@ -35,0 +35,0 @@ },

@@ -25,3 +25,3 @@ # `arc-plugin-styles`

config ./enhance-styles.json
```
```

@@ -35,1 +35,36 @@ > Configure `enhance-styles` by providing a .json file with the `config` option. See the [enhance-styles documentation](https://github.com/enhance-dev/enhance-styles).

```
### getStyles
Call the `getStyles` function to get either a link tag or a style tag for your utility css file.
It takes two arguments, the name of your output utility css file and a configuration object for enhance styles.
```
const stylesFileName = 'utility-classes.css'
const config = {
base: 20,
scale: {
ratio: 'goldenRatio',
steps: 12
},
fonts: {
sans: "system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif",
serif: "Georgia,Cambria,Times New Roman,Times,serif",
mono: "Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace"
},
base: 20,
steps: 8,
theme: {
light: "#fff",
dark: "#222",
primary: "#1f74d6",
secondary: "#7327ce",
success: "#2cdd93",
info: "#2196f3",
warning: "#ffeb3b",
error: "#e21893"
}
}
const styles = getStyles(stylesFileName, config)
console.log(styles)
```
SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc