songtianlun
daa0ceac3e
- Replace OpenLayers with Mapbox GL for map rendering. - Update CSS for map styling and control visibility. - Integrate weather art into map popups. - Add Mapbox token to credentials.yml.enc This commit replaces the existing OpenLayers map implementation with Mapbox GL. It also adjusts the styling and adds a weather art display to the map popup, which enhances the user experience. The necessary changes include modifying stylesheets, JavaScript controllers, view templates, and updating the credentials file. The motivation is to enhance map rendering performance and user experience.
61 lines
1.1 KiB
CSS
61 lines
1.1 KiB
CSS
@import "photoswipe/dist/photoswipe.css";
|
|
@import "mapbox-gl/dist/mapbox-gl.css";
|
|
|
|
@tailwind base;
|
|
@tailwind components;
|
|
@tailwind utilities;
|
|
|
|
.loading {
|
|
position: relative;
|
|
}
|
|
|
|
.loading::after {
|
|
content: "";
|
|
position: absolute;
|
|
top: 50%;
|
|
right: 1rem;
|
|
transform: translateY(-50%);
|
|
width: 1rem;
|
|
height: 1rem;
|
|
border: 2px solid transparent;
|
|
border-top-color: currentColor;
|
|
border-right-color: currentColor;
|
|
border-radius: 50%;
|
|
animation: spin 0.6s linear infinite;
|
|
}
|
|
|
|
@keyframes spin {
|
|
to {
|
|
transform: translateY(-50%) rotate(360deg);
|
|
}
|
|
}
|
|
|
|
@keyframes spin {
|
|
from {
|
|
transform: rotate(0deg);
|
|
}
|
|
to {
|
|
transform: rotate(360deg);
|
|
}
|
|
}
|
|
|
|
.animate-spin {
|
|
animation: spin 1s linear infinite;
|
|
transform-origin: center center;
|
|
}
|
|
|
|
@layer components {
|
|
.mapboxgl-ctrl-logo,
|
|
.mapboxgl-ctrl-attrib {
|
|
@apply hidden !important; /* 隐藏版权信息 */
|
|
}
|
|
|
|
.mapboxgl-ctrl-zoom-in,
|
|
.mapboxgl-ctrl-zoom-out {
|
|
@apply bg-base-200 text-base-content hover:bg-base-300 p-2;
|
|
}
|
|
|
|
.mapboxgl-marker path {
|
|
@apply fill-current text-primary;
|
|
}
|
|
} |