added blog cursor(thanks to hyprplex

5 files changed, 55 insertions, 8 deletions

diff --git a/dest/css/ghrepo.css b/dest/css/ghrepo.css
index 8b1efd39..1d58fd1d 100644
--- a/dest/css/ghrepo.css
+++ b/dest/css/ghrepo.css
@@ -1 +1 @@
-html{--text:#e5e5e5;--accent:#1688f0;--bg-main:#000;--bg-repo:#0f0f1a;--bg-user:#0a0a0f;--purple:#7b1fa2;--violet:#673ab7;--pink:#f48fb1;--light-yellow:#ffc;--pale-yellow:#ff9;--lemon-yellow:#fffacd}*{background:transparent;box-sizing:border-box}a,div,p,span{transition:transform .3s,scale .3s}body{font-family:Open Sans,sans-serif;margin:(3em) 0 0}main{margin-top:3em}.bgWrap{background-color:#303c64;background-image:url(/images/heigh-grass.jpg),url(/images/heigh-grass.webp);background-position:50%;background-repeat:no-repeat;background-size:cover;color:#f4e8c1;font-size:16px;height:100%;left:0;margin:0;overflow:hidden;padding:0;top:0;width:100%;z-index:-1}.bgWrap,.container{align-items:center;display:flex;justify-content:center}.container{flex-direction:row;flex-wrap:wrap;max-width:1280px;position:center;width:90%}.container small,h1{background:transparent}.hide{animation-duration:.5s!important;animation-fill-mode:forwards!important;animation-name:fadeOut!important;position:absolute;transition:all .5s}.unHide{animation-duration:.5s!important;animation-fill-mode:forwards!important;animation-name:fadeIn!important}h1{color:var(--accent);margin-bottom:4px}small{display:block;margin-bottom:20px}h2,small{text-align:center;width:100%}h2{color:var(--text);margin:0}a{background:transparent;color:var(--accent);text-decoration:none;-webkit-transition:background .5s;transition:background .5s}.github-img{margin-right:8px;width:45px}ul{list-style:none;padding:0}.user-info,.user-info *{background:transparent}.user-info{background-position:50%;background-repeat:no-repeat;background-size:cover;border-radius:16px;color:var(--text);display:flex;flex-wrap:wrap;font-size:18px;justify-content:center;padding:2em}.user-info figure{background:transparent;max-width:250px;width:90%}.user-info img{border:2px solid var(--accent);border-radius:100%;box-shadow:0 0 6px var(--accent),0 0 6px var(--accent);box-shadow:0 0 10mm rgba(0,0,0,.7);height:auto;max-width:100%;transition:transform .3s,border-radius .5s}.user-info img:hover{border-radius:5%;transition:transform .3s,border-radius .5s}.user-info img:hover{box-shadow:0 0 100mm rgba(255,238,16,.7);transform:scale(1.1)}.user-info div{align-items:center;display:flex;flex-wrap:wrap;padding-left:5%;text-align:center;width:100%}.user-info div p{background:transparent;border-bottom:1px solid var(--text);margin:0;padding:0 0 18px;width:100%}.user-info :hover{transform:scale(1.1);transition:transform .3s}.user-info .usertitle{font-family:audiowide;font-size:2vw;text-transform:uppercase}.filter-repos,input{background:#0a0a0f;background:rgba(10,10,15,.3);border:2px solid var(--accent);border-radius:20px;box-shadow:0 0 10mm rgba(0,0,0,.7);margin-bottom:1em;margin-top:1em;min-width:300px;padding:1em;text-align:center;-webkit-transition:all .5s;transition:all .5s;width:50%}.filter-repos:hover,input:hover{-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);box-shadow:0 0 50mm rgba(0,0,0,.7);transform:scale(1.1);transition:all .5s}.filter-repos:active,input:active{background:#f4e8c1;background:hsla(46,70%,86%,.3);box-shadow:0 0 10mm rgba(0,0,0,.7)}.repos{background:grey;background:hsla(0,0%,50%,.2);border-radius:16px;display:flex;flex-wrap:wrap;justify-content:center;margin-bottom:4em;margin-top:0;padding:2em;transition:transform .3s,background-color .5s}.repos:hover{background:#000;background:rgba(0,0,0,.3);transition:transform .5s,background-color .5s}.repo-title{color:var(--accent);font-weight:700;margin:4px;text-align:center;width:100%}.repo-list{align-items:flex-start;display:flex;flex-wrap:wrap;justify-content:center;scroll-snap-type:y mandatory}.repo-list,.repo-list li{background:transparent;width:100%}.repo-list li{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid var(--accent);border-radius:16px;margin:1em 0;min-height:180px;padding:1em;scroll-snap-align:center;text-align:center;-webkit-transition:all .5s;transition:all .5s}.repo-list h3,span{background:transparent}.repo:hover{background:#000;background:rgba(0,0,0,.5);border-radius:10px;box-shadow:0 0 50mm rgba(255,238,16,.7);transform:scale(1.05);transition:background .5s,transform 1s,boarder 1.5s,all .3s}.repo-list:hover:has(li:hover) li:not(:hover,.hide){animation-duration:.5s;background:#000;background:rgba(0,0,0,.3);transform:scale(.95);transition:background .5s,transform 1s,all .3s}.link-btn{background:grey;background:hsla(0,0%,50%,.1);border:2px solid var(--accent);border-radius:30px;color:var(--text);padding:10px 20px;-webkit-transition:background .5s,transform .5s,border .5s,all .5s;transition:background .5s,transform .5s,border .5,all .3s}.link-btn:hover{background:#1688f0;background:rgba(22,136,240,.5);border:2px solid var(--text);border-radius:16px;box-shadow:0 0 50mm rgba(0,156,255,.7);transform:scale(1.1);-webkit-transition:background .5s,transform .5s,border .5s,all .5s;transition:background .5s,transform .5s,border .5s,all .5s}.repo-list p{background:transparent;margin:.5em 0;padding:0 .5em}.intro:hover,.user-info:hover{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);transform:scale(1.1)}.intro{perspective:1000px;transform-style:preserve-3d}.user-info{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:grey;background:hsla(0,0%,50%,.2)}.floattext{transform:translateZ(200px)}.repo{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);box-shadow:0 0 10mm rgba(0,0,0,.7);overflow:auto;overflow-x:hidden;transition:all .3s}.rdescription{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden}.rdescription:hover{-webkit-line-clamp:unset}@media (min-width:700px){.user-info div{background:transparent;text-align:left;width:45%}.user-info div p{margin:10px}.repo-list{justify-content:space-around}.repo-list li{margin:2% 1.5%;width:48%}}@media (min-width:1200px){.repo-list li{width:30%}}
\ No newline at end of file
+html{--text:#e5e5e5;--accent:#1688f0;--bg-main:#000;--bg-repo:#0f0f1a;--bg-user:#0a0a0f;--purple:#7b1fa2;--violet:#673ab7;--pink:#f48fb1;--light-yellow:#ffc;--pale-yellow:#ff9;--lemon-yellow:#fffacd}*{background:transparent;box-sizing:border-box}a,div,p,span{transition:transform .3s,scale .3s}body{font-family:Open Sans,sans-serif;margin:(3em) 0 0}main{margin-top:3em}.bgWrap{background-color:#303c64;background-color:#05010d;background-position:50%;background-repeat:no-repeat;background-size:cover;color:#f4e8c1;font-size:16px;height:100%;left:0;margin:0;overflow:hidden;padding:0;top:0;width:100%;z-index:-1}.bgWrap,.container{align-items:center;display:flex;justify-content:center}.container{flex-direction:row;flex-wrap:wrap;max-width:1280px;position:center;width:90%}.container small,h1{background:transparent}.hide{animation-duration:.5s!important;animation-fill-mode:forwards!important;animation-name:fadeOut!important;position:absolute;transition:all .5s}.unHide{animation-duration:.5s!important;animation-fill-mode:forwards!important;animation-name:fadeIn!important}h1{color:var(--accent);margin-bottom:4px}small{display:block;margin-bottom:20px}h2,small{text-align:center;width:100%}h2{color:var(--text);margin:0}a{background:transparent;color:var(--accent);text-decoration:none;-webkit-transition:all .5s;transition:all .5s}.github-img{margin-right:8px;width:45px}ul{list-style:none;padding:0}.user-info,.user-info *{background:transparent}.user-info{background-position:50%;background-repeat:no-repeat;background-size:cover;border-radius:16px;color:var(--text);display:flex;flex-wrap:wrap;font-size:18px;justify-content:center;padding:2em}.user-info figure{background:transparent;max-width:250px;width:90%}.user-info img{border:2px solid var(--accent);border-radius:100%;box-shadow:0 0 6px var(--accent),0 0 6px var(--accent);box-shadow:0 0 10mm rgba(0,0,0,.7);height:auto;max-width:100%;transition:transform .3s,border-radius .5s}.user-info img:hover{border-radius:5%;transition:transform .3s,border-radius .5s}.user-info img:hover{box-shadow:0 0 100mm rgba(255,238,16,.7);transform:scale(1.1)}.user-info div{align-items:center;display:flex;flex-wrap:wrap;padding-left:5%;text-align:center;width:100%}.user-info div p{background:transparent;border-bottom:1px solid var(--text);margin:0;padding:0 0 18px;width:100%}.user-info :hover{transform:scale(1.1);transition:transform .3s}.user-info .usertitle{font-family:audiowide;font-size:2vw;text-transform:uppercase}.filter-repos,input{background:#0a0a0f;background:rgba(10,10,15,.3);border:2px solid var(--accent);border-radius:20px;box-shadow:0 0 10mm rgba(0,0,0,.7);margin-bottom:1em;margin-top:1em;min-width:300px;padding:1em;text-align:center;-webkit-transition:all .5s;transition:all .5s;width:50%}.filter-repos:hover,input:hover{-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);box-shadow:0 0 50mm rgba(0,0,0,.7);transform:scale(1.1);transition:all .5s}.filter-repos:active,input:active{background:#f4e8c1;background:hsla(46,70%,86%,.3);box-shadow:0 0 10mm rgba(0,0,0,.7)}.repos{border-radius:16px;display:flex;flex-wrap:wrap;justify-content:center;margin-bottom:4em;margin-top:0;padding:2em;transition:transform .3s,background-color .5s}.repos:hover{background:#000;background:rgba(0,0,0,.3);transition:transform .5s,background-color .5s}.repo-title{color:var(--accent);font-weight:700;margin:4px;text-align:center;width:100%}.repo-list{align-items:flex-start;display:flex;flex-wrap:wrap;justify-content:center;scroll-snap-type:y mandatory}.repo-list,.repo-list li{background:transparent;width:100%}.repo-list li{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid var(--accent);border-radius:16px;margin:1em 0;min-height:180px;padding:1em;scroll-snap-align:center;text-align:center;-webkit-transition:all .5s;transition:all .5s}.repo-list h3,span{background:transparent}.repo:hover{background:#000;background:rgba(0,0,0,.5);border-radius:10px;box-shadow:0 0 50mm rgba(255,238,16,.7);transform:scale(1.05);transition:background .5s,transform 1s,boarder 1.5s,all .3s}.repo-list:hover:has(li:hover) li:not(:hover,.hide){animation-duration:.5s;background:#000;background:rgba(0,0,0,.3);transform:scale(.95);transition:background .5s,transform 1s,all .3s}.link-btn{background:grey;background:hsla(0,0%,50%,.1);border:2px solid var(--accent);border-radius:30px;color:var(--text);padding:10px 20px;-webkit-transition:background .5s,transform .5s,border .5s,all .5s;transition:background .5s,transform .5s,border .5,all .3s}.link-btn:hover{background:#1688f0;background:rgba(22,136,240,.5);border:2px solid var(--text);border-radius:16px;box-shadow:0 0 50mm rgba(0,156,255,.7);transform:scale(1.1);-webkit-transition:background .5s,transform .5s,border .5s,all .5s;transition:background .5s,transform .5s,border .5s,all .5s}.repo-list p{background:transparent;margin:.5em 0;padding:0 .5em}.intro:hover,.user-info:hover{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);transform:scale(1.1)}.intro{perspective:1000px;transform-style:preserve-3d}.user-info{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);border:2px solid #fff}.floattext{transform:translateZ(200px)}.repo{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);box-shadow:0 0 10mm rgba(0,0,0,.7);overflow:auto;overflow-x:hidden;transition:all .3s}.rdescription{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden}.rdescription:hover{-webkit-line-clamp:unset}@media (min-width:700px){.user-info div{background:transparent;text-align:left;width:45%}.user-info div p{margin:10px}.repo-list{justify-content:space-around}.repo-list li{margin:2% 1.5%;width:48%}}@media (min-width:1200px){.repo-list li{width:30%}}
\ No newline at end of file
diff --git a/pages/repo/github/repos.html b/pages/repo/github/repos.html
index 9146266a..04b66336 100644
--- a/pages/repo/github/repos.html
+++ b/pages/repo/github/repos.html
@@ -39,11 +39,13 @@
                         id="repo-list"></ul>
                 </section>
             </main>
+            <div class="sblob"></div>
         </div>
         <script defer src="/dest/js/tilt.js"></script>
         <script defer src="/dest/js/tilt.conf.noglare.js"></script>
         <script src="/dest/js/header.js"></script>
         <script src="/dest/js/hacktype.js"></script>
+        <script src="/dest/js/mouseblob.js"></script>
     </body>
 
 </html>
diff --git a/src/css/ghrepo.css b/src/css/ghrepo.css
index 2a2c621b..6f7a4966 100644
--- a/src/css/ghrepo.css
+++ b/src/css/ghrepo.css
@@ -54,7 +54,8 @@ main {
     width: 100%;
     height: 100%;
     background-color: rgb(48, 60, 100);
-    background-image: url(/images/heigh-grass.jpg), url(/images/heigh-grass.webp);
+    /* background-image: url(/images/heigh-grass.jpg), url(/images/heigh-grass.webp); */
+    background-color: #05010d;
     background-position: center;
     background-repeat: no-repeat;
     background-size: cover;
@@ -120,8 +121,8 @@ a {
     background: transparent;
     color: var(--accent);
     text-decoration: none;
-    -webkit-transition: background 0.5s;
-    transition: background 0.5s
+    -webkit-transition: all 0.5s;
+    transition: all 0.5s
 }
 
 .github-img {
@@ -135,7 +136,7 @@ ul {
 }
 
 .user-info * {
-background: transparent;
+    background: transparent;
 }
 
 .user-info {
@@ -248,7 +249,7 @@ input:active,
     display: flex;
     flex-wrap: wrap;
     justify-content: center;
-    background: rgba(128, 128, 128, 0.2);
+    /* background: rgba(128, 128, 128, 0.2); */
     margin-top: 0;
     padding: 2em;
     /* border-bottom-left-radius: 20px; */
@@ -369,10 +370,11 @@ input:active,
 
 .user-info {
     /* background: transparent; */
-    background: rgba(128, 128, 128, 0.2);
+    /* background: rgba(128, 128, 128, 0.2); */
     -webkit-backdrop-filter: blur(2px);
     backdrop-filter: blur(2px);
     /* box-shadow: 0 0 10mm rgba(0,0,0,.7); */
+    border: 2px solid rgb(255, 255, 255)
 }
 
 .floattext {
diff --git a/src/css/style.css b/src/css/style.css
index 7a75bc53..cd9a6abe 100644
--- a/src/css/style.css
+++ b/src/css/style.css
@@ -41,6 +41,8 @@ src: url(/fonts/audiowide.ttf);
     margin: 0;
     font-family: liga;
     text-shadow: 0px 0px 1px black;
+    -webkit-font-smoothing: antialiased;
+    font-smooth: antialiased;
     /* transition: all 0.3s; */
 }
 
@@ -407,4 +409,36 @@ a:hover {
     width: 20vmax;
     z-index: 0;
     animation-fill-mode: forwards;
-}
\ No newline at end of file
+}
+
+@keyframes rotate {
+    from {
+        rotate: 0deg;
+    }
+    
+    50% {
+        scale: 1 1.25;
+    }
+    
+    to {
+        rotate: 360deg;
+    }
+}
+
+.sblob {
+    background-color: white;
+    height: 15vmax;
+    width: 20vmax;
+    aspect-ratio: 1;
+    position: absolute;
+    left: 50%;
+    top: 50%;
+    translate: -50% -50%;
+    border-radius: 50%;
+    background: linear-gradient(to right, #00FFFF, mediumpurple);
+    animation: rotate 20s infinite;
+    opacity: 0.8;
+    filter: blur(7vmax);
+    -webkit-filter: blur(7vmax);
+    z-index: -1;
+}
diff --git a/src/js/mouseblob.js b/src/js/mouseblob.js
new file mode 100644
index 00000000..f2e954d3
--- /dev/null
+++ b/src/js/mouseblob.js
@@ -0,0 +1,9 @@
+const blob = document.querySelector('.sblob');
+
+window.onpointermove = event => { 
+    const { clientX, clientY } = event;
+    blob.animate({
+        left: `${clientX}px`,
+        top: `${clientY}px`
+    }, { duration: 1000, fill: "forwards" });
+}