till/managarten
1
0
Fork 0
mirror of https://github.com/Memo-2023/mana-monorepo.git synced 2026-05-21 22:26:41 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions 5

feat: major update with network graphs, themes, todo extensions, and more

Browse source 
## New Features

### Network Graph Visualization (Contacts, Calendar, Todo)
- D3.js force simulation for physics-based layout
- Zoom & pan with mouse/touchpad
- Keyboard shortcuts: +/- zoom, 0 reset, Esc deselect, / search, F focus
- Filtering by tags, company/location/project, connection strength
- Shared components in @manacore/shared-ui

### Central Tags API (mana-core-auth)
- CRUD endpoints for tags
- Schema: tags table with userId, name, color, app
- Shared tag components in @manacore/shared-ui

### Custom Themes System
- Theme editor with live preview and color picker
- Community theme gallery
- Theme sharing (public, unlisted, private)
- Backend API in mana-core-auth

### Todo App Extensions
- Glass-pill design for task input and items
- Settings page with 20+ preferences
- Task edit modal with inline editing
- Statistics page with visualizations
- PWA support with offline capabilities
- Multiple kanban boards

### Contacts App Features
- Duplicate detection
- Photo upload
- Batch operations
- Enhanced favorites page with multiple view modes
- Alphabet view improvements
- Search modal

### Help System
- @manacore/shared-help-content
- @manacore/shared-help-ui
- @manacore/shared-help-types

### Other Features
- Themes page for all apps
- Referral system frontend
- CommandBar (global search)
- Skeleton loaders
- Settings page improvements

## Bug Fixes
- Network graph simulation initialization
- Database schema TEXT for user_id columns (Better Auth compatibility)
- Various styling fixes

## Documentation
- Daily report for 2025-12-10
- CI/CD deployment guide

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
Till-JS 2025-12-10 02:37:46 +01:00
parent e84371aa94
commit ee42b6cc76
381 changed files with 39284 additions and 6275 deletions
Download patch file Download diff file Expand all files Collapse all files

215
packages/shared-ui/src/settings/SettingsTimeInput.svelte
View file

