Create release 1.1.4

Reviewed-on: #2

.buildpath

@@ -1,5 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<buildpath>
-	<buildpathentry kind="con" path="org.eclipse.php.core.LANGUAGE"/>
-	<buildpathentry kind="src" path=""/>
-</buildpath>

.project

@@ -1,28 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<projectDescription>
-	<name>template</name>
-	<comment></comment>
-	<projects>
-	</projects>
-	<buildSpec>
-		<buildCommand>
-			<name>org.eclipse.wst.common.project.facet.core.builder</name>
-			<arguments>
-			</arguments>
-		</buildCommand>
-		<buildCommand>
-			<name>org.eclipse.wst.validation.validationbuilder</name>
-			<arguments>
-			</arguments>
-		</buildCommand>
-		<buildCommand>
-			<name>org.eclipse.dltk.core.scriptbuilder</name>
-			<arguments>
-			</arguments>
-		</buildCommand>
-	</buildSpec>
-	<natures>
-		<nature>org.eclipse.php.core.PHPNature</nature>
-		<nature>org.eclipse.wst.common.project.facet.core.nature</nature>
-	</natures>
-</projectDescription>

.settings/org.eclipse.php.core.prefs

@@ -1,2 +0,0 @@
-eclipse.preferences.version=1
-include_path=0;/template

.settings/org.eclipse.wst.common.project.facet.core.xml

@@ -1,7 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<faceted-project>
-  <fixed facet="php.component"/>
-  <fixed facet="php.core.component"/>
-  <installed facet="php.core.component" version="1"/>
-  <installed facet="php.component" version="5.6"/>
-</faceted-project>

.vscode/launch.json

@@ -0,0 +1,18 @@
+{
+    // Use IntelliSense to learn about possible attributes.
+    // Hover to view descriptions of existing attributes.
+    // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
+    "version": "0.2.0",
+    "configurations": [
+        {
+            "name": "Listen for Xdebug",
+            "type": "php",
+            "request": "launch",
+            "port": 9000,
+            "pathMappings": {
+                "/var/www/html": "${workspaceRoot:joomla}",
+                "/var/www/html/templates": "${workspaceRoot:template}"
+            }
+        }
+    ]
+}

Makefile

@@ -2,7 +2,7 @@
 # UPDATE_PATH=/srv/slt-update
 PACKAGES = slt.tar.gz
 
-export DL_PREFIX=https://slt.wolf-stuttgart.net/update/template
+export DL_PREFIX=https://slt.wolf-stuttgart.net/update/template/files
 
 RSYNC_OPTIONS=-rltDz --delete --delete-delay --delete-excluded --exclude '.gitignore'
 RSYNC_USER=christian
@@ -13,9 +13,31 @@ all: package
 
 package: $(PACKAGES)
 
+.PHONY: npm
+npm:
+	cd slt; npm i
+	cd slt; npm run sass
+	cd slt; npm run prettier && npm run stylelint
+
 .PHONY: slt.tar.gz
-slt.tar.gz:
-	cd slt ; tar czf ../$@ *
+slt.tar.gz: npm slt/templateDetails.xml
+	# cd slt ; tar czf ../$@ *
+	tar czf $@ -C slt \
+		css/index.html css/style.css css/.htaccess \
+		html \
+		images \
+		js \
+		language \
+		favicon.ico \
+		index.html \
+		index.php \
+		template_preview.png \
+		template_thumbnail.png \
+		templateDetails.xml
+
+.PHONY: slt/templateDetails.xml
+slt/templateDetails.xml:
+	./scripts/create-details-xml.sh
 
 .PHONY: release
 release: slt.tar.gz

releases/slt-0.0.1.xml

@@ -0,0 +1,16 @@
+	<update>
+		<name>SLT Template</name>
+		<description>Template for the SLT for the Joomla! CMS</description>
+		<element>slt</element>
+		<type>template</type>
+		<client>site</client>
+		<version>0.0.1</version>
+		<downloads>
+			<downloadurl type="full" format="tar.gz">$DL_PREFIX/slt-0.0.1.tar.gz</downloadurl>
+		</downloads>
+		<tags>
+			<tag>stable</tag>
+		</tags>
+		<maintainer>Christian Wolf</maintainer>
+		<targetplatform name="joomla" version="3.[012345678]|3.10"/>
+	</update>

releases/slt-0.0.10.xml

@@ -0,0 +1,16 @@
+	<update>
+		<name>SLT Template</name>
+		<description>Template for the SLT for the Joomla! CMS</description>
+		<element>slt</element>
+		<type>template</type>
+		<client>site</client>
+		<version>0.0.10</version>
+		<downloads>
+			<downloadurl type="full" format="tar.gz">$DL_PREFIX/slt-0.0.10.tar.gz</downloadurl>
+		</downloads>
+		<tags>
+			<tag>stable</tag>
+		</tags>
+		<maintainer>Christian Wolf</maintainer>
+		<targetplatform name="joomla" version="3.[012345678]|3.10"/>
+	</update>

releases/slt-0.0.3.xml

@@ -0,0 +1,16 @@
+	<update>
+		<name>SLT Template</name>
+		<description>Template for the SLT for the Joomla! CMS</description>
+		<element>slt</element>
+		<type>template</type>
+		<client>site</client>
+		<version>0.0.3</version>
+		<downloads>
+			<downloadurl type="full" format="tar.gz">$DL_PREFIX/slt-0.0.3.tar.gz</downloadurl>
+		</downloads>
+		<tags>
+			<tag>stable</tag>
+		</tags>
+		<maintainer>Christian Wolf</maintainer>
+		<targetplatform name="joomla" version="3.[012345678]|3.10"/>
+	</update>

releases/slt-0.0.4.xml

@@ -0,0 +1,16 @@
+	<update>
+		<name>SLT Template</name>
+		<description>Template for the SLT for the Joomla! CMS</description>
+		<element>slt</element>
+		<type>template</type>
+		<client>site</client>
+		<version>0.0.4</version>
+		<downloads>
+			<downloadurl type="full" format="tar.gz">$DL_PREFIX/slt-0.0.4.tar.gz</downloadurl>
+		</downloads>
+		<tags>
+			<tag>stable</tag>
+		</tags>
+		<maintainer>Christian Wolf</maintainer>
+		<targetplatform name="joomla" version="3.[012345678]|3.10"/>
+	</update>

releases/slt-0.0.5.xml

@@ -0,0 +1,16 @@
+	<update>
+		<name>SLT Template</name>
+		<description>Template for the SLT for the Joomla! CMS</description>
+		<element>slt</element>
+		<type>template</type>
+		<client>site</client>
+		<version>0.0.5</version>
+		<downloads>
+			<downloadurl type="full" format="tar.gz">$DL_PREFIX/slt-0.0.5.tar.gz</downloadurl>
+		</downloads>
+		<tags>
+			<tag>stable</tag>
+		</tags>
+		<maintainer>Christian Wolf</maintainer>
+		<targetplatform name="joomla" version="3.[012345678]|3.10"/>
+	</update>

releases/slt-0.0.6.xml

@@ -0,0 +1,16 @@
+	<update>
+		<name>SLT Template</name>
+		<description>Template for the SLT for the Joomla! CMS</description>
+		<element>slt</element>
+		<type>template</type>
+		<client>site</client>
+		<version>0.0.6</version>
+		<downloads>
+			<downloadurl type="full" format="tar.gz">$DL_PREFIX/slt-0.0.6.tar.gz</downloadurl>
+		</downloads>
+		<tags>
+			<tag>stable</tag>
+		</tags>
+		<maintainer>Christian Wolf</maintainer>
+		<targetplatform name="joomla" version="3.[012345678]|3.10"/>
+	</update>

releases/slt-0.0.7.xml

@@ -0,0 +1,16 @@
+	<update>
+		<name>SLT Template</name>
+		<description>Template for the SLT for the Joomla! CMS</description>
+		<element>slt</element>
+		<type>template</type>
+		<client>site</client>
+		<version>0.0.7</version>
+		<downloads>
+			<downloadurl type="full" format="tar.gz">$DL_PREFIX/slt-0.0.7.tar.gz</downloadurl>
+		</downloads>
+		<tags>
+			<tag>stable</tag>
+		</tags>
+		<maintainer>Christian Wolf</maintainer>
+		<targetplatform name="joomla" version="3.[012345678]|3.10"/>
+	</update>

releases/slt-0.0.8.xml

@@ -0,0 +1,16 @@
+	<update>
+		<name>SLT Template</name>
+		<description>Template for the SLT for the Joomla! CMS</description>
+		<element>slt</element>
+		<type>template</type>
+		<client>site</client>
+		<version>0.0.8</version>
+		<downloads>
+			<downloadurl type="full" format="tar.gz">$DL_PREFIX/slt-0.0.8.tar.gz</downloadurl>
+		</downloads>
+		<tags>
+			<tag>stable</tag>
+		</tags>
+		<maintainer>Christian Wolf</maintainer>
+		<targetplatform name="joomla" version="3.[012345678]|3.10"/>
+	</update>

releases/slt-0.0.9.xml

@@ -0,0 +1,16 @@
+	<update>
+		<name>SLT Template</name>
+		<description>Template for the SLT for the Joomla! CMS</description>
+		<element>slt</element>
+		<type>template</type>
+		<client>site</client>
+		<version>0.0.9</version>
+		<downloads>
+			<downloadurl type="full" format="tar.gz">$DL_PREFIX/slt-0.0.9.tar.gz</downloadurl>
+		</downloads>
+		<tags>
+			<tag>stable</tag>
+		</tags>
+		<maintainer>Christian Wolf</maintainer>
+		<targetplatform name="joomla" version="3.[012345678]|3.10"/>
+	</update>

releases/slt-1.0.0.xml

@@ -0,0 +1,20 @@
+	<update>
+		<name>SLT Template</name>
+		<description>Template for the SLT for the Joomla! CMS</description>
+		<element>slt</element>
+		<type>template</type>
+		<client>site</client>
+		<version>1.0.0</version>
+		<downloads>
+			<downloadurl type="full" format="tar.gz">$DL_PREFIX/slt-1.0.0.tar.gz</downloadurl>
+		</downloads>
+		<tags>
+			<tag>stable</tag>
+			<!--<tag>rc</tag>-->
+			<!--<tag>beta</tag>-->
+			<!--<tag>alpha</tag>-->
+			<!--<tag>dev</tag>-->
+		</tags>
+		<maintainer>Christian Wolf</maintainer>
+		<targetplatform name="joomla" version="4[.].*"/>
+	</update>

releases/slt-1.0.1.xml

@@ -0,0 +1,20 @@
+	<update>
+		<name>SLT Template</name>
+		<description>Template for the SLT for the Joomla! CMS</description>
+		<element>slt</element>
+		<type>template</type>
+		<client>site</client>
+		<version>1.0.1</version>
+		<downloads>
+			<downloadurl type="full" format="tar.gz">$DL_PREFIX/slt-1.0.1.tar.gz</downloadurl>
+		</downloads>
+		<tags>
+			<tag>stable</tag>
+			<!--<tag>rc</tag>-->
+			<!--<tag>beta</tag>-->
+			<!--<tag>alpha</tag>-->
+			<!--<tag>dev</tag>-->
+		</tags>
+		<maintainer>Christian Wolf</maintainer>
+		<targetplatform name="joomla" version="4[.].*"/>
+	</update>

