rollup merge of #21071: sfaxon/mobile-friendly-book
Helps with mobile friendliness of The Rust Book #20850
This commit is contained in:
commit
ee960afc10
@ -91,6 +91,7 @@ pub fn render(input: &str, mut output: Path, matches: &getopts::Matches,
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta name="generator" content="rustdoc">
|
||||
<title>{title}</title>
|
||||
|
||||
|
@ -20,6 +20,7 @@ use error::{Error, CliResult, CommandResult};
|
||||
use book;
|
||||
use book::{Book, BookItem};
|
||||
use css;
|
||||
use javascript;
|
||||
|
||||
use regex::Regex;
|
||||
|
||||
@ -63,7 +64,7 @@ fn write_toc(book: &Book, path_to_root: &Path, out: &mut Writer) -> IoResult<()>
|
||||
Ok(())
|
||||
}
|
||||
|
||||
try!(writeln!(out, "<div id='toc'>"));
|
||||
try!(writeln!(out, "<div id='toc' class='mobile-hidden'>"));
|
||||
try!(writeln!(out, "<ul class='chapter'>"));
|
||||
try!(walk_items(&book.chapters[], "", path_to_root, out));
|
||||
try!(writeln!(out, "</ul>"));
|
||||
@ -102,6 +103,14 @@ fn render(book: &Book, tgt: &Path) -> CliResult<()> {
|
||||
let prelude = tmp.path().join("prelude.html");
|
||||
{
|
||||
let mut toc = BufferedWriter::new(try!(File::create(&prelude)));
|
||||
try!(writeln!(&mut toc, r#"<div id="nav">
|
||||
<button id="toggle-nav">
|
||||
<span class="sr-only">Toggle navigation</span>
|
||||
<span class="bar"></span>
|
||||
<span class="bar"></span>
|
||||
<span class="bar"></span>
|
||||
</button>
|
||||
</div>"#));
|
||||
let _ = write_toc(book, &item.path_to_root, &mut toc);
|
||||
try!(writeln!(&mut toc, "<div id='page-wrapper'>"));
|
||||
try!(writeln!(&mut toc, "<div id='page'>"));
|
||||
@ -111,6 +120,7 @@ fn render(book: &Book, tgt: &Path) -> CliResult<()> {
|
||||
let postlude = tmp.path().join("postlude.html");
|
||||
{
|
||||
let mut toc = BufferedWriter::new(try!(File::create(&postlude)));
|
||||
try!(toc.write_str(javascript::JAVASCRIPT));
|
||||
try!(writeln!(&mut toc, "</div></div>"));
|
||||
}
|
||||
|
||||
|
@ -45,7 +45,7 @@ body {
|
||||
#page {
|
||||
margin-left: auto;
|
||||
margin-right:auto;
|
||||
width: 750px;
|
||||
max-width: 750px;
|
||||
}
|
||||
|
||||
.chapter {
|
||||
@ -69,4 +69,58 @@ body {
|
||||
.chapter li a {
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 1060px) {
|
||||
#toc {
|
||||
width: 100%;
|
||||
margin-right: 0;
|
||||
top: 40px;
|
||||
}
|
||||
#page-wrapper {
|
||||
top: 40px;
|
||||
left: 15px;
|
||||
padding-right: 15px;
|
||||
}
|
||||
.mobile-hidden {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
#toggle-nav {
|
||||
height: 20px;
|
||||
width: 30px;
|
||||
padding: 3px 3px 0 3px;
|
||||
}
|
||||
|
||||
#toggle-nav {
|
||||
margin-top: 5px;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
background-color: #FFF;
|
||||
border: 1px solid #666;
|
||||
border-radius: 3px 3px 3px 3px;
|
||||
}
|
||||
|
||||
.sr-only {
|
||||
position: absolute;
|
||||
width: 1px;
|
||||
height: 1px;
|
||||
margin: -1px;
|
||||
padding: 0;
|
||||
overflow: hidden;
|
||||
clip: rect(0, 0, 0, 0);
|
||||
border: 0;
|
||||
}
|
||||
|
||||
.bar {
|
||||
display: block;
|
||||
background-color: #000;
|
||||
border-radius: 2px;
|
||||
width: 100%;
|
||||
height: 2px;
|
||||
margin: 2px 0 3px;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
"#;
|
||||
|
43
src/rustbook/javascript.rs
Normal file
43
src/rustbook/javascript.rs
Normal file
@ -0,0 +1,43 @@
|
||||
// Copyright 2015 The Rust Project Developers. See the COPYRIGHT
|
||||
// file at the top-level directory of this distribution and at
|
||||
// http://rust-lang.org/COPYRIGHT.
|
||||
//
|
||||
// Licensed under the Apache License, Version 2.0 <LICENSE-APACHE or
|
||||
// http://www.apache.org/licenses/LICENSE-2.0> or the MIT license
|
||||
// <LICENSE-MIT or http://opensource.org/licenses/MIT>, at your
|
||||
// option. This file may not be copied, modified, or distributed
|
||||
// except according to those terms.
|
||||
|
||||
// The rust-book JavaScript in string form.
|
||||
|
||||
pub static JAVASCRIPT: &'static str = r#"
|
||||
<script type="text/javascript">
|
||||
document.addEventListener("DOMContentLoaded", function(event) {
|
||||
document.getElementById("toggle-nav").onclick = toggleNav;
|
||||
function toggleNav() {
|
||||
var toc = document.getElementById("toc");
|
||||
var pagewrapper = document.getElementById("page-wrapper");
|
||||
toggleClass(toc, "mobile-hidden");
|
||||
toggleClass(pagewrapper, "mobile-hidden");
|
||||
};
|
||||
|
||||
function toggleClass(el, className) {
|
||||
// from http://youmightnotneedjquery.com/
|
||||
if (el.classList) {
|
||||
el.classList.toggle(className);
|
||||
} else {
|
||||
var classes = el.className.split(' ');
|
||||
var existingIndex = classes.indexOf(className);
|
||||
|
||||
if (existingIndex >= 0) {
|
||||
classes.splice(existingIndex, 1);
|
||||
} else {
|
||||
classes.push(className);
|
||||
}
|
||||
|
||||
el.className = classes.join(' ');
|
||||
}
|
||||
}
|
||||
});
|
||||
</script>
|
||||
"#;
|
@ -39,6 +39,7 @@ mod serve;
|
||||
mod test;
|
||||
|
||||
mod css;
|
||||
mod javascript;
|
||||
|
||||
#[cfg(not(test))] // thanks #12327
|
||||
fn main() {
|
||||
|
Loading…
Reference in New Issue
Block a user