Druckversion des Wettkampfkalenders

- Spalte mit qrCode hinzugefügt
	geändert:       phpLib/cwsvJudo/wkKalender.php
	neue Datei:     phpLib/cwsvJudo/wkQrCode.php
- Designanpassungen für die Druckversion
	geändert:       src/css/cwsvJudo-2018-footer.css
	geändert:       src/css/cwsvJudo-2018-header.css
	geändert:       src/css/cwsvJudo-2018-layout.css
	geändert:       src/css/cwsvJudo-2018-mainNav.css
	geändert:       src/css/cwsvJudo-2018-sideBar.css
	geändert:       src/css/cwsvJudo-2018-subNav.css
	geändert:       src/css/cwsvJudo-2018-wkKalender.css
	geändert:       src/css/cwsvJudo-2018.css

homepage/redesign2018/markdownExperiment/phpLib/cwsvJudo/wkKalender.php

@@ -154,6 +154,11 @@ return $ret;
 /// Aus einer Liste von Wettkämpfen den htmlCode der Wettkampftabelle bereit stellen
 function wkList2htmlWkTable( $aWkList, $someOptions = [] ){
 setlocale(LC_ALL, 'de_DE.utf8');
+
+require_once("./config.inc.php");
+require_once("/users/cwsvjudo/www/ressourcen/phpLib/phpqrcode/qrlib.php"); 
+
+
 if( empty($aWkList) )
 	return "";
 
@@ -226,6 +231,7 @@ $htmlWkTableString = "";
 					"</td>".
 					"<td data-title=\"iCal\">".
 						"<a title=\"Termin für ".$wk['Veranstaltung']." in Kalender übernehmen\" href=\"/ressourcen/phpLib/calendar.php?wkID=".$wk['lfdeNr']."\">iCal</a>".
+						"<img class=\"print-only\" heigtht=\"111\" width=\"111\" src=http://cwsvjudo.bplaced.net/pages/responsive/wkQrCode.php?id=".$wk['lfdeNr']." />".
 					"</td>".
 				"</tr></a>\n";
 	}
@@ -454,7 +460,7 @@ function wkTableHtml(){
 				$siteData['mainContent'] .= 
 					"<h2>Wettkampfkalender ".$jahr."</h2>";
 				$siteData['mainContent'].=
-					"<div style=\"display:flex;justify-content:space-between;\">";
+					"<div class=\"nonePrint\" style=\"display:flex;justify-content:space-between;\">";
 
 				if(in_array((intval($_GET["jahr"])-1), $jahre)){
 					$siteData['mainContent'].=

homepage/redesign2018/markdownExperiment/phpLib/cwsvJudo/wkQrCode.php

@@ -0,0 +1,24 @@
+<?php 
+require_once("./config.inc.php");
+require_once($basePath."/ressourcen/phpLib/phpqrcode/qrlib.php"); 
+
+	$param = $_GET['id']; // remember to sanitize that - it is user input! 
+	 
+	// we need to be sure ours script does not output anything!!! 
+	// otherwise it will break up PNG binary! 
+	 
+//	ob_start("callback"); 
+	 
+	// here DB request or some processing 
+	$codeText = "http://cwsvjudo.bplaced.net/wk/".$param; 
+	 
+	// end of processing here 
+	$debugLog = ob_get_contents(); 
+//	ob_end_clean(); 
+	 
+	// outputs image directly into browser, as PNG stream 
+	QRcode::png($codeText, false, QR_ECLEVEL_L, 3, 0, false );
+
+exit();
+?>
+

homepage/redesign2018/markdownExperiment/src/css/cwsvJudo-2018-footer.css

@@ -13,3 +13,9 @@
 	max-width: 1em;
 }
 
+@media print{
+	.footerBar
+	{
+		display: none;
+	}
+}

homepage/redesign2018/markdownExperiment/src/css/cwsvJudo-2018-header.css

@@ -66,3 +66,10 @@
 		align-items: center;
 	}
 }
+
+@media print{
+	.cwsvHeader
+	{
+		display: none;
+	}
+}

homepage/redesign2018/markdownExperiment/src/css/cwsvJudo-2018-layout.css

@@ -74,3 +74,10 @@ body > * {
 		flex-basis: 25%;
 	}
 }
+
+@media print{
+	.sideNotes
+	{
+		display: none;
+	}
+}

homepage/redesign2018/markdownExperiment/src/css/cwsvJudo-2018-mainNav.css

@@ -85,3 +85,10 @@
 		display: initial;
 	}
 }
