gaschz/trilium
1
0
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2025-11-21 16:14:23 +01:00
Code Issues Actions 14 Packages Projects Releases Wiki Activity

client/note color picker/clear color cell: fix icon alignment

Browse Source
This commit is contained in:
Adorian Doran 2025-11-21 02:12:52 +02:00
parent 0db08f4c62
commit d87e8b729f
2 changed files with 30 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

47
apps/client/src/menus/custom-items/NoteColorPicker.css
View File

@ -32,20 +32,6 @@
outline-offset: 2px; outline-offset: 2px;
} }
.note-color-picker .color-cell-reset::before,
.note-color-picker .custom-color-cell::before {
position: absolute;
display: flex;
top: 0;
left: 0;
right: 0;
bottom: 0;
font-size: calc(var(--color-picker-cell-size) * 1.3);
justify-content: center;
align-items: center;
font-family: boxicons;
}
/* /*
* RESET COLOR CELL * RESET COLOR CELL
*/ */
@ -55,18 +41,37 @@
--outline-color: var(--note-color-picker-clear-color-cell-selection-outline-color); --outline-color: var(--note-color-picker-clear-color-cell-selection-outline-color);
position: relative; position: relative;
display: flex;
justify-content: center;
align-items: center;
} }
.note-color-picker .color-cell-reset::before { .note-color-picker .color-cell-reset svg {
content: "\ec8d"; width: var(--color-picker-cell-size);
mix-blend-mode: normal; height: var(--color-picker-cell-size);
color: var(--note-color-picker-clear-color-cell-color); fill: var(--note-color-picker-clear-color-cell-color);
} }
/* /*
* CUSTOM COLOR CELL * CUSTOM COLOR CELL
*/ */
.note-color-picker .custom-color-cell::before {
position: absolute;
content: "\ed35";
display: flex;
top: 0;
left: 0;
right: 0;
bottom: 0;
font-size: calc(var(--color-picker-cell-size) * 1.3);
justify-content: center;
align-items: center;
font-family: boxicons;
font-size: 16px;
color: var(--foreground);
}
.note-color-picker .custom-color-cell { .note-color-picker .custom-color-cell {
position: relative; position: relative;
display: flex; display: flex;
@ -79,9 +84,3 @@
background-size: cover; background-size: cover;
--foreground: transparent; --foreground: transparent;
} }
.note-color-picker .custom-color-cell::before {
content: "\ed35";
color: var(--foreground);
font-size: 16px;
}

8
apps/client/src/menus/custom-items/NoteColorPicker.tsx
View File

@ -74,7 +74,13 @@ export default function NoteColorPicker(props: NoteColorPickerProps) {
color={null} color={null}
isSelected={(currentColor === null)} isSelected={(currentColor === null)}
isDisabled={(note === null)} isDisabled={(note === null)}
onSelect={onColorCellClicked} /> onSelect={onColorCellClicked}>
{/* https://pictogrammers.com/library/mdi/icon/close/ */}
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
<path d="M19,6.41L17.59,5L12,10.59L6.41,5L5,6.41L10.59,12L5,17.59L6.41,19L12,13.41L17.59,19L19,17.59L13.41,12L19,6.41Z" />
</svg>
</ColorCell>
{COLOR_PALETTE.map((color) => ( {COLOR_PALETTE.map((color) => (