Skip to content

Make style similar to lab homepage #3

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
KevinRSX wants to merge 1 commit into
base: main
Choose a base branch
from
Open

Make style similar to lab homepage #3

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
166 changes: 114 additions & 52 deletions _includes/semester_page.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,72 +1,134 @@
<!DOCTYPE html>
<html lang="en-us">
<head>
<link href="http://gmpg.org/xfn/11" rel="profile">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="OrderLab Reading Group, {{ include.sem.semester }}">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&family=Space+Grotesk:wght@500;600;700&display=swap">
<link rel="stylesheet" href="{{ site.baseurl }}/assets/css/site.css">
<link rel="icon" type="image/vnd.microsoft.icon" href="{{ site.baseurl }}/assets/favicon.ico">
<title>{{ include.sem.semester }}</title>
<title>{{ include.sem.semester }} · OrderLab Reading Group</title>
</head>

<body>
<div class="row">
<div class="col-1">
</div>
<div class="col-9">
<h1>OrderLab Reading Group</h1>
<h2 class="semester">{{ include.sem.semester }}</h2>
<h3>{{ include.sem.time }}</h3>
<h4>Coordinator: {{ include.sem.coordinator }}</h4>
</div>
<div class="col-2">
</div>
</div>
<div class="row">
<div class="col-1">
<ul class="semesters">
{% assign all_sems = site.semesters | sort: "first_date" | reverse %}
{% for sem in all_sems %}
<li{% if sem.url == include.sem.url %} class="current_semester"{% endif %}>
<a href="{{ sem.url | relative_url }}">{{ sem.semester }}</a>
</li>
{% endfor %}
</ul>
{% assign all_sems = site.semesters | sort: "first_date" | reverse %}

<header class="header_area">
<div class="main_menu">
<nav class="navbar navbar-expand-lg navbar-light">
<div class="container box_1620">
<a class="navbar-brand logo_h" href="{{ '/' | relative_url }}">
<img src="{{ site.baseurl }}/assets/img/logo-transparent.png" alt="OrderLab">
</a>
<div class="collapse navbar-collapse offset" id="navbarSupportedContent">
<ul class="nav navbar-nav menu_nav justify-content-end">
<li class="nav-item"><a class="nav-link" href="https://orderlab.io/" target="_blank" rel="noopener">Lab Home</a></li>
</ul>
</div>
</div>
</nav>
</div>
<div class="col-9">
{{ include.sem.content }}
</header>

<main class="container page">
<div class="page__grid">
<aside class="sidebar" aria-label="Semester archive">
<div class="sidebar__card">
<p class="sidebar__heading">Semesters</p>
<ul class="semesters">
{% for sem in all_sems %}
<li class="semesters__item{% if sem.url == include.sem.url %} semesters__item--active{% endif %}">
<a href="{{ sem.url | relative_url }}">{{ sem.semester }}</a>
</li>
{% endfor %}
</ul>
</div>
</aside>

<h1>Schedule</h1>
<table class="table-bordered schedule">
<tr class="info">
<th class="date">Date</th>
<th class="presenter">Presenter</th>
<th class="title">Title</th>
<th class="conference">Conference</th>
<th class="material">Material</th>
</tr>
<div class="content">
<section class="hero">
<div class="hero__inner">
<h1 class="hero__title">OrderLab Reading Group</h1>
<p class="hero__subtitle">{{ include.sem.semester }}</p>
<div class="hero__meta">
{% if include.sem.time %}
<span class="hero__chip">
<svg class="hero__chip-icon" width="16" height="16" viewBox="0 0 24 24" aria-hidden="true"><path fill="currentColor" d="M12 2a10 10 0 1 0 10 10A10 10 0 0 0 12 2Zm0 18a8 8 0 1 1 8-8 8 8 0 0 1-8 8Zm.5-13H11v6l5.2 3.1.8-1.3-4.5-2.7Z"/></svg>
{{ include.sem.time }}
</span>
{% endif %}
{% if include.sem.coordinator %}
<span class="hero__chip">
<svg class="hero__chip-icon" width="16" height="16" viewBox="0 0 24 24" aria-hidden="true"><path fill="currentColor" d="M12 12a5 5 0 1 0-5-5 5 5 0 0 0 5 5Zm0 2c-3.3 0-10 1.7-10 5v3h20v-3c0-3.3-6.7-5-10-5Z"/></svg>
Coordinator: {{ include.sem.coordinator }}
</span>
{% endif %}
</div>
</div>
</section>

{% for session in include.sem.sessions %}
<tr>
<td>{{ session.date }}</td>
<td>{{ session.presenter }}</td>
<td>
<p class="title">{{ session.title }}</p>
{% if session.authors %}
<p class="authors">{{ session.authors }}</p>
{% endif %}
</td>
<td>{% if session.venue %}{{ session.venue }}{% endif %}</td>
<td>{% if session.link %}<a href="{{ session.link }}">Paper</a>{% endif %}</td>
</tr>
{% endfor %}
</table>
{% if include.sem.content and include.sem.content != "" %}
<section class="card card--content">
{{ include.sem.content }}
</section>
{% endif %}

<section class="card card--schedule">
<header class="card__header">
<h2 class="card__title">Schedule</h2>
<span class="card__count">{{ include.sem.sessions | size }} sessions</span>
</header>
<div class="schedule-wrap">
<table class="schedule">
<thead>
<tr>
<th class="col-date">Date</th>
<th class="col-presenter">Presenter</th>
<th class="col-title">Title</th>
<th class="col-venue">Venue</th>
<th class="col-material">Material</th>
</tr>
</thead>
<tbody>
{% for session in include.sem.sessions %}
<tr>
<td class="col-date"><span class="cell-date">{{ session.date }}</span></td>
<td class="col-presenter"><span class="cell-presenter">{{ session.presenter }}</span></td>
<td class="col-title">
<p class="cell-title">{{ session.title }}</p>
{% if session.authors %}
<p class="cell-authors">{{ session.authors }}</p>
{% endif %}
</td>
<td class="col-venue">
{% if session.venue %}<span class="cell-venue">{{ session.venue }}</span>{% endif %}
</td>
<td class="col-material">
{% if session.link %}
<a class="cell-link" href="{{ session.link }}" target="_blank" rel="noopener">
<svg width="14" height="14" viewBox="0 0 24 24" aria-hidden="true"><path fill="currentColor" d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8Zm-1 7V3.5L18.5 9Z"/></svg>
Paper
</a>
{% endif %}
</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
</section>
</div>
</div>
<div class="col-2">
</main>

<footer class="site-footer">
<div class="container site-footer__inner">
<p>&copy; OrderLab 2017–<script>document.write(new Date().getFullYear());</script>. Reading Group.</p>
<p><a href="https://orderlab.io/" target="_blank" rel="noopener">orderlab.io</a></p>
</div>
</div>
</footer>
</body>
</html>
Loading