.drone.yml

@@ -0,0 +1,47 @@
+kind: pipeline
+name: default
+
+workspace:
+  path: /drone/reitanlage-oranienburg
+
+steps:
+- name: build npm
+  image: node:16.0.0
+  pull: always
+  environment:
+    PASS:
+      from_secret: fontawesome_password
+  commands:
+    - curl -O "http://public.serguzim.me.sos-de-fra-1.exo.io/fontawesome-pro.tar.gz.enc"
+    - openssl enc -aes256 -pbkdf2 -out "fontawesome-pro.tar.gz" -in "fontawesome-pro.tar.gz.enc" -d -k $PASS
+    - npm install
+    - npx mix build --production
+
+- name: prepare zip
+  image: bash
+  pull: always
+  commands:
+    - apk add zip
+    - cd /drone/
+    - rm -r reitanlage-oranienburg/src reitanlage-oranienburg/node_modules
+    - zip -r ro.zip reitanlage-oranienburg
+    - mv ro.zip /drone/reitanlage-oranienburg/reitanlage-oranienburg-${DRONE_TAG}.zip
+
+- name: gitea release
+  image: plugins/gitea-release
+  settings:
+    api_key:
+      from_secret: gitea_token
+    base_url: https://git.serguzim.me
+    files:
+      - reitanlage-oranienburg-${DRONE_TAG}.zip
+    title: ${DRONE_TAG}
+  when:
+    event:
+      - tag
+
+trigger:
+  ref:
+    include:
+    - refs/tags/**
+    - refs/heads/drone-test

.forgejo/workflows/release.yaml

@@ -1,29 +0,0 @@
-on:
-  push:
-    tags:
-      - v**
-jobs:
-  build-artifacts:
-    runs-on: docker
-    steps:
-      - uses: https://code.forgejo.org/actions/checkout@v3
-      - id: build
-        run: |
-          echo "@fontawesome:registry=https://git.serguzim.me/api/packages/fontawesome/npm/" > .npmrc
-          echo "//git.serguzim.me/api/packages/fontawesome/npm/:_authToken=${{ secrets.FORGEJO_TOKEN }}" >> .npmrc
-          mkdir /tmp/release-dir
-
-          npm install
-          npm run production
-
-          git add -f dist/
-          git stash
-
-          git config --global --add safe.directory ${{ github.workspace }}
-          git archive --format=zip 'stash@{0}' -o /tmp/release-dir/reitanlage-oranienburg-${{ github.ref_name }}.zip --prefix=reitanlage-oranienburg/
-        shell: bash
-      - uses: https://code.forgejo.org/actions/forgejo-release@v1
-        with:
-          direction: upload
-          release-dir: /tmp/release-dir
-          token: ${{ github.token }}

.gitattributes

@@ -1,6 +0,0 @@
-* text=auto
-
-*.html.twig diff=html
-
-package-lock.json -diff
-composer.lock -diff

.gitignore

@@ -1,5 +1,7 @@
+
 dist/
 node_modules/
 grav/
 
-.npmrc
+fontawesome-pro.tar.gz
+fontawesome-pro.tar.gz.enc

CHANGELOG.md

@@ -0,0 +1,5 @@
+# v0.1.0
+##  12/21/2019
+
+1. [](#new)
+    * ChangeLog started...

blueprints.yaml

@@ -1,5 +1,5 @@
 name: Reitanlage Oranienburg
-version: 1.4.8
+version: 1.2.1
 description: Design der Reitanlage Oranienburg
 icon: rebel
 author:
@@ -31,9 +31,6 @@ form:
     umami.url:
         type: text
         label: URL to load umami script from
-    umami.url_external_tracking:
-        type: text
-        label: URL to load umami external tracking script from
     custom_logo:
       type: file
       label: Logo

package.json

@@ -1,34 +1,36 @@
 {
-	"name": "reitanlage-oranienburg",
+  "name": "reitanlage-oranienburg",
-	"version": "1.4.8",
+  "version": "1.2.1",
-	"description": "The Reitanlage Oranienburg Theme for Grav CMS.",
+  "description": "The Reitanlage Oranienburg Theme for Grav CMS.",
-	"main": "index.js",
+  "main": "index.js",
-	"scripts": {
+  "scripts": {
-		"dev": "npm run development",
+    "dev": "npm run development",
-		"development": "mix",
+    "development": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --config=node_modules/laravel-mix/setup/webpack.config.js",
-		"watch": "mix watch",
+    "watch": "npm run development -- --watch",
-		"watch-poll": "mix watch -- --watch-options-poll=1000",
+    "watch-poll": "npm run watch -- --watch-poll",
-		"hot": "mix watch --hot",
+    "hot": "cross-env NODE_ENV=development node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --hot --disable-host-check --config=node_modules/laravel-mix/setup/webpack.config.js",
-		"prod": "npm run production",
+    "prod": "npm run production",
-		"production": "mix --production"
+    "production": "cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --no-progress --config=node_modules/laravel-mix/setup/webpack.config.js"
-	},
+  },
-	"repository": {
+  "repository": {
-		"type": "git",
+    "type": "git",
-		"url": "https://git.serguzim.me/serguzim/reitanlage-oranienburg.git"
+    "url": "https://git.serguzim.me/serguzim/reitanlage-oranienburg.git"
-	},
+  },
-	"keywords": [],
+  "keywords": [],
-	"author": "",
+  "author": "",
-	"license": "Apache-2.0",
+  "license": "Apache-2.0",
-	"dependencies": {
+  "devDependencies": {
-		"@fontawesome/fontawesome-pro": "^6.2",
+    "laravel-mix": "^6.0.25",
-		"@popperjs/core": "^2.11.6",
+    "resolve-url-loader": "^4.0.0",
-		"autoprefixer": "^10.0",
+    "sass": "^1.35.1",
-		"bootstrap": "^5.2",
+    "sass-loader": "^12.1.0"
-		"cross-env": "^7.0",
+  },
-		"laravel-mix": "^6.0",
+  "dependencies": {
-		"photoswipe": "^4",
+    "@fortawesome/fontawesome-pro": "file:fontawesome-pro.tar.gz",
-		"resolve-url-loader": "^5.0",
+    "bootstrap": "^4.6.0",
-		"sass": "^1.56",
+    "cross-env": "^7.0.3",
-		"sass-loader": "^13.2"
+    "jquery": "^3.6.0",
-	}
+    "photoswipe": "^4.1.3",
+    "popper.js": "^1.16.1"
+  }
 }

src/js/app.js

@@ -1,4 +1,4 @@
-let bootstrap = require('bootstrap')
+require('./bootstrap');
 
 import PhotoSwipe from 'photoswipe/dist/photoswipe'
 import PhotoSwipeDefaultUI from 'photoswipe/dist/photoswipe-ui-default'
@@ -6,7 +6,7 @@ import PhotoSwipeDefaultUI from 'photoswipe/dist/photoswipe-ui-default'
 window.PhotoSwipe = PhotoSwipe;
 window.PhotoSwipeDefaultUI = PhotoSwipeDefaultUI;
 
-document.querySelector("#menu-toggle").onclick = function(e) {
+$("#menu-toggle").click(function(e) {
     e.preventDefault();
-	document.querySelector("#wrapper").classList.toggle("toggled");
+    $("#wrapper").toggleClass("toggled");
-};
+});

src/js/bootstrap.js

@@ -0,0 +1,14 @@
+window._ = require('lodash');
+
+/**
+ * We'll load jQuery and the Bootstrap jQuery plugin which provides support
+ * for JavaScript based Bootstrap features such as modals and tabs. This
+ * code may be modified to fit the specific needs of your application.
+ */
+
+try {
+    window.Popper = require('popper.js').default;
+    window.$ = window.jQuery = require('jquery');
+
+    require('bootstrap');
+} catch (e) {}

