From 701524767f4e088eb4c4e5fe82c043548b7505ca Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Nu=C5=A1a=20Puk=C5=A1i=C4=8D?= <nusa.puksic@gmail.com>
Date: Thu, 13 Feb 2025 16:18:26 +0100
Subject: [PATCH] open #119 lists and blockquotes

---
 src/app.css                 |  64 ++--------------------
 src/styles/base.css         |   3 ++
 src/styles/publications.css | 103 ++++++++++++++++++++++++++++++++++++
 tailwind.config.cjs         |   4 ++
 4 files changed, 113 insertions(+), 61 deletions(-)
 create mode 100644 src/styles/base.css
 create mode 100644 src/styles/publications.css

diff --git a/src/app.css b/src/app.css
index 983fba8..627a7d2 100644
--- a/src/app.css
+++ b/src/app.css
@@ -1,6 +1,5 @@
-@tailwind base;
-@tailwind components;
-@tailwind utilities;
+@import './styles/base.css';
+@import './styles/publications.css';
 
 @layer components {
   /* General */
@@ -60,64 +59,6 @@
     @apply hover:bg-primary-100 dark:hover:bg-primary-800;
   }
 
-  /* AsciiDoc content */
-  .note-leather p a {
-    @apply underline hover:text-primary-500 dark:hover:text-primary-400;
-  }
-
-  .note-leather section p {
-    @apply w-full;
-  }
-
-  .note-leather section p table {
-    @apply w-full table-fixed space-x-2 space-y-2;
-  }
-
-  .note-leather section p table td {
-    @apply p-2;
-  }
-
-  .note-leather section p table td .content:has(> .imageblock) {
-    @apply flex flex-col items-center;
-  }
-
-  .note-leather .imageblock {
-    @apply flex flex-col space-y-2;
-  }
-
-  .note-leather .imageblock .content {
-    @apply flex justify-center;
-  }
-  .note-leather .imageblock .title {
-    @apply text-center;
-  }
-
-  .note-leather .imageblock.left .content {
-    @apply justify-start;
-  }
-  .note-leather .imageblock.left .title {  
-    @apply text-left;
-  }
-
-  .note-leather .imageblock.right .content {
-    @apply justify-end;
-  }
-  .note-leather .imageblock.right .title {
-    @apply text-right;
-  }
-
-  .note-leather section p table td .literalblock {
-    @apply my-2 p-2 border rounded border-gray-400 dark:border-gray-600;
-  }
-
-  .note-leather .literalblock pre {
-    @apply text-wrap break-words;
-  }
-
-  .note-leather .listingblock pre {
-    @apply overflow-x-auto;
-  }
-
   /* Heading */
   h1.h-leather,
   h2.h-leather,
@@ -244,6 +185,7 @@
     @apply fill-[#d6c1a8];
   }
 }
+
 @layer components {
   .leather-legend {
     @apply flex-shrink-0 p-4 bg-primary-0 dark:bg-primary-1000 rounded-lg shadow
diff --git a/src/styles/base.css b/src/styles/base.css
new file mode 100644
index 0000000..bd6213e
--- /dev/null
+++ b/src/styles/base.css
@@ -0,0 +1,3 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
\ No newline at end of file
diff --git a/src/styles/publications.css b/src/styles/publications.css
new file mode 100644
index 0000000..9dcd002
--- /dev/null
+++ b/src/styles/publications.css
@@ -0,0 +1,103 @@
+@layer components {
+    /* AsciiDoc content */
+    .note-leather p a {
+        @apply underline hover:text-primary-500 dark:hover:text-primary-400;
+    }
+
+    .note-leather section p {
+        @apply w-full;
+    }
+
+    .note-leather section p table {
+        @apply w-full table-fixed space-x-2 space-y-2;
+    }
+
+    .note-leather section p table td {
+        @apply p-2;
+    }
+
+    .note-leather section p table td .content:has(> .imageblock) {
+        @apply flex flex-col items-center;
+    }
+
+    .note-leather .imageblock {
+        @apply flex flex-col space-y-2;
+    }
+
+    .note-leather .imageblock .content {
+        @apply flex justify-center;
+    }
+    .note-leather .imageblock .title {
+        @apply text-center;
+    }
+
+    .note-leather .imageblock.left .content {
+        @apply justify-start;
+    }
+    .note-leather .imageblock.left .title {
+        @apply text-left;
+    }
+
+    .note-leather .imageblock.right .content {
+        @apply justify-end;
+    }
+    .note-leather .imageblock.right .title {
+        @apply text-right;
+    }
+
+    .note-leather section p table td .literalblock {
+        @apply my-2 p-2 border rounded border-gray-400 dark:border-gray-600;
+    }
+
+    .note-leather .literalblock pre {
+        @apply p-3 text-wrap break-words;
+    }
+
+    .note-leather .listingblock pre {
+        @apply overflow-x-auto;
+    }
+
+    /* lists */
+    .note-leather .ulist ul {
+        @apply space-y-1 list-disc list-inside;
+    }
+
+    .note-leather .olist ol {
+        @apply space-y-1 list-inside;
+    }
+
+    .note-leather ol.arabic {
+        @apply list-decimal;
+    }
+
+    .note-leather ol.loweralpha {
+        @apply list-lower-alpha;
+    }
+
+    .note-leather ol.upperalpha {
+        @apply list-upper-alpha;
+    }
+
+    .note-leather li ol,
+    .note-leather li ul {
+        @apply ps-5 my-2;
+    }
+
+    .note-leather li p {
+        @apply inline;
+    }
+
+    /* blockquote */
+    .note-leather .quoteblock {
+        @apply p-4 my-4 border-s-4 rounded border-primary-300 bg-primary-50 dark:border-primary-500 dark:bg-primary-700;
+    }
+
+    .note-leather .quoteblock .attribution {
+        @apply mt-3 italic;
+    }
+
+    .note-leather .quoteblock cite {
+        @apply text-sm;
+    }
+
+}
\ No newline at end of file
diff --git a/tailwind.config.cjs b/tailwind.config.cjs
index bc16b37..4a2b022 100644
--- a/tailwind.config.cjs
+++ b/tailwind.config.cjs
@@ -25,6 +25,10 @@ const config = {
           900: '#231a10',
           1000: '#110d08',
         },
+      },
+      listStyleType: {
+        'upper-alpha': 'upper-alpha', // Uppercase letters
+        'lower-alpha': 'lower-alpha', // Lowercase letters
       }
     },
   },