ivan / renato

twsa

or grey, he/him
minor, fictionkin

beep boop wip

sorry if it's laggy

 

“ To me, you are my black sorrow. ”

FREE PALESTINE!! https://arab.org/click-to-help/palestine/

remember, being 'neutral' or ignoring their calls for help, is just as bad as being pro isreal.

!!

ivan / renato 1726975427356
0

⠀ ⠀⠀‿︵  Hello Everyone! ☁️ ‿ I’m here to spread this yet again, as I have done on my other socials… Please spread this as much as you can! Please do not forget about it! 🤍🇵🇸 https://rentry.co/yabujin

!!

ivan / renato 1726975439262
0

#profile questions

How did you do that loading animation. Also the pet thing I can only see his head

The only being able to see his head thing is on purpose, he pops up when you tap or hover over him so he doesn’t obstruct view too much

For the loading gif I imported it in my bio using the <img/> tag and gave it an id

And for the css code

#gif-id-name {
    position: absolute;
    bottom: 0rem;
    left: 0rem;
    z-index: 2;
    width: 100%;
    height: 100%;
    opacity: 100%;
    display: inline;
    animation: fade 5s forwards;
    pointer-events: none;
}

@keyframes fade {
    100% { opacity: 0%; display: none; }
}

Do keep in mind that width and height will stretch or squish the gif to fit the screen, it’s intentional as I thought it looked funny if he were to be very squished on mobile and very stretched on pc and/or iPad

#profile questions
ivan / renato 1729037410099
1

OMG your profile is so DOPE!! How’d you get it to be animated like that? It’s so cool :D

Thank you! For the animations I suggest reading up on the css animation property, it's how I animated everything on my profile

An example code I have is below

.profile_avatar {
    animation: float 3s infinite;
}

@keyframes float {
    0% { transform: translateY(-0.5rem); }
    50% { transform: translateY(0rem); }
    100% { transform: translateY(-0.5rem); }
}

.profile_avatar selects only the avatar in your profile card, and animation specifies the name, duration, and timing function of the animation, @keyframes [animation name] specifies which animation you'd like to specify the keyframes of, and the 0%, 50%, and 100% inside are the keyframes which made my profile avatar float
Of course more information about other animation properties are talked about in the w3schools link above so I highly recommend reading it

#profile questions
ivan / renato 1729031705070
1
vania 1723667976889

HOW DID YOU GET THE TRANSPARENT HEADER AND IMAGE BACKGROUND OMG

image background is just like how you would in css, url(imagelink)

and the header is a transparent linear gradient, do note that the gradient will be on other elements with the primary colour, it's not that bothersome on my theme because of how dark everything else is but on lighter themes it'll probably be more noticeable linear-gradient(colour, transparent)

you could also just make the header transparent with rgba(0, 0, 0, 0) ⠀ i hope that by answering this question you will be able to come up with some cool themes _

#profile questions
ivan / renato 1723685119645
1
This profile has published this warning:

Profile might be laggy due to it having looping animations


Press "Continue" if you wish to view this profile.
Cancel

Pressing continue will bring you to the following URL:

Are sure you want to go there?


Continue