AYO/uotp
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Add visual timer

Browse source
This commit is contained in:
Corentin 2023-01-18 17:47:08 +09:00
commit d852740998
2 changed files with 81 additions and 6 deletions
Download patch file Download diff file Expand all files Collapse all files

43
popup.css
View file

@ -77,17 +77,40 @@ h2 {
cursor: pointer;
}
.entry .otp-container {
display: flex;
align-items: center;
}
.entry .otp {
background-color: var(--light-bg-color);
padding: 4px 8px;
border-radius: 5px;
cursor: pointer;
flex-grow: 1;
margin-right: 8px;
}
.entry .otp:hover {
background-color: var(--highlight-bg-color);
}
.entry svg {
width: 1.5em;
height: 1.5em;
transform: rotateY(-180deg) rotateZ(-90deg);
border-radius: 50%;
}
.entry svg circle {
stroke-dasharray: 6.28318px;
stroke-dashoffset: 0;
stroke-width: 100%;
stroke: var(--border-color);
fill: none;
animation: timer1 30s linear 1 forwards;
}
#entry-list .entry {
border-top: 1px solid var(--border-color);
}
@ -169,4 +192,22 @@ h2 {
#store-action img {
height: 2em;
cursor: pointer;
}
}
@keyframes timer0 {
from {
stroke-dashoffset: 0;
}
to {
stroke-dashoffset: 6.28318px;
}
}
@keyframes timer1 {
from {
stroke-dashoffset: 0;
}
to {
stroke-dashoffset: 6.28318px;
}
}