Merge pull request 'kalender' (#9) from kalender into master

Reviewed-on: https://illg.xyz/gitea/JasTobi/WeihnachtsKalenderMelly/pulls/9
This commit was merged in pull request #9.
This commit is contained in:
2020-12-10 19:09:28 +01:00
19 changed files with 420 additions and 152 deletions

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

BIN
inc/bg/baum.jpeg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.3 MiB

BIN
inc/bg/baum2.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.3 MiB

View File

@@ -20,20 +20,20 @@ if ($tab == "") {$tab = "home";}
Mellys Weihnachts Kalender
</h1>
</header>
<!-- <nav id="nav">
<ul class="navUl">
<li><a href="?tab=home" <?php if ($tab == "home")?>>Home</a></li>
<li><a href="?tab=bilder" <?php if ($tab == "bilder")?>>Galerie</a></li>
<li><a href="?tab=gästebuch" <?php if ($tab == "gästebuch")?>>Gästebuch</a></li>
<li class="mainMenu"><a href="#">Über</a>
<!-- <nav>
<ul>
<li><a href="?tab=home" <?php if ($tab == "home")?>>Home</a></li>
<li><a href="?tab=bilder" <?php if ($tab == "bilder")?>>Galerie</a></li>
<li><a href="?tab=gästebuch" <?php if ($tab == "gästebuch")?>>Gästebuch</a></li>
<!-- <li class="mainMenu"><a href="#">Über</a>
<ul class="submenu">
<li><a href="?tab=impressum">Impressum</a></li>
<li><a href="?tab=datenschutz" <?php if ($tab == "datenschutz")?>>Datenschutz</a></li>
<li><a href="mailto:illg@illg.xyz?subject=HochzeitWeb" target="_blank">Kontak</a></li>
</ul>
</ul> -->
</li>
</ul>
</nav> -->
</nav>
<script type="text/javascript">
$(".mainMenu > a").mouseover(function(){

View File

@@ -2,10 +2,10 @@ $timerPosition: -10px
.TimeContainer
margin-top: $navtop
color: darkred
color: darkred
font-size: 20px
font-weight: bold
text-shadow: 1px 1px 1px darkgray
text-shadow: 1px 1px 1px darkgray
#clockdiv
@@ -27,13 +27,7 @@ $timerPosition: -10px
padding-top: 40px
display: inline-block
margin-left: $timerPosition
.smalltext
font-size: 10px
margin-left: $timerPosition
.KalenderTest
h3
text-decoration: underline
border: 3px solid red

85
sass/_kalender.sass Normal file
View File

@@ -0,0 +1,85 @@
$backgroundSize: 516px // Größe Bild im Kalender
$bgPosition: -13px // Position Bg und Türen
$kalenderWidth: 460px // breite des kalenders
$marginLeftRight: 5px // abstand linker und rechter rand
$marginTop: 5px
$marginBetween: 5px // abstand zwischen den Tueren
$doorBorderSize: 1px
$doorWidth: ($kalenderWidth - 3.5*$marginLeftRight - 3*$marginBetween)/4
/* ********************************
.kalender
display: inline-block
position: relative
text-align: center
width: $kalenderWidth
height: #{6*($doorWidth+$doorBorderSize+$marginBetween)+2*$marginTop}
border: 1px solid black
background: #fff url("../inc/bg/baum2.jpg") no-repeat
/*background-size: $backgroundWidth
background-size: $backgroundSize
background-position: $bgPosition
div
position: absolute
border: $doorBorderSize solid darkred
width: $doorWidth
height: $doorWidth
overflow: hidden
background: #fff
h3
padding-top: 1.5rem
font-weight: bold
padding: 1rem
span
position: absolute
display: inline-block
top: 1rem
left: 1rem
font-size: 1rem
width: 1.2rem
height: 1.2rem
color: #FFF
background: #CD0000
.left
position: absolute
left: 0
top: 0
width: #{$doorWidth+50}
height: $doorWidth
display: block
border: none
background: #fff url("../inc/bg/baum2.jpg") no-repeat
/*background-size: $backgroundWidth
background-size: $backgroundSize
margin-left: $bgPosition
a
&:hover .left, &:focus .left
left: #{-($doorWidth+60)}
.left
display: block
position: absolute
transition: left 0.5s
.inactive a
pointer-events: none
cursor: default
@for $row from 0 through 5
@for $col from 0 through 3
$leftCalc: $marginLeftRight+($doorWidth+$marginBetween+2*$doorBorderSize)*$col
$topCalc: $marginTop+($doorWidth+$marginBetween+2*$doorBorderSize)*$row
#ak#{$row*4+$col+1}
left: #{$leftCalc}
top: #{$topCalc}
.left
background-position: #{-($leftCalc+$doorBorderSize)} #{-($topCalc+$doorBorderSize)}
#hiddenTuer
margin: 1rem
max-height: auto

View File

@@ -1,52 +1,49 @@
ul
list-style-type: none
margin: -2px auto
padding: 0
$navInPadding: 0.5rem
/*overflow: hidden;
background-color: hsla(0, 0%, 100%, 0.8)
border: 2px solid darkred
display: inline-block
transition: all 60ms
box-shadow: inset -2px -2px 10px lightblue, inset 2px 2px 10px lightblue
/* ******************
&.navUl
height: 33px
nav
ul
list-style-type: none
margin: -0.13rem auto
padding: 0
background-color: hsla(0, 0%, 100%, 0.8)
border: 2px solid darkred
display: inline-block
transition: all 60ms
box-shadow: inset -2px -2px 10px lightblue, inset 2px 2px 10px lightblue
height: 2rem
li
float: left
width: auto
li
float: left
width: auto
margin: 0px 0px
&:first-child
padding-left: $navInPadding
/*height: 33px;
margin: 0px 0px
a
display: block
color: darkred
text-align: center
padding: 0.4rem $navInPadding $navInPadding 0
text-decoration: none
font-weight: bold
&:active, &:hover, &:focus, &.active
/*background: none;
color: red
text-decoration: underline
/*border: 1px solid lightgrey;
border-radius: 0px
&:active, &:hover, &:focus
transition: 1s
transform: scale(1.1)
a
display: block
color: darkred
text-align: center
padding: 7px 16px
text-decoration: none
margin: 1px 0 4px
font-weight: bold
ul li ul li
display: inline-block
nav > ul > li
width: 100px
li a
&:active, &:hover, &:focus, &.active
background: none
color: red
text-decoration: underline
&:active, &:hover, &:focus
transition: 1s
transform: scale(1.1)
ul li ul li
display: inline-block
> ul > li > ul > li
margin: middle
.submenu
visibility: hidden
@@ -55,20 +52,11 @@ ul li ul li
margin-left: -10px
background-color: rgb(255, 255, 255)
li
a
display: block
float: none
border-bottom: 1px solid goldenrod
margin: 0 0 0 0
li, a
display: block
float: none
border-bottom: 1px solid goldenrod
margin: 0 0 0 0
.submenuActive
visibility: visible
nav > ul > li > ul > li
margin: middle
visibility: visible

6
sass/_tueren.sass Normal file
View File

@@ -0,0 +1,6 @@
.tueren
margin-top: $navtop
h3
color: red
text-decoration: underline

View File

@@ -1,6 +1,6 @@
$navtop: 20px
$txttop: 5px
@import 'nav', 'home'
@import 'nav', 'home', 'kalender', 'tueren'
/* **************************************

View File

@@ -1,6 +1,6 @@
<style>
#teet {
display: inline-block;
display: inline-block;
color: black;
font-size: 0.7rem;
font-weight: normal;
@@ -8,7 +8,7 @@
border: 0px solid red;
max-width: 700px;
}
span {
text-decoration: underline;
font-weight: bold;
@@ -17,17 +17,17 @@
color: red;
text-decoration: underline;
}
</style>
<h3 id="titel">Datenschutz Gesetzt</h3>
<div id="teet">
<p>Diese Seite wird von mir als Einzelperson betrieben - ohne Gewinnerzielungsabsicht.</p>
<p><span>Verantwortlich für die Datenerfassung</span><br><br>
Jason Illg <br>
Jason Lüthje <br>
Bärlauchstraße 7 <br>
22850 Norderstedt <br><br>
@@ -78,4 +78,4 @@ In den erstellten Gästebüchern haben Sie die Möglichkeit einen Eintrag zu hin
<p></p>
<p> Stand: 28.09.20 </p>
</div>
</div>

View File

@@ -160,8 +160,22 @@
}, 1000);
</script>
<div class="KalenderTest">
<h3> Kalender Test Bereich zum Testen </h3>
<div style="
display:inline-block;
font-weight:bold;
color:darkred;
margin-top:-3rem;
padding: 0 1.5rem 0 1.5rem;
text-decoration:underline;
background-color:#fff;
background: linear-gradient(to bottom, #fefffd, #e7e9ea 50%, #e1e1e1);
border: 2px solid #C21514;
">
<h2>Bis der Kalender Startet !!!</h2>
</div>
<div class="">
<h3></h3>
</div>
<?php include ("kalender.php") ?>

View File

@@ -1,6 +1,6 @@
<style>
#teet {
display: inline-block;
display: inline-block;
color: black;
font-size: 0.7rem;
font-weight: normal;
@@ -8,7 +8,7 @@
border: 0px solid red;
max-width: 700px;
}
span {
text-decoration: underline;
font-weight: bold;
@@ -17,83 +17,83 @@
color: red;
text-decoration: underline;
}
</style>
<h3 id="titel">Impressum</h3>
<div id="teet">
<p>Jason Illg</p> <p>Bärlauchstraße 7<br>
D-22850 Norderstedt</p> <p>E-Mail: <a href="mailto:illg@illg.xyz?subject=HochzeitWeb" target="_blank">illg@illg.xyz</a></p>
<p>Jason Lüthje</p> <p>Bärlauchstraße 7<br>
D-22850 Norderstedt</p> <p>E-Mail: <a href="mailto:illg@illg.xyz?subject=HochzeitWeb" target="_blank">illg@illg.xyz</a></p>
<h2>Disclaimer rechtliche Hinweise</h2>
<p><span>§ 1 Warnhinweis zu Inhalten</span></p>
<p>Die kostenlosen und frei zugänglichen Inhalte dieser Webseite wurden mit größtmöglicher
Sorgfalt erstellt. Der Anbieter dieser Webseite
übernimmt jedoch keine Gewähr für die
Richtigkeit und Aktualität der bereitgestellten
kostenlosen und frei zugänglichen
journalistischen Ratgeber und Nachrichten.
Namentlich gekennzeichnete Beiträge geben die
Meinung des jeweiligen Autors und nicht immer
die Meinung des Anbieters wieder. Allein durch
den Aufruf der kostenlosen und frei
zugänglichen Inhalte kommt keinerlei
Vertragsverhältnis zwischen dem Nutzer und dem
Anbieter zustande, insoweit fehlt es am
Rechtsbindungswillen des Anbieters.</p> <p><span>§ 2
Externe Links</span></p> <p>Diese Website enthält
Verknüpfungen zu Websites Dritter ("externe
Links"). Diese Websites unterliegen der Haftung
der jeweiligen Betreiber. Der Anbieter hat bei
der erstmaligen Verknüpfung der externen Links
die fremden Inhalte daraufhin überprüft, ob
etwaige Rechtsverstöße bestehen. Zu dem
Zeitpunkt waren keine Rechtsverstöße
ersichtlich. Der Anbieter hat keinerlei
Einfluss auf die aktuelle und zukünftige
Gestaltung und auf die Inhalte der verknüpften
Seiten. Das Setzen von externen Links bedeutet
nicht, dass sich der Anbieter die hinter dem
Verweis oder Link liegenden Inhalte zu Eigen
macht. Eine ständige Kontrolle der externen
Links ist für den Anbieter ohne konkrete
Hinweise auf Rechtsverstöße nicht zumutbar. Bei
Kenntnis von Rechtsverstößen werden jedoch
derartige externe Links unverzüglich
gelöscht.</p> <p><span>§ 3 Urheber- und
Leistungsschutzrechte</span></p> <p>Die auf dieser
Website veröffentlichten Inhalte unterliegen
dem deutschen Urheber- und
Leistungsschutzrecht. Jede vom deutschen
Urheber- und Leistungsschutzrecht nicht
zugelassene Verwertung bedarf der vorherigen
schriftlichen Zustimmung des Anbieters oder
jeweiligen Rechteinhabers. Dies gilt
insbesondere für Vervielfältigung, Bearbeitung,
Übersetzung, Einspeicherung, Verarbeitung bzw.
Wiedergabe von Inhalten in Datenbanken oder
anderen elektronischen Medien und Systemen.
Inhalte und Rechte Dritter sind dabei als
solche gekennzeichnet. Die unerlaubte
Vervielfältigung oder Weitergabe einzelner
Inhalte oder kompletter Seiten ist nicht
gestattet und strafbar. Lediglich die
Herstellung von Kopien und Downloads für den
persönlichen, privaten und nicht kommerziellen
Gebrauch ist erlaubt.</p> <p>Die Darstellung
dieser Website in fremden Frames ist nur mit
schriftlicher Erlaubnis zulässig.</p> <p><span>§ 4
Besondere Nutzungsbedingungen</span></p> <p>Soweit
besondere Bedingungen für einzelne Nutzungen
dieser Website von den vorgenannten Paragraphen
abweichen, wird an entsprechender Stelle
ausdrücklich darauf hingewiesen. In diesem
Falle gelten im jeweiligen Einzelfall die
<p>Die kostenlosen und frei zugänglichen Inhalte dieser Webseite wurden mit größtmöglicher
Sorgfalt erstellt. Der Anbieter dieser Webseite
übernimmt jedoch keine Gewähr für die
Richtigkeit und Aktualität der bereitgestellten
kostenlosen und frei zugänglichen
journalistischen Ratgeber und Nachrichten.
Namentlich gekennzeichnete Beiträge geben die
Meinung des jeweiligen Autors und nicht immer
die Meinung des Anbieters wieder. Allein durch
den Aufruf der kostenlosen und frei
zugänglichen Inhalte kommt keinerlei
Vertragsverhältnis zwischen dem Nutzer und dem
Anbieter zustande, insoweit fehlt es am
Rechtsbindungswillen des Anbieters.</p> <p><span>§ 2
Externe Links</span></p> <p>Diese Website enthält
Verknüpfungen zu Websites Dritter ("externe
Links"). Diese Websites unterliegen der Haftung
der jeweiligen Betreiber. Der Anbieter hat bei
der erstmaligen Verknüpfung der externen Links
die fremden Inhalte daraufhin überprüft, ob
etwaige Rechtsverstöße bestehen. Zu dem
Zeitpunkt waren keine Rechtsverstöße
ersichtlich. Der Anbieter hat keinerlei
Einfluss auf die aktuelle und zukünftige
Gestaltung und auf die Inhalte der verknüpften
Seiten. Das Setzen von externen Links bedeutet
nicht, dass sich der Anbieter die hinter dem
Verweis oder Link liegenden Inhalte zu Eigen
macht. Eine ständige Kontrolle der externen
Links ist für den Anbieter ohne konkrete
Hinweise auf Rechtsverstöße nicht zumutbar. Bei
Kenntnis von Rechtsverstößen werden jedoch
derartige externe Links unverzüglich
gelöscht.</p> <p><span>§ 3 Urheber- und
Leistungsschutzrechte</span></p> <p>Die auf dieser
Website veröffentlichten Inhalte unterliegen
dem deutschen Urheber- und
Leistungsschutzrecht. Jede vom deutschen
Urheber- und Leistungsschutzrecht nicht
zugelassene Verwertung bedarf der vorherigen
schriftlichen Zustimmung des Anbieters oder
jeweiligen Rechteinhabers. Dies gilt
insbesondere für Vervielfältigung, Bearbeitung,
Übersetzung, Einspeicherung, Verarbeitung bzw.
Wiedergabe von Inhalten in Datenbanken oder
anderen elektronischen Medien und Systemen.
Inhalte und Rechte Dritter sind dabei als
solche gekennzeichnet. Die unerlaubte
Vervielfältigung oder Weitergabe einzelner
Inhalte oder kompletter Seiten ist nicht
gestattet und strafbar. Lediglich die
Herstellung von Kopien und Downloads für den
persönlichen, privaten und nicht kommerziellen
Gebrauch ist erlaubt.</p> <p>Die Darstellung
dieser Website in fremden Frames ist nur mit
schriftlicher Erlaubnis zulässig.</p> <p><span>§ 4
Besondere Nutzungsbedingungen</span></p> <p>Soweit
besondere Bedingungen für einzelne Nutzungen
dieser Website von den vorgenannten Paragraphen
abweichen, wird an entsprechender Stelle
ausdrücklich darauf hingewiesen. In diesem
Falle gelten im jeweiligen Einzelfall die
besonderen Nutzungsbedingungen.</p>
<p> Stand: 28.09.20 </p>
</div>
</div>

151
tab/kalender.php Normal file
View File

@@ -0,0 +1,151 @@
<div class="kalender">
<div class="inactive" id="ak1">
<a href="?tab=tür01" <?php if ($tab == "tür01")?>>
<h3 id="hiddenTuer">Tür 01</h3>
<div class="left"><span>1</span></div>
</a>
</div>
<div class="inactive" id="ak2">
<a href="?tab=tür02" <?php if ($tab == "tür02")?>>
<h3 id="hiddenTuer">Tür 02</h3>
<div class="left"><span>2</span></div>
</a>
</div>
<div class="inactive" id="ak3">
<a href="?tab=tür03" <?php if ($tab == "tür03")?>>
<h3 id="hiddenTuer">Tür 03</h3>
<div class="left"><span>3</span></div>
</a>
</div>
<div class="inactive" id="ak4">
<a href="?tab=tür04" <?php if ($tab == "tür04")?>>
<h3 id="hiddenTuer">Tür 04</h3>
<div class="left"><span>4</span></div>
</a>
</div>
<div class="inactive" id="ak5">
<a href="?tab=tür05" <?php if ($tab == "tür05")?>>
<h3 id="hiddenTuer">Tür 05</h3>
<div class="left"><span>5</span></div>
</a>
</div>
<div class="inactive" id="ak6">
<a href="?tab=tür06" <?php if ($tab == "tür06")?>>
<h3 id="hiddenTuer">Tür 06</h3>
<div class="left"><span>6</span></div>
</a>
</div>
<div class="inactive" id="ak7">
<a href="?tab=tür07" <?php if ($tab == "tür07")?>>
<h3 id="hiddenTuer">Tür 07</h3>
<div class="left"><span>7</span></div>
</a>
</div>
<div class="inactive" id="ak8">
<a href="?tab=tür08" <?php if ($tab == "tür08")?>>
<h3 id="hiddenTuer">Tür 08</h3>
<div class="left"><span>8</span></div>
</a>
</div>
<div class="inactive" id="ak9">
<a href="?tab=tür09" <?php if ($tab == "tür09")?>>
<h3 id="hiddenTuer">Tür 09</h3>
<div class="left"><span>9</span></div>
</a>
</div>
<div class="inactive" id="ak10">
<a href="?tab=tür10" <?php if ($tab == "tür10")?>>
<h3 id="hiddenTuer">Tür 10</h3>
<div class="left"><span>10</span></div>
</a>
</div>
<div class="inactive" id="ak11">
<a href="?tab=tür11" <?php if ($tab == "tür11")?>>
<h3 id="hiddenTuer">Tür 11</h3>
<div class="left"><span>11</span></div>
</a>
</div>
<div class="inactive" id="ak12">
<a href="?tab=tür12" <?php if ($tab == "tür12")?>>
<h3 id="hiddenTuer">Tür 12</h3>
<div class="left"><span>12</span></div>
</a>
</div>
<div class="inactive" id="ak13">
<a href="?tab=tür13" <?php if ($tab == "tür13")?>>
<h3 id="hiddenTuer">Tür 13</h3>
<div class="left"><span>13</span></div>
</a>
</div>
<div class="inactive" id="ak14">
<a href="?tab=tür14" <?php if ($tab == "tür14")?>>
<h3 id="hiddenTuer">Tür 14</h3>
<div class="left"><span>14</span></div>
</a>
</div>
<div class="inactive" id="ak15">
<a href="?tab=tür15" <?php if ($tab == "tür15")?>>
<h3 id="hiddenTuer">Tür 15</h3>
<div class="left"><span>15</span></div>
</a>
</div>
<div class="inactive" id="ak16">
<a href="?tab=tür16" <?php if ($tab == "tür16")?>>
<h3 id="hiddenTuer">Tür 16</h3>
<div class="left"><span>16</span></div>
</a>
</div>
<div class="inactive" id="ak17">
<a href="?tab=tür17" <?php if ($tab == "tür17")?>>
<h3 id="hiddenTuer">Tür 17</h3>
<div class="left"><span>17</span></div>
</a>
</div>
<div class="inactive" id="ak18">
<a href="?tab=tür18" <?php if ($tab == "tür18")?>>
<h3 id="hiddenTuer">Tür 18</h3>
<div class="left"><span>18</span></div>
</a>
</div>
<div class="inactive" id="ak19">
<a href="?tab=tür19" <?php if ($tab == "tür19")?>>
<h3 id="hiddenTuer">Tür 19</h3>
<div class="left"><span>19</span></div>
</a>
</div>
<div class="inactive" id="ak20">
<a href="?tab=tür20" <?php if ($tab == "tür20")?>>
<h3 id="hiddenTuer">Tür 20</h3>
<div class="left"><span>20</span></div>
</a>
</div>
<div class="inactive" id="ak21">
<a href="?tab=tür21" <?php if ($tab == "tür21")?>>
<h3 id="hiddenTuer">Tür 21</h3>
<div class="left"><span>21</span></div>
</a>
</div>
<div class="inactive" id="ak22">
<a href="?tab=tür22" <?php if ($tab == "tür22")?>>
<h3 id="hiddenTuer">Tür 22</h3>
<div class="left"><span>22</span></div>
</a>
</div>
<div class="inactive" id="ak23">
<a href="?tab=tür23" <?php if ($tab == "tür23")?>>
<h3 id="hiddenTuer">Tür 23</h3>
<div class="left"><span>23</span></div>
</a>
</div>
<div class="inactive" id="ak24">
<a href="?tab=tür24" <?php if ($tab == "tür24")?>>
<h3 id="hiddenTuer">Tür 24</h3>
<div class="left"><span>24</span></div>
</a>
</div>
</div>

15
tab/tür01.php Normal file
View File

@@ -0,0 +1,15 @@
<div class="tueren">
<h3>Tür 1</h3>
</div>

15
tab/tür02.php Normal file
View File

@@ -0,0 +1,15 @@
<div class="tueren">
<h3>Tür 2</h3>
</div>