today_ai_weather/app/assets/stylesheets/application.tailwind.css

72 lines
1.3 KiB
CSS
Raw Normal View History

@import "photoswipe/dist/photoswipe.css";
/*@import "leaflet/dist/leaflet.css";*/
@import 'ol/ol.css';
2025-01-19 01:13:59 +08:00
@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;
}