releases/slt-1.0.2.xml

@@ -0,0 +1,20 @@
+	<update>
+		<name>SLT Template</name>
+		<description>Template for the SLT for the Joomla! CMS</description>
+		<element>slt</element>
+		<type>template</type>
+		<client>site</client>
+		<version>1.0.2</version>
+		<downloads>
+			<downloadurl type="full" format="tar.gz">$DL_PREFIX/slt-1.0.2.tar.gz</downloadurl>
+		</downloads>
+		<tags>
+			<tag>stable</tag>
+			<!--<tag>rc</tag>-->
+			<!--<tag>beta</tag>-->
+			<!--<tag>alpha</tag>-->
+			<!--<tag>dev</tag>-->
+		</tags>
+		<maintainer>Christian Wolf</maintainer>
+		<targetplatform name="joomla" version="4[.].*"/>
+	</update>

releases/slt-1.0.3.xml

@@ -0,0 +1,20 @@
+	<update>
+		<name>SLT Template</name>
+		<description>Template for the SLT for the Joomla! CMS</description>
+		<element>slt</element>
+		<type>template</type>
+		<client>site</client>
+		<version>1.0.3</version>
+		<downloads>
+			<downloadurl type="full" format="tar.gz">$DL_PREFIX/slt-1.0.3.tar.gz</downloadurl>
+		</downloads>
+		<tags>
+			<tag>stable</tag>
+			<!--<tag>rc</tag>-->
+			<!--<tag>beta</tag>-->
+			<!--<tag>alpha</tag>-->
+			<!--<tag>dev</tag>-->
+		</tags>
+		<maintainer>Christian Wolf</maintainer>
+		<targetplatform name="joomla" version="4[.].*"/>
+	</update>

releases/slt-1.0.4.xml

@@ -0,0 +1,20 @@
+	<update>
+		<name>SLT Template</name>
+		<description>Template for the SLT for the Joomla! CMS</description>
+		<element>slt</element>
+		<type>template</type>
+		<client>site</client>
+		<version>1.0.4</version>
+		<downloads>
+			<downloadurl type="full" format="tar.gz">$DL_PREFIX/slt-1.0.4.tar.gz</downloadurl>
+		</downloads>
+		<tags>
+			<tag>stable</tag>
+			<!--<tag>rc</tag>-->
+			<!--<tag>beta</tag>-->
+			<!--<tag>alpha</tag>-->
+			<!--<tag>dev</tag>-->
+		</tags>
+		<maintainer>Christian Wolf</maintainer>
+		<targetplatform name="joomla" version="4[.].*"/>
+	</update>

releases/slt-1.1.0.xml

@@ -0,0 +1,21 @@
+	<update>
+		<name>SLT Template</name>
+		<description>Template for the SLT for the Joomla! CMS</description>
+		<element>slt</element>
+		<type>template</type>
+		<client>site</client>
+		<version>1.1.0</version>
+		<downloads>
+			<downloadurl type="full" format="tar.gz">$DL_PREFIX/slt-1.1.0.tar.gz</downloadurl>
+		</downloads>
+		<tags>
+			<!-- <tag>stable</tag> -->
+			<tag>rc</tag>
+			<!--<tag>beta</tag>-->
+			<!--<tag>alpha</tag>-->
+			<!--<tag>dev</tag>-->
+		</tags>
+		<maintainer>Christian Wolf</maintainer>
+		<targetplatform name="joomla" version="4[.].*"/>
+		<sha512>c738c8b64a1be419570dc12763c5fb8ecaefaa31b6067eaf263a611ccdae404a467072dc1e0e17caffca5278d3c19b70633069183b5f90ebc9b75ab4b750691f</sha512>
+	</update>

releases/slt-1.1.1.xml

@@ -0,0 +1,21 @@
+	<update>
+		<name>SLT Template</name>
+		<description>Template for the SLT for the Joomla! CMS</description>
+		<element>slt</element>
+		<type>template</type>
+		<client>site</client>
+		<version>1.1.1</version>
+		<downloads>
+			<downloadurl type="full" format="tar.gz">$DL_PREFIX/slt-1.1.1.tar.gz</downloadurl>
+		</downloads>
+		<tags>
+			<!-- <tag>stable</tag> -->
+			<tag>rc</tag>
+			<!--<tag>beta</tag>-->
+			<!--<tag>alpha</tag>-->
+			<!--<tag>dev</tag>-->
+		</tags>
+		<maintainer>Christian Wolf</maintainer>
+		<targetplatform name="joomla" version="4[.].*"/>
+		<sha512>f54b25670ae1ed6ed1fd0712c02a47bc040526679a9a2abe09be4982afb67ec819493d25075c90fc13f23f3bea8734156e83705c2003e236b6b65fef39b1a39c</sha512>
+	</update>

releases/slt-1.1.2.xml

@@ -0,0 +1,21 @@
+	<update>
+		<name>SLT Template</name>
+		<description>Template for the SLT for the Joomla! CMS</description>
+		<element>slt</element>
+		<type>template</type>
+		<client>site</client>
+		<version>1.1.2</version>
+		<downloads>
+			<downloadurl type="full" format="tar.gz">$DL_PREFIX/slt-1.1.2.tar.gz</downloadurl>
+		</downloads>
+		<tags>
+			<!-- <tag>stable</tag> -->
+			<tag>rc</tag>
+			<!--<tag>beta</tag>-->
+			<!--<tag>alpha</tag>-->
+			<!--<tag>dev</tag>-->
+		</tags>
+		<maintainer>Christian Wolf</maintainer>
+		<targetplatform name="joomla" version="4[.].*"/>
+		<sha512>2679c8ef32e67e31915466d6f28c021fcbfe6acfbcb41d70477af06c59e0e6e960691b37249f1ebebfa1e201049e4c2e222a7fc9106b83c6c4667ed6e42e1d60</sha512>
+	</update>

releases/slt-1.1.3.xml

@@ -0,0 +1,21 @@
+	<update>
+		<name>SLT Template</name>
+		<description>Template for the SLT for the Joomla! CMS</description>
+		<element>slt</element>
+		<type>template</type>
+		<client>site</client>
+		<version>1.1.3</version>
+		<downloads>
+			<downloadurl type="full" format="tar.gz">$DL_PREFIX/slt-1.1.3.tar.gz</downloadurl>
+		</downloads>
+		<tags>
+			<tag>stable</tag>
+			<!-- <tag>rc</tag> -->
+			<!--<tag>beta</tag>-->
+			<!--<tag>alpha</tag>-->
+			<!--<tag>dev</tag>-->
+		</tags>
+		<maintainer>Christian Wolf</maintainer>
+		<targetplatform name="joomla" version="4[.].*"/>
+		<sha512>6efb161e0ef05cf30231d39f304221f01cf29c615cc581b5eeede8d00e34f5cfb624379a588319d363ecc2301f7c836f7874b124e736672ebf377c1ae3f314b2</sha512>
+	</update>

releases/slt-1.1.4.xml

@@ -0,0 +1,21 @@
+	<update>
+		<name>SLT Template</name>
+		<description>Template for the SLT for the Joomla! CMS</description>
+		<element>slt</element>
+		<type>template</type>
+		<client>site</client>
+		<version>1.1.4</version>
+		<downloads>
+			<downloadurl type="full" format="tar.gz">$DL_PREFIX/slt-1.1.4.tar.gz</downloadurl>
+		</downloads>
+		<tags>
+			<tag>stable</tag>
+			<!-- <tag>rc</tag> -->
+			<!--<tag>beta</tag>-->
+			<!--<tag>alpha</tag>-->
+			<!--<tag>dev</tag>-->
+		</tags>
+		<maintainer>Christian Wolf</maintainer>
+		<targetplatform name="joomla" version="4[.].*"/>
+		<sha512>45fa3583aa96ac8107c3927979c48a9de5449303b08717c33036f758abf2ede399b734eefca7ecfa8bb2106df94f4741ec1d560cd656ec16cf84c0d1437e1cde</sha512>
+	</update>

res/templateDetails.tmpl.xml

