lab8

assignments/lab8/assets/styles/atom-one-light.css

@@ -0,0 +1,96 @@
+/*
+
+Atom One Light by Daniel Gamage
+Original One Light Syntax theme from https://github.com/atom/one-light-syntax
+
+base:    #fafafa
+mono-1:  #383a42
+mono-2:  #686b77
+mono-3:  #a0a1a7
+hue-1:   #0184bb
+hue-2:   #4078f2
+hue-3:   #a626a4
+hue-4:   #50a14f
+hue-5:   #e45649
+hue-5-2: #c91243
+hue-6:   #986801
+hue-6-2: #c18401
+
+*/
+
+.hljs {
+  display: block;
+  overflow-x: auto;
+  padding: 0.5em;
+  color: #383a42;
+  background: #fafafa;
+}
+
+.hljs-comment,
+.hljs-quote {
+  color: #a0a1a7;
+  font-style: italic;
+}
+
+.hljs-doctag,
+.hljs-keyword,
+.hljs-formula {
+  color: #a626a4;
+}
+
+.hljs-section,
+.hljs-name,
+.hljs-selector-tag,
+.hljs-deletion,
+.hljs-subst {
+  color: #e45649;
+}
+
+.hljs-literal {
+  color: #0184bb;
+}
+
+.hljs-string,
+.hljs-regexp,
+.hljs-addition,
+.hljs-attribute,
+.hljs-meta-string {
+  color: #50a14f;
+}
+
+.hljs-built_in,
+.hljs-class .hljs-title {
+  color: #c18401;
+}
+
+.hljs-attr,
+.hljs-variable,
+.hljs-template-variable,
+.hljs-type,
+.hljs-selector-class,
+.hljs-selector-attr,
+.hljs-selector-pseudo,
+.hljs-number {
+  color: #986801;
+}
+
+.hljs-symbol,
+.hljs-bullet,
+.hljs-link,
+.hljs-meta,
+.hljs-selector-id,
+.hljs-title {
+  color: #4078f2;
+}
+
+.hljs-emphasis {
+  font-style: italic;
+}
+
+.hljs-strong {
+  font-weight: bold;
+}
+
+.hljs-link {
+  text-decoration: underline;
+}

assignments/lab8/assets/styles/style.css

