decouple css

6 files changed, 404 insertions, 398 deletions

diff --git a/layouts/partials/font_body.html b/layouts/partials/font_body.html
deleted file mode 100644
index e79c1f4..0000000
--- a/layouts/partials/font_body.html
+++ /dev/null
@@ -1,26 +0,0 @@
-<style>
-  @font-face {
-    font-family: "TiemposText";
-    src: url("https://www.bu.edu/cdn/fonts/TiemposText/TiemposText-Regular.eot");
-    src: url("https://www.bu.edu/cdn/fonts/TiemposText/TiemposText-Regular.eot?#iefix") format("embedded-opentype"),
-    url("https://www.bu.edu/cdn/fonts/TiemposText/TiemposText-Regular.woff") format("woff");
-    font-style: normal;
-    font-weight: 400;
-  }
-  @font-face {
-    font-family: "TiemposText";
-    src: url("https://www.bu.edu/cdn/fonts/TiemposText/TiemposText-Regular-Italic.eot");
-    src: url("https://www.bu.edu/cdn/fonts/TiemposText/TiemposText-Regular-Italic.eot?#iefix") format("embedded-opentype"),
-    url("https://www.bu.edu/cdn/fonts/TiemposText/TiemposText-Regular-Italic.woff") format("woff");
-    font-style: italic;
-    font-weight: 400;
-  }
-  @font-face {
-    font-family: "TiemposText";
-    src: url("https://www.bu.edu/cdn/fonts/TiemposText/TiemposText-Semibold.eot");
-    src: url("https://www.bu.edu/cdn/fonts/TiemposText/TiemposText-Semibold.eot?#iefix") format("embedded-opentype"),
-    url("https://www.bu.edu/cdn/fonts/TiemposText/TiemposText-Semibold.woff") format("woff");
-    font-style: normal;
-    font-weight: 600;
-  }
-  </style>
diff --git a/layouts/partials/font_title.html b/layouts/partials/font_title.html
deleted file mode 100644
index ba85cb7..0000000
--- a/layouts/partials/font_title.html
+++ /dev/null
@@ -1,10 +0,0 @@
-<style>
-  @font-face {
-    font-family: "TiemposHeadline";
-    src: url("https://www.bu.edu/cdn/fonts/TiemposHeadline/TiemposHeadline-Regular.eot");
-    src: url("https://www.bu.edu/cdn/fonts/TiemposHeadline/TiemposHeadline-Regular.eot?#iefix") format("embedded-opentype"),
-    url("https://www.bu.edu/cdn/fonts/TiemposHeadline/TiemposHeadline-Regular.woff") format("woff");
-    font-style: normal;
-    font-weight: 400;
-  }
-  </style>
diff --git a/layouts/partials/header.html b/layouts/partials/header.html
index 9b7fd5e..74d2616 100644
--- a/layouts/partials/header.html
+++ b/layouts/partials/header.html
@@ -9,9 +9,6 @@
   <meta name="referrer" content="no-referrer">
   {{ if .Site.Params.description }}<meta name="description" content="{{ .Site.Params.description }}">{{ end }}
 
-  {{ partial "font_title.html" . }}
-  {{ partial "font_body.html" . }}
-
   <link rel="icon" type="image/png" href="/favicon.png">
 
   <title>
@@ -24,7 +21,8 @@
   </title>
   <link rel="canonical" href="{{ .Permalink }}">
 
-  {{ partial "styles.html" . }}
+  <link rel="stylesheet" href="{{ "/css/fonts.css" | relURL }}" />
+  <link rel="stylesheet" href="{{ "/css/style.css" | relURL }}" />
 
   {{ if .RSSLink }}
   <link href="{{ .RSSLink }}" rel="alternate" type="application/rss+xml" title="{{ .Site.Title }}" />
