[docs] Move styles to own file. Fix table-of-contents positioning when viewed on <767px screens.

The fixed positioning of the ToC needs to be overridden with static, so that the ToC falls back into the flow of content and is sized correctly. Also, this prevents the actual page content from riding up behind the ToC and being obscured.

1 files changed, 46 insertions, 0 deletions

diff --git a/docs/static/css/drf-styles.css b/docs/static/css/drf-styles.css
new file mode 100644
index 00000000..25b6f8d2
--- /dev/null
+++ b/docs/static/css/drf-styles.css
@@ -0,0 +1,46 @@
+body {
+  padding-top: 60px;
+  padding-bottom: 40px;
+}
+
+/* Set the table of contents to static so it flows back into the content when
+   viewed on tablets and smaller. */
+@media (max-width: 767px) {
+  #table-of-contents {
+    position: static;
+  }
+}
+
+.nav-list li.main {
+  font-weight: bold;
+}
+
+blockquote {
+  font-family: Georgia, serif;
+  font-size: 18px;
+  font-style: italic;
+  margin: 0.25em 0;
+  padding: 0.25em 40px;
+  line-height: 1.45;
+  position: relative;
+  color: #383838;
+  border-left: none;
+}
+
+  blockquote:before {
+  display: block;
+  content: "\201C";
+  font-size: 80px;
+  position: absolute;
+  left: -10px;
+  top: -20px;
+  color: #7a7a7a;
+}
+
+  blockquote p:last-child {
+  color: #999999;
+  font-size: 14px;
+  display: block;
+  margin-top: 5px;
+}
+