Comments (7)
Sounds like you need to compile the .less files into .css for the change to take effect. Here's roughly what you need to do:
- Change the Google font script in the
_includes/_head.html
from<link href='http://fonts.googleapis.com/css?family=PT+Sans+Narrow:400,700|PT+Serif:400,700,400italic' rel='stylesheet' type='text/css'>
to whatever new embed Google gives you upon selecting the fonts you want to use - Update the font-family variables in
variables.less
to match the names Google uses (sounds like you've done this already). - Compile the .less files into a new
css/main.min.css
stylesheet. I provided Grunt.js tasks to do this for you so just check the theme documentation on how to install Node, required modules (if you haven't already), and the commands to run Grunt.
Hope this helps.
from minimal-mistakes.
Thanks for your help.
It didn't work, unfortunately, for the installation part (I have no idea about what I was doing, sorry). I got this on my Linux terminal when I did npm install
sh: 1: node: not found
npm WARN This failure might be due to the use of legacy binary "node"
npm WARN For further explanations, please read
/usr/share/doc/nodejs/README.Debian
npm ERR! Error: ENOENT, lstat '/home/augusto/git/statgen-esalq/node_modules/grunt-contrib-imagemin/node_modules/gifsicle/node_modules/bin-wrapper/node_modules/mout/string/endsWith.js'
npm ERR! If you need help, you may report this log at:
npm ERR! http://github.com/isaacs/npm/issues
npm ERR! or email it to:
npm ERR! [email protected]
...
from minimal-mistakes.
Sorry I don't have much experience with Linux. Looks like you don't have
Node installed from the errors. Or if it's installed it needs to be updated
before doing running npm install to bring down all the modules needed for
Grunt.
On Monday, June 9, 2014, Antonio Augusto Franco Garcia <
[email protected]> wrote:
Thanks for your help.
It didn't work, unfortunately, for the installation part (I have no idea
about what I was doing, sorry). I got this on my Linux terminal when I did
npm installsh: 1: node: not found
npm WARN This failure might be due to the use of legacy binary "node"
npm WARN For further explanations, please read
/usr/share/doc/nodejs/README.Debiannpm ERR! Error: ENOENT, lstat
'/home/augusto/git/statgen-esalq/node_modules/grunt-contrib-imagemin/node_modules/gifsicle/node_modules/bin-wrapper/node_modules/mout/string/endsWith.js'
npm ERR! If you need help, you may report this log at:
npm ERR! http://github.com/isaacs/npm/issues
https://github.com/isaacs/npm/issues
npm ERR! or email it to:
npm ERR! [email protected]
javascript:_e(%7B%7D,'cvml','[email protected]');
...—
Reply to this email directly or view it on GitHub
#60 (comment)
.
from minimal-mistakes.
I will see what I can do; if I found a solution, I will post it here. Thanks.
from minimal-mistakes.
I found a weird but possible solution. I added the following to home.html, etc, and the font changed.
Do you know if I can use this to customize styles on heads, paragraphs, etc.?
(Sorry, but I no nothing about html and jekyll)
from minimal-mistakes.
The *
selector targets every element on the page. I wouldn't do that because it's unnecessary. The easiest solution is to work with the .less files I provided. You change the font in one place and it updates everywhere.
Since you're having problems getting Node and Grunt installed on Linux you could just modify the main.min.css
stylesheet instead. That's what the less files compile into. It's just harder to read because it's minified to reduce filesize. And you'll have to update the font-family declarations in numerous locations. Which can be tricky if you have no idea what you're looking at or where to look.
If you're going to modify the main.min.css
file I'd look at CSS Beautify. Copy/paste the css into that site and it will spit out a nicely formatted stylesheet that you can read easily.
Other than me teaching you how to write CSS I think that's about all I can offer 😉
PS: If I remember correctly the majority of the serif font (PT Serif) is applied to the body
element. And the sans-serif font is applied to the headings (h1, h2, h3, h4, etc). If you use something like Chrome or Firefox's dev tools you can right click on an element you want to change and inspect it. Then it will show you exactly what lines in main.min.css
are applying what styles so you can change them to whatever you want.
Hope this helps!
from minimal-mistakes.
Well, thanks a lot! Thanks for your patience as well. I will follow these suggestions.
from minimal-mistakes.
Related Issues (20)
- Highlight color for TOC in the dark skin HOT 1
- Just built a Docker image for the theme
- there is a error that can't fix "An error occurred while installing json (1.8.3)"
- A problem occured when github action was running HOT 2
- Removing the `sticky` tag from the sidebar has no effect
- Deprecation warnings relative to use of / outside of calc, will be removed in Dart Sass 2.0.0 HOT 1
- Breadcrumbs `Home` points to `github.com HOT 1
- Add support for child menues in matheader
- Neon Code Hightlighting Broken
- Search includes asset files HOT 1
- Iam getting this error Can you please help on this HOT 1
- greedy-navigation timeout causes inconsistent behaviour with translucency
- Google analytics update HOT 2
- Accessibility bug: the nav elements across the theme should have an aria-label
- monochrome and color (predefined) icons in author bio HOT 2
- Jekyll plugins HOT 3
- page.url variable pointing to wrong page (post) HOT 3
- Error when installing Theme HOT 1
- setup a ttc skin
- "You may also enjoy" recommends hidden posts, when it probably shouldn't HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from minimal-mistakes.