diff --git a/js/ui/file_manager/ui.file_manager.file_actions_button.js b/js/ui/file_manager/ui.file_manager.file_actions_button.js index e0976c478f9d..510648490e91 100644 --- a/js/ui/file_manager/ui.file_manager.file_actions_button.js +++ b/js/ui/file_manager/ui.file_manager.file_actions_button.js @@ -20,12 +20,9 @@ class FileManagerFileActionsButton extends Widget { .addClass(FILE_MANAGER_FILE_ACTIONS_BUTTON); this._button = this._createComponent($button, Button, { - text: '⋮', + icon: 'overflow', stylingMode: 'text', - onClick: e => this._raiseClick(e), - template: () => { - return $('').html('⋮'); - } + onClick: e => this._raiseClick(e) }); super._initMarkup(); diff --git a/styles/widgets/common/fileManager.less b/styles/widgets/common/fileManager.less index ebf66605f5f0..e0032a42bcd2 100644 --- a/styles/widgets/common/fileManager.less +++ b/styles/widgets/common/fileManager.less @@ -231,7 +231,7 @@ float: right; .dx-button-content { - padding: 10px 14px; + padding: 0; } } @@ -392,11 +392,6 @@ } } - .dx-filemanager-file-actions-button { - margin-top: 1px; - margin-bottom: -1px; - } - .dx-filemanager-focused-item .dx-filemanager-file-actions-button, .dx-treeview-item.dx-state-hover .dx-filemanager-file-actions-button { visibility: visible; diff --git a/styles/widgets/generic/fileManager.generic.less b/styles/widgets/generic/fileManager.generic.less index 9b4e7855e351..3d2c4d6e3288 100644 --- a/styles/widgets/generic/fileManager.generic.less +++ b/styles/widgets/generic/fileManager.generic.less @@ -165,7 +165,7 @@ max-width: @FILEMANAGER_DETAILS_VIEW_CHECKBOX_COLUMN_WIDTH; } - .dx-row-focused .dx-filemanager-file-actions-button .dx-button { + .dx-row-focused .dx-filemanager-file-actions-button .dx-button .dx-icon { color: @filemanager-item-focused-color; } } @@ -209,10 +209,19 @@ } } +.dx-filemanager-dirs-tree.dx-treeview .dx-filemanager-file-actions-button { + margin-top: 1px; + margin-bottom: -1px; + + .dx-button .dx-button-content { + padding: 0; + } +} + .dx-filemanager-file-actions-button { .dx-button { - min-width: @FILEMANAGER_FILE_ACTIONS_BUTTON_WIDTH; - height: @FILEMANAGER_FILE_ACTIONS_BUTTON_HEIGHT; + min-width: @FILEMANAGER_FILE_ACTIONS_BUTTON_SIZE; + height: @FILEMANAGER_FILE_ACTIONS_BUTTON_SIZE; .dx-button-content { padding-top: @FILEMANAGER_FILE_ACTIONS_BUTTON_TOP_BOTTOM_PADDING; diff --git a/styles/widgets/generic/size-schemes/compact.less b/styles/widgets/generic/size-schemes/compact.less index 3789dc336ffe..7c8071524f87 100644 --- a/styles/widgets/generic/size-schemes/compact.less +++ b/styles/widgets/generic/size-schemes/compact.less @@ -49,8 +49,7 @@ @FILEMANAGER_BREADCRUMBS_ITEM_PADDING_TOP: 3px; @FILEMANAGER_BREADCRUMBS_ITEM_PADDING_BOTTOM: 7px; @FILEMANAGER_DETAILS_VIEW_CHECKBOX_COLUMN_WIDTH: 39px; -@FILEMANAGER_FILE_ACTIONS_BUTTON_WIDTH: 32px; -@FILEMANAGER_FILE_ACTIONS_BUTTON_HEIGHT: 18px; +@FILEMANAGER_FILE_ACTIONS_BUTTON_SIZE: 18px; @FILEMANAGER_FILE_ACTIONS_BUTTON_TOP_BOTTOM_PADDING: 9px; @FILEMANAGER_DIRS_TREE_ICON_MARGIN_BOTTOM: 1px; @FILEMANAGER_LARGE_ICON_SIZE: 18px; diff --git a/styles/widgets/generic/size-schemes/default.less b/styles/widgets/generic/size-schemes/default.less index 0314dd6e3ab4..6ed07b6fca78 100644 --- a/styles/widgets/generic/size-schemes/default.less +++ b/styles/widgets/generic/size-schemes/default.less @@ -50,8 +50,7 @@ @FILEMANAGER_BREADCRUMBS_ITEM_PADDING_TOP: 5px; @FILEMANAGER_BREADCRUMBS_ITEM_PADDING_BOTTOM: 8px; @FILEMANAGER_DETAILS_VIEW_CHECKBOX_COLUMN_WIDTH: 43px; -@FILEMANAGER_FILE_ACTIONS_BUTTON_WIDTH: 32px; -@FILEMANAGER_FILE_ACTIONS_BUTTON_HEIGHT: 21px; +@FILEMANAGER_FILE_ACTIONS_BUTTON_SIZE: 21px; @FILEMANAGER_FILE_ACTIONS_BUTTON_TOP_BOTTOM_PADDING: 10px; @FILEMANAGER_DIRS_TREE_ICON_MARGIN_BOTTOM: 0; @FILEMANAGER_LARGE_ICON_SIZE: 22px; diff --git a/styles/widgets/material/fileManager.material.less b/styles/widgets/material/fileManager.material.less index 60346bc64823..0f8544082b42 100644 --- a/styles/widgets/material/fileManager.material.less +++ b/styles/widgets/material/fileManager.material.less @@ -169,7 +169,7 @@ } } - .dx-row-focused .dx-filemanager-file-actions-button .dx-button { + .dx-row-focused .dx-filemanager-file-actions-button .dx-button .dx-icon { color: @filemanager-item-focused-color; } } @@ -183,6 +183,11 @@ } .dx-filemanager-dirs-tree.dx-treeview { + .dx-treeview-item { + padding-top: @FILEMANAGER_TREEVIEW_ITEM_TOP_BOTTOM_PADDING; + padding-bottom: @FILEMANAGER_TREEVIEW_ITEM_TOP_BOTTOM_PADDING; + } + .dx-state-focused > .dx-treeview-item { background: transparent; @@ -214,10 +219,14 @@ } } +.dx-filemanager-dirs-tree.dx-treeview .dx-filemanager-file-actions-button .dx-button .dx-button-content { + padding: 0; +} + .dx-filemanager-file-actions-button { .dx-button { - min-width: @FILEMANAGER_FILE_ACTIONS_BUTTON_WIDTH; - height: @FILEMANAGER_FILE_ACTIONS_BUTTON_HEIGHT; + min-width: @FILEMANAGER_FILE_ACTIONS_BUTTON_SIZE; + height: @FILEMANAGER_FILE_ACTIONS_BUTTON_SIZE; .dx-button-content { padding: @FILEMANAGER_FILE_ACTIONS_BUTTON_TOP_BOTTOM_PADDING 6px; diff --git a/styles/widgets/material/size-schemes/compact.less b/styles/widgets/material/size-schemes/compact.less index 702ec945aa93..5a78a29f214c 100644 --- a/styles/widgets/material/size-schemes/compact.less +++ b/styles/widgets/material/size-schemes/compact.less @@ -54,8 +54,8 @@ @FILEMANAGER_BREADCRUMBS_ITEM_PADDING_TOP: 8px; @FILEMANAGER_BREADCRUMBS_ITEM_PADDING_BOTTOM: 9px; @FILEMANAGER_DETAILS_VIEW_CHECKBOX_COLUMN_WIDTH: 43px; -@FILEMANAGER_FILE_ACTIONS_BUTTON_WIDTH: 26px; -@FILEMANAGER_FILE_ACTIONS_BUTTON_HEIGHT: 18px; +@FILEMANAGER_FILE_ACTIONS_BUTTON_SIZE: 22px; +@FILEMANAGER_TREEVIEW_ITEM_TOP_BOTTOM_PADDING: 8px; @FILEMANAGER_FILE_ACTIONS_BUTTON_TOP_BOTTOM_PADDING: 9px; @FILEMANAGER_CONTEXTMENU_TEXT_ITEM_LEFT_MARGIN: 30px; @FILEMANAGER_LARGE_ICON_SIZE: 16px; diff --git a/styles/widgets/material/size-schemes/default.less b/styles/widgets/material/size-schemes/default.less index 4be54a66fb59..2ad91b319e10 100644 --- a/styles/widgets/material/size-schemes/default.less +++ b/styles/widgets/material/size-schemes/default.less @@ -53,8 +53,8 @@ @FILEMANAGER_BREADCRUMBS_ITEM_PADDING_TOP: 7px; @FILEMANAGER_BREADCRUMBS_ITEM_PADDING_BOTTOM: 8px; @FILEMANAGER_DETAILS_VIEW_CHECKBOX_COLUMN_WIDTH: 49px; -@FILEMANAGER_FILE_ACTIONS_BUTTON_WIDTH: 32px; -@FILEMANAGER_FILE_ACTIONS_BUTTON_HEIGHT: 24px; +@FILEMANAGER_FILE_ACTIONS_BUTTON_SIZE: 28px; +@FILEMANAGER_TREEVIEW_ITEM_TOP_BOTTOM_PADDING: 11px; @FILEMANAGER_FILE_ACTIONS_BUTTON_TOP_BOTTOM_PADDING: 2px; @FILEMANAGER_CONTEXTMENU_TEXT_ITEM_LEFT_MARGIN: 48px; @FILEMANAGER_LARGE_ICON_SIZE: 22px;