black7375 / black7375/Firefox-UI-Fix

Homepage sites with no favicons should look less weird with `userContent.newTab.full_icon`

Open
#812 0 comments 0 reactions 0 assignees View on GitHub
Class::Size Component::UserContents Issue::Enhancement
Dominant language
SCSS
Stars
5.9k
Forks
202
PR merge metrics
No merged PRs in 30d

Description

### Is your feature request related to a problem?

Currently, sites with no favicons look kinda weird in the homepage with `userContent.newTab.full_icon`.
![Lepton](https://github.com/black7375/Firefox-UI-Fix/assets/134786889/8aa788e2-e710-4a5e-88a0-175f6b9e3a77)

The letter isn't centered and it's rotated for some reason.

Without `userContent.newTab.full_icon`, it looks fine.
![Firefox](https://github.com/black7375/Firefox-UI-Fix/assets/134786889/4b7f52a6-8e5a-4838-b50a-dd22b5c2bcf0)

### The solution I'd like

In Chrome and Edge, the letter is centered and not rotated.
![Chredge](https://github.com/black7375/Firefox-UI-Fix/assets/134786889/1f771ec2-559c-4317-8cf6-889d12ace690)

An alternate solution is to make the letter bigger.
![ZCPT](https://github.com/black7375/Firefox-UI-Fix/assets/134786889/2c4080f5-d112-4f32-b9d4-7a5406982d81)
(the letter is also slightly transparent)Code

.top-site-outer .tile .icon-wrapper::before {

translate: 0px 10px;
font-size: 100px !important;
opacity: 0.75 !important;
}

### Screenshots or video

_No response_

### Alternatives I've considered

_No response_

### Additional context

Site without favicon: http://example.com

Contributor guide

Open the contributing guide

Research direction

Start by locating the `.top-site-outer .tile .icon-wrapper::before` rule and compare its behavior with and without `userContent.newTab.full_icon`. Adjust the missing-favicon letter styling so it is centered and not rotated, or use the provided larger, slightly transparent alternative; done means sites without favicons no longer look distorted on the homepage.

Written by the indexing model from the issue text.

Assessment

Tech stack
scss
Domain
design, frontend
Issue type
Feature
Difficulty
2/5
Estimated time
1-3 hours
Activity status
Stale
Clarity
Clearly specified
Newbie friendliness
45/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.