Questions about css

[johnfort]

I want to use a icon not of "accept" in contextmenuToolbar.

Where else is used .elfinder-button-icon-accept ??

p.s. Do not close the topic. I will write more questions.

[johnfort]

/* for CSS style priority to ui-state-disabled - "background-image: none" */
.elfinder .elfinder-button-icon.ui-state-disabled{
background-image: url('../../img/scripts/elfinder/toolbar.png') !important;
}

Not actual ?
Could not create this situation.

[johnfort]

2700 .elfinder-spinner{

Not actual ?

[nao-pon]

@fortcms Please grep search in js directory about CSS class name.

[johnfort]

@nao-pon I searched and none results

[nao-pon]

Where else is used .elfinder-button-icon-accept ??

It is also used in the reload command.

background-image: url('../../img/scripts/elfinder/toolbar.png') !important;

"../../img/scripts/elfinder/toolbar.png" is not in the source of elFinder.

2700 .elfinder-spinner{

Searching 123 files for "elfinder-spinner"

js/commands/preference.js:
  117  				$.each(fm.options.themes, function(id, val) {
  118  					var opt = $('<option class="elfinder-theme-option-'+id+'" value="'+id+'">'+fm.i18n(id)+'</option>'),
  119: 						dsc = $('<fieldset class="ui-widget ui-widget-content ui-corner-all elfinder-theme-list-'+id+'"><legend>'+fm.i18n(id)+'</legend><div><span class="elfinder-spinner"/></div></fieldset>'),
  120  						tm;
  121  					themeSel.append(opt);
  122  					list.append(dsc);
  123  					tm = setTimeout(function() {
  124: 						dsc.find('span.elfinder-spinner').replaceWith(fm.i18n(['errRead', id]));
  125  					}, 10000);
  126  					fm.getTheme(id).always(function() {
  ...
  148  						val = val.add(dl);
  149  						val = val.add($('<div class="elfinder-preference-theme-btn"/>').append($('<button class="ui-button ui-corner-all ui-widget"/>').data('themeid', id).html(fm.i18n('select'))));
  150: 						dsc.find('span.elfinder-spinner').replaceWith(val);
  151  					}).fail(function() {
  152: 						dsc.find('span.elfinder-spinner').replaceWith(fm.i18n(['errRead', id]));
  153  					});
  154  				});

js/commands/rm.js:
   15  				cwd = fm.cwd().hash,
   16  				descs = [],
   17: 				spinner = fm.i18n('calc') + '<span class="elfinder-spinner"/>',
   18  				dialog, text, tmb, size, f, fname;
   19  			
   ..
   85  			if (getSize) {
   86  				getSize = fm.getSize($.map(files, function(f) { return f.mime === 'directory'? f.hash : null; })).done(function(data) {
   87: 					dialog.find('span.elfinder-spinner').parent().html(fm.i18n('size')+': '+data.formated);
   88  				}).fail(function() {
   89: 					dialog.find('span.elfinder-spinner').parent().html(fm.i18n('size')+': '+fm.i18n('unknown'));
   90  				}).always(function() {
   91  					getSize = false;

js/extras/editors.default.js:
  693  							fontSize: '16pt'
  694  						})
  695: 						.html(fm.i18n('nowLoading') + '<span class="elfinder-spinner"/>')
  696  						.appendTo(ifm.parent()),
  697  					getType = function(mime) {
  ...
 2016  							fontSize: '16pt'
 2017  						})
 2018: 						.html(fm.i18n('nowLoading') + '<span class="elfinder-spinner"/>')
 2019  						.appendTo(ifm.parent()),
 2020  					cdata = function() {
 ....
 2423  							fontSize: '16pt'
 2424  						})
 2425: 						.html('<span class="elfinder-edit-loadingmsg">' + fm.i18n('nowLoading') + '</span><span class="elfinder-spinner"/>')
 2426  						.appendTo(ifm.parent()),
 2427  					_url = null,

10 matches across 3 files

[johnfort]

"../../img/scripts/elfinder/toolbar.png" is not in the source of elFinder.

see line 1307

It is also used in the reload command.

I do not understand what is the function there? I was looking at iphone
@nao-pon Plz, rename class for "Text label"

[johnfort]

U renamed class="elfinder-spinner" in js/commands/rm.js ))) Thanks

[nao-pon]

I fond it in contextmenu.css L.232 This style uses for "Auto Reload" extra icon of reload command of contextmenu.

/* for CSS style priority to ui-state-disabled - "background-image: none" */
.elfinder .elfinder-button-icon.ui-state-disabled {
    background-image: url('../img/toolbar.png') !important;
}

But !important; is not good idea, so i'll change it to...

/* for CSS style priority to ui-state-disabled - "background-image: none" */
.elfinder .elfinder-contextmenu-item .elfinder-button-icon.ui-state-disabled {
    background-image: url('../img/toolbar.png');
}

Plz, rename class for "Text label"

OK, I'll change "elfinder-button-icon-accept" to "elfinder-button-icon-text".

[johnfort]

@nao-pon U forgot about
.elfinder-rtl .elfinder-cwd-view-list .elfinder-perms
.elfinder-rtl .elfinder-cwd-view-list .elfinder-lock
.elfinder-rtl .elfinder-cwd-view-list .elfinder-symlink

see elfinder.css L2482

[nao-pon]

@johnfort Thanks! 👍

[johnfort]

@nao-pon There is a difference in .std42-dialog and .elfinder-dialog ?

[nao-pon]

@johnfort It is before I participate in development, so I do not know the clear meaning.

[johnfort]

@nao-pon

The buttons overlay on the text.

[nao-pon]

@johnfort In the case of long file names, that can not be helped.

[johnfort]

@nao-pon Plz, change places for elements.

or do refactoring quicklook html layot for similar any dialogs

[johnfort]

@nao-pon see L3076 /elfinder.css, property

word-break: break-word;

not work in FireFox! Replace to word-break: break-all;
or add overflow-wrap: break-word;

[nao-pon]

@johnfort The quick look title bar does not break, the overflowed part is not displayed. It is a specification.

not work in FireFox! Replace to word-break: break-all; or add overflow-wrap: break-word;

I'll fix it. Thanks! 👍

[johnfort]

@nao-pon You do not hide long text in the dialog. But in the navigation dock you hide it. And the buttons should be not merge with the text.

Next bug:


Sorry,

padding-top: 1px;
margin-top: -1px;

best. Or u decide how even better for fix it.

[nao-pon]

Is there any functional problem as the buttons overlap with titles on the quick look?

Then the vertical scroll bar problem will not be reproduced in Chrome, Firefox, Opera. I do not know how to improve with IE and Edge.

Chrome

Firefox

Opera

[nao-pon]

@johnfort Please make another Issue for different issues.

[johnfort]

@nao-pon Of course there is a problem with the function. In the style that I draw, it merges into one and for beauty I want to use dots.

MS Edge ? I'll think about it...