- Umstellung der Links auf referenzierte navTargets

- kleinere Design-/Layoutkorrekturen geändert: css/cwsvJudo-2018-content.css geändert: css/cwsvJudo-2018-galTable.css geändert: css/cwsvJudo-2018-mainNav.css geändert: css/cwsvJudo-2018-subNav.css geändert: md/verein.md geändert: pandocTemplate/cwsvJudo.html5.pandocTemplate geändert: phpLib/cwsvJudo/wkKalender.php neue Datei: temp/vertNavBarTest.html geändert: yaml/galerien.subNav.yaml geändert: yaml/index.subNav.yaml geändert: yaml/kontakt.subNav.yaml geändert: yaml/mainNav.yaml geändert: yaml/navTargets.yaml geändert: yaml/trainingszeiten.subNav.yaml geändert: yaml/verein.subNav.yaml geändert: yaml/wkKalender.subNav.yaml
2018-05-11 12:41:13 +02:00
parent a3ca5578f1
commit ca7119804c
16 changed files with 212 additions and 25 deletions
--- a/homepage/redesign2018/markdownExperiment/css/cwsvJudo-2018-content.css
+++ b/homepage/redesign2018/markdownExperiment/css/cwsvJudo-2018-content.css
@@ -3,6 +3,7 @@
 */

 #content {
+	overflow: auto;
 	padding: 1em;
 	background: #FFAE00;
 }
--- a/homepage/redesign2018/markdownExperiment/css/cwsvJudo-2018-galTable.css
+++ b/homepage/redesign2018/markdownExperiment/css/cwsvJudo-2018-galTable.css
@@ -4,7 +4,7 @@
 }

 .yearSelector select{
-/*	font-size: 7.5vmin;*/
+	font-size: inherit;
 	text-align: center;
 }

@@ -27,6 +27,10 @@
 	vertical-align: middle;
 }

+.galTable time{
+	/*white-space: nowrap;*/
+}
+
 /* Die erste Zelle in jeder Zeile ist das Datum*/
 /*
 .galTable > tr > td:nth-child(1){}
--- a/homepage/redesign2018/markdownExperiment/css/cwsvJudo-2018-mainNav.css
+++ b/homepage/redesign2018/markdownExperiment/css/cwsvJudo-2018-mainNav.css
@@ -1,8 +1,9 @@
 #mainNav {
 	display: flex;
 	flex-direction: column;
+	align-items: stretch;
 	font-family: 'Orbitron-Medium', sans-serif;
-	line-height: 1.6;
+/*	line-height: 1.6;*/
 	margin: .5em 0;
 	padding: 0;
 	border: 1px solid #a2a2a2;
@@ -12,16 +13,24 @@

 #mainNav > a {
 	display: flex;
+	flex-direction: row;
 	align-items: center;
 	color: #34495e;
 	text-decoration: none;
-	padding: 10px 15px;
+	padding: 1em 1.5em;
 	text-transform: uppercase;
-	text-align: center;
-	color: #34495e;
 }

-#mainNav > a > img{
+#mainNav > a > span:nth-child(1){
+	flex-basis: 38.2%;
+	display: flex;
+	align-items: center;
+}
+#mainNav > a > span:nth-child(2){
+	padding-top:.2em;
+}
+
+#mainNav > a > span > img{
 	height: 2em;
 	width: auto;
 }
@@ -47,12 +56,21 @@
 		flex-direction: row;
 		align-items: flex-end;
 	}
+	#mainNav > a{
+		padding: .5em .5em;
+	}
 	#mainNav > a > img{
 		display: none;
 	}
 	#mainNav > a > span{
 		display: initial;
 	}
+	#mainNav > a > span:nth-child(1){
+		flex-basis: initial;
+	}
+}
+
+
 }

@media (min-width: 1280px) {
@@ -60,6 +78,9 @@
 		flex-direction: row;
 		justify-content: center;
 	}
+	#mainNav > a {
+		padding: 1em 1.5em;
+	}
 	#mainNav > a > img{
 		display: initial;
 	}
