background-color: $outer-background-color;
max-width: calc(#{$frame-max-width + 2 * $navi-width} + 2px);
}
-#frame { /* Add a frame */
+#-frame { /* Add a frame */
margin: 0 $navi-width;
border: solid $frame-color 1px;
background-color: $inner-background-color;
}
/* The content of the frame */
-#title {
+#-title {
border-bottom: solid $title-color 2px;
text-align: center;
}
-#title h1 {
+#-title h1 {
padding: 0 0.7em;
margin-bottom: 0;
}
-#content {
+#-content {
padding: 0.7em;
padding-top: 1px; /* If we use 0 here, things get ugly. What?!? */
}
/* Navigation menu */
-#navi {
- /* No border, no padding, so all the width computations become easy. */
- float: left;
+#-navi {
background-color: $outer-background-color;
- width: $navi-width;
+ /* No border, no padding, so all the width computations become easy. */
padding: 0;
margin: 0;
+ width: $navi-width;
+ /* Put it into the right spot */
+ float: left;
position: relative;
left: -#{$navi-width};
- margin-bottom: calc(-100% - #{$frame-max-width});
+ /* Make it not take space away from the main text */
+ height: 0;
+ overflow: visible;
}
-#navi ul {
+#-navi ul {
margin: 0px;
padding: 0px;
list-style-type: none;
}
-#navi ul ul {
+#-navi ul ul {
/* Indentation for nested nodes */
margin-left: 1.2em;
}
-#navi li {
+#-navi li {
/* Border around the links */
margin-bottom:0.1em;
background-color: $inner-background-color;
border-top-left-radius: 10px;
border-bottom-left-radius: 10px;
}
-#navi li a {
+#-navi li a {
display: block;
width: 100%;
text-decoration: none;
text-align: center;
}
-#navi li.current
+#-navi li.current
{
border-color: $current-color;
}
-#navi li:hover {
+#-navi li:hover {
border-color: $title-color;
border-radius: 0;
}
-#navi li:hover a {
+#-navi li:hover a {
color: $text-color;
}
/* Small screens */
@media screen and (max-width:#{ $frame-max-width + 2 * $outer-margin } ) {
- body, #frame, #title, #content, #navi {
+ body, #-frame, #-title, #-content, #-navi {
margin: 0;
width: auto;
max-width: none;
clear: both;
}
- #navi {
+ #-navi {
/* Place navi above the title */
float: none;
position: static;
background-color: $inner-background-color;
padding: 0;
}
- #navi ul, #navi ul ul, #navi li, #navi li a {
+ #-navi ul, #-navi ul ul, #-navi li, #-navi li a {
margin: 0;
padding: 0;
display: inline;
}
- #navi > ul {
+ #-navi > ul {
padding: 0.3em;
display: block;
border-bottom: solid $navi-color 2px;
}
/* Display only parent and children, and deocare them appropriately */
- #navi li {
+ #-navi li {
display:inline-block;
margin: 0 0.2em;
}
- #navi li.sibling {
+ #-navi li.sibling {
display:none;
}
- #navi li.parent:before, #navi li.current:before {
+ #-navi li.parent:before, #-navi li.current:before {
content: "» ";
}
- #navi li.child:before {
+ #-navi li.child:before {
content: "» ";
}
- #navi li.child + li:before {
+ #-navi li.child + li:before {
content: "| ";
}
- #navi li {
+ #-navi li {
border: none;
}
- #navi li.current a {
+ #-navi li.current a {
text-decoration: underline;
}
}
/* Printing */
@media print {
- body, #frame, #title, #content {
+ body, #-frame, #-title, #-content {
margin: 0;
padding: 0;
width: auto;
max-width: none;
border: none;
}
- #title h1 {
+ #-title h1 {
border: none;
}
- #navi {
+ #-navi {
display: none;
}
}
-/* RST styling */
-article.rst dt {
- font-weight: bold;
-}
-article.rst dd {
- margin-bottom: 1em;
-}
-article.rst a.rst-footnote {
- vertical-align: super;
-}
-article.rst div.rst-footnote {
- display: table;
-}
-article.rst div.rst-footnote > * {
- display: table-cell;
-}
-article.rst div.rst-footnote a {
- min-width: 3em;
-}
-article.rst .rst-literal, article.rst pre {
- font-family: monospace;
- font-size: 82%;
-}
-article.rst .rst-literal {
- padding: 0.1em 0.2em;
- background-color: $outer-background-color;
-}
-article.rst pre {
- padding: 0.6em;
- background-color: $outer-background-color;
-}
-
/* Content styling */
-#content p {
- margin: 0.5em 0;
- line-height: 1.3;
-}
-#content a {
- color:$link-color;
-}
-#content a:visited {
- color:$link-color-visited;
-}
-#content a:hover {
- color:$link-color-hover;
+#-content {
+ code {
+ padding: 0.1em 0.2em;
+ background-color: $outer-background-color;
+ font-family: monospace;
+ font-size: 82%;
+ }
+ pre {
+ padding: 0.6em;
+ background-color: $outer-background-color;
+ }
+ pre code {
+ padding: 0;
+ }
+
+ p {
+ margin: 0.5em 0;
+ line-height: 1.3;
+ }
+ a {
+ color:$link-color;
+ }
+ a:visited {
+ color:$link-color-visited;
+ }
+ a:hover {
+ color:$link-color-hover;
+ }
}