ext/hyperframes
2
0
Fork 0
mirror of https://github.com/heygen-com/hyperframes.git synced 2026-09-07 01:56:04 +00:00
Code Issues Packages Projects Releases Wiki Activity

style(registry): format mk / yt / hw family HTML with oxfmt

Browse Source 
The contributed HTML predates any oxfmt pass, so format:check failed for
42 files in both the Format and Preflight jobs. All 29 items re-rendered
after formatting and verified against frames — no visual change.
This commit is contained in:
Miguel Angel Simon Sierra
2026-08-01 01:19:58 +02:00
parent f252ec6d99
commit a98c120383
42 changed files with 792 additions and 189 deletions
Download Patch File Download Diff File Expand all files Collapse all files
registry/components/hw-underline/hw-underline.html
Vendored
+74 -17
View File
@@ -81,13 +81,25 @@
<div style="top: 460px">cross this out</div>
<div style="top: 660px">bracket the aside</div>
</div>
<div class="hw-mark" id="hw-un-m1" style="left: 470px; top: 350px; width: 620px; height: 34px">
<div
class="hw-mark"
id="hw-un-m1"
style="left: 470px; top: 350px; width: 620px; height: 34px"
>
<svg viewBox="0 0 620 34"><path></path></svg>
</div>
<div class="hw-mark" id="hw-un-m2" style="left: 470px; top: 500px; width: 480px; height: 34px">
<div
class="hw-mark"
id="hw-un-m2"
style="left: 470px; top: 500px; width: 480px; height: 34px"
>
<svg viewBox="0 0 480 34"><path></path></svg>
</div>
<div class="hw-mark" id="hw-un-m3" style="left: 440px; top: 650px; width: 40px; height: 110px">
<div
class="hw-mark"
id="hw-un-m3"
style="left: 440px; top: 650px; width: 40px; height: 110px"
>
<svg viewBox="0 0 40 110"><path></path></svg>
</div>
<div
@@ -96,7 +108,7 @@
data-start="0"
data-duration="4"
data-track-index="0"
style="position:absolute;width:1px;height:1px;opacity:0;pointer-events:none"
style="position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none"
></div>
</div>
<script>
@@ -148,17 +160,46 @@
var mid = h / 2;
if (style === "bracket") {
return (
"M " + (w * 0.9 + wob(1, 3)) + " " + (2 + wob(2, 3)) +
" Q " + wob(3, 4) + " " + (2 + wob(4)) + " " + (4 + wob(5, 3)) + " " + (h * 0.5 + wob(6)) +
" Q " + wob(7, 4) + " " + (h - 2 + wob(8)) + " " + (w * 0.9 + wob(9, 3)) + " " + (h - 2 + wob(10, 3))
"M " +
(w * 0.9 + wob(1, 3)) +
" " +
(2 + wob(2, 3)) +
" Q " +
wob(3, 4) +
" " +
(2 + wob(4)) +
" " +
(4 + wob(5, 3)) +
" " +
(h * 0.5 + wob(6)) +
" Q " +
wob(7, 4) +
" " +
(h - 2 + wob(8)) +
" " +
(w * 0.9 + wob(9, 3)) +
" " +
(h - 2 + wob(10, 3))
);
}
if (style === "strike") {
return (
"M " + (2 + wob(1, 3)) + " " + (mid + wob(2)) +
" L " + (w - 4 + wob(3, 3)) + " " + (mid - 3 + wob(4)) +
" M " + (w - 10 + wob(5, 4)) + " " + (mid + 7 + wob(6)) +
" L " + (8 + wob(7, 4)) + " " + (mid + 3 + wob(8))
"M " +
(2 + wob(1, 3)) +
" " +
(mid + wob(2)) +
" L " +
(w - 4 + wob(3, 3)) +
" " +
(mid - 3 + wob(4)) +
" M " +
(w - 10 + wob(5, 4)) +
" " +
(mid + 7 + wob(6)) +
" L " +
(8 + wob(7, 4)) +
" " +
(mid + 3 + wob(8))
);
}
/* underline squiggle */
@@ -167,8 +208,14 @@
for (var i = 1; i <= segs; i++) {
var x = (w / segs) * i;
d +=
" Q " + (x - w / segs / 2 + wob(i * 4 + 1, 9)) + " " + (mid + (i % 2 ? -1 : 1) * (9 + wob(i * 4 + 2, 4))) +
" " + x.toFixed(1) + " " + (mid + wob(i * 4 + 3, 4));
" Q " +
(x - w / segs / 2 + wob(i * 4 + 1, 9)) +
" " +
(mid + (i % 2 ? -1 : 1) * (9 + wob(i * 4 + 2, 4))) +
" " +
x.toFixed(1) +
" " +
(mid + wob(i * 4 + 3, 4));
}
return d;
};
@@ -176,16 +223,26 @@
var p = document.querySelector(target + " path");
var len = p.getTotalLength();
gsap.set(p, { strokeDasharray: len, strokeDashoffset: len });
tl.to(p, { strokeDashoffset: 0, duration: dur === undefined ? 0.55 : dur, ease: "power2.inOut" }, at);
tl.to(
p,
{ strokeDashoffset: 0, duration: dur === undefined ? 0.55 : dur, ease: "power2.inOut" },
at,
);
};
window.hwMarkOff = function (tl, target, at) {
tl.to(target, { opacity: 0, duration: 0.3, ease: "power2.in" }, at);
};
// ---- self-preview ----
document.querySelector("#hw-un-m1 path").setAttribute("d", window.hwMarkPath(620, 34, "underline", 4));
document.querySelector("#hw-un-m2 path").setAttribute("d", window.hwMarkPath(480, 34, "strike", 6));
document.querySelector("#hw-un-m3 path").setAttribute("d", window.hwMarkPath(40, 110, "bracket", 8));
document
.querySelector("#hw-un-m1 path")
.setAttribute("d", window.hwMarkPath(620, 34, "underline", 4));
document
.querySelector("#hw-un-m2 path")
.setAttribute("d", window.hwMarkPath(480, 34, "strike", 6));
document
.querySelector("#hw-un-m3 path")
.setAttribute("d", window.hwMarkPath(40, 110, "bracket", 8));
var tl = gsap.timeline({ paused: true });
window.hwMarkOn(tl, "#hw-un-m1", 0.4);
window.hwMarkOn(tl, "#hw-un-m2", 1.0);