illright / attractions

A pretty cool UI kit for Svelte
https://illright.github.io/attractions
MIT License
1.03k stars 37 forks source link

Font is missing #340

Open Tauka opened 2 years ago

Tauka commented 2 years ago

For the correct font-family to work, I put Ubuntu font from Google fonts in <head></head>. However, I don't see it being documented anywhere. Is font supposed to be shipped with library?

illright commented 2 years ago

It's not supposed to be shipped with the library. I agree that not having an explicit mention in the docs is a bit of a miss. We'll add that shortly. Thanks for the heads up!

Tauka commented 2 years ago

Thank you for great UI library :)

illright commented 2 years ago

You're welcome :)

I'll keep the issue open for now to act as a reminder

zachsa999 commented 1 year ago

Guess I'm stuck here now. I added this to static/css/theme.scss

`@forward '~attractions/_variables' with ( $main: red, //only here for testing, it works $font: "'Ubuntu-Medium', sans-serif", );

@font-face { font-family: sans-serif; src: url('../fonts/Ubuntu/Ubuntu-Medium.ttf') format('ttf'); }`

I can't make the font to load up. Whats the deal?

illright commented 1 year ago

I imagine you need to specify the name for your font face. See the MDN docs on @font-face

zachsa999 commented 1 year ago

I added

@forward '~attractions/_variables' with ($main: rgb(128, 66, 76),
    $font: "'Ubuntu', sans-serif",
);

@font-face {
    font-family: 'Ubuntu', sans-serif;
    // src: url('../fonts/Ubuntu/Ubuntu-Medium.ttf') format('ttf');
    src: url('https://fonts.googleapis.com/css2?family=Ubuntu&display=swap');
}

to my theme file, unfortunately no go. It does indeed work in the individual elementsas tested in a +page.svelte

in node_modules/attractions/_variables.scss line three declares $font to be Ubuntu

@use 'sass:color';

$font: 'Ubuntu', sans-serif !default;

$main: #4300b0 !default;

I can just declare the font for each element, but that excludea H1 etc. How do I go about this?

illright commented 1 year ago

This is a different problem, off-topic to this issue that you're commenting on. Could you please open a new issue?