Divs in your profile; Stop using :root

Written Date (dd/mm/yy): 05/01/25

Published Date (dd/mm/yy): 05/01/25

Author: Malingen

Hello everyone, 
 

A quick PSA if any of you are interested in customizing your profile: Don't use the :root { style } in your <style></style> element. The  :root { style } CSS modifier only changes the primary colors on your page being used, limiting what you can customize on your profile page.

The :root { style } modifier looks like this:

:root {
    --light-gray: #f2f0f0;
    --gray: #e3e3e3;
    --dark-gray: #919191;
    --darker-gray: #545454;
    --logo-blue: #2749a7;
    --darker-blue: #1E40AF;
    --lighter-blue: #60A5FA;
    --even-lighter-blue: #BFDBFE;
    --lightest-blue: #DBEAFE;
    --red: #FF0000;
    --dark-orange: #ED0707;
    --light-orange: #f9c56c;
    --even-lighter-orange: #fcdbb8;
    --strange-yellow: #dbae2e;
    --green: #34D399;
    --light-green: #E6F8DD;
    --medium-green: #A0C99C;
    --dark-green: #059669;
    accent-color: #1D4ED8;
    accent-color: var(--logo-blue);
}

What you should use instead is using the already given CSS classes in each <div>, or section, on the page, as seen below:

(https://imgur.com/BoyAXTp)

corresponding with these divs:

(https://gitlab.com/lules-oddities/dump/-/raw/main/spacehey_divs.gif)

You can change the CSS in these divs by doing something like:

<style>
.main {
background-color: red;
}
</style>

which would result in:

(https://imgur.com/xiU9qgZ)

This is just an example, of course, there's much more you can do with the power of CSS once you understand the <div> layout of Spacehey pages.

QRT.