--- a/homepage/redesign2018/markdownExperiment/css/cwsvJudo-2018-subNav.css
+++ b/homepage/redesign2018/markdownExperiment/css/cwsvJudo-2018-subNav.css
@@ -67,6 +67,7 @@
 	}
 	.subNav > a > span{
 		display: initial;
+		text-align: right;
 	}
 }

@@ -80,4 +81,7 @@
 	.subNav > a{
 		justify-content: flex-start;
 	}
+	.subNav > a > span{
+		text-align: initial;
+	}
 }
--- a/homepage/redesign2018/markdownExperiment/md/verein.md
+++ b/homepage/redesign2018/markdownExperiment/md/verein.md
@@ -17,5 +17,5 @@ Weiterführende Informationen gibt es beispielsweise unter:
 - [Informationen über den CWSV][cwsvHomepageUeberSich] auf der [Vereinshomepage][cwsvHomepage]

 [cwsvHomepage]: http://www.cwsv-sport.de "Homepage des CWSV"
-[cwsvHomepageSportarten]:. http://www.cwsv-sport.de/Trainingszeiten.htm "Sportarten im CWSV"
+[cwsvHomepageSportarten]: http://www.cwsv-sport.de/Trainingszeiten.htm "Sportarten im CWSV"
 [cwsvHomepageUeberSich]: http://www.cwsv-sport.de/Wir-.ue.ber-uns.htm "Der CWSV über sich selbst"
--- a/homepage/redesign2018/markdownExperiment/pandocTemplate/cwsvJudo.html5.pandocTemplate
+++ b/homepage/redesign2018/markdownExperiment/pandocTemplate/cwsvJudo.html5.pandocTemplate
@@ -73,7 +73,7 @@ $if(mainNav)$
 				$if(mainNav.caption)$title="$mainNav.caption$" $endif$
 				$if(mainNav.active)$class="activeNav" $endif$
 			>
-				$if(mainNav.icon)$<img src="$mainNav.icon$" $if(mainNav.caption)$alt="$mainNav.caption$" $endif$/>$endif$
+				$if(mainNav.icon)$<span><img src="$mainNav.icon$" $if(mainNav.caption)$alt="$mainNav.caption$" $endif$/></span>$endif$
 				$if(mainNav.caption)$<span>$mainNav.caption$</span>$endif$
 			</a>
 	$endfor$
