bradamelton / saberfin.io

Issues for the https://saberfin.io website
0 stars 0 forks source link

Saberfin Logo cut off on mobile #19

Closed bradamelton closed 2 years ago

bradamelton commented 2 years ago

Installing android studio so I can reproduce locally. The mobile view for browsers doesn't reproduce.

bradamelton commented 2 years ago

Reproduced in android studio. I believe this is a Font problem. Some say you can vectorize fonts in adobe illustrator with "Text to Outline." I don't remember how I created this dude in the first place. GIMP I think, but it looks bad in there when I open it and doesn't look like its doin' it.

bradamelton commented 2 years ago

https://stackoverflow.com/questions/40843728/font-family-not-being-applied-on-mobile-devices

bradamelton commented 2 years ago

https://xmlgraphics.apache.org/batik/tools/rasterizer.html

bradamelton commented 2 years ago

try downloading the font I am using and distributing it with a link.

bradamelton commented 2 years ago

Made a mobile image too. This is probably still going to be an issue on other phones / resolutions. The better fix would be the font thing, but this is good enough for now.

bradamelton commented 2 years ago

declare module "*.svg" { import React = require("react"); const src: React.FC<React.SVGProps>; export default src; }

Hope we can pass in the classname. I need it to use the app.css for the mobile reactivity. Then we're good.

bradamelton commented 2 years ago

Problem is that svg was disappearing, so converting to an inline component which is pretty snazzy.

bradamelton commented 2 years ago

Looks great now. Font is proprietary so I don't want to include it anyway.