matthewelsom / project-jekyllstyleguide Goto Github PK

Thanks for sharing this project. I have similar goals for a style guide and this looks like your work could be a great headstart for my project. I have it cloned locally and have no trouble updating content, but I can't seem to figure out how to update the styles. For example, I've updated the $base-font-family and $base-font-color variables in styleguide/_scss/abstracts/_variables.scss but see no difference from the default styling when I refresh the site. I've enabled the sass configuration lines 37-39 in config.yml (and restarted the server) but that doesn't seem to make a difference

It looks like you're still working on the "Editing the Styleguide" part of the documentation but I'm hoping in the meantime you could explain the steps necessary to update the styleguide styling, such as the default font and, say, the sidebar background color as examples?

It's possible I just don't understand the site structure properly (e.g. what's the relationship between the src and styleguide directories?) but nothing I try is producing style updates. Thanks.

I have very little experience with jekyll but have just this morning spun up a copy of the styleguide generator to kick the tyres. The first issue I encountered was based on our need to embed patterns within other 'larger' patterns. Since most of our projects follow atomic principles its very necessary for us to be able to maintain styles and markup at an atomic level, knowing that changes will propagate upwards into larger components.

With this in mind i opened up the full-width.html example you have in your repo but see that the blockquote markup was hardcoded.

I have made a quick modification to that file to see if i can import an existing pattern, so i added the following lines to see what would happen;

{% assign pattern_url = '/src/patterns/components/blockquote/blockquote.html' %}
{% include pattern_block.html %}

this seemed to work as designed but unfortunately the pattern_block.html template contains both the markup itself and also the title, description, code block etc... which was more than i wanted to embed. So what I have done is created a new template within _includes called pattern_block_raw.html which looks like this;

{% for pattern in site.pages %}
{% if pattern.url contains pattern_url %}

	{{ pattern.content }}

{% endif %}
{% endfor %}

I then updated my include call to use pattern_block_raw.html instead. This works great, but because I dont necessarily understand the workings of jekyll i just wondered if theres a 'cleaner' way to achieve this?

The main reason I ask is that it currently requires 2 lines for each include, and i imagine there was be a way to do this with a single include call? My larger patterns may begin to get cluttered quickly with 2 calls per include, especially when the second call is always the same.