Skip to content

Commit ab5991d

Browse files
authored
Merge pull request #4 from OrderLab/refactor-style1
Refactor website design
2 parents 53ace85 + 8e61bed commit ab5991d

31 files changed

+2439
-239
lines changed

_config.yml

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6,13 +6,22 @@ description: >- # this means to ignore newlines until "baseurl:"
66
baseurl: "" # the subpath of your site, e.g. /blog
77
url: "" # the base hostname & protocol for your site, e.g. http://example.com
88
github_username: OrderLab
9+
permalink: /blog/:year/:month/:day/:title/
910

1011
# Build settings
1112
markdown: kramdown
1213
theme: minima
1314
plugins:
1415
- jekyll-last-modified-at
1516

17+
defaults:
18+
- scope:
19+
path: ""
20+
type: "posts"
21+
values:
22+
layout: post
23+
author: OrderLab
24+
1625
exclude:
1726
- Gemfile
1827
- Gemfile.lock

_includes/banner.html

Lines changed: 16 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
<div class="main_menu">
33
<nav class="navbar navbar-expand-lg navbar-light">
44
<div class="container box_1620">
5-
<a class="navbar-brand logo_h" href="{{ '/index.html' | relative_url }}"><img src="{{ '/assets/img/logo.png' | relative_url }}" alt=""></a>
5+
<a class="navbar-brand logo_h" href="{{ '/' | relative_url }}"><img src="{{ '/assets/img/logo-gray.png' | relative_url }}" alt="OrderLab"></a>
66
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
77
<span class="icon-bar"></span>
88
<span class="icon-bar"></span>
@@ -11,14 +11,22 @@
1111
<div class="collapse navbar-collapse offset" id="navbarSupportedContent">
1212
{% assign current = page.url | downcase | split: '/' %}
1313
<ul class="nav navbar-nav menu_nav justify-content-end">
14-
<li class="nav-item {% if current[1] == 'index' %}'active'{% endif %}"><a class="nav-link" href="{{ '/index.html' | relative_url }}">Home</a></li>
15-
<li class="nav-item {% if current[1] == 'team' %}'active'{% endif %}"><a class="nav-link" href="{{ '/team.html' | relative_url }}">People</a></li>
16-
<li class="nav-item {% if current[1] == 'news' %}'active'{% endif %}"><a class="nav-link" href="{{ '/news.html' | relative_url }}">News</a></li>
17-
<li class="nav-item {% if current[1] == 'pubs' %}'active'{% endif %}"><a class="nav-link" href="{{ '/pubs.html' | relative_url }}">Publications</a>
18-
<li class="nav-item {% if current[1] == 'projects' %}'active'{% endif %}"><a class="nav-link" href="{{ '/projects.html' | relative_url }}">Projects</a></li>
19-
<li class="nav-item {% if current[1] == 'software' %}'active'{% endif %}"><a class="nav-link" href="{{ '/software.html' | relative_url }}">Software</a></li>
14+
<li class="nav-item {% if current[1] contains 'index' or page.url == '/' %}active{% endif %}"><a class="nav-link" href="{{ '/' | relative_url }}">Home</a></li>
15+
<li class="nav-item {% if current[1] == 'team' %}active{% endif %}"><a class="nav-link" href="{{ '/team/' | relative_url }}">Team</a></li>
16+
<li class="nav-item {% if current[1] == 'pubs' %}active{% endif %}"><a class="nav-link" href="{{ '/pubs/' | relative_url }}">Publications</a></li>
17+
<li class="nav-item {% if current[1] == 'blog' %}active{% endif %}"><a class="nav-link" href="{{ '/blog/' | relative_url }}">Blog</a></li>
2018
<li class="nav-item"><a class="nav-link" href="https://orderlab.io/reading-group" target="_blank">Reading</a></li>
21-
<li class="nav-item {% if current[1] == 'join' %}'active'{% endif %}"><a class="nav-link" href="{{ '/join.html' | relative_url }}">Join</a></li>
19+
<li class="nav-item {% if current[1] == 'join' %}active{% endif %}"><a class="nav-link" href="{{ '/join/' | relative_url }}">Join</a></li>
20+
<li class="nav-item nav-item--theme">
21+
<button
22+
class="theme-toggle"
23+
type="button"
24+
data-theme-toggle
25+
aria-label="Toggle theme"
26+
aria-pressed="false">
27+
<i class="fas fa-adjust theme-toggle__icon" aria-hidden="true"></i>
28+
</button>
29+
</li>
2230
</ul>
2331
</div>
2432
</div>

_includes/head.html

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,16 @@
99

1010
<title>{% if page.title %}{{ page.title | escape }}{% else %}{{ site.title | escape }}{% endif %}</title>
1111

12+
<script>
13+
(function() {
14+
var stored = null;
15+
try { stored = localStorage.getItem("orderlab-theme"); } catch (e) {}
16+
var prefersDark = window.matchMedia && window.matchMedia("(prefers-color-scheme: dark)").matches;
17+
var theme = stored || (prefersDark ? "dark" : "light");
18+
document.documentElement.setAttribute("data-theme", theme);
19+
})();
20+
</script>
21+
1222
<!-- CSS -->
1323
<link rel="shortcut icon" href="{{ '/assets/favicon.ico' | relative_url }}">
1424
<link rel="stylesheet" href="{{ '/vendors/bootstrap/bootstrap.min.css' | relative_url }}">
@@ -17,5 +27,6 @@
1727
<link rel="stylesheet" href="{{ '/vendors/flaticon/flaticon.css' | relative_url }}" />
1828
<link rel="stylesheet" href="{{ '/vendors/owl-carousel/owl.carousel.min.css' | relative_url }}">
1929
<link rel="stylesheet" href="{{ '/assets/css/style.css' | relative_url }}">
30+
<link rel="stylesheet" href="{{ '/assets/css/modern.css' | relative_url }}">
2031
<link rel="stylesheet" href="{{ '/assets/css/site.css' | relative_url }}">
2132
</head>

