quick cleanup

assassin.html

@@ -209,7 +209,7 @@
 <div class="summary">
 	<h2>List of Skills:</h2>
 	<div class="descriptionContainer"></div>
-	<!--#include virtual="./footer.txt"-->
+	<div class="footer">Art &copy; 2012 <a href="http://www.gearboxsoftware.com/" target="_blank">Gearbox Studios</a>. <a href="https://www.google.com/webfonts" target="_blank">Fonts</a> by Google. Code hosted on Github. <a href="https://github.com/seigler/bl2skills.com">Source Code</a>.</div>
 </div>
 
 </body>

commando.html

@@ -217,7 +217,7 @@
 <div class="summary">
 	<h2>List of Skills:</h2>
 	<div class="descriptionContainer"></div>
-	<!--#include virtual="./footer.txt"-->
+	<div class="footer">Art &copy; 2012 <a href="http://www.gearboxsoftware.com/" target="_blank">Gearbox Studios</a>. <a href="https://www.google.com/webfonts" target="_blank">Fonts</a> by Google. Code hosted on Github. <a href="https://github.com/seigler/bl2skills.com">Source Code</a>.</div>
 </div>
 
 </body>

footer.txt

@@ -1,16 +0,0 @@
-	<div class="footer">Art &copy; 2012 <a href="http://www.gearboxsoftware.com/" target="_blank">Gearbox Studios</a>. <a href="https://www.google.com/webfonts" target="_blank">Fonts</a> by Google. <a href="http://cdnjs.com/" target="_blank">scripts</a> hosted by Cloudflare. Code by <a href="http://www.reddit.com/message/compose/?to=kuqumi" target="_blank">kuqumi</a> of <a href="http://www.reddit.com/" target="_blank">Reddit.com</a> <a href="http://www.reddit.com/r/borderlands" target="_blank">/r/borderlands</a>. Bitcoins are welcome: <a href="bitcoin:1BoigKJBs1ngoi6EFy97jACUC2pn1a2Xxv?amount=0.01&label=bl2skills.com%20donation">1BoigKJBs1ngoi6EFy97jACUC2pn1a2Xxv</a></div>
-<!-- Piwik -->
-<script type="text/javascript">
-  var _paq = _paq || [];
-  _paq.push(['trackPageView']);
-  _paq.push(['enableLinkTracking']);
-  (function() {
-    var u="https://analytics.seigler.net/";
-    _paq.push(['setTrackerUrl', u+'piwik.php']);
-    _paq.push(['setSiteId', 1]);
-    var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0]; g.type='text/javascript';
-    g.defer=true; g.async=true; g.src=u+'piwik.js'; s.parentNode.insertBefore(g,s);
-  })();
-</script>
-<noscript><img src="http://analytics.seigler.net/piwik.php?idsite=1" style="position:absolute;border:0;" alt="" /></noscript>
-<!-- End Piwik Code -->

gunzerker.html

@@ -223,7 +223,7 @@
 <div class="summary">
 	<h2>List of Skills:</h2>
 	<div class="descriptionContainer"></div>
-	<!--#include virtual="./footer.txt"-->
+	<div class="footer">Art &copy; 2012 <a href="http://www.gearboxsoftware.com/" target="_blank">Gearbox Studios</a>. <a href="https://www.google.com/webfonts" target="_blank">Fonts</a> by Google. Code hosted on Github. <a href="https://github.com/seigler/bl2skills.com">Source Code</a>.</div>
 </div>
 
 </body>

main.css