@ -52,31 +52,46 @@
function handleClear() {
onchange(null);
}
// Tailwind classes
const baseClasses = 'flex items-center justify-between gap-4 px-5 py-4';
const borderClasses = 'border-b border-black/[0.08] dark:border-white/10 last:border-b-0';
const disabledClasses = 'opacity-50 cursor-not-allowed';
const iconClasses =
'flex items-center justify-center flex-shrink-0 w-9 h-9 rounded-[0.625rem] bg-black/[0.04] dark:bg-white/[0.08] text-primary [&>svg]:w-[1.125rem] [&>svg]:h-[1.125rem]';
</script>
<div
class="settings-time {border ? 'settings-time--border' : ''} {disabled
? 'settings-time--disabled'
: ''} {className}"
class="{baseClasses} {border ? borderClasses : ''} {disabled ? disabledClasses : ''} {className}"
>
<div class="settings-time__content">
<div class="flex items-center gap-3 flex-1 min-w-0">
{#if icon}
<span class="settings-time__icon">
<span class={iconClasses}>
{@render icon()}
</span>
{/if}
<div class="settings-time__text">
<span class="settings-time__label">{label}</span>
<div class="flex flex-col gap-0.5 min-w-0">
<span class="text-[0.9375rem] font-medium text-gray-700 dark:text-gray-100">{label}</span>
{#if description}
<span class="settings-time__description">{description}</span>
<span class="text-[0.8125rem] text-gray-500 dark:text-gray-400 leading-snug"
>{description}</span
>
{/if}
</div>
</div>
<div class="settings-time__input-wrapper">
<div class="flex items-center gap-1">
<input
type="time"
class="settings-time__input"
class="w-24 px-3 py-2 text-sm font-medium text-gray-700 dark:text-gray-100 text-center
bg-black/[0.04] dark:bg-white/[0.08] border border-black/10 dark:border-white/[0.15]
rounded-lg transition-all duration-200
hover:border-black/20 dark:hover:border-white/25 hover:bg-black/[0.06] dark:hover:bg-white/[0.12]
focus-visible:outline-2 focus-visible:outline-primary/40 focus-visible:outline-offset-2 focus-visible:border-primary
disabled:cursor-not-allowed disabled:opacity-60
[&::-webkit-calendar-picker-indicator]:opacity-50 [&::-webkit-calendar-picker-indicator]:cursor-pointer
dark:[&::-webkit-calendar-picker-indicator]:invert dark:[&::-webkit-calendar-picker-indicator]:opacity-70"
value={value ?? ''}
oninput={handleInput}
{placeholder}
@ -86,7 +101,9 @@
{#if value}
<button
type="button"
class="settings-time__clear"
class="flex items-center justify-center w-7 h-7 p-0 text-gray-500 dark:text-gray-400 bg-transparent border-none rounded-md cursor-pointer transition-all duration-200
hover:text-red-500 hover:bg-red-500/10 dark:hover:bg-red-500/20
disabled:cursor-not-allowed disabled:opacity-50"
onclick={handleClear}
aria-label="Clear time"
{disabled}
@ -109,179 +126,3 @@
{/if}
</div>
</div>
<style>
.settings-time {
display: flex;
align-items: center;
justify-content: space-between;
gap: 1rem;
padding: 1rem 1.25rem;
}
.settings-time--border {
border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}
:global(.dark) .settings-time--border {
border-bottom-color: rgba(255, 255, 255, 0.1);
}
.settings-time--border:last-child {
border-bottom: none;
}
.settings-time--disabled {
opacity: 0.5;
cursor: not-allowed;
}
.settings-time__content {
display: flex;
align-items: center;
gap: 0.75rem;
flex: 1;
min-width: 0;
}
.settings-time__icon {
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
width: 2.25rem;
height: 2.25rem;
border-radius: 0.625rem;
background: rgba(0, 0, 0, 0.04);
color: hsl(var(--primary));
}
:global(.dark) .settings-time__icon {
background: rgba(255, 255, 255, 0.08);
}
.settings-time__icon :global(svg) {
width: 1.125rem;
height: 1.125rem;
}
.settings-time__text {
display: flex;
flex-direction: column;
gap: 0.125rem;
min-width: 0;
}
.settings-time__label {
font-size: 0.9375rem;
font-weight: 500;
color: #374151;
}
:global(.dark) .settings-time__label {
color: #f3f4f6;
}
.settings-time__description {
font-size: 0.8125rem;
color: #6b7280;
line-height: 1.4;
}
:global(.dark) .settings-time__description {
color: #9ca3af;
}
/* Input wrapper */
.settings-time__input-wrapper {
display: flex;
align-items: center;
gap: 0.25rem;
}
/* Time Input - Glass style */
.settings-time__input {
width: 6rem;
padding: 0.5rem 0.75rem;
font-size: 0.875rem;
font-weight: 500;
color: #374151;
text-align: center;
background-color: rgba(0, 0, 0, 0.04);
border: 1px solid rgba(0, 0, 0, 0.1);
border-radius: 0.5rem;
transition: all 0.2s ease;
}
:global(.dark) .settings-time__input {
color: #f3f4f6;
background-color: rgba(255, 255, 255, 0.08);
border-color: rgba(255, 255, 255, 0.15);
}
.settings-time__input:hover:not(:disabled) {
border-color: rgba(0, 0, 0, 0.2);
background-color: rgba(0, 0, 0, 0.06);
}
:global(.dark) .settings-time__input:hover:not(:disabled) {
border-color: rgba(255, 255, 255, 0.25);
background-color: rgba(255, 255, 255, 0.12);
}
.settings-time__input:focus-visible {
outline: 2px solid hsl(var(--primary) / 0.4);
outline-offset: 2px;
border-color: hsl(var(--primary));
}
.settings-time__input:disabled {
cursor: not-allowed;
opacity: 0.6;
}
/* Clear button */
.settings-time__clear {
display: flex;
align-items: center;
justify-content: center;
width: 1.75rem;
height: 1.75rem;
padding: 0;
color: #6b7280;
background: transparent;
border: none;
border-radius: 0.375rem;
cursor: pointer;
transition: all 0.2s ease;
}
.settings-time__clear:hover:not(:disabled) {
color: #ef4444;
background-color: rgba(239, 68, 68, 0.1);
}
:global(.dark) .settings-time__clear {
color: #9ca3af;
}
:global(.dark) .settings-time__clear:hover:not(:disabled) {
color: #ef4444;
background-color: rgba(239, 68, 68, 0.2);
}
.settings-time__clear:disabled {
cursor: not-allowed;
opacity: 0.5;
}
/* Style the time input appearance */
.settings-time__input::-webkit-calendar-picker-indicator {
filter: invert(0.5);
cursor: pointer;
}
:global(.dark) .settings-time__input::-webkit-calendar-picker-indicator {
filter: invert(0.7);
}
</style>