<head>
<link rel="preconnect" href="https://t.co/8t8MB7pqri"><link rel="preconnect" href="https://t.co/adUTzoOJ6n" crossorigin=""><link href="https://t.co/L8m7gXJvjC" rel="stylesheet">
</head>
<head>
<link rel="preconnect" href="https://t.co/8t8MB7pqri">
<link rel="preconnect" href="https://t.co/adUTzoOJ6n" crossorigin>
<link href="https://t.co/zr2TPMBW1q" rel="stylesheet">
</head>
<style>
/ ===== Scrollbar CSS ===== / / Firefox / * {
scrollbar-width: auto;
scrollbar-color: #F4C7D4 #ffffff;
}
/ Chrome, Edge, and Safari /
::-webkit-scrollbar {
width: 10px;
}
::-webkit-scrollbar-thumb {
background-color: #F4C7D4;
border-radius: 4px;
border: 3px double #fff;
}
</style>
<style>

cont { /container! i'd recommed u only change the border eheh /

width: 250px;
height: 250px;
position: relative;
margin-left: auto;
margin-right: auto;
background-image: url('https://t.co/Q9qI24P39n'); background-size: 100% 100%; background-repeat: no-repeat;
box-shadow: inset -15px -15px 15px white, inset 15px 15px 15px white, 15px 15px 15px white, -15px 15px 15px white, 15px -15px 15px white, -15px -15px 15px white;
margin: auto;
}
@media (max-width: 1000px) {

cont { width: 220px; height: 220px;} }

float { / floating text /

position: absolute;
width: 100%;
left: 0;
top: -10px;
text-align: center;
font-family: 'Berkshire Swash', cursive;
font-size:3.5em;
background: linear-gradient(to top, #fff 2%, #F4C7D4 100%);
z-index:1;
-webkit-filter: drop-shadow(0px 0px 3px #FFB0C9);
opacity: 0.9;
-webkit-text-stroke-width: 0.5px;
-webkit-text-stroke-color: #E38DAC; -webkit-background-clip: text;
-webkit-text-fill-color: transparent; animation-name: floating;
animation-duration: 3s;
animation-iteration-count: infinite; animation-timing-function: ease-in-out;
}
@keyframes floating { 0% { transform: translate(0, 0px); } 50% { transform: translate(0, 15px); } 100% { transform: translate(0, -0px); } }

scroll { / scrollbox! u can change this! note: mess around with the 'margin-left' depending on the width or if u change anything of the scrollbox bc it messes a bit / opacity: 0;

position: absolute;
margin-left: 4%;
margin-right: 4%;
width: auto;
top: 80px;
border-radius: 10px;
padding: 10px;
height: 120px;
overflow: scroll;
background: #FFFFFF90;
transition: opacity .35s ease;
/ style of the text inside scrollbox / font-size: 16px;
font-family: 'Quicksand', sans-serif; color: #000;
text-align: center;
}
mark {
background: #F4C7D499;
border: 1px solid #454545;
border-radius: 7px;
padding-left: 5px;
padding-right: 5px;
}

cont:hover #scroll { opacity: 1; }

overlay { / overlay! (blue in this case) (hidden without mouseover) / position: absolute;

bottom: 0;
left: 0;
right: 0;
background: rgba(199, 234, 252, 0); /copy the color of ur choice in rgb! the last digit stands for opacity/ overflow: hidden;
width: 0;
height: 100%;
transition: background 0.5s ease; border-radius: 9px;
}

cont:hover #overlay { / overlay when hovered! (it appears) /

width: 100%;
background: rgba(199, 234, 252, .2); /copy the color of ur choice in rgb! the last digit stands for opacity/
transition: background 0.5s ease-out; }
::selection {
color: white;
background: #E75087;
}
</style>
</div><div id="cont">
<div id="float">Name</div>
<div id="overlay"></div>
<div id="scroll">info info info info<br><br><p><mark>dni</mark> info info info info info info info info info<br><br><p><mark>byf</mark> info info info info info info info info info<br><br><p><mark>intereses</mark> info info info info info info info info info<br><br><p><strong><center>cr tomomigf & crditem</center></strong></p><p></p></div></div>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
<script src="//static.tumblr.com/gtjt4bo/QRmphdsdv/glenplayer02.js"></script><style type="text/css">
/-------MUSIC PLAYER BY GLENTHEMES-------/

glenplayer02 {

display:flex;
z-index:99;
height: 20px;
position:relative;
left:3em;
}

glenplayer02 a {text-decoration:none;}

glenplayer02 > div {

align-self:center;
-webkit-align-self:center;
}
.music-controls {
user-select:none;
-webkit-user-select:none;
width:22px;
font-size:22px;
cursor:pointer;
}
.playy, .pausee {
background: -webkit-linear-gradient(-90deg, #ED98B7 40%, #F4C7D4 65%, #fff 95%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
-webkit-text-stroke: 0.5px #E38DAC;
-webkit-filter: drop-shadow(0px 0px 2px #EB9BB3);
} / color of play & pause buttons /
.pausee {display:none;}
.sonata {
margin-left:10px;
color:#222; / color of music note symbol / }
.labeltext {
margin-left:8px;
font-family:courier new;
font-size:9px;
color:#222; / color of song title / }
</style>
<div id="glenplayer02">
<div class="music-controls" onclick="songstart();">
<div class="playy" style="display: block;">►</div> <div class="pausee" style="display: none;">❚❚</div></div>
<div class="sonata"><img src="https://t.co/aEtB45MiGI"></div>
<div class="labeltext"></div></div>
<audio id="tune" src="https://t.co/jj4XnXZzKk" type="audio"></audio>

Edit

Pub: 20 Jul 2022 17:22 UTC

Views: 274