samuelmeuli / font-manager Goto Github PK
View Code? Open in Web Editor NEWπ Manages, downloads and applies Google Fonts for picker components
License: MIT License
π Manages, downloads and applies Google Fonts for picker components
License: MIT License
Hi,
thanks for this! Technically coming from font-picker-react
, but the underlying issue is in here.
Currently, importing FontPicker
imports font-manager
, which imports loadFontPreviews
, which imports dependencies from './font-styles/declarations
.
When initially loading that file, it will instantly try append a style
element to <head>
.
Can probably be easily fixed by something like:
let previewFontsStylesheet: HTMLStyleElement;
/**
* Add declaration for applying the specified preview font
*/
export function applyFontPreview(previewFont: Font, selectorSuffix: string): void {
if(!previewFontsStylesheet && typeof document !== 'undefined') {
previewFontsStylesheet = document.createElement('style');
document.head.appendChild(previewFontsStylesheet);
}
const fontId = getFontId(previewFont.family);
const style = `
#font-button-${fontId}${selectorSuffix} {
font-family: "${previewFont.family}";
}
`;
previewFontsStylesheet.appendChild(document.createTextNode(style));
}
For my project I need to fetch the font file / link from the active font and pass it along to a database after I click submit. But the default loaded font only shows family and id for the font. You can see the image below where I fetched activefont for the default font and after the information from a font selected afterwards.
Is there an easier way to do this, or a way to add this information for the default font as well?
font-picker is golden btw!
Regards
BjΓΈrn
Hi. Thanks for sharing your module.
I would like to use https://fonts.google.com/specimen/UnifrakturCook which is not available in regular
variant. So if I add 700
to the variants I would expect it to be loaded but as i see it is explicitly omitting the font if merely a subset of the desired variants is included in the font.
How can I have for example Average Sans, Open Sans, UnifrakturCook, UnifrakturMaguntia
in one combined menu?
imho it should not be needed to have a font matching every
variant as specified in the variants
but at least one.
like, instead of
this.options.variants.every((variant: Variant): boolean => font.variants.includes(variant))
rather the following:
font.variants.filter( variant => this.options.variants.includes(variant) ).length
Is that a change request you would accept or would you rather have a new property among the lines of oneOfVariants: ['700', 'regular']
?
A declarative, efficient, and flexible JavaScript library for building user interfaces.
π Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. πππ
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google β€οΈ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.