gaschz/trilium
1
0
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2025-11-01 20:19:05 +01:00
Code Issues Actions 10 Packages Projects Releases Wiki Activity

chore(react/collections/calendar): set up CSS

Browse Source
This commit is contained in:
Elian Doran 2025-09-05 16:22:48 +03:00
parent aada49e548
commit feb984649f
No known key found for this signature in database
3 changed files with 70 additions and 74 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

62
apps/client/src/widgets/collections/calendar/index.css Normal file
View File

@ -0,0 +1,62 @@
.calendar-view {
overflow: hidden;
position: relative;
height: 100%;
user-select: none;
padding: 10px;
}
.calendar-view a {
color: unset;
}
.search-result-widget-content .calendar-view {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
}
.calendar-container {
height: 100%;
--fc-page-bg-color: var(--main-background-color);
--fc-border-color: var(--main-border-color);
--fc-neutral-bg-color: var(--launcher-pane-background-color);
--fc-list-event-hover-bg-color: var(--left-pane-item-hover-background);
}
.calendar-container .fc-toolbar.fc-header-toolbar {
margin-bottom: 0.5em;
}
.calendar-container .fc-list-sticky .fc-list-day > * {
z-index: 50;
}
body.desktop:not(.zen) .calendar-container .fc-toolbar.fc-header-toolbar {
padding-right: 5em;
}
.search-result-widget-content .calendar-view .fc-toolbar.fc-header-toolbar {
padding-right: unset !important;
}
.calendar-container .fc-toolbar-title {
font-size: 1.3rem;
font-weight: normal;
}
.calendar-container a.fc-event {
text-decoration: none;
}
.calendar-container .fc-button {
padding: 0.2em 0.5em;
}
.calendar-container .promoted-attribute {
font-size: 0.85em;
opacity: 0.85;
overflow: hidden;
}

13
apps/client/src/widgets/collections/calendar/index.tsx
View File

@ -2,6 +2,7 @@ import { PluginDef } from "@fullcalendar/core/index.js";
import { ViewModeProps } from "../interface";
import Calendar from "./calendar";
import { useEffect, useState } from "preact/hooks";
import "./index.css";
interface CalendarViewData {
@ -11,11 +12,13 @@ export default function CalendarView({ note, noteIds }: ViewModeProps<CalendarVi
const plugins = usePlugins(false, false);
return (plugins &&
<Calendar
plugins={plugins}
tabIndex={100}
view="dayGridMonth"
/>
<div className="calendar-view">
<Calendar
plugins={plugins}
tabIndex={100}
view="dayGridMonth"
/>
</div>
);
}

69
apps/client/src/widgets/view_widgets/calendar_view.ts
View File

@ -32,75 +32,6 @@ const LOCALE_MAPPINGS: Record<LOCALE_IDS, (() => Promise<{ default: LocaleInput
en: null
};
const TPL = /*html*/`
<div class="calendar-view">
<style>
.calendar-view {
overflow: hidden;
position: relative;
height: 100%;
user-select: none;
padding: 10px;
}
.calendar-view a {
color: unset;
}
.search-result-widget-content .calendar-view {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
}
.calendar-container {
height: 100%;
--fc-page-bg-color: var(--main-background-color);
--fc-border-color: var(--main-border-color);
--fc-neutral-bg-color: var(--launcher-pane-background-color);
--fc-list-event-hover-bg-color: var(--left-pane-item-hover-background);
}
.calendar-container .fc-toolbar.fc-header-toolbar {
margin-bottom: 0.5em;
}
.calendar-container .fc-list-sticky .fc-list-day > * {
z-index: 50;
}
body.desktop:not(.zen) .calendar-container .fc-toolbar.fc-header-toolbar {
padding-right: 5em;
}
.search-result-widget-content .calendar-view .fc-toolbar.fc-header-toolbar {
padding-right: unset !important;
}
.calendar-container .fc-toolbar-title {
font-size: 1.3rem;
font-weight: normal;
}
.calendar-container a.fc-event {
text-decoration: none;
}
.calendar-container .fc-button {
padding: 0.2em 0.5em;
}
.calendar-container .promoted-attribute {
font-size: 0.85em;
opacity: 0.85;
overflow: hidden;
}
</style>
</div>
`;
// TODO: Deduplicate
interface CreateChildResponse {
note: {