Giter VIP home page Giter VIP logo

hydecorp / hydejack Goto Github PK

View Code? Open in Web Editor NEW

This project forked from poole/hyde

1.4K 28.0 784.0 56 MB

A boutique Jekyll theme for hackers, nerds, and academics

Home Page: https://hydejack.com

License: Other

HTML 17.08% CSS 1.55% JavaScript 32.83% Ruby 0.36% SCSS 48.18%
jekyll blog blogging theme resume portfolio math latex jekyll-theme resume-template personal-website sidebar portfolio-template github-pages

hydejack's Introduction

Hydejack

A boutique Jekyll theme for hackers, nerds, and academics.

Screenshot

Hydejack's cover page on a variety of screens.

Hydejack is a boutique Jekyll theme for hackers, nerds, and academics, with a focus on personal sites that are meant to impress.

It includes a blog that is suitable for both prose and technical documentation, a portfolio to showcase your projects, and a resume template that looks amazing on the web and in print.

Your complete presence on the web — A blog, portfolio, and resume.

A Personal Site That Won't Disappear

Hydejack is 100% built on Open Source software, and is Open Source itself, save for parts of the PRO version. The PRO version is a one-time payment that gives you the right to use it forever.

Hydejack is all static sites. HTML. All you need is a web server --- any web server --- to have a professional web presence that lasts a lifetime.

Download

There are two versions of Hydejack: The Free Version includes basic blogging functionality and most of Hydejack's Features, such as dynamic page loading and advanced animations.

The PRO Version includes additional features for professionals, such as a portfolio, resume, Dark Mode, Forms, Built-In Search and customizable cookie banners.

The table below shows what's included in each version:

Free PRO
Blog
Features
Documentation
Portfolio
Printable Resume
Dark Mode
Built-In Search
Custom Forms
Newsletter Box
Grid layout
Offline Support
Table of Contents1
Cookie Banner
No Hydejack Branding
License GPL-3.0 PRO
Source GitHub Included
Price / Upgrade Free $99 / $39 2
Download
-- or --
Deploy to Netlify
Buy PRO

Hydejack started out as a free blogging theme for Jekyll — and continues to be so.

An Impressive Portfolio

A portfolio that's guaranteed to be impressive — no matter what you put into it.

A Printable Resume

Get a resume that's consistent across the board — whether it's on the web, mobile, print, or PDF.

Resume PDF

Front and center page of a print resume generated by Hydejack.

Just Markdown

Write all content with Markdown. Hydejack gives you additional CSS classes to stylize your content, without losing compatibility with other Jekyll themes.

Just Markup

Hydejack boasts a plethora of modern JavaScript, but make no mistake: It's still a plain old web page at its core. It works without JavaScript and you can even view it in a text-based browser like w3m:

w3m Screenshot

The Hydejack blog, as seen by the text browser w3m.

Syntax Highlighting

Hydejack features syntax highlighting, powered by Rouge.

// file: `example.js`
document.querySelector("hy-push-state").addEventListener("hy-push-state-load", () => {
  const supportsCodeHighlights = true; //!!
});

Code blocks can have a filename and a caption.

Beautiful Math

They say math is beautiful — and with Hydejack's math support it's guaranteed to also look beautiful:

Math example

Hydejack uses KaTeX to efficiently render math.

Build an Audience

The PRO version has built-in support for customizable Tinyletter newsletter subscription boxes.

If you are using a different service like MailChimp, you can build a custom newsletter subscription box using Custom Forms.

Features

An incomplete list of features included in all versions of Hydejack:

  • Responsive layout with unique design features for every screen size
  • Cover Pages for a stunning fist impression.
  • Customizable sidebar and touch-enabled drawer menu
  • Single Page Web App-style page loading
  • Advanced FLIP animations, inspired by Material Design
  • Good Google PageSpeed Score3
  • Syntax highlighting, powered by Rouge
  • LaTeX math blocks, rendered with ether KaTeX or MathJax at your choice
  • Soft-coded labels: Change wording or translate to other languages via a single file
  • Support for categories and tags
  • Author section below each article and support for multiple authors
  • Built-in icons for many social networks
  • Simple and semantic HTML + Structured Data
  • Google Analytics and Google Fonts support

Comparison

There are two versions of Hydejack: The Free Version includes basic blogging functionality and most of Hydejack's Features, such as dynamic page loading and advanced animations.

The PRO Version includes additional features for professionals, such as a portfolio, resume, Dark Mode, Forms, Built-In Search and customizable cookie banners.

