utah-datascience.github.io

utah-datascience.github.io

Jekyll source code of the website for the Utah Center for Data Science.

Utah Data Science Center

Original theme: https://jamstack-argon-design.appseed.us/index.html

Local run

  • For the first time, install jekyll, if windows, you may need further run bundle add webrick. Then run follow in the project root.
    bundle install
    
  • If failed because of gem version incompatible, try
    bundle update
    
    This will update Gemfile.lock.
  • To serve the website locally, run
    bundle exec jekyll serve
    

Content Edit

Images in markdown

To center the image and avoid big images overflow, you can specify the class img-fluid for the image by appending {:class="img-fluid"}, like

![alt text](/path/to/image.jpg){:class="img-fluid"}

img-fluid class has been defined as display: block; margin: auto; max-width: 90%; height: auto.

Image as a figure

We have a figure template for adding a figure to any page. Example code is:

{% include figure.html
src="/assets/img/theme/team-1-800x800.jpg"
max-width="500px"
caption="The caption of the figure." %}

Notes for specific pages.

Members

Add/delete/edit .md files in _members directory to add/delete/edit members.

Director, Associate Director of Research, ... are called roles, order and available values for role are hard coded in members.md file.

Members in the same role are sorted by the file name. Please name them in the format like Lastname-Firstname-Middlename.md. Here is an example file content:

---
name: Jeff M. Phillips
role: Director
title: |
    Associate Professor, School of Computing, University of Utah
link: http://www.cs.utah.edu/~jeffp/
pic: assets/img/member_photos/jeff.png
---
He specializes in designing algorithms for data science.

The available variables are:

Variable Description
name The name of the member to be shown.
role Under which role to diplay the member. Available values are hard coded in members.md file.
title Title of the member to be display under the name. Using block style indicator `
link The link for the photo and name.
pic The photo of the member. It can be an exist link to an image, or a path to the image.

NOTE: The subfolders (affiliated, core, and leadership) under _members have no effects. They exist only for organizing these files. To show member under a role, set the role variable in its .md file with a right value.

progrmas

Add/delete/edit .md files in _progrmas folder to add/delete/edit members.

  • header:
    • title: Header Title, default: None
    • title-color: white|red, default: white
    • excerpt: >
      Excerpt to show under title, default: None
    • excerpt-color: white|black, default: white
    • align: center|left, default: center
    • background-image: default: /assets/img/header-background/zion-shorter.jpg

Layout

  • home Designed for landing page, does not defined a content box.
  • single Designed for content page, predefined a content box to include all content in a white backgound card.

Scheduling Website Changes

You can schedule a website change to occur at 00:01 any day by doing the following:

  1. Create a branch where you will make your changes.
  2. On your branch, make your changes and test them.
  3. Once you’re ready, you need to submit a Pull Request. At the very bottom of your Pull Request description, add /schedule yyyy-mm-dd. Your change will be merged to master at ~12:01 am on this date.

This scheduler is implemented using the Merge Schedule GitHub Action. More information on this can be found here.