@@ -1,6 +1,17 @@
-html,body { height: 100%; margin: 0; padding: 0; }
+html,
-html {overflow-y: scroll;}
 body {
+  min-height: 100vh;
+  margin: 0;
+  padding: 0;
+}
+
+html {
+  overflow-y: scroll;
+}
+
+body {
+  display: flex;
+  flex-direction: column;
   background: #333 url("background.jpg") no-repeat fixed center center;
   background-size: cover;
   color: #eee;
@@ -8,15 +19,28 @@ body {
   cursor: default;
   text-align: center;
 }
-::-moz-selection { color: black; background: #FBB406; }
+
-::selection { color: black; background: #FBB406; }
+::-moz-selection {
-h1, h2, h3 {
+  color: black;
+  background: #FBB406;
+}
+
+::selection {
+  color: black;
+  background: #FBB406;
+}
+
+h1,
+h2,
+h3 {
   margin: 0;
   font-weight: normal;
 }
+
 em {
   font-style: normal;
 }
+
 .header {
   font-size: 24pt;
   text-transform: uppercase;
@@ -24,26 +48,30 @@ em {
   padding-bottom: 10px;
   margin-bottom: 10px;
 }
+
 body.choicePage {
   display: table;
   width: 100%;
 }
+
 body.choicePage .wrapper {
   display: table-cell;
   width: 100%;
   vertical-align: middle;
 }
-.header *
+
-{
+.header * {
   position: relative;
   z-index: 11;
 }
+
 .header .links {
   text-align: center;
   line-height: 1.2;
   font-size: 50%;
   z-index: 20;
 }
+
 .header a.permalink {
   color: white;
   padding: 0.5em 0;
@@ -53,29 +81,37 @@ body.choicePage .wrapper {
   -o-user-select: text;
   user-select: text;
 }
+
 .header a.reset {
   color: red;
 }
-.header, .summary {
+
-	background-color: rgba(0,0,0,0.5);
+.header,
+.summary {
+  background-color: rgba(0, 0, 0, 0.5);
 }
+
 .header h1 {
   color: #FFDE09;
   font-size: 140%;
 }
+
 .header h1 em {
   font-style: normal;
   font-size: 200%;
   position: relative;
   top: 0.15em;
 }
+
 .header h2 {
   color: #FBB406;
   font-size: 150%;
 }
+
 .header h3 {
   font-size: 80%;
 }
+
 .treeCollection {
   text-align: center;
   width: 741px;
@@ -89,31 +125,52 @@ body.choicePage .wrapper {
   -o-user-select: none;
   user-select: none;
 }
+
 .treewrapper {
   float: left;
   width: 247px;
   height: 396px;
 }
+
 .tree {
   width: 174px;
   text-align: center;
   margin: 20px auto 0;
 }
+
 .bglayer {
   position: absolute;
   height: 396px;
   width: 247px;
 }
+
 .bglayer.color {
   height: 80px;
 }
 
-.green .gray { background: url("skill_bg_green_gray.png") transparent; }
+.green .gray {
-.blue .gray { background: url("skill_bg_blue_gray.png") transparent; }
+  background: url("skill_bg_green_gray.png") transparent;
-.red .gray { background: url("skill_bg_red_gray.png") transparent; }
+}
-.green .color { background: url("skill_bg_green.png") transparent; }
+
-.blue .color { background: url("skill_bg_blue.png") transparent; }
+.blue .gray {
-.red .color { background: url("skill_bg_red.png") transparent; }
+  background: url("skill_bg_blue_gray.png") transparent;
+}
+
+.red .gray {
+  background: url("skill_bg_red_gray.png") transparent;
+}
+
+.green .color {
+  background: url("skill_bg_green.png") transparent;
+}
+
+.blue .color {
+  background: url("skill_bg_blue.png") transparent;
+}
+
+.red .color {
+  background: url("skill_bg_red.png") transparent;
+}
 
 .skill {
   padding: 3px;
@@ -123,6 +180,7 @@ body.choicePage .wrapper {
   position: relative;
   float: left;
 }
+
 .skill>img {
   width: 52px;
   height: 53px;
@@ -134,21 +192,33 @@ body.choicePage .wrapper {
   width: 35px;
   height: 21px;
   line-height: 21px;
-	bottom: 0; right: 0;
+  bottom: 0;
+  right: 0;
   padding: 0 2px;
   background: url("icons/points_overlay.png") transparent;
   color: white;
 }
-.skill.partial .points { color: #F80; }
-.skill.full .points { color: #0B0; }
 
-.tier, div.totalPoints, legend {
+.skill.partial .points {
+  color: #F80;
+}
+
+.skill.full .points {
+  color: #0B0;
+}
+
+.tier,
+div.totalPoints,
+legend {
   clear: both;
 }
+
 div.totalPoints {
   text-align: right;
 }
-legend, span.totalPoints {
+
+legend,
+span.totalPoints {
   text-transform: uppercase;
   font-weight: bold;
   font-size: 22pt;
@@ -158,12 +228,20 @@ legend, span.totalPoints {
   display: block;
   width: 174px;
 }
+
 legend {
   width: 150px;
   text-align: left;
 }
-.push1 { margin-left: 58px; }
+
-.skill.partial .perLevel, .skill.full .perLevel  { display: none; }
+.push1 {
+  margin-left: 58px;
+}
+
+.skill.partial .perLevel,
+.skill.full .perLevel {
+  display: none;
+}
 
 .tree .description {
   display: none;
@@ -176,46 +254,60 @@ legend {
   padding: 0 0.25em 0.5em;
   text-align: center;
 }
-.green .description, .blue .description {
+
+.green .description,
+.blue .description {
   left: 110%;
 }
+
 .red .description {
   right: 110%;
 }
+
 .tier[data-level='4'] .description {
   top: auto;
   bottom: -59px;
 }
+
 .tier[data-level='4'] .description.shortTier4Description {
   top: 0;
   bottom: auto;
 }
+
 .tier[data-level='5'] .description {
   top: auto;
   bottom: 0;
 }
+
 .tree .description h2 {
   padding: 0.15em 0;
   margin-bottom: 0.15em;
   font-size: 125%;
   border-bottom: 1px solid gray;
 }
+
 .summary {
+  display: flex;
+  flex-grow: 1;
+  flex-direction: column;
   position: relative;
   margin: 10px 0 0;
   padding: 8px 0;
   line-height: 1.1;
   z-index: 10;
 }
+
 .descriptionContainer {
   max-width: 700px;
   margin: 0 auto;
 }
+
 .descriptionContainer div.skillText {
   clear: both;
   border-top: 1px solid white;
   text-align: left;
 }
+
 .descriptionContainer strong {
   display: block;
   font-weight: normal;
@@ -226,52 +318,85 @@ legend {
   margin-right: -220px;
   text-align: right;
 }
+
 .descriptionContainer div.descriptionText {
   margin: 4px 0 4px 230px;
   padding: 0;
 }
+
 .descriptionContainer .perLevel {
   display: none;
 }
+
 .footer {
-	margin-top: 100px;
+  padding-top: 50px;
+  margin-top: auto;
   text-align: center;
   font-size: 70%;
   color: white;
-	color: rgba(255,255,255,0.5);
+  color: rgba(255, 255, 255, 0.5);
 }
-.footer a { color: white; color: rgba(255,255,255,0.5); }
+
-.footer a:hover { color: red; }
+.footer a {
+  color: white;
+  color: rgba(255, 255, 255, 0.5);
+}
+
+.footer a:hover {
+  color: red;
+}
+
 .skill.partial .description em {
   color: #F80;
 }
+
 .skill.full .description em {
   color: #0B0;
 }
+
 .skill:hover .description {
   display: block;
 }
+
 .skill:hover .description:hover {
   display: none;
 }
-.green legend { color: #41974D; }
+
-.blue legend { color: #2A87C7; }
+.green legend {
-.red legend { color: #A93640; }
+  color: #41974D;
+}
+
+.blue legend {
+  color: #2A87C7;
+}
+
+.red legend {
+  color: #A93640;
+}
+
 a.biglink {
   display: inline-block;
   color: inherit;
   padding: 1em;
   margin: 10px;
-	background: rgba(0,0,0,0.5);
+  background: rgba(0, 0, 0, 0.5);
   border: 2px solid white;
   text-decoration: none;
 }
+
 a.biglink:hover {
   background: black;
   text-decoration: underline;
 }
-a.unavailable { cursor: not-allowed; }
+
-a.unavailable:hover { text-decoration: none; }
+a.unavailable {
+  cursor: not-allowed;
+}
+
+a.unavailable:hover {
+  text-decoration: none;
+}
+
 img.portrait {
   position: absolute;
   position: fixed;

mechromancer.html

@@ -233,7 +233,7 @@
 <div class="summary">
 	<h2>List of Skills:</h2>
 	<div class="descriptionContainer"></div>
-	<!--#include virtual="./footer.txt"-->
+	<div class="footer">Art &copy; 2012 <a href="http://www.gearboxsoftware.com/" target="_blank">Gearbox Studios</a>. <a href="https://www.google.com/webfonts" target="_blank">Fonts</a> by Google. Code hosted on Github. <a href="https://github.com/seigler/bl2skills.com">Source Code</a>.</div>
 </div>
 
 </body>

psycho.html

@@ -230,7 +230,7 @@
 <div class="summary">
 	<h2>List of Skills:</h2>
 	<div class="descriptionContainer"></div>
-	<!--#include virtual="./footer.txt"-->
+	<div class="footer">Art &copy; 2012 <a href="http://www.gearboxsoftware.com/" target="_blank">Gearbox Studios</a>. <a href="https://www.google.com/webfonts" target="_blank">Fonts</a> by Google. Code hosted on Github. <a href="https://github.com/seigler/bl2skills.com">Source Code</a>.</div>
 </div>
 
 </body>

siren.html

@@ -211,7 +211,7 @@
 <div class="summary">
 	<h2>List of Skills:</h2>
 	<div class="descriptionContainer"></div>
-	<!--#include virtual="./footer.txt"-->
+	<div class="footer">Art &copy; 2012 <a href="http://www.gearboxsoftware.com/" target="_blank">Gearbox Studios</a>. <a href="https://www.google.com/webfonts" target="_blank">Fonts</a> by Google. Code hosted on Github. <a href="https://github.com/seigler/bl2skills.com">Source Code</a>.</div>
 </div>
 
 </body>