oliverdavies.uk/sculpin/source/_posts/15.md

---
title: "Data attributes and feature flags"
date: 2024-08-26 21:34:15
tags: [Web Development, Software Development, Feature Flags, Drupal, CSS, PHP]
note: true
permalink: /notes/15-data-attributes-and-feature-flags
---

I recently used the [Feature Toggle module](https://www.drupal.org/project/feature_toggle) to set a data attribute which enabled some new styling for buttons.

## The PHP code

In the theme's .theme file:

```php
/**
 * Implements hook_preprocess_html().
 */
function mytheme_preprocess_html(array &$variables): void {
  $variables['attributes']['data-use-new-button-styles'] = \Drupal::service('feature_toggle.feature_status')->getStatus('use_the_new_button_styling');
}
```

If the feature toggle is enabled, this adds a `data-use-new-button-styles=""` attribute to the `body` element.

## The CSS code

```css
[data-use-new-button-styles] .btn-primary {
  background-color: red;
}
```

I like using feature flags and was happy to find a way to use them for adding this new CSS.