+
+@media print{
+	#mainNav
+	 {
+		display: none;
+	}
+}

homepage/redesign2018/markdownExperiment/src/css/cwsvJudo-2018-sideBar.css

@@ -14,7 +14,7 @@ amp-sidebar {
 }
 .sidebar a {
 	text-decoration: none;
-    color: inherit;
+	color: inherit;
 }
 .close-sidebar {
 	font-size: 1.5em;

homepage/redesign2018/markdownExperiment/src/css/cwsvJudo-2018-subNav.css

@@ -87,3 +87,10 @@
 		text-align: initial;
 	}
 }
+
+@media print{
+	.subNav
+	 {
+		display: none;
+	}
+}

homepage/redesign2018/markdownExperiment/src/css/cwsvJudo-2018-wkKalender.css

@@ -885,3 +885,260 @@
 	background-color: #FF8100;
 	border-radius: .5em;
 }
+
+@media print{
+	.wkMonthBar
+	{
+		display: none;
+	}
+	.wkKalender > thead{
+		display: table-header-group;
+		width: 100%;
+	}
+	.wkKalender > tbody > tr{
+		display: table-row;
+		width: 100%;
+	}
+	.wkKalender > tbody > tr > td {
+		display: table-cell;
+	}
+	/*qrCode*/
+	.wkKalender > tbody > tr > td > img{
+		width: 1cm;
+	}
+	.wkKalender > tbody > tr > td:nth-of-type(5) > a{
+		display: none;
+	}
+	.wkKalender > tbody > tr > td[data-title]:before {
+		display: none;
+		content: "";
+	}
+	.wkKalender > tbody{
+		display: table-row-group;
+	}
+	.wkKalender > tfoot{
+		display: table-footer-group;
+	}
+	.wkKalender > tbody > tr {
+		border: 1px solid #e0e0e0;
+		border-radius: 2px;
+		margin-bottom: 1.6rem;
+	}
+	.wkKalender > tbody > tr > td {
+		vertical-align: middle;
+		text-align: initial;
+	}
+	.wkKalender > tbody > tr:nth-child(odd) {
+		background-color: #FF8100;
+	}
+	.wkKalender > tbody > tr > td:nth-child(odd) {
+		background-color: inherit;
+	}
+	.wkKalender > tbody > tr > td[data-title]:before {
+		content: initial;
+	}
+	.wkKalender tr, th, td {
+		border: 1px solid black;
+	}
+	.wkKalender th {
+		display: table-cell;
+	}
+	
+	.kalenderDatum{
+		flex-direction: column;
+		align-items: center;
+	}
+	.kalenderDatum > span:nth-child(4)::after{
+		content: initial;
+		white-space: initial;
+	}
+	.kalenderDatum > span:nth-child(4){
+		display: none;
+	}
+	.kalenderDatum > span:nth-child(3)::after{
+		content: ".";
+		white-space: pre;
+	}
+	.kalenderDatum > span:nth-child(2)::after{
+		content: initial;
+		white-space: initial;
+	}
+
+/* https://codepen.io/denilsonsa/pen/Etrba */
+
+	/****************************************/
+	/* Styling rules, such as font and colors */
+	.date-as-calendar {
+	  font-variant: normal;
+	  font-style: normal;
+	  font-weight: normal;
+	  font-family: "Helvetica", "Arial", sans-serif;
+
+	  /* It seems vertical-align: baseline does not work correctly with display: inline-flex. */
+	  vertical-align: top;
+
+	  /* margin: 1ex; */
+
+	  color: black;
+	  background: white;
+	  background : linear-gradient(to bottom right, #FFF 0%, #EEE 100%);
+
+	  border: 1px solid #888;
+	  border-radius: 3px;
+	  overflow: hidden;
+
+	  box-shadow: 2px 2px 2px -2px black;
+	}
+	.date-as-calendar .weekday,
+	.date-as-calendar .day,
+	.date-as-calendar .month,
+	.date-as-calendar .year {
+	  text-align: center;
+	  line-height: 1.0;
+	}
+	.date-as-calendar .month {
+	  font-family: "Oswald", sans-serif;
+	  text-transform: uppercase;
+	  background: #B11;
+	  background : linear-gradient(to bottom right, #D66 0%, #A00 100%);
+	  color: white;
+	}
+
+	/****************************************/
+	/* Layout rules using position: absolute and pixels. */
+	.position-pixels.date-as-calendar {
+	  display: inline-block;
+	  position: relative;
+	  width: 64px;
+	  height: 64px;
+	}
+	.position-pixels.date-as-calendar .weekday,
+	.position-pixels.date-as-calendar .day,
+	.position-pixels.date-as-calendar .month,
+	.position-pixels.date-as-calendar .year {
+	  display: block;
+	  position: absolute;
+	  left: 0;
+	  right: 0;
+	  width: 100%;
+	  height: 1em;
+	}
+	.position-pixels.date-as-calendar .month {
+	  top: 0px;
+	  font-size: 12px;
+	  padding: 2px 0;
+	}
+	.position-pixels.date-as-calendar .weekday {
+	  top: 16px;
+	  font-size: 10px;
+	}
+	.position-pixels.date-as-calendar .day {
+	  top: 26px;
+	  font-size: 24px;
+	}
+	.position-pixels.date-as-calendar .year {
+	  top: 50px;
+	  font-size: 14px;
+	}
+
+	/****************************************/
+	/* Layout rules using position: absolute and relative dimensions using em. */
+	.position-em.date-as-calendar {
+	  display: inline-block;
+	  position: relative;
+	  
+	  width: 4em; 
+	  height: 4em; 
+	}
+	.position-em.date-as-calendar .weekday,
+	.position-em.date-as-calendar .day,
+	.position-em.date-as-calendar .month,
+	.position-em.date-as-calendar .year {
+	  display: block;
+	  position: absolute;
+	  left: 0;
+	  right: 0;
+	  width: 100%;
+	  height: 1em;
+	}
+	.position-em.date-as-calendar .month {
+	  top: 0px;
+	  font-size: 0.75em;
+	  padding: 0.1em 0;
+	}
+	.position-em.date-as-calendar .weekday {
+	  top: 1.6em;
+	  font-size: 0.6125em;
+	}
+	.position-em.date-as-calendar .day {
+	  top: 1.1em;
+	  font-size: 1.5em
+	}
+	.position-em.date-as-calendar .year {
+	  bottom: 0px;
+	  font-size: 0.87750em;
+	}
+
+	/****************************************/
+	/* Layout rules using display: inline-flex and relative dimensions using em. */
+	.inline-flex.date-as-calendar {
+	  display: inline-flex;
+	  flex-direction: column;
+	  flex-wrap: nowrap;
+	  justify-content: space-between;
+	  
+	  width: 4em; 
+	  height: 4em; 
+	}
+	.inline-flex.date-as-calendar .weekday,
+	.inline-flex.date-as-calendar .day,
+	.inline-flex.date-as-calendar .month,
+	.inline-flex.date-as-calendar .year {
+	  display: block;
+	  flex: 1 1 auto;
+	}
+	.inline-flex.date-as-calendar .month {
+	  order: 1;
+	  font-size: 0.75em;
+	  padding: 0.1em 0;
+	}
+	.inline-flex.date-as-calendar .weekday {
+	  order: 2;
+	  font-size: 0.6125em;
+	}
+	.inline-flex.date-as-calendar .day {
+	  order: 3;
+	  font-size: 1.5em;
+	}
+	.inline-flex.date-as-calendar .year {
+	  order: 4;
+	  font-size: 0.87750em;
+	}
+
+	/****************************************/
+	/* Multiple sizes. */
+	.date-as-calendar.size0_5x {
+	  font-size: 8px;
+	}
+	.date-as-calendar.size0_75x {
+	  font-size: 12px;
+	}
+	.date-as-calendar.size1x {
+	  font-size: 16px;
+	}
+	.date-as-calendar.size1_25x {
+	  font-size: 20px;
+	}
+	.date-as-calendar.size1_5x {
+	  font-size: 24px;
+	}
+	.date-as-calendar.size1_75x {
+	  font-size: 28px;
+	}
+	.date-as-calendar.size2x {
+	  font-size: 32px;
+	}
+	.date-as-calendar.size3x {
+	  font-size: 48px;
+	}
+}

homepage/redesign2018/markdownExperiment/src/css/cwsvJudo-2018.css

@@ -24,6 +24,13 @@ body{
 	}
 }
 
+@media print{
+	body{
+		font-size: 1.3vw;
+	}
+}
+
+
 /*
  * Ein Reset für das BoxSizing
  * Wir wollen Maße auf die "äußere Boundingbox" beziehen
@@ -169,9 +176,19 @@ body{
 }
 
 .displayNone{
-	display: none !important;
+	display: none;
 }
 
 .fontSizeXxSmall{
 	font-size: xx-small;
 }
+
+.print-only{
+	display: none;
+}
+
+@media print{
+	.print-only{
+		display: initial;
+	}
+}