AusterweilLab.github.io/index.html at master · AusterweilLab/AusterweilLab.github.io · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
---
layout: default
title: Austerweil Lab | Home
---


<h1>Austerweil Lab</h1>
<p class = 'fancy'>University of Wisconsin-Madison</p>

<div class="marquee">
<table>
<tr>
{% for post in site.categories.news limit:5 %}
<td class='newsitem'>
	<a href='{{post.url}}'>{{post.date | date: "%b %-d %Y"}}</a>:
	{{post.title}}
</td>
{% endfor %}
<td class='newsitem'>
  Click the '<a href='/news'>News</a>' tab above for earlier posts!
</td>
</tr>
</table>
</div>

<!-- <img src="img/misc/BrainOfRobots3.png"> -->
{% include svg.html content="img/misc/lab-logo.svg" %}


<style type="text/css">

.newsitem {
	padding-top: 0.5em;
	padding-bottom: 0.5em;
	min-width: 20em;
}

.marquee td:not(:last-child) {
	padding-right: 2em;
}

.marquee table {
	white-space: normal;
    padding-left: 100%;
    animation: marquee 20s 0.1s linear infinite;
}

.marquee {
	width: 100%;
    white-space: nowrap;
    overflow: hidden;
    box-sizing: border-box;
	border-bottom: 1px solid #607D8B;
	border-top: 1px solid #607D8B;
	margin-bottom: 10px;
	animation-play-state: paused;
}

@keyframes marquee {
    0%   { transform: translate(0, 0); }
    100% { transform: translate(-100%, 0); }
}

.marquee table:hover {
	-moz-animation-play-state: paused;
	-webkit-animation-play-state: paused;
	animation-play-state: paused;
}


#content img {
		max-width: 100%;
		object-fit: scale-down;
		display: block;;
		margin: auto;
	  }
</style>