Generate css file on panel update

Kirby 2 Solved ✅
1

Hello,

Is it possible to create a css file on a panel page update hook?

Ideal solution:

After you picked some colors in the panel, you click save and a new css is generated with those colors.

Cheers, Maarten

2

Should be possible. Kirby Panel supports hooks: https://getkirby.com/docs/developer-guide/advanced/hooks

3

Why not with CSS inline
https://www.w3schools.com/html/html_css.asp

<h1 style=<?php echo $page->h1_color() ?>> Heading</h1>

4

What is your use case? Maybe you could place that code within style tags in the header instead of creating a new file to avoid another http request? I guess those styles should overwrite existing styles?

5

Hello guys,

Thank you for the suggestions.

Just searching for a way to have full control over css files.

  1. Inline css is good, when you have a few styles to override.

  2. If you use a dynamic css php file you can adjust each style. The problem is, each time its calculated. So the file is not cached.

  3. Ideal to use a dynamic less php file, that outputs a css file only with a panel hook update.

Need some help for the last solution…

Cheers, Maarten

6

I haven’t tested them but these two plugins might help:


7

Together with kirby-v2-lessphp - Less plugin for Kirby 2 it works!

8 
kirby()->hook('panel.site.update', function($site) {

f::write( kirby()->roots()->assets() . '/less/style.less' , 

'@'. $site->colorbase()->key() . ':'    . $site->colorbase() . ';' . "\n" . $site->less() , false);    
    
});