johno / pixyll Goto Github PK

Hi there!

I just wanted to dry-run your pixyll theme and cloned the repo etc. Unfortunately, it doesn't work out of the box, if one doesn't run a sass compiler to get a proper pixyll.css file.

Would you mind updating the readme accordingly? Otherwise it could be very annoying for other users.

Also, running trying to compile css/pixyll.scss doesn't work due to error:

Syntax error: Invalid CSS after "-": expected number or function, was "--"
        on line 1 of css/pixyll.scss
  Use --trace for backtrace.

It'd be awesome if the theme can setup OG tags by default for social sharing. https://cooltrainer.org/getting-social-with-jekyll/ has a handy guide. I am going to try my hand at PR-ing this, but creating an issue in the meantime.

@johnotander First of all, congrats for the beautiful work! Followed you to see more of your stuff in future.

As to main point of this issue, have you considered Merriweather as the main font? I'm not saying PT Serif isn't beautiful, just asking :)

#84

Something similar to Lanyon.

http://type-scale.com/
http://practicaltypography.com/

(I'm not sure if you're aware of this.) The position of the title when viewing Pixyll using Safari on an iPad doesn't responsively center, but the nav menu does, leading to the following effect:

(Alternatively, the nav centers when it doesn't need to and the title stays in the right place.)

I am not sure how to debug this while sitting at my computer because the corresponding media queries work well here. Is there something you'd like me to try or information I could provide to help resolve this?

My pull request was denied, but here's a fix for pagination.html:

<div class="pagination clearfix mb1 mt4">
  <div class="left">
    {% if paginator.next_page %}
        <a class="pagination-item" href="{{ site.baseurl }}/page{{paginator.next_page}}">Older</a>
    {% else %}
      <span class="pagination-item disabled">Older</span>
    {% endif %}
  </div>
  <div class="right">
    {% if paginator.previous_page %}
      {% if paginator.page > 2 %}
        <a class="pagination-item" href="{{ site.baseurl }}/page{{paginator.previous_page}}">Newer</a>
      {% else %}
        <a class="pagination-item" href="{{ site.baseurl }}/">Newer</a>
      {% endif %}
    {% else %}
      <span class="pagination-item disabled">Newer</span>
    {% endif %}
  </div>
</div>

Hi,
This is a great theme. I have been using it since last 2 days. I noticed that when

animated is set to true AND
a post is long(-ish) AND
on google chrome browser on Samsung Galaxy S4

The webpage doesn't show up completely. The bottom part of the post doesn't show up. You only see some white space. This does not happen on Firefox browser on Samsung Galaxy S4. I have images of my phone below:

Post clipped on google chrome:

Post correctly showing (not clipped) on mozilla firefox:

You can see it for yourself at http://www.perfectlyrandom.org/pixyll/jekyll/pixyll/2014/06/10/see-pixyll-in-action/ if you have an S4 phone.

I am not sure if issue can be solved by us or if it is the fault of Google chrome on android. I can remove/resolve the issue if we cannot fix it.

Thanks!

There's a bit too much padding so only ~1 post title can be seen, should be closer to 3 for standard mobile viewport sizes.

I have a error like that :
Liquid Exception: Included file '_includes/pagination.html' not found in pixyll/index.html

There's a weird thing happening for me, but I'm not sure tell if it's only for me or not.

I'm running chrome (chromium to be exact) version 37.0.2062.94.

Try opening pixyll.com or aminb.org and pay close attention to the position of navigation links: they are slightly lower than the website title.

Now, refresh the page and they are where they supposed to be!!

This way CSS compression will be integrated with Jekyll, ensuring no new moving parts (Gulp/Grunt) are introduced.

http://jekyllrb.com/docs/assets/

I wanted to open a PR with this commit, but GitHub listed a whole bunch of other commits as well that I didn't want to include, so I ended up not opening a PR for it.

Instead you can manually download and apply the patch or clone this branch and cherry pick the commit.

What are your thoughts on having a smooth and subtle effect when loading the site pages? Maybe something like a top-down fast fade of the page.

Animsition seems like a nice library for this purpose. There's also the more general animate.css.

I understand the effort to keep the theme as simple and as minimalistic as possible, but I do think a subtle not-so-flashy effect could be nice.

OK, so I finally got this running on my website, aminb.org and it's awesome 😃

However, I think

• with the current type face, the beautiful Merriweather, line heights for the paragraphs are a bit too small compared to the font size. Maybe we could decrease the font size a bit, or increase the line heights? Take a look at this page for instance.
• the h1 tags are too big on the post layout and usually even short titles span across multiple lines. Maybe they could become a bit smaller? (here's two examples)

What do you think?

This is a great theme and I love it. I am just not a fan of solarized. I was wondering if it was possible to get syntax highlighting like this: http://demisx.github.io/jekyll/2014/01/13/improve-code-highlighting-in-jekyll.html

I like the color scheme but I especially like the grey background with the oval-shaped code blocks which have solid edges.

I am being picky, I know :).

I spent an evening trying to do this but I couldn't get it to work. Something with character encoding stumbled me.

Much gratitude to anyone who would be willing to help. Thanks!

• Support for Summary card
• Support for Summary Card with large image

Sample code

Assumes additional properties in _config.yaml

{% if page.image.feature %}<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:image" content="{{ site.url }}/images/{{ page.image.feature }}">
{% else %}<meta name="twitter:card" content="summary">
<meta name="twitter:image" content="{% if page.image.thumb %}{{ site.url }}/images/{{ page.image.thumb }}{% else %}{{ site.url }}/images/{{ site.logo }}{% endif %}">{% endif %}
<meta name="twitter:title" content="{% if page.title %}{{ page.title }}{% else %}{{ site.title }}{% endif %}">
<meta name="twitter:description" content="{% if page.description %}{{ page.description }}{% else %}{{ site.description }}{% endif %}">
<meta name="twitter:creator" content="@{{ site.owner.twitter }}">{% endif %}

You might want to add that in order to run your site locally with baseurl: "/repo-name" in _config.yml you'll have to do the following in terminal: jekyll serve --baseurl '' --watch. Note the empty string after --baseurl.

Not only Github pages allow custom 404 pages but also, a 404.md could easily solve this problem if the project is hosted anywhere else

Example: http://pixyll.com/random-url