elegantthemes / Divi-Beta

8 stars 0 forks source link

Module styles :: the module style output is generated incorrectly when using a custom hover selector #78

Open jcdotnet opened 3 months ago

jcdotnet commented 3 months ago

In Divi 4 we can set custom hover selectors to style elements this way:

CODE

'fonts' => array(
    'element2' => array(
        'css'                   => array(
            'main'  => "{$this->main_css_element} .element-2",
            'hover' => "{$this->main_css_element} .element-1.hover .element-2"
        ),
        ),
) 

OUTPUT

.my_module_0 .element-1.hover .element-2 {
       color: #000000!important
}

which is correct.

However, a different style output is generated in Divi 5:

CODE

$elements->style(
     [
          'attrName' => 'element2',
          'styleProps' => [
              'font' => [
                  'selectors' => [
                      'desktop' => [
                          'value' => "{$order_class} .element-2",
                          'hover' => "{$order_class} .element-1.hover .element-2",
                      ]
                  ]
              ],
          ],
    ],
)

OUTPUT

.my_module_0 .element-1.hover .element-2:hover {
    color: #000000!important
}

which is not what we want and introduces a breaking change.