src/sass/app.scss

@@ -1,126 +1,12 @@
 // Bootstrap
-$primary: #2b3bb4;
 @import '~bootstrap/scss/bootstrap';
 
 // FontAwesome
-@import '~@fontawesome/fontawesome-pro/css/all.css';
+@import '~@fortawesome/fontawesome-pro/css/all.css';
 
 // PhotoSwipe
 @import '~photoswipe/dist/photoswipe.css';
 @import '~photoswipe/dist/default-skin/default-skin.css';
 
+@import './theme';
 @import '../css/sidebar.css';
-
-body, #wrapper
-{
-    min-height: 100vh;
-}
-
-.flex-fill
-{
-    flex: 1 1 auto;
-}
-
-.card-image img
-{
-    width: 100%;
-}
-
-.card-columns img,video
-{
-    width: 100%;
-}
-
-.card-columns
-{
-    column-gap: 1em;
-    column-count: 2;
-}
-
-.card-columns.card
-{
-    margin-bottom: 1em;
-}
-
-@media (min-width: 768px)
-{
-    .card-columns
-    {
-        column-count: 3;
-    }
-}
-
-@media (min-width: 992px)
-{
-    .card-columns
-    {
-        column-count: 4;
-    }
-}
-
-@media (min-width: 1200px)
-{
-    .card-columns
-    {
-        column-count: 6;
-    }
-}
-
-.navbar-brand
-{
-    font-size: 1em;
-}
-.navbar-brand img
-{
-    height: 3em;
-}
-
-header div.row-fixed-h,
-header img
-{
-    height: 5rem;
-    overflow: hidden;
-}
-
-.bg-ro
-{
-    background-color: #2b3bb4 !important;
-}
-
-footer.bg-ro a
-{
-    color: #fff;
-    text-decoration: underline;
-}
-
-.btn-facebook
-{
-    color: #fff;
-    background-color: #3b5998;
-    border-color: #3b5998;
-}
-
-#home-carousel
-{
-    display: flex;
-    align-items: center;
-    height: 400px;
-}
-
-#home-carousel img
-{
-    max-width: 100%;
-    max-height: 400px;
-}
-
-table tbody tr:nth-of-type(2n+1)
-{
-    background:
-    #d0d6d3;
-}
-
-table td,
-table th
-{
-    padding: 0.6rem 0.4rem;
-}

src/sass/theme.scss

@@ -0,0 +1,113 @@
+body, #wrapper
+{
+    min-height: 100vh;
+}
+
+.flex-fill
+{
+    flex: 1 1 auto;
+}
+
+.card-image img
+{
+    width: 100%;
+}
+
+.card-columns img,video
+{
+    width: 100%;
+}
+
+.card-columns
+{
+    column-gap: 1em;
+    column-count: 2;
+}
+
+.card-columns.card
+{
+    margin-bottom: 1em;
+}
+
+@media (min-width: 768px)
+{
+    .card-columns
+    {
+        column-count: 3;
+    }
+}
+
+@media (min-width: 992px)
+{
+    .card-columns
+    {
+        column-count: 4;
+    }
+}
+
+@media (min-width: 1200px)
+{
+    .card-columns
+    {
+        column-count: 6;
+    }
+}
+
+.navbar-brand
+{
+    font-size: 1em;
+}
+.navbar-brand img
+{
+    height: 3em;
+}
+
+header div.row-fixed-h,
+header img
+{
+    height: 5rem;
+    overflow: hidden;
+}
+
+.bg-ro
+{
+    background-color: #2b3bb4 !important;
+}
+
+footer.bg-ro a
+{
+    color: #fff;
+    text-decoration: underline;
+}
+
+.btn-facebook
+{
+    color: #fff;
+    background-color: #3b5998;
+    border-color: #3b5998;
+}
+
+#home-carousel
+{
+    display: flex;
+    align-items: center;
+    height: 400px;
+}
+
+#home-carousel img
+{
+    max-width: 100%;
+    max-height: 400px;
+}
+
+table tbody tr:nth-of-type(2n+1)
+{
+    background:
+    #d0d6d3;
+}
+
+table td,
+table th
+{
+    padding: 0.6rem 0.4rem;
+}

templates/home.html.twig

@@ -2,18 +2,16 @@
 
 {% block content %}
     <div class="row">
-		<div class="col-12">
+        <div class="col-12 col-md-6 mb-2" height="100%">
             <h1 class="d-inline">
                 {% include 'partials/logo.html.twig' with {style: 'height: 3rem; padding-bottom: 0.5rem'} %}
                 Herzlich Willkommen
             </h1>
-		</div>
+            <div width="100%" style="height: 300px;">
-        <div class="col-12 col-md-6 mb-2" height="100%">
-            <div width="100%" style="min-height: 300px;">
                 {% include 'partials/osm.html.twig' %}
             </div>
             <div>
-                <a role="button" class="btn btn-primary me-1" href="/kontakt">Kontakt</a>
+                <a role="button" class="btn btn-primary mr-1" href="/kontakt">Kontakt</a>
                 {% include 'partials/socialmedia.html.twig' %}
             </div>
         </div>
@@ -26,7 +24,7 @@ <h1 class="d-inline">
                             {% set class_active = ' active' %}
                         {% endif %}
                         <div class="carousel-item{{ class_active }}">
-                            <img alt="" class="d-block" src="{{ media_item.resize(540, 400).quality(75).url }}">
+                            <img alt="Bild der Slideshow zur Reitanlage." class="d-block" src="{{ media_item.resize(540, 400).quality(75).url }}">
                         </div>
                     {% endfor %}
                 </div>
@@ -38,7 +36,6 @@ <h1 class="d-inline">
     <hr class="mb-4">
     {% set news_page = pages.find('/news') %}
     {% if news_page and news_page.collection() and news_page.collection()|first %}
-        <h2>Letzte Neuigkeit</h2>
         {% set text_class = 'col-12' %}
         {% set news_latest = news_page.collection()|first %}
         <div class="row">

templates/kontakt.html.twig

@@ -12,10 +12,8 @@
         </div>
     </div>
     <div class="row">
-        <div class="col-12 h-100">
+        <div class="col-12" style="height: 300px">
-			<div class="w-100" style="min-height: 300px">
+            {% include 'partials/osm.html.twig' %}
-				{% include 'partials/osm.html.twig' %}
-			</div>
         </div>
     </div>
 {% endblock %}

templates/partials/base.html.twig

@@ -21,11 +21,12 @@
     <meta name="msapplication-config" content="{{ url('theme://images/icons/browserconfig.xml') }}">
     <meta name="theme-color" content="#ffffff">
     <link rel="canonical" href="{{ page.url(true, true) }}" />
+    <link rel="stylesheet" href="{{ url('theme://dist/app.css') }}" />
 {% endblock head %}
 
