fix: fix tags container max width
This commit is contained in:
@@ -23,7 +23,7 @@ const NoteTagsContainer = observer(({ application, appState }: Props) => {
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<div
|
<div
|
||||||
className="bg-default flex flex-wrap pl-1 -ml-1"
|
className="bg-default flex flex-wrap pl-1 -ml-1 -ml-2"
|
||||||
style={{
|
style={{
|
||||||
maxWidth: tagsContainerMaxWidth,
|
maxWidth: tagsContainerMaxWidth,
|
||||||
}}
|
}}
|
||||||
|
|||||||
@@ -105,14 +105,10 @@ export class ActiveNoteState {
|
|||||||
|
|
||||||
reloadTagsContainerMaxWidth(): void {
|
reloadTagsContainerMaxWidth(): void {
|
||||||
const EDITOR_ELEMENT_ID = 'editor-column';
|
const EDITOR_ELEMENT_ID = 'editor-column';
|
||||||
const defaultFontSize = parseFloat(window.getComputedStyle(
|
|
||||||
document.documentElement
|
|
||||||
).fontSize);
|
|
||||||
const margins = defaultFontSize * 1.5;
|
|
||||||
const editorWidth = document.getElementById(EDITOR_ELEMENT_ID)?.clientWidth;
|
const editorWidth = document.getElementById(EDITOR_ELEMENT_ID)?.clientWidth;
|
||||||
if (editorWidth) {
|
if (editorWidth) {
|
||||||
this.appState.activeNote.setTagsContainerMaxWidth(
|
this.appState.activeNote.setTagsContainerMaxWidth(
|
||||||
editorWidth - margins
|
editorWidth
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -69,6 +69,10 @@
|
|||||||
margin-left: -0.25rem;
|
margin-left: -0.25rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.-ml-2 {
|
||||||
|
margin-right: -0.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
.-mr-1 {
|
.-mr-1 {
|
||||||
margin-right: -0.25rem;
|
margin-right: -0.25rem;
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user