@@ -0,0 +1,267 @@
+@import url("https://fonts.googleapis.com/css?family=Karla");
+@import url("https://fonts.googleapis.com/css?family=Roboto+Mono");
+
+html {
+  font-family: Karla, Helvetica, Arial, sans-serif;
+  font-size: 16px;
+  line-height: 1.5;
+}
+
+body {
+  margin: 0;
+  padding: 64px;
+  background-color: #f7f5f2;
+  color: #4c5765;
+}
+
+h1,
+h2,
+h3 {
+  color: #78c272;
+  font-size: 1.5em;
+  font-weight: 700;
+  margin: 1em 0;
+}
+
+p {
+  margin: 1em 0;
+}
+
+a {
+  color: inherit;
+}
+
+a:hover {
+  text-decoration: underline;
+}
+
+img {
+  max-width: 100%;
+}
+
+video {
+  max-width: 100%;
+}
+
+li {
+  margin: 0.5em 0;
+}
+
+pre {
+  padding: 1em;
+  border-radius: 2px;
+  background: #f8f8f8;
+}
+
+code {
+  font-family: "Roboto Mono", monospace;
+  background: #f8f8f8;
+}
+
+pre > code {
+  background: none;
+}
+
+/* Very temporary overflow fix */
+pre {
+  overflow-x: auto;
+}
+
+details {
+  padding: 0 1em;
+  border-radius: 2px;
+  border: 1px solid #ddd;
+}
+
+details > summary {
+  margin: 1em 0;
+}
+
+#container {
+  width: 720px;
+  margin: 0px auto;
+  padding: 32px 0px;
+  background: white;
+  box-shadow: 0px 0px 5px #edeae5;
+  border-radius: 2px;
+  position: relative;
+}
+
+#header {
+  background: #78c272;
+  padding: 16px 32px;
+  color: white;
+  width: 270px;
+}
+
+#header-caption {
+  display: flex;
+  align-items: center;
+  height: 20px;
+  margin-bottom: 8px;
+  opacity: 0.6;
+}
+
+#header-caption > * {
+  flex: none;
+}
+
+#header-caption-logo {
+  width: auto;
+  height: 100%;
+}
+
+#header-caption-name {
+  font-size: 16px;
+  font-weight: 500;
+  margin-left: 4px;
+}
+
+#header-content {
+  display: flex;
+  font-size: 18px;
+  line-height: 20px;
+}
+
+#header-content > * {
+  flex: none;
+}
+
+#header-title {
+  font-weight: 300;
+}
+
+#header-due {
+  font-weight: 300;
+  margin-left: 8px;
+  padding-left: 8px;
+  border-left: 2px solid rgba(255, 255, 255, 0.15);
+}
+
+.section {
+  margin: 32px 0;
+  padding: 0 32px;
+}
+
+.block {
+  margin: 1em 0;
+}
+
+.block-highlight {
+  padding: 8px 16px;
+  background-color: rgba(120, 194, 114, 0.1);
+}
+
+.block-unhighlight {
+  padding: 8px 16px;
+  background-color: white;
+}
+
+.text-center {
+  text-align: center;
+}
+
+.btn {
+  display: inline-block;
+  padding: 8px 16px;
+  text-align: center;
+  background-color: #78c272;
+  color: white;
+  font-weight: 700;
+  text-decoration: none;
+  border-radius: 2px;
+  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12);
+  transition: box-shadow ease 0.2s;
+}
+
+.btn:hover {
+  text-decoration: none;
+  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.16);
+}
+
+.download {
+  background: #78c272;
+  color: white;
+  width: 240px;
+  text-align: center;
+  padding: 15px 0px;
+  border-radius: 2px;
+  font-size: 13px;
+  font-weight: 700;
+  margin: 30px auto;
+  cursor: pointer;
+}
+
+.download_button {
+  text-decoration: none;
+}
+
+.download_button:hover {
+  text-decoration: none;
+}
+
+/* Explorer Section */
+.explorer {
+  transition: all ease 0.2s;
+}
+
+.explorer input[type="checkbox"] {
+  display: none;
+}
+
+.explorer label {
+  position: relative;
+  display: inline-block;
+  padding-left: 40px;
+}
+
+.explorer label::before,
+.explorer label::after {
+  position: absolute;
+  content: "";
+  display: inline-block;
+}
+
+.explorer label::after {
+  position: absolute;
+  top: 12px;
+  left: 16px;
+  width: 8px;
+  height: 8px;
+  border-left: 3px solid white;
+  border-bottom: 3px solid white;
+  transform: rotate(-45deg);
+  transition: all ease 0.2s;
+}
+
+.explorer input[type="checkbox"]:checked ~ label::after {
+  top: 16px;
+  transform: rotate(-135deg) rotateY(180deg);
+}
+
+.explorer .explorer-text {
+  max-height: 0;
+  padding: 0 16px;
+  margin: 0;
+  overflow: hidden;
+  opacity: 0;
+  transition: all ease 0.2s;
+}
+
+.explorer input[type="checkbox"]:checked ~ .explorer-text {
+  max-height: unset;
+  padding: 8px 16px;
+  margin: 1em 0;
+  opacity: 1;
+}
+
+/* Footnotes (href value comes from showdown-footnotes) */
+a[href^="#footnote"] {
+  text-decoration: none;
+  color: #78c272;
+  transition: color ease 0.2s;
+}
+
+a[href^="#footnote"]:hover {
+  color: #46a03e;
+}