Change directory structure

parent 11c1ecd8
......@@ -80,7 +80,7 @@
<script>
(function() {
var cssMain = document.createElement('link');
cssMain.href = '{{ "/assets/main.css" | relative_url }}';
cssMain.href = '{{ "/assets/css/main.css" | relative_url }}';
cssMain.rel = 'stylesheet';
cssMain.type = 'text/css';
document.getElementsByTagName('head')[0].appendChild(cssMain);
......@@ -100,7 +100,7 @@
<script>
(function() {
var cssMain = document.createElement('link');
cssMain.href = '{{ site.skin | default: '/assets/fonts.css' | relative_url }}';
cssMain.href = '{{ site.skin | default: '/assets/css/fonts.css' | relative_url }}';
cssMain.rel = 'stylesheet';
cssMain.type = 'text/css';
document.getElementsByTagName('head')[0].appendChild(cssMain);
......
......@@ -59,17 +59,17 @@ Simply add `\balance` in the first column of the last page, and you're done! Som
<div class="container figure">
<div class="row">
<div class="col-md-4">
<div class="papers"><img src="/assets/nothing.png" alt="Without balance" class="img-rounded" style="border: 1px solid gray;"/></div>
<div class="papers"><img src="/assets/images/nothing.png" alt="Without balance" class="img-rounded" style="border: 1px solid gray;"/></div>
<div class="caption">No column balancing.</div>
</div>
<div class="col-md-4">
<div class="papers"><img src="/assets/balance.png" alt="With flushend" class="img-rounded" style="border: 1px solid gray;" /></div>
<div class="papers"><img src="/assets/images/balance.png" alt="With flushend" class="img-rounded" style="border: 1px solid gray;" /></div>
<div class="caption">With <code>balance</code>.</div>
</div>
<div class="col-md-4">
<div class="papers"><img src="/assets/flushend.png" alt="With flushend" class="img-rounded" style="border: 1px solid gray;" /></div>
<div class="papers"><img src="/assets/images/flushend.png" alt="With flushend" class="img-rounded" style="border: 1px solid gray;" /></div>
<div class="caption">With <code>flushend</code>.</div>
</div>
</div>
......@@ -90,7 +90,7 @@ Consider this example, adapted from [File:LaTeX animal table with booktabs.png](
\usepackage{booktabs} % Nicer tables
{% endhighlight %}
{% include figure.html url="/assets/booktabs.png" description="Booktabs example." %}
{% include figure.html url="/assets/images/booktabs.png" description="Booktabs example." %}
{% highlight tex linenos %}
\documentclass[10pt, a4paper]{article}
......@@ -164,11 +164,11 @@ Text typeset in LaTeX already looks great, but can be made even nicer with `micr
<div class="container figure">
<div class="row justify-content-md-center">
<div class="col-md-4">
<div class="papers"><img src="/assets/withoutmicrotype-0.png" alt="Without microtype" class="img-rounded" style="border: 1px solid gray;"/></div>
<div class="papers"><img src="/assets/images/withoutmicrotype-0.png" alt="Without microtype" class="img-rounded" style="border: 1px solid gray;"/></div>
<div class="caption">Without <code>microtype</code>.</div>
</div>
<div class="col-md-4">
<div class="papers"><img src="/assets/withmicrotype-0.png" alt="With microtype" class="img-rounded" style="border: 1px solid gray;" /></div>
<div class="papers"><img src="/assets/images/withmicrotype-0.png" alt="With microtype" class="img-rounded" style="border: 1px solid gray;" /></div>
<div class="caption">With <code>microtype</code>.</div>
</div>
</div>
......@@ -200,19 +200,19 @@ See [Publication ready figures]({% post_url 2019-09-29-publication_ready_figures
<div class="container figure">
<div class="row justify-content-md-center">
<div class="col-md-3">
<div class="papers"><img src="/assets/withoutsavetrees.png" alt="Without microtype" class="img-rounded" style="border: 1px solid gray;"/></div>
<div class="papers"><img src="/assets/images/withoutsavetrees.png" alt="Without microtype" class="img-rounded" style="border: 1px solid gray;"/></div>
<div class="caption">Without <code>savetrees</code>.</div>
</div>
<div class="col-md-3">
<div class="papers"><img src="/assets/subtlesavetrees.png" alt="With microtype" class="img-rounded" style="border: 1px solid gray;" /></div>
<div class="papers"><img src="/assets/images/subtlesavetrees.png" alt="With microtype" class="img-rounded" style="border: 1px solid gray;" /></div>
<div class="caption">With subtle <code>savetrees</code>.</div>
</div>
<div class="col-md-3">
<div class="papers"><img src="/assets/moderatesavetrees.png" alt="Without microtype" class="img-rounded" style="border: 1px solid gray;"/></div>
<div class="papers"><img src="/assets/images/moderatesavetrees.png" alt="Without microtype" class="img-rounded" style="border: 1px solid gray;"/></div>
<div class="caption">With moderate <code>savetrees</code>.</div>
</div>
<div class="col-md-3">
<div class="papers"><img src="/assets/extremesavetrees.png" alt="With microtype" class="img-rounded" style="border: 1px solid gray;" /></div>
<div class="papers"><img src="/assets/images/extremesavetrees.png" alt="With microtype" class="img-rounded" style="border: 1px solid gray;" /></div>
<div class="caption">With extreme <code>savetrees</code>.</div>
</div>
</div>
......@@ -248,7 +248,7 @@ TikZ and PGF {% cite Tikz2014 %} are packages for programatically creating figur
\tikzset{>=latex}
{% endhighlight %}
{% include figure.html url="/assets/masks_standalone.svg" description="TikZ figure example from a recent paper." %}
{% include figure.html url="/assets/images/masks_standalone.svg" description="TikZ figure example from a recent paper." %}
See more examples of TikZ figures on [TeXample.net](http://www.texample.net/).
......
......@@ -35,13 +35,13 @@ In this post we will take a look at the practicalities of writing a document in
This post is part of a series and follows [Publication ready figures]({% post_url 2019-09-29-publication_ready_figures %}). To see more on requirements on open source repositories see [Reproducibility aspects of the Swedish COVID&ndash;19 estimate report]({% post_url 2020-04-25-fohm-seir-stockholm %}).
{% include figure.html url="/assets/gitlab-pipeline-simple.svg" description="Our GitLab CI pipeline consists of a two build stages and one test stage. These stages run in separate Docker containers." colclass="col-md-10" %}
{% include figure.html url="/assets/images/gitlab-pipeline-simple.svg" description="Our GitLab CI pipeline consists of a two build stages and one test stage. These stages run in separate Docker containers." colclass="col-md-10" %}
## The GitLab CI pipeline
In GitLab we have a possibility to run a pipeline for each commit using [GitLab CI/CD](https://docs.gitlab.com/ee/ci/). For this project we have defined three stages: the first stage (`figures`) creates the plots in Python; the second (`build`) compiles the LaTeX document and the third (`test`) runs unit tests.
{% include figure.html url="/assets/gitlab-pipeline.png" description="Our GitLab CI pipeline consists of a figures stage, a build stage and a test stage." colclass="col-md-8" %}
{% include figure.html url="/assets/images/gitlab-pipeline.png" description="Our GitLab CI pipeline consists of a figures stage, a build stage and a test stage." colclass="col-md-8" %}
The complete script [`.gitlab-ci.yml`](https://gitlab.com/martisak/latex-pipeline/-/blob/master/.gitlab-ci.yml) can be found in the GitLab repository.
......@@ -165,7 +165,7 @@ make clean render LATEXMK_OPTIONS_EXTRA=-pvc
This means we can run this command once and just edit our document in our favorite text editor.
{% include figure.html url="/assets/latex-dev-env.png" description="Development environment using Sublime&nbsp;Text&nbsp;3." colclass="col-md-8" %}
{% include figure.html url="/assets/images/latex-dev-env.png" description="Development environment using Sublime&nbsp;Text&nbsp;3." colclass="col-md-8" %}
## Related work
......
......@@ -65,7 +65,7 @@ and was created by TeX.</blockquote>
</div>
<div class="col-md-4">
<div><img src="/assets/edas-pain.png" alt="EDAS Pain" /></div>
<div><img src="/assets/images/edas-pain.png" alt="EDAS Pain" /></div>
<div class="caption">It can take many attempts to pass <a href="https://edas.info">EDAS</a> PDF checks.</div>
</div>
</div>
......@@ -80,7 +80,7 @@ number of interesting things to test that other formats don't.
<div class="container figure">
<div class="row justify-content-md-center">
<div class="col-md-6">
<div class="papers"><img src="/assets/ieee-1.png" alt="Without microtype" class="img-rounded" style="border: 1px solid gray;"/></div>
<div class="papers"><img src="/assets/images/ieee-1.png" alt="Without microtype" class="img-rounded" style="border: 1px solid gray;"/></div>
<div class="caption">We use the example from the <a href='
https://www.ieee.org/conferences/publishing/templates.html'>IEEE Manuscript Templates for Conference Proceedings</a> to test these methods.</div>
</div>
......@@ -264,11 +264,11 @@ below in blue) and the y-dimension (illustrated below in red).
<div class="container figure">
<div class="row justify-content-md-center">
<div class="col-md-6">
<div class="papers"><img src="/assets/layout-1.png" alt="Without microtype" class="img-rounded" style="border: 1px solid gray;"/></div>
<div class="papers"><img src="/assets/images/layout-1.png" alt="Without microtype" class="img-rounded" style="border: 1px solid gray;"/></div>
<div class="caption">The first page with overlayed non-overlapping bounding boxes in the x-direction in blue and non-overlapping bounding boxes in the y-direction in red. To find the two columns, the 12 first bounding boxes were skipped.</div>
</div>
<div class="col-md-6">
<div class="papers"><img src="/assets/layout-2.png" alt="With microtype" class="img-rounded" style="border: 1px solid gray;" /></div>
<div class="papers"><img src="/assets/images/layout-2.png" alt="With microtype" class="img-rounded" style="border: 1px solid gray;" /></div>
<div class="caption">The second page with overlayed non-overlapping bounding boxes in blue. There is only one non-overlapping bounding box in the y-direction.</div>
</div>
</div>
......
......@@ -33,19 +33,19 @@ At submission time we find ourselves fighting the automated PDF checks of the pu
<div class="container figure">
<div class="row justify-content-md-center">
<div class="col-md-3">
<div class="papers"><img src="/assets/latex_nightmares-0.png" alt="Page 1 of a PDF Document" class="img-rounded" style="border: 1px solid gray;"/></div>
<div class="papers"><img src="/assets/images/latex_nightmares-0.png" alt="Page 1 of a PDF Document" class="img-rounded" style="border: 1px solid gray;"/></div>
</div>
<div class="col-md-3">
<div class="papers"><img src="/assets/latex_nightmares-1.png" alt="Page 2 of a PDF Document" class="img-rounded" style="border: 1px solid gray;"/></div>
<div class="papers"><img src="/assets/images/latex_nightmares-1.png" alt="Page 2 of a PDF Document" class="img-rounded" style="border: 1px solid gray;"/></div>
</div>
<div class="col-md-3">
<div class="papers"><img src="/assets/latex_nightmares-2.png" alt="Page 3 of a PDF Document" class="img-rounded" style="border: 1px solid gray;"/></div>
<div class="papers"><img src="/assets/images/latex_nightmares-2.png" alt="Page 3 of a PDF Document" class="img-rounded" style="border: 1px solid gray;"/></div>
</div>
<div class="col-md-3">
<div class="papers"><img src="/assets/latex_nightmares-3.png" alt="Unwanted Page 4 of a PDF Document" class="img-rounded" style="border: 1px solid gray;"/></div>
<div class="papers"><img src="/assets/images/latex_nightmares-3.png" alt="Unwanted Page 4 of a PDF Document" class="img-rounded" style="border: 1px solid gray;"/></div>
</div>
</div>
......@@ -57,7 +57,7 @@ At submission time we find ourselves fighting the automated PDF checks of the pu
<div class="container figure">
<div class="row justify-content-md-center">
<div class="col-md-8">
<div><img src="/assets/phd090617s.png" alt="Page limits from Piled Higher and Deeper by Jorge Cham" class="img-rounded"/></div>
<div><img src="/assets/images/phd090617s.png" alt="Page limits from Piled Higher and Deeper by Jorge Cham" class="img-rounded"/></div>
<div class="caption">A situation many of us recognize, regardless of where we are in our academic careers. With permission from "<a href="http://www.phdcomics.com">Piled Higher and Deeper</a>" by Jorge Cham.</div>
</div>
</div>
......@@ -87,12 +87,12 @@ https://www.ieee.org/conferences/publishing/templates.html'>IEEE Manuscript Temp
<div class="container figure">
<div class="row justify-content-md-center">
<div class="col-md-6">
<div class="papers"><img src="/assets/ieee-1.png" alt="Conference paper template" class="img-rounded" style="border: 1px solid gray;"/></div>
<div class="papers"><img src="/assets/images/ieee-1.png" alt="Conference paper template" class="img-rounded" style="border: 1px solid gray;"/></div>
<div class="caption">We use the example from the <a href='
https://www.ieee.org/conferences/publishing/templates.html'>IEEE Manuscript Templates for Conference Proceedings</a> to test these methods.</div>
</div>
<div class="col-md-6">
<div class="papers"><img src="/assets/layout-cost.png" alt="Last page with emphasized white space at the bottom of the page." class="img-rounded" style="border: 1px solid gray;"/></div>
<div class="papers"><img src="/assets/images/layout-cost.png" alt="Last page with emphasized white space at the bottom of the page." class="img-rounded" style="border: 1px solid gray;"/></div>
<div class="caption">The cost we optimize is based on the bottom margin on the last page and depends on some input variables, such as figure widths.</div>
</div>
</div>
......@@ -210,13 +210,13 @@ As we can see in the figures below, the objective function $$l(\bf{\theta})$$ is
<div class="row justify-content-md-center">
<div class="col-md-6">
<div>
<video width= "350" height="350" autoplay loop muted playsinline><source src="/assets/basic_animation.webm" type="video/webm"></video>
<video width= "350" height="350" autoplay loop muted playsinline><source src="/assets/images/basic_animation.webm" type="video/webm"></video>
</div>
<div class="caption">Our objective function depends on the two figure widths <code>figonewidth</code> and <code>figonewidth</code>.</div>
</div>
<div class="col-md-6">
<div>
<video width= "350" height="350" autoplay loop muted playsinline><source src="/assets/reg_animation.webm" type="video/webm"></video>
<video width= "350" height="350" autoplay loop muted playsinline><source src="/assets/images/reg_animation.webm" type="video/webm"></video>
</div>
<div class="caption">The objective function with L2-regularization is more well-behaving, but note the lack of symmetry around the diagonal.</div>
</div>
......@@ -242,7 +242,7 @@ The average execution time for each task is 5.46 seconds, and we can run 8 of th
<div class="container figure">
<div class="row justify-content-md-center">
<div class="col-md-8">
<div><img src="/assets/latex_comp_time_pdf.png" alt="Histogram over document complation time for diffent number of CPUs used." class="img-rounded"/></div>
<div><img src="/assets/images/latex_comp_time_pdf.png" alt="Histogram over document complation time for diffent number of CPUs used." class="img-rounded"/></div>
<div class="caption">Document compilation (really Ray worker execution) time PDF, because measuring things makes it feel more like science.</div>
</div>
</div>
......@@ -305,17 +305,17 @@ docker run -v [RAY_RESULTS_PATH]:/tf_logs -p 6006:6006 tensorflow/tensorflow:2.1
<div class="container figure">
<div class="row justify-content-md-center">
<div class="col-md-4">
<div><img style="border: 1px solid black;" src="/assets/tensorboard-latex.png" alt="Visualizing document compilation in Tensorboard and Ray Tune" class="img-rounded"/></div>
<div><img style="border: 1px solid black;" src="/assets/images/tensorboard-latex.png" alt="Visualizing document compilation in Tensorboard and Ray Tune" class="img-rounded"/></div>
</div>
<div class="col-md-4">
<div><img style="border: 1px solid black;" src="/assets/mlflow-ui-screenshot.png" alt="Visualizing document compilation in MLFlow and Ray Tune" class="img-rounded"/></div>
<div><img style="border: 1px solid black;" src="/assets/images/mlflow-ui-screenshot.png" alt="Visualizing document compilation in MLFlow and Ray Tune" class="img-rounded"/></div>
</div>
<div class="col-md-4">
<div><img style="border: 1px solid black;" src="/assets/ray-dashboard-screenshot.png" alt="Visualizing document compilation in Ray Dashboard" class="img-rounded"/></div>
<div><img style="border: 1px solid black;" src="/assets/images/ray-dashboard-screenshot.png" alt="Visualizing document compilation in Ray Dashboard" class="img-rounded"/></div>
</div>
</div>
......@@ -344,13 +344,13 @@ MLFlow {% cite MLFlow %} is a Python package that can be used to for example tra
<div class="container figure">
<div class="row justify-content-md-center">
<div class="col-md-8">
<div><img src="/assets/hyperopt_solutions.png" alt="Loss surface with L2-regularization and searched solutions." class="img-rounded"/></div>
<div><img src="/assets/images/hyperopt_solutions.png" alt="Loss surface with L2-regularization and searched solutions." class="img-rounded"/></div>
<div class="caption">The objective function with L2-regularization visualized with solutions searched by HyperOpt.</div>
</div>
</div>
<div class="row justify-content-md-center">
<div class="col-md-6">
<div><img src="/assets/latex_score_diagonal.png" alt="One-dimensional objective function score as a function of figure widths." class="img-rounded"/></div>
<div><img src="/assets/images/latex_score_diagonal.png" alt="One-dimensional objective function score as a function of figure widths." class="img-rounded"/></div>
<div class="caption">Objective function score as a function of figure widths when both figures are set to equal width. Note that the optimal solution is not the maximum figure width that still satisfies the constraints.</div>
</div>
</div>
......
---
---
@import "variables";
@import "so-simple";
@import "variables";
@import url('https://cdn.rawgit.com/jpswalsh/academicons/master/css/academicons.min.css');
@import url('https://use.fontawesome.com/releases/v5.2.0/css/all.css');
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment