Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Using Primary/Secondary color in custom CSS #1451

Closed
itsalljustdata opened this issue Oct 6, 2023 · 5 comments
Closed

Using Primary/Secondary color in custom CSS #1451

itsalljustdata opened this issue Oct 6, 2023 · 5 comments
Labels
✨ Feature A feature you'd like to be added Fixed in 1.0 This issue has been fixed in our upcoming version 1.0 and is not crucial enough to be backported Stale

Comments

@itsalljustdata
Copy link

itsalljustdata commented Oct 6, 2023

Description

I popped some custom CSS in to highlight "today" on the calendar

td:has(button[data-today="true"]) {
  border-style: dotted;
  border-width: 1px;
  border-color: yellow;
}

All is good.

Is there any way that I can get the CSS to use the defined Primary/Secondary colours (note spelling!) so that the CSS wouldn't need updating when I change my colours?

Priority

Low (Nice-to-have)

@itsalljustdata itsalljustdata added the ✨ Feature A feature you'd like to be added label Oct 6, 2023
@SeDemal
Copy link
Collaborator

SeDemal commented Oct 11, 2023

Hi, I don't think it is possible unfortunately.
Here's the link to the color palette though so you can more accurately choose your color:
https://mantine.dev/theming/colors/#default-colors
Better use the hex code though.

The border color is already used to show the day that is opened, and the current day already shown by a shadowy background.

@manuel-rw
Copy link
Collaborator

I doubt. @Tagaishi we use global CSS variables, don't we? So something like var(--mantine.....) should work. Use the inspector to find out the variable name.

@SeDemal
Copy link
Collaborator

SeDemal commented Oct 12, 2023

@itsalljustdata @manuel-rw
https://v6.mantine.dev/theming/mantine-provider/#css-variables
Doesn't look like primaryColor is part of it no :/ it was a good guess though.

Even in v7 I don't find it and they expend on it a lot.
https://v7.mantine.dev/styles/css-variables
Good news is, I think we can make our own variables in the future meaning we'll be able to add the primaryColor as one.
We'd have to upgrade to mantine V7 first and then take a look at it, so it won't be for right now, but there's hope.

Copy link

Hello 👋, this issue has been open for 60 without activity. Please close this issue if it's no longer relevant or has been resolved. Still relevant? Simply reply and I'll mark it as active.

@github-actions github-actions bot added the Stale label Dec 31, 2023
@Meierschlumpf Meierschlumpf added the Fixed in 1.0 This issue has been fixed in our upcoming version 1.0 and is not crucial enough to be backported label Jan 10, 2025
@Meierschlumpf
Copy link
Collaborator

In Homarr 1.0 it's possible to use the css variables provided from mantine

@github-project-automation github-project-automation bot moved this from 🆕 New to ✅ Done in Homarr Kanban Jan 10, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
✨ Feature A feature you'd like to be added Fixed in 1.0 This issue has been fixed in our upcoming version 1.0 and is not crucial enough to be backported Stale
Projects
Archived in project
Development

No branches or pull requests

4 participants