[MRG] Update markdowncv to include icons, customizable colors with a new template

NEWS.md

@@ -1,5 +1,14 @@
 # vitae (development version)
 
+## Improvements
+
+* Updated `markdowncv` academicons version (@ccbaumler, #250).
+* Added more yaml front matter configuration options for `markdowncv` (@ccbaumler, #250).
+
+## New features
+
+* Added the ccbaumler template for `markdowncv` (@ccbaumler, #250).
+
 ## Bug fixes
 
 * Fixed issue with multiple `brief_entries()` producing overlapping text in 

R/markdowncv.R

@@ -19,7 +19,7 @@
 #' ([@elipapa](https://github.com/elipapa))
 #'
 #' @export
-markdowncv <- function(..., theme = c("kjhealy", "blmoore", "davewhipp")) {
+markdowncv <- function(..., theme = c("kjhealy", "blmoore", "davewhipp", "ccbaumler")) {
   theme <- match.arg(theme)
   template <- system.file("rmarkdown", "templates", "markdowncv",
                           "resources", "markdowncv.html",

inst/rmarkdown/templates/markdowncv/resources/markdowncv.html

@@ -5,6 +5,19 @@
   $for(author-meta)$<meta name="author" content="$author-meta$" />$endfor$
   $if(date-meta)$<meta name="date" content="$date-meta$" />$endif$
   <title>$if(title-prefix)$$title-prefix$ - $endif$$pagetitle$</title>
+  <link rel="stylesheet" href="https://use.fontawesome.com/releases/v6.5.1/css/all.css">
+  <link rel="stylesheet" type="text/css" href="media/academicons.min.css">
+
+  <style type="text/css">
+    :root {
+      --headcolor: $headcolor$;
+      --addresscolor: $addresscolor$;
+      --codecolor: $codecolor$;
+      --backcolor: $backcolor$;
+      --textcolor: $textcolor$;
+      --namecolor: $namecolor$;
+    }
+  </style>
 
   $if(math)$
   $if(mathjax)$
@@ -54,22 +67,22 @@
   $endfor$
   <div id="main">
     <div id="content">
-      <h1>$name$ $surname$</h1>
+      <h1>$if(namecolor)$<span style="color: var(--namecolor)">$name$</span>$else$$name$$endif$ $surname$</h1>
       $if(position)$<p>$position$</p>$endif$
       $if(address)$<p>$address$</p>$endif$
 
       <div id="webaddress">
-      |
-      $if(pronouns)$<i class="fa fa-comment"></i> $pronouns$ |$endif$
-      $if(phone)$<i class="fa fa-phone"></i> $phone$ |$endif$
-      $if(www)$<i class="fa fa-globe"></i> <a href="https://$www$">$www$</a> |$endif$
-      $if(email)$<i class="fa fa-envelope"></i> $email$ |$endif$
-      $if(twitter)$<i class="fa fa-twitter"></i> <a href="https://twitter.com/$twitter$">$twitter$</a> |$endif$
-      $if(github)$<i class="fa fa-github"></i> <a href="https://github.com/$github$">$github$</a> |$endif$
-      $if(linkedin)$<i class="fa fa-linkedin"></i> <a href="https://www.linkedin.com/in/$linkedin$/">$linkedin$</a> |$endif$
-      $if(orcid)$<i class="fa fa-orcid"></i> <a href="https://orcid.org/$orcid$">$orcid$</a> |$endif$
-      $if(scholar)$<i class="fa fa-google"></i> <a href="https://scholar.google.com/citations?user=$scholar$">$scholar$</a> |$endif$
-      $if(researchgate)$<i class="fa fa-researchgate"></i> <a href="https://www.researchgate.net/profile/$researchgate$">$researchgate$</a> |$endif$
+        |
+        $if(pronouns)$<i class="fa fa-comment"></i> $pronouns$ |$endif$
+        $if(phone)$<i class="fa fa-phone"></i> $phone$ |$endif$
+        $if(www)$<i class="fa fa-globe"></i> <a href="https://$www$">$www$</a> |$endif$
+        $if(email)$<i class="fa fa-envelope"></i> $email$ |$endif$
+        $if(twitter)$<i class="fab fa-twitter"></i> <a href="https://twitter.com/$twitter$">$twitter$</a> |$endif$
+        $if(github)$<i class="fab fa-github"></i> <a href="https://github.com/$github$">$github$</a> |$endif$
+        $if(linkedin)$<i class="fab fa-linkedin"></i> <a href="https://www.linkedin.com/in/$linkedin$/">$linkedin$</a> |$endif$
+        $if(orcid)$<i class="ai ai-orcid"></i> <a href="https://orcid.org/$orcid$">$orcid$</a> |$endif$
+        $if(scholar)$<i class="ai ai-google-scholar"></i> <a href="https://scholar.google.com/citations?user=$scholar$">$scholar$</a> |$endif$
+        $if(researchgate)$<i class="ai ai-researchgate"></i> <a href="https://www.researchgate.net/profile/$researchgate$">$researchgate$</a> |$endif$
       </div>
 
       $body$
@@ -79,4 +92,4 @@ <h1>$name$ $surname$</h1>
 $include-after$
 $endfor$
 </body>
-</html>
+</html>

inst/rmarkdown/templates/markdowncv/skeleton/media/ccbaumler-print.css

@@ -0,0 +1,200 @@
+/* http://meyerweb.com/eric/tools/css/reset/
+   v2.0 | 20110126
+   License: none (public domain)
+*/
+
+html, body, div, span, applet, object, iframe,
+h1, h2, h3, h4, h5, h6, p, blockquote, pre,
+a, abbr, acronym, address, big, cite, code,
+del, dfn, em, img, ins, kbd, q, s, samp,
+small, strike, strong, sub, sup, tt, var,
+b, u, i, center,
+dl, dt, dd, ol, ul, li,
+fieldset, form, label, legend,
+table, caption, tbody, tfoot, thead, tr, th, td,
+article, aside, canvas, details, embed,
+figure, figcaption, footer, header, hgroup,
+menu, nav, output, ruby, section, summary,
+time, mark, audio, video {
+	margin: 0;
+	padding: 0;
+	border: 0;
+	font-size: 100%;
+	font: inherit;
+	vertical-align: baseline;
+}
+/* HTML5 display-role reset for older browsers */
+article, aside, details, figcaption, figure,
+footer, header, hgroup, menu, nav, section {
+	display: block;
+}
+body {
+	line-height: 1;
+}
+ol, ul {
+	list-style: none;
+}
+blockquote, q {
+	quotes: none;
+}
+blockquote:before, blockquote:after,
+q:before, q:after {
+	content: '';
+	content: none;
+}
+table {
+	border-collapse: collapse;
+	border-spacing: 0;
+}
+
+/* end of reset */
+
+body {
+	font: normal normal 400;
+	font-size: 12pt;
+	line-height: 1.35em;
+	/*also written as...  font: normal normal 400 100%/1.5em;*/
+	font-family: Verdana,sans-serif;
+}
+
+p {
+	position: relative;
+	left: 25%;
+	margin-bottom: 0.2em;
+	margin-right: 0;
+	width: 60%;
+}
+
+.csl-left-margin {
+  position: relative;
+  float: left;
+  left: 25%;
+  margin-left: -3em;
+  margin-bottom: 0.2em;
+  margin-right: 0.5em;
+}
+.csl-right-inline {
+  position: relative;
+  left: 25%;
+  margin-bottom: 0.2em;
+  margin-right: 0;
+  width: 70%;
+}
+
+code {
+	font: normal normal;
+	font-size: 90%;
+	/*line-height: 1em;*/
+	font-family: Menlo,monospace,sans-serif;
+	color: var(--codecolor);
+}
+
+p code {
+	position: absolute;
+	text-align: right;
+	right: -20%;
+}
+
+
+ul {
+	position: relative;
+	left: 26%; /*Adjust the indent on detail list items*/
+	width: 55%;
+	margin-bottom: 1em;
+}
+
+/*comment to remove dashes in the list*/
+li:before {
+	content: "\1F896";/*\2192;*/
+	position: relative;
+	left: -0.25em;
+}
+
+li {
+	/*second line indent*/
+	padding-left: 1.25em;
+	text-indent: -1.25em;
+	/*color: #777;*/
+}
+
+li ul {
+	position: relative;
+	left: 0;
+	width: 100%;
+	margin-top: 0.25em;
+}
+
+h1,h2,h3,h4 {
+	font-weight: 400;
+	font-family: Cousine,Verdana,sans-serif;
+	width: 65%;
+}
+
+h1 {
+	text-align: left;
+	font-size: 3em;
+	line-height: 1em;
+	position: relative;
+	left: 25%;
+}
+
+h1+p {
+	/*subtitle*/
+	margin-top: 1em;
+	font-style: italic;
+	font-size: 110%;
+}
+
+h2 {
+	font-size: 1.1em;
+	color: var(--headcolor);
+	margin-top: 3em;
+	position: relative;
+	top: 1.4em;
+	text-align: right;
+	width: 20%;
+}
+h3 {
+	font-size: 1em;
+	line-height: 2em;
+	position: relative;
+	top: 1.7em;
+	text-align: right;
+	width: 20%;
+}
+
+a {
+	color: inherit;
+	/*text-decoration:none*/
+}
+
+a:hover {
+	color:#39f
+}
+
+#webaddress {
+	margin-top: 1em;
+	position: relative;
+	left: 25%;
+	color: var(--addresscolor);
+	font-family: Menlo,monospace,sans-serif;
+	font-size: 80%;
+}
+
+#webaddress a {
+	text-decoration: none;
+}
+
+em {
+	font-weight: bold;
+	font-style: italic;
+}
+
+strong {
+	font-weight: bold;
+}
+
+#ghbutton {
+	display: none;
+	visibility: hidden;
+}