songtianlun
9ac7dd46af
Some checks are pending
Docker / docker (push) Waiting to run
- Replaced Leaflet with OpenLayers for improved map rendering - Added OpenLayers CSS and removed Leaflet CSS - Updated map controller to use OpenLayers API - Added marker icon in public directory - Added scopes and associations for weather art in City model This change migrates the map display from Leaflet to OpenLayers, providing better performance and more features. It also introduces new model associations for weather arts, allowing to sort cities by latest weather updates.
72 lines
1.3 KiB
CSS
72 lines
1.3 KiB
CSS
@import "photoswipe/dist/photoswipe.css";
|
|
/*@import "leaflet/dist/leaflet.css";*/
|
|
@import 'ol/ol.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;
|
|
}
|
|
|
|
.map-container {
|
|
width: 100%;
|
|
height: 400px;
|
|
position: relative;
|
|
}
|
|
|
|
/* 使弹出窗口在地图上可见 */
|
|
.ol-overlay-container {
|
|
will-change: transform;
|
|
position: absolute;
|
|
transform: translate(-50%, -100%);
|
|
pointer-events: auto;
|
|
}
|
|
|
|
/* 添加一个小箭头 */
|
|
.ol-overlay-container::after {
|
|
content: '';
|
|
position: absolute;
|
|
top: 100%;
|
|
left: 50%;
|
|
margin-left: -8px;
|
|
border-width: 8px;
|
|
border-style: solid;
|
|
border-color: white transparent transparent transparent;
|
|
} |