UI (mobile): prevent firmware view flicker on touch by disabling hover effects and tap highlight
This commit is contained in:
@@ -3383,3 +3383,47 @@ html {
|
|||||||
padding: 0.3rem;
|
padding: 0.3rem;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* Reduce tap highlight and flicker in firmware view */
|
||||||
|
#firmware-view,
|
||||||
|
.upload-btn,
|
||||||
|
.upload-btn-compact,
|
||||||
|
.deploy-btn,
|
||||||
|
.cap-call-btn,
|
||||||
|
.progress-refresh-btn,
|
||||||
|
.clear-btn,
|
||||||
|
.refresh-btn,
|
||||||
|
.progress-item,
|
||||||
|
.result-item,
|
||||||
|
.file-info {
|
||||||
|
-webkit-tap-highlight-color: transparent;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Disable hover-driven animations/effects on touch devices in firmware view */
|
||||||
|
@media (hover: none) {
|
||||||
|
#firmware-view .upload-btn:hover,
|
||||||
|
#firmware-view .upload-btn-compact:hover,
|
||||||
|
#firmware-view .deploy-btn:hover:not(:disabled),
|
||||||
|
#firmware-view .progress-refresh-btn:hover,
|
||||||
|
#firmware-view .cap-call-btn:hover,
|
||||||
|
#firmware-view .clear-btn:hover,
|
||||||
|
#firmware-view .refresh-btn:hover,
|
||||||
|
#firmware-view .progress-item:hover,
|
||||||
|
#firmware-view .result-item:hover,
|
||||||
|
#firmware-view .firmware-upload-progress:hover,
|
||||||
|
#firmware-view .firmware-upload-results:hover,
|
||||||
|
#firmware-view .file-info:hover {
|
||||||
|
transform: none !important;
|
||||||
|
box-shadow: none !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
#firmware-view .progress-item:hover::before,
|
||||||
|
#firmware-view .result-item:hover::before {
|
||||||
|
opacity: 0 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Prevent shimmer animation on deploy button hover */
|
||||||
|
#firmware-view .deploy-btn:hover:not(:disabled)::before {
|
||||||
|
left: -100% !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
Reference in New Issue
Block a user