15dcc8803d
This implements a basic CalDav UI, titled "Calendar". It allows creating new calendars and events with a start and end date, URL, location, and description. You can also import and export ICS (VCALENDAR + VEVENT) files. It allows editing the ICS directly, for power users. Additionally, you can hide/display events from certain calendars, change their names and their colors. If there's no calendar created yet in your CalDav server (first-time setup), it'll automatically create one, titled "Calendar". You can also change the display timezone for the calendar from the settings. Finally, there's some minor documentation fixes and some other minor tweaks. Closes #56 Closes #89
99 lines
2.5 KiB
CSS
99 lines
2.5 KiB
CSS
@tailwind base;
|
|
@tailwind components;
|
|
@tailwind utilities;
|
|
|
|
html {
|
|
/* This is needed to ensure that the system color scheme is dark and matches the dark theme of the app */
|
|
color-scheme: dark;
|
|
}
|
|
|
|
h1 {
|
|
@apply text-4xl font-bold;
|
|
}
|
|
|
|
a {
|
|
@apply text-[#51a4fb] no-underline hover:underline font-semibold;
|
|
}
|
|
|
|
main {
|
|
@apply mx-auto max-w-7xl py-6 sm:px-6 lg:px-8 text-white;
|
|
}
|
|
|
|
form {
|
|
@apply px-4 py-8 max-w-screen-md mx-auto lg:min-w-96;
|
|
}
|
|
|
|
.button {
|
|
@apply inline-block rounded text-white no-underline font-normal bg-[#51a4fb] hover:bg-sky-400 hover:shadow-sm
|
|
hover:no-underline px-4 py-2;
|
|
}
|
|
|
|
.button-secondary {
|
|
@apply inline-block rounded text-white no-underline font-normal bg-slate-600 hover:text-slate-900 hover:bg-slate-400
|
|
hover:shadow-sm hover:no-underline px-4 py-2;
|
|
}
|
|
|
|
.button-danger {
|
|
@apply inline-block rounded text-slate-50 no-underline font-normal bg-red-600 hover:text-slate-900 hover:bg-red-400
|
|
hover:shadow-md hover:no-underline px-4 py-2;
|
|
}
|
|
|
|
.input-field {
|
|
@apply block w-full p-2 rounded-md text-white bg-slate-700 border-transparent border focus:border-[#51a4fb]
|
|
focus:bg-slate-700 outline-none focus:ring-0 shadow-sm;
|
|
}
|
|
|
|
.input-field[type='range'] {
|
|
@apply w-auto;
|
|
}
|
|
|
|
.input-field:required:invalid:not(:placeholder-shown) {
|
|
@apply bg-red-400;
|
|
}
|
|
|
|
.notification-error {
|
|
@apply bg-red-700 rounded text-white px-6 py-8 shadow-md mt-2 mb-6 w-full hover:shadow-lg;
|
|
}
|
|
|
|
.notification-error h3 {
|
|
@apply text-4xl text-white mb-6;
|
|
}
|
|
|
|
.notification-success {
|
|
@apply bg-green-600 rounded text-white px-6 py-8 shadow-md mt-2 mb-6 w-full hover:shadow-lg;
|
|
}
|
|
|
|
.notification-success h3 {
|
|
@apply text-4xl text-white mb-6;
|
|
}
|
|
|
|
img.white {
|
|
filter: invert(100%) sepia(0%) saturate(7500%) hue-rotate(42deg) brightness(99%) contrast(112%);
|
|
}
|
|
|
|
img.green {
|
|
filter: invert(47%) sepia(19%) saturate(6698%) hue-rotate(114deg) brightness(91%) contrast(83%);
|
|
}
|
|
|
|
img.red {
|
|
filter: invert(18%) sepia(45%) saturate(3518%) hue-rotate(337deg) brightness(110%) contrast(101%);
|
|
}
|
|
|
|
img.gray {
|
|
filter: invert(30%) sepia(46%) saturate(356%) hue-rotate(174deg) brightness(90%) contrast(82%);
|
|
}
|
|
|
|
img.blue {
|
|
filter: invert(74%) sepia(36%) saturate(7057%) hue-rotate(186deg) brightness(101%) contrast(97%);
|
|
}
|
|
|
|
details summary::-webkit-details-marker {
|
|
display: none;
|
|
}
|
|
|
|
.calendar-week-view-days {
|
|
grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
|
|
grid-template-rows:
|
|
0.5fr 1fr 0.5fr 0.5fr 0.5fr 0.5fr 0.5fr 0.5fr 0.5fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
|
|
}
|