<!-- Copyright 2020 the V8 project authors. All rights reserved. Use of this source code is governed by a BSD-style license that can be found in the LICENSE file. --> <head> <link href="./index.css" rel="stylesheet"> </head> <style> #fileReader { height: 100px; line-height: 100px; text-align: center; cursor: pointer; transition: all 0.5s ease-in-out; background-color: var(--surface-color); } #fileReader:hover { background-color: var(--primary-color); color: var(--on-primary-color); } .done #fileReader{ height: 20px; line-height: 20px; } .fail #fileReader { background-color: var(--error-color); } .loading #fileReader { cursor: wait; } #fileReader>input { display: none; } #loader { display: none; } .loading #loader { display: block; position: fixed; z-index: 9999; top: 0px; left: 0px; width: 100%; height: 100%; background-color: var(--file-reader-background-color); } #spinner { position: absolute; width: 100px; height: 100px; top: 40%; left: 50%; margin-left: -50px; border: 30px solid var(--surface-color); border-top: 30px solid var(--primary-color); border-radius: 50%; animation: spin 1s ease-in-out infinite; } @keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } </style> <div id="root"> <div id="fileReader" class="panel" tabindex=1> <span id="label"> Drag and drop a v8.log file into this area, or click to choose from disk. </span> <input id="file" type="file" name="file"> </div> <div id="loader"> <div id="spinner"></div> </div> </div>