e2c00965ac
This CL maps the colors being used in the web app to variables to make it easier to change color palette without having to track color changes across files. Bug: v8:10673 Change-Id: Icf1c53396b8a831367c4ed420931e6233d780a07 Reviewed-on: https://chromium-review.googlesource.com/c/v8/v8/+/2298005 Commit-Queue: Zeynep Cankara <zcankara@google.com> Reviewed-by: Camillo Bruni <cbruni@chromium.org> Cr-Commit-Position: refs/heads/master@{#68864}
87 lines
1.7 KiB
HTML
87 lines
1.7 KiB
HTML
<!-- 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. -->
|
|
|
|
<style>
|
|
@import "./index.css";
|
|
|
|
#fileReader {
|
|
width: 100%;
|
|
height: 100px;
|
|
line-height: 100px;
|
|
text-align: center;
|
|
border-radius: 5px;
|
|
cursor: pointer;
|
|
transition: all 0.5s ease-in-out;
|
|
border: 2px solid var(--primary-color);
|
|
background-color: var(--surface-color);
|
|
}
|
|
|
|
#fileReader.done {
|
|
height: 20px;
|
|
line-height: 20px;
|
|
box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);
|
|
}
|
|
|
|
#fileReader:hover {
|
|
background-color: var(--on-surface-color);
|
|
color: var(--surface-color);
|
|
}
|
|
|
|
.loading #fileReader {
|
|
cursor: wait;
|
|
}
|
|
|
|
#fileReader > input {
|
|
display: none;
|
|
}
|
|
|
|
#loader {
|
|
display: none;
|
|
}
|
|
|
|
.loading #loader {
|
|
display: block;
|
|
position: fixed;
|
|
top: 0px;
|
|
left: 0px;
|
|
width: 100%;
|
|
height: 100%;
|
|
background-color: rgba(255, 255, 255, 0.5);
|
|
}
|
|
|
|
#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>
|
|
|
|
<section id="fileReaderSection">
|
|
<div id="fileReader" 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>
|
|
</section>
|