mylloon.fr/static/js/index.js
2024-09-22 17:02:03 +02:00

72 lines
2.3 KiB
JavaScript

class Tag {
constructor(variant, style = "") {
this.variant = variant;
this.style = style;
}
}
window.addEventListener("load", () => {
const clipping_text = `
display: inline;
background-clip: text;
-webkit-background-clip: text; /* Chromium fix */
color: transparent;
`;
const mono = "font-family: monospace";
const tags = [
new Tag("Comment fonctionne un PC 😵‍💫"),
new Tag("undefined", mono),
new Tag("/api/v1/love", mono),
new Tag("/api/v1/websites", mono),
new Tag("Peak D2 sur Valo 🤡"),
new Tag(
"0x520",
`
background: linear-gradient(to bottom right, red 0%, red 50%, black 50%);
${clipping_text}
text-shadow: 0px 0px 20px light-dark(transparent, var(--font-color));
`
),
new Tag("Nul en CSS", "font-family: 'Comic Sans MS', TSCu_Comic, cursive"),
new Tag("anri k... caterpillar 🐛☝️"),
new Tag(
"Free Ukraine",
`
background: linear-gradient(to bottom, DodgerBlue 57%, gold 43%);
${clipping_text}
text-shadow: 0px 0px 20px light-dark(var(--font-color), transparent);
`
),
new Tag(
"Free Palestine",
`
background: conic-gradient(at 30% 60%, transparent 230deg, red 0, red 310deg, transparent 0),
linear-gradient(to bottom, black 45%, white 45%, white 67%, DarkGreen 67%);
${clipping_text}
text-shadow: 0px 0px 20px var(--font-color);
`
),
new Tag("School hater"),
new Tag("Étudiant"),
new Tag("Rempli de malice"),
new Tag(
"#NouveauFrontPopulaire ✊",
`
background: linear-gradient(to bottom, #4fb26b 0%, #4fb26b 36%, \
#e62e35 36%, #e62e35 50%, \
#feeb25 50%, #feeb25 62%, \
#724e99 62%, #724e99 77%, \
#e73160 77%);
${clipping_text}
text-shadow: 0px 0px 20px light-dark(var(--font-color), transparent);
`
),
new Tag("s/centre/droite/g", mono),
];
const random = Math.round(Math.random() * (tags.length - 1));
const element = document.getElementById("subname");
element.textContent = tags[random].variant;
element.style = tags[random].style;
});