cmlamman.github.io/baoban_comics.html at master · cmlamman/cmlamman.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
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
<!DOCTYPE HTML>
<!--
	Hyperspace by HTML5 UP
	html5up.net | @ajlkn
	Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
-->
<html>
	<head>
		<title>Claire Lamman - BaoBan Comics</title>
		<meta charset="utf-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
		<link rel="stylesheet" href="assets/css/main.css" />
		<noscript><link rel="stylesheet" href="assets/css/noscript.css" /></noscript>
        <style>
            body {
                background-color: #000000; /* Change this to your desired background color */
            }
        </style>
	</head>
	<body class="is-preload">

		<!-- Header -->
			<header id="header">
				<a href="index.html" class="title">Claire Lamman</a>
				<nav>
					<ul>
						<li><a href="index.html">Home</a></li>
						<li><a href="background.html">Background</a></li>
						<li><a href="research.html">My Research</a></li>
						<li><a href="science_art.html">Art & Visualizations</a></li>
					</ul>
				</nav>
			</header>

		<!-- Wrapper -->
			<div id="wrapper">

				<!-- Main -->
					<section id="main" class="wrapper">

						<div class="inner">
							</p>
							<h1 class="major">BaoBan Comics</h1>
						<div>
							</p>

							<p>This a series of comics I made featuring DESI's ambassador, BaoBan. For more information about DESI see <a href="desi.html" class="active">my page</a> and <a href="https://www.desi.lbl.gov/">DESI's website.</a> New comics come out sporadically since I tend to draw them whenever I'm observing and we've been clouded out.
							<hr /><p>


<!-- Slideshow container -->
<div class="slideshow-container">

  <!-- Full-width images with number and caption text -->
  <div class="mySlides fade">
    <div class="numbertext">1 / 6</div>
    <center><img src="images/BaoBan_comics/BaoBan_comic0.png" style="width:80%"></center>

  </div>

  <div class="mySlides fade" style="text-align:center">
    <div class="numbertext">2 / 6</div>
    <center><img src="images/BaoBan_comics/BaoBan_comic1.png" style="width:80%"></center>

  </div>

  <div class="mySlides fade" style="text-align:center">
    <div class="numbertext">3 / 6</div>
    <center><img src="images/BaoBan_comics/BaoBan_comic2.png" style="width:80%"></center>
  </div>

<div class="mySlides fade" style="text-align:center">
    <div class="numbertext">4 / 6</div>
    <center><img src="images/BaoBan_comics/BaoBan_comic3.png" style="width:80%"></center>
  </div>

<div class="mySlides fade" style="text-align:center">
    <div class="numbertext">5 / 6</div>
    <center><img src="images/BaoBan_comics/BaoBan_comic4.png" style="width:80%"></center>
  </div>

<div class="mySlides fade" style="text-align:center">
    <div class="numbertext">6 / 6</div>
    <center><img src="images/BaoBan_comics/BaoBan_comic5.png" style="width:80%"></center>
  </div>


  <!-- Next and previous buttons -->
  <a class="prev" onclick="plusSlides(-1)">&#10094;</a>
  <a class="next" onclick="plusSlides(1)">&#10095;</a>
</div>
<br>


<!-- The numbers -->
<div style="text-align:center">
	<span class="slide-number" onclick="currentSlide(1)">1</span>
	<span class="slide-number" onclick="currentSlide(2)">2</span>
	<span class="slide-number" onclick="currentSlide(3)">3</span>
	<span class="slide-number" onclick="currentSlide(4)">4</span>
	<span class="slide-number" onclick="currentSlide(5)">5</span>
	<span class="slide-number" onclick="currentSlide(6)">6</span>
</div>

		<!-- Footer -->
			<footer id="footer" class="wrapper alt">
				<div class="inner">
					<ul class="menu">
						<li>&copy; All works copyright 2026 Claire Lamman, <a href="https://creativecommons.org/licenses/by-nc/4.0/">CC BY-NC 4.0</a></li><li>Design: <a href="http://html5up.net">HTML5 UP</a></li>
					</ul>
				</div>
			</footer>

		<!-- Scripts -->
			<script src="assets/js/jquery.min.js"></script>
			<script src="assets/js/jquery.scrollex.min.js"></script>
			<script src="assets/js/jquery.scrolly.min.js"></script>
			<script src="assets/js/browser.min.js"></script>
			<script src="assets/js/breakpoints.min.js"></script>
			<script src="assets/js/util.js"></script>
			<script src="assets/js/main.js"></script>

	</body>
</html>