adrien/quatuor
adrien/quatuor
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Compare commits

base: adrien:b25ed692dbed48ca3d42eb4f276d60b72764e0cc
Branches Tags
adrien:master
..
compare: adrien:f012a8f74b8065bdd3091209af2c4edd9c59fe6c
Branches Tags
adrien:master

No commits in common. "b25ed692dbed48ca3d42eb4f276d60b72764e0cc" and "f012a8f74b8065bdd3091209af2c4edd9c59fe6c" have entirely different histories.
b25ed692db ... f012a8f74b

2 changed files with 6 additions and 11 deletions
Show Stats Expand all files Collapse all files

15
css/common.css
View File

@ -106,21 +106,16 @@ span {
} }
50% { 50% {
opacity: 100%; opacity: 100%;
transform: translateY(0) scaleY(1); transform: translateY(0);
line-height: var(--bs-body-line-height);
} }
to { to {
opacity: 0; opacity: 0;
transform: translateY(-100%) scaleY(0); transform: translateY(-100%);
line-height: 0;
} }
} }
div.show-level-animation { div.show-level-animation {
animation: show-level-animation; animation: show-level-animation cubic-bezier(0.4, 0, 0.6, 1) 2s 1s;
animation-timing-function: (0.4, 0, 0.6, 1);
animation-duration: 2s;
animation-delay: 1s;
} }
@keyframes zoom-in-animation { @keyframes zoom-in-animation {
@ -172,12 +167,12 @@ div.show-level-animation {
#messagesSpan div.rotate-in-animation { #messagesSpan div.rotate-in-animation {
animation-name: rotate-in-animation; animation-name: rotate-in-animation;
animation-timing-function: cubic-bezier(.25,.46,.45,.94); animation-timing-function: cubic-bezier(.25,.46,.45,.94);
animation-duration: 1s; animation-duration: 1.5s;
} }
#messagesSpan div.zoom-in-animation { #messagesSpan div.zoom-in-animation {
animation-name: zoom-in-animation; animation-name: zoom-in-animation;
animation-timing-function: cubic-bezier(.25,.46,.45,.94); animation-timing-function: cubic-bezier(.25,.46,.45,.94);
transform-origin:center; transform-origin:center;
animation-duration: 1s; animation-duration: 1.5s;
} }

2
index.html
View File

@ -83,7 +83,7 @@
</div> </div>
<div class="col-sm-3"> <div class="col-sm-3">
<output id="dasOutput" class="form-text form-text-sm w-100 m-auto text-center" for="dasInput">180 ms</output> <output id="dasOutput" class="form-text form-text-sm w-100 m-auto text-center" for="dasInput">180 ms</output>
<input name="das" id="dasInput" type="range" class="form-range h-100" value="180" min="100" max="500" step="5" oninput="dasOutput.value = value + ' ms'"> <input name="das" id="dasInput" type="range" class="form-range h-100" value="180" min="100" max="500" step="10" oninput="dasOutput.value = value + ' ms'">
</div> </div>
<label for="dasInput" class="col-sm-3 col-form-label" title="Delayed AutoShift : délai initial avant répétition">DAS</label> <label for="dasInput" class="col-sm-3 col-form-label" title="Delayed AutoShift : délai initial avant répétition">DAS</label>
</fieldset> </fieldset>