@@ -0,0 +1,100 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!DOCTYPE install PUBLIC "-//Joomla! 1.6//DTD template 1.0//EN" "http://www.joomla.org/xml/dtd/1.6/template-install.dtd"> 
+<extension
+    version="3.0"
+    method="upgrade"
+    type="template"
+    client="site"> 
+  <name>SLT</name>
+  <title>Template des Saarländischen Landesverbands für Tanzsport e.V.</title>
+  <creationDate>${DATE}</creationDate>
+  <version>${VERSION}</version>
+  <author>Christian Wolf</author>
+  <authorEmail>homepage@slt.wolf-stuttgart.net</authorEmail>
+  <authorUrl>https://git.christian-wolf.click/slt/template</authorUrl>
+  <!-- SOLLTE, Die Template-Beschreibung wird hier als Joomla language mit einem Platzhalter versehen. In diesem Template-Ordner befindet sich die Sprachdatei in der TPL_TEST_TEMPLATE_XML_DESCRIPTION hinterlegt ist -->
+  <!--<description>TPL_TEST_TEMPLATE_XML_DESCRIPTION</description>-->
+  <files> 
+    <folder>css</folder>
+    <folder>images</folder>
+    <folder>language</folder>
+    <folder>js</folder>
+    <folder>html</folder>
+    <filename>index.php</filename>
+    <filename>index.html</filename>
+    <filename>favicon.ico</filename>
+    <filename>templateDetails.xml</filename>
+    <filename>template_preview.png</filename>
+    <filename>template_thumbnail.png</filename>
+    <!-- SOLLTE, in dieser Datei kann eine individuelle Fehlerseite erstellt werden (404) -->
+    <!--<filename>error.php</filename>-->
+  </files>
+  <positions>
+    <position>topmenu</position>
+    <position>slideshow</position>
+    <position>mobile_menu</position>
+    <position>left_menu</position>
+    <position>footline</position>
+    <position>impressum</position>
+    <position>footer</position>
+    <position>current_page_menu</position>
+  </positions>
+  <!--Sollte, Sollten unterschiedliche Sprachen genutzt werden, ist hier der richtige Platz um diese zu installieren-->
+  <!--<languages folder="language">
+    <language tag="de-DE">de-DE/de-DE.tpl_test_template.sys.ini</language>
+    <language tag="de-DE">de-DE/de-DE.tpl_test_template.ini</language>
+    <language tag="de-DE">en-GB/en-GB.tpl_test_template.sys.ini</language>
+    <language tag="de-DE">en-GB/en-GB.tpl_test_template.ini</language>
+  </languages>-->
+  <!-- Parameter Block start -->
+  <config>
+    <fields name="params">
+      <fieldset name="advanced">
+        <field name="titlepage" type="list" default="0" label="Switch to titlepage mode" description="">
+          <option value="0">No</option>
+          <option value="1">Yes</option>
+        </field>
+      </fieldset>
+      <fieldset name='TPL_SLT_COLORS_TOPMENU'>
+      	<field name="topfgcolor1" type='color' default='#fff' label='TPL_SLT_FOREGROUND_COLOR_TOP'></field>
+        <field name="topbgcolor1" type='color' default='#000' label='TPL_SLT_BACKGROUND_COLOR_TOP'></field>
+        <field name="topfgcolor2" type='color' default='#000' label='TPL_SLT_FOREGROUND_COLOR_TOP_DARK'></field>
+        <field name="topbgcolor2" type='color' default='#bbb' label='TPL_SLT_BACKGROUND_COLOR_TOP_DARK'></field>
+        <field name="topfgcolor3" type='color' default='#000' label='TPL_SLT_FOREGROUND_COLOR_TOP_LIGHT'></field>
+        <field name="topbgcolor3" type='color' default='#ddd' label='TPL_SLT_BACKGROUND_COLOR_TOP_LIGHT'></field>
+      </fieldset>
+      <fieldset name='TPL_SLT_COLORS_MAIN'>
+        <field type="spacer" name="menu-colors" label="Top-menu colors" />
+        <!--<field name="fgcolor1" type='color' default='#fff' label='TPL_SLT_FOREGROUND_COLOR_1'></field>-->
+        <field name="mainfgcolor" type='color' default='#000' label='TPL_SLT_FOREGROUND_COLOR_MAIN'></field>
+        <field name="mainlicolor" type='color' default='#222' label='TPL_SLT_LINK_COLOR_MAIN'></field>
+        <field name="headercolor" type='color' default='#000' label='Color of header (normally foreground link color or black/white)'></field>
+        <field name="mainbgcolortop" type='color' default='#ddd' label='TPL_SLT_BACKGROUND_COLOR_MAIN_TOP'></field>
+        <field name="mainbgcolorbot" type='color' default='#fff' label='TPL_SLT_BACKGROUND_COLOR_MAIN_BOTTOM'></field>
+        
+        <field type="spacer" name="menu-colors" label="Menu colors" />
+        <field name="fgcolor1" type='color' default='#000' label='TPL_SLT_FOREGROUND_COLOR_1'></field>
+        <field name="bgcolor1" type='color' default='#ddd' label='TPL_SLT_BACKGROUND_COLOR_1' format='rgba'></field>
+        <field type="spacer" name="spacer1" hr="true" />
+        <field name="fgcolor2" type='color' default='#000' label='TPL_SLT_FOREGROUND_COLOR_2'></field>
+        <field name="bgcolor2" type='color' default='#bbb' label='TPL_SLT_BACKGROUND_COLOR_2' format='rgba'></field>
+        
+        <field type="spacer" name="effect-colors" label="Effect coloring" />
+        <field name="fgeffect" type="color" default="#000" label="TPL_SLT_FOREGROUND_EFFECT_COLOR"></field>
+        <field name="bgeffect" type="color" default="#eee" label="TPL_SLT_BACKGROUND_EFFECT_COLOR"></field>
+        <field type="spacer" name="spacer3" hr="true" />
+        <field name="fgeffecthdr" type="color" default="#000" label="TPL_SLT_FOREGROUND_EFFECT_HEADER_COLOR"></field>
+        <field name="bgeffecthdr" type="color" default="#ccc" label="TPL_SLT_BACKGROUND_EFFECT_HEADER_COLOR"></field>
+
+        <field type="spacer" name="side-images" label="Side configuration" />
+        <field name="bgcolorside" type='color' default='#ebebeb' label='TPL_SLT_BACKGROUND_COLOR_AT_SIDES'></field>
+        <field name="imgleft" type='media' directory='' label='TPL_SLT_LEFT_BACKGROUND_IMAGE'></field>
+        <field name="imgright" type='media' directory='' label='TPL_SLT_RIGHT_BACKGROUND_IMAGE'></field>
+      </fieldset>
+    </fields>
+  </config>
+  <!-- Parameter Block ende -->
+  <updateservers>
+  		<server type="extension" name="SLT Update Site of Christian Wolf" priority="1">http://slt.wolf-stuttgart.net/update/template/slt-update.xml</server>
+  </updateservers>
+</extension>

res/update.template

@@ -3,14 +3,19 @@
 		<description>Template for the SLT for the Joomla! CMS</description>
 		<element>slt</element>
 		<type>template</type>
-		<client>0</client>
-		<version>__VERSION__</version>
+		<client>site</client>
+		<version>$VERSION</version>
 		<downloads>
-			<downloadurl type="full" format="__FORMAT__">__DOWNLOAD_URL__</downloadurl>
+			<downloadurl type="full" format="$FORMAT">$DOWNLOAD_URL</downloadurl>
 		</downloads>
 		<tags>
 			<tag>stable</tag>
+			<!--<tag>rc</tag>-->
+			<!--<tag>beta</tag>-->
+			<!--<tag>alpha</tag>-->
+			<!--<tag>dev</tag>-->
 		</tags>
 		<maintainer>Christian Wolf</maintainer>
-		<targetplatform name="joomla" version=".*"/>
+		<targetplatform name="joomla" version="4[.].*"/>
+		$SUMS
 	</update>

scripts/create-details-xml.sh

@@ -0,0 +1,10 @@
+#!/bin/bash
+
+MAJOR=`cat serial/major`
+MINOR=`cat serial/minor`
+RELEASE=`cat serial/release`
+
+export DATE=`date '+%Y-%m-%d'`
+export VERSION="$MAJOR.$MINOR.$RELEASE"
+
+cat res/templateDetails.tmpl.xml | envsubst > slt/templateDetails.xml

scripts/create-release.sh

@@ -5,7 +5,10 @@ MINOR=`cat serial/minor`
 RELEASE=`cat serial/release`
 TOTRELEASE="$MAJOR.$MINOR.$RELEASE"
 
-outname="releases/slt-$TOTRELEASE.tar.gz"
+filebase="slt-$TOTRELEASE"
+filename="$filebase.tar.gz"
+outname="releases/$filename"
+xmlname="releases/$filebase.xml"
 
 mkdir -p releases
 
@@ -17,3 +20,12 @@ if [ -f "$outname" ]; then
 fi
 
 cp slt.tar.gz "$outname"
+
+sha=$(sha512sum slt.tar.gz | cut -d' ' -f1)
+
+export VERSION="$TOTRELEASE"
+export FORMAT='tar.gz'
+export DOWNLOAD_URL="\$DL_PREFIX/$filename"
+export SUMS="<sha512>$sha</sha512>"
+
+cat res/update.template | envsubst > "$xmlname"

scripts/create-update-xml.sh

@@ -1,22 +1,11 @@
 #!/bin/bash
 
-# DL_PREFIX="https://slt.wolf-stuttgart.net/update/template"
-
 cat res/prefix.template > slt-update.xml
 
-find releases -name slt-\* | while read f
+find releases -name slt-\*.xml | sort -V | while read f
 do
-	
-	VSTR=`echo "$f" | sed -E 's@releases/slt-@@; s@^([0-9]+\.[0-9]+\.[0-9]+).*$@\1@'`
-	
-	FILE=`echo "$f" | sed 's@releases/@@'`
-	FORMAT=`echo "$f" | sed -E 's@^.*[0-9]+\.[0-9]+\.[0-9]+\.@@'`
-	
-	sed '
-		s@__VERSION__@'"$VSTR"'@g;
-		s@__DOWNLOAD_URL__@'"$DL_PREFIX/files/$FILE"'@g;
-		s@__FORMAT__@'"$FORMAT"'@g
-		' res/update.template >> slt-update.xml
+	# Replace DL_PREFIX in the XML parts and combine them
+	cat "$f" | envsubst >> slt-update.xml
 	
 done
 

serial/major

@@ -1 +1 @@
-0
+1

serial/minor

@@ -1 +1 @@
-0
+1

serial/release

@@ -1 +1 @@
-3
+4

slt.xml

@@ -1,21 +0,0 @@
-<?xml version="1.0" encoding="utf-8"?>
-<updates>
-	<update>
-		<name>Joomla Template</name>
-		<description>Template for the SLT for the Joomla! CMS</description>
-		<element>slt</element>
-		<type>template</type>
-		<version>0.0.1</version>
-	<!-- 	<infourl title="Joomla!">http://www.joomla.org/</infourl> -->
-		<downloads>
-			<downloadurl type="full" format="tar">http://localhost/slt-update/slt1.tar</downloadurl>
-		</downloads>
-		<!--<tags>
-			<tag>stable</tag>
-		</tags>-->
-		<maintainer>Christian Wolf</maintainer>
-	<!-- 	<maintainerurl>http://sammoffatt.com.au</maintainerurl> -->
-	<!-- 	<section>Testing</section> -->
-	<!-- 	<targetplatform name="joomla" version="1.6"/> -->
-	</update>
-</updates>

slt/.gitignore

@@ -0,0 +1,3 @@
+/node_modules/
+/.stylelintcache
+/templateDetails.xml

slt/.prettierignore

@@ -0,0 +1 @@
+/html/

slt/.stylelintrc.json

@@ -0,0 +1,13 @@
+{
+    "extends": "stylelint-config-standard-scss",
+    "plugins": [
+        "stylelint-order",
+        "stylelint-scss"
+    ],
+    "rules": {
+        "indentation": 4,
+        "selector-class-pattern": "^([a-z][a-z0-9]*)((-|__)[a-z0-9]+)*$",
+        "string-quotes": "single",
+        "declaration-colon-newline-after": null
+    }
+  }

slt/css/.gitignore

@@ -0,0 +1,2 @@
+/style.css
+*.css.map

slt/css/.htaccess

@@ -0,0 +1,24 @@
+<IfModule mod_headers.c>
+
+# Caching
+
+# 2 Stunden für Textdateien
+<FilesMatch "\.(css|css\.map)$">
+Header set Cache-Control "public, max-age=3600, must-revalidate"
+</FilesMatch>
+
+</IfModule> 
+
+<IfModule mod_expires.c>
+
+# Expires-Header aktivieren
+  ExpiresActive On
+
+# Typunabhängige Standard-Ablaufzeit setzen
+  ExpiresDefault "access plus 1 hour"
+
+# Typabhängige Ablaufzeit für JPEG-Dateien (jpeg, jpg, jpe)
+#  ExpiresByType image/jpeg "access plus 1 year"
+
+# Weitere Dateitypen...
+</IfModule>

slt/css/abstract/_colors.scss

@@ -0,0 +1,15 @@
+$color-lehre: #d9c254;
+$color-breitensport: #a6d400;
+$color-jugend: #04b;
+$color-jmd: #e95d00;
+$color-fachverbaende: #eec008;
+$color-sport: #bc0023;
+
+:root {
+    --color-lehre: #{$color-lehre};
+    --color-breitensport: #{$color-breitensport};
+    --color-jugend: #{$color-jugend};
+    --color-jmd: #{$color-jmd};
+    --color-fachverbaende: #{$color-fachverbaende};
+    --color-sport: #{$color-sport};
+}

