Better UI for drag-and-drop file uploads

Kirby 2 Solutions 🎉
#1

Some of my clients were not aware that they can drag and drop files into the panel. So I decided to make a little CSS hack that will make it more obvious for first-time users.

7 Likes
#2

this looks just cool ! :smiley:, but i’m not Sure in wich Line i have to add the Line in panel/assets/css/panel.css.

Thank you :slightly_smiling:!

#3

You shouldn’t add anything to the Panel CSS file. Changes would get overwritten on update.

Kirby supports a custom CSS file for the Panel. You can put the code into this custom file and enable it in the config.

1 Like
#4

@lukasbestle i have create a panel.css file in assets/css and i have add the

c::set('panel.stylesheet', '/assets/css/panel.css');

Line to my Config it Looks so

<?php

/*

---------------------------------------
License Setup
---------------------------------------

Please add your license key, which you've received
via email after purchasing Kirby on http://getkirby.com/buy

It is not permitted to run a public website without a
valid license key. Please read the End User License Agreement
for more information: http://getkirby.com/license

*/

c::set('license', 'Pls Try it Later...');

c::set('oembed.lazyvideo', true);
c::set('oembed.caching', false);
c::set('oembed.cacheexpires', 3600*24);
c::set('cachebuster', true);

c::set('panel.stylesheet', '/assets/css/panel.css');

/*

---------------------------------------
Configuration
---------------------------------------

*/

c::set('aristotheme.widget', true);

c::set('routes', array(
  array(
    'pattern' => 'docs',
    'action' => function () {
      go('docs/why-kirby-cms');
    }
  )
));

c::set('languages', array(
  array(
    'code'    => 'en',
    'name'    => 'EN',
    'default' => true,
    'locale'  => 'en_US',
    'url'     => '/',
  )
));

But when i go to the panel and go to a site i have this problem

What is the Problem?

#5

This is a really nice QOL/UX improvement for the Panel. I’d say submit an Issue or even a Pull Request on the panel’s repo.

1 Like
#6

Could this be something conflicting with your theme? What happens if you comment out c::set('aristotheme.widget', true)?

#7

I may do that… I know this isn’t the right way to handle language strings though. This may require more than a simple CSS fix.

#8

i have set it from true to false nothing happends
i have delet it nothing happends :confused:

#9

Can you post the blueprint from the page that you took a screenshot of?

#10

The Page From The Screenshot, is a Page who i cant upload images, i have create a simple new page and it works, but not on my another pages

#11

Yeah, you’d have to update the language strings within the panel. Those are managed via Transifex.