mirror of
https://github.com/Freika/dawarich.git
synced 2026-01-10 01:01:39 -05:00
b1393ee674
* Implement OmniAuth GitHub authentication * Fix omniauth GitHub scope to include user email access * Remove margin-bottom * Implement Google OAuth2 authentication * Implement OIDC authentication for Dawarich using omniauth_openid_connect gem. * Add patreon account linking and patron checking service * Update docker-compose.yml to use boolean values instead of strings * Add support for KML files * Add tests * Update changelog * Remove patreon OAuth integration * Move omniauthable to a concern * Update an icon in integrations * Update changelog * Update app version * Fix family location sharing toggle * Move family location sharing to its own controller * Update changelog * Implement basic tagging functionality for places, allowing users to categorize and label places with custom tags. * Add places management API and tags feature * Add some changes related to places management feature * Fix some tests * Fix sometests * Add places layer * Update places layer to use Leaflet.Control.Layers.Tree for hierarchical layer control * Rework tag form * Add hashtag * Add privacy zones to tags * Add notes to places and manage place tags * Update changelog * Update e2e tests * Extract tag serializer to its own file * Fix some tests * Fix tags request specs * Fix some tests * Fix rest of the tests * Revert some changes * Add missing specs * Revert changes in place export/import code * Fix some specs * Fix PlaceFinder to only consider global places when finding existing places * Fix few more specs * Fix visits creator spec * Fix last tests * Update place creating modal * Add home location based on "Home" tagged place * Save enabled tag layers * Some fixes * Fix bug where enabling place tag layers would trigger saving enabled layers, overwriting with incomplete data * Update migration to use disable_ddl_transaction! and add up/down methods * Fix tag layers restoration and filtering logic * Update OIDC auto-registration and email/password registration settings * Fix potential xss
347 lines
11 KiB
CSS
347 lines
11 KiB
CSS
/* Leaflet Theme Styles - Light and Dark mode support */
|
|
|
|
/* CSS Custom Properties for Light Theme */
|
|
[data-theme="light"] {
|
|
--leaflet-bg-color: #ffffff;
|
|
--leaflet-text-color: #000000;
|
|
--leaflet-border-color: #e5e7eb;
|
|
--leaflet-shadow-color: rgba(0, 0, 0, 0.1);
|
|
--leaflet-hover-color: #f3f4f6;
|
|
--leaflet-link-color: #0066cc;
|
|
--leaflet-scale-bg: rgba(255, 255, 255, 0.9);
|
|
}
|
|
|
|
/* CSS Custom Properties for Dark Theme */
|
|
[data-theme="dark"] {
|
|
--leaflet-bg-color: #374151;
|
|
--leaflet-text-color: #ffffff;
|
|
--leaflet-border-color: #4b5563;
|
|
--leaflet-shadow-color: rgba(0, 0, 0, 0.3);
|
|
--leaflet-hover-color: #4b5563;
|
|
--leaflet-link-color: #66b3ff;
|
|
--leaflet-scale-bg: rgba(55, 65, 81, 0.9);
|
|
}
|
|
|
|
/* Leaflet default controls theme override */
|
|
.leaflet-control-layers,
|
|
.leaflet-control-zoom,
|
|
.leaflet-control-attribution,
|
|
.leaflet-bar a,
|
|
.leaflet-control-layers-toggle,
|
|
.leaflet-control-layers-list,
|
|
.leaflet-control-draw {
|
|
background-color: var(--leaflet-bg-color) !important;
|
|
color: var(--leaflet-text-color) !important;
|
|
border-color: var(--leaflet-border-color) !important;
|
|
box-shadow: 0 1px 4px var(--leaflet-shadow-color) !important;
|
|
|
|
}
|
|
|
|
/* Leaflet zoom buttons */
|
|
.leaflet-control-zoom a {
|
|
background-color: var(--leaflet-bg-color) !important;
|
|
color: var(--leaflet-text-color) !important;
|
|
border-bottom: 1px solid var(--leaflet-border-color) !important;
|
|
}
|
|
|
|
.leaflet-control-zoom a:hover {
|
|
background-color: var(--leaflet-hover-color) !important;
|
|
}
|
|
|
|
/* Leaflet layer control */
|
|
.leaflet-control-layers {
|
|
border: none !important;
|
|
border-radius: 0.5rem !important;
|
|
box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06) !important;
|
|
background-color: var(--leaflet-bg-color) !important;
|
|
color: var(--leaflet-text-color) !important;
|
|
padding: 0 !important;
|
|
}
|
|
|
|
.leaflet-control-layers-expanded {
|
|
padding: 1rem !important;
|
|
min-width: 200px;
|
|
}
|
|
|
|
/* Hide the toggle icon when expanded */
|
|
.leaflet-control-layers-expanded .leaflet-control-layers-toggle {
|
|
display: none !important;
|
|
}
|
|
|
|
.leaflet-control-layers-toggle {
|
|
width: 44px !important;
|
|
height: 44px !important;
|
|
background-color: var(--leaflet-bg-color) !important;
|
|
color: var(--leaflet-text-color) !important;
|
|
border-radius: 0.5rem !important;
|
|
/* Replace default icon with custom SVG */
|
|
background-image: none !important;
|
|
display: flex !important;
|
|
align-items: center !important;
|
|
justify-content: center !important;
|
|
transition: background-color 0.2s;
|
|
}
|
|
|
|
.leaflet-control-layers-toggle:hover {
|
|
background-color: var(--leaflet-hover-color) !important;
|
|
}
|
|
|
|
.leaflet-control-layers-toggle::before {
|
|
content: '' !important;
|
|
display: block !important;
|
|
width: 24px !important;
|
|
height: 24px !important;
|
|
background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M12.83 2.18a2 2 0 0 0-1.66 0L2.6 6.08a1 1 0 0 0 0 1.83l8.58 3.91a2 2 0 0 0 1.66 0l8.58-3.9a1 1 0 0 0 0-1.83z"/><path d="M2 12a1 1 0 0 0 .58.91l8.6 3.91a2 2 0 0 0 1.65 0l8.58-3.9A1 1 0 0 0 22 12"/><path d="M2 17a1 1 0 0 0 .58.91l8.6 3.91a2 2 0 0 0 1.65 0l8.58-3.9A1 1 0 0 0 22 17"/></svg>') !important;
|
|
background-size: contain !important;
|
|
background-repeat: no-repeat !important;
|
|
background-position: center !important;
|
|
}
|
|
|
|
/* Dark theme - use white stroke for the icon */
|
|
[data-theme="dark"] .leaflet-control-layers-toggle::before {
|
|
background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M12.83 2.18a2 2 0 0 0-1.66 0L2.6 6.08a1 1 0 0 0 0 1.83l8.58 3.91a2 2 0 0 0 1.66 0l8.58-3.9a1 1 0 0 0 0-1.83z"/><path d="M2 12a1 1 0 0 0 .58.91l8.6 3.91a2 2 0 0 0 1.65 0l8.58-3.9A1 1 0 0 0 22 12"/><path d="M2 17a1 1 0 0 0 .58.91l8.6 3.91a2 2 0 0 0 1.65 0l8.58-3.9A1 1 0 0 0 22 17"/></svg>') !important;
|
|
}
|
|
|
|
/* Light theme - use black stroke for the icon */
|
|
[data-theme="light"] .leaflet-control-layers-toggle::before {
|
|
background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M12.83 2.18a2 2 0 0 0-1.66 0L2.6 6.08a1 1 0 0 0 0 1.83l8.58 3.91a2 2 0 0 0 1.66 0l8.58-3.9a1 1 0 0 0 0-1.83z"/><path d="M2 12a1 1 0 0 0 .58.91l8.6 3.91a2 2 0 0 0 1.65 0l8.58-3.9A1 1 0 0 0 22 12"/><path d="M2 17a1 1 0 0 0 .58.91l8.6 3.91a2 2 0 0 0 1.65 0l8.58-3.9A1 1 0 0 0 22 17"/></svg>') !important;
|
|
}
|
|
|
|
/* Layer list styling */
|
|
.leaflet-control-layers-list {
|
|
margin-bottom: 0 !important;
|
|
}
|
|
|
|
.leaflet-control-layers-base,
|
|
.leaflet-control-layers-overlays {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 0.5rem;
|
|
}
|
|
|
|
.leaflet-control-layers-separator {
|
|
height: 1px;
|
|
margin: 0.75rem 0;
|
|
background-color: var(--leaflet-border-color);
|
|
}
|
|
|
|
/* Label styling */
|
|
.leaflet-control-layers label {
|
|
display: flex !important;
|
|
align-items: center !important;
|
|
margin-bottom: 0 !important;
|
|
cursor: pointer;
|
|
font-size: 0.875rem;
|
|
line-height: 1.25rem;
|
|
color: var(--leaflet-text-color) !important;
|
|
}
|
|
|
|
.leaflet-control-layers label:hover {
|
|
opacity: 0.8;
|
|
}
|
|
|
|
.leaflet-control-layers label span {
|
|
margin-left: 0.5rem;
|
|
}
|
|
|
|
/* Custom Checkbox/Radio styling using DaisyUI/Tailwind logic */
|
|
.leaflet-control-layers input[type="checkbox"],
|
|
.leaflet-control-layers input[type="radio"] {
|
|
appearance: none;
|
|
width: 1.25rem;
|
|
height: 1.25rem;
|
|
border: 1px solid var(--leaflet-border-color);
|
|
border-radius: 0.25rem;
|
|
/* Rounded for checkbox */
|
|
background-color: var(--leaflet-bg-color);
|
|
cursor: pointer;
|
|
position: relative;
|
|
margin: 0 !important;
|
|
flex-shrink: 0;
|
|
}
|
|
|
|
.leaflet-control-layers input[type="radio"] {
|
|
border-radius: 9999px;
|
|
/* Circle for radio */
|
|
}
|
|
|
|
.leaflet-control-layers input[type="checkbox"]:checked,
|
|
.leaflet-control-layers input[type="radio"]:checked {
|
|
background-color: var(--leaflet-link-color);
|
|
border-color: var(--leaflet-link-color);
|
|
}
|
|
|
|
/* Checkbox checkmark */
|
|
.leaflet-control-layers input[type="checkbox"]:checked::after {
|
|
content: '';
|
|
position: absolute;
|
|
top: 50%;
|
|
left: 50%;
|
|
width: 0.65rem;
|
|
height: 0.65rem;
|
|
background-image: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='white' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12.207 4.793a1 1 0 010 1.414l-5 5a1 1 0 01-1.414 0l-2-2a1 1 0 011.414-1.414L6.5 9.086l4.293-4.293a1 1 0 011.414 0z'/%3e%3c/svg%3e");
|
|
background-size: contain;
|
|
background-repeat: no-repeat;
|
|
transform: translate(-50%, -50%);
|
|
}
|
|
|
|
/* Radio dot */
|
|
.leaflet-control-layers input[type="radio"]:checked::after {
|
|
content: '';
|
|
position: absolute;
|
|
top: 50%;
|
|
left: 50%;
|
|
width: 0.5rem;
|
|
height: 0.5rem;
|
|
background-color: white;
|
|
border-radius: 50%;
|
|
transform: translate(-50%, -50%);
|
|
}
|
|
|
|
/* Leaflet Draw controls */
|
|
.leaflet-draw-toolbar a {
|
|
background-color: var(--leaflet-bg-color) !important;
|
|
color: var(--leaflet-text-color) !important;
|
|
border-bottom: 1px solid var(--leaflet-border-color) !important;
|
|
}
|
|
|
|
.leaflet-draw-toolbar a:hover {
|
|
background-color: var(--leaflet-hover-color) !important;
|
|
}
|
|
|
|
.leaflet-draw-actions a {
|
|
background-color: var(--leaflet-bg-color) !important;
|
|
color: var(--leaflet-text-color) !important;
|
|
}
|
|
|
|
/* Leaflet popups */
|
|
.leaflet-popup-content-wrapper {
|
|
background-color: var(--leaflet-bg-color) !important;
|
|
color: var(--leaflet-text-color) !important;
|
|
}
|
|
|
|
.leaflet-popup-tip {
|
|
background-color: var(--leaflet-bg-color) !important;
|
|
}
|
|
|
|
/* Attribution control */
|
|
.leaflet-control-attribution a {
|
|
color: var(--leaflet-link-color) !important;
|
|
}
|
|
|
|
/* Custom control buttons */
|
|
.leaflet-control-button,
|
|
.add-visit-button,
|
|
.leaflet-bar button {
|
|
background-color: var(--leaflet-bg-color) !important;
|
|
color: var(--leaflet-text-color) !important;
|
|
border: 1px solid var(--leaflet-border-color) !important;
|
|
box-shadow: 0 1px 4px var(--leaflet-shadow-color) !important;
|
|
}
|
|
|
|
.leaflet-control-button:hover,
|
|
.add-visit-button:hover,
|
|
.leaflet-bar button:hover {
|
|
background-color: var(--leaflet-hover-color) !important;
|
|
}
|
|
|
|
/* Any other custom controls */
|
|
.leaflet-top .leaflet-control button,
|
|
.leaflet-bottom .leaflet-control button,
|
|
.leaflet-left .leaflet-control button,
|
|
.leaflet-right .leaflet-control button {
|
|
background-color: var(--leaflet-bg-color) !important;
|
|
color: var(--leaflet-text-color) !important;
|
|
border: 1px solid var(--leaflet-border-color) !important;
|
|
}
|
|
|
|
/* Location search button */
|
|
.location-search-toggle,
|
|
#location-search-toggle {
|
|
background-color: var(--leaflet-bg-color) !important;
|
|
color: var(--leaflet-text-color) !important;
|
|
border: 1px solid var(--leaflet-border-color) !important;
|
|
box-shadow: 0 1px 4px var(--leaflet-shadow-color) !important;
|
|
}
|
|
|
|
.location-search-toggle:hover,
|
|
#location-search-toggle:hover {
|
|
background-color: var(--leaflet-hover-color) !important;
|
|
}
|
|
|
|
/* Distance scale control */
|
|
.leaflet-control-scale {
|
|
background: var(--leaflet-scale-bg) !important;
|
|
border-radius: 3px !important;
|
|
padding: 2px !important;
|
|
}
|
|
|
|
/* Family member tooltip - dark styled like the visit popup */
|
|
.leaflet-tooltip.family-member-tooltip {
|
|
background-color: #374151 !important;
|
|
color: #ffffff !important;
|
|
border: 1px solid #4b5563 !important;
|
|
border-radius: 4px !important;
|
|
padding: 4px 8px !important;
|
|
font-size: 11px !important;
|
|
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3) !important;
|
|
}
|
|
|
|
.leaflet-tooltip.family-member-tooltip::before {
|
|
border-top-color: #374151 !important;
|
|
}
|
|
|
|
/* Family member popup - just override colors, keep default layout */
|
|
.leaflet-popup-content-wrapper:has(.family-member-popup) {
|
|
background-color: #1f2937 !important;
|
|
color: #f9fafb !important;
|
|
}
|
|
|
|
.leaflet-popup-content-wrapper:has(.family-member-popup)+.leaflet-popup-tip {
|
|
background-color: #1f2937 !important;
|
|
}
|
|
|
|
/* Family member marker pulse animation for recent updates */
|
|
@keyframes family-marker-pulse {
|
|
0% {
|
|
box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.7);
|
|
}
|
|
|
|
50% {
|
|
box-shadow: 0 0 0 10px rgba(16, 185, 129, 0);
|
|
}
|
|
|
|
100% {
|
|
box-shadow: 0 0 0 0 rgba(16, 185, 129, 0);
|
|
}
|
|
}
|
|
|
|
.family-member-marker-recent {
|
|
animation: family-marker-pulse 2s infinite;
|
|
border-radius: 50% !important;
|
|
}
|
|
|
|
.family-member-marker-recent .leaflet-marker-icon>div {
|
|
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2), 0 0 0 0 rgba(16, 185, 129, 0.7);
|
|
border-radius: 50%;
|
|
}
|
|
|
|
/* Fix bottom controls being cut off */
|
|
.leaflet-bottom {
|
|
padding-bottom: 10px !important;
|
|
transition: padding-bottom 0.3s ease;
|
|
}
|
|
|
|
.leaflet-bottom.leaflet-left {
|
|
padding-left: 10px !important;
|
|
}
|
|
|
|
.leaflet-bottom.leaflet-right {
|
|
padding-right: 10px !important;
|
|
}
|
|
|
|
/* DaisyUI tooltips on map buttons - ensure they appear above date navigation (z-index: 9999) */
|
|
.tooltip:before,
|
|
.tooltip:after {
|
|
z-index: 10000 !important;
|
|
}
|