added hex code form

1 month ago · 1e043832ca
4 changed files with 81 additions and 0 deletions
--- a/css/mobile_facets.css
+++ b/css/mobile_facets.css
@ -58,3 +58,7 @@
    display: none;
  }
 }
+.mobile-facets-element {
+  background-color: var(--mobile_facets-color, #000000); /* Fallback to black if undefined. */
+  border: 1px solid var(--mobile_facets-color);
+}
--- a/mobile_facets.module
+++ b/mobile_facets.module
@ -9,4 +9,31 @@ function mobile_facets_page_attachments(array &$attachments) {
  $attachments['#attached']['library'][] = 'mobile_facets/mobile_facets';
 }

+/**
+ * @file
+ * Contains mobile_facets.module.
+ */

+/**
+ * Implements hook_preprocess_html().
+ */
+function mobile_facets_preprocess_html(&$variables) {
+  $config = \Drupal::config('mobile_facets.settings');
+  $color = $config->get('color') ?? '#000000';
+  
+  // Preload the CSS from the module path (theme-agnostic).
+  $css_path = \Drupal::service('extension.list.module')->getPath('mobile_facets') . '/css/mobile_facets.css';
+  $variables['#attached']['html_head_link'][] = [
+    [
+      'rel' => 'preload',
+      'as' => 'style',
+      'href' => $css_path,
+    ],
+  ];
+  
+  // Add the CSS variable to <html> attributes (global across all themes).
+  $variables['html_attributes']['style'] = '--mobile_facets-color: ' . $color . ';';
+  
+  // Optionally attach the library if not already (loads CSS from module).
+  //$variables['#attached']['library'][] = 'mobile_facets/mobile_facets';
+}
--- a/mobile_facets.routing.yml
+++ b/mobile_facets.routing.yml
@ -0,0 +1,7 @@
+mobile_facets.settings:
+  path: '/admin/config/mobile_facets/settings'
+  defaults:
+    _form: '\Drupal\mobile_facets\Form\SettingsForm'
+    _title: 'Mobile Facets Settings'
+  requirements:
+    _permission: 'administer site configuration'
--- a/src/Form/SettingsForm.php
+++ b/src/Form/SettingsForm.php
@ -0,0 +1,43 @@
+<?php
+
+namespace Drupal\mobile_facets\Form;
+
+use Drupal\Core\Form\ConfigFormBase;
+use Drupal\Core\Form\FormStateInterface;
+
+/**
+ * Configure Mobile Facets settings.
+ */
+class SettingsForm extends ConfigFormBase {
+
+  /**
+   * {@inheritdoc}
+   */
+  protected function getEditableConfigNames() {
+    return ['mobile_facets.settings'];
+  }
+
+  /**
+   * {@inheritdoc}
+   */
+  public function getFormId() {
+    return 'mobile_facets_settings_form';
+  }
+
+  /**
+   * {@inheritdoc}
+   */
+  public function buildForm(array $form, FormStateInterface $form_state) {
+    $config = $this->config('mobile_facets.settings');
+
+    $form['color'] = [
+      '#type' => 'color',
+      '#title' => $this->t('Custom Color'),
+      '#default_value' => $config->get('color') ?? '#000000', // Default to black if not set.
+      '#description' => $this->t('Enter a hex color code for your module (e.g., #FF0000 for red).'),
+    ];
+
+    return parent::buildForm($form, $form_state);
+  }
+
+}