Bento icon indicating copy to clipboard operation
Bento copied to clipboard

Custom colors for each list / button

Open garevans opened this issue 4 years ago • 1 comments

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

garevans avatar Mar 29 '22 22:03 garevans

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.

lewisdoesstuff avatar Mar 29 '22 23:03 lewisdoesstuff