slt/css/abstract/_index.scss

@@ -0,0 +1,2 @@
+@forward 'responsive';
+@forward 'colors';

slt/css/abstract/_responsive.scss

@@ -0,0 +1,19 @@
+// Some Mixins for various screen sizes
+
+@mixin for-desktop {
+    @media screen and (min-width: 1000px) {
+        @content;
+    }
+}
+
+@mixin for-wide-desktop {
+    @media screen and (min-width: 1200px) {
+        @content;
+    }
+}
+
+@mixin for-narrow-screen {
+    @media screen and (max-width: 800px) {
+        @content;
+    }
+}

slt/css/components/_article.scss

@@ -0,0 +1,28 @@
+@use '../abstract' as abstract;
+
+.article-info {
+    font-size: smaller;
+    clear: both;
+}
+
+@include abstract.for-desktop {
+    .btn {
+        border-radius: 0;
+    }
+
+    p.readmore {
+        text-align: right;
+        font-size: smaller;
+
+        > .btn {
+            font-size: inherit;
+            background-image: none;
+            border: none;
+            text-shadow: unset;
+
+            > span[class^='icon-'] {
+                display: none;
+            }
+        }
+    }
+}

slt/css/components/_contact-list.scss

@@ -0,0 +1,13 @@
+table.com-content-category__table {
+    thead {
+        display: none;
+    }
+
+    tr {
+        > th,
+        > td {
+            border: none;
+            box-shadow: none;
+        }
+    }
+}

slt/css/components/_contact-view.scss

@@ -0,0 +1,4 @@
+.com-contact__thumbnail {
+    float: right;
+    margin: 10px 0 10px 10px;
+}

slt/css/components/_current-page-menu.scss

@@ -0,0 +1,25 @@
+#left-menu .current-page-menu ul.mod-menu {
+    background-color: transparent;
+    padding-top: 0;
+    padding-bottom: 0;
+    margin-bottom: 0;
+
+    &:hover {
+        box-shadow: unset;
+    }
+
+    > li {
+        border-style: none;
+        display: none;
+
+        &.active {
+            display: block;
+            border-style: none;
+
+            > a {
+                background-color: transparent;
+                font-weight: bold;
+            }
+        }
+    }
+}

slt/css/components/_index.scss

@@ -0,0 +1,10 @@
+@use 'slideshow';
+@use 'article';
+@use 'current-page-menu';
+@use 'result-table';
+@use 'presseberichte';
+@use 'verbandstag';
+@use 'vereine';
+@use 'contact-list';
+@use 'contact-view';
+@use 'read-more';

slt/css/components/_presseberichte.scss

@@ -0,0 +1,17 @@
+@use '../abstract' as abstract;
+
+table.pressespiegel {
+    @include abstract.for-narrow-screen {
+        tr {
+            &:first-child {
+                display: none;
+            }
+
+            > td {
+                &:last-child::before {
+                    content: 'Rubrik: ';
+                }
+            }
+        }
+    }
+}

slt/css/components/_read-more.scss

@@ -0,0 +1,9 @@
+.readmore > .btn {
+    color: var(--color-menu, #000);
+    background-color: var(--color-menu-background, #eee);
+
+    &:hover {
+        color: var(--color-menu-active, #000);
+        background-color: var(--color-menu-background-active, #ccc);
+    }
+}

slt/css/components/_result-table.scss

@@ -0,0 +1,15 @@
+@use '../abstract' as abstract;
+
+table.result {
+    max-width: 800px;
+    margin: 0 auto;
+}
+
+div.result-links a {
+    display: block;
+
+    @include abstract.for-narrow-screen {
+        padding: 7px 0;
+        margin: 15px 0;
+    }
+}

slt/css/components/_slideshow.scss

@@ -0,0 +1,14 @@
+@use '../abstract' as abstract;
+
+#slideshow {
+    flex: 1;
+    display: none;
+
+    @include abstract.for-desktop {
+        display: inline-block;
+
+        > div {
+            margin: 20px;
+        }
+    }
+}

slt/css/components/_verbandstag.scss

@@ -0,0 +1,11 @@
+@use '../abstract' as abstract;
+
+table.verbandstag {
+    @include abstract.for-narrow-screen {
+        tr {
+            &:first-child {
+                display: none;
+            }
+        }
+    }
+}

slt/css/components/_vereine.scss

@@ -0,0 +1,39 @@
+@use '../abstract' as abstract;
+
+.slt-vereine {
+    @include abstract.for-narrow-screen {
+        display: block;
+        line-height: 150%;
+
+        > tbody,
+        tr,
+        td {
+            display: block;
+            width: 100%;
+        }
+
+        tr {
+            padding: 7px 0;
+
+            &:first-child {
+                display: none;
+            }
+
+            > td:first-child {
+                display: none;
+            }
+
+            > td:nth-child(2) {
+                font-weight: bold;
+            }
+
+            > td:nth-child(4)::before {
+                content: 'Ansprechpartner: ';
+            }
+        }
+
+        p {
+            margin: 0;
+        }
+    }
+}

slt/css/core/_buttons.scss

@@ -0,0 +1,22 @@
+.btn-primary {
+    color: white;
+    background-color: var(--color-main-link);
+    border: none;
+
+    &:hover {
+        color: white;
+        background-color: var(--color-main-link);
+    }
+}
+
+.pagination {
+    a {
+        color: var(--color-main-link);
+    }
+
+    .page-item.active .page-link {
+        color: var(--color-fg-top);
+        background-color: var(--color-bg-top);
+        border: none;
+    }
+}

slt/css/core/_core.scss

@@ -0,0 +1,65 @@
+@use '../abstract' as abstract;
+
+body {
+    margin: 0;
+    min-height: 100.1vh;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    background-color: var(--color-side-background, #fff);
+
+    /*    padding: 0px 20px 10px 20px; */
+    padding: 0;
+    font-size: 12pt;
+    font-family: Arial, Verdana, Helvetica, Geneva, sans-serif;
+    line-height: 175%;
+
+    @include abstract.for-desktop {
+        overflow: scroll;
+        padding: 0;
+    }
+}
+
+a {
+    text-decoration: none;
+}
+
+a,
+a:hover,
+a:active,
+a:visited {
+    color: var(--color-main-link, #000);
+}
+
+p {
+    text-align: justify;
+    hyphens: auto;
+}
+
+h3 {
+    font-size: 133% /*16pt*/;
+}
+
+h2 {
+    font-size: 158% /*19pt*/;
+}
+
+h1 {
+    font-size: 183% /*22pt*/;
+}
+
+h1,
+h2,
+h3,
+h4 {
+    line-height: 150%;
+
+    /* stylelint-disable no-descending-specificity -- Keep the block of a elements together */
+    a,
+    a:hover,
+    a:active,
+    a:visited {
+        color: var(--color-header-link, #000);
+    }
+    /* stylelint-enable no-descending-specificity */
+}

slt/css/core/_default-classes.scss

@@ -0,0 +1,70 @@
+.pull-right > img,
+.pull-left > img,
+.pull-right > a > img,
+.pull-left > a > img {
+    margin: 10px;
+}
+
+.right {
+    float: right;
+}
+
+.left {
+    float: left;
+}
+
+.right,
+.left {
+    margin: 10px;
+}
+
+.centered {
+    text-align: center;
+}
+
+.ragged-left {
+    text-align: left;
+}
+
+li.row-fluid {
+    display: block;
+}
+
+.page-header {
+    padding-bottom: 0;
+}
+
+// .row-striped .row-fluid:nth-child(n),
+// .list-striped li:nth-child(n),
+// .table-striped tbody > tr:nth-child(n) > td {
+//     background-color: initial;
+// }
+
+.table-striped {
+    > thead > tr {
+        color: var(--color-effect-header, #000);
+        background-color: var(--color-effect-background-header, #aaa);
+    }
+}
+
+.list-striped li:nth-child(odd),
+.row-striped .row-fluid:nth-child(odd),
+.table-striped > tbody > tr:nth-child(odd) {
+    color: var(--color-effect, #000);
+    background-color: var(--color-effect-background, #ccc);
+}
+
+.list-striped li:hover,
+.row-striped .row-fluid:hover,
+.table-striped > tbody > tr:hover {
+    color: var(--color-effect-header, #000);
+    background-color: var(--color-effect-background-header, #aaa);
+}
+
+.table-hover > tbody > tr:hover > * {
+    color: unset;
+}
+
+.well {
+    background-color: inherit;
+}

slt/css/core/_index.scss

@@ -0,0 +1,3 @@
+@use 'core';
+@use 'default-classes';
+@use 'buttons';

slt/css/desktop-narrow.css

@@ -1,3 +0,0 @@
-#topmenu .nav > li > a {
-  font-size: large;
-}

slt/css/desktop.css

@@ -1,335 +0,0 @@
-
-/*
-Structure of page
-*/
-
-#topmenu-div {
-}
-
-#topmenu
-{
-  position: fixed;
-  display: flex;
-}
-
-#topmenu > .topmenu-sep
-{
-	display: inline-block;
-	flex: 1 1 auto;
-}
-
-#topmenu .nav 
-{
-  flex: 0 0 auto;
-  display: flex;
-  flex-flow: row nowrap;
-  justify-content: space-between;
-  position: relative;
-  align-items: center;
-}
-
-#topmenu .nav > li 
-{
-  display: inline-block;
-}
-
-#topmenu .nav > li > a 
-{
-  position: relative;
-}
-
-#topmenu .nav > li > .nav-child {
-  position: absolute;
-  display: none;
-}
-
-#topmenu .nav > li:hover > .nav-child {
-  display: block;
-}
-
-#topmenu .nav > li > .nav-child > li > a {
-  display: block;
-}
-
-#page-div
-{
-	display: flex;
-	flex-flow: row;
-	width: 100%;
-	justify-content: space-around;
-}
-
-#page 
-{
-	flex: 0 0 auto;
-}
-
-#page-bg
-{
-	display: block;
-	position: fixed;
-}
-
-#header {
-    justify-content: space-around;
-}
-
-#slideshow {
-  display: inline-block;
-}
-
-#content {
-  display: flex;
-}
-
-#left_menu {
-  flex: 0 1 20%;
-  display: block;
-}
-
-.nav-child > li > a {
-	display: block;
-}
-
-#main_column {
-  flex: 1 1 60%;
-  display: flex;
-  flex-flow: column nowrap;
-}
-
-#main_content{
-  flex: 1 1 auto;
-}
-
-#footline {
-  flex: none;
-}
-
-#right_column {
-  flex: 1 1 15%;
-  display: block;
-}
-
-#mobile_menu,
-#mobile_menu.visible,
-#mobile_menu_switch
-{
-  display: none;
-}
-
-a.facebook img
-{
-	display: inline;
-}
-a.facebook > span.image-title
-{
-	display: none;
-}
-
-
-
-/*
-Form of page (paddings, margins, ...)
-*/
-
-body
-{
-  overflow: scroll;
-  padding: 0px;	
-}
-
-#topmenu-div {
-  width: 100vw;
-  height: 40px;
-}
-
-#topmenu {
-  width: 100vw;
-  z-index: 5000;
-}
-
-#topmenu .nav {
-  padding: 0px 10px;
-  margin: 0px;
-  height: 40px;
-  width: 980px;
-}
-
-#topmenu .nav > li > a {
-  font-size: large;
-  padding: 10px;
-  z-index: 3001;
-}
-
-#topmenu .nav > li > .nav-child {
-  z-index: 3000;
-  margin: 0px 20px 10px 0px;
-  border: none;
-  padding: 0px;
-}
-
-#topmenu .nav > li:hover > .nav-child {
-  box-shadow: 3px 5px 5px 2px rgba(0,0,0,0.5);
-}
-
-#topmenu .nav > li > .nav-child > li
-{
-	padding: 0px 5px;
-}
-
-#topmenu .nav > li > .nav-child > li > a {
-  padding: 10px 5px 10px 4px;
-  border-left-color: transparent;
-  border-left-style: solid;
-  border-left-width: 6px;
-}
-
-#page-div, #page
-{
-	min-height: calc( 100vh - 40px );
-}
-
-#page {
-  width: 1000px;
-}
-
-#page-bg
-{
-	width: 1000px;
-	height: calc( 100% - 40px );
-	bottom: 0px;
-	z-index: -9;
-	left: calc( (100% - 1000px) / 2 );
-}
-
-#left_side-image, #right_side-image
-{
-	position: fixed;
-	height: 100vh;
-	width: calc( (100% - 980px) / 2 );
-	z-index: -10;
-}
-
-#left_side-image
-{
-	left: 0px;
-}
-
-#right_side-image
-{
-	right: 0px;
-}
-
-#left_menu
-{
-	margin: 15px 0px 15px 5px;
-}
-
-#left_menu > ul.menu
-{
-	padding: 10px;
-}
-
-#left_menu > ul.menu:hover
-{
-	box-shadow: 3px 5px 5px 2px rgba(0,0,0,0.5);
-}
-
-#left_menu > ul.menu li > a
-{
-	padding: 2px 5px 2px 5px;
-}
-
-#right_column
-{
-	margin: 15px 5px 15px 0px;
-}
-
-
-
-
-/*
-Additional content
-*/
-
-#topmenu a {
-  color: inherit;
-}
-
-#topmenu {
-  font-weight: bold;
-  text-align: center;
-}
-
-#topmenu .nav > li {
-  text-align: left;
-}
-
-#topmenu .nav > li > a {
-  font-size: large;
-}
-
-#topmenu li > a,
-#topmenu li:hover > a,
-#topmenu li:focus > a,
-#topmenu li.active > a
-{
-	background-color: inherit;
-	color: inherit;
-}
-
-#topmenu .nav-child > li:hover > a:hover,
-#topmenu .nav-child > li:focus > a:hover,
-#topmenu .nav-child > li:hover > a:focus
-{
-	text-decoration: none;
-}
-
-#left_side-image, #right_side-image
-{
-	background-repeat: no-repeat;
-	background-size: cover;
-	background-position: center center;
-	opacity: 0.5;
-}
-
-#page
-{
-	background-color: inherit;
-}
-
-
-p.readmore
-{
-	text-align: right;
-	font-size: smaller;
-}
-
-.btn
-{
-	border-radius: 0pt;
-}
-
-.readmore > .btn 
-{
-	font-size: inherit;
-	background-image: none;
-	border: none;
-	text-shadow: unset;
-}
-
-p.readmore > .btn > span[class^="icon-"]
-{
-	display: none;
-}
-
-
-/*
- * Debug
- */
-
-/*#right_column,#left_menu,#main_content,#footline {
-    background-color: rgba(0,0,0,0.1);
-}*/
-
-