The table below shows what's included in each version:

Free PRO
Blog
Features
Documentation
Portfolio
Printable Resume
Dark Mode
Built-In Search
Custom Forms
Newsletter Box
Grid layout
Offline Support
Table of Contents1
Cookie Banner
No Hydejack Branding
License GPL-3.0 PRO
Source GitHub Included
Price / Upgrade Free $99 / $39 2
Download
-- or --
Deploy to Netlify
Buy PRO

*[FLIP]: First-Last-Invert-Play. A coding technique to achieve performant page transition animations.

Footnotes

  1. Large screens (> 1664px width) only. 2

  2. Upgrading from Hydejack 8? Find your discount code in the latest zip download! 2

  3. Actual page load speed depends on your hosting provider, resolution of embedded images and usage of 3rd party plugins.

hydejack's People

Contributors

benbalter avatar chrisdwheatley avatar gionn avatar imgbotapp avatar johnlauck avatar joseph-r-hamilton avatar mdo avatar parkr avatar pborreli avatar qwtel avatar rmgrimm avatar swebra avatar sylvainemery avatar thaiphan avatar thebinarypenguin avatar tourorist avatar tseknet avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

hydejack's Issues

accent_color and accent_image have no effect

Hello,

I installed hydejack according to the documentation using the gem method and copied the _config.yml from master.

My repo: https://github.com/rriemann/www.radio-blue.eu
online (via netlify): http://www.radio-blue.eu

Unfortunately, I did not succeed to change the accent color. Maybe this is due to the theme-mode.

I tripple-checked everything, but could not track down the problem. I also tried to set in e.g. about.md the accent_color explicitly and it did not have any effect.

Search form

Hi there! I love you theme. It working good on my local dev right now. How I can enable search option inside my jekyll?

Why use loadJSDeferred

So, I've noticed that whenever in the config we have load_google_fonts when each page loads the following happens:

  1. Page loads (some ms)
  2. All fonts change from default one to the google font, which could include a small rescaling (some ms)
  3. The social network icons get drawn, which could slightly push the other text in the nav bar up.

So this basically leads to the loadJSDeferred. I was just wondering why is it the case, specially for a very fast static page, that you want to deffered it?

PS: Just to explain how I fixed it: I've removed the deferred load from site js and google fonts, made the body hidden, and on window.load made the body visible. Even with slow internet this loads extremely fast, but there are no visible glitches happening.

Disable favicon

How can I disable or change favicon? I was edit head.html and change some configs but I didn't can it.

Need help with setup

Good day, I read Wiki, but there did not specify what to delete and what not

I'm not going to change the theme, just want to write to configure it to write posts

What I can safely remove?

Broken code block

Current layout:
screenshot from 2017-11-02 11-50-37

In my opinion the code block's scroll bar and content should be limited to the red outline as depicted in the follow image:
screenshot from 2017-11-02 11-50-37_edit

Hydejack pro comments issue

I enable the disqus: SHORTNAME and use comments: true for each of my posts md based on the document. But when I comment on one post, I can also see this post on another post. Is it possible to create different comment session for different post blog pages?

For example, I have blog A and blog B. I write "test for A" below blog A. But I can also see this comment "test for A" below blog B. I thinks this is an issue.

Dependency not public

Running bundler install yields:

Permission denied (publickey).
fatal: Could not read from remote repository.

Please make sure you have the correct access rights
and the repository exists.
Git error: command `git clone '[email protected]:qwtel/jekyll-relative-links.git'
"/var/lib/gems/2.3.0/cache/bundler/git/jekyll-relative-links-ca9d6a444f8c55b7e4d43a66d6edf18cf0419e5f" --bare --no-hardlinks

AMP support

You layout is rendering superb fast now. It is possible to extend this theme with AMP?

Lanyon style header + sidebar?

Lanyon was one of the original "implementations" of Poole, similar to Hyde which this template is based on.

Has anyone already modified Hydejack to to have a Lanyon style header and sidebar?

This would probably mean to center the main page content, add a header, show the burger all the time (and optionally make the opened menu push the page content instead of overlaying it).

Build Warning: Layout 'home' requested in index.md does not exist.

From my previous issue #8, I get this issue after run serve command

$ jekyll serve
Configuration file: /var/www/html/jekyll/_config.yml
Configuration file: /var/www/html/jekyll/_config.yml
            Source: /var/www/html/jekyll
       Destination: /var/www/html/jekyll/_site
 Incremental build: disabled. Enable with --incremental
      Generating... 
     Build Warning: Layout 'home' requested in index.md does not exist.
                    done in 1.601 seconds.
 Auto-regeneration: enabled for '/var/www/html/jekyll'
Configuration file: /var/www/html/jekyll/_config.yml
    Server address: http://127.0.0.1:4000/hydejack/
  Server running... press ctrl-c to stop.

Can't have quotation marks (") as the first character in caption tag

When creating a project, if there is a quotation mark as the first character in the caption, Jekyll will provide an error.

Using the documentation example, we can see that the following works fine.

---
layout: project
title: Hyde v2*
date: 2 Jan 2014
screenshot:
  src: /hydejack/assets/img/projects/hyde-v2@0,25x.jpg
  srcset:
    1920w: /hydejack/assets/img/projects/hyde-v2.jpg
    960w: /hydejack/assets/img/projects/hyde-v2@0,5x.jpg
    480w: /hydejack/assets/img/projects/hyde-v2@0,25x.jpg
caption: Hyde is a brazen two-column Jekyll theme.
description: >
  Hyde is a brazen two-column [Jekyll](http://jekyllrb.com) theme that pairs a prominent sidebar with uncomplicated content. It's based on [Poole](http://getpoole.com), the Jekyll butler.
links:
  -
    title: Demo
    url: http://hyde.getpoole.com
  -
    title: Source
    url: https://github.com/poole/hyde
author: mdo
---

However, if we change the caption: tag to caption: "Hyde is ..., (shortened for readability) we get the following error:

Error: could not read file [file location]/[file name]: (<unknown>): found unexpected end of stream while scanning a quoted scalar at line 11 column 10

This is an appropriate error message, indicating the correct position of the fraudulent quotation mark. However, if we use the quotation mark in a more realistic sense, changing caption: "Hyde is ... to caption: "Hyde" is ... (note the new, closing quotation mark) we get the following error that does not indicate the correct position of the error.

Error: could not read file [file location]/[file name]: (<unknown>): did not find expected key while parsing a block mapping at line 2 column 1

If this cannot be fixed, it should at least be included in the documentation IMO, simply due to the difficulty in finding the error.

Feature idea: Comply with EU cookie law (get consent or track differently)

Hello,

the template promotes a configuration of Google Analytics that requires consent which is usually acquired using a cookie consent banner.

https://github.com/insites/cookieconsent

Their website: https://cookieconsent.insites.com/demos/

Alternatively, some people change the google default tracking code to increase privacy so that no consent is required anymore:

https://www.themarketingtechnologist.co/setting-up-a-cookie-law-compliant-google-analytics-tracker/

It would be nice if one boolean value could be switched in the _config.yml to comply. :)

Social links not displaying icons except github and twitter in gem-based theme

Social links other than github and twitter show up as the "link" symbol instead of the expected email, stackoverflow, etc icon.

I've traced the problem as far as the theme (7.0.0) or Jekyll (3.6.2) not loading site.data.social nor default:site.data_social from the gem. If I copy _data/social.yml to my project directly, site.data.social is populated and everything works as intended.

Don't know about Jekyll's data loading mechanisms, obviously it works elsewhere since the _data/strings.yml looks to be there (by the fact that I see the strings).

Sidebar image on post

Hi, after upgrading to version 7.3.0 the side bar image does't work anymore
My post are like this

layout: post
title: Hello
tags: [personal]
#categories: [robot]
image: '/assets/img/robot.jpg'

Dependency Error: Yikes! It looks like you don't have jekyll-sitemap or one of its dependencies installed.

Hi there! I am new with jekyll. I created new jekyll then download you repo, extract and replace the files.
Then when I want to check my new jekyll via serve command, I get this error

$ jekyll serve
Configuration file: /var/www/html/jekyll/_config.yml
Configuration file: /var/www/html/jekyll/_config.yml
  Dependency Error: Yikes! It looks like you don't have jekyll-sitemap or one of its dependencies installed. In order to use Jekyll as currently configured, you'll need to install this gem. The full error message from Ruby is: 'cannot load such file -- jekyll-sitemap' If you run into trouble, you can find helpful resources at http://jekyllrb.com/help/! 

Clickable Image?

I'd like to be able to click an image and show the larger version. This occurs with html or markdown image links. It shows a small spinner but does nothing.

Here's an example of a link that fails on the spinner

[![Testing](/assets/img/test.jpg)](/assets/img/test.jpg)

This is the error it produces.

hydejack.js?v=6.6.1:14 TypeError: Cannot read property 'querySelectorAll' of null
    at hydejack.js?v=6.6.1:14
    at Array.forEach (<anonymous>)
    at e.value (hydejack.js?v=6.6.1:14)
    at e.value (hydejack.js?v=6.6.1:14)
    at e._next (hydejack.js?v=6.6.1:14)
    at e.next (hydejack.js?v=6.6.1:14)
    at e.notifyNext (hydejack.js?v=6.6.1:14)
    at e._next (hydejack.js?v=6.6.1:14)
    at e.next (hydejack.js?v=6.6.1:14)
    at t.observe (hydejack.js?v=6.6.1:14)

Displaying/linking to PDFs

Awesome theme, thank you so very much for making it available!

I am having problems on the latest chrome and safari for mac loading linked PDF files.

I am using a bit of markdown code like this on a freshly cloned repo:

Link to a PDF [here]({{ site.baseurl }}/BGGN213_F17_syllabus.pdf).

When served up and you click on the link it hangs in a loading like state on both browsers (sidebar still shows with a blank right hand side little loading icon). If you refresh the page the PDF displays fine.

Am I doing something wrong?
Thanks again!

Installing a plugin with _config.yml

Option 2 in this docs doesn't work https://jekyllrb.com/docs/plugins/

As stated

In your _config.yml file, add a new array with the key gems and the values of the gem names of the plugins you’d like to use.

My current example:

gems: [jekyll-feed, jekyll-paginate, jekyll-docs]

After gem install jekyll-paginate and gem install jekyll-docs the result of gem list --local:

*** LOCAL GEMS ***

addressable (2.5.0)
bigdecimal (default: 1.3.0)
bundler (1.14.6)
colorator (1.1.0)
did_you_mean (1.1.0)
ffi (1.9.18)
forwardable-extended (2.6.0)
io-console (default: 0.4.6)
jekyll (3.4.3)
jekyll-docs (3.4.3)
jekyll-feed (0.9.2, 0.9.1)
jekyll-paginate (1.1.0)
jekyll-sass-converter (1.5.0)
jekyll-watch (1.5.0)
json (default: 2.0.2)
kramdown (1.13.2)
liquid (3.0.6)
listen (3.0.8)
mercenary (0.3.6)
minima (2.1.0)
minitest (5.10.1)
net-telnet (0.1.1)
openssl (default: 2.0.3)
pathutil (0.14.0)
power_assert (0.4.1)
psych (default: 2.2.2)
public_suffix (2.0.5)
rake (12.0.0)
rb-fsevent (0.9.8)
rb-inotify (0.9.8)
rdoc (default: 5.0.0)
rouge (1.11.1)
safe_yaml (1.0.4)
sass (3.4.23)
test-unit (3.2.3)
xmlrpc (0.2.1)

There are still errors

  Dependency Error: Yikes! It looks like you don't have jekyll-paginate or one of its dependencies installed. In order to use Jekyll as currently configured, you'll need to install this gem. The full error message from Ruby is: 'cannot load such file -- jekyll-paginate' If you run into trouble, you can find helpful resources at https://jekyllrb.com/help/! 
jekyll 3.4.3 | Error:  jekyll-paginate

And

You must install the 'jekyll-docs' gem to use the 'jekyll docs' command. 

I had to do option 3 as well from https://jekyllrb.com/docs/plugins/

Add the relevant plugins to a Bundler group in your Gemfile. Now you need to install all plugins from your Bundler group by running single command bundle install

So I edited my Gemfile

# If you have any plugins, put them here!
group :jekyll_plugins do
   gem "jekyll-feed", "~> 0.6"
   gem "jekyll-paginate"
   gem "jekyll-docs"
end

and run bundle install. Now it works, but documentation says

_plugins, _config.yml and Gemfile can be used simultaneously. You may use any of the aforementioned plugin options simultaneously in the same site if you so choose. Use of one does not restrict the use of the others.

But the second option is broken. This looks like a bug.

Lots of white space before content in Hydejack 6.3 with Internet Explorer 11

When opening a Hydejack 6.3 page in Internet Explorer 11 (Windows 10), I am shown a blank page on the right hand side. To see any content, I have to scroll down first. The menu also flickers heavily while scrolling. Strangely, when clicking on a project-card, the whitespace error goes away (until reloading the page). A colleague experienced the same problem in IE. I have not experienced the problem in any other browser (including Edge).

I have uploaded a video of the behavior on github.

Thanks a lot for the great template!

Unable to install gems

Asks for password when I run command bundle install

Your user account isn't allowed to install to the system RubyGems.
You can cancel this installation and run:

  bundle install --path vendor/bundle

to install the gems into ./vendor/bundle/, or you can enter your password
and install the bundled gems to RubyGems using sudo.

Password:

Is there a way to change the background color of inline code spans?

@qwtel I'm talking specifically about the code generated between single ticks. Now, I've changed the _syntax.scss which changes the highlighting of the code blocks, but I wanna just change the background color of the text in single ticks. Is that possible?

By investigating the CSS I've found that the code tag needs a certain background color and text color property in the CSS in _site folder. That's what I'm trying to achieve. What would be the best way to go about this?

Thanks for all your help and hard work, man!

Random Sidebar Image

I'd like to add an option to use a random sidebar image by adding something to the front matter. I messed around and was able to get the sidebar to be random if no front matter IMAGE was present by putting some code in the my-scripts under the "document.getElementById('_yPushState').addEventListener('y-push-state-start', function() , but it was missing out on the fade in animation. What would be the best way to achieve this?

Project page displaying videos

I would like to use the project page layout to display screencast videos.
Basically I want folks to be able to click on the displayed static image and let it play the video from Vimeo or youtube.

See: < https://bioboot.github.io/bggn213_f17/projects/welcome-screencast/ >

What would be the best way to do this beyond editing the _layouts/project.html as I don't want things to break with future updates. Maybe a new layout? What would you suggest?
Thanks!

Support for superscript tag

Markdown doesn't have native support for the superscript (<sup>) tag, but it doesn't generally interfere with using native HTML to display a superscript tag. It appears that in hydejack by default instead of rendering <sup>1</sup> as "¹", it just displays it as a "1".

Instead I've temporarily moved to using this syntax that I'd prefer to avoid:

<a href="#-">¹</a>

#### ¹ text

Let me know if there's any more info you'd like for me to provide.

Thanks a lot!

First #Heading in a post is being taken as the post TITLE

just upgraded to PRO v7.4.2 and now having this issue.

what's happening is under my /blog/ section, any post which has ANY # heading right after the front matter is being listed as post title in the list of posts, and then when you click through, it is specified as that posts title.

e.g.

---
layout: post
title: ESXI 5.5 Free Version Reference Manual
description: >
  notes on keeping and runing a free esxi version which misses out on various functional/handy paid-for features. this will be an on-going document so I might pin it somewhere.
categories: [howto, infrastructure]
tags: [automation, esxi, vmware, ansible]
author: [ronamosa]
published: true
---

# Overview
this will be a work in progress and probably needs to be laid out, categorized better to be able to find stuff.

will list the post as "Overview", and the post heading on the article will also be "Overview", and the "title" will be nowhere to be found.

you can see it live here: https://ronamosa.github.io/blog/

funnily enough it works as expected when I run it locally with bundle exec jekyll serve but when pushed to GH pages only then do I see this issue.

can you please advise which function might be responsible for doing this? can provide any other info you'd need for troubleshooting. thanks.

Including a link to a blog page in sidebar creates multiple links for blog pages!

Hey, @qwtel love your work - it's the perfect theme to customize for a noob and poor student like me!

However, I'm facing an odd problem. Look at this.

Agian, owing to the fact that I'm a poor student who couldn't afford your pro version, I'm just trying to recreate the blog from scratch. Everything is working perfectly, except, I created a separate folder called article that contains an index.html containing the following code:

---
layout 	: blog
title 	: Articles
menu	: true
order	: 1
---

If what I'm inferring is right, the jekyll-paginate module has ensured that any page using the format of article/index.html, will be created with the exact same format. Thus, when jekyll-paginate creates pages such as article/page/2, article/page/3 and so on, each get their own separate link in the sidebar.

I really need to control this behavior. How can I fix it? Please help!!

Intermittent double render

I can't quite pin down exactly when this happens. I've seen it on new page loads with no browser cache, but sometimes new page loads seem to work OK. Most easily reproduced on Safari because Chrome only lets you disable cache with the developer tools open, which can trigger their own weird behaviors. Here's a repro video.

Also, would it be easy to turn off the fade down animation? I personally find it distracting, and as a bonus you wouldn't notice the double render as much.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo 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.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.