Star

Configuration

When you run layoutcss in a directory, it will automatically create a layout.json configuration file if one does not already exist.

The file will look like this:

//layout.json
{
  "input": {
  
    // The directory layoutcss should watch :
    "directory": ".",

    // Files with these extensions in the specified directory
    // will be processed by layoutcss to generate styles:
    "extensions": [".astro", ".svelte"]
  },
  "style": {
    // The harmonic ratio you want to use :    
    "harmonicRatio": 1.618,
    // The base value (it's the font-size of the html element so 1rem) :
    "baseValue": "16.5px",
    // If dev is set to true you will see black border on all elements
    // it helps you to design your layout when you dont have any styles yet :
    "dev": true
  },
  "output": {
    // The output CSS file's destination.
    "file": "./src/layout.css",
    // If you want to minify the final css (currently not working)
    "minify": false
  }
}

You can customize this file to suit your needs.