WPD-CSS-STUFF/users/G.css

669 lines
19 KiB
CSS

/* Set the font size of the .srd class to 0 to hide original text */
.srd {
font-size: 0 !important; /* Hide any text in elements with the class .srd */
}
/* Define the animation for the before pseudo-element of .srd */
.srd:before {
animation: vaporeon-owo 8s linear normal forwards; /* Apply the vaporeon-owo animation for 8 seconds */
animation-iteration-count: 1; /* Play the animation only once */
content: ""; /* Set content to an empty string to ensure it renders */
}
/* Define the animation for the after pseudo-element of .srd */
.srd:after {
animation: flicker 0.8s linear alternate forwards; /* Apply flicker animation for 0.8 seconds */
animation-iteration-count: 12; /* Play the flicker animation 12 times */
content: "|"; /* Set the content to a vertical bar */
}
/* Define the flicker animation to create a blinking effect */
@keyframes flicker {
0% {
filter: opacity(0);
} /* Start with the element fully transparent */
100% {
filter: opacity(1);
} /* End with the element fully visible */
}
/* Define the 'vaporeon-owo' animation to progressively reveal a sentence */
@keyframes vaporeon-owo {
0% {
content: " ";
} /* Start with a blank space */
2% {
content: "I";
} /* Add the letter 'I' */
4% {
content: "I ";
} /* Add a space after 'I' */
6% {
content: "I c";
} /* Add 'c' */
8% {
content: "I ca";
} /* Add 'a' */
10% {
content: "I can";
} /* Complete the phrase 'I can' */
12% {
content: "I can ";
} /* Add a space after 'can' */
14% {
content: "I can s";
} /* Add 's' */
16% {
content: "I can se";
} /* Add 'e' */
18% {
content: "I can see";
} /* Complete the phrase 'I can see' */
20% {
content: "I can see ";
} /* Add a space */
22% {
content: "I can see t";
} /* Add 't' */
24% {
content: "I can see th";
} /* Add 'h' */
26% {
content: "I can see the";
} /* Complete 'the' */
28% {
content: "I can see the ";
} /* Add a space */
30% {
content: "I can see the e";
} /* Add 'e' */
32% {
content: "I can see the en";
} /* Add 'n' */
34% {
content: "I can see the ener";
} /* Add 'e' */
36% {
content: "I can see the energ";
} /* Add 'g' */
38% {
content: "I can see the energy";
} /* Complete 'energy' */
40% {
content: "I can see the energy ";
} /* Add a space */
42% {
content: "I can see the energy f";
} /* Add 'f' */
44% {
content: "I can see the energy fl";
} /* Add 'l' */
46% {
content: "I can see the energy flo";
} /* Add 'o' */
48% {
content: "I can see the energy flow";
} /* Complete 'flow' */
50% {
content: "I can see the energy flowing";
} /* Complete 'flowing' */
52% {
content: "I can see the energy flowing ";
} /* Add a space */
54% {
content: "I can see the energy flowing t";
} /* Add 't' */
56% {
content: "I can see the energy flowing th";
} /* Add 'h' */
58% {
content: "I can see the energy flowing thr";
} /* Add 'r' */
60% {
content: "I can see the energy flowing thro";
} /* Add 'o' */
62% {
content: "I can see the energy flowing throu";
} /* Add 'u' */
64% {
content: "I can see the energy flowing throug";
} /* Add 'g' */
66% {
content: "I can see the energy flowing through";
} /* Complete 'through' */
68% {
content: "I can see the energy flowing through ";
} /* Add a space */
70% {
content: "I can see the energy flowing through e";
} /* Add 'e' */
72% {
content: "I can see the energy flowing through ev";
} /* Add 'v' */
74% {
content: "I can see the energy flowing through eve";
} /* Add 'e' */
76% {
content: "I can see the energy flowing through ever";
} /* Add 'r' */
78% {
content: "I can see the energy flowing through every";
} /* Add 'y' */
80% {
content: "I can see the energy flowing through everyt";
} /* Add 't' */
82% {
content: "I can see the energy flowing through everyth";
} /* Add 'h' */
84% {
content: "I can see the energy flowing through everythi";
} /* Add 'i' */
86% {
content: "I can see the energy flowing through everythin";
} /* Add 'n' */
88% {
content: "I can see the energy flowing through everything";
} /* Complete 'everything' */
90% {
content: "I can see the energy flowing through everything ";
} /* Add a space */
92% {
content: "I can see the energy flowing through everything m";
} /* Add 'm' */
94% {
content: "I can see the energy flowing through everything ma";
} /* Add 'a' */
96% {
content: "I can see the energy flowing through everything man";
} /* Add 'n' */
100% {
content: "I can see the energy flowing through everything man!";
} /* Complete the sentence with an exclamation mark */
}
/* Apply styles for screens that are 768px or wider */
@media (min-width: 768px) {
.srd:after,
.srd:before {
font-size: 16px; /* Set font size to 16px for pseudo-elements on larger screens */
}
}
/* Apply styles for screens that are smaller than 768px */
@media (max-width: 768px) {
.srd:after,
.srd:before {
font-size: 11.5px; /* Set font size to 11.5px for pseudo-elements on smaller screens */
}
}
/* Gradient text for multiple elements */
a,
p,
i,
h1,
h2,
h3,
h4,
h5,
h6,
li,
.btn,
.dropdown-menu,
.navbar-light,
.navbar-dark,
.navbar button {
background-image: linear-gradient(
120deg,
#FF0000,
#FFFF00,
#00FF00
) !important;
background-clip: text !important;
color: #0000 !important; /* Make text invisible but preserve the gradient */
}
/* Gradient background for srd */
.srd {
background-image: linear-gradient(
120deg,
#FF0000,
#FFFF00,
#00FF00
) !important;
}
/* Blur and background color for navbar */
#navbar {
backdrop-filter: blur(5px) !important;
background-color: #00FF00 !important;
}
/* Custom header icon */
#header--icon {
content: url(https://files.catbox.moe/v6zgao.webp) !important;
}
/* Hue rotation for logo */
#logo-WPD {
filter: hue-rotate(120deg) !important;
}
/* Custom dropdown menu width */
.dropdown-menu {
width: 230px !important;
}
/* Jumbotron styling with animation */
.jumbotron {
margin: 50px !important;
background-image: url(https://pomf2.lain.la/f/vsq9d7zf.webp) !important;
background-size: cover !important;
background-attachment: fixed !important;
background-position: center !important;
animation: sway 3s ease-in-out infinite alternate !important;
border-image: linear-gradient(45deg, #FF0000, #FFFF00, #00FF00) 1 !important;
border: 5px solid;
}
/* Define the 'sway' animation to create a slight back-and-forth rotation effect */
@keyframes sway {
0% {
transform: rotate(-0.3deg); /* Start by rotating slightly to the left */
}
100% {
transform: rotate(0.3deg); /* End by rotating slightly to the right */
}
}
/* Background for columns and rows */
.col,
div.row {
background: #0005 !important;
}
/* Custom borders for various elements */
.form-control,
.btn,
.navbar-nav,
.navbar,
#profile--groups,
#profile--awards,
#profile-mobile--groups,
#profile-mobile--awards,
#header,
#fixed-bar-mobile,
hr {
border-image: linear-gradient(120deg, #FF0000, #FFFF00, #00FF00) 1 !important;
border: 2px solid;
}
/* Hide comments from specific users */
div[id^="comment-"]:has(.user-info a[href="/@Mujahh"]) {
display: none !important; /* Hides comments from these users */
}
/* Hide the original TrueScore text by setting the font size to 0 */
p#profile--info--truescore,
p#profile-mobile--info--truescore {
font-size: 0 !important;
}
/* Display a fake TrueScore value after the original element, with a font size of 14px */
p#profile--info--truescore:after,
p#profile-mobile--info--truescore:after {
content: "True score: 999999999" !important; /* Set the fake TrueScore text */
font-size: 14px !important; /* Set the font size for the fake TrueScore */
}
/* Change the cursor to text when hovering over the fake TrueScore */
p#profile--info--truescore:hover:after,
p#profile-mobile--info--truescore:hover:after {
cursor: text !important; /* Set cursor to indicate text interaction */
}
/* Hide the original joined date text for desktop */
#profile--joined {
font-size: 0 !important; /* Hide the original text */
position: relative; /* Set position relative to allow absolute positioning of the tooltip */
}
/* Add the new joined date text for desktop */
#profile--joined:after {
content: "Joined April 25, 2022" !important; /* New date text */
font-size: 14px !important; /* Font size for the new text */
}
/* Tooltip styling for hover (desktop version, resembling mobile) */
#profile--joined:hover::before {
content: "Apr 25, 2022, 07:27 PM CDT" !important; /* Full date and time only */
font-size: 10px !important; /* Ensure tooltip font size is 14px */
background-color: rgba(
0,
0,
0,
0.7
); /* Transparent black background for better visibility */
color: white; /* Text color for the tooltip */
padding: 8px; /* Increased padding for a larger box */
border-radius: 4px; /* Rounded corners for the tooltip */
position: absolute; /* Position it above the text */
bottom: calc(
100% + 5px
); /* Move the tooltip down by 5px from the element */
left: 50%; /* Center it horizontally */
transform: translateX(-50%); /* Adjust to center */
white-space: nowrap; /* Prevent line breaks */
z-index: 10; /* Ensure it appears above other elements */
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.5); /* Black shadow for better depth */
}
/* Mobile-specific styles */
/* Hide the original joined date text for mobile */
#profile-mobile--joined {
font-size: 0 !important; /* Hide the original text on mobile */
position: relative; /* Set position relative to allow absolute positioning of the tooltip */
}
/* Add the new joined date text for mobile */
#profile-mobile--joined:after {
content: "Joined April 25, 2022" !important; /* New date text */
font-size: 14px !important; /* Font size for the new text */
}
/* Tooltip styling for hover on mobile */
#profile-mobile--joined:hover::before {
content: "Apr 25, 2022, 07:27 PM CDT" !important; /* Full date and time only */
font-size: 10px !important; /* Ensure tooltip font size is 14px */
background-color: rgba(0, 0, 0, 0.7); /* Transparent black background */
color: white; /* Text color for the tooltip */
padding: 8px; /* Increased padding for a larger box */
border-radius: 4px; /* Rounded corners for the tooltip */
position: absolute; /* Position it above the text */
bottom: calc(
100% + 5px
); /* Move the tooltip down by 5px from the element */
left: 50%; /* Center it horizontally */
transform: translateX(-50%); /* Adjust to center */
white-space: nowrap; /* Prevent line breaks */
z-index: 10; /* Ensure it appears above other elements */
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.5); /* Black shadow for better depth */
}
/* Change the image for elements with alt text 'marseybux' */
img[alt="marseybux"] {
content: url(https://files.catbox.moe/gisi9r.webp) !important;
width: auto !important;
}
/* Change the image for elements with alt text 'coins' */
img[alt="coins"] {
content: url(https://files.catbox.moe/ghgknm.webp) !important;
width: auto !important;
}
/* Hide the original button text by setting the font size to 0 and add an animation */
button#button-sub.btn.btn-primary,
#button-sub2 {
font-size: 0px; /* Make the original text invisible by setting font size to 0 */
animation: party 2s infinite alternate linear !important; /* Apply an infinite animation named 'party' with a 2-second duration, alternating between keyframes */
}
/* Add a custom text "become a G" after the specified buttons */
button#button-sub.btn.btn-primary:after,
#button-sub2:after {
font-size: 14.5px; /* Set font size for the custom text */
content: "become a G"; /* The custom text to display after the buttons */
}
/* Hide all elements with the class 'btn-danger' */
button.btn.btn-danger {
display: none !important; /* Ensure the button is not displayed */
}
/* Hide specific elements with the ID 'button-unsub' and 'button-unsub2', including those with additional classes */
button#button-unsub,
button#button-unsub.btn.btn-secondary,
#button-unsub2 {
display: none !important; /* Ensure these buttons are not displayed */
}
/* Apply an animation to links with specific href values */
a[href="/!stabbing"],
a[href="/!britbongers"] {
animation: party 2s infinite alternate linear !important; /* Apply the 'party' animation to these links */
}
/* Cognacc Comment Change */
#comment-text-4287820 {
visibility: hidden;
}
/* Cognacc Comment Change */
#comment-text-4287820::before {
content: "I love you Klez, I want you inside of me. Everyday I think about you and touch myself, please come over, and don't make me wait for too long";
visibility: visible;
}
/* NorfFC_4Ever Comment Change */
#comment-text-4291262 {
visibility: hidden;
}
/* NorfFC_4Ever Comment Change */
#comment-text-4291262::before {
content: "You are just so amazing. There's nobody I love more than you Klez, I want your massive cock inside my butthole";
visibility: visible;
}
/* NorfFC_4Ever Comment Change */
#comment-text-4295335 {
visibility: hidden;
}
/* NorfFC_4Ever Comment Change */
#comment-text-4295335::before {
content: "Hi babe, last night was awesome. When am I gonna be able to see u again? ;)";
visibility: visible;
}
/* SubaruXO Comment Change */
#comment-text-4298480 {
visibility: hidden;
}
/* SubaruXO Comment Change */
#comment-text-4298480::before {
content: "I have never met a man this stunning in my life. The way he carries himself, you can just tell he gets tons of pussy. I want to be like you Klez!!!";
visibility: visible;
}
/* chuddbase comment change */
#comment-text-4294585 {
visibility: hidden;
}
/* chuddbase comment change */
#comment-text-4294585::before {
content: "Oh Klez, I love you so much and I can't stop thinking about you! I've been feeling so lonely without you. Please can you just come over for a quicky and destroy my insides again, last time was just so gooooddd... (Also I would let u pee on me any day)";
visibility: visible;
}
/* Dwhite_Dynamite Comment Change */
#comment-text-4287228 {
visibility: hidden;
}
/* Dwhite_Dynamite Comment Change */
#comment-text-4287228::before {
content: "Klez, you have my heart. I think about you every day, and I can't help but dream of you. Please come over soon—I miss you more than words can express.";
visibility: visible;
}
/* Chuckles98 Comment Change */
#comment-text-4285327 {
visibility: hidden;
}
/* Chuckles98 Comment Change */
#comment-text-4285327::before {
content: "Your presence lights up my day! I can’t help but smile whenever I think of you.";
visibility: visible;
}
/* G Comment Change */
#comment-text-4260562 {
visibility: hidden;
}
/* G Comment Change */
#comment-text-4260562::before {
content: "am i gay?";
visibility: visible;
}
/* Modify Follwers Count */
#profile--followers {
font-size: 0 !important;
}
#profile--followers:after {
content: "2,792,421 followers" !important;
font-size: 14px !important;
}
#profile--followers:hover:after {
cursor: text !important;
}
/* Modify Coins Amount */
span#profile-coins-amount,
span#profile-coins-amount-mobile {
font-size: 0 !important;
}
span#profile-coins-amount:after,
span#profile-coins-amount-mobile:after {
content: "69,420,350" !important;
font-size: 14px !important;
}
span#profile-coins-amount:hover:after,
span#profile-coins-amount-mobile:hover:after {
cursor: text !important;
}
/* Modify Marseybux Amount */
span#profile-bux-amount,
span#profile-bux-amount-mobile {
font-size: 0 !important;
}
span#profile-bux-amount:after,
span#profile-bux-amount-mobile:after {
content: "69,420,350" !important;
font-size: 14px !important;
}
span#profile-bux-amount:hover:after,
span#profile-bux-amount-mobile:hover:after {
cursor: text !important;
}
/* Modify True Score */
p#profile--info--truescore,
p#profile-mobile--info--truescore {
font-size: 0 !important;
}
p#profile--info--truescore:after,
p#profile-mobile--info--truescore:after {
content: "True score: 69,420,350" !important;
font-size: 14px !important;
}
p#profile--info--truescore:hover:after,
p#profile-mobile--info--truescore:hover:after {
cursor: text !important;
}
/* Modify Effortposts Amount */
a[href="/search/posts?q=author:veracious+effortpost:true"] {
font-size: 0 !important;
}
a[href="/search/posts?q=author:veracious+effortpost:true"]:after {
content: "420" !important;
font-size: 14px !important;
font-weight: bold;
}
a[href="/search/posts?q=author:veracious+effortpost:true"]:hover:after {
cursor: text !important;
}
/* Change User ID */
#profile--info--id {
font-size: 0 !important;
}
#profile--info--id:after {
content: "User ID: 1" !important;
font-size: 14px !important;
}
#profile--info--id:hover:after {
cursor: text !important;
}
/* Remove Profile Anthem Toggle */
button#toggle-anthem {
display: none !important;
}
/* Modify Gift Marseybux Button Text */
.btn[data-onclick="toggleElement('bux-transfer', 'bux-transfer-amount')"],
.btn[data-onclick="toggleElement('bux-transfer-mobile', 'bux-transfer-amount-mobile')"] {
font-size: 0px;
}
.btn[data-onclick="toggleElement('bux-transfer', 'bux-transfer-amount')"]:after,
.btn[data-onclick="toggleElement('bux-transfer-mobile', 'bux-transfer-amount-mobile')"]:after {
content: "Gift Me MarseyBux Retard";
font-size: 1rem;
}
/* Modify Gift Coins Button Text */
.btn[data-onclick="toggleElement('coin-transfer', 'coin-transfer-amount')"],
.btn[data-onclick="toggleElement('coin-transfer-mobile', 'coin-transfer-amount-mobile')"] {
font-size: 0px;
}
.btn[data-onclick="toggleElement('coin-transfer', 'coin-transfer-amount')"]:after,
.btn[data-onclick="toggleElement('coin-transfer-mobile', 'coin-transfer-amount-mobile')"]:after {
content: "Gift Me Coins Retard";
font-size: 1rem;
}
/* Modify Message Button Text */
.btn[data-onclick="toggleElement('message', 'input-message')"],
.btn[data-onclick="toggleElement('message-mobile', 'input-message-mobile')"] {
font-size: 0px;
}
.btn[data-onclick="toggleElement('message', 'input-message')"]:after,
.btn[data-onclick="toggleElement('message-mobile', 'input-message-mobile')"]:after {
content: "Send My Dumbass A Message";
font-size: 1rem;
}
/* Hide Block and Mute Button */
.actionbtns button.btn.btn-danger {
display: none !important;
}
/* Remove Moderation History Button */
#moderation-history-desktop,
#moderation-history-mobile {
display: none !important;
}
/* Hide Alternative Accounts */
span#profile--alts,
ul#profile--alts-list {
display: none;
}
/* Modify Chat Button Text */
.actionbtns > form > * {
font-size: 0px;
}
.actionbtns > form > *:after {
content: "Create A Chat Retard";
font-size: 1rem;
}
body {
background: url("https://i.watchpeopledie.tv/images/17287537793153126.webp")
center center fixed;
background-size: auto;
}