{
  "name": "utilities/gap",
  "title": "Gap",
  "description": "Gap utilities set the gap property of flex and grid containers, like other eurodata-ui layout utilities.",
  "docs": "https://test-apps.eurodata.de/a/eurodata-ui/docs/utilities/gap/",
  "sections": [
    {
      "heading": "Gap",
      "markdown": "eurodata-ui includes classes to set the `gap` property of flex and grid containers. Use them alone to create a flex container with a gap, or use them alongside other eurodata-ui layout utilities, like [cluster](https://test-apps.eurodata.de/a/eurodata-ui/docs/utilities/cluster) and [stack](https://test-apps.eurodata.de/a/eurodata-ui/docs/utilities/stack), to change the space between items.\n\nBesides `ed-gap-0`, which sets `gap` to zero, each class corresponds to one of the [`--ed-space-*`](https://test-apps.eurodata.de/a/eurodata-ui/docs/theming/space) tokens in your theme.\n\n| Class Name | gap Value |\n| --- | --- |\n| `ed-gap-0` | `0` |\n| `ed-gap-1` | `--ed-space-1` |\n| `ed-gap-2` | `--ed-space-2` |\n| `ed-gap-3` | `--ed-space-3` |\n| `ed-gap-4` | `--ed-space-4` |\n| `ed-gap-5` | `--ed-space-5` |\n| `ed-gap-6` | `--ed-space-6` |\n| `ed-gap-7` | `--ed-space-7` |\n| `ed-gap-8` | `--ed-space-8` |\n| `ed-gap-9` | `--ed-space-9` |\n| `ed-gap-10` | `--ed-space-10` |\n| `ed-gap-11` | `--ed-space-11` |\n| `ed-gap-12` | `--ed-space-12` |\n| `ed-gap-13` | `--ed-space-13` |\n| `ed-gap-14` | `--ed-space-14` |\n| `ed-gap-15` | `--ed-space-15` |\n| `ed-gap-16` | `--ed-space-16` |"
    }
  ]
}
