gaschz/trilium
1
0
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2025-12-04 22:44:25 +01:00
Code Issues Actions 10 Packages Projects Releases Wiki Activity

chore(react/launch_bar): fix style for month selector
Some checks are pending
Checks / main (push) Waiting to run
Details

Browse Source
This commit is contained in:
Elian Doran 2025-12-04 21:36:04 +02:00
parent a65d2a1bba
commit 4571b95683
No known key found for this signature in database
3 changed files with 9 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
apps/client/src/widgets/buttons/calendar.ts
View File

@ -62,26 +62,6 @@ export default class CalendarWidget extends RightDropdownButtonWidget {
}
});
// Year navigation
this.$yearSelect = this.$dropdownContent.find('[data-calendar-input="year"]');
this.$yearSelect.on("input", (e) => {
const target = e.target as HTMLInputElement;
this.date = this.date.year(parseInt(target.value));
this.createMonth();
});
this.$nextYear = this.$dropdownContent.find('[data-calendar-toggle="nextYear"]');
this.$nextYear.on("click", () => {
this.date = this.date.add(1, 'year');
this.createMonth();
});
this.$previousYear = this.$dropdownContent.find('[data-calendar-toggle="previousYear"]');
this.$previousYear.on("click", () => {
this.date = this.date.subtract(1, 'year');
this.createMonth();
});
// Date click
this.$dropdownContent.on("click", ".calendar-date", async (ev) => {
const date = $(ev.target).closest(".calendar-date").attr("data-calendar-date");

2
apps/client/src/widgets/launch_bar/CalendarWidget.tsx
View File

@ -6,7 +6,6 @@ import appContext from "../../components/app_context";
import "./CalendarWidget.css";
import Calendar from "./Calendar";
import ActionButton from "../react/ActionButton";
import Dropdown from "../react/Dropdown";
import { t } from "../../services/i18n";
import FormDropdownList from "../react/FormDropdownList";
import FormTextBox from "../react/FormTextBox";
@ -82,6 +81,7 @@ function CalendarMonthSelector({ date, setDate }: CalendarHeaderProps) {
onChange={value => {
}}
buttonProps={{ "data-calendar-input": "month" }}
/>
<AdjustDateButton date={date} setDate={setDate} direction="next" unit="month" />
</div>

10
apps/client/src/widgets/react/Dropdown.tsx
View File

@ -1,11 +1,16 @@
import { Dropdown as BootstrapDropdown } from "bootstrap";
import { ComponentChildren } from "preact";
import { ComponentChildren, HTMLAttributes } from "preact";
import { CSSProperties, HTMLProps } from "preact/compat";
import { useCallback, useEffect, useRef, useState } from "preact/hooks";
import { useUniqueName } from "./hooks";
type DataAttributes = {
[key: `data-${string}`]: string | number | boolean | undefined;
};
export interface DropdownProps extends Pick<HTMLProps<HTMLDivElement>, "id" | "className"> {
buttonClassName?: string;
buttonProps?: Partial<HTMLAttributes<HTMLButtonElement> & DataAttributes>;
isStatic?: boolean;
children: ComponentChildren;
title?: string;
@ -24,7 +29,7 @@ export interface DropdownProps extends Pick<HTMLProps<HTMLDivElement>, "id" | "c
dropdownOptions?: Partial<BootstrapDropdown.Options>;
}
export default function Dropdown({ id, className, buttonClassName, isStatic, children, title, text, dropdownContainerStyle, dropdownContainerClassName, hideToggleArrow, iconAction, disabled, noSelectButtonStyle, noDropdownListStyle, forceShown, onShown: externalOnShown, onHidden: externalOnHidden, dropdownOptions }: DropdownProps) {
export default function Dropdown({ id, className, buttonClassName, isStatic, children, title, text, dropdownContainerStyle, dropdownContainerClassName, hideToggleArrow, iconAction, disabled, noSelectButtonStyle, noDropdownListStyle, forceShown, onShown: externalOnShown, onHidden: externalOnHidden, dropdownOptions, buttonProps }: DropdownProps) {
const dropdownRef = useRef<HTMLDivElement | null>(null);
const triggerRef = useRef<HTMLButtonElement | null>(null);
@ -80,6 +85,7 @@ export default function Dropdown({ id, className, buttonClassName, isStatic, chi
title={title}
id={id ?? ariaId}
disabled={disabled}
{...buttonProps}
>
{text}
<span className="caret"></span>