Hack, hack, hack

Makefile

@@ -8,11 +8,11 @@ STYLES          := styles.css
 WEASYPRINT      := weasyprint -s $(STYLES)
 
 portfolio:
-	@mkdir -p generated
-	@$(CURL) $(PORTFOLIO) | $(PANDOC) \
+	@mkdir -p generated && \
+	$(CURL) $(PORTFOLIO) | $(PANDOC) \
 	--read markdown \
 	--write html \
 	--standalone \
 	--include-in-header $(HEADER) \
-	--output $(GENERATED_DIR)/portfolio.html
-	@$(WEASYPRINT) --presentational-hints  $(GENERATED_DIR)/portfolio.html $(GENERATED_DIR)/portfolio.pdf
+	--output $(GENERATED_DIR)/portfolio.html && \
+	$(WEASYPRINT) --presentational-hints  $(GENERATED_DIR)/portfolio.html $(GENERATED_DIR)/portfolio.pdf

header.html

@@ -1,5 +1,10 @@
 <style type='text/css' media='screen'>
 
+img {
+  width: 200px;
+  padding-left: 10px;
+}
+
 @page{
   margin:5mm 12mm;
 }
@@ -18,14 +23,16 @@ body{
 table, th, td {
   border: 1px solid black;
 }
-  table {
-    width: 100%;
-    margin: 20px 10px;
-  }
-  th, td{
-    padding:5px;
-    text-align: left;
-  }
+
+table {
+  width: 100%;
+  margin: 20px 10px;
+}
+
+th, td{
+  padding:5px;
+  text-align: left;
+}
 
 h1, h2, h3{
   margin-top:1.5em;
@@ -38,17 +45,19 @@ hr{
   page-break-after: always;
 }
 
-figure img, figure figcaption{
-  max-width:320px;
-  max-height:260px;
+figure img, 
+figure figcaption {
+  max-width:20px;
+  max-height:20px;
   margin: 10px 10px 0 0;
 }
-  figure figcaption{
-    font-family: monospace;
-    font-size: 12px;
-    line-height: 1.25;
-    margin-bottom:20px;
-  }
+
+figure figcaption {
+  font-family: monospace;
+  font-size: 12px;
+  line-height: 1.25;
+  margin-bottom:20px;
+}
 
 .img-left figure {
   float: left;
@@ -63,12 +72,12 @@ figure img, figure figcaption{
 .img-big figure{
   margin:0 20px;
 }
-  .img-big figure img, .img-big figure figcaption{
-    max-width: 100%;
-    max-height: 100%;
-    clear: both;
-  }
 
+.img-big figure img, .img-big figure figcaption{
+  max-width: 100%;
+  max-height: 100%;
+  clear: both;
+}
 
 .footnotes{
   page-break-before: avoid;

styles.css

@@ -13,17 +13,24 @@ body{
   width: 100%;
 }
 
+img {
+  width: 200px;
+  padding-left: 10px;
+}
+
 table, th, td {
   border: 1px solid black;
 }
-  table {
-    width: 100%;
-    margin: 20px 10px;
-  }
-  th, td{
-    padding:5px;
-    text-align: left;
-  }
+
+table {
+  width: 100%;
+  margin: 20px 10px;
+}
+
+th, td{
+  padding:5px;
+  text-align: left;
+}
 
 h1, h2, h3{
   margin-top:1.5em;
@@ -36,17 +43,19 @@ hr{
   page-break-after: always;
 }
 
-figure img, figure figcaption{
-  max-width:320px;
-  max-height:260px;
+figure img, 
+figure figcaption {
+  max-width:20px;
+  max-height:20px;
   margin: 10px 10px 0 0;
 }
-  figure figcaption{
-    font-family: monospace;
-    font-size: 12px;
-    line-height: 1.25;
-    margin-bottom:20px;
-  }
+
+figure figcaption {
+  font-family: monospace;
+  font-size: 12px;
+  line-height: 1.25;
+  margin-bottom:20px;
+}
 
 .img-left figure {
   float: left;
@@ -61,12 +70,12 @@ figure img, figure figcaption{
 .img-big figure{
   margin:0 20px;
 }
-  .img-big figure img, .img-big figure figcaption{
-    max-width: 100%;
-    max-height: 100%;
-    clear: both;
-  }
 
+.img-big figure img, .img-big figure figcaption{
+  max-width: 100%;
+  max-height: 100%;
+  clear: both;
+}
 
 .footnotes{
   page-break-before: avoid;