facebookincubator / infima

A UI framework that provides websites with the minimal CSS and JS needed to get started with building a modern responsive beautiful website
https://infima.dev
MIT License
408 stars 55 forks source link

Fix broken footer logo in Infima Footer doc #263

Closed slorber closed 2 years ago

slorber commented 2 years ago

Fixes https://github.com/facebookincubator/infima/issues/239

Note there's still one case where we display the logo for dark mode on a light background:

CleanShot 2022-06-23 at 10 42 56@2x

I think it's better to not fix it because the documented markup is static (but the theme/backgroundColor is dynamic): fixing this would likely create noise in our doc for little ROI

github-actions[bot] commented 2 years ago

Dist CSS Diff

github-actions[bot] commented 2 years ago

Size Change: 0 B

Total Size: 554 kB

ℹī¸ View Unchanged | Filename | Size | | :--- | :---: | | `./packages/core/dist/css/default-dark/default-dark-rtl.css` | 80 kB | | `./packages/core/dist/css/default-dark/default-dark-rtl.min.css` | 56.9 kB | | `./packages/core/dist/css/default-dark/default-dark.css` | 80 kB | | `./packages/core/dist/css/default-dark/default-dark.min.css` | 56.9 kB | | `./packages/core/dist/css/default/default-rtl.css` | 77.9 kB | | `./packages/core/dist/css/default/default-rtl.min.css` | 55.8 kB | | `./packages/core/dist/css/default/default.css` | 77.9 kB | | `./packages/core/dist/css/default/default.min.css` | 55.7 kB | | `./packages/core/dist/js/alerts.js` | 409 B | | `./packages/core/dist/js/alerts.min.js` | 409 B | | `./packages/core/dist/js/button-groups.js` | 267 B | | `./packages/core/dist/js/button-groups.min.js` | 267 B | | `./packages/core/dist/js/dropdowns.js` | 1.01 kB | | `./packages/core/dist/js/dropdowns.min.js` | 1.01 kB | | `./packages/core/dist/js/menu.js` | 2.4 kB | | `./packages/core/dist/js/menu.min.js` | 2.4 kB | | `./packages/core/dist/js/navbar.js` | 1.08 kB | | `./packages/core/dist/js/navbar.min.js` | 1.08 kB | | `./packages/core/dist/js/pills.js` | 270 B | | `./packages/core/dist/js/pills.min.js` | 270 B | | `./packages/core/dist/js/radio-behavior.js` | 705 B | | `./packages/core/dist/js/radio-behavior.min.js` | 705 B | | `./packages/core/dist/js/tabs.js` | 267 B | | `./packages/core/dist/js/tabs.min.js` | 267 B |

compressed-size-action

netlify[bot] commented 2 years ago

Deploy Preview for infima ready!

Name Link
Latest commit 526eef3e438028f676553f254e8cf1c1594d2676
Latest deploy log https://app.netlify.com/sites/infima/deploys/62b427e90fbba80008870c57
Deploy Preview https://deploy-preview-263--infima.netlify.app
Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site settings.

Josh-Cena commented 2 years ago

Note there's still one case where we display the logo for dark mode on a light background:

Would using another src work?

slorber commented 2 years ago

Would using another src work?

No because then it's the other theme that would be broken đŸ¤Ē

CleanShot 2022-06-23 at 10 48 08@2x

We'd need something akin to <ThemedImage> but just in static markup: we don't have the concept of themed image in Infima directly. Maybe we should 🤷‍♂ī¸

If you find a solution without polluting the documentation with useless technical code, why not. I'd rather not invest too much time on this little thing.

Josh-Cena commented 2 years ago

Ah, didn't realize the footer is themed.