_layouts/default.html

Lines changed: 3 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,21 +1,13 @@
11
<!DOCTYPE html>
22
<html lang="en-us">
33
{% include head.html %}
4-
<body>
4+
<body class="layout-default page-{{ page.title | default: 'page' | slugify }}">
55
{% include banner.html %}
66

7-
<main class="side-main">
8-
<section class="hero-banner mb-30px">
9-
<div class="container">
10-
<div class="hero-banner--sm__content">
11-
<h1>{{ page.title }}</h1>
12-
</div>
13-
</div>
14-
</section>
15-
<!--================ End banner =================-->
7+
<main class="side-main">
168
{{ content }}
179
{% include footer.html %}
18-
</main>
10+
</main>
1911
{% include bottom.html %}
2012
</body>
2113
</html>

_layouts/home.html

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,12 @@
11
<!DOCTYPE html>
22
<html lang="en-us">
33
{% include head.html %}
4-
<body>
4+
<body class="layout-home page-{{ page.title | default: 'home' | slugify }}">
55
{% include banner.html %}
66
<main class="side-main">
77
{{ content }}
88
{% include footer.html %}
99
</main>
1010
{% include bottom.html %}
1111
</body>
12-
</html>
12+
</html>

_layouts/post.html

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
<!DOCTYPE html>
2+
<html lang="en-us">
3+
{% include head.html %}
4+
<body class="layout-post page-{{ page.title | default: 'post' | slugify }}">
5+
{% include banner.html %}
6+
<main class="side-main">
7+
<section class="section-margin blog-post-page">
8+
<div class="container">
9+
<article class="blog-post">
10+
<header class="blog-post__header">
11+
<p class="blog-post__eyebrow">OrderLab Blog</p>
12+
<h1>{{ page.title }}</h1>
13+
<div class="blog-post__meta">
14+
<span>{{ page.date | date: "%b %-d, %Y" }}</span>
15+
{% if page.author %}<span>{{ page.author }}</span>{% endif %}
16+
{% if page.last_modified_at %}<span>Updated {{ page.last_modified_at | date: "%b %-d, %Y" }}</span>{% endif %}
17+
</div>
18+
</header>
19+
<div class="blog-post__content">
20+
{{ content }}
21+
</div>
22+
<footer class="blog-post__footer">
23+
<a class="blog-hub__read" href="{{ '/blog/' | relative_url }}">Back to all posts</a>
24+
</footer>
25+
</article>
26+
</div>
27+
</section>
28+
{% include footer.html %}
29+
</main>
30+
{% include bottom.html %}
31+
</body>
32+
</html>

_layouts/single.html

Lines changed: 1 addition & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,10 @@
11
<!DOCTYPE html>
22
<html lang="en-us">
33
{% include head.html %}
4-
<body>
4+
<body class="layout-single page-{{ page.title | default: 'page' | slugify }}">
55
{% include banner.html %}
66

77
<main class="side-main">
8-
<section class="hero-banner mb-30px">
9-
<div class="container">
10-
<div class="hero-banner--sm__content">
11-
<h1>{{ page.title }}</h1>
12-
</div>
13-
</div>
14-
</section>
15-
<!--================ End banner =================-->
168
<section class="section-margin">
179
<div class="container">
1810
{{ content }}
Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
---
2+
title: Launching the OrderLab Blog
3+
author: Ryan Huang
4+
---
5+
6+
We have added a dedicated blog to the lab website to share technical updates in a faster, more narrative format than conference papers.
7+
8+
Posts here will usually cover:
9+
10+
- research ideas in progress,
11+
- implementation notes from lab systems,
12+
- paper highlights and context,
13+
- and student milestones.
14+
15+
For archival milestones and announcements, the [News]({{ '/news/' | relative_url }}) page remains the canonical timeline.
Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
---
2+
title: Writing Posts for This Site
3+
author: OrderLab
4+
---
5+
6+
Blog entries are standard Jekyll posts. Create a markdown file under `_posts/` with this naming pattern:
7+
8+
`YYYY-MM-DD-title.md`
9+
10+
Recommended front matter:
11+
12+
```yaml
13+
---
14+
title: Your Post Title
15+
author: Your Name
16+
---
17+
```
18+
19+
The site will automatically:
20+
21+
- list the post on `/blog/`,
22+
- render it with the post layout,
23+
- and include the newest posts on the homepage.

_scss/style.scss

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,7 @@
1111
@import "theme/btn";
1212
@import "theme/footer";
1313
@import "theme/projects";
14-
@import "theme/publications";
15-
@import "theme/news";
16-
@import "theme/about";
14+
@import "theme/publications";
15+
@import "theme/news";
16+
@import "theme/about";
17+
@import "theme/modern";

0 commit comments

Comments
 (0)