slt/css/layout/_alternating-table.scss

@@ -0,0 +1,19 @@
+.alternating {
+    tr:nth-child(even) {
+        color: var(--color-effect, #000);
+        background-color: var(--color-effect-background, #ccc);
+
+        a {
+            color: inherit;
+        }
+    }
+
+    tr:nth-child(1) {
+        color: var(--color-effect-header, #000);
+        background-color: var(--color-effect-background-header, #aaa);
+
+        a {
+            color: inherit;
+        }
+    }
+}

slt/css/layout/_blog.scss

@@ -0,0 +1,35 @@
+@use '../abstract' as abstract;
+
+.columns-2,
+.columns-3,
+.columns-4,
+.columns-5,
+.columns-6 {
+    @include abstract.for-desktop {
+        display: grid;
+
+        > div {
+            margin: 5px 5px 15px;
+        }
+    }
+}
+
+.columns-2 {
+    grid-template-columns: 1fr 1fr;
+}
+
+.columns-3 {
+    grid-template-columns: 1fr 1fr 1fr;
+}
+
+.columns-4 {
+    grid-template-columns: 1fr 1fr 1fr 1fr;
+}
+
+.columns-5 {
+    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
+}
+
+.columns-6 {
+    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
+}

slt/css/layout/_footer.scss

@@ -0,0 +1,63 @@
+@use '../abstract' as abstract;
+
+#impressum {
+    flex: 0 0 auto;
+    text-align: right;
+    margin-top: 30px;
+    padding: 5px;
+
+    .nav {
+        margin-bottom: 0;
+        background-color: inherit;
+        display: inline-block;
+
+        > li {
+            display: inline-block;
+        }
+    }
+
+    a {
+        text-decoration: underline;
+        padding: 10px;
+    }
+}
+
+#footer {
+    flex: 0 0 auto;
+    background-color: black;
+
+    // color: white;
+    text-align: center;
+    padding: 5px;
+    font-size: x-small;
+    line-height: 100%;
+    color: gray;
+
+    > .customimpressum {
+        float: left;
+    }
+
+    > .customdatenschutz {
+        float: right;
+    }
+
+    a {
+        color: inherit;
+        text-decoration: underline;
+
+        &:hover,
+        &:focus {
+            color: black;
+            background-color: white;
+            text-decoration: underline;
+        }
+    }
+}
+
+#footline {
+    margin-top: 10px;
+
+    @include abstract.for-desktop {
+        flex: none;
+    }
+}

slt/css/layout/_index.scss

@@ -0,0 +1,12 @@
+@use 'page-layout';
+@use 'topmenu';
+@use 'leftmenu';
+@use 'footer';
+@use 'mobile-menu';
+@use 'menu';
+@use 'pageheader';
+@use 'side-images';
+@use 'main-content';
+@use 'blog';
+@use 'mobile-table';
+@use 'alternating-table';

slt/css/layout/_leftmenu.scss

@@ -0,0 +1,43 @@
+@use '../abstract' as abstract;
+
+#left-menu {
+    display: none;
+
+    @include abstract.for-desktop {
+        flex: 0 1 20%;
+        display: block;
+        margin: 15px 0 15px 5px;
+
+        > ul.mod-menu {
+            padding: 10px;
+
+            li > a {
+                padding: 2px 5px;
+            }
+        }
+    }
+
+    .nav {
+        display: block;
+
+        li > a {
+            display: block;
+        }
+    }
+
+    .nav > li,
+    .mod-menu__sub > li {
+        padding: 5px 0;
+        border-top-style: solid;
+        border-width: 1px;
+
+        &:first-child {
+            border-top-style: none;
+        }
+    }
+
+    // .nav > li:first-child,
+    // .mod-menu__sub > li:first-child {
+    // border-top-style: none;
+    // }
+}

slt/css/layout/_main-content.scss

@@ -0,0 +1,25 @@
+@use '../abstract' as abstract;
+
+#content {
+    flex: 1 0 auto;
+
+    @include abstract.for-desktop {
+        display: flex;
+    }
+}
+
+#main-column {
+    margin: 15px;
+
+    @include abstract.for-desktop {
+        flex: 1 1 60%;
+        display: flex;
+        flex-flow: column nowrap;
+    }
+}
+
+#main-content {
+    @include abstract.for-desktop {
+        flex: 1 1 auto;
+    }
+}

slt/css/layout/_menu.scss

