From e9717bb030539dce09cd6aa7554cfe5a7343fd50 Mon Sep 17 00:00:00 2001
From: Cristian Martinez <me@martinec.org>
Date: Fri, 7 May 2021 17:31:04 +0200
Subject: [PATCH] [feature #11] Allow to customize authors style

---
 CHANGELOG.md      |  6 ++++++
 README.md         | 21 +++++++++++++++++++++
 blueprints.yaml   |  2 +-
 css/bibtexify.css | 25 +++++++++++++++++++------
 js/bibtexify.js   |  9 +++++----
 5 files changed, 52 insertions(+), 11 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 694b7f5..6c58e72 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,3 +1,9 @@
+# v1.2.0
+## 05/07/2021
+
+1. [](#new)
+    * Allow to customize authors style using CSS (feature-request #11)
+
 # v1.1.1
 ## 04/24/2018
 
diff --git a/README.md b/README.md
index e79bf22..300b88a 100644
--- a/README.md
+++ b/README.md
@@ -1,3 +1,4 @@
+
 # Grav BibTeXify Plugin
 
 ![](assets/bibtexify.png)
@@ -90,6 +91,26 @@ Options can be passed as attributes of the shortcode, a summary of the current o
 </tbody>
 </table>
 
+# Cookbook
+
+## Show only the first n authors
+
+Starting `v1.2.0`, this can be achieved using CSS.
+
+```css
+.bibtexify-authors li {
+  display:none;
+}
+
+.bibtexify-authors li:nth-child(-n+2) {
+  display: inline;
+}
+
+.bibtexify-authors .bibtexify-author-etal:before {
+  content: ", et al.";
+}
+```
+
 # Known issues
 
 - [bib-publication-list](https://github.com/vkaravir/bib-publication-list) have some issues dealing with escaped characters. A possible workaround is to use [JabRef](http://www.jabref.org) to convert the LaTeX encodings to Unicode characters as follows: `Menu Edit > Select All` then `Menu Quality > Cleanup entries`, finally add a new formatter for `all-text-fields` with the operation `Latex to Unicode` and click OK.
diff --git a/blueprints.yaml b/blueprints.yaml
index f4a901c..472f430 100644
--- a/blueprints.yaml
+++ b/blueprints.yaml
@@ -1,5 +1,5 @@
 name: BibTeXify
-version: 1.1.1
+version: 1.2.0
 description: "This plugin turn a list of BibTeX references into an interactive page"
 icon: book
 author:
diff --git a/css/bibtexify.css b/css/bibtexify.css
index 74790d8..78541b5 100644
--- a/css/bibtexify.css
+++ b/css/bibtexify.css
@@ -30,11 +30,11 @@ span.undefined {
     text-align: center;
     width: 100%;
     font-size: small;
--webkit-transform: rotate(-90deg); //Chrome, Safari
--moz-transform: rotate(-90deg); //Firefox
--o-transform: rotate(-90deg); //Opera
--ms-transform: rotate(-90deg); //IE
-transform: rotate(-90deg); //браузеры без префексов
+    -webkit-transform: rotate(-45deg); //Chrome, Safari
+    -moz-transform: rotate(-45deg); //Firefox
+    -o-transform: rotate(-45deg); //Opera
+    -ms-transform: rotate(-45deg); //IE
+    transform: rotate(-45deg); //браузеры без префексов
 }
 
 .pub {
@@ -92,7 +92,7 @@ transform: rotate(-90deg); //браузеры без префексов
 
 .legend {
     margin-bottom: 20px;
-    margin-top: 40px;
+    margin-top: 60px;
     text-align: center;
     width: 100%;
 }
@@ -266,3 +266,16 @@ a.bibtexify-link-bibtex {
 a.bibtexify-link-bibtex:hover {
   background-position: 0 -16px;
 }
+
+.bibtexify-authors {
+  display:inline;
+  list-style-type: none;
+  margin: 0;
+  padding: 0;
+}
+
+.bibtexify-authors li {
+  display:inline;
+  margin: 0;
+  padding: 0;
+}
diff --git a/js/bibtexify.js b/js/bibtexify.js
index 108029a..c8c88c6 100644
--- a/js/bibtexify.js
+++ b/js/bibtexify.js
@@ -2517,12 +2517,13 @@ var bibtexify = (function($) {
         },
         // converts the given author data into HTML
         authors2html: function(authorData) {
-            var authorsStr = '';
+            var authorsHtml = '';
             for (var index = 0; index < authorData.length; index++) {
-                if (index > 0) { authorsStr += ", "; }
-                authorsStr += authorData[index].last;
+                authorSep = index > 0 ? ", " : "";
+                authorsHtml = authorsHtml + '<li>' + '<span class="bibtexify-author-separator">' + authorSep + '<\/span>' + '<span  class="bibtexify-author"><span class="bibtexify-author-lastname">' + htmlify(authorData[index].last) + '<\/span><\/span>' + '<\/li>';
             }
-            return authorData ? '<span class="bibtexify-author">' + htmlify(authorsStr) + '<\/span>' : '';
+            var etalHtml = authorData.length > 2 ? '<span class="bibtexify-author-etal"><\/span>' : '';
+            return authorData ? '<ul class="bibtexify-authors">' + authorsHtml + etalHtml + '<\/ul>' : '';
         },
         // converts the given year data into HTML
         year2html: function(yearData) {