search

Androser420 / sysmol24

a tui-styled, collapsible discord theme.
MIT License
1 stars 0 forks source link

Dorion Support #1

Open Mojas84 opened 3 days ago

Mojas84 commented 3 days ago

Hi nice theme but on Dorion Discord me not work......??

Androser420 commented 2 days ago

hey there, seems like theming on dorion is a bit broken because the import at-rules arent really functioning well (if not at all) not sure why its like that but i would assume its for performance reasons, which is what theyre mainly targetting

that being said, your best bet is to look deeper into the code and insert all the urls manually to make it work normally except now, you will also have to update it manually too, which is another huge disadvantage

for now, just download the files, insert them in your themes folder and arrange them like this: cssfiles.zip dorion

Mojas84 commented 1 day ago

OK THX very much but rounded it not work...... obrazek

Mojas84 commented 1 day ago

We can add please Night Owl theme of Niivu?? Or how it themes customize for other themes i dont know what is oklch color.....

Androser420 commented 5 hours ago

OK THX very much but rounded it not work...... obrazek

np, the rounding doesnt work because you obviously have unrounding.css enabled if you want it, remove it and adjust the --panel-roundness inside :root{} from either your flavor or sysmol-main.css

Androser420 commented 5 hours ago

We can add please Night Owl theme of Niivu?? Or how it themes customize for other themes i dont know what is oklch color.....

yeah sure, just spent some time trying to do it myself, here:

/* customize things here */
:root {
    --font: 'DM Mono'; /* UI font name. it must be installed on your system. */
    letter-spacing: -0.05ch; /* decreases letter spacing for better readability. */
    font-weight: 300; /* UI font weight. */
    --label-font-weight: 500; /* font weight for panel labels. */
    --corner-text: 'nightowl24'; /* custom text to display in the corner. only works on windows. */
    --pad: 16px; /* padding between panels. */
    --txt-pad: 10px; /* padding inside panels to prevent labels from clipping */
    --panel-roundness: 0px; /* corner roundness of panels. ONLY WORKS IF unrounding.css IS REMOVED (see above). */

    /* background colors */
    --bg-0: #011627; /* main background color. */
    --bg-1: #001122; /* background color for secondary elements like code blocks, embeds, etc. */
    --bg-2: #1d3b53 ; /* color of neutral buttons. */
    --bg-3: #102a44; /* color of neutral buttons when hovered. */

    /* state modifiers */
    --hover: #0e293f; /* color of hovered elements. */
    --active: #234d708c; /* color of elements when clicked. */
    --selected: var(--active); /* color of selected elements. */

    /* text colors */
    --txt-dark: var(--bg-0); /* color of dark text on colored backgrounds. */
    --txt-link: var(--cyan); /* color of links. */
    --txt-0: oklch(90% 0 0); /* color of bright/white text. */
    --txt-1: #ffffffcc; /* main text color. */
    --txt-2: #5f7e97; /* color of secondary text like channel list. */
    --txt-3: #28455c; /* color of muted text. */

    /* accent colors */
    --acc-0: var(--cyan); /* main accent color. */
    --acc-1: var(--cyan-1); /* color of accent buttons when hovered. */
    --acc-2: var(--cyan-2); /* color of accent buttons when clicked. */

    /* borders */
    --border-width: 2px; /* panel border thickness. */
    --border-color: var(--bg-3); /* panel border color. */
    --border-hover-color: var(--acc-0); /* panel border color when hovered. */
    --border-transition: 0.2s ease; /* panel border transition. */

    /* status dot colors */
    --online-dot: var(--green); /* color of online dot. */
    --dnd-dot: var(--pink); /* color of do not disturb dot. */
    --idle-dot: var(--yellow); /* color of idle dot. */
    --streaming-dot: var(--purple); /* color of streaming dot. */

    /* mention/ping and message colors */
    --mention-txt: var(--acc-0); /* color of mention text. */
    --mention-bg: color-mix(in oklch, var(--acc-0), transparent 90%); /* background highlight of mention text. */
    --mention-overlay: color-mix(in oklch, var(--acc-0), transparent 90%); /* overlay color of messages that mention you. */
    --mention-hover-overlay: color-mix(in oklch, var(--acc-0), transparent 95%); /* overlay color of messages that mention you when hovered. */
    --reply-overlay: var(--active); /* overlay color of message you are replying to. */
    --reply-hover-overlay: var(--hover); /* overlay color of message you are replying to when hovered. */

    /* color shades */
    --yellow: oklch(83.44% 0.1534 109.5);
    --red: oklch(74.27% 0.1348 311.06);
    --pink: oklch(65.39% 0.1926 25.14);
    --cyan: oklch(74.41% 0.1311 264.28);
    --cyan-1: oklch(64.41% 0.1311 264.28);
    --cyan-2: oklch(54.41% 0.1311 264.28);
    --green: oklch(77.99% 0.2035 150.74);
    --green-1: oklch(67.99% 0.2035 150.74);
    --green-2: oklch(57.99% 0.2035 150.74);
}

i had to do some manual adjustment because finding the actual values was lowkey hard so id really appreciate if you check it yourself and tell me if it looks fine, enjoy!