@@ -0,0 +1,55 @@
+@use '../abstract' as abstract;
+
+.nav,
+.mod-menu__sub {
+    padding: 0;
+
+    > li {
+        display: block;
+    }
+}
+
+.nav {
+    font-size: inherit;
+    color: var(--color-menu, #000);
+    background-color: var(--color-menu-background, #eee);
+
+    a {
+        color: inherit;
+    }
+
+    li.current > a {
+        color: var(--color-menu-active, #000);
+        background-color: var(--color-menu-background-active, #ccc);
+    }
+
+    li > a:hover,
+    li > a:focus {
+        color: var(--color-menu-active, #000);
+        background-color: var(--color-menu-background-active, #ccc);
+    }
+
+    .mod-menu__sub {
+        font-size: small;
+        padding-left: 10px;
+        margin-left: 10px;
+
+        /* border-left: solid gray 1px; */
+
+        /* TODO */
+
+        > li > a {
+            @include abstract.for-desktop {
+                display: block;
+            }
+        }
+    }
+}
+
+ul.nav > li > a:hover,
+ul.mod-menu__sub > li > a:hover {
+    /* background-color: inherit; */
+
+    /* FIXME */
+    text-decoration: none;
+}

slt/css/layout/_mobile-menu.scss

@@ -0,0 +1,85 @@
+@use '../abstract' as abstract;
+
+#mobile-menu,
+#content {
+    margin: 0 15px;
+}
+
+#mobile-menu {
+    margin-top: 10px;
+    display: none;
+
+    &.visible {
+        display: block;
+
+        @include abstract.for-desktop {
+            display: none;
+        }
+    }
+
+    a {
+        font-size: initial;
+        margin-right: 0;
+        padding-right: 0;
+    }
+
+    li {
+        > a {
+            margin: 5px 0;
+            padding: 10px;
+            display: block;
+            color: var(--color-menu, #000);
+            background-color: var(--color-menu-background, #eee);
+        }
+
+        &.current > a {
+            color: var(--color-menu-active, #000);
+            background-color: var(--color-menu-background-active, #ccc);
+        }
+
+        margin-left: 5px;
+        margin-right: 5px;
+
+        ul {
+            border: none;
+        }
+
+        > ul.nav {
+            margin-left: -5px;
+            margin-right: -5px;
+        }
+    }
+
+    .nav {
+        padding: 0;
+        border: none;
+        margin-left: 0;
+    }
+
+    .mod-menu,
+    .mod-menu__sub {
+        display: flex;
+        flex-direction: column;
+    }
+
+    > ul.mod-menu {
+        background-color: initial;
+        color: initial;
+        margin-bottom: initial;
+    }
+}
+
+#mobile-menu-switch {
+    flex: 0 0 auto;
+    text-align: right;
+
+    @include abstract.for-desktop {
+        display: none;
+    }
+}
+
+#btn-mobile-menu {
+    padding: 10px 30px 0 0;
+    width: 40px;
+    box-sizing: initial;
+}

slt/css/layout/_mobile-table.scss

@@ -0,0 +1,39 @@
+@use '../abstract' as abstract;
+
+table:not(.no-responsive-table) {
+    width: 100%;
+
+    @include abstract.for-narrow-screen {
+        display: block;
+
+        > tbody {
+            display: block;
+        }
+
+        tr {
+            display: block;
+            padding: 7px 0;
+            border-style: none;
+            border-bottom-style: solid;
+            border-width: 1px;
+            border-color: var(--color-mobile-table-border, #000);
+
+            &:nth-child(1) {
+                border-top-style: solid;
+            }
+
+            > td {
+                display: block;
+                text-align: left !important;
+            }
+        }
+    }
+}
+
+table:not(.alternating) {
+    @include abstract.for-narrow-screen {
+        tr:nth-child(2n + 1) {
+            background-color: #bbb;
+        }
+    }
+}

slt/css/layout/_page-layout.scss

@@ -0,0 +1,55 @@
+@use '../abstract' as abstract;
+
+#page-div {
+    width: 100%;
+
+    @include abstract.for-desktop {
+        display: flex;
+        flex-flow: row;
+        margin-top: 25px;
+
+        // width: 100%;
+        justify-content: space-around;
+    }
+}
+
+#page {
+    /* box-shadow: 30vw 0px 5vw -10vw green inset; */
+    flex: 1 0 auto;
+    display: flex;
+    flex-direction: column;
+    width: 100%;
+    min-height: 100vh;
+
+    @include abstract.for-desktop {
+        flex: 0 0 auto;
+        width: 1000px;
+        background-color: inherit;
+    }
+}
+
+#page,
+#page-div {
+    @include abstract.for-desktop {
+        min-height: calc(100vh - 40px);
+    }
+}
+
+#page-bg {
+    display: none;
+    background-image: linear-gradient(
+        to bottom,
+        var(--color-page-bg-top, #eee),
+        var(--color-page-bg-bottom, #fff)
+    );
+
+    @include abstract.for-desktop {
+        display: block;
+        position: fixed;
+        width: 1000px;
+        height: calc(100% - 40px);
+        bottom: 0;
+        z-index: -9;
+        left: calc((100% - 1000px) / 2);
+    }
+}

slt/css/layout/_pageheader.scss

@@ -0,0 +1,16 @@
+@use '../abstract' as abstract;
+
+#header {
+    flex: 0 0 auto;
+    display: flex;
+    flex-flow: row nowrap;
+    justify-content: space-between;
+
+    @include abstract.for-desktop {
+        justify-content: space-around;
+    }
+
+    > div {
+        align-items: center;
+    }
+}

slt/css/layout/_side-images.scss

@@ -0,0 +1,25 @@
+@use '../abstract' as abstract;
+
+@include abstract.for-desktop {
+    #left-side-image,
+    #right-side-image {
+        position: fixed;
+        height: 100vh;
+        width: calc((100% - 980px) / 2);
+        z-index: -10;
+        background-repeat: no-repeat;
+        background-size: cover;
+        background-position: center center;
+        opacity: 0.5;
+    }
+
+    #left-side-image {
+        left: 0;
+        background-image: var(--image-left-side, none);
+    }
+
+    #right-side-image {
+        right: 0;
+        background-image: var(--image-right-side, none);
+    }
+}

slt/css/layout/_topmenu.scss

@@ -0,0 +1,220 @@
+@use '../abstract/' as abstract;
+
+#topmenu-div {
+    @include abstract.for-desktop {
+        position: sticky;
+        top: 0;
+        width: 100%;
+        z-index: 1;
+    }
+
+    color: var(--color-fg-top, #fff);
+    background-color: var(--color-bg-top, #000);
+}
+
+#topmenu {
+    display: none;
+    font-weight: bold;
+    text-align: center;
+
+    @include abstract.for-desktop {
+        display: flex;
+        width: 100%;
+        font-weight: bold;
+        text-align: center;
+
+        a {
+            color: inherit;
+        }
+    }
+
+    a {
+        color: inherit;
+    }
+
+    > .topmenu-sep {
+        display: inline-block;
+        flex: 1 1 auto;
+    }
+
+    .nav > li,
+    .mod-menu__sub > li {
+        padding: 0;
+        border-style: none;
+        height: 100%;
+    }
+
+    .nav {
+        flex: 0 0 auto;
+        display: flex;
+        flex-flow: row nowrap;
+        justify-content: space-between;
+        align-items: center;
+        color: var(--color-fg-top, #fff);
+        background-color: var(--color-bg-top, #000);
+
+        @include abstract.for-desktop {
+            padding: 0 10px;
+            margin: 0;
+            width: 980px;
+        }
+
+        > li {
+            display: inline-block;
+            text-align: left;
+
+            @include abstract.for-desktop {
+                text-align: left;
+            }
+
+            > a {
+                font-size: large;
+                display: block;
+                height: 100%;
+
+                @include abstract.for-desktop {
+                    font-size: large;
+                    padding: 10px;
+                    z-index: 3001;
+                }
+            }
+
+            & > a,
+            &:hover > a {
+                background-color: inherit;
+            }
+
+            &:hover,
+            &:focus {
+                color: var(--color-fg-top-hover, #000);
+                background-color: var(--color-bg-top-hover, #aaa);
+            }
+
+            &.active {
+                color: var(--color-fg-top-dark, #000);
+                background-color: var(--color-bg-top-dark, #aaa);
+            }
+
+            > .mod-menu__sub {
+                position: absolute;
+                display: none;
+
+                @include abstract.for-desktop {
+                    margin: 0 20px 10px 0;
+                    border: none;
+                    padding: 0;
+                }
+
+                color: var(--color-fg-top-sub);
+                background-color: var(--color-bg-top-sub);
+                box-shadow: 3px 5px 5px 2px rgb(0 0 0 / 50%);
+
+                > li {
+                    @include abstract.for-desktop {
+                        padding: 0 5px;
+                    }
+
+                    > a {
+                        display: block;
+
+                        @include abstract.for-desktop {
+                            padding: 10px 5px 10px 4px;
+                            border-left: 6px solid transparent;
+                        }
+                    }
+
+                    &:hover,
+                    &:focus {
+                        color: var(--color-fg-top-sub-hover, #000);
+                        background-color: var(--color-bg-top-sub-hover, #aaa);
+                    }
+
+                    &:hover > a {
+                        text-decoration: none;
+                    }
+
+                    &.current {
+                        color: var(--color-fg-top-dark, #000);
+                        background-color: var(--color-bg-top-dark, #aaa);
+                    }
+                }
+            }
+
+            &.active > .mod-menu__sub > li:hover {
+                color: var(--color-fg-top-dark);
+                background-color: var(--color-bg-top-dark);
+            }
+
+            &:hover > .mod-menu__sub {
+                display: block;
+            }
+        }
+    }
+
+    @include abstract.for-desktop {
+        li > a,
+        li:hover > a,
+        li:focus > a,
+        li:active > a {
+            background-color: inherit;
+            color: inherit;
+        }
+
+        .mod-menu__sub > li:hover > a:hover,
+        .mod-menu__sub > li:focus > a:hover,
+        .mod-menu__sub > li:hover > a:focus {
+            text-decoration: none;
+        }
+    }
+
+    // Special colors for topics
+    > ul.nav .mod-menu__sub a.lehre {
+        border-left-color: abstract.$color-lehre;
+    }
+
+    > ul.nav .mod-menu__sub a.breitensport {
+        border-left-color: abstract.$color-breitensport;
+    }
+
+    > ul.nav .mod-menu__sub a.jugend {
+        border-left-color: abstract.$color-jugend;
+    }
+
+    > ul.nav .mod-menu__sub a.jmd {
+        border-left-color: abstract.$color-jmd;
+    }
+
+    > ul.nav .mod-menu__sub a.fachverbaende {
+        border-left-color: abstract.$color-fachverbaende;
+    }
+
+    > ul.nav .mod-menu__sub a.sport {
+        border-left-color: abstract.$color-sport;
+    }
+}
+
+a.facebook {
+    img {
+        display: none;
+        height: 25px;
+
+        @include abstract.for-desktop {
+            display: inline;
+        }
+    }
+
+    > span.image-title {
+        @include abstract.for-desktop {
+            display: none;
+        }
+    }
+}
+
+:root {
+    --color-fg-top-hover: #000;
+    --color-bg-top-hover: #ccc;
+    --color-fg-top-sub: #000;
+    --color-bg-top-sub: #eee;
+    --color-fg-top-sub-hover: #000;
+    --color-bg-top-sub-hover: #ccc;
+}

slt/css/main.css

@@ -1,7 +0,0 @@
-
-@import "mobile.css";
-
-@import "desktop.css" ( min-width: 1000px );
-@import "desktop-narrow.css" ( min-width: 1000px) and ( max-width: 1200px );
-
-@import "visual.css";

slt/css/mobile.css

@@ -1,274 +0,0 @@
-body {
-    margin: 0px;
-    min-height: 100.1vh;
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-/*    padding: 0px 20px 10px 20px;*/
-	padding: 0px;
-}
-
-#page-div
-{
-	width: 100%;
-}
-
-#page {
-    /*box-shadow: 30vw 0px 5vw -10vw green inset;*/
-    flex: 1 0 auto;
-    display: flex;
-    flex-direction: column;
-    width: 100%;
-    min-height: 100vh;
-}
-
-#page-bg
-{
-	display: none;
-}
-
-/*
- * Menu configuration
- */
-
-.nav,
-.nav-child
-{
-    padding: 0px;
-}
-
-.nav > li,
-.nav-child > li
-{
-    display: block;
-}
-
-.nav
-{
-	font-size: inherit;
-}
-
-.nav-child
-{
-	font-size: small;
-}
-
-.nav > li > .nav-child, .nav-child > li > .nav-child {
-    padding-left: 5px;
-    margin-left: 5px;
-    /* border-left: solid gray 1px;*/ /*TODO*/
-}
-
-/*
- * Topmenu positioning and styling
- */
-
-#topmenu {
-	display: none;
-}
-
-/*
- * Header line positioning
- */
-
-#header {
-    flex: 0 0 auto;
-    display: flex;
-    flex-flow: row nowrap;
-    justify-content: space-between;
-}
-
-#header > div {
-    margin: 20px;
-    align-items: center;
-}
-
-#slideshow {
-    flex: 1;
-}
-
-#slideshow {
-	display: none;
-}
-
-
-/*
- * Content positioning
- */
-
-#content {
-    flex: 1 0 auto;
-}
-
-#left_menu {
-	display: none;
-}
-
-#main_column {
-	margin: 15px;
-}
-
-#right_column {
-	display: none;
-}
-
-#footline {
-	margin-top: 10px;
-}
-
-/*
- * Footer positioning
- */
-
-#impressum
-{
-	flex: 0 0 auto;
-	text-align: right;
-    margin-top: 30px;
-	padding: 5px;
-}
-
-#impressum .nav 
-{
-	margin-bottom: 0px;
-	background-color: inherit;
-	display: inline-block;
-}
-
-#impressum .nav > li
-{
-	display: inline-block;
-}
-
-#impressum a
-{
-	text-decoration: underline;
-	padding: 10px;
-}
-
-#footer {
-    flex: 0 0 auto;
-  	background-color: black;
-    color: white;
-    text-align: center;
-    padding: 5px;
-}
-
-#footer > .customimpressum {
-	float: left;
-}
-
-#footer > .customdatenschutz {
-	float: right;
-}
-
-#footer a
-{
-	color: inherit;
-	text-decoration: underline;
-}
-
-#footer a:hover,
-#footer a:focus
-{
-	color: black;
-	background-color: white;
-	text-decoration: underline;
-}
-
-/*
- * Mobile menu positioning
- */
-
-#mobile_menu, #content {
-	margin: 0px 15px 0px 15px;
-}
-
-#mobile_menu {
-	margin-top: 10px;
-	display: none;
-}
-
-#mobile_menu.visible
-{
-	display: block;
-}
-
-#mobile_menu li > a {
-	margin: 5px 0px 5px 0px;
-	padding: 2px 5px;
-	display: block;
-    flex: 0;
-}
-
-#mobile_menu .nav {
-	padding: 0px;
-	border: none;
-	margin-left: 0px;
-}
-
-#mobile_menu li {
-	margin-left: 5px;
-	margin-right: 5px;
-}
-
-#mobile_menu .nav-child > li {
-    margin: 0px;
-}
-
-#mobile_menu li > ul.nav {
-	margin-left: -5px;
-	margin-right: -5px;
-}
-
-#mobile_menu li ul {
-    border: none;
-}
-
-
-#mobile_menu a {
-    font-size: initial;
-    margin-right: 0px;
-    padding-right: 0px;
-}
-
-
-#mobile_menu > ul.menu {
-	background-color: initial;
-	color: initial;
-	margin-bottom: initial;
-}
-
-#mobile_menu_switch
-{
-	flex: 0 0 auto;
-	text-align: right;
-}
-
-#btn_mobile_menu 
-{
-	padding: 10px 30px 0px 0px;
-	width: 40px;
-	box-sizing: initial;
-}
-
-a.facebook img
-{
-	display: none;
-}
-
-
-.article-info
-{
-	font-size: smaller;
-}
-
-/*
- * Debug
- */
-
-/*#right_column,#left_menu,#main_content,#footline {
-    background-color: rgba(0,0,0,0.1);
-}*/
-
-

