GithubHelp home page GithubHelp logo

in-toto.github.io's Introduction

Jekyll in-toto website

In-toto's project website is created with Jekyll and extends the GitHub pages slate theme.

The site is available at https://in-toto.io

Maintenance and re-use

Basic commands

GitHub pages are served directly from the repository. No pre-building necessary. For development deployment I recommend the following commands (requires jekyll to be installed and available on your path):

# Automatic verbose re-build whenever sources change
jekyll build --watch --verbose

# Development server available on http://127.0.0.1:4000
jekyll serve

Changing the header

Set the variables title, description and logo_url in _config.yml to customize the header. These variables are used in _layouts/default.html to populate the header.

Changing the menu

The menu is populated from the YAML file in _data/navbar.yml. It should be enough to just customize this file. The menu has two levels. On the first level you can specify a text and either a url or a sub (not both). If url is specified the menu item will link to that url. If sub items are specified, hovering over a menu item will open a dropdown menu, showing the sub items. Sub items also have a text and a url that can be used analogously. Additionally, subitems have a boolean external variable that, if set to true, adds a little external link icon next to the link text.

The menu is styled in _sass/navbar.scss and its markup can be found in _includes/navbar.html, which is included in the default layout.

Changing the footer

Just customize _includes/footer.html.

General styles and layouts

Base styles are inherited from _sass/jekyll-theme-slate.scss and _sass/rouge-github.scss. You should not modify those styles, but rather override them in your own _sass/*.scss or in _sass/main.scss, where currently all custom styles are defined. All styles are included in assets/css/style.scss, which gets compiled to css on jekyll build. The resulting assets/css/style.css is included in the default layout.

Customizing and adding content

Adding content is as simple as creating *.html, or *.md files and filling them with content. Additionally, you should specify at least two properties in each file's YAML front matter section, to tell jekyll that you want to embed your content in the default layout and to give the container in which your content will be placed a unique CSS id. This is what front matter looks like:

---
layout: default
css_id: my-funky-page
---

When running jekyll build each file in the project directory gets processed, e.g. embedded in the the specified layout, and, in the case of markdown, converted to HTML. The result is copied to the build directory, i.e. _site, preserving relative paths, but changing the file extension to .html. You can read more about creating pages in the jekyll docs.

Adding assets

Add assets, e.g. images or JavaScript, to assets.

Replace favicon.ico

favicon.ico should be served from the root of the project. Just replace the current one with the favicon.ico of your project.

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.