fix css bug

This commit is contained in:
wood chen 2024-12-05 08:58:42 +08:00
parent 1140062afb
commit 7cca4bab95

View File

@ -388,78 +388,78 @@ var metricsTemplate = `
border: 1px solid #ddd; border: 1px solid #ddd;
border-radius: 4px; border-radius: 4px;
} }
+ #statusCodes { #statusCodes {
+ padding: 15px; padding: 15px;
+ background: #f8f9fa; background: #f8f9fa;
+ border-radius: 8px; border-radius: 8px;
+ } }
+
+ .status-row { .status-row {
+ display: flex; display: flex;
+ flex-direction: column; flex-direction: column;
+ gap: 12px; gap: 12px;
+ } }
+
+ .status-labels, .status-values { .status-labels, .status-values {
+ display: flex; display: flex;
+ justify-content: flex-start; justify-content: flex-start;
+ gap: 20px; gap: 20px;
+ } }
+
+ .status-badge { .status-badge {
+ flex: 0 0 auto; flex: 0 0 auto;
+ text-align: center; text-align: center;
+ padding: 4px 12px; padding: 4px 12px;
+ border-radius: 4px; border-radius: 4px;
+ font-size: 12px; font-size: 12px;
+ color: white; color: white;
+ min-width: 60px; min-width: 60px;
+ } }
+
+ .metric-value { .metric-value {
+ flex: 0 0 auto; flex: 0 0 auto;
+ text-align: center; text-align: center;
+ min-width: 60px; min-width: 60px;
+ } }
+ .loading { .loading {
+ position: relative; position: relative;
+ opacity: 0.6; opacity: 0.6;
+ } }
+ .loading::after { .loading::after {
+ content: "加载中..."; content: "加载中...";
+ position: absolute; position: absolute;
+ top: 50%; top: 50%;
+ left: 50%; left: 50%;
+ transform: translate(-50%, -50%); transform: translate(-50%, -50%);
+ background: rgba(255,255,255,0.9); background: rgba(255,255,255,0.9);
+ padding: 10px 20px; padding: 10px 20px;
+ border-radius: 4px; border-radius: 4px;
+ box-shadow: 0 2px 4px rgba(0,0,0,0.1); box-shadow: 0 2px 4px rgba(0,0,0,0.1);
+ } }
+ .error-message { .error-message {
+ position: fixed; position: fixed;
+ top: 20px; top: 20px;
+ right: 20px; right: 20px;
+ background: #dc3545; background: #dc3545;
+ color: white; color: white;
+ padding: 10px 20px; padding: 10px 20px;
+ border-radius: 4px; border-radius: 4px;
+ box-shadow: 0 2px 4px rgba(0,0,0,0.2); box-shadow: 0 2px 4px rgba(0,0,0,0.2);
+ z-index: 1000; z-index: 1000;
+ display: none; display: none;
+ } }
+ .export-btn { .export-btn {
+ padding: 8px 16px; padding: 8px 16px;
+ background: #28a745; background: #28a745;
+ color: white; color: white;
+ border: none; border: none;
+ border-radius: 4px; border-radius: 4px;
+ cursor: pointer; cursor: pointer;
+ transition: all 0.3s; transition: all 0.3s;
+ } }
+ .export-btn:hover { .export-btn:hover {
+ background: #218838; background: #218838;
+ } }
</style> </style>
</head> </head>
<body> <body>