Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Can't find way to alter font-sizes #756

Open
dibs opened this issue Feb 12, 2020 · 1 comment
Open

Can't find way to alter font-sizes #756

dibs opened this issue Feb 12, 2020 · 1 comment

Comments

@dibs
Copy link

dibs commented Feb 12, 2020

Sorry for posting here but I don't know where else to seek help.

I am trying a way to set my font-sizes in my particle patterns.
The _type.scss file seem to ignore size.
I don't have printing and non-printing folders either so the docs are bit odd to follow.

Also is there a forum anywhere for particle?

@eih
Copy link
Contributor

eih commented Apr 30, 2020

Hope you've solved your issue. For those who have the same problem in the future, I'd like to provide some instructions.

Fonts/type related stuff are under particle/source/default/tokens. Follow the steps:

  1. Place your fonts under particle/source/default/tokens/fonts directory.
  2. Open the particle/source/default/tokens/sass/tokens.scss file where you'll see an example:
// Example: local fonts
@font-face {
  font-family: 'Oswald';
  font-style: normal;
  font-weight: 400;
  src: local('Oswald Regular'), local('Oswald-Regular'), url(../../fonts/Oswald-Medium.ttf) format('truetype');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

Edit this to suit your needs. I've got five variations of two fonts.

After that, if you're using Bootstrap, head to particle/source/default/tokens/sass/libraries/bootstrap/_utils.scss and edit // Bootstrap font family overrides to make sure that Bootstrap uses your fonts. I'm not limited to those three options, in particle/source/default/tokens/sass/utils/_variables.scss, I've setup other font family variables for different font weights.

For the font sizes: Assuming you use Bootstrap, you'll need to override default variables in the same way. Check the list of bootstrap's variables, and edit them like you did for font families (more info on this could be found on Bootstrap documentation).

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants