jekyll-nagymaros 1.0.0

checksums.yaml

@@ -0,0 +1,7 @@
+---
+SHA256:
+  metadata.gz: 143fe5368b1aa6a48989390d78cdb0760ae46eb3f2c57497efef271188a7f217
+  data.tar.gz: e6b5fc6447df3d621888abf1db389bedb386e2a48177cd9b2d2825996f959ad1
+SHA512:
+  metadata.gz: bd4172b1713a9b1049cf57d4b1f79ba3e174b3d1efd95a267dc080598a248c1712edbb002aa904f75cd6aee6e80e090438e03afdafec7cc11cff93a782dce09c
+  data.tar.gz: 6c02ab99aa0c33ce02f9a67cc2e946dbcb24bc5c7be37b899ec4576f713b9b6a5765f8f892a12e8446b82f2bb9468c2acbc9486b15576610e72a6ae7de0c20fb

data/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2023 Michele Piazzai
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

data/README.md

@@ -0,0 +1,92 @@
+# jekyll-nagymaros
+
+Nagymaros is a [Jekyll](https://jekyllrb.com) theme designed for conferences, workshops, meetings, and similar events. It has a simple and intuitive structure featuring four pages that provide key information about the event:
+
+- An index, meant for basic details and links to external sources, such as submission systems.
+- A program, allowing for single or multi-day schedules and color-coded event categories.
+- A map of conference locations, customizable with markers, areas, and tooltips.
+- An alphabetical list of contributors, with optional roles and email addresses.
+
+The theme is based on [Bootstrap 5](https://getbootstrap.com/), which makes it mobile-first and fully responsive. Body text is set in Inter, a clean sans-serif typeface that guarantees readability at small screen sizes. A slab-serif typeface, Zilla Slab, is used instead in display headings. The layout is adapted from [jekyll-conference-theme](https://github.com/DigitaleGesellschaft/jekyll-theme-conference) and remains quite similar to it, but compared to this theme, Nagymaros aims to be simpler and easier to customize.
+
+See the [demo](https://jekyll-nagymaros.netlify.app) to find out what the theme looks like.
+
+![](https://github.com/piazzai/jekyll-nagymaros/blob/master/screenshot.png)
+
+## Installation
+
+The theme can be installed as usual by cloning this repository and editing the files. However, it is far more convenient to install it as a gem, in which case all the files you do not want or need to customize remain hidden from view, but will still be read and processed during build.
+
+If you choose to install the theme as a gem, your site should include at a minimum the following files:
+
+```bash
+.
+├── 404.md
+├── _config.yml
+├── contributors.md
+├── _data
+│   ├── contributors.yml
+│   ├── index.yml
+│   ├── locations.yml
+│   └── program.yml
+├── Gemfile
+├── index.md
+├── locations.md
+└── program.md
+
+```
+
+To install the theme, you can then add this line to your `Gemfile`:
+
+```ruby
+gem "jekyll-nagymaros"
+```
+
+And this line to `_config.yml`:
+
+```yaml
+theme: jekyll-nagymaros
+```
+
+The easiest way to set up a new website in this way is to clone the contents of the `demo` folder. This provides a working set of files to get you started.
+
+After you are done creating the basic files, run bundler:
+
+    $ bundle
+
+Or install the gem yourself as:
+
+    $ gem install jekyll-nagymaros
+
+To customize hidden files, you can create new files with the same names and paths. For example, to change the layout of the index page, you can create a `_layouts` folder and a file `index.html` within this folder that contains your custom code. During build, Jekyll will give priority to your files over the theme's.
+
+## Usage
+
+Core customization occurs in `_config.yml`. Aside from the usual configuration variables, you can set a value for the variable `home`, which specifies the page of your site to which you want the home button in the navigation bar to redirect. By default, this is set to the index. In addition, you can set a value for `copyright`, which corresponds to the name of the copyright holder in the notice within the theme's footer. By default, no value is provided for this variable, in which case the whole copyright notice is suppressed. Finally, you can set a value for `indexing`, which tells search engine crawlers whether to index your site. By default, the value is `false`, in which case the following code is placed in the head of every page:
+
+```html
+<meta name="robots" content="noindex, nofollow">
+```
+
+If you set `indexing: true`, however, crawlers will be allowed to index your site and Jekyll will populate the head of every page with SEO tags through the `jekyll-seo-tag` plugin.
+
+Data that appears in the theme's four default pages must be configured via YAML files located in the `_data` folder. See the corresponding files in `demo/_data` to understand how to write your own YAML, or better yet, clone these files and edit them.
+
+The order of appearance of pages in the theme's navigation bar is determined by the value of `navorder` set in each page's front matter. For example, setting `navorder: 1` will make the page appear first in the list. Note that a page will only appear in the navigation bar if the `navorder` variable is set, so it is possible to hide some pages from navigation simply by not giving this variable a value.
+
+Customizing the CSS is possible by creating a file `_sass/_custom.scss`. You can use this both to define new styles or to overwrite the theme's defaults. The file will be automatically compiled during build. 
+
+## Credits
+
+The theme builds on the following projects:
+
+- [Bootstrap](https://getbootstrap.com/)
+- [Inter](https://rsms.me/inter/)
+- [jekyll-theme-conference](https://github.com/DigitaleGesellschaft/jekyll-theme-conference)
+- [Leaflet.js](https://leafletjs.com/)
+- [Open Color](https://yeun.github.io/open-color)
+- [Zilla Slab](https://github.com/mozilla/zilla-slab)
+
+## Bugs
+
+If you find any problem using this theme, please [open an issue](https://github.com/piazzai/jekyll-nagymaros/issues).

data/_config.yml

@@ -0,0 +1,22 @@
+title: ""
+description: ""
+baseurl: ""
+url: ""
+
+home: false
+copyright: false
+indexing: false
+
+exclude:
+  - demo/
+  - jekyll-nagymaros.gemspec
+  - LICENSE
+  - README.md
+  - screenshot.png
+
+plugins:
+  - jekyll-seo-tag
+  - jekyll-sitemap
+
+sass:
+  sourcemap: never

data/_includes/footer.html

@@ -0,0 +1,6 @@
+{% assign year = site.time | date: '%Y' %}
+{% if site.copyright and site.copyright != '' %}
+<footer class="container mb-4">
+    <small class="text-muted">Copyright &copy;{{ year }} {{ site.copyright }}. All rights reserved.</small>
+</footer>
+{% endif %}

data/_includes/head.html

@@ -0,0 +1,18 @@
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    {% if site.indexing and page.layout != 404 %}
+    {% seo %}
+    {% else %}
+    <meta name="robots" content="noindex, nofollow">
+    {% if page.title %}
+    <title>{{ site.title | prepend: ' | ' | prepend: page.title }}</title>
+    {% else %}
+    <title>{{ site.title | append: ' | ' | append: site.description }}</title>
+    {% endif %}
+    {% endif %}
+    <link rel="stylesheet" href="{{ '/assets/css/bootstrap.css' | relative_url }}">
+    <link rel="stylesheet" href="{{ '/assets/css/leaflet.css' | relative_url }}">
+    <link rel="stylesheet" href="{{ '/assets/css/open-color.css' | relative_url }}">
+    <link rel="stylesheet" href="{{ '/assets/css/styles.css' | relative_url }}">
+</head>

data/_includes/header.html

@@ -0,0 +1,31 @@
+<header class="bg-gray-4">
+    <div class="container">
+        <nav class="navbar navbar-expand-sm">
+            {% if site.home %}
+            {% assign home = site.home | relative_url %}
+            {% else %}
+            {% assign home = '/' | relative_url %}
+            {% endif %}
+            <a class="navbar-brand" href="{{ home }}">{{ site.title }}</a>
+            <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navigation" aria-controls="navigation" aria-expanded="false" aria-label="Toggle navigation">
+                <span class="navbar-toggler-icon"></span>
+            </button>
+            <div class="collapse navbar-collapse" id="navigation">
+                <div class="navbar-nav">
+                    {% assign links = site.pages | sort: 'navorder' %}
+                    {% for link in links %}
+                    {% if link.navorder %}
+                    {% assign current = link.name | split: '.' | first %}
+                    {% assign href = link.url | relative_url %}
+                    {% if page.layout == current %}
+                    <a class="nav-link active" aria-current="page" href="{{ href }}">{{ link.title }}</a>
+                    {% else %}
+                    <a class="nav-link" href="{{ href }}">{{ link.title }}</a>
+                    {% endif %}
+                    {% endif %}
+                    {% endfor %}
+                </div>
+            </div>
+        </nav>
+    </div>
+</header>

data/_includes/metadata.liquid

@@ -0,0 +1,11 @@
+{% if page.title %}
+{% assign title = page.title %}
+{% else %}
+{% assign title = site.title %}
+{% endif %}
+
+{% if page.description %}
+{% assign description = page.description %}
+{% else %}
+{% assign description = site.description %}
+{% endif %}

data/_layouts/404.html

@@ -0,0 +1,16 @@
+---
+layout: default
+---
+
+{% include metadata.liquid %}
+
+<main>
+    <div class="container text-center">
+        {% assign span = 'class="h1 bg-gray-3 color-gray-0 rounded" id="digit"' %}
+        <span {{ span }}>4</span>
+        <span {{ span }}>0</span>
+        <span {{ span }}>4</span>
+        <h1 class="display-5">{{ title }}</h1>
+        <p class="fs-5"><a href="{{ '/' | relative_url }}">Return to the homepage</a></p>
+    </div>
+</main>

data/_layouts/contributors.html

@@ -0,0 +1,42 @@
+---
+layout: default
+---
+
+{% include metadata.liquid %}
+{% include header.html %}
+
+<main class="my-4">
+    <div class="container">
+        <h1 class="display-5">{{ title }}</h1>
+        {{ content }}
+        {% if site.data.contributors %}
+        <hr class="my-4">
+        {% assign groups = site.data.contributors.groups %}
+        {% for group in groups %}
+        {% if group.title %}
+        <h5 class="fw-normal">{{ group.title }}</h5>
+        {% endif %}
+        {% if group.columns %}
+        {% assign div = ' id="roster"' %}
+        {% else %}
+        {% assign div = '' %}
+        {% endif %}
+        <div {{ div }}>
+            <ul class="list-unstyled">
+                {% assign members = group.members | sort_natural: 'surname' %}
+                {% for member in members %}
+                {% assign full = member.name | append: ' ' | append: member.surname %}
+                {% if member.email %}
+                <li class="fw-light"><a href="mailto:{{ member.email }}">{{ full }}</a></li>
+                {% else %}
+                <li class="fw-light">{{ full }}</li>
+                {% endif %}
+                {% endfor %}
+            </ul>
+        </div>
+        {% endfor %}
+        {% endif %}
+    </div>
+</main>
+
+{% include footer.html %}

data/_layouts/default.html

@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html>
+
+{% include head.html %}
+
+<body>
+    {{ content }}
+    <script src="{{ '/assets/js/bootstrap.js' | relative_url }}"></script>
+    <script src="{{ '/assets/js/leaflet.js' | relative_url }}"></script>
+    <script src="{{ '/assets/js/main.js' | relative_url }}"></script>
+</body>
+
+</html>

data/_layouts/index.html

@@ -0,0 +1,35 @@
+---
+layout: default
+---
+
+{% include metadata.liquid %}
+{% include header.html %}
+
+<main class="my-4">
+    <div class="container px-5 py-3 bg-gray-2 rounded">
+        <h1 class="display-3">{{ title }}</h1>
+        <p class="lead">{{ description }}</p>
+        <hr class="my-4">
+        {{ content }}
+        {% if site.data.index.buttons %}
+        <div class="btn-group-lg mt-4 mb-3" role="group">
+            {% assign buttons = site.data.index.buttons %}
+            {% for button in buttons %}
+            {% assign classes = 'btn btn-primary d-block d-lg-inline-block my-lg-0' %}
+            {% unless forloop.first or forloop.last %}
+            {% assign classes = classes | append: ' my-2 mx-lg-2' %}
+            {% endunless %}
+            {% if button.disabled %}
+            {% assign classes = classes | append: ' disabled' %}
+            {% assign a = '' %}
+            {% else %}
+            {% assign a = 'href="' | append: button.url | append: '"' %}
+            {% endif %}
+            <a {{ a }} type="button" class="{{ classes }}" target="_blank">{{ button.text | upcase }}</a>
+            {% endfor %}
+        </div>
+        {% endif %}
+    </div>
+</main>
+
+{% include footer.html %}

data/_layouts/locations.html

@@ -0,0 +1,19 @@
+---
+layout: default
+---
+
+{% include metadata.liquid %}
+{% include header.html %}
+
+<main class="my-4">
+    <div class="container">
+        <h1 class="display-5">{{ title }}</h1>
+        {{ content }}
+        {% if site.data.locations %}
+        <hr class="my-4">
+        <div id="map"></div>
+        {% endif %}
+    </div>
+</main>
+
+{% include footer.html %}

data/_layouts/page.html

@@ -0,0 +1,16 @@
+---
+layout: default
+---
+
+{% include metadata.liquid %}
+{% include header.html %}
+
+<main class="my-4">
+    <div class="container">
+        <h1 class="display-5">{{ title }}</h1>
+        <hr class="my-4">
+        {{ content }}
+    </div>
+</main>
+
+{% include footer.html %}

data/_layouts/program.html

@@ -0,0 +1,114 @@
+---
+layout: default
+---
+
+{% include metadata.liquid %}
+{% include header.html %}
+
+<main class="my-4">
+    <div class="container">
+        <h1 class="display-5">{{ title }}</h1>
+        {{ content }}
+        {% if site.data.program %}
+        <hr class="my-4">
+        <div class="row">
+            {% assign size = site.data.program.days.size %}
+            {% if size > 1 %}
+            <div class="col-lg-2">
+                {% assign directions = 'horizontal, vertical' | split: ', ' %}
+                {% for direction in directions %}
+                {% if direction == 'horizontal' %}
+                {% assign classes = 'd-block d-lg-none text-center mb-3' %}
+                {% assign control = 'btn-group' %}
+                {% else %}
+                {% assign classes = 'd-none d-lg-block' %}
+                {% assign control = 'btn-group-vertical' %}
+                {% endif %}
+                <div class="{{ classes }}">
+                    <div class="btn {{ control }} p-0 aos-init aos-animate" role="tablist" data-aos="fade-up">
+                        {% for day in site.data.program.days %}
+                        {% assign slug = day.name | slugify %}
+                        {% assign classes = 'btn btn-secondary' %}
+                        {% if forloop.first %}
+                        {% assign classes = classes | append: ' active' %}
+                        {% endif %}
+                        <button type="button" class="{{ classes }}" data-bs-toggle="tab" data-bs-target="#{{ slug }}" role="tab" aria-controls="{{ slug }}" aria-selected="true">
+                            <span class="fs-5">{{ day.name }}</span>
+                        </button>
+                        {% endfor %}
+                    </div>
+                </div>
+                {% endfor %}
+            </div>
+            {% assign width = 10 %}
+            {% else %}
+            {% assign width = 12 %}
+            {% endif %}
+            <div class="col-lg-{{ width }}">
+                {% for day in site.data.program.days %}
+                {% assign slug = day.name | slugify %}
+                {% assign classes = 'tab-pane fade' %}
+                {% if forloop.first %}
+                {% assign classes = classes | append: ' active show' %}
+                {% endif %}
+                <div class="tab-content aos-init aos-animate" data-aos="fade-up">
+                    <div class="{{ classes }}" id="{{ slug }}" role="tabpanel" aria-labelledby="{{ slug }}-tab">
+                        {% assign categories = site.data.program.legend.categories %}
+                        <ul class="list-unstyled lh-sm">
+                            {% for event in day.events %}
+                            {% if event.category %}
+                            {% assign category = categories | find: 'name', event.category %}
+                            {% assign color = category.color %}
+                            {% else %}
+                            {% assign color = 'gray-4' %}
+                            {% endif %}
+                            {% assign start = event.time | split: ' to ' | slice: 0 %}
+                            {% assign end = event.time | split: ' to ' | slice: 1 %}
+                            {% if forloop.last %}
+                            {% assign classes = color | append: ' mb-2' %}
+                            {% else %}
+                            {% assign classes = color | append: ' mb-4' %}
+                            {% endif %}
+                            <li class="d-flex flex-column flex-lg-row ms-2">
+                                <div class="row col-lg-2 me-lg-4 text-lg-end mb-2">
+                                    <small class="fw-light text-muted">{{ start }}–{{ end }}</small>
+                                </div>
+                                <div class="row col-lg-10 border-start border-3 border-{{ classes }}">
+                                    {% if event.category %}
+                                    <h5 class="fw-normal m-0 mb-2">{{ event.title }}</h5>
+                                    <p class="fw-light m-0">{{ event.subtitle }}</p>
+                                    {% else %}
+                                    <h5 class="fw-light text-muted m-0 mb-2">{{ event.title }}</h5>
+                                    <p class="fw-light text-muted m-0">{{ event.subtitle }}</p>
+                                    {% endif %}
+                                </div>
+                            </li>
+                            {% endfor %}
+                        </ul>
+                        <div class="text-center">
+                            {% assign legend = day.events | map: 'category' | compact | uniq %}
+                            {% assign size = legend | size %}
+                            {% if size > 0 %}
+                            {% if site.data.program.legend.title %}
+                            <h5 class="fw-normal">{{ site.data.program.legend.title }}</h5>
+                            {% endif %}
+                            {% for item in legend %}
+                            {% assign border = categories | where: 'name', item | map: 'color' | first %}
+                            {% assign bg = border | split: '-' | first | prepend: 'bg-' | append: '-1' %}
+                            {% assign classes = border | prepend: ' border-' | prepend: bg %}
+                            {% if border %}
+                            <small class="d-block d-lg-inline-block mt-2 me-lg-2 px-3 py-1 border-start border-3 {{ classes }}">{{ item | upcase }}</small>
+                            {% endif %}
+                            {% endfor %}
+                            {% endif %}
+                        </div>
+                    </div>
+                </div>
+                {% endfor %}
+            </div>
+        </div>
+        {% endif %}
+    </div>
+</main>
+
+{% include footer.html %}

data/_sass/_elements.scss

@@ -0,0 +1,46 @@
+#digit {
+  display: inline-block;
+  font-size: 6rem;
+  height: 6rem;
+  line-height: 6rem;
+  margin-top: 15%;
+  width: 6rem;
+
+  $sizes: (
+    576: 8,
+    768: 10,
+    992: 12,
+  );
+
+  @each $size, $size-value in $sizes {
+    @media (min-width: #{$size}px) {
+      font-size: #{$size-value}rem;
+      height: #{$size-value}rem;
+      line-height: #{$size-value}rem;
+      width: #{$size-value}rem;
+    }
+  }
+}
+
+#map {
+  height: 65vh;
+}
+
+#roster {
+  @media (min-width: 576px) {
+    column-count: 1;
+  }
+
+  @media (min-width: 768px) {
+    column-count: 2;
+  }
+
+  @media (min-width: 992px) {
+    column-count: 3;
+  }
+
+  div {
+    page-break-inside: avoid;
+    break-inside: avoid-column;
+  }
+}

data/_sass/_fonts.scss

@@ -0,0 +1,46 @@
+$weights: (
+  "Light": 300,
+  "Medium": 500,
+  "Bold": 700,
+);
+
+$styles: (
+  normal: "",
+  italic: "Italic",
+);
+
+@each $style, $style-value in $styles {
+  @font-face {
+    font-family: "Zilla Slab";
+    font-display: swap;
+    font-style: #{$style};
+    font-weight: 300;
+    src: url("../webfonts/ZillaSlab-Light#{$style-value}.woff2") format("woff2");
+  }
+
+  @each $weight, $weight-value in $weights {
+    @font-face {
+      font-family: "Inter";
+      font-display: swap;
+      font-style: #{$style};
+      font-weight: #{$weight-value};
+      src: url("../webfonts/Inter-#{$weight}#{$style-value}.woff2") format("woff2");
+    }
+  }
+}
+
+@font-face {
+  font-family: "Inter";
+  font-display: swap;
+  font-style: normal;
+  font-weight: 400;
+  src: url("../webfonts/Inter-Regular.woff2") format("woff2");
+}
+
+@font-face {
+  font-family: "Inter";
+  font-display: swap;
+  font-style: italic;
+  font-weight: 400;
+  src: url("../webfonts/Inter-Italic.woff2") format("woff2");
+}

data/_sass/_utilities.scss

@@ -0,0 +1,43 @@
+$colors: (
+  "gray",
+  "red",
+  "pink",
+  "grape",
+  "violet",
+  "indigo",
+  "blue",
+  "cyan",
+  "teal",
+  "green",
+  "lime",
+  "yellow",
+  "orange"
+);
+
+@each $color in $colors {
+  @for $scale from 0 through 9 {
+    .bg-#{$color}-#{$scale} {
+      --bs-bg-opacity: 1;
+      background-color: rgba(
+        var(--oc-#{$color}-#{$scale}-rgb),
+        var(--bs-bg-opacity)
+      ) !important;
+    }
+
+    .border-#{$color}-#{$scale} {
+      --bs-bg-opacity: 1;
+      border-color: rgba(
+        var(--oc-#{$color}-#{$scale}-rgb),
+        var(--bs-bg-opacity)
+      ) !important;
+    }
+
+    .color-#{$color}-#{$scale} {
+      --bs-bg-opacity: 1;
+      color: rgba(
+        var(--oc-#{$color}-#{$scale}-rgb),
+        var(--bs-bg-opacity)
+      ) !important;
+    }
+  }
+}