diff --git a/book/style.css b/book/style.css
index f546124..12c6fcf 100644
--- a/book/style.css
+++ b/book/style.css
@@ -152,6 +152,7 @@ figure.texsource, figure.shellcommand, figure.htmlsource, figure.luasource, figu
div.footnotes {
border: none;
+ margin-right: 0;
}
.footnote-mark {
@@ -165,3 +166,140 @@ table.tabular {
.chapterHead .titlemark {
display: block;
}
+
+figure.figure {
+ margin: 30px 0px 30px 0px;;
+ text-align: center;
+ padding: 0;
+}
+
+figcaption.caption {
+ text-indent: 0;
+ margin: 0;
+}
+
+
+.table div.center, .table div.center div.center {
+ margin: 0;
+}
+
+.table {
+ overflow-x: auto;
+}
+
+.table table {
+ width: 100%;
+}
+
+
+.menu {
+ position: relative;
+}
+
+.toggle-menu-label {
+ display: none;
+}
+
+.menu input {
+ display: none;
+}
+
+.menu-items {
+ display: block;
+ list-style: none;
+ margin: 0;
+ padding: 0;
+}
+
+.menu-items .chapterToc {
+ display: block;
+ margin-bottom: 10px;
+}
+
+.menu-items a {
+ text-decoration: none;
+}
+
+
+@media (max-width: 768px) {
+ .toggle-menu-label {
+ display: block;
+ padding: 10px;
+ cursor: pointer;
+ }
+ .hamb{
+ cursor: pointer;
+ float: right;
+ padding: 30px 20px;
+ position: absolute;
+ right: 0px;
+ top: 0px;
+ }
+
+ .hamb-line {
+ background: #000;
+ display: block;
+ height: 2px;
+ position: relative;
+ width: 24px;
+ }
+
+ .hamb-line::before,
+ .hamb-line::after{
+ background: #000;
+ content: '';
+ display: block;
+ height: 100%;
+ position: absolute;
+ transition: all .2s ease-out;
+ width: 100%;
+ }
+ .hamb-line::before{
+ top: 5px;
+ }
+ .hamb-line::after{
+ top: -5px;
+ }
+
+ span.hamb-line:hover {
+ background-color: #000 !important;
+ }
+
+ .menu-items {
+ display: none;
+ position: absolute;
+ top: 100%;
+ left: 0;
+ width: 100%;
+ background-color: #f2f2f2;
+ padding-left: 3px;
+ z-index: 1;
+ }
+
+ .menu-items .chapterToc {
+ margin-bottom: 8px;
+ }
+
+ .menu {
+ background: #F5F2EF;
+ padding: 20px 0px;
+ position: relative;
+ }
+
+ #toggle-menu:checked ~ .menu-items {
+ display: block;
+ }
+
+ .logo {
+ display: block;
+ color: #000;
+ font-size: 20px;
+ font-weight: bold;
+ padding-left: 17px;
+ }
+}
+
+div.center {
+ margin-left: 0;
+ margin-right: 0;
+}
diff --git a/website/modify_build.rb b/website/modify_build.rb
index 4a86cbe..ab945b5 100644
--- a/website/modify_build.rb
+++ b/website/modify_build.rb
@@ -30,9 +30,19 @@ class ModifyBuild
text = fix_double_slashes(orig_text)
text = fix_navigation_bar(text)
text = fix_titles(text)
+ text = fix_menu(text)
+ text = fix_cover_page(text) if is_cover_page?(filename)
+ text = add_home_link_to_menu(text)
+ text = fix_anchor_hyperlinks_menu(text)
File.open(filename, "w") {|file| file.puts text }
end
+ def is_cover_page?(filename)
+ ["book.html", "index.html"].any? do |name|
+ filename.include?(name)
+ end
+ end
+
def list_of_files_to_modify
Dir.glob("#{build_dir}/*.html")
end
@@ -55,7 +65,7 @@ class ModifyBuild
end
def fix_navigation_bar(text)
- doc = Nokogiri::HTML(text)
+ doc = build_doc(text)
elements = [doc.search('.chapterToc'), doc.search('.sectionToc'), doc.search('.subsectionToc')].flatten
elements.each do |n|
chapter_number_or_nothing = n.children[0].text.strip
@@ -81,8 +91,10 @@ class ModifyBuild
doc.to_html
end
+ # By default the titles look boring. This changes the titles of all the
+ # pages and adds the book name as appendix
def fix_titles(text)
- doc = Nokogiri::HTML(text)
+ doc = build_doc(text)
title_node = doc.css("title")[0]
raise ArgumentError.new("No title found in HTML document") if title_node.nil?
@@ -90,7 +102,6 @@ class ModifyBuild
doc.to_html
end
-
# "3 Making a sourdough starter"
# Should return Making a sourdough starter - The Sourdough Framework"
def build_title(title)
@@ -109,6 +120,81 @@ class ModifyBuild
def title_appendix
"The Sourdough Framework"
end
+
+ # By default the menu is not made for mobile devices. This adds mobile
+ # capabilities to the menu
+ def fix_menu(text)
+ doc = build_doc(text)
+ nav = doc.css("nav.TOC")[0]
+ # page has no nav
+ return text unless nav
+
+ menu_items_html = doc.css("nav.TOC > *").to_html
+ nav.add_class("menu")
+ nav_content = %Q{
+ #{menu_mobile_nav}
+
+ }
+ nav.inner_html = nav_content
+ doc.to_html
+ end
+
+ def menu_mobile_nav
+ %Q{
+
+ The Sourdough Framework
+
+
+
+ }
+ end
+
+ # The cover page should have some additional content and allow the user to
+ # click the book cover in order to start reading.
+ def fix_cover_page(text)
+ doc = build_doc(text)
+ body = doc.css("body")[0]
+ content = doc.css("body > .titlepage")[0]
+ menu = doc.css("body > .menu")[0]
+ cover = content.css(".center")[0]
+ cover_html = cover.to_html
+ cover.inner_html = "#{cover_html}"
+ body.inner_html = "#{menu} #{content}"
+ doc.to_html
+ end
+
+ # Users are lost and can't easily access the root page of the book. This
+ # adds a home menu item.
+ def add_home_link_to_menu(text)
+ doc = build_doc(text)
+ menu = doc.css(".menu-items")[0]
+ return text if menu.nil?
+
+ home_html = %Q{Home}
+ menu.inner_html = "#{home_html} #{menu.inner_html}"
+ doc.to_html
+ end
+
+ # Some of the links in the menu have an anchor. This makes clicking through
+ # the menu frustrating as the browser jumps a lot on each request. Only do
+ # this for the top level menu entries though.
+ def fix_anchor_hyperlinks_menu(text)
+ doc = build_doc(text)
+ top_level_menus = doc.css(".menu-items > span > a")
+ top_level_menus.each do |el|
+ link = el.attribute("href").value
+ splitted = link.split("#")
+ next if splitted.length == 1
+
+ el["href"] = splitted[0]
+ end
+
+ doc.to_html
+ end
+
+ def build_doc(text)
+ Nokogiri::HTML(text)
+ end
end
ModifyBuild.build