Updated documentation.

2 years ago · 94860d0e59
parent 22fe3371ca
commit 94860d0e59
3 changed files with 48 additions and 15 deletions
--- a/README.md
+++ b/README.md
@ -20,7 +20,7 @@ With [some work](doc/extend.md), you can also:

 After cloning the repo, you can either:
 - run it using Docker (recommended, run `./run-container.sh --port 5020`)
- run it from source (requires Python 3.8.7, install the module, run `asl_rulebook2/webapp/run_server.py`)
+- run it from source (install the module, run `asl_rulebook2/webapp/run_server.py`)

 *NOTE: Run either command with `--help` to get help.*

--- a/doc/features/global.css
+++ b/doc/features/global.css
@ -1,3 +1,31 @@
+body { margin: 0 ; padding:1em ; }
+
+#header {
+    position: fixed ; top: 1em ; height: 3em ;
+    width: calc(100% - 2em) ;
+}
+#header .caption {
+    display: inline-block ;
+    border: 1px solid black ; border-radius: 5px ;
+    padding: 4px 12px ;
+    font-size: 150% ; font-weight: bold ;
+    background: #ddd ;
+}
+
+#content {
+    position: fixed ; top: 4.25em ; bottom: 1em ;
+    width: calc(100% - 2em) ;
+    overflow: auto ;
+}
+
+h3 {
+    display: inline-block ;
+    margin: 0 ;
+    border: 1px solid #888 ; border-radius: 5px ;
+    padding: 2px 8px ;
+    color: #444 ; background: #f8f8f8 ;
+}
+
 .ruleid { font-family: monospace ; }

 .info {
@ -5,4 +33,3 @@
    padding-left: 30px ; background: no-repeat url(info.png) ;
    font-size: 90% ; font-style: italic ; color: #444 ;
 }
-
--- a/doc/features/index.html
+++ b/doc/features/index.html
@ -10,11 +10,15 @@

 <body>

-<p> <img src="images/search-heat.png" class="imageZoom" style="float:right;width:40%;margin-left:1em;">
-<h2> ASL Rulebook 2
-<a href="https://code.pacman-ghost.com/public/asl-rulebook2/releases" target="_blank"><img src="images/download.png" style="height:0.75em;"></a>
-</h2>
-<p> Out-of-the-box, this program gives you full-text search over the ASLRB index.
+<div id="header">
+<div class="caption"> ASL Rulebook 2 </div>
+<a href="https://code.pacman-ghost.com/public/asl-rulebook2/releases" target="_blank" style="float:right;"><img src="images/download.png" style="height:2em;"></a>
+</div>
+
+<div id="content">
+
+<img src="images/search-heat.png" class="imageZoom" style="float:right;width:40%;margin-left:1em;">
+Out of the box, this program gives you full-text search over the ASLRB index.
 <p> It will jump to the exact position in the eASLRB PDF for a rule when you click on a search result.
 <p> And if the rule has any associated footnotes, these will be shown in a popup.

@ -24,8 +28,8 @@
 <br><br>


-<p> <img src="images/search-cellar.png" class="imageZoom" style="float:right;width:40%;margin-left:1em;">
 <h3> Adding rules for other modules </h3>
+<img src="images/search-cellar.png" class="imageZoom" style="float:right;width:40%;margin-left:1em;">
 <p> Once you've got the program up and running, you can then think about extending it. It's a lot of work, but the results are insanely cool!
 <p> To the right, I've searched for <em>"cellar"</em>, and the program has found results from <em>Red Barricades</em>. The rules for this are referenced in the ASLRB index, but the content is not yet in the MMP eASLRB.
 <p> However, I've installed a PDF scan of the rules, plus information about where each rule is within that PDF (a <em>"targets file"</em>), and so when I click on a search result, it seamlessly opens the <em>Red Barricades</em> PDF and jumps to that rule.
@ -38,12 +42,12 @@ You can also include third-party modules that are not referenced in the ASLRB in
 <p> I've also added information about chapters in the PDF, so that I can browse through them in the usual way: <br>
 <img src="images/chapters-extended.png" class="imageZoom" style="margin:1em 0 0 2em;width:30%;">

-<br><br>
+<br>


-<p> <img src="images/ruleinfo-encircled.png" class="imageZoom" style="float:right;width:30%;margin-left:1em;">
 <h3> Showing Q+A and errata </h3>
-Q+A and errata can also be included. This is a <em>lot</em> of work, but the results are amazing. If you click on a rule that has Q+A and/or errata associated with it, they will be shown, alongside the rule you're looking for.
+<img src="images/ruleinfo-encircled.png" class="imageZoom" style="float:right;width:30%;margin-left:1em;">
+<p> Q+A and errata can also be included. This is a <em>lot</em> of work, but the results are amazing. If you click on a rule that has Q+A and/or errata associated with it, they will be shown, alongside the rule you're looking for.
 <p> Here, I've searched for <em>"encircled"</em>, and the program has automatically shown Q+A and errata for rule <span class="ruleid">A7.7</span>.
 <div class="info"> Note that this errata is actually obsolete, since it's already been incorporated into the current MMP eASLRB, but it's shown here as an example. </div>
 <br clear="all">
@ -54,19 +58,21 @@ Going back to the search results, you can see these Q+A entries included in ther
 <br clear="all">


-<p> <img src="images/user-anno.png" class="imageZoom" style="float:left;width:30%;margin-right:1em;">
 <h3> User annotations </h3>
-You can also add your own notes to the search engine.
+<img src="images/user-anno.png" class="imageZoom" style="float:left;width:30%;margin-right:1em;">
+<p> You can also add your own notes to the search engine.
 <p> Here, I've added a note about what <em>Majority Squad Type</em> means, and a link back to the Game Squad post that talks about it.
 <br clear="all">


-<p> <img src="images/asop.png" class="imageZoom" style="float:right;width:40%;margin-left:1em;">
 <h3> Advanced Sequence Of Play </h3>
-Finally, the ASOP can also be included, with clickable links to each of the referenced rules.
+<img src="images/asop.png" class="imageZoom" style="float:right;width:40%;margin-left:1em;">
+<p> Finally, the ASOP can also be included, with clickable links to each of the referenced rules.
 <p> ASOP entries are also included in search results: <br>
 <img src="images/asop-sr.png" class="imageZoom" style="margin:1em 0 0 2em;width:30%;">

+</div> <!-- content -->
+
 </body>

 <script src="jquery-3.6.0.min.js"></script>