The_Great_Archive/cryptpad
1
0
Fork 0
mirror of https://github.com/cryptpad/cryptpad.git synced 2026-09-14 11:05:41 +05:00
Code Issues Packages Projects Releases Wiki Activity

update icons on change folder color modal

Browse Source
This commit is contained in:
daria 2025-08-13 12:48:00 +03:00
parent fc450b106b
commit 8a2a38849d
No known key found for this signature in database
GPG Key ID: 3B75240E6B2F2701
2 changed files with 21 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
customize.dist/src/less2/include/drive.less
View File

@ -224,17 +224,9 @@
position: absolute;
font-size: 50px;
}
.cptools-folder-no-color {
.folder-no-color {
color: @cryptpad_color_grey_500;
}
.fa-check {
position: absolute;
top: 40%; left: 35%;
color: transparent;
}
&.cp-app-drive-current-color > .fa-check {
color: @cryptpad_color_grey_900;
}
}
}

23
www/common/drive-ui.js
View File

@ -1318,26 +1318,43 @@ define([
var colors = ["", "#f23c38", "#ff0073", "#da0eba", "#9d00ac", "#6c19b3", "#4a42b1", "#3d8af0", "#30a0f1", "#1fb9d1", "#009686", "#45b354", "#84c750", "#c6e144", "#faf147", "#fbc423", "#fc9819", "#fd5227", "#775549", "#9c9c9c", "#607a89"];
var colorsElements = [];
var currentElement = null;
const icon_classes = 'cp-app-drive-icon-folder cp-app-drive-content-icon';
colors.forEach(function (color, i) {
var element = h("span.cp-app-drive-color-picker-color", [
h("span.cptools.cp-app-drive-icon-folder.cp-app-drive-content-icon" + (i === 0 ? ".cptools-folder-no-color" : ".cptools-folder")),
h("span.fa.fa-check")
(i === 0 ? Icons.get('folder-nocolor', {'class': icon_classes + ' folder-no-color'}): Icons.get('drive-folder', {'class': icon_classes})),
]);
$(element).css("color", colors[i]);
if (colors[i] === currentColor) {
currentElement = element;
$(element).find('.cp-app-drive-icon-folder').replaceWith(
Icons.get('folder-check', {'class': icon_classes})
);
if (i === 0) {
$(element).addClass("folder-no-color");
}
$(element).addClass("cp-app-drive-current-color");
}
$(element).on("click", function () {
$(currentElement).removeClass("cp-app-drive-current-color");
if (currentElement) {
$(currentElement).removeClass("cp-app-drive-current-color");
var currentIndex = colorsElements.indexOf(currentElement);
var originalIcon = currentIndex === 0 ?
Icons.get('folder-nocolor', {'class': icon_classes + ' folder-no-color'}) :
Icons.get('drive-folder', {'class': icon_classes});
$(currentElement).find('.cp-app-drive-icon-folder').replaceWith(originalIcon);
}
currentElement = element;
$(element).addClass("cp-app-drive-current-color");
$(element).find('.cp-app-drive-icon-folder').replaceWith(
Icons.get('folder-check', {'class': icon_classes})
);
cb(color);
});
colorsElements.push(element);
});
var content = h("div.cp-app-drive-color-picker", colorsElements);
UI.alert(content);
Lucide.createIcons();
};
var getFolderColor = function (path) {