Commit 21603f19 authored by Andreas Knote's avatar Andreas Knote
Browse files

readme: updates usage / deployment / development instructions

parent 9c55e9df
Pipeline #22693 passed with stage
in 13 minutes and 49 seconds
...@@ -2,35 +2,45 @@ ...@@ -2,35 +2,45 @@
The HCI Theme packaged as a gem. The HCI Theme packaged as a gem.
## How to Build
## Installation To collect all dependencies and webpack the assets:
Add these lines to your Jekyll site's `Gemfile`: ```bash
bundle update
bundle exec rake
```
To build the theme as a gem (includes the asset bundling):
```bash
bundle update
bundle exec rake gem
gem install hci-theme.gem
```
## How to Use
### Referencing the Theme
Add one of these lines to your Jekyll site's `Gemfile`, respective of how you reference the theme.
You can also specify a branch or commit, if desired.
```ruby ```ruby
gem "hci-theme" gem "hci-theme"
gem "jekyll-img-srcset" gem 'hci-theme', :git => 'https://gitlab2.informatik.uni-wuerzburg.de/hci-development/hci-theme.git'
#gem 'hci-theme', :path => "../hci-theme"
``` ```
And add these lines to your Jekyll site's `_config.yml`: And add these lines to your Jekyll site's `_config.yml`:
```yaml ```yaml
theme: hci-theme theme: hci-theme
plugins:
- jekyll-img-srcset
``` ```
And then execute:
$ bundle
Or install it yourself as:
$ gem install hci-theme
## Usage
### Menu ### Menu
The menu is configured in the `_config.yml` file as. The menu is configured in the `_config.yml` file as.
```yaml ```yaml
...@@ -41,6 +51,7 @@ menu: ...@@ -41,6 +51,7 @@ menu:
- title: "Other" - title: "Other"
href: "/other" href: "/other"
``` ```
### Lists ### Lists
1. News 1. News
...@@ -76,6 +87,7 @@ menu: ...@@ -76,6 +87,7 @@ menu:
- `headline`: overrides default headline - `headline`: overrides default headline
### Image Carousel ### Image Carousel
The teaser images at the top can be selected for each page individually with a default in the `_config.yml` as: The teaser images at the top can be selected for each page individually with a default in the `_config.yml` as:
```yaml ```yaml
...@@ -84,7 +96,11 @@ slides: ...@@ -84,7 +96,11 @@ slides:
``` ```
### Image Resizing ### Image Resizing
Images get resized to provide lower resulutions for mobile devices. Select which widths to generate in the `_config.yml` with:
Note: Image resizing is a hot potato. the configuration is not yet honored by the resizing script and only affects the HTML output, not the resizing.
Images get resized to provide lower resulutions for mobile devices.
Select which widths to generate in the `_config.yml` with:
```yaml ```yaml
widths: widths:
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment