Merge pull request #32 from mikael-ros/31-pagination-breaks-when-page…

…-number-goes-into-the-double-digits Fixed pagination issue, by giving pagination more space
mikael-ros · Dec 4, 2024 · 85794d9 · 85794d9
2 parents b98ba67 + 7425a43
commit 85794d9
Show file tree

Hide file tree

Showing 43 changed files with 9 additions and 7 deletions.
diff --git a/css/neobeam.css b/css/neobeam.css
@@ -21,7 +21,7 @@
 /* Defaults */
 /************/
 :root {
-    --build-multiplier: 100; /* Set to 1 when working in vscode, 100 when building */
+    --build-multiplier: 100; /* Might need to be set to 1 in some cases to fix color issues */
 
     /* -- Colors -- */
     /* Primary, and variations */
@@ -187,7 +187,7 @@ section::after {
 
     height: var(--footer-height);
     line-height: var(--footer-height);
-    width: var(--footer-height);
+    width: calc(2*var(--footer-height)); /* Give more space as necessary */
     color: var(--text-color-negative);
     font-size: calc(0.65 * var(--font-size)); /* For some reason simply writing 0.65rem won't do here */
 
@@ -244,7 +244,7 @@ footer > *:last-child {
     z-index: 1;
 
     /* Leave space for pagination number */
-    --pagination-space: calc(var(--footer-height) + 2 * var(--text-padding));
+    --pagination-space: calc(2*var(--footer-height) + 2 * var(--text-padding));
     margin-left: calc(-2 * var(--radius-space) - var(--pagination-space));
     padding-left: calc(var(--text-padding) + var(--radius-space));
     padding-right: var(--pagination-space);

diff --git a/example/example.md b/example/example.md
@@ -5,7 +5,7 @@ paginate: true
 math: katex
 footer: '**mikael-ros**
          **A modern take on the LaTeX beamer theme**
-         **Version 0.6, 2024**'
+         **Version 0.7, 2024**'
 ---
 <!-- _class: title -->
 # A modern take on the LaTeX beamer theme
@@ -15,7 +15,7 @@ footer: '**mikael-ros**
 > ### Faculty of GitHub
 > University of Marp
 
-## Version 0.6, 2024
+## Version 0.7, 2024
 
 ![logo GitHub Logo](../assets/github-mark.svg)
 
@@ -89,4 +89,4 @@ Text can be <mark>marked</mark>, <abbr title="abbreviated">abbr</abbr> and you c
 
 You can embed audio like:
 <audio controls src="http://codeskulptor-demos.commondatastorage.googleapis.com/pang/pop.mp3" type="audio/mp3">
-</audio> 
+</audio> 
diff --git a/previews/beamer/beamer-0.png b/previews/beamer/beamer-0.png
diff --git a/previews/beamer/beamer-1.png b/previews/beamer/beamer-1.png
diff --git a/previews/beamer/beamer-2.png b/previews/beamer/beamer-2.png
diff --git a/previews/beamer/beamer-3.png b/previews/beamer/beamer-3.png
diff --git a/previews/beamer/beamer-4.png b/previews/beamer/beamer-4.png
diff --git a/previews/beamer/beamer-5.png b/previews/beamer/beamer-5.png
diff --git a/previews/beamer/beamer-6.png b/previews/beamer/beamer-6.png
diff --git a/previews/beamer/beamer-7.png b/previews/beamer/beamer-7.png
diff --git a/previews/csek/csek-0.png b/previews/csek/csek-0.png
diff --git a/previews/csek/csek-1.png b/previews/csek/csek-1.png
diff --git a/previews/csek/csek-2.png b/previews/csek/csek-2.png
diff --git a/previews/csek/csek-3.png b/previews/csek/csek-3.png
diff --git a/previews/csek/csek-4.png b/previews/csek/csek-4.png
diff --git a/previews/csek/csek-5.png b/previews/csek/csek-5.png
diff --git a/previews/csek/csek-6.png b/previews/csek/csek-6.png
diff --git a/previews/csek/csek-7.png b/previews/csek/csek-7.png
diff --git a/previews/dsek/dsek-0.png b/previews/dsek/dsek-0.png
diff --git a/previews/dsek/dsek-1.png b/previews/dsek/dsek-1.png
diff --git a/previews/dsek/dsek-2.png b/previews/dsek/dsek-2.png
diff --git a/previews/dsek/dsek-3.png b/previews/dsek/dsek-3.png
diff --git a/previews/dsek/dsek-4.png b/previews/dsek/dsek-4.png
diff --git a/previews/dsek/dsek-5.png b/previews/dsek/dsek-5.png
diff --git a/previews/dsek/dsek-6.png b/previews/dsek/dsek-6.png
diff --git a/previews/dsek/dsek-7.png b/previews/dsek/dsek-7.png
diff --git a/previews/lund/lund-0.png b/previews/lund/lund-0.png
diff --git a/previews/lund/lund-1.png b/previews/lund/lund-1.png
diff --git a/previews/lund/lund-2.png b/previews/lund/lund-2.png
diff --git a/previews/lund/lund-3.png b/previews/lund/lund-3.png
diff --git a/previews/lund/lund-4.png b/previews/lund/lund-4.png
diff --git a/previews/lund/lund-5.png b/previews/lund/lund-5.png
diff --git a/previews/lund/lund-6.png b/previews/lund/lund-6.png
diff --git a/previews/lund/lund-7.png b/previews/lund/lund-7.png
diff --git a/previews/neobeam/neobeam-0.png b/previews/neobeam/neobeam-0.png
diff --git a/previews/neobeam/neobeam-1.png b/previews/neobeam/neobeam-1.png
diff --git a/previews/neobeam/neobeam-2.png b/previews/neobeam/neobeam-2.png
diff --git a/previews/neobeam/neobeam-3.png b/previews/neobeam/neobeam-3.png
diff --git a/previews/neobeam/neobeam-4.png b/previews/neobeam/neobeam-4.png
diff --git a/previews/neobeam/neobeam-5.png b/previews/neobeam/neobeam-5.png
diff --git a/previews/neobeam/neobeam-6.png b/previews/neobeam/neobeam-6.png
diff --git a/previews/neobeam/neobeam-7.png b/previews/neobeam/neobeam-7.png
diff --git a/readme.md b/readme.md
@@ -90,7 +90,7 @@ Theme | Based on
 > This theme by default uses the fonts Roboto, Roboto Mono (for code) and Noto Sans Math (for math). These are imported in the CSS file, but you can aquire them yourself too, or change them out. In the LTH C-sektionen and D-sektionen themes, Roboto is switched out for Helvetica.
 
 > [!WARNING]
-> For reasons beyond my comprehension, it is necessary to use different notation for ``hsl`` in CSS in the Marp VS code preview as compared to the build version. To mitigate this I have added a ``build-multiplier`` variable to the CSS files. Set this to ``1`` when working in VS code, and ``100`` when exporting (or working in other ways).
+> For reasons beyond my comprehension, it is necessary to use different notation for ``hsl`` in CSS in the Marp VS code preview as compared to the build version sometimes. To mitigate this I have added a ``build-multiplier`` variable to the CSS files. Set this to ``1`` when necessary, otherwise ``100``.
 
 #### 📥 In an existing presentation
 1. Download or copy the neobeam.css file into your project OR use the direct link. If using specific themes, do remember they are dependent on the base theme.
@@ -121,6 +121,8 @@ footer: '**Author**
 The theme names are written as presented in the table in the previews section.
 4. Change ``build-multiplier`` to ``1``, if the preview looks wrong. Do not forget to change it back before you build.
 
+> If you are, against all odds, using more than 1000 slides, and the pagination wraps, go into [``neobeam.css``](css/neobeam.css) and modify ``section::after``'s ``width``, and correspondingly the ``--pagination-space`` in ``footer > *:last-child``.
+
 #### ✨️ As a template
 Simply clone or fork this repo or download the release. If you wish, you can delete the previews folder.