From e666c3d73fddd923cc9615e00f343c06dc743135 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Mart=C3=ADn=20=28Netux=29=20Rodr=C3=ADguez?= Date: Mon, 26 Aug 2024 13:38:38 -0300 Subject: [PATCH 1/2] =?UTF-8?q?add=20netux=20=F0=9F=98=8E?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- lab/login/style.css | 103 ++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 103 insertions(+) diff --git a/lab/login/style.css b/lab/login/style.css index 3f3e0d7a..39aa97bc 100644 --- a/lab/login/style.css +++ b/lab/login/style.css @@ -414,3 +414,106 @@ background-clip: text; color: transparent; } + +/* ===== */ +/* netux */ +/* ===== */ +.name-netux { + position: relative; + content: "netux"; + background: linear-gradient( + to right, + #BE7B00 0%, + #FFA600 50%, + #BE7B00 100% + ); + -webkit-text-fill-color: transparent; + background-clip: text; + text-shadow: 0 0 2px rgba(255, 255, 255, .3); + cursor: pointer; +} + +.name-netux::before, .name-netux::after { + position: absolute; + text-shadow: none; + line-height: 1; + white-space: nowrap; + -webkit-text-fill-color: initial; +} + +@keyframes netux--deal-with-it__hand { + 0% { /* initial position */ + content: "> ⌐■_■"; + clip-path: rect(0% 100% 100% 95%); + left: 0%; + } + 15% { /* take hand with glasses out */ + content: "> ⌐■_■"; + clip-path: rect(0% 100% 100% 0%); + left: 105%; + } + 17% { /* leave a few frames for the hands to fully appear */ + transform: rotateZ(0deg); + } + 40% { /* preparing to throw glasses */ + content: "> ⌐■_■"; + top: 0.4rem; + transform: rotateZ(45deg); + } + 44% { /* up they go */ + content: "> ⌐■_■"; + top: 0.2rem; + transform: rotateZ(-20deg); + left: 105%; + } + 44% { /* glasses no longer in hand */ + content: ">"; + left: 105%; + clip-path: rect(0% 100% 100% -5%); + } + 50% { /* return to rest position */ + left: 105%; + transform: rotateZ(0deg); + clip-path: rect(0% 100% 100% 0%); + } + 60% { + left: 100%; + clip-path: rect(0% 100% 100% 0%); + } + 70% { /* bring hand back in */ + content: ">"; + left: calc(100% - 1ch); + clip-path: rect(0% 100% 100% 100%); + } +} +@keyframes netux--deal-with-it__glasses-fly { + 0% { /* whoop, sunglasses appear in the place where the hands let go of them */ + visibility: visible; + top: -8px; + left: 135%; + transform: rotateZ(-20deg); + } + 50% { /* go up */ + top: -100vh; + transform: rotateZ(calc(-360deg * 10)); + } + 100% { /* go back down, land in style */ + visibility: visible; + top: -1px; + left: -0.25ch; + transform: rotateZ(calc(-360deg * 20)); + } +} + +.name-netux:hover::before { + content: ""; + top: 0.2rem; + transform-origin: 6px 6px; + animation: netux--deal-with-it__hand 3s linear forwards; +} +.name-netux:hover::after { + content: "⌐■_■"; + visibility: hidden; + animation: + netux--deal-with-it__glasses-fly 3s calc(3s * 0.42) linear forwards; +} From fb6f69609675f5de875f885700f8d47b0d8a679d Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Mart=C3=ADn=20=28Netux=29=20Rodr=C3=ADguez?= Date: Fri, 30 Aug 2024 08:34:00 -0300 Subject: [PATCH 2/2] don't deal with it in mentions --- lab/login/style.css | 9 ++++++--- 1 file changed, 6 insertions(+), 3 deletions(-) diff --git a/lab/login/style.css b/lab/login/style.css index 39aa97bc..ab5f504f 100644 --- a/lab/login/style.css +++ b/lab/login/style.css @@ -430,7 +430,6 @@ -webkit-text-fill-color: transparent; background-clip: text; text-shadow: 0 0 2px rgba(255, 255, 255, .3); - cursor: pointer; } .name-netux::before, .name-netux::after { @@ -505,13 +504,17 @@ } } -.name-netux:hover::before { +.name-netux:not(.at) { + cursor: help; +} + +.name-netux:not(.at):hover::before { content: ""; top: 0.2rem; transform-origin: 6px 6px; animation: netux--deal-with-it__hand 3s linear forwards; } -.name-netux:hover::after { +.name-netux:not(.at):hover::after { content: "⌐■_■"; visibility: hidden; animation: