-
Notifications
You must be signed in to change notification settings - Fork 74
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
1 changed file
with
69 additions
and
0 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,69 @@ | ||
# hacked-jekyll | ||
|
||
Hacked Jekyll is a responsive, minimalistic Jekyll theme for a tiny (163kb!) personal website. It consists of a homepage and a 404 page. The homepage lists information set within the configuration file in a format that resembles JSON, giving the website a "hacked" appearance. The user description features [typed.js](https://mattboldt.com/demos/typed-js/) to cycle through multiple lines of text, as long as multiple lines are provided in the configuration. | ||
|
||
The style is rebooted through [normalize.css](https://necolas.github.io/normalize.css/) and based on the [Open Color](https://yeun.github.io/open-color/) library. The monospaced typeface [Hack](https://sourcefoundry.org/hack/) is served together with the website. The favicons are generated by [favicon.io](https://favicon.io/). | ||
|
||
See the [demo](https://hacked-jekyll.netlify.app) to check the end result. | ||
|
||
![](https://github.com/piazzai/hacked-jekyll/blob/master/screenshot.png) | ||
|
||
## Installation | ||
|
||
The theme can be installed as usual by cloning this repository and editing the files. However, it is far more convenient to install it as a gem, in which case all the files you do not want or need to customize remain hidden from view, but will still be read and processed during build. | ||
|
||
To install the theme as a gem, you can then add this line to your `Gemfile`: | ||
|
||
```ruby | ||
gem "hacked-jekyll" | ||
``` | ||
|
||
And this line to `_config.yml`: | ||
|
||
```yaml | ||
theme: hacked-jekyll | ||
``` | ||
The easiest way to set up a new website in this way is to clone the contents of the `demo` folder. This provides a working set of files to get you started. | ||
|
||
After you are done creating the basic files, run bundler: | ||
|
||
$ bundle | ||
|
||
Or install the gem yourself as: | ||
|
||
$ gem install hacked-jekyll | ||
|
||
To customize hidden files, you can create new files with the same names and paths. For example, to change the layout of the index page, you can create a `_layouts` folder and a file `index.html` within this folder that contains your custom code. During build, Jekyll will give priority to your files over the theme's. | ||
|
||
## Usage | ||
|
||
All customization happens in the `json` section of `_config.yml`. Eight variables can be set, including the user's name and description (note that this is not the same as site description), path to the CV, address and contact details, homepage, repository, and social profiles. All of these variables are optional. | ||
|
||
The user description and address variables can be set as arrays (default) or single strings. The contact variable can be set as a hash (default) or single string. The profiles variable must necessarily be a hash. | ||
|
||
It is possible to set up the site so that all links open in the same tab (default) or in a new tab. To make links open in a new tab, just add the following line to your `_config.yml` file. | ||
|
||
```yaml | ||
newtab: true | ||
``` | ||
|
||
It is also possible to change the color scheme. If you want to do so, you should create a file called `_sass/base.scss` with the following code: | ||
|
||
```scss | ||
body { | ||
background-color: var(--oc-gray-9); // background color | ||
color: var(--oc-green-4); // color of main text and links | ||
} | ||
a:hover, | ||
a:active { | ||
color: var(--oc-green-5); // hover color of links | ||
} | ||
``` | ||
|
||
The values above are defaults. You can change them to any color you want using hexadecimal codes, base CSS names, or Open Color names as in the example above. In the latter case, please [read the docs](https://yeun.github.io/open-color/documents.html) of the Open Color library to familiarize with the naming convention. | ||
|
||
## Bugs | ||
|
||
If you find any problem using the theme, please [open an issue](https://github.com/piazzai/hacked-jekyll/issues). |