From 4a422412ca920e095e9578716b03bfa80bc20fac Mon Sep 17 00:00:00 2001
From: Konstantinos Platis <konstantinos.platis@cern.ch>
Date: Wed, 19 Jun 2019 15:48:07 +0200
Subject: [PATCH] Added functionality for changing title color in Accordion
display format
---
assets/js/accordion.js | 8 ++++++++
cern_display_formats.libraries.yml | 8 ++++++++
cern_display_formats.module | 3 +++
src/Plugin/views/style/Accordion.php | 9 +++++++++
4 files changed, 28 insertions(+)
create mode 100644 assets/js/accordion.js
diff --git a/assets/js/accordion.js b/assets/js/accordion.js
new file mode 100644
index 0000000..adce567
--- /dev/null
+++ b/assets/js/accordion.js
@@ -0,0 +1,8 @@
+(function ($, Drupal, drupalSettings) {
+ Drupal.behaviors.AccordionBehavior = {
+ attach: function (context, settings) {
+ // can access setting from 'drupalSettings';
+ $('.accordion-cern .panel-heading a').css('cssText','color: '+ drupalSettings.displayFormats.accordion.titleColor+ '!important;');
+ }
+ };
+})(jQuery, Drupal, drupalSettings);
\ No newline at end of file
diff --git a/cern_display_formats.libraries.yml b/cern_display_formats.libraries.yml
index 5d281eb..148c7c2 100644
--- a/cern_display_formats.libraries.yml
+++ b/cern_display_formats.libraries.yml
@@ -1,3 +1,11 @@
+accordion-stylesheets:
+ version: 1.x
+ js:
+ assets/js/accordion.js: {}
+ dependencies:
+ - core/jquery
+ - core/drupalSettings
+
teaser-list-stylesheets:
version: 1.x
css:
diff --git a/cern_display_formats.module b/cern_display_formats.module
index 1c8dc92..cc2c0c7 100755
--- a/cern_display_formats.module
+++ b/cern_display_formats.module
@@ -53,6 +53,9 @@ function cern_display_formats_views_post_render(ViewExecutable $view, &$output,
$view->display_handler->setOption('css_class', 'vertical-boxes');
} elseif ($view->display_handler->view->style_plugin->getPluginId() == "accordion") {
$view->display_handler->setOption('css_class', 'accordion-cern');
+ $output['#attached']['library'][] = 'cern_display_formats/accordion-stylesheets'; //attaches the stylesheet
+ $title_color = $view->style_plugin->options['title_color'];
+ $output['#attached']['drupalSettings']['displayFormats']['accordion']['titleColor'] = $title_color;
} elseif ($view->display_handler->view->style_plugin->getPluginId() == "card_grid") {
$view->display_handler->setOption('css_class', 'cern-view-display-page cern-view-display-resources');
} elseif ($view->display_handler->view->style_plugin->getPluginId() == "event_grid") {
diff --git a/src/Plugin/views/style/Accordion.php b/src/Plugin/views/style/Accordion.php
index a2ae76c..7be4076 100644
--- a/src/Plugin/views/style/Accordion.php
+++ b/src/Plugin/views/style/Accordion.php
@@ -40,6 +40,7 @@ class Accordion extends DefaultStyle {
protected function defineOptions(){
$options = parent::defineOptions();
$options['row_class'] = array('default'=> 'carousel-cern-item') ;
+ $options['title_color'] = array('default'=> '#000000') ;
return $options;
}
@@ -58,6 +59,14 @@ class Accordion extends DefaultStyle {
'#description' => t('For Accordion, make sure you have set carousel-cern-item as one of the row classes'),
'#default_value' => (!empty($this->options['row_class'])) ? $this->options['row_class'] : 'carousel-cern-item',
);
+
+ // Option to set a color for the accordion title
+ $form['title_color'] = array(
+ '#type' => 'color',
+ '#title' => t('Title Color'),
+ '#description' => t('Choose the color that you want the Accordion title to have'),
+ '#default_value' => (!empty($this->options['title_color'])) ? $this->options['title_color'] : '#000000',
+ );
}
}
\ No newline at end of file
--
GitLab