slt/css/style.scss

@@ -0,0 +1,12 @@
+@use 'abstract';
+@use 'core';
+@use 'layout';
+@use 'components';
+
+/*
+ * Debug
+ */
+
+/* #right_column,#left_menu,#main_content,#footline {
+    background-color: rgba(0,0,0,0.1);
+} */

slt/css/visual.css

@@ -1,154 +0,0 @@
-
-body {
-	font-size: 12pt;
-	font-family: Arial, Verdana, Helvetica, Geneva, sans-serif;
-	line-height: 175%;
-}
-
-a {
-  text-decoration: none;
-}
-
-p {
-  text-align: justify;
-}
-
-h3
-{
-	font-size: 133% /*16pt*/;
-}
-
-h2
-{
-	font-size: 158% /*19pt*/;
-}
-
-h1
-{
-	font-size: 183% /*22pt*/;
-}
-
-h1,h2,h3,h4
-{
-	line-height: 150%;
-}
-
-.pull-right > img,
-.pull-left > img,
-.pull-right > a > img,
-.pull-left > a > img
-{
-	margin: 10px;
-}
-
-.centered {
-  text-align: center;
-}
-
-.ragged-left {
-  text-align: left;
-}
-
-/*h2 > a {
-	color: black;
-}*/
-
-li.row-fluid {
-	display: block;
-}
-
-.page-header
-{
-	padding-bottom: 0px;
-}
-
-
-ul.nav > li > a:hover, 
-ul.nav-child > li > a:hover
-{
-	/* background-color: inherit;*/ /* FIXME */
-	text-decoration: none;
-}
-
-.nav a
-{
-	color: inherit;
-}
-
-#topmenu a {
-  color: inherit;
-}
-
-#topmenu {
-  font-weight: bold;
-  text-align: center;
-}
-
-#topmenu > .nav > li {
-  text-align: left;
-}
-
-#topmenu .nav > li > a {
-  font-size: large;
-}
-
-#topmenu .nav > li > a,
-#topmenu .nav > li:hover > a {
-	background-color: inherit;
-} 
-
-#topmenu > .nav > li > .nav-child > li:hover > a:hover {
-	text-decoration: none;
-}
-
-#topmenu .nav > li,
-#topmenu .nav-child > li
-{
-	padding: 0px;
-	border-style: none;
-}
-
-#left_side, #right_side
-{
-	background-repeat: no-repeat;
-	background-size: cover;
-}
-
-#left_menu .nav > li,
-#left_menu .nav-child > li
-{
-    padding: 5px 0px;
-    border-top-style: solid;
-    border-width: 1px;
-}
-
-#left_menu .nav > li:first-child,
-#left_menu .nav-child > li:first-child
-{
-	border-top-style: none;
-}
-
-.row-striped .row-fluid:nth-child(n),
-.list-striped li:nth-child(n),
-.table-striped tbody > tr:nth-child(n) > td
-{
-	background-color: inherit;
-}
-
-.well
-{
-	background-color: inherit;
-}
-
-#footer
-{
-	font-size: x-small;
-	line-height: 100%;
-	color: gray;
-}
-
-/*
-<?php 
-print_r($params);
-?>
-*/

slt/html/com_contact/category/default_items.php

@@ -1,131 +0,0 @@
-<?php
-/**
- * @package     Joomla.Site
- * @subpackage  com_contact
- *
- * @copyright   Copyright (C) 2005 - 2017 Open Source Matters, Inc. All rights reserved.
- * @license     GNU General Public License version 2 or later; see LICENSE.txt
- */
-
-defined('_JEXEC') or die;
-
-JHtml::_('behavior.core');
-
-$listOrder = $this->escape($this->state->get('list.ordering'));
-$listDirn  = $this->escape($this->state->get('list.direction'));
-?>
-<?php if (empty($this->items)) : ?>
-	<p> <?php echo JText::_('COM_CONTACT_NO_CONTACTS'); ?>	 </p>
-<?php else : ?>
-
-	<form action="<?php echo htmlspecialchars(JUri::getInstance()->toString()); ?>" method="post" name="adminForm" id="adminForm">
-	<?php if ($this->params->get('filter_field') || $this->params->get('show_pagination_limit')) : ?>
-	<fieldset class="filters btn-toolbar">
-		<?php if ($this->params->get('filter_field')) : ?>
-			<div class="btn-group">
-				<label class="filter-search-lbl element-invisible" for="filter-search"><span class="label label-warning"><?php echo JText::_('JUNPUBLISHED'); ?></span><?php echo JText::_('COM_CONTACT_FILTER_LABEL') . '&#160;'; ?></label>
-				<input type="text" name="filter-search" id="filter-search" value="<?php echo $this->escape($this->state->get('list.filter')); ?>" class="inputbox" onchange="document.adminForm.submit();" title="<?php echo JText::_('COM_CONTACT_FILTER_SEARCH_DESC'); ?>" placeholder="<?php echo JText::_('COM_CONTACT_FILTER_SEARCH_DESC'); ?>" />
-			</div>
-		<?php endif; ?>
-
-		<?php if ($this->params->get('show_pagination_limit')) : ?>
-			<div class="btn-group pull-right">
-				<label for="limit" class="element-invisible">
-					<?php echo JText::_('JGLOBAL_DISPLAY_NUM'); ?>
-				</label>
-				<?php echo $this->pagination->getLimitBox(); ?>
-			</div>
-		<?php endif; ?>
-	</fieldset>
-	<?php endif; ?>
-
-		<ul class="category row-striped">
-			<?php foreach ($this->items as $i => $item) : ?>
-
-				<?php if (in_array($item->access, $this->user->getAuthorisedViewLevels())) : ?>
-					<?php if ($this->items[$i]->published == 0) : ?>
-						<li class="row-fluid system-unpublished cat-list-row<?php echo $i % 2; ?>">
-					<?php else : ?>
-						<li class="row-fluid cat-list-row<?php echo $i % 2; ?>" >
-					<?php endif; ?>
-
-					<?php if ($this->params->get('show_image_heading')) : ?>
-						<?php $contact_width = 7; ?>
-						<div class="span2 col-md-2">
-							<?php if ($this->items[$i]->image) : ?>
-								<a href="<?php echo JRoute::_(ContactHelperRoute::getContactRoute($item->slug, $item->catid)); ?>">
-									<?php echo JHtml::_('image', $this->items[$i]->image, JText::_('COM_CONTACT_IMAGE_DETAILS'), array('class' => 'contact-thumbnail img-thumbnail')); ?></a>
-							<?php endif; ?>
-						</div>
-					<?php else : ?>
-						<?php $contact_width = 9; ?>
-					<?php endif; ?>
-
-					<div class="list-title span<?php echo $contact_width; ?> col-md-<?php echo $contact_width; ?>">
-						<a href="<?php echo JRoute::_(ContactHelperRoute::getContactRoute($item->slug, $item->catid)); ?>">
-							<?php echo $item->name; ?></a>
-						<?php if ($this->items[$i]->published == 0) : ?>
-							<span class="label label-warning"><?php echo JText::_('JUNPUBLISHED'); ?></span>
-						<?php endif; ?>
-						<?php echo $item->event->afterDisplayTitle; ?>
-
-						<?php echo $item->event->beforeDisplayContent; ?>
-
-						<?php if ($this->params->get('show_position_headings')) : ?>
-								<br /><?php echo $item->con_position; ?><br />
-						<?php endif; ?>
-						<?php if ($this->params->get('show_email_headings')) : ?>
-								<?php echo $item->email_to; ?><br />
-						<?php endif; ?>
-						<?php $location = array(); ?>
-						<?php if ($this->params->get('show_suburb_headings') && !empty($item->suburb)) : ?>
-							<?php $location[] = $item->suburb; ?>
-						<?php endif; ?>
-						<?php if ($this->params->get('show_state_headings') && !empty($item->state)) : ?>
-							<?php $location[] = $item->state; ?>
-						<?php endif; ?>
-						<?php if ($this->params->get('show_country_headings') && !empty($item->country)) : ?>
-							<?php $location[] = $item->country; ?>
-						<?php endif; ?>
-						<?php 
-							echo implode($location, ', ');
-							if(! empty($location))
-								echo "<br />"; 
-						?>
-
-						<?php if ($this->params->get('show_telephone_headings') && !empty($item->telephone)) : ?>
-							<?php echo JText::sprintf('COM_CONTACT_TELEPHONE_NUMBER', $item->telephone); ?><br />
-						<?php endif; ?>
-
-						<?php if ($this->params->get('show_mobile_headings') && !empty ($item->mobile)) : ?>
-								<?php echo JText::sprintf('COM_CONTACT_MOBILE_NUMBER', $item->mobile); ?><br />
-						<?php endif; ?>
-
-						<?php if ($this->params->get('show_fax_headings') && !empty($item->fax) ) : ?>
-							<?php echo JText::sprintf('COM_CONTACT_FAX_NUMBER', $item->fax); ?><br />
-						<?php endif; ?>
-					</div>
-
-					<?php echo $item->event->afterDisplayContent; ?>
-				</li>
-				<?php endif; ?>
-			<?php endforeach; ?>
-		</ul>
-
-		<?php if ($this->params->get('show_pagination', 2)) : ?>
-		<div class="pagination">
-			<?php if ($this->params->def('show_pagination_results', 1)) : ?>
-			<p class="counter">
-				<?php echo $this->pagination->getPagesCounter(); ?>
-			</p>
-			<?php endif; ?>
-			<?php echo $this->pagination->getPagesLinks(); ?>
-		</div>
-		<?php endif; ?>
-		<div>
-			<input type="hidden" name="filter_order" value="<?php echo $listOrder; ?>" />
-			<input type="hidden" name="filter_order_Dir" value="<?php echo $listDirn; ?>" />
-		</div>
-</form>
-<?php endif; ?>
-

