Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • #1441442

    i added my custom vars on quick css – and that works nice –
    but how to use the new filters?

    #1441456

    Hey Guenter,

    The filters are in ..\enfold\css\dynamic-css.php line 129ff.

    ‘avf_dynamic_css_additional_vars’:

    Is located inside :root{ …. }
    Simply return additional vars (pseudo code only):

    
    function my-xxx( $output )
    {
    $output .= "--your-font-size-theme-h3: 20px;\n";
    $output .= "--your-font-size-theme-h4: 20px;\n";
    
    return $output;
    }
    

    ‘avf_dynamic_css_additional_vars’ is the same but outside any selectors. You are free to return anything you like – it must be valid CSS rules
    e.g. a media query with vars.

    Best regards,
    Günter

    #1441458

    thanks – with

    function my_vars_outputs( $output ){
      $output .= "--my-variable-font-size-theme-h3: min(max(18px, calc(1.125rem + ((1vw - 3.2px) * 1.1864))), 32px); min-height: 0vw;\n";
      $output .= "--your-font-size-theme-h4: 20px;\n";
      return $output;
    }
    add_filter('avf_dynamic_css_additional_vars', 'my_vars_outputs');

    it works – but with avf_dynamic_css_after_vars i can not see a change.

    Edit:
    This illustration may help you to better understand how to use it.

    function my_vars_outputs( $output ){
    $output .= "
      #myID {
            font-size: 28px; 
      } 
      .myClass {
            font-size: 20px; 
      } 
    ";
      return $output;
    }
    add_filter('avf_dynamic_css_after_vars', 'my_vars_outputs');

    Edit: – ok now i see – but what benefit has that after_vars ?

    #1441468

    Hi,

    what benefit has that after_vars

    You can add e.g. a media query to override var values you added with the filter avf_dynamic_css_additional_vars and have the code in php file right after for better readability ( and also in the dynamic css file ).

    Best regards,
    Günter

    #1461172

    ich habe die Nutzung von avf_dynamic_css_after_vars immer noch nicht ganz verstanden!
    Wie würde ich z.B. für die Seite mit der ID: 123 die Definition von –enfold-main-color-bg ändern?
    __________

    I still haven’t fully understood the use of avf_dynamic_css_after_var !
    For example, how would I change the definition of –enfold-main-color-bg for the page with ID: 123?

    #1461203
    #1461357

    Danke !
    Dann kann ich das jetzt auch in dem entsprechen Topic so mal weitergeben. ;)

    da ja die html_entry_id_123 immer auch der page / post /portfolio etc. entspricht könnte man dann durch kommata getrennt es für mehrere Seite umdefinieren. Cool !
    hat den Vorteil, das selbst für den html hintergrund es über die socket bg definiert wird – und so bei Seiten mit wenig Content das auch gesetzt wird.

    function my_avf_dynamic_css_after_vars( $output = '' )
    {
    	$output .= "\n";
    	/*** Override a defined var for a specific page id*/
    	$output .= ".html_entry_id_46364 , .html_entry_id_2407  {\n";
    	$output .=		"--enfold-header-color-bg: #aaa;\n";
    	$output .=		"--enfold-header-color-bg2: #aaa;\n";
    	$output .=		"--enfold-main-color-bg: #aaa;\n";
    	$output .=		"--enfold-footer-color-bg: #aaa;\n";
    	$output .=		"--enfold-alternate-color-bg: #aaa;\n";
    	$output .=		"--enfold-alternate-color-bg2: #aaa;\n";
    	$output .=		"--enfold-socket-color-bg: #aaa;\n";
    	$output .=		"--enfold-socket-color-border: #aaa;\n";
    	$output .= "}\n";
    	return $output;
    }
    add_filter( 'avf_dynamic_css_after_vars', 'my_avf_dynamic_css_after_vars', 10, 1 );
    #1461382

    Hi,

    Achtung, dass der Selektor nicht zu schwach ist. :root ist ein sehr starker selector, stärker als html !!!

    Würde sicherheitshalber wie in meinem Beispiel nehmen:

    html.html_entry_id_46364 , html.html_entry_id_2407

    Best regards,
    Günter

    #1461389

    Ok !

    #1461479

    Hi,
    It looks like Günter has answered your question, thank you Günter, shall we close this thread then?

    Best regards,
    Mike

    #1461592

    Yes.

    #1461597

    Hi,

    Thanks for the update, we’ll close this thread for now then.

    Best regards,
    Rikard

Viewing 12 posts - 1 through 12 (of 12 total)
  • The topic ‘how to use avf_dynamic_css_additional_vars and avf_dynamic_css_after_vars’ is closed to new replies.