UNPKG

react-insight

Version:

A powerful React performance monitoring component that helps you identify and fix performance issues in your React applications

1 lines 6.45 kB
{"version":3,"sources":["../src/components/PerformanceMonitor.css"],"sourcesContent":[".PerformanceMonitor_container {\n position: fixed;\n bottom: 20px;\n right: 20px;\n z-index: 9999;\n}\n\n.PerformanceMonitor_analyzeButton {\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 10px 20px;\n background-color: #2196F3;\n color: white;\n border: none;\n border-radius: 4px;\n cursor: pointer;\n font-size: 14px;\n font-weight: 500;\n box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);\n transition: all 0.2s ease;\n}\n\n.PerformanceMonitor_analyzeButton:hover {\n background-color: #1976D2;\n box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);\n}\n\n.PerformanceMonitor_analyzeButton:disabled {\n background-color: #BDBDBD;\n cursor: not-allowed;\n}\n\n.PerformanceMonitor_buttonIcon {\n margin-right: 8px;\n font-size: 16px;\n}\n\n.PerformanceMonitor_buttonText {\n white-space: nowrap;\n}\n\n.PerformanceMonitor_popover {\n position: fixed;\n bottom: 80px;\n right: 20px;\n width: 400px;\n max-height: 80vh;\n background-color: white;\n border-radius: 8px;\n box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);\n overflow: hidden;\n z-index: 9999;\n}\n\n.PerformanceMonitor_popoverHeader {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 16px;\n background-color: #f5f5f5;\n border-bottom: 1px solid #e0e0e0;\n}\n\n.PerformanceMonitor_popoverTitle {\n margin: 0;\n font-size: 18px;\n font-weight: 600;\n color: #333;\n}\n\n.PerformanceMonitor_closeButton {\n background: none;\n border: none;\n font-size: 24px;\n color: #666;\n cursor: pointer;\n padding: 0;\n line-height: 1;\n}\n\n.PerformanceMonitor_closeButton:hover {\n color: #333;\n}\n\n.PerformanceMonitor_scoreContainer {\n display: flex;\n justify-content: center;\n padding: 20px;\n background-color: white;\n}\n\n.PerformanceMonitor_scoreCircle {\n width: 120px;\n height: 120px;\n border-radius: 50%;\n display: flex;\n align-items: center;\n justify-content: center;\n position: relative;\n}\n\n.PerformanceMonitor_scoreInner {\n width: 100px;\n height: 100px;\n background-color: white;\n border-radius: 50%;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n}\n\n.PerformanceMonitor_scoreValue {\n font-size: 32px;\n font-weight: 700;\n color: #333;\n}\n\n.PerformanceMonitor_scoreLabel {\n font-size: 14px;\n color: #666;\n}\n\n.PerformanceMonitor_resultsContainer {\n padding: 16px;\n max-height: calc(80vh - 200px);\n overflow-y: auto;\n}\n\n.PerformanceMonitor_goodResult {\n text-align: center;\n padding: 20px;\n background-color: #E8F5E9;\n border-radius: 4px;\n margin-bottom: 16px;\n}\n\n.PerformanceMonitor_goodResult h3 {\n margin: 0 0 8px;\n color: #2E7D32;\n}\n\n.PerformanceMonitor_goodResult p {\n margin: 0;\n color: #1B5E20;\n}\n\n.PerformanceMonitor_resultsTitle {\n margin: 0 0 16px;\n font-size: 16px;\n font-weight: 600;\n color: #333;\n}\n\n.PerformanceMonitor_issueItem {\n background-color: #FFF3E0;\n border-radius: 4px;\n padding: 16px;\n margin-bottom: 12px;\n}\n\n.PerformanceMonitor_issueHeader {\n display: flex;\n align-items: center;\n margin-bottom: 8px;\n}\n\n.PerformanceMonitor_issueIcon {\n margin-right: 8px;\n font-size: 18px;\n}\n\n.PerformanceMonitor_issueHeader h4 {\n margin: 0;\n font-size: 16px;\n font-weight: 600;\n color: #E65100;\n}\n\n.PerformanceMonitor_issueItem p {\n margin: 0 0 8px;\n font-size: 14px;\n color: #333;\n}\n\n.PerformanceMonitor_suggestion {\n font-style: italic;\n color: #666;\n margin-bottom: 0 !important;\n}\n\n@media (max-width: 480px) {\n .PerformanceMonitor_container {\n bottom: 10px;\n right: 10px;\n }\n \n .PerformanceMonitor_analyzeButton {\n padding: 8px 16px;\n font-size: 12px;\n }\n \n .PerformanceMonitor_popover {\n width: calc(100% - 20px);\n bottom: 70px;\n right: 10px;\n }\n \n .PerformanceMonitor_scoreCircle {\n width: 100px;\n height: 100px;\n }\n \n .PerformanceMonitor_scoreInner {\n width: 80px;\n height: 80px;\n }\n \n .PerformanceMonitor_scoreValue {\n font-size: 24px;\n }\n \n .PerformanceMonitor_scoreLabel {\n font-size: 12px;\n }\n} "],"mappings":"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","names":[]}