slt/html/com_contact/contact/default_address.php

@@ -3,122 +3,150 @@
  * @package     Joomla.Site
  * @subpackage  com_contact
  *
- * @copyright   Copyright (C) 2005 - 2017 Open Source Matters, Inc. All rights reserved.
+ * @copyright   (C) 2006 Open Source Matters, Inc. <https://www.joomla.org>
  * @license     GNU General Public License version 2 or later; see LICENSE.txt
  */
 
 defined('_JEXEC') or die;
 
+use Joomla\CMS\Language\Text;
+use Joomla\CMS\String\PunycodeHelper;
+
+$icon = $this->params->get('contact_icons') == 0;
+
 /**
  * Marker_class: Class based on the selection of text, none, or icons
  * jicon-text, jicon-none, jicon-icon
  */
 ?>
-<dl class="contact-address dl-horizontal" itemprop="address" itemscope itemtype="https://schema.org/PostalAddress">
+<dl class="com-contact__address contact-address dl-horizontal" itemprop="address" itemscope itemtype="https://schema.org/PostalAddress">
 	<?php if (($this->params->get('address_check') > 0) &&
-		($this->contact->address || $this->contact->suburb  || $this->contact->state || $this->contact->country || $this->contact->postcode)) : ?>
+		($this->item->address || $this->item->suburb  || $this->item->state || $this->item->country || $this->item->postcode)) : ?>
 		<dt>
-			<span class="<?php echo $this->params->get('marker_class'); ?>">
-				<?php echo $this->params->get('marker_address'); ?>
-			</span>
+			<?php if ($icon && !$this->params->get('marker_address')) : ?>
+				<span class="icon-address" aria-hidden="true"></span><span class="visually-hidden"><?php echo Text::_('COM_CONTACT_ADDRESS'); ?></span>
+			<?php else : ?>
+				<span class="<?php echo $this->params->get('marker_class'); ?>">
+					<?php echo $this->params->get('marker_address'); ?>
+				</span>
+			<?php endif; ?>
 		</dt>
 
-		<?php if ($this->contact->address && $this->params->get('show_street_address')) : ?>
+		<?php if ($this->item->address && $this->params->get('show_street_address')) : ?>
 			<dd>
 				<span class="contact-street" itemprop="streetAddress">
-					<?php echo nl2br($this->contact->address); ?>
-					<br />
+					<?php echo nl2br($this->item->address, false); ?>
 				</span>
 			</dd>
 		<?php endif; ?>
 
-		<?php if ($this->contact->suburb && $this->params->get('show_suburb')) : ?>
-			<dd>
-			  <span class="contact-postcode" itemprop="postalCode">
-				<?php echo $this->contact->postcode; ?>
-			  </span>
-              <span class="contact-suburb" itemprop="addressLocality">
-					<?php echo $this->contact->suburb; ?>
-					<br />
-				</span>
-			</dd>
-		<?php endif; ?>
-		<?php if ($this->contact->state && $this->params->get('show_state')) : ?>
+        <?php if ($this->item->postcode && $this->params->get('show_postcode')) : ?>
+            <dd>
+                <span class="contact-postcode" itemprop="postalCode">
+                    <?php echo $this->item->postcode; ?>
+                </span>
+                <?php if ($this->item->suburb && $this->params->get('show_suburb')) : ?>
+                    <span class="contact-suburb" itemprop="addressLocality">
+                        <?php echo $this->item->suburb; ?>
+                    </span>
+                <?php endif; ?>
+            </dd>
+        <?php endif; ?>
+		<?php if ($this->item->state && $this->params->get('show_state')) : ?>
 			<dd>
 				<span class="contact-state" itemprop="addressRegion">
-					<?php echo $this->contact->state; ?>
-					<br />
+					<?php echo $this->item->state; ?>
 				</span>
 			</dd>
 		<?php endif; ?>
-		<?php if ($this->contact->country && $this->params->get('show_country')) : ?>
-		<dd>
-			<span class="contact-country" itemprop="addressCountry">
-				<?php echo $this->contact->country; ?>
-				<br />
-			</span>
-		</dd>
+		<?php if ($this->item->country && $this->params->get('show_country')) : ?>
+			<dd>
+				<span class="contact-country" itemprop="addressCountry">
+					<?php echo $this->item->country; ?>
+				</span>
+			</dd>
 		<?php endif; ?>
 	<?php endif; ?>
 
-<?php if ($this->contact->email_to && $this->params->get('show_email')) : ?>
+<?php if ($this->item->email_to && $this->params->get('show_email')) : ?>
 	<dt>
-		<span class="<?php echo $this->params->get('marker_class'); ?>" itemprop="email">
-			<?php echo nl2br($this->params->get('marker_email')); ?>
-		</span>
+		<?php if ($icon && !$this->params->get('marker_email')) : ?>
+			<span class="icon-envelope" aria-hidden="true"></span><span class="visually-hidden"><?php echo Text::_('COM_CONTACT_EMAIL_LABEL'); ?></span>
+		<?php else : ?>
+			<span class="<?php echo $this->params->get('marker_class'); ?>">
+				<?php echo $this->params->get('marker_email'); ?>
+			</span>
+		<?php endif; ?>
 	</dt>
 	<dd>
 		<span class="contact-emailto">
-			<?php echo $this->contact->email_to; ?>
+			<?php echo $this->item->email_to; ?>
 		</span>
 	</dd>
 <?php endif; ?>
 
-<?php if ($this->contact->telephone && $this->params->get('show_telephone')) : ?>
+<?php if ($this->item->telephone && $this->params->get('show_telephone')) : ?>
 	<dt>
-		<span class="<?php echo $this->params->get('marker_class'); ?>">
-			<?php echo $this->params->get('marker_telephone'); ?>
-		</span>
+		<?php if ($icon && !$this->params->get('marker_telephone')) : ?>
+				<span class="icon-phone" aria-hidden="true"></span><span class="visually-hidden"><?php echo Text::_('COM_CONTACT_TELEPHONE'); ?></span>
+		<?php else : ?>
+			<span class="<?php echo $this->params->get('marker_class'); ?>">
+				<?php echo $this->params->get('marker_telephone'); ?>
+			</span>
+		<?php endif; ?>
 	</dt>
 	<dd>
 		<span class="contact-telephone" itemprop="telephone">
-			<?php echo $this->contact->telephone; ?>
+			<?php echo $this->item->telephone; ?>
 		</span>
 	</dd>
 <?php endif; ?>
-<?php if ($this->contact->fax && $this->params->get('show_fax')) : ?>
+<?php if ($this->item->fax && $this->params->get('show_fax')) : ?>
 	<dt>
-		<span class="<?php echo $this->params->get('marker_class'); ?>">
-			<?php echo $this->params->get('marker_fax'); ?>
-		</span>
+		<?php if ($icon && !$this->params->get('marker_fax')) : ?>
+			<span class="icon-fax" aria-hidden="true"></span><span class="visually-hidden"><?php echo Text::_('COM_CONTACT_FAX'); ?></span>
+		<?php else : ?>
+			<span class="<?php echo $this->params->get('marker_class'); ?>">
+				<?php echo $this->params->get('marker_fax'); ?>
+			</span>
+		<?php endif; ?>
 	</dt>
 	<dd>
 		<span class="contact-fax" itemprop="faxNumber">
-		<?php echo $this->contact->fax; ?>
+		<?php echo $this->item->fax; ?>
 		</span>
 	</dd>
 <?php endif; ?>
-<?php if ($this->contact->mobile && $this->params->get('show_mobile')) : ?>
+<?php if ($this->item->mobile && $this->params->get('show_mobile')) : ?>
 	<dt>
-		<span class="<?php echo $this->params->get('marker_class'); ?>">
-			<?php echo $this->params->get('marker_mobile'); ?>
-		</span>
+		<?php if ($icon && !$this->params->get('marker_mobile')) : ?>
+			<span class="icon-mobile" aria-hidden="true"></span><span class="visually-hidden"><?php echo Text::_('COM_CONTACT_MOBILE'); ?></span>
+		<?php else : ?>
+			<span class="<?php echo $this->params->get('marker_class'); ?>">
+				<?php echo $this->params->get('marker_mobile'); ?>
+			</span>
+		<?php endif; ?>
 	</dt>
 	<dd>
 		<span class="contact-mobile" itemprop="telephone">
-			<?php echo $this->contact->mobile; ?>
+			<?php echo $this->item->mobile; ?>
 		</span>
 	</dd>
 <?php endif; ?>
-<?php if ($this->contact->webpage && $this->params->get('show_webpage')) : ?>
+<?php if ($this->item->webpage && $this->params->get('show_webpage')) : ?>
 	<dt>
-		<span class="<?php echo $this->params->get('marker_class'); ?>">
-		</span>
+		<?php if ($icon && !$this->params->get('marker_webpage')) : ?>
+			<span class="icon-home" aria-hidden="true"></span><span class="visually-hidden"><?php echo Text::_('COM_CONTACT_WEBPAGE'); ?></span>
+		<?php else : ?>
+			<span class="<?php echo $this->params->get('marker_class'); ?>">
+				<?php echo $this->params->get('marker_webpage'); ?>
+			</span>
+		<?php endif; ?>
 	</dt>
 	<dd>
 		<span class="contact-webpage">
-			<a href="<?php echo $this->contact->webpage; ?>" target="_blank" rel="noopener noreferrer" itemprop="url">
-			<?php echo JStringPunycode::urlToUTF8($this->contact->webpage); ?></a>
+			<a href="<?php echo $this->item->webpage; ?>" target="_blank" rel="noopener noreferrer" itemprop="url">
+			<?php echo PunycodeHelper::urlToUTF8($this->item->webpage); ?></a>
 		</span>
 	</dd>
 <?php endif; ?>