-{% block stylesheets %}
+{# block stylesheets %}
     {% do assets.addCss('theme://dist/app.css', 100) %}
-{% endblock %}
+{% endblock #}
 
 {% block javascripts %}
     {% do assets.addJs('theme://dist/app.js', 100) %}
@@ -43,13 +44,10 @@
             <header class="p-2 bg-ro text-white">
                 <div class="container">
                     <div class="row row-fixed-h mb-2">
-                        <a href="/" class="col-12" data-umami-event="Header-Logo button">
+                        <a href="/" class="col-12">
                             {% include 'partials/logo.html.twig' with {style: 'filter: invert(100%); margin-right: 0.5rem;'} %}
                             {% for media_item in header_page.media.images %}
-                                {% set aspect = media_item.width / media_item.height %}
+                                <img alt="Eines der Bilder im Seiten-Header." src="{{ media_item.quality(15).url }}" />
-                                {% set new_height = 160 %}
-                                {% set new_width = new_height * aspect %}
-                                <img alt="" src="{{ media_item.cropResize(new_width,new_height).quality(75).url }}" />
                             {% endfor %}
                         </a>
                     </div>
@@ -68,7 +66,7 @@
             {% block footer %}
                 <footer class="container-fluid text-light py-3">
                     <div class="row">
-                        <p class="mx-auto w-auto">
+                        <p class="mx-auto">
                             <a href="/impressum">Impressum</a>
                             <span> | </span>
                             <a href="/datenschutzerklaerung">Datenschutzerklärung</a>
@@ -77,7 +75,10 @@
                         </p>
                     </div>
                     <div class="row">
-                        <p class="mx-auto w-auto">&#169; Heike Tischler</p>
+                        <p class="mx-auto">&#169; Heike Tischler</p>
+                    </div>
+                    <div class="row">
+                        <p class="mx-auto">Diese Webseite nutzt <a target="_blank" href="http://getgrav.org">Grav</a> von <a target="_blank" href="http://www.rockettheme.com">RocketTheme</a>.</p>
                     </div>
                 </footer>
             {% endblock %}
@@ -95,7 +96,6 @@
 
 {% if theme_var('umami.enabled') %}
     <script async defer data-website-id="{{ theme_var('umami.id') }}" src="{{ theme_var('umami.url') }}"></script>
-    <script async defer src="{{ theme_var('umami.url_external_tracking') }}"></script>
 {% endif %}
 
 </html>

templates/partials/navbar.html.twig

@@ -7,7 +7,7 @@
     <ul class="sidebar-nav">
         <li class="sidebar-spacer"></li>
         <li class="sidebar-brand">
-            <a href="{{ home_url }}" class="navbar-brand mr-10" data-umami-event="Sidebar-Logo button">
+            <a href="{{ home_url }}" class="navbar-brand mr-10">
                 {% include 'partials/logo.html.twig' %}
             </a>
         </li>

templates/partials/osm.html.twig

@@ -1,19 +1,12 @@
-<div class="w-100 h-100 d-flex flex-column pb-2">
+<div class="w-100 h-100 d-flex flex-column">
-	<div class="flex-grow-1">
+    <iframe class="flex-grow-1 w-100" style="border: 0;" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="https://www.openstreetmap.org/export/embed.html?bbox=13.184784650802612%2C52.76459265506261%2C13.190723061561586%2C52.76727373740601&amp;layer=mapnik&amp;marker=52.765933216869406%2C13.187753856182098" style="border: 1px solid black"></iframe>
-		<div class="position-relative w-100">
+    <small>
-			<a target="_blank" rel="noopener" href="https://www.openstreetmap.org/way/203340031" data-umami-event="OSM button">
+        <a target="_blank" href="https://www.openstreetmap.org/?mlat=52.76593&amp;mlon=13.18775#map=18/52.76593/13.18775">
-				<img class="w-100" alt="Diese Karte zeigt unseren Hof" src="{{ url('theme://images/map.webp') }}">
+            Auf OpenStreetMaps öffnen
-			</a>
+        </a>
-			<small class="d-block position-absolute bottom-0 start-0">
+        <span class="mx-1"> | </span>
-				<a class="bg-white text-black p-1" target="_blank" rel="noopener" href="https://goo.gl/maps/WFYcPCQVA5u2vegy8" data-umami-event="Google-Maps button">
+        <a target="_blank" href="https://goo.gl/maps/WFYcPCQVA5u2vegy8">
-					Auf Google Maps öffnen
+            Auf Google Maps öffnen
-				</a>
+        </a>
-			</small>
+    </small>
-			<small class="d-block position-absolute bottom-0 end-0">
-				<a class="bg-white text-black p-1" target="_blank" rel="noopener" href="https://www.openstreetmap.org/copyright" data-umami-event="OSM-copyright button">
-					&#169; OpenStreetMap contributors
-				</a>
-			</small>
-		</div>
-	</div>
 </div>

templates/partials/socialmedia.html.twig

@@ -1,4 +1,3 @@
-<a role="button" class="btn btn-primary btn-facebook" target="_blank" rel="noopener" href="https://www.facebook.com/Reitanlage-Oranienburg-Heike-Tischler-456154271116487/" data-umami-event="Facebook button">
+<a role="button" class="btn btn-facebook" target="_blank" href="https://www.facebook.com/Reitanlage-Oranienburg-Heike-Tischler-456154271116487/">
     <i class="fab fa-facebook-f"></i>
-    <span class="sr-only">zu unserer Facebook-Seite</span>
 </a>

templates/pictures.html.twig

@@ -47,8 +47,7 @@
         function show_photoswipe(start_index)
         {
             let options = {
-                index: start_index,
+                index: start_index
-                history: false,
             };
 
             let gallery = new PhotoSwipe( pswpElement, PhotoSwipeDefaultUI, items, options);

webpack.mix.js

@@ -2,9 +2,8 @@
 
 let mix = require('laravel-mix');
 
-mix.setPublicPath('dist')
+mix.setPublicPath('dist');
-	.setResourceRoot('/user/themes/reitanlage-oranienburg/dist/')
+mix.setResourceRoot('/user/themes/reitanlage-oranienburg/dist/');
-	.js('src/js/app.js', 'dist')
+
-	.sass('src/sass/app.scss', 'dist')
+mix.js('src/js/app.js', 'dist');
-	.sourceMaps(false)
+mix.sass('src/sass/app.scss', 'dist');
-    .version();