Add wikipedia credit & another screenshot

src/index.html

@@ -111,7 +111,7 @@ title: Pepperminty Wiki
 	<p>Don't see a feature you need? <a href="https://github.com/sbrl/Pepperminty-Wiki/issues/new">Open an issue</a>!</p>
 </div>
 
-<div class="double lean-left">
+<div class="double lean-left margin-vertical">
 	<img class="left margin-medium lift-from-page" src="static/images/page-dark.png" alt="Screenshot showing the dark theme and the menu off" />
 	<!-- <div class="left">
 	</div> -->
@@ -120,6 +120,14 @@ title: Pepperminty Wiki
 	</div>
 </div>
 
+<div class="double lean-right margin-vertical panel">
+	<div class="left centre padding-wide">
+		<p>Easily manage user access with the user table. Add and remove users, reset passwords, and view email addresses with ease!</p>
+		<p>Multiple wiki-wide themes are also supported - this screenshot is taken with the <em>photo</em> theme, which allows for customisation of the background photo.</p>
+	</div>
+	<img class="right margin-medium lift-from-page" src="static/images/page-photo-usertable.jpeg" alt="Screenshot showing the user management page with the photo theme" />
+</div>
+
 <!--
 	Things to add:
 	 - We're open-source
@@ -138,5 +146,6 @@ title: Pepperminty Wiki
 	</ol>
 	<br />
 	<p class="centre-text">Created with ♥ by <a href="https://starbeamrainbowlabs.com/"><img class="logo medium" src="static/images/sbrl.png" alt="SBRL logo" aria-hidden="true" /> Starbeamrainbowlabs</a></p>
+	<p class="centre-text">Page content shown in screenshots <a href="https://starbeamrainbowlabs.com/blog/article.php?article=posts/375-next-gen-search-2-test-data.html">pulled</a> from <a href="https://dumps.wikimedia.org/">Wikipedia database dumps</a></p>
 	<p class="centre-text"><a rel="license" href="http://creativecommons.org/licenses/by-sa/4.0/"><img class="logo" title="This website is licenced under the Creative Commons Attribution-ShareAlike 4.0 International License" alt="This website is licenced under Creative Commons Attribution-ShareAlike 4.0 International License" src="static/images/cc-by-sa.svg" /></a></p>
 </footer>

src/static/css/main.css

@@ -112,8 +112,8 @@ button, summary                     { cursor: pointer; }
 
 @keyframes enter-spin
 {
-    from { transform: translateX(30em) rotateY(180deg); }
-    to { transform: translateX(0) rotateY(350deg);  }
+	from { transform: translateX(30em) rotateY(180deg); }
+	to { transform: translateX(0) rotateY(350deg);  }
 }
 
 .panel {
@@ -158,15 +158,18 @@ button, summary                     { cursor: pointer; }
 	grid-template-columns: 1fr 1fr;
 	grid-gap: 1em;
 }
-.double.lean-right	{ grid-template-columns: 5fr 6fr; }
-.double.lean-left	{ grid-template-columns: 6fr 5fr; }
+.double.lean-right	{ grid-template-columns: 5fr 6fr;	}
+.double.lean-left	{ grid-template-columns: 6fr 5fr;	}
+.double > img		{ max-width: 90%;					}
 
 .centre-horizontal	{ align-self: center;	}
 .centre-vertical	{ justify-self: center;	}
 .centre				{ align-self: center; justify-self: center;	}
 .centre-text		{ text-align: center;	}
 
-.margin-medium		{ margin: 2em;		}
+.margin-wide		{ margin: 3em;			}
+.margin-medium		{ margin: 2em;			}
+.margin-vertical	{ margin: 2em 0 2em 0;	}
 
 .padding-wide		{ padding: 3em;		}
 .padding-wide-ntop	{ padding: 1em 3em 3em 3em;	}