diff --git a/layouts/partials/styles.html b/layouts/partials/styles.html
deleted file mode 100644
index 671ac1b..0000000
--- a/layouts/partials/styles.html
+++ /dev/null
@@ -1,358 +0,0 @@
-<style>
-  * {
-    border: 0;
-    font: inherit;
-    font-size: 100%;
-    vertical-align: baseline;
-    margin: 0;
-    padding: 0;
-    color: #333;
-    text-decoration-skip: ink;
-  }
-
-  body {
-    font-family: "TiemposText", Georgia, Times, "Times New Roman", serif;
-    font-size: 16px;
-    line-height: 160%;
-    color: #333;
-    max-width: 700px;
-    margin: auto;
-  }
-
-  p {
-    margin: 20px 0;
-  }
-
-  a img {
-    border: none;
-  }
-
-  img {
-    margin: 10px auto 10px auto;
-    max-width: 100%;
-    display: block;
-  }
-
-  .left-justify {
-    float: left;
-  }
-
-  .right-justify {
-    float: right;
-  }
-
-  pre, code {
-    font: 12px Consolas, "Liberation Mono", Menlo, Courier, monospace;
-    background-color: #f7f7f7;
-  }
-
-  code {
-    font-size: 14px;
-    padding: 4px;
-  }
-
-  pre {
-    margin-top: 0;
-    margin-bottom: 16px;
-    word-wrap: normal;
-    padding: 16px;
-    overflow: auto;
-    font-size: 85%;
-    line-height: 1.45;
-  }
-
-  pre>code {
-    padding: 0;
-    margin: 0;
-    font-size: 100%;
-    word-break: normal;
-    white-space: pre;
-    background: transparent;
-    border: 0;
-  }
-
-  pre code {
-    display: inline;
-    max-width: auto;
-    padding: 0;
-    margin: 0;
-    overflow: visible;
-    line-height: inherit;
-    word-wrap: normal;
-    background-color: transparent;
-    border: 0;
-  }
-
-  pre code::before,
-  pre code::after {
-    content: normal;
-  }
-
-  em,q,em,dfn {
-    font-style:italic;
-  }
-
-  .sans,html .gist .gist-file .gist-meta {
-    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
-  }
-
-  .mono,pre,code,tt,p code,li code {
-    font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, Courier, monospace;
-  }
-
-  .heading,.serif,h1,h2,h3 {
-    font-family: "TiemposHeadline", serif;
-  }
-
-  strong {
-    font-weight:600;
-  }
-
-  q:before {
-    content:"\201C";
-  }
-
-  q:after {
-    content:"\201D";
-  }
-
-  del,s {
-    text-decoration:line-through;
-  }
-
-  blockquote {
-    text-align:center;
-    padding:16px;
-  }
-
-  blockquote p {
-    display:inline-block;
-    font-style:italic;
-  }
-
-  blockquote:before,blockquote:after {
-    content: "\201C";
-    font-size: 35px;
-    color: #738491;
-  }
-
-  blockquote:after {
-    content: "\201D";
-  }
-
-  hr {
-    width:40%;
-    height: 1px;
-    background:#738491;
-    margin: 25px auto;
-  }
-
-  h1 {
-    font-size: 35px;
-  }
-
-  h2 {
-    font-size: 28px;
-  }
-
-  h3 {
-    font-size: 22px;
-    margin-top: 18px;
-  }
-
-  h1 a,h2 a,h3 a {
-    text-decoration:none;
-  }
-
-  h1,h2 {
-    margin-top:28px;
-  }
-
-  #sub-header, time {
-    color: #738491;
-    font-size: 14px;
-  }
-
-  #sub-header {
-    margin: 0 4px;
-  }
-
-  #nav h1 a {
-    font-size: 35px;
-    color: #333;
-    line-height: 120%;
-  }
-
-  .posts_listing a,#nav a {
-    text-decoration: none;
-  }
-
-  li {
-    margin-left: 20px;
-  }
-
-  ul li {
-    margin-left: 5px;
-  }
-
-  ul li {
-    list-style-type: none;
-  }
-  ul li:before {
-    content:"\00BB \0020 \00a0";
-  }
-
-  #nav ul li:before, .posts_listing li:before {
-    content:'';
-    margin-right:0;
-  }
-
-  #content {
-    text-align: left;
-    width: 100%;
-    font-size: 16px;
-    padding: 60px 0 80px;
-  }
-
-  #content h1,#content h2 {
-    margin-bottom: 5px;
-  }
-
-  #content h2 {
-    font-size: 25px;
-  }
-
-  #content .entry-content {
-    margin-top: 16px;
-  }
-
-  #content time {
-    margin-left:3px;
-  }
-
-  #content h1 {
-    font-size: 30px;
-  }
-
-  .highlight {
-    margin: 10px 0;
-  }
-
-  .posts_listing {
-    margin:0 0 50px;
-  }
-
-  .posts_listing li {
-    margin:0 0 25px 15px;
-  }
-
-  .posts_listing li a:hover,#nav a:hover {
-    text-decoration: underline;
-  }
-
-  #nav {
-    text-align:center;
-    position:static;
-    margin-top:60px;
-  }
-
-  #nav ul {
-    display: table;
-    margin: 8px auto 0 auto;
-  }
-
-  #nav li {
-    list-style-type: none;
-    display: table-cell;
-    font-size: 16px;
-    padding: 0 20px;
-  }
-
-  #links {
-    margin: 50px 0 0 0;
-  }
-
-  #links :nth-child(2) {
-    float:right;
-  }
-
-  #not-found {
-    text-align: center;
-  }
-
-  #not-found a {
-    font-family: "TiemposHeadline", serif;
-    font-size: 200px;
-    text-decoration: none;
-    display: inline-block;
-    padding-top: 225px;
-  }
-
-  @media (max-width: 750px) {
-    body {
-      padding-left:20px;
-      padding-right:20px;
-    }
-
-    #nav h1 a {
-      font-size: 28px;
-    }
-
-    #nav li {
-      font-size: 16px;
-      padding: 0 16px;
-    }
-
-    #content {
-      margin-top: 0;
-      padding-top: 50px;
-      font-size: 16px;
-    }
-
-    #content h1 {
-      font-size: 25px;
-    }
-
-    #content h2 {
-      font-size: 22px;
-    }
-
-    .posts_listing li div {
-      font-size: 12px;
-    }
-  }
-
-  @media (max-width: 400px) {
-    body {
-      padding-left:20px;
-      padding-right:20px;
-    }
-
-    #nav h1 a {
-      font-size: 22px;
-    }
-
-    #nav li {
-      font-size: 14px;
-      padding: 0 12px;
-    }
-
-    #content {
-      margin-top: 0;
-      padding-top: 20px;
-      font-size: 16px;
-    }
-
-    #content h1 {
-      font-size: 20px;
-    }
-
-    #content h2 {
-      font-size: 18px;
-    }
-
-    .posts_listing li div{
-      font-size: 12px;
-    }
-  }
-</style>
diff --git a/static/css/fonts.css b/static/css/fonts.css
new file mode 100644
index 0000000..0f34f83
--- /dev/null
+++ b/static/css/fonts.css
@@ -0,0 +1,35 @@
+@font-face {
+  font-family: "TiemposHeadline";
+  src: url("https://www.bu.edu/cdn/fonts/TiemposHeadline/TiemposHeadline-Regular.eot");
+  src: url("https://www.bu.edu/cdn/fonts/TiemposHeadline/TiemposHeadline-Regular.eot?#iefix") format("embedded-opentype"),
+  url("https://www.bu.edu/cdn/fonts/TiemposHeadline/TiemposHeadline-Regular.woff") format("woff");
+  font-style: normal;
+  font-weight: 400;
+}
+
+@font-face {
+  font-family: "TiemposText";
+  src: url("https://www.bu.edu/cdn/fonts/TiemposText/TiemposText-Regular.eot");
+  src: url("https://www.bu.edu/cdn/fonts/TiemposText/TiemposText-Regular.eot?#iefix") format("embedded-opentype"),
+  url("https://www.bu.edu/cdn/fonts/TiemposText/TiemposText-Regular.woff") format("woff");
+  font-style: normal;
+  font-weight: 400;
+}
+
+@font-face {
+  font-family: "TiemposText";
+  src: url("https://www.bu.edu/cdn/fonts/TiemposText/TiemposText-Regular-Italic.eot");
+  src: url("https://www.bu.edu/cdn/fonts/TiemposText/TiemposText-Regular-Italic.eot?#iefix") format("embedded-opentype"),
+  url("https://www.bu.edu/cdn/fonts/TiemposText/TiemposText-Regular-Italic.woff") format("woff");
+  font-style: italic;
+  font-weight: 400;
+}
+
+@font-face {
+  font-family: "TiemposText";
+  src: url("https://www.bu.edu/cdn/fonts/TiemposText/TiemposText-Semibold.eot");
+  src: url("https://www.bu.edu/cdn/fonts/TiemposText/TiemposText-Semibold.eot?#iefix") format("embedded-opentype"),
+  url("https://www.bu.edu/cdn/fonts/TiemposText/TiemposText-Semibold.woff") format("woff");
+  font-style: normal;
+  font-weight: 600;
+}
diff --git a/static/css/style.css b/static/css/style.css
new file mode 100644
index 0000000..858561d
--- /dev/null
+++ b/static/css/style.css
@@ -0,0 +1,367 @@
+* {
+  border: 0;
+  font: inherit;
+  font-size: 100%;
+  vertical-align: baseline;
+  margin: 0;
+  padding: 0;
+  color: #333;
+  text-decoration-skip: ink;
+}
+
+body {
+  font-family: "TiemposText", Georgia, Times, "Times New Roman", serif;
+  font-size: 16px;
+  line-height: 160%;
+  color: #333;
+  max-width: 700px;
+  margin: auto;
+}
+
+p {
+  margin: 20px 0;
+}
+
+a img {
+  border: none;
+}
+
+img {
+  margin: 10px auto 10px auto;
+  max-width: 100%;
+  display: block;
+}
+
+.left-justify {
+  float: left;
+}
+
+.right-justify {
+  float: right;
+}
+
+pre, code {
+  font: 12px Consolas, "Liberation Mono", Menlo, Courier, monospace;
+  background-color: #f7f7f7;
+}
+
+code {
+  font-size: 14px;
+  padding: 4px;
+}
+
+pre {
+  margin-top: 0;
+  margin-bottom: 16px;
+  word-wrap: normal;
+  padding: 16px;
+  overflow: auto;
+  font-size: 85%;
+  line-height: 1.45;
+}
+
+pre>code {
+  padding: 0;
+  margin: 0;
+  font-size: 100%;
+  word-break: normal;
+  white-space: pre;
+  background: transparent;
+  border: 0;
+}
+
+pre code {
+  display: inline;
+  max-width: auto;
+  padding: 0;
+  margin: 0;
+  overflow: visible;
+  line-height: inherit;
+  word-wrap: normal;
+  background-color: transparent;
+  border: 0;
+}
+
+pre code::before,
+pre code::after {
+  content: normal;
+}
+
+/* footnotes */
+
+ sup {
+   vertical-align: super;
+   font-size: .75em;
+ }
+
+.footnotes {
+  font-size: .9em;
+}
+
+em,q,em,dfn {
+  font-style:italic;
+}
+
+.sans,html .gist .gist-file .gist-meta {
+  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
+}
+
+.mono,pre,code,tt,p code,li code {
+  font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, Courier, monospace;
+}
+
+.heading,.serif,h1,h2,h3 {
+  font-family: "TiemposHeadline", serif;
+}
+
+strong {
+  font-weight:600;
+}
+
+q:before {
+  content:"\201C";
+}
+
+q:after {
+  content:"\201D";
+}
+
+del,s {
+  text-decoration:line-through;
+}
+
+blockquote {
+  text-align:center;
+  padding:16px;
+}
+
+blockquote p {
+  display:inline-block;
+  font-style:italic;
+}
+
+blockquote:before,blockquote:after {
+  content: "\201C";
+  font-size: 35px;
+  color: #738491;
+}
+
+blockquote:after {
+  content: "\201D";
+}
+
+hr {
+  width:40%;
+  height: 1px;
+  background:#738491;
+  margin: 25px auto;
+}
+
+h1 {
+  font-size: 35px;
+}
+
+h2 {
+  font-size: 28px;
+}
+
+h3 {
+  font-size: 22px;
+  margin-top: 18px;
+}
+
+h1 a,h2 a,h3 a {
+  text-decoration:none;
+}
+
+h1,h2 {
+  margin-top:28px;
+}
+
+#sub-header, time {
+  color: #738491;
+  font-size: 14px;
+}
+
+#sub-header {
+  margin: 0 4px;
+}
+
+#nav h1 a {
+  font-size: 35px;
+  color: #333;
+  line-height: 120%;
+}
+
+.posts_listing a,#nav a {
+  text-decoration: none;
+}
+
+li {
+  margin-left: 20px;
+}
+
+ul li {
+  margin-left: 5px;
+}
+
+ul li {
+  list-style-type: none;
+}
+ul li:before {
+  content:"\00BB \0020 \00a0";
+}
+
+#nav ul li:before, .posts_listing li:before {
+  content:'';
+  margin-right:0;
+}
+
+#content {
+  text-align: left;
+  width: 100%;
+  font-size: 16px;
+  padding: 60px 0 80px;
+}
+
+#content h1,#content h2 {
+  margin-bottom: 5px;
+}
+
+#content h2 {
+  font-size: 25px;
+}
+
+#content .entry-content {
+  margin-top: 16px;
+}
+
+#content time {
+  margin-left:3px;
+}
+
+#content h1 {
+  font-size: 30px;
+}
+
+.highlight {
+  margin: 10px 0;
+}
+
+.posts_listing {
+  margin:0 0 50px;
+}
+
+.posts_listing li {
+  margin:0 0 25px 15px;
+}
+
+.posts_listing li a:hover,#nav a:hover {
+  text-decoration: underline;
+}
+
+#nav {
+  text-align:center;
+  position:static;
+  margin-top:60px;
+}
+
+#nav ul {
+  display: table;
+  margin: 8px auto 0 auto;
+}
+
+#nav li {
+  list-style-type: none;
+  display: table-cell;
+  font-size: 16px;
+  padding: 0 20px;
+}
+
+#links {
+  margin: 50px 0 0 0;
+}
+
+#links :nth-child(2) {
+  float:right;
+}
+
+#not-found {
+  text-align: center;
+}
+
+#not-found a {
+  font-family: "TiemposHeadline", serif;
+  font-size: 200px;
+  text-decoration: none;
+  display: inline-block;
+  padding-top: 225px;
+}
+
+@media (max-width: 750px) {
+  body {
+    padding-left:20px;
+    padding-right:20px;
+  }
+
+  #nav h1 a {
+    font-size: 28px;
+  }
+
+  #nav li {
+    font-size: 16px;
+    padding: 0 16px;
+  }
+
+  #content {
+    margin-top: 0;
+    padding-top: 50px;
+    font-size: 16px;
+  }
+
+  #content h1 {
+    font-size: 25px;
+  }
+
+  #content h2 {
+    font-size: 22px;
+  }
+
+  .posts_listing li div {
+    font-size: 12px;
+  }
+}
+
+@media (max-width: 400px) {
+  body {
+    padding-left:20px;
+    padding-right:20px;
+  }
+
+  #nav h1 a {
+    font-size: 22px;
+  }
+
+  #nav li {
+    font-size: 14px;
+    padding: 0 12px;
+  }
+
+  #content {
+    margin-top: 0;
+    padding-top: 20px;
+    font-size: 16px;
+  }
+
+  #content h1 {
+    font-size: 20px;
+  }
+
+  #content h2 {
+    font-size: 18px;
+  }
+
+  .posts_listing li div{
+    font-size: 12px;
+  }
+}