# Configuration

***

### Show cookie permission

**Field type**:\
Select

**Available values**:\
• don't show\
• show (default)

**Example value**:\
`show (default)`

**Path to the configuration**:\
Tab "Content" => Block "Cookie permission"

**Technical name**:\
`twt-cookie-permission-show`

## Basic configuration

***

### Layout type

**Field type**:\
Select

**Available values**:\
• Banner: bottom (default)\
• Banner: top\
• Card: bottom right\
• Modal: bottom (with overlay)\
• Modal: bottom right (with overlay)\
• Modal: centered (with overlay)\
• Modal: top (with overlay)

**Example value**:\
`Banner: bottom (default)`

**Path to the configuration**:\
Tab "Content" => Block "Cookie permission" => Section "Basic configuration"

**Technical name**:\
`twt-cookie-permission-position`

***

### Padding \[px]

**Field type**:\
Number field

**Example value**:\
`10`

**Path to the configuration**:\
Tab "Content" => Block "Cookie permission" => Section "Basic configuration"

**Technical name**:\
`twt-cookie-permission-padding`

***

### Drop shadow

**Field type**:\
Text field

**Example value**:\
`0 0 30px`

**Path to the configuration**:\
Tab "Content" => Block "Cookie permission" => Section "Basic configuration"

**Technical name**:\
`twt-cookie-permission-box-shadow`

{% hint style="info" %}
CSS box-shadow Property (e.g. '0 0 30px').
{% endhint %}

***

### Shadow colour

**Field type**:\
Color picker

**Example value**:\
`rgba(0, 0, 0, 0.2)`

**Path to the configuration**:\
Tab "Content" => Block "Cookie permission" => Section "Basic configuration"

**Technical name**:\
`twt-cookie-permission-box-shadow-color`

***

### Background colour (Overlay)

**Field type**:\
Color picker

**Example value**:\
`rgba(0, 0, 0, 0.5)`

**Path to the configuration**:\
Tab "Content" => Block "Cookie permission" => Section "Basic configuration"

**Technical name**:\
`twt-cookie-permission-overlay-color`

{% hint style="info" %}
Select the desired background colour of the overlay (backdrop).

**Layout type:**

* Modal with overlay
  {% endhint %}

***

### Blur effect \[px] (Overlay)

**Field type**:\
Number field

**Example value**:\
`0`

**Path to the configuration**:\
Tab "Content" => Block "Cookie permission" => Section "Basic configuration"

**Technical name**:\
`twt-cookie-permission-overlay-effect-blur`

{% hint style="info" %}
Enter the desired value for the blur effect of the overlay (backdrop).

**Layout type:**

* Modal with overlay
  {% endhint %}

***

### Spacing top \[px]

**Field type**:\
Number field

**Example value**:\
`40`

**Path to the configuration**:\
Tab "Content" => Block "Cookie permission" => Section "Basic configuration"

**Technical name**:\
`twt-cookie-permission-top`

{% hint style="info" %}
**Layout type:**

* Modal: top (with overlay)
  {% endhint %}

***

### Spacing left \[px]

**Field type**:\
Number field

**Example value**:\
`25`

**Path to the configuration**:\
Tab "Content" => Block "Cookie permission" => Section "Basic configuration"

**Technical name**:\
`twt-cookie-permission-left`

{% hint style="info" %}
Currently not in use.
{% endhint %}

***

### Spacing bottom \[px]

**Field type**:\
Number field

**Example value**:\
`40`

**Path to the configuration**:\
Tab "Content" => Block "Cookie permission" => Section "Basic configuration"

**Technical name**:\
`twt-cookie-permission-bottom`

{% hint style="info" %}
**Layout type:**

* Card: bottom right
* Modal: bottom (with overlay)
* Modal: bottom right (with overlay)
  {% endhint %}

***

### Spacing right \[px]

**Field type**:\
Number field

**Example value**:\
`25`

**Path to the configuration**:\
Tab "Content" => Block "Cookie permission" => Section "Basic configuration"

**Technical name**:\
`twt-cookie-permission-right`

{% hint style="info" %}
**Layout type:**

* Card: bottom right
* Modal: bottom right (with overlay)
  {% endhint %}

## Banner: bottom (default) and top

***

### Width

**Field type**:\
Select

**Available values**:\
• Container-Max-Width (Full-width-boxed)\
• 100% (Full-width)

**Example value**:\
`Container-Max-Width (Full-width-boxed)`

**Path to the configuration**:\
Tab "Content" => Block "Cookie permission" => Section "Banner: bottom (default) and top"

**Technical name**:\
`twt-cookie-permission-width`

{% hint style="info" %}
Select the sizing mode of the "Cookie permission".

**Layout type:**

* Banner: bottom (default)
* Banner: top
  {% endhint %}

## Card: bottom right

***

### Maximum width \[px]

**Field type**:\
Text field

**Example value**:\
`260`

**Path to the configuration**:\
Tab "Content" => Block "Cookie permission" => Section "Card: bottom right"

**Technical name**:\
`twt-cookie-permission-max-width`

{% hint style="info" %}
**Layout type:**

* Card: bottom right
  {% endhint %}

## Colour configuration

***

### Text / link colour

**Field type**:\
Color picker

**Example value**:\
`#555555`

**Path to the configuration**:\
Tab "Content" => Block "Cookie permission" => Section "Colour configuration"

**Technical name**:\
`twt-cookie-permission-color`

***

### Border colour

**Field type**:\
Color picker

**Example value**:\
`#cccccc`

**Path to the configuration**:\
Tab "Content" => Block "Cookie permission" => Section "Colour configuration"

**Technical name**:\
`twt-cookie-permission-border-color`

***

### Background colour

**Field type**:\
Color picker

**Example value**:\
`#ffffff`

**Path to the configuration**:\
Tab "Content" => Block "Cookie permission" => Section "Colour configuration"

**Technical name**:\
`twt-cookie-permission-background-color`

***

### Colour (Button "Deny")

**Field type**:\
Color picker

**Example value**:\
`$sw-border-color`

**Path to the configuration**:\
Tab "Content" => Block "Cookie permission" => Section "Colour configuration"

**Technical name**:\
`twt-cookie-permission-deny-btn-background-color`

{% hint style="info" %}
The "Deny" button should not use a striking color.
{% endhint %}

***

### Colour (Button "Configure")

**Field type**:\
Color picker

**Example value**:\
`$sw-color-brand-secondary`

**Path to the configuration**:\
Tab "Content" => Block "Cookie permission" => Section "Colour configuration"

**Technical name**:\
`twt-cookie-permission-configuration-btn-background-color`

***

### Colour (Button "Accept all cookies")

**Field type**:\
Color picker

**Example value**:\
`$sw-color-brand-primary`

**Path to the configuration**:\
Tab "Content" => Block "Cookie permission" => Section "Colour configuration"

**Technical name**:\
`twt-cookie-permission-accept-all-btn-background-color`