jennardson's profile picture

Published by

published
updated

Category: Web, HTML, Tech

CODE: CUSTOMIZE INTEREST LABELS

<!--CUSTOMIZE INTEREST LABELS - PLACE IN GENERAL INTERESTS-->
<style>
:root {
    --topic1: "General";  /* EDIT INTEREST LABELS HERE */
    --topic2: "Music";
    --topic3: "Movies & TV";
    --topic4: "Pets";
    --topic5: "Food";
    --topic6: "Hobbies";

 }

.table-section:not(:last-child) .details-table tr td:first-child p{color:transparent !important;text-shadow: none !important;letter-spacing: -100px;}

.details-table tr td:first-child p::after{
   color:var(--links) !important;
   letter-spacing:normal !important;
   text-shadow: 2px 2px darkviolet !important; /* CHANGE COLOR OF INTEREST LABELS HERE */
   filter: brightness(95%) !important;
}

.table-section:not(:last-child) .details-table tr:nth-child(1) td:first-child p::after{
    content: var(--topic1);
}
.table-section:not(:last-child) .details-table tr:nth-child(2) td:first-child p::after{
    content: var(--topic2);
}
.table-section:not(:last-child) .details-table tr:nth-child(3) td:first-child p::after{
    content: var(--topic3);
}
.table-section:not(:last-child) .details-table tr:nth-child(4) td:first-child p::after{
    content: var(--topic4);
}
.table-section:not(:last-child) .details-table tr:nth-child(5) td:first-child p::after{
    content: var(--topic5);
}
.table-section:not(:last-child) .details-table tr:nth-child(6) td:first-child p::after{
    content: var(--topic6);
}
</style>


160 Kudos

Comments

Displaying 20 of 21 comments ( View all | Add Comment )

𝔢𝔯𝔬𝔰ೃ⁀➷

𝔢𝔯𝔬𝔰ೃ⁀➷'s profile picture

using!! <3


Report Comment

kyle ★;

kyle   ★;'s profile picture

using thx !!!)! x3


Report Comment

EDIALETSI

EDIALETSI's profile picture

TYSMM!! USING ^_^


Report Comment

tranquil45

tranquil45's profile picture

not working onthe mobile, gotta erase this code:((((??


Report Comment

lalunedenocturne

lalunedenocturne's profile picture

using !!


Report Comment

Hex

Hex's profile picture

using!! thanks :3


Report Comment

Hex

Hex's profile picture

using!! thanks :3


Report Comment

Hex

Hex's profile picture

using!! thanks :3


Report Comment

Simon

Simon's profile picture

using! tysm!


Report Comment

☆ kirumix !!

☆ kirumix !!'s profile picture

ty !!!!!! using :3


Report Comment

Sorrow♪

Sorrow♪'s profile picture

TYSM !! <3


Report Comment

BuzxiBee

BuzxiBee 's profile picture

TYYY


Report Comment

ʙᴀᴄᴋʀᴏᴏᴍꜱ_ʀᴇꜱɪᴅᴇɴᴛ

ʙᴀᴄᴋʀᴏᴏᴍꜱ_ʀᴇꜱɪᴅᴇɴᴛ's profile picture

TYSM! <3


Report Comment

kai ninjago

kai ninjago 's profile picture

How do we change the color of the text? I tried putting a hex code and it didn't work :(


Report Comment



HTML has their own list of names of colors you can use, like "lime" is a neon green, while "green" is just a regular green that is easier on the eyes. You could also use RGB which is "rgb(000, 000, 000)". However, I personally just like to stick to HTML's already named colors.

by Helga ⛧; ; Report

in this piece of code, replace "darkviolet" with the HEX code you want! (at least its what worked for me!)


.details-table tr td:first-child p::after{
color:var(--links) !important;
letter-spacing:normal !important;
text-shadow: 2px 2px darkviolet !important; /rgb(86, 50, 62)/
filter: brightness(95%) !important;


also change up the brightness if the color still doesnt look right :3

by leafy!! ★; ; Report

✩ shai ✩

✩ shai ✩'s profile picture

thank u so much!!!☆☆☆


Report Comment

★Star★

★Star★'s profile picture

I already had this code: https://blog.spacehey.com/entry?id=1533 and when i added this the added interests disappeared :( is there a way to fix this?


Report Comment

sabbath 🎀

sabbath 🎀's profile picture

How do I change the color of the labels? I tried to put the hex code where it says to but nothing happens;;


Report Comment



I think I have to be doing something wrong this is what I’ve done to that bit of the code

.details-table tr td:first-child p::after{
color:var(--links) !important;
letter-spacing:normal !important;
text-shadow: 2px 2px darkviolet !important; /rgb(86, 50, 62)/
filter: brightness(95%) !important;

by sabbath 🎀; ; Report

That worked, Tysm!

by sabbath 🎀; ; Report

zann

zann's profile picture

does anybody know if theres a way to add a backdrop shadow to the text?


Report Comment

gabby

gabby's profile picture

tysm!! <3


Report Comment

ash<3

ash<3's profile picture

how do i delete the original text? when i try this code it adds my text infront of the original


Report Comment



sameeee :<

by ☆ 𝖇𝖊𝖊 ☆; ; Report

Hey there! I used < style > before :root and < / style > after the wall of text and it worked for me :) also don't forget to past the text in the "General" section. Hope this helps! <3

by Dollie; ; Report