--- a/homepage/redesign2018/markdownExperiment/phpLib/cwsvJudo/wkKalender.php
+++ b/homepage/redesign2018/markdownExperiment/phpLib/cwsvJudo/wkKalender.php
@@ -153,7 +153,7 @@ include_once($basePath."/bonus/db.inc");
 			
 			echo(
 				"<td class=\"noWrap\">".
-					"<time datetime=".mb_convert_encoding($wk['Datum'], 'UTF-8', 'ISO-8859-1')."\">".strftime("%Y-%m-%d (%a)", strtotime($wk['Datum']) )."</time>".
+					"<time datetime=".mb_convert_encoding($wk['Datum'], 'UTF-8', 'ISO-8859-1')."\">".strftime("<nobr>%Y-%m-%d</nobr> (%a)", strtotime($wk['Datum']) )."</time>".
 				"</td>".
 				"<td class=\"hyphenate\">".
 					"<a title=\"Ausschreibung ".mb_convert_encoding($wk['Veranstaltung'], 'UTF-8', 'ISO-8859-1')."\" href=\"".mb_convert_encoding($wk['Ausschreibung'], 'UTF-8', 'ISO-8859-1')."\"><span property=\"name\">".mb_convert_encoding($wk['Veranstaltung'], 'UTF-8', 'ISO-8859-1')."</span></a>".
--- a/homepage/redesign2018/markdownExperiment/temp/vertNavBarTest.html
+++ b/homepage/redesign2018/markdownExperiment/temp/vertNavBarTest.html
@@ -0,0 +1,142 @@
+<html>
+<head>
+<style>
+ul
+{
+margin:0px;
+padding:0px;
+list-style-type:none;
+-webkit-backface-visibility: hidden; backface-visibility: hidden;  
+}
+.var_nav
+{
+position:relative;
+background:#ccc; 
+width:300px;
+height:70px;
+margin-bottom:5px;
+}
+.link_bg
+{
+ width:70px;
+ height:70px;
+ position:absolute;
+ background:#E01B6A;
+ color:#fff;
+ z-index:2;
+}
+.link_bg i
+{
+ position:relative;
+}
+.link_title
+{
+position:absolute;
+width:100%;
+z-index:3;
+color:#fff;
+}
+.link_title:hover .icon
+{
+-webkit-transform:rotate(360deg);
+-moz-transform:rotate(360deg);
+-o-transform:rotate(360deg);
+-ms-transform:rotate(360deg);
+transform:rotate(360deg);  
+}
+.var_nav:hover .link_bg
+{
+width:100%;
+background:#E01B6A;
+-webkit-transition: all 0.3s ease-in-out;
+-moz-transition: all 0.3s ease-in-out;
+-o-transition: all 0.3s ease-in-out;
+-ms-transition: all 0.3s ease-in-out;
+transition: all 0.3s ease-in-out;  
+}
+.var_nav:hover a
+{
+font-weight:bold;
+-webkit-transition:all .5s ease-in-out;
+-moz-transition:all .5s ease-in-out; 
+-o-transition:all .5s ease-in-out; 
+-ms-transition:all .5s ease-in-out;
+ transition:all .5s ease-in-out;  
+}
+.icon
+{
+position:relative;
+width:70px;
+height:70px;
+text-align:center;
+color:#fff;
+-webkit-transition:all .5s ease-in-out;
+-moz-transition:all .5s ease-in-out; 
+-o-transition:all .5s ease-in-out; 
+-ms-transition:all .5s ease-in-out;   
+float:left;
+transition:all .5s ease-in-out;   
+float:left;  
+}
+.icon i{top:22px;position:relative;}
+a{
+display:block;
+position:absolute;
+float:left;
+font-family:arial;
+color:#fff;
+text-decoration:none;
+width:100%;
+height:70px;
+text-align:center;
+}
+span
+{
+margin-top:25px;
+display:block;
+}
+</style>
+</head>
+<body>
+<nav>
+  <UL>
+   <li class="var_nav">
+      <div class="link_bg"></div>
+      <div class="link_title">
+        <div class=icon> 
+        <i class="icon-mobile-phone icon-2x"></i>
+        </div>
+        <a href="#"><span>About Us</span></a>
+      </div>
+   </li>
+   <li class="var_nav">
+      <div class="link_bg"></div>
+      <div class="link_title">
+        <div class=icon> 
+        <i class="icon-lightbulb icon-2x"></i>
+        </div>
+        <a href="#"><span>Ideas</span></a>
+      </div>
+   </li>
+   <li class="var_nav">
+      <div class="link_bg"></div>
+      <div class="link_title">
+        <div class=icon> 
+        <i class="icon-wrench icon-2x"></i>
+        </div>
+        <a href="#"><span>Services</span></a>
+      </div>
+   </li>
+   <li class="var_nav">
+      <div class="link_bg"></div>
+      <div class="link_title">
+        <div class=icon> 
+        <i class="icon-briefcase icon-2x"></i>
+        </div>
+      <a href="#"><span>Marketing</span></a>
+      </div>
+   </li>
+  </UL>
+</nav>
+</body>
+</html>
--- a/homepage/redesign2018/markdownExperiment/yaml/galerien.subNav.yaml
+++ b/homepage/redesign2018/markdownExperiment/yaml/galerien.subNav.yaml
@@ -1,5 +1,7 @@
 ---
 subNav:
-	- {caption: "Trainings&#173;zeiten", icon: "http://cwsvjudo.bplaced.net/ressourcen/graphiken/icons/clockIconFriendly.svg", title: "Trainingszeiten und -orte der Judoka des Chemnitzer WSV", url: "http://cwsvjudo.bplaced.net/training"}
-	- {caption: "Termine", icon: "http://cwsvjudo.bplaced.net/ressourcen/graphiken/icons/calendarIcon.svg", url: "http://cwsvjudo.bplaced.net/wettkampfkalender"}
+	- *home
+	- *training
+	- *verein
+	- *wkKalender
 ...
--- a/homepage/redesign2018/markdownExperiment/yaml/index.subNav.yaml
+++ b/homepage/redesign2018/markdownExperiment/yaml/index.subNav.yaml
@@ -1,5 +1,9 @@
 ---
 subNav:
-	- {caption: "Trainings&#173;zeiten", icon: "http://cwsvjudo.bplaced.net/ressourcen/graphiken/icons/clockIconFriendly.svg", title: "Trainingszeiten und -orte der Judoka des Chemnitzer WSV", url: "http://cwsvjudo.bplaced.net/training"}
-	- {caption: "Termine", icon: "http://cwsvjudo.bplaced.net/ressourcen/graphiken/icons/calendarIcon.svg", url: "http://cwsvjudo.bplaced.net/wettkampfkalender"}
+	- *home
+	- *verein
+	- *training
+	- *wkKalender
+	- *galerien
+	- *kontakt
 ...
--- a/homepage/redesign2018/markdownExperiment/yaml/kontakt.subNav.yaml
+++ b/homepage/redesign2018/markdownExperiment/yaml/kontakt.subNav.yaml
@@ -1,5 +1,5 @@
 ---
 subNav:
-	- {caption: "Trainings&#173;zeiten", icon: "http://cwsvjudo.bplaced.net/ressourcen/graphiken/icons/clockIconFriendly.svg", title: "Trainingszeiten und -orte der Judoka des Chemnitzer WSV", url: "http://cwsvjudo.bplaced.net/training"}
-	- {caption: "Termine", icon: "http://cwsvjudo.bplaced.net/ressourcen/graphiken/icons/calendarIcon.svg", url: "http://cwsvjudo.bplaced.net/wettkampfkalender"}
+	- *training
+	- *wkKalender
 ...
--- a/homepage/redesign2018/markdownExperiment/yaml/mainNav.yaml
+++ b/homepage/redesign2018/markdownExperiment/yaml/mainNav.yaml
@@ -2,6 +2,7 @@
 mainNav:
 	- *home
 	- *verein
+	- *wkKalender
 	- *galerien
 	- *kontakt
 ...
--- a/homepage/redesign2018/markdownExperiment/yaml/navTargets.yaml
+++ b/homepage/redesign2018/markdownExperiment/yaml/navTargets.yaml
@@ -3,16 +3,25 @@ home: &home
 	caption: "Home"
 	url: "/"
 	icon: "http://cwsvjudo.bplaced.net/ressourcen/graphiken/logos/cwsvJudoLogoWappen.x256.png"
+training: &training
+	caption: "Trainings&#173;zeiten"
+	icon: "http://cwsvjudo.bplaced.net/ressourcen/graphiken/icons/clockIconFriendly.svg"
+	title: "Trainingszeiten und -orte der Judoka des Chemnitzer WSV"
+	url: "/trainingszeiten"
 verein: &verein
 	caption: "Verein"
 	url: "/verein"
 	icon: "http://cwsvjudo.bplaced.net/ressourcen/graphiken/logos/cwsvLogoWappen.x250.png"
+wkKalender: &wkKalender
+	caption: "Wettkampf&shy;kalender"
+	icon: "http://cwsvjudo.bplaced.net/ressourcen/graphiken/icons/calendarIcon.svg"
+	url: "/wkKalender"
 galerien: &galerien
 	caption: "Galerien"
 	url: "/galerien"
 	icon: "http://cwsvjudo.bplaced.net/ressourcen/graphiken/icons/gallery.svg"
 kontakt: &kontakt
-	caption: "kontakt"
+	caption: "Kontakt"
 	url: "/kontakt"
 	icon: "http://cwsvjudo.bplaced.net/ressourcen/graphiken/icons/contact4Ways.svg"
 ...
--- a/homepage/redesign2018/markdownExperiment/yaml/trainingszeiten.subNav.yaml
+++ b/homepage/redesign2018/markdownExperiment/yaml/trainingszeiten.subNav.yaml
@@ -1,11 +1,9 @@
 ---
 subNav:
-	- {caption: "Termine", icon: "http://cwsvjudo.bplaced.net/ressourcen/graphiken/icons/calendarIcon.svg", url: "http://cwsvjudo.bplaced.net/wettkampfkalender"}
-	- {url: "cwsvjudo.bplaced.net/pages/desktop/verein.php", title: "Informationen über den Chemnitzer Freizeit- und Wohngeietssportverein e.&nbsp;V.", caption: "Vereinsinfos"}
-	- {caption: "Trainings&#173;zeiten", icon: "http://cwsvjudo.bplaced.net/ressourcen/graphiken/icons/clockIconFriendly.svg", title: "Trainingszeiten und -orte der Judoka des Chemnitzer WSV", url: "http://cwsvjudo.bplaced.net/training"}
-	- {title: "Wettkampfkalender der Abteilung Judo des Chemnitzer WSV", url: "cwsvjudo.bplaced.net/pages/desktop/verein.wettkampfkalender.php", caption: "Wett&shy;kampf&shy;ka&shy;len&shy;der"}
+	- *wkKalender
+	- *verein
+	- *galerien
 	- {title: "Wettkampfplaner der Abteilung Judo des Chemnitzer WSV", url: "cwsvjudo.bplaced.net/pages/desktop/wkParticipo", caption: "Wett&shy;kampf&shy;pla&shy;ner"}
-	- {title: "Galerien mit Bildern der Wettkämpfe und Veranstaltungen der Abteilung Judo des Chemnitzer WSV", url: "cwsvjudo.bplaced.net/pages/desktop/verein.galerien.php", caption: "Galerien"}
 	- {url: "cwsvjudo.bplaced.net/pages/desktop/verein.feiern.php", title: "Fetengalerien der Judoka des CWSV", caption: "Feiern"}
 	- {url: "cwsvjudo.bplaced.net/pages/desktop/verein.zelten.php", title: "Zeltengalerien der Judoka des CWSV", caption: "Zelten"}
 ...
--- a/homepage/redesign2018/markdownExperiment/yaml/verein.subNav.yaml
+++ b/homepage/redesign2018/markdownExperiment/yaml/verein.subNav.yaml
@@ -1,5 +1,5 @@
 ---
 subNav:
-	- {caption: "Trainings&#173;zeiten", icon: "http://cwsvjudo.bplaced.net/ressourcen/graphiken/icons/clockIconFriendly.svg", title: "Trainingszeiten und -orte der Judoka des Chemnitzer WSV", url: "http://cwsvjudo.bplaced.net/training"}
-	- {caption: "Termine", icon: "http://cwsvjudo.bplaced.net/ressourcen/graphiken/icons/calendarIcon.svg", url: "http://cwsvjudo.bplaced.net/wettkampfkalender"}
+	- *training
+	- *wkKalender
 ...
--- a/homepage/redesign2018/markdownExperiment/yaml/wkKalender.subNav.yaml
+++ b/homepage/redesign2018/markdownExperiment/yaml/wkKalender.subNav.yaml
@@ -1,5 +1,6 @@
 ---
 subNav:
-	- {caption: "Trainings&#173;zeiten", icon: "http://cwsvjudo.bplaced.net/ressourcen/graphiken/icons/clockIconFriendly.svg", title: "Trainingszeiten und -orte der Judoka des Chemnitzer WSV", url: "http://cwsvjudo.bplaced.net/training"}
-	- {caption: "Termine", icon: "http://cwsvjudo.bplaced.net/ressourcen/graphiken/icons/calendarIcon.svg", url: "http://cwsvjudo.bplaced.net/wettkampfkalender"}
+	- *home
+	- *galerien
+	- *training
 ...