Fix some small issues with the theme

theacodes · theacodes · commit 2a0561cfe2fa · 2020-10-10T03:39:11.000-04:00
diff --git a/user_guide/docs/build.md b/user_guide/docs/build.md
@@ -75,8 +75,8 @@ The JST connector goes on the **back** side of the board.
 
 Note the orientation of the connector. It shouldn't be overhanging the board, it should come right up to the edge.
 
-![Correct placement of connector](images/jst-correct.jpg){: align=left }
-![incorrect placement of connector](images/jst-incorrect.jpg){: align=right }
+![Correct placement of connector](images/jst-correct.jpg){: class="float-left" }
+![incorrect placement of connector](images/jst-incorrect.jpg){: class="float-right" }
 
 Just like with the 1/8" jacks, flip the board over and solder the two pins of the JST connector to the board. Make sure the connector is flush with the board. You can use a piece of tape to hold it in place.
 
diff --git a/user_guide/mkdocs.yml b/user_guide/mkdocs.yml
@@ -15,6 +15,8 @@ markdown_extensions:
   - pymdownx.highlight:
       use_pygments: True
   - pymdownx.superfences
+  - pymdownx.magiclink
+  - md_in_html
 nav:
   - "User Guide": index.md
   - "Kit Build Instructions": build.md
diff --git a/user_guide/theme/main.html b/user_guide/theme/main.html
@@ -12,13 +12,13 @@
     <title>{% if page.title %}{{ page.title }} - {% endif %}{{ config.site_name }}</title>
 
     <!-- Bootstrap core CSS -->
-    <link href="/bootstrap.min.css" rel="stylesheet">
+    <link href="{{'bootstrap.min.css'|url}}" rel="stylesheet">
 
     <!-- Custom styles for this template -->
-    <link href="/style.css" rel="stylesheet">
+    <link href="{{'style.css'|url}}" rel="stylesheet">
 
     <!-- Syntax highlighting css -->
-		<link href="/pygments.css" rel="stylesheet">
+		<link href="{{'pygments.css'|url}}" rel="stylesheet">
 		
     {%- for path in config['extra_css'] %}
     <link href="{{ path|url }}" rel="stylesheet">
@@ -28,8 +28,8 @@
   <body>
     <div class="container">
 			<nav class="navbar navbar-expand-lg navbar-light">
-				<a class="navbar-brand" href="/">
-					<img src="/winterbloom-logo.png" height="30" class="d-inline-block align-top" alt="" loading="lazy">
+				<a class="navbar-brand" href="{{base_url}}">
+					<img src="{{'winterbloom-logo.png'|url}}" height="30" class="d-inline-block align-middle" alt="" loading="lazy">
 				</a>
 				{% if nav|length>1 %}
 				<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavAltMarkup" aria-controls="navbarNavAltMarkup" aria-expanded="false" aria-label="Toggle navigation">
@@ -63,5 +63,5 @@
 		</div>
 	</body>
 	
-	<script type="text/javascript" src="/script.js"></script>
+	<script type="text/javascript" src="{{'script.js'|url}}"></script>
 </html>
diff --git a/user_guide/theme/style.css b/user_guide/theme/style.css
@@ -165,6 +165,11 @@ article img {
   padding: 2em 0;
 }
 
+article img.float-right, article img.float-left {
+  width: 50%;
+  padding: 2em 0.5em;
+}
+
 footer {
   margin-top: 5em;
   margin-bottom: 2em;
