search

joelshepherd / tabliss

A beautiful, customisable New Tab page for Firefox, Chrome, and Edge.
https://tabliss.io
GNU General Public License v3.0
2.23k stars 294 forks source link

[Feature Request] - QuickLinks - Website Icons shadowed or boxed #498

Open R0land-S opened 2 years ago

R0land-S commented 2 years ago

When using an Unsplash background and only Website Icons for QuickLinks, some icons might become extremely hard to see depending on the picture used as background.

A way to circumvent this problem would be to "box" each icon with a uniform background, maybe similar to what we get when using the Default Firefox Home Page Shortcuts ?

Yohn commented 2 years ago

Here's what I did

image

I added this to the custom CSS box for it.

.Links a {
  background: rgba(0, 0, 0, .8);
  padding: 10px 25px;
  border-radius: .475rem;
  border: 1px solid #393939;
  float: left;
}

.Links a:hover {
  text-decoration: none;
  background: rgba(160, 82, 51, 0.6);
  color: #000;
}