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

Custom colors for each list / button #86

Open
garevans opened this issue Mar 29, 2022 · 1 comment
Open

Custom colors for each list / button #86

garevans opened this issue Mar 29, 2022 · 1 comment

Comments

@garevans
Copy link

garevans commented Mar 29, 2022

On the previous version of bento, I was able to duplicate the css entry for .qlist__link to .qlist__greenlink, bluelink etc to allow me to have different colour highlight for the two lists.

.qlist__link {
  text-decoration: none;
  font-size: var(--fses);
  color: var(--fg);
  margin-top: 1px;
  padding: 6px 12px;
  border-radius: 5px;
  font-weight: bold;
}
.qlist__link:hover {
background-color: var(--accent);
  color: var(--fg);
}
.qlist__orangelink {
  text-decoration: none;
  font-size: var(--fses);
  color: var(--fg);
  margin-top: 1px;
  padding: 6px 12px;
  border-radius: 5px;
  font-weight: bold;
}
.qlist__orangelink:hover {
  background-color: #EF9A3E60;
  color: var(--fg);
}

The new system appears to only allow you to edit the color for all items

@lewisdoesstuff
Copy link
Contributor

You're able to edit the style for the individual lists, it's in app.css

.list__1 {
  grid-column: 1;
  grid-row: 1 / span 2;
}

.list__2 {
  grid-column: 2;
  grid-row: 1 / span 2;
}

I don't think you can change the color of each item in the list, though.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants